/* Test58: artwork carries faction identity; quiet surfaces carry the interface. */
body.arena58{--bg:#101923;--panel:#1b2937;--soft:#263748;--edge:#415264;--ink:#f2f5f7;--muted:#b7c6d2;--gold:#e7c990;background:#101923;font:15px/1.45 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.arena58.arena52 .wrap{max-width:1440px;padding:0 clamp(12px,2vw,26px)}
.arena58.arena52 nav{background:#101923;border-color:#334352;min-height:60px;margin:0;padding:4px 0 max(4px,env(safe-area-inset-bottom))}
.arena58.arena52 nav button{border-radius:10px;font-size:12px;min-height:48px}
.arena58.arena52 nav button[aria-current]{background:#263b4b;color:#f5e2bc;box-shadow:none}
.arena58 button:focus-visible,.arena58 summary:focus-visible{outline:3px solid #89d8fb;outline-offset:3px}
.arena58.arena52 .panel,.arena58.arena52 dialog{background:#1b2937;border:1px solid #405365;border-radius:14px;box-shadow:none}
.arena58.arena52 button.primary{background:#e7c990;border:1px solid #f3dba8;box-shadow:none;color:#18232c;text-shadow:none}
.arena58.arena52 button.quiet{background:#223343;border-color:#415568}
.arena58 .faction-emblem{width:34px;height:34px;max-width:34px;flex:none;object-fit:contain;vertical-align:middle}
.arena58 .faction-signature,.arena58 .start-faction{display:flex;align-items:center;gap:6px;font-size:12px;color:#d5e0e8}
.arena58 .faction-signature .faction-emblem{width:24px;height:24px}
.arena58 .faction-picker{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.arena58 .faction-picker>button{isolation:isolate;position:relative;display:flex;align-items:center;gap:8px;min-width:0;min-height:82px;overflow:hidden;border:1px solid #4b6172;border-radius:12px;padding:10px;background:#223343;color:white;text-align:left;font-size:14px;font-weight:650;text-shadow:0 1px 3px #000}
.arena58 .faction-picker>button::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#0d1728d9,#0d172845)}
.arena58 .faction-picker>button[aria-pressed=true]{border:2px solid #f0d3a0;padding:9px;box-shadow:0 0 0 2px #e7c99026}
.arena58 .faction-picker .faction-landscape{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.arena58 .faction-picker .faction-emblem{width:40px;height:48px;max-width:40px}
.arena58.arena52 .general-start{display:flex;flex-direction:column;flex:none;gap:12px;min-height:0;max-width:1000px;margin:0 auto;padding:14px 0}
.arena58 .start-heading{text-align:left}.arena58 .start-heading h1{font:650 clamp(25px,4vw,34px)/1.2 system-ui,sans-serif}
.arena58 .start-modes{align-self:flex-start;min-width:min(100%,380px)}
.arena58 .start-general-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.arena58 .start-general-options>button{flex-direction:row;justify-content:flex-start;text-align:left;min-height:68px;padding:5px 10px;gap:12px}
.arena58 .start-general-options b,.arena58 .start-general-options small{display:block}.arena58 .start-general-options small{font-size:12px;color:#c0cfdb;font-weight:400}
.arena58.arena52 .start-hero{position:relative;isolation:isolate;display:grid;grid-template-columns:240px minmax(0,1fr);grid-column:auto;grid-row:auto;gap:22px;flex:none;min-height:0;background:#1b2937;border-color:#41576a;border-radius:16px}
.arena58 .hero-landscape{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.32}
.arena58 .start-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#14232b10,#14232beb 48%)}
.arena58.arena52 .start-portrait{position:relative;display:flex;flex-direction:column;padding:12px;gap:6px;align-items:center;min-height:0}
.arena58.arena52 .start-portrait>.general-art{position:static;inset:auto;width:100%;height:290px;max-width:100%;max-height:none;object-fit:contain!important;object-position:center!important;border:0;border-radius:10px}
.arena58 .start-faction{position:static;justify-content:center;width:100%;font-size:13px}
.arena58 .start-description{padding:22px 24px 22px 0;gap:8px}.arena58 .start-description h2{font:600 clamp(30px,5vw,44px)/1.1 Georgia,serif}.arena58 .start-ability{border:0;padding:0;margin:6px 0;font-size:14px;max-width:580px}
.arena58 .general-exclusives{margin:0;padding:12px 14px;border:1px solid #3c5264;border-radius:12px;background:#192836}.arena58 .general-exclusives h3{font:600 16px system-ui,sans-serif}.arena58 .pool-rarities,.arena58 .pool-group>p{font-size:12px}
.arena58 #app .arena-layout{display:block;flex:none;min-height:0}.arena58 #app .arena-main{gap:12px;min-height:0}
.arena58.arena52 #app[data-phase] .arena-board{display:grid;grid-template-columns:minmax(0,.4fr) minmax(0,.6fr);grid-template-rows:auto;align-items:start;gap:20px;min-height:0;flex:none}
.arena58 #app .market-column,.arena58 #app .team-column{min-width:0;display:flex;flex-direction:column;gap:10px}
.arena58.arena52 #app .arena-board.arena-prepared{grid-template-columns:minmax(0,1fr);max-width:1080px;width:100%;margin:0 auto}
.arena58.arena52 #app[data-phase] .arena-board .panel{background:none;border:0;padding:0;margin:0;box-shadow:none}
.arena58 #app .market-heading,.arena58 #app .team .panel-title{margin-bottom:8px;min-height:30px}
.arena58 #app .market-heading h2,.arena58 #app .team .panel-title h2{font:650 18px/1.3 system-ui,sans-serif}
.arena58.arena52 #app[data-phase] .market .offers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;flex:none;align-items:start;grid-template-rows:auto;grid-auto-rows:auto}
.arena58.arena52 #app[data-phase] .market .offer:nth-child(3){grid-column:auto;width:100%;justify-self:stretch}
.arena58.arena52 #app[data-phase] .market .offer,.arena58.arena52 #app[data-phase] .arena-board .unit{background:#1b2a38;border:1px solid #536473;border-top:2px solid var(--rarity);border-radius:10px;box-shadow:none;min-width:0;min-height:0;display:flex;flex-direction:column;align-items:stretch;overflow:hidden;padding:0}
/* Explicitly neutralize inherited viewport heights and portrait cropping in every card surface. */
.arena58 .art,.arena58 #app .art,.arena58 dialog .art,.arena58 .formation-drag-ghost .portrait{height:auto!important;min-height:0!important;max-height:none!important;aspect-ratio:2/3!important;flex:none;width:100%;border:0;position:relative;overflow:hidden;background:#11202c;border-radius:8px}
.arena58 .art>.card-art-image{position:static!important;inset:auto!important;display:block;width:100%!important;height:auto!important;object-fit:contain!important;object-position:center!important;max-height:none}
.arena58.arena52 #app[data-phase] .market .offer>.body{padding:9px 7px;gap:5px;background:#1b2a38}
.arena58.arena52 #app[data-phase] .market .offer strong{font:600 13px/1.3 system-ui,sans-serif;text-align:left;min-height:0;overflow-wrap:anywhere}
.arena58.arena52 #app[data-phase] .market .offer .values{justify-content:flex-start;gap:6px;font-size:12px;flex-wrap:wrap}
.arena58.arena52 #app[data-phase] .market .offer .cost{top:6px;right:6px;padding:3px 6px;font-size:13px;min-width:0}
.arena58.arena52 #app[data-phase] .arena-board .team>.roster{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:auto;gap:8px;padding:0;align-items:start}
.arena58.arena52 #app[data-phase] .arena-board .team>.roster>:nth-child(5){grid-column:auto;width:100%;justify-self:stretch}
.arena58.arena52 #app[data-phase] .arena-board .unit .unit-body{padding:8px 5px;gap:5px;display:flex;flex-direction:column;min-width:0}
.arena58.arena52 #app[data-phase] .arena-board .unit .name{font:600 12px/1.25 system-ui,sans-serif;min-height:30px;text-align:left;overflow-wrap:anywhere}
.arena58.arena52 #app[data-phase] .arena-board .unit .values{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px 4px;font-size:12px;justify-content:start}
.arena58.arena52 #app[data-phase] .arena-board .unit .slot{position:static;order:-1;padding:0;background:none;border:0;font-size:10px;line-height:1.3;color:#c5d3df;text-align:left}
.arena58.arena52 #app[data-phase] .arena-board .unit .rank{font:600 11px system-ui,sans-serif;top:6px;right:6px;padding:2px 4px;min-width:20px;border-color:#9caeae;border-radius:4px}
.arena58.arena52 #app[data-phase] .arena-board .unit.selected{outline:3px solid #f4d49a;outline-offset:2px;border-color:#f4d49a}
.arena58.arena52 #app[data-phase] .arena-board .arena-empty-slot{min-height:140px!important;aspect-ratio:2/3;width:100%;background:#192936;border:1px dashed #405566;box-shadow:none;color:#98acbd;border-radius:10px}
.arena58 .arena-empty-slot b{font:500 22px system-ui,sans-serif;color:#94aabd}
.arena58 .formation-direction-label{font-size:11px;margin-bottom:8px;gap:8px}
.arena58 .reserve-bench{margin-top:14px;padding:10px;background:#172531;border:1px solid #344b5d;border-radius:12px}
.arena58 .reserve-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}.arena58 .reserve-heading h3{margin:0;font:600 13px system-ui,sans-serif}.arena58 .reserve-heading>span{font-size:10px;color:#adbecc}
.arena58 .reserve-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;align-items:stretch}
.arena58.arena52 #app[data-phase] .arena-board .reserve-slots>.unit{display:grid;grid-template-columns:50px minmax(0,1fr);align-items:start;border-top-width:1px}
.arena58.arena52 #app[data-phase] .arena-board .reserve-slots>.unit .unit-body{padding:5px;gap:3px}
.arena58.arena52 #app[data-phase] .arena-board .reserve-slots>.unit .name{font-size:11px;min-height:0}
.arena58.arena52 #app[data-phase] .arena-board .reserve-slots>.unit .values{font-size:10px;gap:2px}.arena58.arena52 #app[data-phase] .arena-board .reserve-slots>.unit .value img{width:10px;height:10px}
.arena58.arena52 #app[data-phase] .arena-board .reserve-slots>.unit .rank{right:auto;left:3px;top:3px;font-size:9px;min-width:0;padding:1px 3px}
.arena58 .reserve-empty{min-height:74px;display:grid;place-items:center;text-align:center;border:1px dashed #405568;border-radius:8px;color:#96aabd;font-size:11px}
.arena58 #app .arena-selection{padding:8px;margin-top:10px;border-radius:8px;background:#2a3d4c;font-size:12px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.arena58.arena52 #app[data-phase] .arena-actions{position:static;display:grid;grid-template-columns:minmax(96px,.6fr) minmax(0,1fr);gap:8px;min-height:0;padding:0;background:none}
.arena58 #app .arena-pacts{gap:8px;min-height:0}.arena58 #app .arena-pact{background:#223343;border:1px solid #46596b;min-height:50px;border-radius:10px}.arena58 #app .arena-pact strong{font-size:12px}
.arena58 #app .arena-pact-pair .portrait{width:24px!important}.arena58 #app .arena-pact-pair{align-items:center}.arena58 #app .arena-utilities{min-height:44px}.arena58 #app .arena-utilities .quick-arrange{background:#2a3d4d;box-shadow:none}
.arena58.arena52 #app .collection{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;padding:0 1px 18px}
.arena58 #app .collection-intro{padding:14px;margin-bottom:14px}.arena58 .collection-intro h2{font:650 25px system-ui,sans-serif}
.arena58.arena52 #app .collection-card{border:1px solid #526577;border-top:2px solid var(--rarity);background:#1b2937;border-radius:12px;box-shadow:none;contain:layout style;padding:0;display:flex;flex-direction:column;overflow:hidden}
.arena58.arena52 #app .collection-card .art{border-radius:0}.arena58.arena52 #app .collection-card .body{padding:10px;gap:5px;text-align:left}.arena58.arena52 #app .collection-card .body>strong{font:650 15px/1.25 system-ui,sans-serif}
.arena58.arena52 #app .collection-card .body>p{font-size:12px;margin:0}.arena58.arena52 #app .collection-card .values{gap:9px;font-size:13px;padding:3px 0;flex-wrap:wrap}
.arena58 #app .collection-progress{font-size:11px;color:#bfd0de;display:block;padding-top:4px}.arena58 #app .collection-card .development-track{display:none}.arena58 #app .collection-card .development-mark{min-height:0}
.arena58.arena52 #app .upgrade-ready-ribbon{position:static;order:0;background:#a0e2c1;color:#112b25;font-size:11px;padding:4px;letter-spacing:0}
.arena58 #app .collection-card .upgrade-badge{font-size:10px;left:7px;bottom:7px;top:auto;padding:2px 5px}.arena58 #app .collection-card .upgrade-badge b{font-size:13px}
.arena58.arena52 #app .collection-card>.rarity-label{top:7px;right:7px;font-size:9px;padding:3px 5px;min-height:0}
.arena58.arena52 .quests-screen{display:flex;flex-direction:column;flex:none;gap:12px;min-height:0;max-width:1000px;padding:14px 0}
.arena58 .quest-heading{text-align:left}.arena58 .quest-heading h1{font:650 30px/1.2 system-ui,sans-serif}
.arena58 .quest-general-hero,.arena58 .quest-season-hero{background:#213442;min-height:0;padding:12px 16px;gap:16px;border-color:#40596c}
.arena58 .quest-general-hero h2,.arena58 .quest-season-hero h2{font:650 24px/1.2 system-ui,sans-serif}
.arena58.arena52 .quest-general-hero .general-art{width:64px;height:96px;object-fit:contain!important}.arena58 .quest-general-tabs{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:8px}
.arena58.arena52 .quest-cards{display:flex;flex-direction:column;flex:none;min-height:0;gap:9px}
.arena58.arena52 .quest-card{display:grid;grid-template-columns:minmax(0,1fr) 85px;flex:none;min-height:96px;gap:16px;padding:14px 16px;background:#213342;border:1px solid #455d70;box-shadow:none}
.arena58.arena52 .quest-card.complete{background:#294337;border-color:#79b69b}
.arena58 .quest-copy>strong{font-size:15px}.arena58 .quest-copy>span:not(.quest-meter){font-size:12px}.arena58 .quest-meter{height:18px;margin-top:3px;border:0;border-radius:5px;background:#10212d}.arena58 .quest-meter b{font-size:11px;line-height:18px}
.arena58 .quest-meter i{background:#5faebb}.arena58 .quest-reward{align-self:center;padding:9px 6px;border:0;border-radius:8px;background:#2d4252;gap:4px}.arena58 .quest-reward strong{font-size:12px}.arena58 .quest-reward small{font-size:10px}
.arena58 .quest-milestones span{border:1px solid #3f5668;border-radius:9px;background:#1b2c3a;padding:9px 5px}.arena58 .quest-reset{margin:0}.arena58 #quest-help{align-self:flex-start;padding:8px 12px}
.arena58 .faction-profile{position:relative;background:#1b2937;border:1px solid #43596b;border-radius:12px;overflow:hidden;padding:16px}.arena58 .faction-profile-landscape{width:calc(100% + 32px);height:130px;object-fit:cover;margin:-16px -16px 12px}.arena58 .faction-profile h3{display:flex;align-items:center;gap:8px;font:650 22px system-ui,sans-serif}
.arena58 .faction-card-label{display:flex;align-items:center;gap:8px;font-size:12px}.arena58 .faction-card-label .faction-emblem{width:30px;height:34px}
.arena58 dialog .detail-art{max-width:300px;margin:12px auto}.arena58 dialog .general-banner{background:#233544;border-color:#4b6275}.arena58 dialog .general-banner .faction-signature{margin-bottom:4px}
.arena58 .exclusive-card .portrait{width:44px!important}.arena58 .reserve-picker .portrait,.arena58 .exchange-choices .portrait{width:42px!important}.arena58 .preview-member>.portrait{width:60px!important}.arena58 .formation-pact-art>.portrait{width:35px!important}.arena58 .formation-reserve .portrait{width:40px!important}
@media(max-width:1100px){.arena58.arena52 #app .collection{grid-template-columns:repeat(4,minmax(0,1fr))}.arena58.arena52 #app[data-phase] .arena-board{grid-template-columns:minmax(0,.38fr) minmax(0,.62fr);gap:14px}.arena58 .reserve-slots{gap:5px}.arena58.arena52 #app[data-phase] .arena-board .reserve-slots>.unit{grid-template-columns:42px minmax(0,1fr)}}
@media(max-width:850px){.arena58.arena52 #app[data-phase] .arena-board{grid-template-columns:minmax(0,1fr);gap:16px}.arena58.arena52 #app .collection{grid-template-columns:repeat(3,minmax(0,1fr))}.arena58.arena52 #app[data-phase] .market .offer>.art{max-width:100%;width:100%}.arena58 #app .market-column{max-width:580px;align-self:start;width:100%}.arena58 #app .arena-identity{min-height:54px;padding-bottom:6px}.arena58 .faction-picker>button{min-height:76px;font-size:12px;gap:5px;padding:8px}.arena58 .faction-picker .faction-emblem{width:30px;height:40px}.arena58 .faction-picker>button[aria-pressed=true]{padding:7px}}
@media(max-width:540px){.arena58.arena52 .general-start,.arena58.arena52 .quests-screen{min-height:0;gap:10px}.arena58 .faction-picker{grid-template-columns:repeat(2,minmax(0,1fr))}.arena58 .faction-picker>button{min-height:72px;font-size:13px}.arena58.arena52 .start-hero{grid-template-columns:125px minmax(0,1fr);gap:10px}.arena58.arena52 .start-portrait{padding:10px 0 10px 8px}.arena58.arena52 .start-portrait>.general-art{height:205px}.arena58 .start-description{padding:16px 12px 16px 0;gap:6px}.arena58 .start-description h2{font-size:30px}.arena58 .start-description>.eyebrow{font-size:9px}.arena58 .start-ability{font-size:12px;line-height:1.45}.arena58 .start-faction{font-size:10px;gap:3px}.arena58 .start-faction .faction-emblem{width:22px;height:26px}.arena58 .start-general-options>button{gap:6px;padding:5px;font-size:12px}.arena58 .start-general-options small{font-size:10px}.arena58 .start-bottom{font-size:10px}
.arena58.arena52 #app .collection{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.arena58.arena52 #app .collection-card .body{padding:9px}.arena58.arena52 #app[data-phase] .arena-board .team>.roster{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.arena58.arena52 #app[data-phase] .arena-board .team>.roster>:nth-child(5){grid-column:auto;width:100%}.arena58.arena52 #app[data-phase] .arena-board .unit .name{font-size:12px}.arena58 .reserve-slots{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.arena58.arena52 #app[data-phase] .arena-board .reserve-slots>.unit{display:flex;flex-direction:column}.arena58.arena52 #app[data-phase] .arena-board .reserve-slots>.unit>.portrait{width:60px;margin:0 auto}.arena58 .reserve-empty{min-height:90px}.arena58 .quest-card{gap:10px;padding:12px;grid-template-columns:minmax(0,1fr) 70px}.arena58 .quest-footnote{text-align:left}.arena58 .collection-wallet>strong{font-size:17px}.arena58 .collection-wallet>button{font-size:12px}
}
@media(prefers-reduced-motion:reduce){.arena58 *{scroll-behavior:auto!important}}

.arena58 .art.rank-upgraded::after,.arena58 .art.rank-mastered::after{content:none}

/* Dornzahn trap state remains visible in compact combat cards. */
.battle-trap{display:block;font-size:.66rem;line-height:1.25;padding:.15rem .25rem;border-radius:4px;background:#37412a;color:#ddecaa}.battle-trap.spent{background:#30342c;color:#b3b8a9}.fx-trap .fx-burst,.fx-trap_ready .fx-burst{color:#d7bf72}