/* Full-team battlefield. Existing battle-scenes.js artwork and effect anchors stay intact. */
#encounter-dialog:has(.battle-layout) .dialog-top{padding:8px max(12px,env(safe-area-inset-right)) 0 max(12px,env(safe-area-inset-left))}
#encounter-dialog:has(.battle-layout) .dialog-top>div{display:none}
#encounter-dialog:has(.battle-layout) .dialog-top{justify-content:flex-end}
#encounter-dialog .battle-layout{min-height:0;background:none}
#encounter-dialog .battle-layout .team-arena{flex:1 1 auto;min-height:180px;overflow:visible;background:none}
#encounter-dialog .battle-layout .arena-heading{top:max(10px,env(safe-area-inset-top));left:54px;right:54px;gap:3px}
#encounter-dialog .battle-layout .arena-heading>span{display:none}
#encounter-dialog .battle-layout .arena-heading>strong{font-size:16px;line-height:1.3;padding:6px 16px;background:#12362b;color:#fff9e9;border-radius:16px;text-shadow:none;max-width:100%;overflow-wrap:anywhere}
#encounter-dialog .battle-layout .arena-heading>small{font-size:11px;line-height:1.2;color:#173b2e;background:#fff9e9;padding:3px 8px;border-radius:7px;text-shadow:none}
#encounter-dialog .battle-layout .squad{display:block;top:66px;bottom:10px;width:46%;gap:0}
#encounter-dialog .battle-layout .squad-allies{left:1.5%}
#encounter-dialog .battle-layout .squad-enemies{right:1.5%}
#encounter-dialog .battle-layout .squad-fighter{position:absolute;display:grid;grid-template-rows:minmax(0,1fr) auto auto;align-items:end;gap:3px;width:50%;height:calc((100% - 12px)/2);min-height:0;padding:0 5px;border-radius:12px;grid-column:auto;grid-row:auto;justify-self:auto}
#encounter-dialog .battle-layout .squad-fighter:nth-child(1){left:50%;top:50%;transform:translateY(-50%);z-index:3}
#encounter-dialog .battle-layout .squad-fighter:nth-child(2){left:0;top:0;z-index:1}
#encounter-dialog .battle-layout .squad-fighter:nth-child(3){left:0;bottom:0;z-index:2}
#encounter-dialog .battle-layout .squad-enemies .squad-fighter:nth-child(1){left:0}
#encounter-dialog .battle-layout .squad-enemies .squad-fighter:nth-child(2),
#encounter-dialog .battle-layout .squad-enemies .squad-fighter:nth-child(3){left:50%}
/* Fewer fighters use the free space; bosses keep their larger silhouettes. */
#encounter-dialog .battle-layout .squad[data-count="1"] .squad-fighter{left:8%;top:6%;bottom:auto;width:84%;height:88%;transform:none}
#encounter-dialog .battle-layout .squad[data-count="2"] .squad-fighter{top:12%;bottom:auto;height:76%;transform:none}
#encounter-dialog .battle-layout .squad-art{grid-row:1;min-height:0;height:100%;width:100%;align-self:stretch;overflow:visible}
#encounter-dialog .battle-layout .squad-art>svg,
#encounter-dialog .battle-layout .kin-foe>svg{width:100%;height:100%;max-width:100%;max-height:none}
#encounter-dialog .battle-layout .kin-foe{width:100%;height:100%;min-height:0}
#encounter-dialog .battle-layout .squad-tag{position:absolute;top:0;left:50%;transform:translateX(-50%);z-index:3;height:auto;max-width:100%;padding:3px 6px;border-radius:6px;background:#fff9e9;color:#244b37;font-size:10px;line-height:1.2;letter-spacing:.3px;text-shadow:none;white-space:nowrap}
#encounter-dialog .battle-layout .squad-tag .type-chip{font-size:9px;padding:2px 4px}
#encounter-dialog .battle-layout .foe.chosen .squad-tag{background:#874c30;color:#fff9e9}
#encounter-dialog .battle-layout .squad-info{grid-row:2;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 4px;max-width:230px;width:100%;padding:6px 8px;background:#fff9e9;color:#183c2f;border:0;border-left:4px solid var(--rarity,#709474);border-radius:9px;text-shadow:none;box-shadow:0 3px 10px #142e2533}
#encounter-dialog .battle-layout .squad-info>strong{order:0;grid-column:1/-1;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:2px 5px;font-size:14px;line-height:1.1;color:#183c2f;overflow-wrap:anywhere}
#encounter-dialog .battle-layout .squad-info .lv{font-size:10px;padding:2px 4px;line-height:1.1}
#encounter-dialog .battle-layout .squad-info>.kin-species{order:1;grid-column:1/-1;font-size:10px;line-height:1.1;text-align:center;color:#3b573a;margin:0}
#encounter-dialog .battle-layout .combat-hp{order:2;grid-column:1/-1;width:100%;height:6px;margin:0;background:#d2ddc8}
#encounter-dialog .battle-layout .squad-info .rarity-label{order:3;align-self:center;width:auto;max-width:100%;margin:0;padding:0;background:none;color:var(--rarity-ink,#365341);border:0;font-size:10px;line-height:1.1;text-align:left;white-space:normal}
#encounter-dialog .battle-layout .squad-info>small:not(.kin-species){order:4;grid-column:2;align-self:center;margin:0;font-size:10px;line-height:1.1;white-space:nowrap;color:#3b573a}
#encounter-dialog .battle-layout .chosen.team-friendly .squad-info{outline:2px solid #f1c95f;background:#fff3c6}
#encounter-dialog .battle-layout .chosen.foe .squad-info{outline:2px solid #b26740;background:#ffe8d0}
#encounter-dialog .battle-layout .squad-status{grid-row:3;position:relative;z-index:4;max-width:100%;padding:2px 6px;background:#fff9e9;color:#264831;border-radius:7px;font-size:11px;line-height:1.15;text-shadow:none;overflow-wrap:anywhere}
#encounter-dialog .battle-layout .turn-marker{top:10%;width:17px;height:13px}
#encounter-dialog .battle-layout .teams-versus{font-size:14px;top:53%}
/* Solid surfaces keep move details readable against every area background. */
#encounter-dialog .battle-layout .combat-desk{flex:none;width:calc(100% - 24px);max-width:1320px;margin:0 auto max(8px,env(safe-area-inset-bottom));padding:10px 14px 5px;border:1px solid #d9c593;border-radius:16px;background:#fff9e9;color:#183c2f;box-shadow:0 -5px 20px #102c2540;backdrop-filter:none;-webkit-backdrop-filter:none}
#encounter-dialog .battle-layout .combat-meta{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:10px;margin:0 0 9px;padding:9px 12px;border:0;border-radius:10px;background:#12362b;color:#fff}
#encounter-dialog .battle-layout .acting-label>strong,
#encounter-dialog .battle-layout .target-label>strong{display:block;font-size:17px;line-height:1.2;color:#fff;font-weight:800;overflow-wrap:anywhere}
#encounter-dialog .battle-layout .acting-label>span{display:block;font-size:11px;line-height:1.3;color:#f1f4d9;margin-top:3px}
#encounter-dialog .battle-layout .target-label{display:grid;gap:3px;flex-basis:auto;text-align:right;justify-content:normal;padding:0}
#encounter-dialog .battle-layout .target-label>small{font-size:10px;letter-spacing:.6px;color:#fff0bc}
#encounter-dialog .battle-layout .target-label>span{display:none}
#encounter-dialog .battle-layout .magic-meter{gap:2px}
#encounter-dialog .battle-layout .magic-meter>span{font-size:10px;letter-spacing:.5px;color:#fff0bc}
#encounter-dialog .battle-layout .magic-meter>i{font-size:16px;color:#617d6e;text-shadow:none}
#encounter-dialog .battle-layout .magic-meter>i.charged{color:#ffdc83;text-shadow:none}
#encounter-dialog .battle-layout .battle-moves{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
#encounter-dialog .battle-layout .battle-move{min-width:0;min-height:64px;padding:8px 11px;gap:8px;background:#fff;color:#183c2f;border:1px solid #a6b79a;border-bottom:3px solid #8ea17f;border-radius:10px;box-shadow:none}
#encounter-dialog .battle-layout .battle-move.typed{border-left:4px solid var(--type)}
#encounter-dialog .battle-layout .battle-move>span{min-width:0}
#encounter-dialog .battle-layout .battle-move strong{font-size:17px;line-height:1.2;color:#183c2f;overflow-wrap:anywhere}
#encounter-dialog .battle-layout .battle-move small{font-size:12px;line-height:1.25;color:#36523e;gap:4px;margin-top:4px}
#encounter-dialog .battle-layout .battle-move .type-chip{font-size:9px;color:#253e31;background:#eef3e8;padding:2px 4px}
#encounter-dialog .battle-layout .battle-move:hover:not(:disabled){background:#f5edcd}
#encounter-dialog .battle-layout .battle-move:disabled{opacity:1;background:#e8ebdf;color:#53644e;border-color:#b8c4ac;box-shadow:none}
#encounter-dialog .battle-layout .battle-move:disabled strong,
#encounter-dialog .battle-layout .battle-move:disabled small{color:#53644e}
#encounter-dialog .battle-layout .battle-move.spooky-move{background:#482762;color:#fff9e9;border-color:#ab7e43}
#encounter-dialog .battle-layout .battle-move.spooky-move:hover:not(:disabled){background:#573175}
#encounter-dialog .battle-layout .battle-move.spooky-move strong{color:#fff9e9}
#encounter-dialog .battle-layout .battle-move.spooky-move small,
#encounter-dialog .battle-layout .battle-move.spooky-move .move-form{color:#fff0cd}
#encounter-dialog .battle-layout .battle-move.spooky-move:disabled{background:#62566b;border-color:#8b7d94}
#encounter-dialog .battle-layout .battle-move .move-form{display:block;font-size:10px;line-height:1.2;margin-bottom:2px}
#encounter-dialog .battle-layout .move-symbol{width:24px;flex:none}
#encounter-dialog .battle-layout .battle-move em{font-size:10px;margin-left:5px}
#encounter-dialog .battle-layout .battle-menu{display:flex;align-items:center;gap:12px;margin:5px 0 0;padding:0;border:0;min-height:38px}
#encounter-dialog .battle-layout .elements-book-button{flex:none;min-height:38px;padding:6px 8px;background:#e7edda;color:#234b35;border-color:#b5c7a6;font-size:12px;gap:6px}
#encounter-dialog .battle-layout .combat-message{flex:1;min-width:0;min-height:0;font-size:12px;line-height:1.3;text-align:right;color:#244b35;font-weight:600}
#encounter-dialog .battle-layout .combat-tip{display:none}
#encounter-dialog .battle-layout .combat-ending p{color:#36523e}
#encounter-dialog .battle-layout button:focus-visible{outline:3px solid #1764ad;outline-offset:3px}
/* Portrait phones retain every fighter, in three rows per team. */
@media(max-width:620px){
 #encounter-dialog .battle-layout .team-arena{min-height:230px}
 #encounter-dialog .battle-layout .arena-heading>strong{font-size:14px;padding:5px 10px}
 #encounter-dialog .battle-layout .arena-heading>small{font-size:10px}
 #encounter-dialog .battle-layout .squad{top:60px;bottom:8px;width:46%}
 #encounter-dialog .battle-layout .squad .squad-fighter{left:0;right:auto;top:auto;bottom:auto;width:100%;height:calc((100% - 12px)/3);padding:0 3px;gap:2px;transform:none}
 #encounter-dialog .battle-layout .squad .squad-fighter:nth-child(1){top:0}
 #encounter-dialog .battle-layout .squad .squad-fighter:nth-child(2){top:calc((100% + 6px)/3)}
 #encounter-dialog .battle-layout .squad .squad-fighter:nth-child(3){bottom:0}
 #encounter-dialog .battle-layout .squad[data-count="2"] .squad-fighter{height:calc((100% - 8px)/2)}
 #encounter-dialog .battle-layout .squad[data-count="2"] .squad-fighter:nth-child(2){top:auto;bottom:0}
 #encounter-dialog .battle-layout .squad[data-count="1"] .squad-fighter{height:92%;top:4%}
 #encounter-dialog .battle-layout .squad-info{padding:4px 5px;gap:2px 3px;border-left-width:3px}
 #encounter-dialog .battle-layout .squad-info>strong{font-size:12px}
 #encounter-dialog .battle-layout .squad-status{font-size:10px;padding:1px 4px}
 #encounter-dialog .battle-layout .squad-tag{font-size:9px;padding:2px 4px}
 #encounter-dialog .battle-layout .combat-desk{width:calc(100% - 12px);padding:7px 8px 4px;border-radius:12px;margin-bottom:max(5px,env(safe-area-inset-bottom))}
 #encounter-dialog .battle-layout .combat-meta{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:5px 8px;padding:7px 9px;margin-bottom:6px}
 #encounter-dialog .battle-layout .acting-label>strong,#encounter-dialog .battle-layout .target-label>strong{font-size:14px}
 #encounter-dialog .battle-layout .acting-label>span{font-size:10px}
 #encounter-dialog .battle-layout .target-label{grid-column:2;grid-row:1}
 #encounter-dialog .battle-layout .magic-meter{grid-column:1/-1;justify-content:center}
 #encounter-dialog .battle-layout .magic-meter>i{font-size:13px}
 #encounter-dialog .battle-layout .battle-moves{gap:5px}
 #encounter-dialog .battle-layout .battle-move{min-height:60px;padding:7px 5px;gap:4px}
 #encounter-dialog .battle-layout .battle-move strong{font-size:13px}
 #encounter-dialog .battle-layout .battle-move small{font-size:11px;gap:3px;margin-top:3px}
 #encounter-dialog .battle-layout .move-symbol{width:17px}
 #encounter-dialog .battle-layout .battle-menu{gap:7px;min-height:34px;margin-top:4px}
 #encounter-dialog .battle-layout .elements-book-button{font-size:11px;min-height:34px;padding:4px 5px}
 #encounter-dialog .battle-layout .combat-message{font-size:11px}
}
/* Extremely short windows keep moves reachable without covering the field. */
@media(max-height:600px){
 #encounter-dialog .battle-layout .combat-desk{max-height:48dvh;overflow-y:auto;overscroll-behavior:contain}
 #encounter-dialog .battle-layout .combat-meta{padding:5px 9px;gap:6px}
 #encounter-dialog .battle-layout .acting-label>span{display:none}
 #encounter-dialog .battle-layout .acting-label>strong,#encounter-dialog .battle-layout .target-label>strong{font-size:14px}
 #encounter-dialog .battle-layout .battle-move{min-height:50px;padding:5px 8px}
 #encounter-dialog .battle-layout .battle-move strong{font-size:14px}
 #encounter-dialog .battle-layout .battle-move small{font-size:11px}
}
@media(max-height:500px) and (min-width:621px){
 #encounter-dialog .battle-layout .team-arena{min-height:150px}
 #encounter-dialog .battle-layout .squad{top:52px;bottom:6px}
 #encounter-dialog .battle-layout .squad[data-count="3"] .squad-fighter{top:0;bottom:auto;left:0;width:33.333%;height:100%;transform:none}
 #encounter-dialog .battle-layout .squad[data-count="3"] .squad-fighter:nth-child(2){left:33.333%}
 #encounter-dialog .battle-layout .squad[data-count="3"] .squad-fighter:nth-child(3){left:66.666%}
 #encounter-dialog .battle-layout .squad-info>strong{font-size:11px}
 #encounter-dialog .battle-layout .squad-status{font-size:10px}
}
