/* The shared terrain is the stage. Controls stay in a stationary decision rail. */
.battle-overlay{background:rgba(3,9,12,.54);backdrop-filter:blur(2px);padding:18px;z-index:65;display:flex;align-items:center;justify-content:center}
.combat-stage{width:min(1100px,96vw);height:min(840px,calc(100dvh - 36px));display:flex;flex-direction:column;min-height:0;overflow:hidden;border:1px solid #bda575;border-radius:12px;background:#101d22;color:#f7f3e9;box-shadow:0 30px 100px #000b;isolation:isolate}
.stage-header{flex:none;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 20px;background:#102026;border-bottom:1px solid #a28d5755}
.stage-header h2{font-size:clamp(22px,3vw,32px);line-height:1.1;margin:4px 0;color:#f4d79c;font-family:Georgia,serif;letter-spacing:.01em}
.stage-header p{font-size:14px;line-height:1.35;margin:5px 0 0;color:#d0dfdf;max-width:640px}
.stage-settings{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;max-width:280px;flex:none}.stage-settings>div{display:flex;gap:3px}
.stage-settings button{font-size:12px;padding:7px 9px;min-height:36px;border:1px solid #667b80;border-radius:5px;background:#132a31;color:#dce9e9}.stage-settings button[aria-pressed=true]{color:#17231f;background:#ebd097;border-color:#ebd097}
.stage-queue{display:flex;gap:7px;padding:8px 14px;overflow-x:auto;flex:none;background:#081319;scrollbar-width:thin}
.stage-queue-item{display:flex;align-items:center;gap:7px;min-width:150px;max-width:250px;flex:0 0 auto;border:1px solid #3d5157;border-radius:5px;padding:4px 7px;opacity:.65}
.stage-queue-item.current{border-color:#e9cf8c;background:#263934;opacity:1}.stage-queue-item.resolved:not(.current){opacity:.55}.stage-queue-item.cancelled{border-style:dashed}
.stage-queue-item img{width:32px;height:38px;object-fit:cover;border-radius:2px}.stage-queue-item b,.stage-queue-item small{display:block;font-size:12px;max-width:180px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stage-queue-item small{color:#bdd0d1;margin-top:3px}
.stage-landscape{position:relative;min-height:190px;flex:1;background-image:linear-gradient(180deg,#09111736,#09111708 45%,#091117ba),var(--location-art);background-size:cover;background-position:center 55%;display:flex;align-items:center;justify-content:center;padding:12px 22px}
.stage-duel{display:grid;grid-template-columns:minmax(110px,210px) minmax(85px,150px) minmax(110px,210px);gap:clamp(14px,5vw,70px);align-items:center;justify-content:center;width:100%;max-width:790px}
.stage-fighter{position:relative;min-width:0;display:flex;flex-direction:column;align-items:stretch;text-align:center;filter:drop-shadow(0 10px 14px #0009);z-index:2}
.fighter-role{font-size:12px;letter-spacing:.15em;color:#fff7e6;background:#111c25df;border:1px solid #99aaa055;padding:5px 8px;border-radius:4px 4px 0 0}
.fighter-inspect{padding:0;border:1px solid #e3c88e;border-radius:0;background:#122328;overflow:hidden;width:100%;color:#fff3d7;min-height:0;text-align:center}
.faction-Ithrak .fighter-inspect{border-color:#c17481}.fighter-inspect img{width:100%;height:clamp(75px,19vh,205px);display:block;object-fit:cover;object-position:center 30%}.fighter-inspect strong{font:600 clamp(14px,1.8vw,18px)/1.2 Georgia,serif;display:block;padding:7px 5px;min-height:2.5em;align-content:center}
.fighter-values{display:flex;justify-content:space-evenly;background:#0c1a20ed;padding:5px 0;border:1px solid #798f9255;border-top:0}.fighter-values>span{display:flex;align-items:center;gap:6px}.fighter-values small{font-size:12px;color:#c8d5d7}.fighter-values b{font-size:27px;color:#fff2d8}.fighter-values b.buff{color:#86eab4}.fighter-values b.nerf{color:#ff9696}
.fighter-condition{font-size:12px;padding:4px 2px;background:#0c1a20ed;min-height:24px;color:#d7e0df}.fallen .fighter-condition{color:#ffb7b7}
.warden-health-value{background:#22151dee;padding:6px;border:1px solid #bc7475}.warden-health-value small{font-size:12px;display:block}.warden-health-value b{font-size:29px;color:#ffc2ac}
.stage-impact{display:flex;flex-direction:column;align-items:center;gap:7px;text-align:center;color:#fff4da;text-shadow:0 2px 6px #000,0 0 20px #000;background:#101a207a;border-top:1px solid #c8b08088;border-bottom:1px solid #c8b08088;padding:12px 4px}
.stage-impact>span{font:700 clamp(12px,1.6vw,18px)/1.2 Georgia,serif;letter-spacing:.05em}.stage-impact small{font-size:12px;line-height:1.3}[data-combat-step="resolution"] .stage-impact>span{font-size:28px}
.stage-breakdown{position:relative;background:#0c1a20ed;text-align:left;font-size:12px}.stage-breakdown summary{padding:5px 8px;cursor:pointer}.stage-breakdown[open]{z-index:5}.stage-breakdown>div{position:absolute;left:0;right:0;top:100%;padding:8px;background:#0b1b22;border:1px solid #859b99;box-shadow:0 5px 12px #0009}.stage-breakdown>div+div{position:relative;top:auto}.stage-breakdown span{display:flex;gap:8px;justify-content:space-between;padding:3px 0}.stage-breakdown[open]>div{position:static}
.stage-decision{flex:none;max-height:40%;overflow:auto;overscroll-behavior:contain;padding:12px 18px;background:#101f25;border-top:1px solid #b29c6655;text-align:center}
.stage-decision>.primary{min-height:44px;min-width:210px;margin:7px auto 0;padding:10px 20px;font-size:16px;background:#e7c783;color:#142323;border:1px solid #ffe0a0;border-radius:5px}
.stage-control-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left;font-size:14px;margin-bottom:8px}.stage-control-heading span{color:#bbcfd2}.stage-interceptions{border:1px solid #9eacac;border-radius:20px;padding:5px 10px;white-space:nowrap;color:#f3d89f!important}
.stage-interceptors{display:flex;justify-content:center;gap:7px;flex-wrap:wrap}.stage-interceptors button{display:flex;align-items:center;gap:8px;text-align:left;padding:5px 10px 5px 5px;min-height:52px;border:1px solid #6f9297;background:#192f37;border-radius:5px;color:#edf4ec}.stage-interceptors img{object-fit:cover;border-radius:3px}.stage-interceptors strong,.stage-interceptors small{display:block}.stage-interceptors strong{font-size:14px}.stage-interceptors small{font-size:12px;margin-top:3px;color:#b9cdcf}
.stage-outcome{margin:0 auto 10px;display:flex;flex-direction:column;align-items:center;gap:3px;max-width:740px}.stage-outcome small{font-size:12px;letter-spacing:.1em;color:#bfcfc9}.stage-outcome strong{font-size:16px;color:#f9dfa7}.stage-outcome span{font-size:12px;color:#b7caca}.stage-outcome.confirmed strong{font:600 22px/1.3 Georgia,serif}.stage-outcome .buff{color:#90e4b2}.stage-outcome .nerf{color:#ffaaaa}
.stage-status{font-size:16px;margin:6px 0 12px;color:#e1ebde}
.stage-reactions{display:flex;gap:10px;overflow:auto;align-items:flex-start;max-height:240px;padding:8px 5px;justify-content:flex-start}.stage-reactions:empty{display:none}.stage-reactions>.card{width:160px;min-width:160px;flex:0 0 160px;text-align:left}.stage-reactions>.card:first-child{margin-left:auto}.stage-reactions>.card:last-child{margin-right:auto}.stage-reactions .card-interactions{position:static!important;transform:none!important;max-width:none!important;max-height:none!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;box-shadow:none!important;display:block!important}.stage-reactions>.card p{font-size:12px;line-height:1.3}.stage-reactions>.card .sample-card-art{height:56px}.stage-reactions button{min-height:44px}
.stage-played{margin:0 auto 9px;border:1px solid #64808a;border-radius:5px;text-align:left;max-width:800px;background:#132a33}.stage-played summary{cursor:pointer;padding:6px 10px;font-size:13px;color:#edcf92}.stage-played>div{display:flex;overflow:auto;gap:8px;padding:0 9px 8px}.stage-reaction-reveal{display:flex;gap:8px;align-items:center;flex:0 0 min(460px,95%);font-size:14px}.stage-reaction-reveal.latest{border-left:2px solid #e9cb85;padding-left:7px}.stage-reaction-reveal img{object-fit:cover;border-radius:3px}.stage-reaction-reveal strong{display:block;color:#ffe5aa}.stage-reaction-reveal small{font-size:12px;color:#b9ced1}.stage-reaction-reveal p{font-size:13px;line-height:1.35;margin:3px 0}
.stage-batch-summary{font-size:13px;text-align:center;flex:none;padding:6px;background:#0b171b;color:#c8d9d0}
.combat-afterglow{position:absolute;top:75px;left:50%;transform:translateX(-50%);z-index:20;width:min(480px,90vw);padding:7px 12px;border:1px solid #a68d57;border-radius:5px;background:#152a2aee;text-align:center;font-size:13px;color:#f1dbae}.combat-afterglow summary{cursor:pointer}.combat-afterglow p{font-size:13px;text-align:left}.combat-afterglow .combat-history-reaction{display:block;color:#c9dfe0;font-size:12px}.mat-location{background-size:cover!important;background-position:center!important;text-shadow:0 2px 5px #000}
.combat-mode-controls{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin:10px 0}.combat-mode-controls button{min-height:44px}.combat-mode-controls button[aria-pressed=true]{background:#e7c783;color:#15231f}
.attack-order-card{flex:0 0 185px}.attack-order-actions{display:flex;gap:4px}.attack-order-actions button{font-size:12px;min-height:32px;padding:4px 6px;background:#19332e;border:1px solid #68877a;border-radius:3px;color:#d5e9dc;flex:1}.stage-ability{display:grid;gap:8px;min-width:160px;padding:10px;border:1px solid #739995;border-radius:5px;background:#19342f;font-size:14px}.stage-ability button{min-height:44px}
.battle-overlay:has([data-combat-step="choice"]) .stage-decision{max-height:55%}
@media(max-width:700px){.battle-overlay{padding:7px}.combat-stage{width:100%;height:calc(100dvh - 14px);border-radius:8px}.stage-header{padding:10px;gap:8px;align-items:flex-start}.stage-header h2{font-size:22px}.stage-settings{max-width:145px;gap:4px}.stage-settings button{font-size:12px;padding:5px 7px;min-height:38px}.stage-header .eyebrow{font-size:12px}.stage-header p{font-size:13px}.stage-duel{grid-template-columns:minmax(90px,155px) 66px minmax(90px,155px);gap:8px}.stage-landscape{padding:8px;min-height:180px;background-position:center}.fighter-inspect img{height:clamp(65px,16vh,145px)}.fighter-values>span{flex-direction:column;gap:0}.fighter-values b{font-size:24px}.fighter-inspect strong{font-size:14px}.stage-impact>span{font-size:12px}.stage-impact small{font-size:12px}.stage-decision{padding:10px;max-height:46%}.stage-control-heading{flex-wrap:wrap;justify-content:center;text-align:center}.stage-interceptors{flex-wrap:nowrap;overflow:auto;justify-content:flex-start}.stage-interceptors button{flex:0 0 210px}.stage-interceptors button:first-child{margin-left:auto}.stage-interceptors button:last-child{margin-right:auto}.stage-queue{padding:6px}.stage-queue-item{min-width:120px}.stage-queue-item b{max-width:140px}.stage-reaction-reveal{flex-basis:95%}.stage-outcome.confirmed strong{font-size:19px}.stage-breakdown{font-size:12px}}
@media(max-height:570px){.battle-overlay{padding:4px}.combat-stage{height:calc(100dvh - 8px);display:grid;grid-template-columns:1.15fr 1fr;grid-template-rows:auto auto minmax(0,1fr)}.stage-header{grid-column:1/-1;padding:7px 12px}.stage-header h2{font-size:20px}.stage-header p{font-size:12px}.stage-queue{grid-column:1/-1}.stage-landscape{min-height:0;grid-column:1;grid-row:3}.stage-decision{grid-column:2;grid-row:3;max-height:none;min-height:0;border-left:1px solid #72877b}.fighter-inspect img{height:55px}.fighter-values b{font-size:20px}.fighter-condition{font-size:12px}.stage-duel{gap:6px;grid-template-columns:minmax(80px,140px) 62px minmax(80px,140px)}.stage-batch-summary{display:none}.stage-settings{max-width:340px}.stage-interceptors{flex-wrap:wrap}.stage-header .eyebrow{font-size:12px}}
@media(prefers-reduced-motion:reduce){.combat-stage *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.stage-landscape{overflow:auto;overscroll-behavior:contain}
.stage-duel{margin:auto}
@media(max-width:700px) and (min-height:571px){.fighter-inspect img{height:clamp(65px,12vh,125px)}}
/* Every sequence keeps the same full-width frame; only inner rails scroll. */
.combat-stage{min-width:0;box-sizing:border-box}
.combat-stage>header,.combat-stage>nav,.combat-stage>footer,.combat-stage>.stage-landscape,.combat-stage>.stage-batch-summary{min-width:0;width:100%;max-width:100%;box-sizing:border-box}
.stage-header>div:first-child,.stage-reaction-reveal>span{min-width:0;overflow-wrap:anywhere}
.stage-decision>*{max-width:100%;box-sizing:border-box}
.stage-played>div,.stage-reactions{min-width:0}
.battle-overlay{padding-bottom:calc(68px + env(safe-area-inset-bottom,0px))}
.battle-overlay .combat-stage{height:min(840px,calc(100dvh - 86px - env(safe-area-inset-bottom,0px)))}
body:has(.battle-overlay) .toast{bottom:calc(8px + env(safe-area-inset-bottom,0px));z-index:115;max-width:min(680px,calc(100vw - 24px));max-height:52px;overflow:hidden;padding:7px 12px;font-size:14px;line-height:18px;pointer-events:none}
@media(max-height:570px){.combat-stage{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}}
@media(max-width:700px){.stage-duel{grid-template-columns:minmax(0,155px) 66px minmax(0,155px)}[data-combat-step="resolution"] .stage-impact>span{font-size:20px}}
