/* Test74 interface: artwork first, one clear action, secondary choices on demand. */
body.arena74.arena52.arena58{--bg:#0c151f;--panel:#15232f;--soft:#203442;--edge:#405766;--ink:#f1f5f6;--muted:#b2c3ce;--gold:#f1cf91;--good:#91d8bb;--bad:#ffb6a9;background:radial-gradient(ellipse at 70% -20%,#25433f70,transparent 55%),#0c151f;color:var(--ink);font:15px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;overflow:auto;min-height:100svh}
body.arena74.arena52.arena58 .wrap{display:block;position:relative;height:auto;min-height:100svh;max-width:1380px;margin:auto;padding:28px clamp(14px,3vw,36px) calc(104px + env(safe-area-inset-bottom));overflow:visible}
body.arena74.arena52.arena58 #app{display:block;flex:none;min-height:0;height:auto;max-height:none;overflow:visible;padding:0;background:none}
body.arena74.arena52.arena58 .wrap>footer{display:none}
body.arena74.arena52.arena58 h1{font:720 clamp(1.5rem,3vw,2.1rem)/1.2 system-ui,sans-serif;letter-spacing:-.035em}
body.arena74.arena52.arena58 h2,body.arena74.arena52.arena58 h3{font-family:system-ui,sans-serif;letter-spacing:-.02em}
body.arena74.arena52.arena58 .eyebrow{font-size:.65rem;letter-spacing:.16em;color:#c3d1d7;font-weight:700}
body.arena74.arena52.arena58 button,body.arena74.arena52.arena58 select,body.arena74.arena52.arena58 input{font-family:inherit;min-height:44px;border-radius:12px;transition:background .15s,border-color .15s,box-shadow .15s;touch-action:manipulation}
body.arena74.arena52.arena58 button{background:#1d303d;border:1px solid #425b6a;color:var(--ink);box-shadow:none;text-shadow:none;line-height:1.3}
body.arena74.arena52.arena58 button:hover:not(:disabled){background:#2a414e;border-color:#9aafa9}
body.arena74.arena52.arena58 button.primary{display:flex;align-items:center;justify-content:center;gap:10px;background:var(--gold);border:1px solid #ffe2ad;color:#1c292e;font-weight:750;box-shadow:0 6px 24px #0003}
body.arena74.arena52.arena58 button.primary:hover:not(:disabled){background:#ffdfaa;border-color:#fff0cf}
body.arena74.arena52.arena58 button.quiet{background:#192b37;border-color:#3e5563}
body.arena74.arena52.arena58 button:disabled{opacity:.5;cursor:default;box-shadow:none}
body.arena74.arena52.arena58 :is(button,a,summary,input,select):focus-visible{outline:3px solid #93dfdc;outline-offset:3px;box-shadow:0 0 0 6px #0c151f}
body.arena74.arena52.arena58 [hidden]{display:none!important}
.arena74 .ui-icon{display:inline-block;width:23px;height:23px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle;pointer-events:none}
body.arena74.arena52.arena58 .ui-icon-button{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;width:44px;padding:10px;flex:none;background:#1b2d39;border:1px solid #405765;border-radius:12px}
body.arena74.arena52.arena58 .panel{background:#14232f;border:1px solid #334b5b;border-radius:18px;padding:20px;box-shadow:none}
body.arena74.arena52.arena58 #toast{position:relative;z-index:40;width:100%;padding:13px 18px;margin:0 0 12px;border:1px solid #6b8797;background:#253b49;color:#eff6f8;border-radius:14px;box-shadow:0 8px 24px #0003;font-size:.9rem;max-height:30svh;overflow:auto}
body.arena74.arena52.arena58 #toast:empty{display:none}

/* Five familiar destinations; the active one has shape and text as well as color. */
body.arena74.arena52.arena58 nav.ui-navigation{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:fixed;inset:auto auto max(10px,env(safe-area-inset-bottom)) 50%;transform:translateX(-50%);z-index:60;width:min(530px,calc(100% - 24px));min-height:68px;height:auto;margin:0;padding:6px;gap:4px;border:1px solid #4d64746b;border-radius:22px;background:#162531f5;backdrop-filter:blur(16px);box-shadow:0 12px 40px #0007}
body.arena74.arena52.arena58 nav.ui-navigation button{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:0;min-width:0;max-width:none;min-height:54px;margin:0;padding:6px 2px;border-radius:16px;background:transparent;color:#bbccd7;font-size:.68rem;line-height:1.1}
body.arena74.arena52.arena58 nav.ui-navigation button[aria-current]{background:#3b3e35;color:#ffe0a5;box-shadow:inset 0 0 0 1px #b39b5f45}
body.arena74.arena52.arena58 nav.ui-navigation button[aria-current]::after{content:"";position:absolute;top:3px;width:16px;height:2px;border-radius:2px;background:#f1cf91}
body.arena74.arena52.arena58 nav.ui-navigation button .ui-icon{width:23px;height:23px}
body.arena74.arena52.arena58 .nav-ready-badge{position:absolute;right:9px;top:2px;min-width:17px;min-height:17px;padding:2px 4px;line-height:1.2;border:2px solid #162531;border-radius:20px;background:#9addc0;color:#153028;font-size:10px;font-weight:800}

/* Compact faction chooser followed by two real character choices. */
body.arena74.arena52.arena58 #app .ui-start{display:flex;flex-direction:column;gap:14px;max-width:690px;min-height:0;height:auto;margin:auto;padding:0;overflow:visible}
body.arena74.arena52.arena58 .start-heading{display:block;flex:none;margin:0;text-align:left}
body.arena74.arena52.arena58 .start-heading h1{margin-top:5px}
.arena74 .ui-start-picker{display:flex;gap:9px;align-items:stretch}
body.arena74.arena52.arena58 .ui-faction-current{display:flex;align-items:center;gap:12px;flex:1;min-width:0;min-height:62px;padding:10px 14px;border-radius:16px;border:1px solid #425b67;background:#172a35;text-align:left}
.arena74 .ui-faction-current>.faction-emblem{width:36px;height:36px;max-width:36px}
.arena74 .ui-faction-current>span{display:flex;flex:1;flex-direction:column;min-width:0;gap:1px}
.arena74 .ui-faction-current small{font-size:.68rem;color:#adbfcb;font-weight:500}
.arena74 .ui-faction-current strong{font-size:.95rem;overflow-wrap:anywhere}
body.arena74.arena52.arena58 .ui-start-picker>.ui-icon-button{width:56px;min-height:56px;border-radius:16px}
.arena74 .ui-random-note{font-size:.73rem;color:#d6c59e;margin:-5px 0 0}
body.arena74.arena52.arena58 .ui-general-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-row:auto;grid-column:auto;gap:14px;margin:0}
body.arena74.arena52.arena58 .ui-general-cards>button{isolation:isolate;position:relative;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-end;gap:0;min-width:0;min-height:0;padding:0;overflow:hidden;border:1px solid #49606d;background:#172a35;border-radius:20px;text-align:left;box-shadow:0 8px 28px #0003}
body.arena74.arena52.arena58 .ui-general-cards>button[aria-pressed=true]{border:2px solid #f1cf91;box-shadow:0 0 0 3px #f1cf9115,0 10px 30px #0004}
body.arena74.arena52.arena58 .ui-general-cards>button>.general-art{display:block;position:relative;inset:auto;width:100%;height:clamp(175px,28svh,295px);max-width:none;max-height:none;object-fit:contain!important;object-position:center!important;margin:0;padding:10px 8px 0;border:0;border-radius:0;background:none;z-index:1;filter:none;transform:none}
.arena74 .ui-general-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.3;z-index:-1}
.arena74 .ui-general-cards>button::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#10222cf0,transparent 70%);z-index:0}
body.arena74.arena52.arena58 .ui-general-cards .ui-general-copy{position:relative;z-index:2;display:flex;flex-direction:column;gap:4px;min-width:0;padding:12px 16px;background:#10212bd9}
body.arena74.arena52.arena58 .ui-general-copy b{font:700 1.35rem/1.1 system-ui,sans-serif;color:#f6f6ef;overflow-wrap:anywhere}
body.arena74.arena52.arena58 .ui-general-copy small{font-size:.75rem;font-weight:500;line-height:1.35;color:#c0ced6;overflow-wrap:anywhere}
body.arena74.arena52.arena58 .ui-selected-mark{position:absolute;top:11px;right:11px;z-index:3;display:grid;place-items:center;width:28px;height:28px;padding:0;border-radius:50%;border:1px solid #68808b;background:#142633d9;color:#bdcdd5}
body.arena74.arena52.arena58 [aria-pressed=true]>.ui-selected-mark{background:#f1cf91;border-color:#f1cf91;color:#243127}
.arena74 .ui-selected-mark .ui-icon{width:17px;height:17px}
.arena74 .ui-start-ability{padding:15px 18px;background:#162a34;border-radius:15px;border:1px solid #3a525c;min-width:0}
.arena74 .ui-start-ability>div{display:flex;align-items:center;gap:8px;color:#edd5a6;font-size:.78rem}
.arena74 .ui-start-ability .ui-icon{width:18px;height:18px}
.arena74 .ui-start-ability p{margin:6px 0 0;font-size:.9rem;line-height:1.5;color:#d8e3e8;overflow-wrap:anywhere}
.arena74 .ui-start-actions{display:flex;align-items:stretch;gap:8px}
body.arena74.arena52.arena58 #start-confirm{flex:1;min-width:0;min-height:59px;padding:11px 15px;border-radius:16px;text-align:left;justify-content:flex-start}
.arena74 #start-confirm>span{flex:1}.arena74 #start-confirm small{display:block;margin-top:2px;color:#41504c;font-size:.72rem;font-weight:500}
body.arena74.arena52.arena58 .ui-start-actions>.ui-icon-button{width:50px;border-radius:15px}
.arena74 .ui-start-facts{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;color:#abbecb;font-size:.7rem}
.arena74 .ui-start-facts>span{display:flex;align-items:center;gap:5px}.arena74 .ui-start-facts .ui-icon{width:15px;height:15px}
.arena74 .ui-faction-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:18px}
body.arena74.arena52.arena58 .ui-faction-grid>button{position:relative;isolation:isolate;display:flex;align-items:center;gap:10px;min-height:90px;padding:12px;border-radius:15px;overflow:hidden;text-align:left;background:#203440}
.arena74 .ui-faction-grid>button>img:not(.faction-emblem){position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.18;z-index:-1}
.arena74 .ui-faction-grid>button>span{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}.arena74 .ui-faction-grid strong{font-size:.9rem;overflow-wrap:anywhere}.arena74 .ui-faction-grid small{font-size:.69rem;color:#c2d2da}.arena74 .ui-faction-grid>button>.ui-icon{width:16px;height:16px}
body.arena74.arena52.arena58 .ui-faction-grid>button[aria-pressed=true]{border:2px solid #f1cf91}

/* Arena status is one quiet row; the cards remain the main content. */
body.arena74.arena52.arena58 #app .hud{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 0 12px;margin:0;border:0;background:none;min-height:46px;box-shadow:none}
body.arena74.arena52.arena58 #app .hud>.metric{display:flex;align-items:center;gap:7px;background:none;border:0;padding:0;min-width:0;border-radius:0;box-shadow:none}
body.arena74.arena52.arena58 #app .hud .metric strong{font-size:1rem;font-weight:750}.arena74 .hud .metric span{font-size:.72rem}
body.arena74.arena52.arena58 #app .hud .rune-metric{padding:6px 11px;border-radius:10px;background:#38392c;color:#f6dba7}
body.arena74.arena52.arena58 .arena-league{display:flex;align-items:center;gap:8px;min-height:44px;padding:4px 9px;border-color:#405968;background:#172a36}
.arena74 .arena-league small{font-size:.6rem}.arena74 .arena-league .league-emblem{width:24px;height:28px}
body.arena74.arena52.arena58 #app .arena-identity{display:flex;align-items:center;gap:12px;min-height:65px;margin:0 0 12px;padding:0;border:0;background:none}
body.arena74.arena52.arena58 #app .arena-identity>button{display:flex;align-items:center;gap:10px;min-width:0;flex:1;min-height:65px;padding:6px 10px;border:1px solid #354d5b;border-radius:15px;background:#152632;text-align:left}
body.arena74.arena52.arena58 #app .arena-identity .general-art{position:static;width:36px;height:54px;max-height:none;object-fit:contain!important;object-position:center!important;background:none;border:0;border-radius:5px;flex:none}
.arena74 .arena-identity strong{font-size:.96rem}.arena74 .arena-identity small{font-size:.65rem;line-height:1.3}.arena74 .arena-identity .faction-signature{display:none}.arena74 .arena-vs{font-size:.6rem;color:#97acba;letter-spacing:.1em}
body.arena74.arena52.arena58 #app .arena-layout{display:block;height:auto;min-height:0;max-height:none;overflow:visible}
body.arena74.arena52.arena58 #app .arena-main{display:block;min-height:0;overflow:visible;gap:0}
.arena74 .ui-preparation{display:flex;flex-direction:column;gap:14px;position:relative}
.arena74 .ui-arena-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px}
.arena74 .ui-desktop-step{color:#afc4cd;font-size:.76rem;letter-spacing:.03em}
body.arena74.arena52.arena58 .ui-arena-tabs{display:none}
body.arena74.arena52.arena58 #app[data-phase] .arena-board{display:grid;grid-template-columns:minmax(0,.44fr) minmax(0,.56fr);grid-template-rows:auto;align-items:start;gap:26px;flex:none;min-height:0;max-height:none;overflow:visible}
body.arena74.arena52.arena58 #app[data-phase] .arena-board.arena-prepared{grid-template-columns:1fr;max-width:1000px;width:100%;margin:auto}
body.arena74.arena52.arena58 #app .market-column,body.arena74.arena52.arena58 #app .team-column{display:flex;flex-direction:column;min-width:0;max-width:none;gap:10px}
body.arena74.arena52.arena58 #app .arena-board .panel{padding:0;margin:0;background:none;border:0;box-shadow:none}
body.arena74.arena52.arena58 #app .market-heading,body.arena74.arena52.arena58 #app .team .panel-title{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:30px;margin:0 0 8px}
body.arena74.arena52.arena58 #app .market-heading h2,body.arena74.arena52.arena58 #app .team .panel-title h2{font-size:1rem;font-weight:700}
.arena74 .market-heading>span{font-size:.68rem;color:#acc0cc}
body.arena74.arena52.arena58 #app .band-help{padding:8px;min-width:44px;background:transparent;border:0}
body.arena74.arena52.arena58 #app[data-phase] .market .offers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto;gap:10px;margin:0;align-items:stretch;min-height:0}
body.arena74.arena52.arena58 #app[data-phase] .market .offer,body.arena74.arena52.arena58 #app[data-phase] .arena-board .unit{position:relative;display:flex;flex-direction:column;align-items:stretch;width:100%;min-width:0;min-height:0;margin:0;padding:0;background:#182c38;border:1px solid #4a626e;border-top:2px solid var(--rarity);border-radius:14px;box-shadow:0 5px 16px #0003;overflow:hidden}
body.arena74.arena52.arena58 #app[data-phase] .market .offer:nth-child(3){grid-column:auto;width:100%}
body.arena74.arena52.arena58 #app[data-phase] .market .offer>.art{position:relative;width:100%;height:clamp(150px,27svh,275px);min-height:0;max-height:none;aspect-ratio:auto;margin:0;background:#11212b;border:0;flex:none}
body.arena74.arena52.arena58 #app[data-phase] .market .offer>.art img,body.arena74.arena52.arena58 #app[data-phase] .arena-board .unit>.portrait img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:contain;object-position:center;transform:none}
body.arena74.arena52.arena58 #app[data-phase] .market .offer .body{display:flex;flex-direction:column;gap:7px;padding:11px 10px;background:#182c38}
body.arena74.arena52.arena58 #app .offer .body>strong{font-size:.87rem;line-height:1.25;min-height:2.5em;font-weight:650}
body.arena74.arena52.arena58 #app .offer .cost{top:8px;right:8px;border:1px solid #e8cd95;background:#1a2628f5;border-radius:9px;font-size:.87rem;padding:4px 7px;color:#f6d69e;z-index:3}
body.arena74.arena52.arena58 #app .offer .rarity-label,body.arena74.arena52.arena58 #app .offer .offer-rank{display:none}
body.arena74.arena52.arena58 #app .offer .upgrade-badge{left:6px;bottom:6px;border-radius:6px;padding:3px 5px;font-size:.6rem;gap:3px;background:#13272eef}
.arena74 #app .offer .upgrade-badge b{font-size:.76rem}.arena74 #app .offer .values{font-size:.75rem;gap:4px}.arena74 #app .offer .value img{width:13px;height:13px}
.arena74 #app .offer .buy-hint{font-size:.7rem;color:#ffcbb1;padding:0}
body.arena74.arena52.arena58 #app .offer.empty{justify-content:center;align-items:center;min-height:260px;color:#a6bfc6;background:#12222bd9;border:1px dashed #3e5a65}
body.arena74.arena52.arena58 #app .offer.empty strong{font-size:.78rem;min-height:0}.arena74 .empty-symbol{font-size:1.7rem;color:#92d0b5}
body.arena74.arena52.arena58 #app[data-phase] .arena-board .team>.roster{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:auto;gap:7px;min-height:0}
body.arena74.arena52.arena58 #app[data-phase] .arena-board .team>.roster>:nth-child(5){grid-column:auto;width:100%}
body.arena74.arena52.arena58 #app[data-phase] .arena-board .unit>.portrait{position:relative;aspect-ratio:2/3;width:100%;height:auto;min-height:0;max-height:none;margin:0;flex:none}
body.arena74.arena52.arena58 #app .unit .unit-body{display:flex;flex-direction:column;gap:5px;padding:7px 6px}
body.arena74.arena52.arena58 #app .unit .name{font-size:.73rem;font-weight:650;line-height:1.25;min-height:2.5em;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
body.arena74.arena52.arena58 #app .arena-board .unit .values{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px;font-size:.72rem}
.arena74 #app .unit .value{gap:3px}.arena74 #app .unit .value img{width:12px;height:12px}
body.arena74.arena52.arena58 #app .arena-board .unit .rarity-label,body.arena74.arena52.arena58 #app .arena-board .unit .development-mark,body.arena74.arena52.arena58 #app .arena-board .unit .slot{display:none}
.arena74 .ui-unit-position{position:absolute;left:5px;top:5px;z-index:2;display:grid;place-items:center;width:20px;height:20px;background:#11252de8;color:#e4eaf0;border:1px solid #6e8792;border-radius:6px;font-size:.65rem;font-weight:700}
body.arena74.arena52.arena58 #app .unit .rank{top:5px;right:5px;font-size:.63rem;padding:2px 4px;border-radius:5px}
body.arena74.arena52.arena58 #app .formation-direction-label{margin:0 0 7px;display:flex;justify-content:space-between;gap:8px;font-size:.64rem;color:#a6bbc7}
body.arena74.arena52.arena58 #app .arena-empty-slot{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:150px;padding:6px;border:1px dashed #4a626e;border-radius:14px;background:#14242e;color:#a9bec9;gap:7px;font-size:.67rem;text-align:center}
.arena74 .arena-empty-slot b{font-size:1.3rem;font-weight:400}
body.arena74.arena52.arena58 #app .reserve-bench{padding-top:11px;margin:0;border:0;border-top:1px solid #344c58;background:transparent;border-radius:0}
body.arena74.arena52.arena58 #app .reserve-heading{display:flex;align-items:center;justify-content:space-between;gap:7px;margin-bottom:6px}
.arena74 .reserve-heading h3{font-size:.72rem}.arena74 .reserve-heading span{font-size:.65rem;color:#acbec9}
body.arena74.arena52.arena58 #app .reserve-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
body.arena74.arena52.arena58 #app .reserve-empty{display:grid;place-items:center;min-height:43px;padding:4px;border:1px dashed #3d5763;background:none;border-radius:9px;color:#9fb6c3;font-size:.63rem}
body.arena74.arena52.arena58 #app[data-phase] .arena-board .reserve-slots>.unit{display:flex;flex-direction:row;align-items:center;gap:5px;padding:4px;border-radius:9px}
body.arena74.arena52.arena58 #app[data-phase] .arena-board .reserve-slots>.unit>.portrait{width:29px;height:44px;flex:none;margin:0}
body.arena74.arena52.arena58 #app .reserve-slots .unit-body{padding:0;flex:1;min-width:0}.arena74 #app .reserve-slots .unit .name{font-size:.63rem;min-height:0}
body.arena74.arena52.arena58 #app .reserve-slots .unit :is(.values,.rank,.ui-unit-position){display:none}
body.arena74.arena52.arena58 #app .arena-pacts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0}
body.arena74.arena52.arena58 #app .arena-pact{display:flex;align-items:center;gap:8px;min-height:58px;padding:8px;background:#1b303a;border:1px solid #47636c;border-radius:12px;text-align:left}
.arena74 .arena-pact strong{font-size:.73rem}.arena74 .arena-pact small{font-size:.61rem;color:#bfd0d6}.arena74 .arena-pact-symbol{font-size:1.4rem;color:#d9cca3}
body.arena74.arena52.arena58 #app .arena-pact-pair .portrait{width:22px!important;height:33px;aspect-ratio:2/3}.arena74 .arena-pact-pair{gap:3px}
body.arena74.arena52.arena58 .ui-action-dock{display:grid;grid-template-columns:84px 84px minmax(0,1fr);align-items:stretch;gap:9px;min-height:60px;margin-top:2px;padding:9px;border:1px solid #47617066;border-radius:19px;background:#152732f5;box-shadow:0 10px 30px #0004}
body.arena74.arena52.arena58 .ui-action-dock:not(:has(#refill)){grid-template-columns:84px minmax(0,1fr)}
body.arena74.arena52.arena58 .ui-order,body.arena74.arena52.arena58 .ui-refresh{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px;min-width:0;min-height:49px;padding:5px;background:#203642;border-color:#44606e;font-size:.68rem;font-weight:600}
body.arena74.arena52.arena58 .ui-fight{justify-content:center;padding:9px 16px;min-height:49px;font-size:1rem}.arena74 .ui-fight>span:not(.sr-only){flex:1;text-align:left}
.arena74 .ui-more{position:relative;margin:0;flex:none;z-index:15}.arena74 .ui-more>summary{list-style:none;cursor:pointer}.arena74 .ui-more>summary::-webkit-details-marker{display:none}
.arena74 .ui-more-panel{position:absolute;right:0;top:calc(100% + 8px);z-index:30;display:grid;gap:4px;width:255px;max-height:65svh;overflow:auto;padding:8px;border:1px solid #607a85;border-radius:15px;background:#1a303d;box-shadow:0 14px 50px #0009}
body.arena74.arena52.arena58 .ui-more-panel>button{display:flex;align-items:center;gap:10px;min-height:46px;background:transparent;border:0;padding:10px;text-align:left;font-size:.83rem}
body.arena74.arena52.arena58 #app .arena-disclosure{border:1px solid #344b5b;background:#12232dc9;border-radius:14px;padding:0 12px;margin:16px 0 0}
.arena74 .arena-disclosure>summary{font-size:.78rem;color:#bbced8;padding:12px 0;min-height:44px}

/* Real dialogs, with a stable close control and progressive details. */
body.arena74.arena52.arena58 dialog{position:fixed;inset:0;margin:auto;padding:24px;max-width:calc(100vw - 32px);width:min(700px,calc(100vw - 32px));max-height:calc(100svh - 48px);background:#142633;border:1px solid #58717e;border-radius:24px;color:#f1f5f6;box-shadow:0 30px 100px #0009;overflow:auto;overscroll-behavior:contain}
body.arena74.arena52.arena58 dialog::backdrop{background:#050d16bf;backdrop-filter:blur(5px)}
body.arena74.arena52.arena58 dialog #close-dialog{position:sticky;top:-12px;right:0;z-index:20;display:flex;align-items:center;justify-content:center;width:44px;min-height:44px;height:44px;padding:10px;margin:0 0 6px auto;background:#253e4c;border:1px solid #637e8b;border-radius:50%;box-shadow:0 4px 14px #0004}
.arena74 #dialog-body h2{font-size:1.5rem;line-height:1.25;padding-right:4px}.arena74 #dialog-body p{font-size:.9rem;line-height:1.6}
body.arena74.arena52.arena58 .ui-details{padding:0 13px;margin:12px 0;border:1px solid #425e6b;background:#172c38;border-radius:12px}
.arena74 .ui-details>summary{font-size:.8rem;font-weight:600;color:#d4e1e7;min-height:44px;padding:12px 0}
.arena74 .ui-card-detail{display:grid;grid-template-columns:minmax(110px,.7fr) minmax(0,1fr);gap:20px;align-items:center}
body.arena74.arena52.arena58 dialog .ui-detail-portrait>.detail-art{position:relative;width:100%;max-width:255px;height:auto;aspect-ratio:2/3;max-height:none;border-radius:16px;margin:0;overflow:hidden}
.arena74 .ui-detail-portrait .card-art-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transform:none}
.arena74 .ui-detail-copy{min-width:0}.arena74 .ui-detail-copy h2{margin:6px 0 10px;font-size:1.6rem}.arena74 .ui-detail-copy .faction-card-label{display:flex;align-items:center;gap:6px;font-size:.72rem;color:#bfced7}.arena74 .ui-detail-copy .faction-emblem{width:24px;height:26px}
body.arena74.arena52.arena58 .ui-detail-copy .detail-values{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;background:#0f202b;padding:10px;border-radius:12px;margin:10px 0}
.arena74 .ui-detail-copy .value{justify-content:flex-start;font-size:.95rem}.arena74 .ui-detail-copy .ui-card-effect{font-size:.85rem!important;line-height:1.45!important}.arena74 .ui-detail-copy .badge{border:0;background:#283d45;color:#eddbc0;font-size:.7rem}
body.arena74.arena52.arena58 dialog .ui-purchase-confirm{position:sticky;bottom:-12px;z-index:10;min-height:54px;margin-top:16px;box-shadow:0 -8px 20px #142633,0 7px 22px #0006}
.arena74 .replace-list{gap:8px}.arena74 .replace-list>button{min-height:48px}
.arena74 .purchase-explanation{font-size:.84rem;padding:12px 0}.arena74 .purchase-explanation table{font-size:.8rem}
body.arena74.arena52.arena58 .replay-actions>button{display:flex;align-items:center;justify-content:center;gap:7px;font-size:.75rem;min-height:44px;padding:8px}
body.arena74.arena52.arena58 .ui-segments{display:flex;gap:3px;padding:4px;background:#101f2b;border:1px solid #374f5e;border-radius:13px;margin:0;min-width:0}
body.arena74.arena52.arena58 .ui-segments>button{display:flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:7px 14px;background:transparent;border:1px solid transparent;border-radius:9px;color:#b8cbd6;font-size:.8rem}
body.arena74.arena52.arena58 .ui-segments>button[aria-pressed=true]{background:#2a4650;border-color:#66858c;color:#f0f8f5}
body.arena74.arena52.arena58 .speed-controls{align-items:center}.arena74 .speed-controls>button{min-width:44px}
.arena74 .ui-home-hero{display:flex;align-items:center;gap:18px;margin:18px 0;background:#1b303b;padding:14px 18px;border-radius:17px}
body.arena74.arena52.arena58 .ui-home-hero>.general-art{width:62px;height:93px;max-height:none;object-fit:contain!important;border:0;border-radius:9px}
.arena74 .ui-home-hero>span{display:flex;flex-direction:column;gap:6px}.arena74 .ui-home-hero strong{font-size:1.25rem}.arena74 .ui-home-hero small{font-size:.8rem;color:#becfd7}
.arena74 .ui-home-status{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:16px 0}
body.arena74.arena52.arena58 .ui-home-status>button{display:flex;align-items:center;gap:10px;text-align:left;padding:12px;background:#192e3b;border-color:#3e5865}.arena74 .ui-home-status span{display:flex;flex-direction:column;gap:3px;min-width:0}.arena74 .ui-home-status strong{font-size:.88rem}.arena74 .ui-home-status small{font-size:.64rem;color:#b6c8d3}
.arena74 .ui-menu-list{display:grid;gap:2px;margin:14px 0}
body.arena74.arena52.arena58 .ui-menu-row{display:flex;align-items:center;gap:14px;min-height:58px;width:100%;padding:11px 8px;border:0;border-bottom:1px solid #354f5c;border-radius:6px;background:transparent;text-align:left}
.arena74 .ui-menu-row>span{flex:1;display:flex;flex-direction:column;gap:3px}.arena74 .ui-menu-row strong{font-size:.9rem;font-weight:600}.arena74 .ui-menu-row small{font-size:.72rem;color:#aec5d1}.arena74 .ui-menu-row>.ui-icon:first-child{color:#d5c69f}.arena74 .ui-menu-row>.ui-icon:last-child{width:17px;height:17px;color:#a1b7c3}
.arena74 .ui-about-links{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:18px}.arena74 .ui-about-links a{display:flex;align-items:center;min-height:44px;padding:8px 10px;color:#b9ceda;font-size:.75rem;text-decoration:none}

/* Quests show the tasks immediately; choosing another general is a dialog. */
body.arena74.arena52.arena58 #app .quests-screen{display:flex;flex-direction:column;gap:14px;min-height:0;height:auto;max-width:850px;padding:0;margin:auto;overflow:visible}
body.arena74.arena52.arena58 .quest-heading{display:block;margin:0}.arena74 .quest-heading h1{margin:5px 0 0}
body.arena74.arena52.arena58 .quest-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;background:#11222d;border:1px solid #3c5664;border-radius:14px;padding:4px;margin:0}
body.arena74.arena52.arena58 .quest-tabs button{background:none;border:1px solid transparent;border-radius:10px;min-height:42px;font-size:.84rem;padding:8px;color:#b6c9d4}
body.arena74.arena52.arena58 .quest-tabs button[aria-pressed=true]{background:#2b444c;border-color:#658082;color:#f5eedc}
body.arena74.arena52.arena58 .quest-general-hero,body.arena74.arena52.arena58 .quest-season-hero{display:flex;align-items:center;min-height:0;gap:14px;padding:12px 16px;background:#1a303b;border:1px solid #415b64;border-radius:18px;margin:0}
body.arena74.arena52.arena58 .quest-general-hero>.general-art{position:static;width:52px;height:78px;max-height:none;object-fit:contain!important;border:0;flex:none}
.arena74 .quest-general-hero>div{flex:1;min-width:0}.arena74 .quest-general-hero h2{font-size:1.25rem;margin:3px 0}.arena74 .quest-general-hero p{margin:0;font-size:.75rem;color:#bfcdd4}.arena74 .quest-general-hero>div>span:last-child{font-size:.68rem;color:#a9c4ca}.arena74 .quest-general-hero .faction-signature{font-size:.63rem}.arena74 .quest-general-hero .faction-emblem{width:18px;height:20px}
body.arena74.arena52.arena58 .quest-cards{display:flex;flex-direction:column;gap:10px;min-height:0;flex:none}
body.arena74.arena52.arena58 .quest-card{display:grid;grid-template-columns:minmax(0,1fr) 72px;align-items:center;min-height:116px;gap:15px;margin:0;padding:15px 17px;border:1px solid #455f6c;border-radius:17px;background:#1a2e3a;text-align:left;flex:none;box-shadow:none}
body.arena74.arena52.arena58 .quest-card.complete{background:#1a3b34;border-color:#699f89}
.arena74 .quest-copy{display:flex;flex-direction:column;gap:5px}.arena74 .quest-copy>strong{font-size:.92rem;color:#eff5f5}.arena74 .quest-copy>span:not(.quest-meter){font-size:.75rem;line-height:1.4;color:#bed0da}
body.arena74.arena52.arena58 .quest-meter{position:relative;display:block;height:18px;min-height:18px;margin:3px 0 0;padding:0;background:#0c1c27;border:0;border-radius:6px;overflow:hidden}
.arena74 .quest-meter i{background:#507b70}.arena74 .quest-meter b{font-size:.65rem;line-height:18px;color:#fff;z-index:2;text-shadow:0 1px 2px #0009}
body.arena74.arena52.arena58 .quest-reward{align-self:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:65px;padding:8px 5px;background:#2d3e40;border:0;border-radius:12px;color:#f4d69e;text-align:center}
.arena74 .quest-reward strong{font-size:.78rem}.arena74 .quest-reward small{font-size:.61rem;color:#c9d5d6}
.arena74 .quest-footnote{font-size:.69rem;line-height:1.5;text-align:center;color:#a9bfca;margin:0}
body.arena74.arena52.arena58 #quest-help{align-self:center;min-height:44px;font-size:.74rem;background:none;border-color:transparent;color:#c4d6de}
.arena74 .ui-general-picker{display:grid;gap:18px;margin-top:18px}.arena74 .ui-general-picker h3{display:flex;align-items:center;gap:8px;font-size:.88rem;margin:0 0 9px}.arena74 .ui-general-picker .faction-emblem{width:24px;height:26px}
.arena74 .ui-general-picker section>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
body.arena74.arena52.arena58 .ui-general-picker button{display:flex;align-items:center;gap:10px;min-width:0;min-height:86px;padding:8px;text-align:left;background:#1d3540;border-color:#4a6370}
body.arena74.arena52.arena58 .ui-general-picker .general-art{width:40px;height:60px;object-fit:contain!important;border:0;flex:none}.arena74 .ui-general-picker button>span{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}.arena74 .ui-general-picker strong{font-size:.87rem}.arena74 .ui-general-picker small{font-size:.65rem;color:#bfd0da;line-height:1.3}
body.arena74.arena52.arena58 .ui-general-picker button[aria-pressed=true]{border-color:#f1cf91;background:#36463f}.arena74 .ui-general-picker button>.ui-icon{width:17px;height:17px;color:#f1cf91}

/* Search and faction filtering replace browsing hundreds of cards to find one. */
body.arena74.arena52.arena58 #app .collection-intro{padding:0;margin:0 0 20px;border:0;background:none}
.arena74 .ui-collection-search{display:grid;grid-template-columns:minmax(0,1fr) minmax(120px,.45fr);gap:10px;margin:14px 0}
.arena74 .ui-collection-search>label:not(.sr-only){display:flex;align-items:center;gap:10px;padding:0 14px;border:1px solid #496473;border-radius:12px;background:#132936}
.arena74 .ui-collection-search input{width:100%;min-width:0;min-height:48px;background:transparent;border:0;color:#f2f6f6;padding:7px 0;font-size:.85rem;outline-offset:0}.arena74 .ui-collection-search input::placeholder{color:#a8c0cf}.arena74 .ui-collection-search select{min-height:48px;padding:8px 12px;background:#172d3a;color:#dfe9ed;border:1px solid #496473;font-size:.78rem}
body.arena74.arena52.arena58 #app .collection-filters{display:flex;gap:7px;flex-wrap:wrap;margin:0}.arena74 .collection-filters button{font-size:.77rem;min-height:44px}
body.arena74.arena52.arena58 #app .collection-filters button[aria-pressed=true]{background:#324b4d;border-color:#80a09c;color:#fff1cf}
body.arena74.arena52.arena58 #app .collection{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:15px;padding:0;overflow:visible;height:auto;max-height:none}
body.arena74.arena52.arena58 #app .collection-card{background:#192e3a;border:1px solid #48606e;border-top:2px solid var(--rarity);border-radius:16px;overflow:hidden}
body.arena74.arena52.arena58 #app .collection-card>.art{position:relative;height:auto;max-height:none;aspect-ratio:2/3;background:#10232f}.arena74 #app .collection-card .card-art-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transform:none}
body.arena74.arena52.arena58 #app .collection-card .body{padding:12px}.arena74 .collection-card .body>strong{font-size:.89rem}.arena74 .collection-card .body>p{font-size:.74rem;line-height:1.4}.arena74 .collection-card .general-card-access{font-size:.64rem}.arena74 .collection-card .collection-progress{font-size:.65rem}
body.arena74.arena52.arena58 .talent-option{border-radius:18px;background:#1c323d;border-color:#506a74;padding:20px}.arena74 .talent-option>strong{font-size:1.15rem}.arena74 .talent-selection .hint{font-size:.78rem}

@media(max-width:900px){
 body.arena74.arena52.arena58 .wrap{padding-top:16px;padding-bottom:calc(99px + env(safe-area-inset-bottom))}
 body.arena74.arena52.arena58 #app .ui-start{max-width:620px;gap:12px}
 body.arena74.arena52.arena58 .ui-arena-tabs{display:flex;flex:1;max-width:360px}
 body.arena74.arena52.arena58 .ui-arena-tabs>button{flex:1;min-height:38px;padding:7px 14px}
 .arena74 .ui-desktop-step{display:none}
 body.arena74.arena52.arena58 #app[data-phase] .arena-board{display:block;min-height:0}
 body.arena74.arena52.arena58 #app .arena-board[data-arena-pane=market]>.team-column{display:none}
 body.arena74.arena52.arena58 #app .arena-board[data-arena-pane=formation]>.market-column{display:none}
 .arena74 .ui-preparation{padding-bottom:82px;gap:10px}
 body.arena74.arena52.arena58 .ui-action-dock{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(88px + env(safe-area-inset-bottom));z-index:45;width:min(640px,calc(100% - 28px));margin:0;grid-template-columns:72px 72px minmax(0,1fr);padding:7px;gap:7px;border-radius:17px;backdrop-filter:blur(12px)}
 body.arena74.arena52.arena58 .ui-action-dock:not(:has(#refill)){grid-template-columns:72px minmax(0,1fr)}
 body.arena74.arena52.arena58 #app[data-phase] .market .offer>.art{height:clamp(155px,30svh,330px)}
 body.arena74.arena52.arena58 #app .market-column{max-width:640px;width:100%;margin:auto}
 body.arena74.arena52.arena58 #app[data-phase] .arena-board .team>.roster{gap:7px}
 body.arena74.arena52.arena58 #app .arena-board .team-column{max-width:820px;margin:auto}
}
@media(max-width:540px){
 body.arena74.arena52.arena58 .wrap{padding-left:14px;padding-right:14px;padding-top:14px}
 body.arena74.arena52.arena58 #app .ui-start{gap:11px}
 body.arena74.arena52.arena58 .start-heading h1{font-size:1.5rem}
 body.arena74.arena52.arena58 .ui-general-cards{gap:10px}
 body.arena74.arena52.arena58 .ui-general-cards>button>.general-art{height:clamp(145px,26svh,220px);padding:8px 5px 0}
 body.arena74.arena52.arena58 .ui-general-cards .ui-general-copy{padding:10px 12px;gap:4px}
 body.arena74.arena52.arena58 .ui-general-copy b{font-size:1.22rem}.arena74 .ui-general-copy small{font-size:.68rem}
 .arena74 .ui-start-ability{padding:12px 14px}.arena74 .ui-start-ability p{font-size:.82rem;line-height:1.45}
 .arena74 .ui-start-facts{gap:13px;font-size:.63rem}
 body.arena74.arena52.arena58 #start-confirm{min-height:56px;padding:10px 12px;font-size:.87rem}.arena74 #start-confirm>.ui-icon:first-child{display:none}
 body.arena74.arena52.arena58 .ui-start-actions>.ui-icon-button{width:44px}
 body.arena74.arena52.arena58 #app .hud{gap:7px;min-height:44px;padding-bottom:8px}.arena74 .hud .metric span{font-size:.63rem}
 body.arena74.arena52.arena58 #app .hud .metric strong{font-size:.9rem}.arena74 .hud .rune-metric span{display:none}
 body.arena74.arena52.arena58 .arena-league{padding:3px 5px;gap:4px}.arena74 .arena-league>span{font-size:.63rem}.arena74 .arena-league .league-emblem{width:20px;height:24px}.arena74 .arena-league small{display:none}
 body.arena74.arena52.arena58 #app .arena-identity{gap:7px;margin-bottom:10px;min-height:60px}.arena74 .arena-identity .arena-vs{font-size:.53rem}
 body.arena74.arena52.arena58 #app .arena-identity>button{gap:6px;padding:5px 7px;min-height:60px;border-radius:12px}
 body.arena74.arena52.arena58 #app .arena-identity .general-art{width:30px;height:45px}.arena74 .arena-identity strong{font-size:.83rem}.arena74 .arena-identity small{font-size:.58rem}
 body.arena74.arena52.arena58 #app[data-phase] .market .offers{gap:7px}
 body.arena74.arena52.arena58 #app[data-phase] .market .offer>.art{height:clamp(144px,25svh,220px)}
 body.arena74.arena52.arena58 #app[data-phase] .market .offer .body{padding:9px 7px;gap:7px}
 body.arena74.arena52.arena58 #app .offer .body>strong{font-size:.75rem;min-height:2.5em}.arena74 #app .offer .values{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;font-size:.73rem}.arena74 #app .offer .cost{font-size:.73rem}
 body.arena74.arena52.arena58 #app .offer.empty{min-height:235px}
 body.arena74.arena52.arena58 #app[data-phase] .arena-board .team>.roster{gap:5px}
 body.arena74.arena52.arena58 #app .arena-board .unit .unit-body{padding:6px 4px;gap:4px}
 body.arena74.arena52.arena58 #app .arena-board .unit .name{font-size:.66rem;line-height:1.25}
 body.arena74.arena52.arena58 #app .arena-board .unit .values{font-size:.66rem;gap:3px}.arena74 #app .unit .value{gap:1px}.arena74 #app .unit .value img{width:10px;height:10px}
 .arena74 .ui-unit-position{width:17px;height:18px;top:4px;left:3px;font-size:.58rem}.arena74 #app .unit .rank{top:4px;right:3px;font-size:.56rem}
 body.arena74.arena52.arena58 #app .arena-empty-slot{min-height:150px;font-size:.62rem}
 .arena74 .formation-direction-label>span:last-child{display:none}
 body.arena74.arena52.arena58 #app .arena-pact{min-height:55px;gap:6px;padding:7px}.arena74 .arena-pact strong{font-size:.7rem}.arena74 .arena-pact small{font-size:.6rem}
 body.arena74.arena52.arena58 .ui-action-dock{grid-template-columns:62px 65px minmax(0,1fr);gap:6px}
 body.arena74.arena52.arena58 .ui-action-dock:not(:has(#refill)){grid-template-columns:65px minmax(0,1fr)}
 body.arena74.arena52.arena58 .ui-fight{padding:9px 11px;font-size:.92rem}.arena74 .ui-fight>.ui-icon:last-child{width:16px;height:16px}
 body.arena74.arena52.arena58 dialog{inset:auto 0 0;margin:0 auto;width:100%;max-width:100%;max-height:94svh;border-radius:24px 24px 0 0;padding:18px 16px max(22px,env(safe-area-inset-bottom));border-bottom:0}
 body.arena74.arena52.arena58 dialog #close-dialog{top:-6px;margin-bottom:4px}
 .arena74 #dialog-body h2{font-size:1.3rem}.arena74 #dialog-body p{font-size:.83rem}
 .arena74 .ui-card-detail{grid-template-columns:minmax(100px,.73fr) minmax(0,1fr);gap:14px}.arena74 .ui-detail-copy h2{font-size:1.13rem!important}.arena74 .ui-detail-copy .eyebrow{font-size:.58rem}.arena74 .ui-detail-copy .ui-card-effect{font-size:.76rem!important}
 body.arena74.arena52.arena58 .ui-detail-copy .detail-values{padding:8px;gap:5px}.arena74 .ui-detail-copy .value{font-size:.85rem}.arena74 .ui-detail-copy .value img{width:15px;height:15px}
 .arena74 .ui-faction-grid{gap:8px}.arena74 .ui-faction-grid>button{flex-wrap:wrap;gap:7px!important;padding:10px!important;min-height:108px!important}.arena74 .ui-faction-grid>button>.faction-emblem{width:30px;height:32px}.arena74 .ui-faction-grid>button>span{flex-basis:calc(100% - 45px)}.arena74 .ui-faction-grid>button>.ui-icon{display:none}.arena74 .ui-faction-grid strong{font-size:.76rem}.arena74 .ui-faction-grid small{font-size:.61rem}
 body.arena74.arena52.arena58 #app .quests-screen{gap:10px}
 body.arena74.arena52.arena58 .quest-general-hero,body.arena74.arena52.arena58 .quest-season-hero{padding:10px 12px;gap:10px;border-radius:15px}
 body.arena74.arena52.arena58 .quest-general-hero>.general-art{width:42px;height:63px}
 body.arena74.arena52.arena58 .quest-card{min-height:110px;padding:12px 13px;grid-template-columns:minmax(0,1fr) 64px;gap:10px}
 .arena74 .quest-copy>strong{font-size:.83rem}.arena74 .quest-copy>span:not(.quest-meter){font-size:.7rem}.arena74 .quest-reward strong{font-size:.71rem}.arena74 .quest-footnote{font-size:.64rem}
 .arena74 .ui-general-picker button{flex-wrap:wrap}.arena74 .ui-general-picker button>.ui-icon{display:none}
 .arena74 .ui-collection-search{grid-template-columns:minmax(0,1fr);gap:8px}.arena74 .ui-collection-search select{width:100%;font-size:.83rem}
 body.arena74.arena52.arena58 #app .collection{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.arena74 .collection-filters button{font-size:.7rem;padding:8px}
 body.arena74.arena52.arena58 #app .collection-card .body{padding:10px}
}
@media(max-height:700px) and (max-width:900px){
 body.arena74.arena52.arena58 #app .ui-start{gap:8px}
 body.arena74.arena52.arena58 .ui-general-cards>button>.general-art{height:138px}
 body.arena74.arena52.arena58 .ui-faction-current{min-height:50px;padding:7px 12px}
 body.arena74.arena52.arena58 .ui-start-picker>.ui-icon-button{min-height:50px;width:50px}
 .arena74 .ui-start-ability{padding:10px 13px}.arena74 .ui-start-ability p{margin-top:4px}
 body.arena74.arena52.arena58 #app[data-phase] .market .offer>.art{height:136px}
}
@media(prefers-reduced-motion:reduce){body.arena74.arena52.arena58 *,body.arena74.arena52.arena58 *::before,body.arena74.arena52.arena58 *::after{transition:none!important;scroll-behavior:auto!important}}
@media(forced-colors:active){.arena74 .ui-icon{stroke:ButtonText}.arena74 button[aria-pressed=true],.arena74 button[aria-current]{outline:2px solid Highlight}.arena74 .ui-selected-mark{border:2px solid Highlight}.arena74 .ui-general-backdrop{display:none}}