/* Arena is navigation over the existing game background, not a framed modal. */
#arena-dialog{box-sizing:border-box;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;overflow:hidden;border:0;border-image:none;border-radius:0;background:var(--arena-image) center / cover #f4f0e6;box-shadow:none;color:var(--kit-ink,#292724)}
#arena-dialog::backdrop{background:transparent;backdrop-filter:none}
#arena-dialog[open]{display:block}
.arena-panel{box-sizing:border-box;display:flex;flex-direction:column;width:min(640px,100%);height:100%;margin:auto;background:linear-gradient(180deg,#f4f0e6ed,#f4f0e6c7 36%,#f4f0e6e8);overflow:hidden}
.arena-header{position:relative;flex:0 0 64px;height:64px;display:grid;grid-template-columns:64px minmax(0,1fr) 64px;align-items:center;border-bottom:1px solid #aa854544}
.arena-header .sheet-title{grid-column:2;text-align:center;margin:0;font-size:21px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.arena-panel-back,.arena-info-button{position:absolute;top:10px;width:44px;height:44px;min-height:44px;padding:0;display:grid;place-items:center;color:var(--kit-quiet-ink,#706b63)}
.arena-panel-back{left:10px}.arena-info-button{right:10px;font-family:var(--font-ui);font-size:23px;font-weight:700}
.arena-panel-back svg,.arena-info-button svg,.arena-header .dialog-close svg{width:24px;height:24px;fill:currentColor}
.arena-scroll,.arena-info-scroll{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;padding:12px 16px 18px;scrollbar-width:thin;scrollbar-color:#baaa7655 transparent}
.arena-footer{flex:0 0 auto;display:flex;gap:8px;padding:12px 16px max(14px,env(safe-area-inset-bottom));border-top:1px solid #aa854533;background:#f4f0e6ef;box-sizing:border-box}
.arena-footer:empty{display:none}.arena-footer>button{min-width:0;min-height:48px;flex:1;white-space:nowrap}.arena-footer>.primary-action{flex:2}
/* Keep the loadout and remaining cards together above the changing choices. */
.arena-deck-overview{flex:0 0 auto;min-width:0;border-bottom:1px solid #aa854533;background:linear-gradient(110deg,#e6ddca12,transparent 70%)}
.arena-summary-host{flex:none;min-width:0}.arena-summary{padding:6px 16px;display:grid;grid-template-columns:68px 100px minmax(0,1fr);gap:10px;align-items:center;min-width:0}
.arena-hero{grid-column:1;grid-row:1;min-width:0}.arena-hero .game-card{width:68px;max-width:100%}.arena-equipment{grid-column:2;grid-row:1;display:flex;gap:4px;align-items:center;justify-content:flex-start;min-width:0}.arena-equipment .game-card{width:48px;flex:0 0 48px;max-width:100%}
.arena-progress{display:grid;grid-template-columns:minmax(0,1fr);gap:5px;min-width:0;width:100%;max-width:180px;justify-self:end;align-items:center}
.arena-record{display:flex;align-items:center;gap:6px;min-width:0;margin:0;font-variant-numeric:tabular-nums}
.arena-wins,.arena-losses{display:flex;flex:1;align-items:center;justify-content:center;gap:5px;box-sizing:border-box;min-width:0;padding:5px 6px;border:1px solid;border-radius:6px;line-height:1.25;white-space:nowrap}
.arena-wins{color:#3a7441;border-color:#86b58a42;background:#5a926b14}.arena-losses{color:#7c3932;border-color:#b57a7642;background:#945d5e14}
.arena-record svg{display:block;width:16px;height:16px;flex:0 0 16px;fill:currentColor}.arena-record-value{font-family:var(--font-ui);font-size:14px;font-weight:700}
.arena-budget-label{display:block;margin:2px 0 0;color:var(--kit-ink,#292724);font-size:11px;line-height:1.3;letter-spacing:.02em}.arena-deck-count{font-size:12px;color:var(--kit-quiet-ink,#706b63)}
.arena-budget{grid-column:1/-1;width:100%;box-sizing:border-box;position:relative;isolation:isolate;height:25px;border:1px solid #aa8545;border-radius:7px;background:#f4f0e6;overflow:hidden}
.arena-budget-fill{position:absolute;inset:0 auto 0 0;width:var(--arena-cost-ratio,0%);background:linear-gradient(90deg,#b38a43,#d8be80);z-index:-1;transition:width 150ms ease}
.arena-budget-value{font-family:var(--font-stats);display:block;text-align:center;line-height:23px;font-size:13px;font-weight:700;color:var(--kit-ink,#292724);text-shadow:none}
.arena-budget.is-over{border-color:#dc7773}.arena-budget.is-over .arena-budget-fill{background:linear-gradient(90deg,#743d3c,#bc6b60)}
.arena-active-augments{grid-column:1/-1;display:flex;gap:5px;min-width:0;overflow:auto}.arena-augment-chip{display:flex;align-items:center;gap:6px;padding:5px 7px;min-height:44px;flex:1;min-width:44px;overflow:hidden;border:1px solid var(--augment-color,#aa8545);border-radius:5px;color:var(--kit-quiet-ink,#706b63);background:#f4f0e6;font-size:11px;text-align:left}
.arena-augment-chip .arena-augment-art{width:28px;height:28px;flex:none;border-radius:4px}.arena-augment-chip>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Every card offer is one fixed three-choice board. Cards and gaps shrink together. */
.arena-offers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(4px,1.4vw,10px);align-items:flex-start;min-width:0;overflow:visible;touch-action:pan-y;padding:14px 0 20px;margin:0}
.arena-offer{position:relative;isolation:isolate;box-sizing:border-box;width:100%;min-width:0;padding:clamp(2px,.6vw,4px);border:1px solid transparent;border-radius:12px;transition:background 120ms,border-color 120ms;transform-origin:50% 55%}
.arena-offer.is-selected{border-color:#aa8545;background:#e7d5ad14;box-shadow:inset 0 0 20px #b08a490a,0 0 14px #b08a4909}
.arena-card-choice{display:block;width:100%;min-width:0;margin:0;padding:0;border:0;border-radius:9px;background:none;color:inherit;box-shadow:none;touch-action:pan-y;cursor:pointer}
.arena-card-choice:disabled,.arena-augment-option:disabled{opacity:1;filter:none;cursor:default}
.arena-offer-cards{display:flex;align-items:center;justify-content:center;gap:clamp(2px,1vw,8px);min-width:0}.arena-offer-card-frame{min-width:0;flex:1}.arena-offer-card-frame .game-card{display:block;width:100%;max-width:100%;pointer-events:none}
.arena-offers-equipment .arena-offer-card-frame{min-width:0;max-width:none}
.arena-empty-loadout{width:100%;aspect-ratio:2/3;display:grid;place-items:center;box-sizing:border-box;padding:clamp(4px,2vw,12px);border:1px dashed #aa85456d;background:#fffdf704;color:var(--kit-ink,#292724);border-radius:7px;font-size:clamp(9px,3vw,15px)}
.arena-offer-inspect{position:absolute;z-index:2;right:-1px;top:-1px;display:grid;place-items:center;width:44px;height:44px;min-height:44px;padding:12px;border:0;border-radius:50%;background:transparent;color:var(--kit-ink,#292724);box-shadow:none}
.arena-offer-inspect:before{content:"";position:absolute;inset:5px;z-index:-1;border:1px solid #aa854577;border-radius:50%;background:#f4f0e6ec;box-shadow:0 2px 8px #17141036;pointer-events:none}
.arena-offer-inspect svg{display:block;width:20px;height:20px;fill:currentColor;pointer-events:none}
.arena-offer.is-acquiring{z-index:5;box-shadow:0 0 25px var(--offer-color,#b08a49)}
.arena-offer.is-burning:after{content:"";position:absolute;pointer-events:none;inset:0;border:2px solid #aa8545;border-radius:10px;box-shadow:inset 0 -16px 24px #b08a4929,0 0 14px #b08a4929;mix-blend-mode:screen}
.arena-offer.is-arriving{box-shadow:0 0 20px color-mix(in srgb,var(--offer-color,#b08a49) 32%,transparent)}
/* Augments remain three stacked, distinct choices at every phone width. */
.arena-offers-augment{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin:0;padding:8px 0 16px;overflow:visible;scroll-snap-type:none}
.arena-offers-augment .arena-offer{padding:0;border:0;border-radius:0;min-width:0}
.arena-augment-option{box-sizing:border-box;position:relative;isolation:isolate;display:grid;grid-template-columns:76px minmax(0,1fr);gap:13px;align-items:center;text-align:left;width:100%;min-height:150px;padding:8px 18px 8px 0;border:18px solid transparent;border-image:var(--augment-frame) 25.5% fill / 18px / 0 stretch;background:transparent;border-radius:0;box-shadow:0 7px 16px #17141066;transition:transform 140ms ease,box-shadow 140ms ease;touch-action:pan-y;color:#f4efe3}
.arena-augment-visual{display:block;width:76px;aspect-ratio:1;overflow:hidden;box-shadow:0 0 0 1px #b08a4914,0 4px 13px #17141030;border-radius:7px}
.arena-augment-art{display:block;object-fit:cover;width:100%;height:100%;pointer-events:none;user-select:none}
.arena-augment-copy{display:flex;align-items:flex-start;flex-direction:column;gap:6px;min-width:0;padding:3px 0}
.arena-augment-tier{display:inline-block;padding:2px 7px;border:1px solid color-mix(in srgb,var(--augment-color) 42%,transparent);border-radius:3px;color:var(--augment-color);background:#171614cc;font-size:11px;line-height:1.2;letter-spacing:.04em;white-space:nowrap}
.arena-augment-option .arena-augment-name{font-family:var(--font-ui);font-size:15px;line-height:1.35;color:#f4efe3;margin:0}
.arena-augment-description{font-family:var(--font-ui);font-size:13px;line-height:1.55;color:#f4efe3;text-align:left;word-break:keep-all;overflow-wrap:anywhere}
.arena-augment-selected{position:absolute;left:57px;bottom:2px;display:grid;place-items:center;width:23px;height:23px;background:#e6ddca;color:var(--kit-ink,#292724);border:1px solid #aa8545;border-radius:50%;font-size:15px;font-weight:900;opacity:0;transform:scale(.65);transition:opacity 130ms,transform 130ms}
.arena-offers-augment .arena-offer.is-selected{background:none;box-shadow:none}.arena-offer.is-selected .arena-augment-option{box-shadow:0 0 0 1px var(--augment-color),0 0 19px color-mix(in srgb,var(--augment-color) 23%,transparent),0 9px 17px #17141088}
.arena-offer.is-selected .arena-augment-selected{opacity:1;transform:scale(1)}
/* One compact horizontal deck row; card movement belongs to the editor sheet. */
.arena-deck-tray{display:grid;grid-template-columns:62px minmax(0,1fr);gap:8px;flex:none;min-width:0;background:#f4f0e666;border-top:1px solid #aa854524;padding:4px 12px 6px;box-sizing:border-box}
.arena-deck-tray[hidden],.arena-summary-host[hidden],.arena-status[hidden],.arena-deck-overview[hidden]{display:none}
.arena-deck-heading{display:flex;flex-direction:column;align-items:stretch;justify-content:center;min-width:0;min-height:70px;gap:1px}
.arena-deck-title{margin:0;color:var(--kit-ink,#292724);font-size:13px;font-weight:650;line-height:1.35;text-align:center;white-space:nowrap}
.arena-deck-edit{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;height:44px;min-height:44px;padding:5px 6px;border:1px solid #aa85454d;border-radius:6px;background:#fffdf709;color:var(--kit-quiet-ink,#706b63);font-family:var(--font-ui);font-size:12px;line-height:1.2;white-space:nowrap}
.arena-deck-list{display:flex;align-items:center;gap:8px;min-width:0;height:70px;box-sizing:border-box;padding:2px 3px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;touch-action:pan-x;scrollbar-width:thin;scrollbar-color:#baaa7655 transparent}
.arena-grid-card{min-width:0;display:flex;flex-direction:column;gap:5px}.arena-grid-card .game-card{width:100%;touch-action:pan-y}
.arena-deck-tray .arena-grid-card{flex:0 0 44px;width:44px}.arena-deck-tray .game-card{touch-action:pan-x}
.arena-deck-empty{min-height:58px;margin:0;display:flex;align-items:center;justify-content:center;width:100%;color:var(--kit-quiet-ink,#706b63);font-size:12px}
.arena-editor-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px 8px;min-width:0;padding:4px 2px 10px;align-items:start}
.arena-deck-editor .arena-grid-card{position:relative;box-sizing:border-box;padding:2px;min-width:0}
.arena-deck-editor .is-excluded .game-card{opacity:.42}
.arena-card-move{display:flex;align-items:center;justify-content:center;box-sizing:border-box;height:44px;min-height:44px;width:100%;padding:0;border-radius:6px;border:1px solid #aa85455c;background:#e6ddca24;color:var(--kit-quiet-ink,#706b63);font-family:var(--font-ui);font-size:24px;line-height:1;touch-action:manipulation}
.arena-deck-editor .is-excluded .arena-card-move{color:var(--kit-quiet-ink,#706b63);border-color:#aa854566;background:#e6ddca24}
.arena-validation,.arena-status{font-size:13px;line-height:1.5;color:var(--kit-quiet-ink,#706b63);margin:8px 0}.arena-status:empty{display:none}
.arena-empty{text-align:center;color:var(--kit-quiet-ink,#706b63);padding:24px 0;font-size:14px}
.arena-info-dialog .arena-menu-action{display:flex;align-items:center;gap:12px;width:100%;box-sizing:border-box;min-height:48px;padding:11px 12px;border:0;border-bottom:1px solid #aa854529;border-radius:0;background:transparent;color:var(--kit-quiet-ink,#706b63);font-family:var(--font-ui);font-size:14px;line-height:1.4;text-align:left}
.arena-info-dialog .arena-menu-action svg{display:block;width:20px;height:20px;flex:0 0 20px;fill:currentColor}
.arena-info-dialog .arena-retire{min-height:44px;padding:10px 14px;border:1px solid #aa854557;border-image:none;border-radius:6px;background:#e6ddca24;color:var(--kit-quiet-ink,#706b63);font-family:var(--font-ui);font-size:13px;line-height:1.4;box-shadow:none}
.arena-info-dialog .arena-menu-action.arena-retire{margin-top:10px}
.arena-welcome{text-align:center;padding:28px 8px}.arena-welcome h3{font-size:28px;margin:10px 0;color:var(--kit-ink,#292724)}.arena-welcome p{font-size:14px;color:var(--kit-quiet-ink,#706b63)}
.arena-welcome-emblem,.arena-chest-emblem{width:94px;margin:10px auto;color:var(--kit-quiet-ink,#706b63);filter:drop-shadow(0 5px 10px #b08a490e)}.arena-welcome-emblem svg,.arena-chest-emblem svg{display:block;width:100%;fill:currentColor}
.arena-chest-name{text-align:center;font-size:24px;margin:4px 0 24px}.arena-reward-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:300px;margin:auto;animation:arena-rewards 180ms ease-out}
@keyframes arena-rewards{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}
.arena-reward{display:flex;align-items:center;flex-direction:column;gap:8px;background:#f4f0e670;border:1px solid #aa854566;border-radius:10px;padding:14px}.arena-reward-icon{width:56px;height:56px}.arena-reward-icon img,.arena-reward-icon svg{width:100%;height:100%;object-fit:contain}.arena-reward strong{font-size:22px}
.arena-ranking-row{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:10px;align-items:center;min-height:52px;border-bottom:1px solid #aa85452b}.arena-rank{color:var(--kit-quiet-ink,#706b63);text-align:center}.arena-ranking-row>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
/* Nested inspection and confirmation remain dismissible modal sheets. */
.arena-info-dialog{box-sizing:border-box;width:min(460px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:0;overflow:hidden;color:var(--kit-ink,#292724);background:linear-gradient(145deg,#f4f0e6,#f4f0e6);border:1px solid #aa8545;border-radius:12px;box-shadow:0 18px 70px #1714103d}.arena-info-dialog[open]{display:flex;flex-direction:column}
.arena-header .dialog-close{position:absolute;right:10px;top:10px;width:44px;height:44px;min-height:44px;display:grid;place-items:center}
.arena-info-scroll{line-height:1.65}.arena-info-scroll p{margin:0 0 14px}.arena-info-scroll p:last-child{margin-bottom:0}
.arena-detail-fixed{flex:none;padding:12px 20px;text-align:center}.arena-detail-fixed .game-card{width:min(240px,calc((100dvh - 260px) / 1.5));margin:auto}.arena-detail-meta{font-size:12px;margin:12px 0 0;color:var(--kit-quiet-ink,#706b63)}.arena-stat-effect{color:#327c32}
.arena-augment-detail{display:flex;align-items:center;flex-direction:column;gap:15px;padding:12px;border:27px solid transparent;border-image:var(--augment-frame) 25.5% fill / 27px / 0 stretch}.arena-augment-detail .arena-augment-art{width:min(210px,100%);height:auto;aspect-ratio:1;border-radius:8px}.arena-augment-detail .arena-augment-description{text-align:center;font-size:15px;margin:0}
.arena-augment-rule{font-family:var(--font-ui);font-size:12px;color:var(--kit-quiet-ink,#706b63);line-height:1.6;margin:16px 5px 0}
@media(min-width:600px){.arena-augment-option{grid-template-columns:90px minmax(0,1fr);min-height:158px;gap:20px}.arena-augment-visual{width:90px}.arena-augment-option .arena-augment-name{font-size:18px}.arena-augment-description{font-size:14px}}
@media(max-width:360px){
 .arena-header{height:58px;flex-basis:58px}.arena-panel-back,.arena-info-button{top:7px}.arena-header .sheet-title{font-size:19px}
 .arena-summary{grid-template-columns:60px 88px minmax(0,1fr);gap:8px;padding:6px 12px}.arena-hero .game-card{width:60px}.arena-equipment .game-card{width:42px;flex-basis:42px}
 .arena-record{gap:4px}.arena-wins,.arena-losses{gap:4px;padding:5px 4px}.arena-record svg{width:14px;height:14px;flex-basis:14px}.arena-record-value{font-size:13px}
 .arena-scroll{padding:8px 12px 14px}.arena-footer{padding:9px 12px max(10px,env(safe-area-inset-bottom))}.arena-deck-tray{grid-template-columns:56px minmax(0,1fr);gap:7px;padding-right:10px;padding-left:10px}
 .arena-augment-option{grid-template-columns:60px minmax(0,1fr);gap:9px;min-height:144px;border-width:15px;border-image-width:15px;padding-right:18px}.arena-augment-visual{width:60px}.arena-augment-option .arena-augment-name{font-size:14px}.arena-augment-description{font-size:12px}.arena-augment-selected{left:42px}
 .arena-editor-grid{gap:12px 6px}
}
@media(max-height:500px) and (min-width:600px){
 .arena-panel{width:100%;display:grid;grid-template-columns:216px minmax(0,1fr);grid-template-rows:58px minmax(0,1fr) auto}
 .arena-panel:has(>.arena-deck-overview[hidden])>.arena-scroll,.arena-panel:has(>.arena-deck-overview[hidden])>.arena-footer{grid-column:1/-1}
 .arena-panel>.arena-header{grid-column:1/-1;height:58px}.arena-panel>.arena-header .arena-panel-back,.arena-panel>.arena-header .arena-info-button{top:7px}.arena-deck-overview{grid-column:1;grid-row:2/-1;min-height:0;overflow:auto;overscroll-behavior:contain;border-right:1px solid #aa854533;border-bottom:0}
 .arena-summary{grid-template-columns:68px 100px;gap:8px 10px;justify-content:center;padding:10px 12px}.arena-progress{grid-column:1/-1;max-width:none;justify-self:stretch}.arena-active-augments{flex-wrap:wrap}
 .arena-deck-tray{grid-template-columns:52px minmax(0,1fr);gap:6px;padding:6px 8px}.arena-deck-list{gap:6px}
 .arena-panel>.arena-scroll{grid-column:2;grid-row:2}.arena-panel>.arena-footer{grid-column:2;grid-row:3}
}
@media(prefers-reduced-motion:reduce){.arena-budget-fill,.arena-offer,.arena-augment-option,.arena-augment-selected{transition:none}.arena-reward-grid{animation:none}}

.arena-scroll{position:relative}.arena-status.is-loading{position:absolute;inset:8px 12px auto;z-index:4;margin:0;padding:5px 10px;border-radius:5px;background:#f4f0e6e8;color:var(--kit-quiet-ink,#706b63);text-align:center;pointer-events:none}

.arena-entry-cost{font-size:13px;line-height:1.5;color:var(--kit-quiet-ink,#706b63);text-align:center;margin:8px 0}
.arena-info-scroll>.arena-augment-chip{margin-top:8px;width:100%}

/* The measured viewport-center gap clamps above/below the fixed overview and footer. */
.arena-scroll.is-offer{display:flex;flex-direction:column;min-height:0;overflow-x:hidden;overflow-y:auto}
.arena-scroll.is-offer>.arena-offers{flex:0 0 auto;width:100%;box-sizing:border-box;margin-block:var(--arena-offer-space,auto) auto}
.arena-scroll.is-offer>.arena-validation{flex:none}

/* In a short landscape viewport, size the whole three-card row from the body's
   available height. Keep a readable minimum; smaller spaces retain vertical scroll. */
@supports(container-type:size){
 @media(max-height:500px) and (min-width:600px){
  .arena-panel>.arena-scroll.is-offer{container-type:size}
  .arena-scroll.is-offer>.arena-offers:not(.arena-offers-augment){align-self:center;max-width:max(180px,calc(200cqh - 96px))}
 }
}

.arena-panel,.arena-info-dialog{color:var(--kit-ink,#292724);color-scheme:light}.arena-budget.is-over .arena-budget-value{color:#fff4e5;text-shadow:0 1px 2px #241b16}
