/* 1.3.1 cockpit: sized around an undistorted 5:3 playfield. */
.hero-thumb.hero-locked canvas,.crew-locked .art-portrait{filter:grayscale(1) brightness(.42)}
.hero-lock-label{display:block;color:#b2bfcd;font:12px Bahnschrift,Arial;margin-top:3px}.hero-locked{border-color:#566371!important}.crew-locked .unit-cost{color:#aab8c9!important}
.game-shell{--roster:clamp(320px,22vw,400px);--top:78px;background:#06111c}.game-shell.wide-roster{--roster:clamp(390px,29vw,530px)}
.game-shell .game-top{height:var(--top);padding:8px 16px;gap:12px;display:flex;background:#0a1825 url('/assets/console-metal-v2.png') center/100% 390%;border-bottom:1px solid #4d8b9a;box-shadow:0 3px 14px #0008;overflow:visible}
.game-top .life-value,.game-top .cash-value{display:flex;align-items:center;gap:8px;min-width:120px;white-space:nowrap;margin:0;font-size:27px;text-shadow:0 2px 3px #000;flex-shrink:0}
.game-top .hud-emblem{width:48px;height:48px;filter:drop-shadow(0 0 5px #20d2ed44);flex:none}.hud-number{display:flex;flex-direction:column;gap:1px}.hud-number strong{font:800 27px Bahnschrift,Arial}.hud-number small{font:10px Bahnschrift,Arial;color:#8fbbcd;letter-spacing:2px}
.game-top .wave{margin-left:auto;display:flex;gap:7px;align-items:baseline;justify-content:center;min-width:100px;font:800 27px Bahnschrift,Arial;background:#071825;border:1px solid #427685;border-radius:5px;padding:8px 12px}.game-top .wave small{font:12px Bahnschrift,Arial;color:#99c9d4}
.game-top button{min-height:42px;padding:8px 12px;font-size:13px;border:1px solid #4b92a5;box-shadow:inset 0 1px #9ce8ee33,0 2px 3px #0008;background:#102d40}.game-top .crew-toggle{color:#a9f5ff;white-space:nowrap}.game-top .square.small{display:block;width:42px;height:42px;flex:0 0 42px;font-size:23px}
.game-shell .game-layout{display:grid;grid-template-columns:minmax(0,1fr) var(--roster);position:relative;flex:1;min-height:0;overflow:hidden}.game-shell.roster-hidden .game-layout{grid-template-columns:minmax(0,1fr) 0}.game-shell.roster-hidden .roster{visibility:hidden;pointer-events:none;transform:translateX(100%)}
.game-shell .arena{position:relative;inset:auto;display:flex;align-items:center;justify-content:center;padding:0 0 55px;background:#06121e;min-width:0;min-height:0}.game-shell .arena:before{display:none}
.game-shell .battle{position:relative;inset:auto;width:100%;max-width:calc((100dvh - var(--top) - 55px)*5/3);height:auto!important;max-height:none;aspect-ratio:5/3!important;margin:0;flex:0 0 auto;border:1px solid #365e71;box-shadow:0 0 24px #0009}.game-shell .battle canvas{width:100%;height:100%;object-fit:contain}
.game-shell .roster{position:relative;inset:auto;width:var(--roster);height:100%;padding:12px;display:flex;flex-direction:column;gap:8px;min-height:0;background:#0b1c2a url('/assets/console-metal-v2.png') center/100% 100%;border:0;border-left:1px solid #538b9a;box-shadow:-8px 0 18px #0007;transition:transform .18s ease;overflow:hidden}
.game-shell .roster-title{height:auto;min-height:38px;padding:3px 4px;flex:none}.game-shell .roster-title h2{font:800 23px Bahnschrift,Arial;letter-spacing:3px}.game-shell .roster-title>button{min-height:32px;height:auto;padding:5px 10px;font-size:11px}
.game-shell .crew-filter{display:flex;flex-direction:column;gap:5px;min-width:0;flex:none}.game-shell .crew-category-tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;width:100%;max-width:100%;height:auto;min-height:32px;padding:2px 2px 5px;margin:0;gap:4px;scrollbar-width:thin;scrollbar-color:#388c9a transparent}.game-shell .crew-category-tabs button{height:auto;min-height:27px;padding:5px 8px;font:11px Bahnschrift,Arial;flex:0 0 auto;white-space:nowrap}.game-shell .crew-category-tabs button.selected{outline:1px solid #93f3f3;outline-offset:-1px}
.game-shell .wave-intel{margin:0;padding:7px 10px;border:1px solid #335765;background:#07141e;min-height:35px;display:flex;justify-content:space-between;gap:8px;align-items:center;border-radius:3px;font-size:10px;flex:none}.wave-intel b{color:#95e5eb;letter-spacing:1px}.wave-intel span{text-align:right;color:#c9dce3}
.game-shell .dock{overflow:auto;min-height:0;flex:1;padding:3px 4px 6px;scrollbar-width:thin;scrollbar-color:#3e7889 transparent}.game-shell .roster-pair,.game-shell.wide-roster .roster-pair{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.game-shell .roster-group{margin:0 0 12px}.game-shell .roster-group>h3{font:12px Bahnschrift,Arial;text-align:left;padding:7px 3px;border:0;border-bottom:1px solid #4b7780;background:#07111eaa;border-radius:0}.game-shell .roster-group>h3 svg{width:19px;height:19px}
.game-shell .roster .hero-button{height:92px;min-height:92px;display:grid;grid-template-columns:80px 1fr;grid-template-rows:1fr 1fr;align-items:center;padding:5px 10px;position:relative}.game-shell .roster .hero-button>.hero-art{position:static;width:74px;height:80px;max-height:none;grid-row:1/3;grid-column:1}.game-shell .roster .hero-button>.unit-name,.game-shell .roster .hero-button>.unit-cost{position:static;width:auto;grid-column:2;font-size:13px}
.game-shell .roster .crew-illustration{aspect-ratio:1.05}.game-shell .roster .crew-card-footer{min-height:56px;padding:6px 5px;gap:5px}.game-shell .roster .crew-card-footer .unit-name{font:800 12px/1.15 Bahnschrift,Arial}.game-shell .roster .crew-card-role{font-size:9px}.game-shell .roster .crew-card-footer .crew-symbol{width:20px;height:20px}.game-shell .roster .crew-card-meta .unit-cost{font-size:13px}
.game-shell .match-tools{display:grid;grid-template-columns:1fr 100px;gap:8px;padding:8px 2px 2px;flex:none;border-top:1px solid #3b7280;background:none}.game-shell .match-tools .left{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-flow:row;gap:5px;margin:0}.game-shell .match-tools .left>button{height:38px;min-height:38px;min-width:0;padding:4px;font-size:12px}.game-shell .match-tools .left>.gift-button{grid-column:1/-1;font-size:10px;height:32px;min-height:32px}.game-shell .roster .gift-button::after{display:none}.game-shell .match-tools #wave-button{height:100%;min-height:64px;font-size:25px;background:#174454;border:1px solid #60d8d7;box-shadow:inset 0 0 15px #42e5dc20,0 2px #030e18;padding:7px}.game-shell .match-tools #wave-button small{display:block;font:10px Bahnschrift,Arial;letter-spacing:1px;margin-top:4px}
.game-shell .side-panel{left:10px;right:auto;top:10px;transform:none;width:min(325px,calc(100% - 20px));max-height:calc(100% - 65px);padding:12px;background:#0c2030 url('/assets/console-metal-v2.png') center/100% 100%;border:1px solid #5b9aaa;outline:0;border-radius:6px;box-shadow:6px 0 20px #0009;animation:console-in .18s ease-out}.game-shell .abilities{position:absolute;left:10px;right:10px;bottom:8px;max-height:48px;overflow-x:auto;flex-wrap:nowrap}.game-shell #match-log{display:none}.game-shell .battle-status{font:12px Bahnschrift,Arial;left:8%;right:8%;top:10px;padding:7px;background:#061723cc;border:1px solid #5cc7cc66;backdrop-filter:blur(3px)}
@keyframes console-in{from{transform:translateX(-30px);opacity:0}to{transform:translateX(0);opacity:1}}
@media(max-width:1000px){.game-shell{--roster:280px;--top:64px}.game-shell.wide-roster{--roster:350px}.game-shell .game-top{gap:7px;padding:6px 8px}.game-top .life-value,.game-top .cash-value{min-width:80px;gap:4px}.game-top .hud-emblem{width:36px;height:36px}.hud-number strong{font-size:22px}.hud-number small{font-size:8px;letter-spacing:1px}.game-top .wave{min-width:80px;font-size:22px;padding:6px}.game-top button{padding:6px;font-size:11px}.game-top .square.small{width:34px;height:34px;flex-basis:34px;min-height:34px}.game-shell .roster{padding:9px}.game-shell .roster .crew-card-footer .unit-name{font-size:11px}.game-shell .roster .crew-card-role{font-size:8px}}
@media(max-height:550px) and (orientation:landscape){.game-shell{--top:51px;--roster:245px}.game-shell.wide-roster{--roster:320px}.game-shell .arena{padding-bottom:30px}.game-shell .battle{max-width:calc((100dvh - var(--top) - 30px)*5/3)}.game-shell .roster{padding:6px;gap:4px}.game-shell .roster-title{min-height:26px;padding:0 3px}.game-shell .roster-title h2{font-size:17px}.game-shell .roster-title>button{min-height:24px;font-size:9px}.game-shell .crew-category-tabs{min-height:25px;padding:1px 1px 3px}.game-shell .crew-category-tabs button{min-height:22px;font-size:9px;padding:3px 6px}.game-shell .wave-intel{min-height:27px;padding:4px 6px;font-size:9px}.game-shell .match-tools{grid-template-columns:1fr 78px;padding-top:4px;gap:5px}.game-shell .match-tools .left>button{min-height:30px;height:30px}.game-shell .match-tools #wave-button{min-height:44px;font-size:20px}.game-shell .abilities{max-height:28px;bottom:1px}.game-shell .side-panel{max-height:calc(100% - 34px);top:4px;width:290px}.game-shell .battle-status{font-size:10px;top:4px;padding:4px}.game-shell .roster .hero-button{height:70px;min-height:70px;grid-template-columns:60px 1fr}.game-shell .roster .hero-button>.hero-art{width:56px;height:62px}.game-shell .roster .hero-button>.unit-name,.game-shell .roster .hero-button>.unit-cost{font-size:11px}.game-shell .roster .crew-card-footer{min-height:45px}.game-shell .roster .crew-card-footer .unit-name{font-size:10px}}
@media(max-width:650px) and (orientation:portrait){.game-shell{--top:103px;--roster:100%}.game-shell .game-top{height:103px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:43px 36px;gap:5px;padding:7px 8px}.game-top .life-value{grid-column:1/3;grid-row:1}.game-top .cash-value{grid-column:3/5;grid-row:1}.game-top .wave{grid-column:5/7;grid-row:1;margin:0;min-width:0;gap:4px}.game-top .crew-toggle{grid-column:1/3;grid-row:2}.game-top [data-action=xp-menu]{grid-column:3;grid-row:2;font-size:9px;padding:4px}.game-top .square.small{width:100%;height:36px;min-height:36px;margin:0;display:block}.game-top button{min-height:36px}.game-top .life-value,.game-top .cash-value{min-width:0}.game-top .hud-emblem{width:32px;height:32px}.hud-number strong{font-size:22px}.game-top .wave small{font-size:9px}.game-shell .game-layout{display:block}.game-shell .arena{position:absolute;inset:0;display:block;padding:0}.game-shell .battle{position:absolute;top:0;left:0;width:100%;max-width:none;height:auto!important;aspect-ratio:5/3!important}.game-shell .roster,.game-shell.wide-roster .roster{position:absolute;top:calc(60vw + 5px);bottom:0;right:0;width:100%;height:auto;border-left:0;border-top:1px solid #6ba3af;padding:8px 10px;gap:5px}.game-shell .roster-title{min-height:28px}.game-shell .roster-title h2{font-size:19px}.game-shell .crew-filter{flex-direction:row;gap:7px}.game-shell .crew-category-tabs{min-width:0;flex:1;min-height:31px}.game-shell .wave-intel{min-height:28px;font-size:9px;padding:5px 7px}.game-shell .roster .hero-button{height:75px;min-height:75px}.game-shell .roster .hero-button>.hero-art{height:68px}.game-shell .roster-pair{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.game-shell .roster .crew-card-footer .unit-name{font-size:9px}.game-shell .roster .crew-card-role{font-size:7px}.game-shell .roster .crew-card-footer{min-height:48px}.game-shell .match-tools{grid-template-columns:1fr 100px;padding-top:5px}.game-shell .match-tools #wave-button{min-height:46px;font-size:20px}.game-shell .side-panel{top:calc(60vw + 5px);left:0;right:0;bottom:0;width:100%;max-height:none;border-radius:0;z-index:8}.game-shell .abilities{top:calc(60vw - 30px);bottom:auto;left:4px;right:4px;max-height:28px;z-index:2}.game-shell .battle-status{font-size:9px;top:4px;padding:4px;left:3%;right:3%}.game-shell.roster-hidden .roster{transform:translateX(100%)}.game-shell .side-panel .selected-portrait{max-height:135px}.game-shell .side-panel .selected-portrait canvas{height:100px}.game-shell .roster .crew-card-meta .unit-cost{font-size:11px}}
@media(prefers-reduced-motion:reduce){.game-shell .roster,.game-shell .side-panel{transition:none;animation:none}}

/* Full labels live in compact popovers instead of clipped scroll strips. */
.game-shell .crew-filter{flex-direction:row;position:relative;align-items:stretch;gap:4px;z-index:12}
.dock-availability{flex:1;min-width:0}.dock-availability button{width:100%;height:30px;padding:4px;font-size:10px}
.dock-filter{flex:none}.dock-filter summary{list-style:none;cursor:pointer;border:1px solid #4b92a5;background:#102d40;padding:8px 6px;font:10px Bahnschrift,Arial;border-radius:4px}.dock-filter summary:after{content:' ▾';color:#6ee8ed}.dock-filter[open] summary{background:#24556a}
.game-shell .dock-filter .crew-category-tabs{position:absolute;right:0;top:35px;display:flex;flex-wrap:wrap;overflow:visible;height:auto;min-height:0;max-height:none;background:#071c2af5;border:1px solid #59a2ae;box-shadow:0 8px 18px #0009;border-radius:5px;padding:9px;gap:6px;z-index:20}
.game-shell .dock-filter .crew-category-tabs button{flex:1 0 26%;white-space:normal;min-height:32px;padding:6px}
.game-shell .roster .crew-illustration{aspect-ratio:9/7}
.hero-picker .hero-thumb{height:auto;min-height:133px;padding-bottom:7px}.hero-lock-label{font-size:11px;line-height:1.3}
@media(max-height:550px) and (orientation:landscape){.dock-filter summary{font-size:9px;padding:7px 4px}.dock-availability button{font-size:9px;height:28px}.game-shell .dock-filter .crew-category-tabs{top:31px}.game-shell .dock-filter .crew-category-tabs button{min-height:27px;font-size:10px;padding:4px}}

@media(max-width:380px) and (orientation:portrait){.game-top [data-action=xp-menu]{font-size:0;min-width:0;width:100%;padding:2px}.game-top [data-action=xp-menu]::after{content:'XP';font:800 12px Bahnschrift,Arial}.game-shell .roster-title{min-height:23px}.game-shell .roster-title h2{font-size:16px}}
@media(max-height:680px) and (orientation:portrait){.game-shell .wave-intel{display:none}.game-shell .category-hero>h3{display:none}.game-shell .roster .hero-button{height:42px;min-height:42px;grid-template-columns:38px 1fr 55px;grid-template-rows:1fr;padding:1px 6px}.game-shell .roster .hero-button>.hero-art{width:34px;height:40px;grid-row:1}.game-shell .roster .hero-button>.unit-name{font-size:10px}.game-shell .roster .hero-button>.unit-cost{grid-column:3;font-size:10px}.game-shell .roster-title>button{min-height:23px;padding:3px 6px}.game-shell .match-tools .left>.gift-button{height:25px;min-height:25px}.game-shell .roster-group{margin-bottom:6px}}

@media(max-height:680px) and (orientation:portrait){.game-shell .dock{display:flex;gap:6px;overflow-x:auto;overflow-y:hidden;align-items:stretch;padding:2px}.game-shell .dock .roster-group,.game-shell .dock .roster-pair{display:contents}.game-shell .dock .roster-group>h3{display:none}.game-shell .dock .unit-button{flex:0 0 90px;max-width:90px;margin:0;min-height:0;height:100%;align-self:stretch}.game-shell .dock .hero-button{display:flex;flex-direction:column;justify-content:center;gap:2px;padding:3px}.game-shell .dock .hero-button>.hero-art{height:48px;width:40px}.game-shell .dock .hero-button>.unit-name{font-size:9px}.game-shell .dock .hero-button>.unit-cost{font-size:10px}.game-shell .dock .crew-illustration{height:52px;aspect-ratio:auto;flex:none}.game-shell .dock .art-portrait{object-fit:contain}.game-shell .dock .crew-card-footer{min-height:25px;padding:3px 2px;gap:2px}.game-shell .dock .crew-card-footer .unit-name{font-size:8px}.game-shell .dock .crew-card-role{display:none}.game-shell .dock .crew-card-footer .crew-symbol{width:13px;height:13px}.game-shell .dock .crew-card-meta{height:18px;min-height:18px;padding:2px}.game-shell .dock .crew-card-meta .unit-cost{font-size:10px}}

@media(max-height:680px) and (orientation:portrait){.game-shell .dock h3{display:none!important}.game-shell .dock .crew-illustration{height:42px}.game-shell .dock .crew-card-footer{min-height:22px}.game-shell .dock .crew-card-meta{padding:1px;min-height:15px;height:15px}.game-shell .dock .unit-button{overflow:hidden}}
