/* Test76.1: viewport layout, loaded after all historical styles. No device model sizes. */
body.arena75.arena74.arena52.arena58 nav.ui-navigation button>span:not(.quest-alert){font-size:clamp(10px,2.7vw,12px);line-height:1.2;display:block;width:100%;min-width:0;white-space:nowrap;letter-spacing:0}
body.arena75.arena74.arena52.arena58 nav.ui-navigation[hidden]{display:none!important}
/* Pool previews were horizontal rows whose images inherited width:100%. */
body.arena75.arena74.arena52.arena58 .general-pool-grid{grid-template-columns:repeat(auto-fit,minmax(min(145px,100%),1fr));gap:10px}
body.arena75.arena74.arena52.arena58 .general-pool-grid article,
body.arena75.arena74.arena52.arena58 #app .collection-card{display:flex;flex-direction:column;align-items:stretch;gap:0;min-width:0;padding:0;overflow:hidden;border-radius:12px}
body.arena75.arena74.arena52.arena58 .general-pool-grid article>.art{width:100%;height:auto!important;aspect-ratio:2/3!important;margin:0;flex:none;border-radius:10px 10px 0 0}
body.arena75.arena74.arena52.arena58 .general-pool-grid article>span{display:flex;flex-direction:column;width:100%;min-width:0;gap:5px;padding:10px;background:#1b2a3a}
body.arena75.arena74.arena52.arena58 .general-pool-grid b{font-size:13px;line-height:1.3;overflow-wrap:normal;word-break:normal;hyphens:auto}
body.arena75.arena74.arena52.arena58 .general-pool-grid small{font-size:11px;line-height:1.4;overflow-wrap:break-word}
body.arena75.arena74.arena52.arena58 #app .collection-card .body{width:100%;min-width:0;flex:none;overflow-wrap:break-word}
/* A game gets the full safe viewport. Home/collection keep their navigation. */
body.arena75.arena74.arena52.arena58:has(#app[data-game-active=true]) .wrap{padding-top:max(8px,env(safe-area-inset-top));padding-bottom:max(8px,env(safe-area-inset-bottom))}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true][data-combat-viewport=true]{inset:max(8px,env(safe-area-inset-top)) max(10px,calc((100vw - 1280px)/2)) max(8px,env(safe-area-inset-bottom))}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .hud{display:flex;align-items:center;gap:6px;min-height:44px;flex:none;margin:0;padding:0}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .hud .metric{flex:1;min-width:0;margin:0;padding:0 4px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .hud #game-menu{width:44px;height:44px;flex:none}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .hud .arena-league{margin-left:auto}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .tutorial-guide{margin:0;padding:5px 8px;flex:none}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .tutorial-guide .guide-crest,
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .tutorial-guide #tutorial-short{display:none}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .tutorial-guide .guide-top{min-height:44px;margin:0;gap:6px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .tutorial-guide .guide-heading strong{font-size:12px;line-height:1.2}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .tutorial-guide .guide-help{min-width:44px;min-height:44px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .ui-battle #next{position:relative;flex:0 0 auto;min-height:48px;height:auto;padding:10px;margin:0;z-index:2}
/* Preparation uses the remaining height; images shrink before actions or card names. */
body.arena75.arena74.arena52.arena58:has(#app[data-screen=arena][data-game-active=true]:is([data-phase=draft],[data-phase=prepare])){overflow:hidden}
body.arena75.arena74.arena52.arena58 #app[data-screen=arena][data-game-active=true]:is([data-phase=draft],[data-phase=prepare]){position:fixed;inset:max(8px,env(safe-area-inset-top)) max(10px,calc((100vw - 1080px)/2)) max(8px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:6px;min-height:0;width:auto;overflow:hidden}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-identity{flex:none;min-height:0;height:48px;margin:0;gap:6px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-identity>button{min-height:44px;height:48px;padding:2px 8px;gap:6px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-identity .general-art{height:40px;width:28px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-identity strong{font-size:13px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-identity small{font-size:10px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true]:has(.ui-preparation) .arena-layout,
body.arena75.arena74.arena52.arena58 #app[data-game-active=true]:has(.ui-preparation) .arena-main{display:flex;flex:1 1 0;flex-direction:column;min-height:0;overflow:hidden}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .ui-preparation{display:flex;flex:1 1 0;min-height:0;gap:6px;padding:0}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .ui-arena-toolbar{flex:none;min-height:44px;height:44px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-board{display:grid;flex:1 1 0;min-height:0;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(165px,.9fr) minmax(250px,1.1fr);gap:8px;overflow:auto;overscroll-behavior:contain;padding:2px 3px 5px;align-items:stretch}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-board.arena-prepared{grid-template-rows:minmax(250px,1fr)}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-board>:is(.market-column,.team-column){min-height:0;gap:5px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-board :is(.market,.team){display:flex;flex:1 1 0;flex-direction:column;min-height:0;gap:3px;padding:0;margin:0}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] :is(.market-heading,.team .panel-title){flex:none;min-height:26px;height:26px;margin:0}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .team .panel-title{padding-right:44px;position:relative}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .band-help{position:absolute;right:0;top:-6px;width:44px;height:44px;padding:10px;z-index:1}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .market .offers,
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .team>.roster{flex:1 1 0;grid-template-rows:minmax(0,1fr);min-height:0;height:auto;gap:5px;align-items:stretch}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .market .offer,
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .team>.roster>.unit{min-height:0;height:100%;display:flex;flex-direction:column}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .market .offer>.art,
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .team>.roster>.unit>.portrait{position:relative;flex:1 1 0!important;height:0!important;min-height:0!important;aspect-ratio:auto!important;width:100%}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-board .art>.card-art-image{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center 20%!important}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .market .offer .body{flex:none;padding:5px 6px;gap:3px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .offer .body>strong{font-size:12px;line-height:1.15;min-height:2.3em;overflow-wrap:break-word}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .offer .values{font-size:11px;gap:2px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .offer.empty{min-height:0}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .team .unit-body{flex:none;padding:4px 3px;gap:2px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .team .unit .name{font-size:10px;line-height:1.2;min-height:2.4em}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-board .unit .values{font-size:10px;gap:1px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-empty-slot{min-height:0}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .formation-direction-label{flex:none;font-size:9px;margin:0}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .reserve-bench{flex:none;padding-top:3px;margin-top:2px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .reserve-heading{margin:0 0 2px;line-height:1.15}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .reserve-empty{min-height:30px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-board .reserve-slots>.unit{min-height:44px;padding:2px 4px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-board .reserve-slots>.unit>.portrait{width:26px!important;height:36px!important;aspect-ratio:auto!important;flex:none!important}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .reserve-slots .unit .name{min-height:0}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-pacts{flex:none;gap:5px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-pact{min-height:44px;height:44px;min-width:0;overflow:hidden;padding:4px 6px;gap:5px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-pact>span:last-child{min-width:0}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-pact strong{font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-pact-pair .portrait{width:20px!important;height:30px!important;aspect-ratio:auto!important}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .ui-action-dock{position:static;inset:auto;transform:none;flex:none;width:100%;min-height:56px;margin:0;padding:5px;gap:6px;grid-template-columns:62px 68px minmax(0,1fr)}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .ui-action-dock:not(:has(#refill)){grid-template-columns:68px minmax(0,1fr)}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .ui-action-dock button{min-height:44px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-support{display:none}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-support[open]{display:block;position:fixed;inset:max(8px,env(safe-area-inset-top)) 10px max(8px,env(safe-area-inset-bottom));z-index:55;overflow:auto;margin:0;background:#14232f;padding:12px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .entry-tip{flex:none;margin:0;padding:5px 8px;font-size:11px}
body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .entry-tip p{margin:2px 0}
/* Treasure essentials first; optional explanations remain available on demand. */
body.arena75.arena74.arena52.arena58 #app .treasure-header{padding:12px;margin-bottom:12px}
body.arena75.arena74.arena52.arena58 #app .treasure-header h1{font-size:clamp(22px,5vw,32px);margin:3px 0 8px}
body.arena75.arena74.arena52.arena58 #app .treasure-wallet{display:grid;grid-template-columns:1fr 1fr auto;gap:6px;margin:0;padding:8px 0 0;align-items:center}
body.arena75.arena74.arena52.arena58 #app .treasure-wallet>div{min-width:0;gap:4px}
body.arena75.arena74.arena52.arena58 #app .treasure-wallet .currency-art74{width:40px;height:40px}
body.arena75.arena74.arena52.arena58 #app .treasure-wallet strong{font-size:20px;line-height:1.2}
body.arena75.arena74.arena52.arena58 #app .treasure-wallet small{font-size:10px}
body.arena75.arena74.arena52.arena58 #app .treasure-wallet>button{width:auto;margin:0;padding:6px;font-size:11px}
body.arena75.arena74.arena52.arena58 #app .treasure-inventory>.panel-title{display:grid;grid-template-columns:1fr auto;gap:3px 8px;margin:0 0 10px}
body.arena75.arena74.arena52.arena58 #app .treasure-inventory h2{font-size:18px}
body.arena75.arena74.arena52.arena58 #app #chest-summary{grid-column:1;font-size:11px}
body.arena75.arena74.arena52.arena58 #app #claim-ready-chests{grid-column:2;grid-row:1/3;margin:0;padding:6px 10px;font-size:12px}
body.arena75.arena74.arena52.arena58 #app .chest-grid{grid-template-columns:repeat(auto-fit,minmax(min(155px,100%),1fr));gap:10px}
body.arena75.arena74.arena52.arena58 #app .chest-card{padding:10px;gap:4px}
body.arena75.arena74.arena52.arena58 #app .chest-card>.premium-chest{width:100%;height:clamp(80px,15svh,150px);aspect-ratio:auto;margin:0 auto}
body.arena75.arena74.arena52.arena58 #app .chest-card h3{font-size:16px;margin:0}
body.arena75.arena74.arena52.arena58 #app .chest-yield{font-size:12px;gap:2px;margin:0}
body.arena75.arena74.arena52.arena58 #app .chest-time{font-size:12px;margin:4px 0}
body.arena75.arena74.arena52.arena58 #app .chest-card progress{margin:0 0 5px}
body.arena75.arena74.arena52.arena58 #app .chest-card details{margin:0}
body.arena75.arena74.arena52.arena58 #app .chest-card summary{padding:6px 0;font-size:11px}
body.arena75.arena74.arena52.arena58 #app .treasure-milestone{margin:12px 0;padding:12px;gap:6px}
body.arena75.arena74.arena52.arena58 #app .treasure-milestone h2{font-size:15px}
body.arena75.arena74.arena52.arena58 #app .treasure-milestone p{font-size:11px;margin:4px 0}
body.arena75.arena74.arena52.arena58 #app .treasure-milestone progress{margin:0}
body.arena75.arena74.arena52.arena58 #app .treasure-help{padding:0 12px}
@media(max-width:359px){body.arena75.arena74.arena52.arena58 #app .treasure-wallet{grid-template-columns:1fr 1fr}body.arena75.arena74.arena52.arena58 #app .treasure-wallet>button{grid-column:1/-1}}
@media(orientation:landscape) and (max-height:600px){
 body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .arena-identity{display:none}
 body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .ui-arena-toolbar{position:absolute;right:0;top:-50px;width:44px}
 body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .ui-preparation-label{display:none}
 body.arena75.arena74.arena52.arena58 #app[data-game-active=true] .hud{padding-right:50px}
}