[hidden]{display:none!important}main{padding-bottom:38px}header{height:86px}.arena{max-height:calc(100vh - 135px);min-height:350px}.alpha-build{position:fixed;right:22px;bottom:12px;z-index:20;font-size:11px;font-weight:900;letter-spacing:2.5px;color:#162344;background:#f5f3ebed;padding:6px 9px;border-left:3px solid #cd483a;pointer-events:none}.menu-screen{min-height:calc(100vh - 135px);border:2px solid var(--ink);background:linear-gradient(125deg,#fff8 0%,transparent 55%),var(--paper);position:relative}.menu-page{padding:36px 4vw}.menu-page h1{font-size:clamp(30px,3.5vw,56px);letter-spacing:-2px;margin:12px 0 16px;line-height:1.05;font-weight:900}.menu-page p{color:#5b6372;line-height:1.6}.eyebrow{font-size:11px;font-weight:900;letter-spacing:3px}.home{display:grid;grid-template-columns:1.2fr 1fr;align-items:center;min-height:calc(100vh - 140px);gap:5vw}.home-art{display:flex;flex-direction:column;align-items:center}.home-art img{width:100%;max-width:560px;mix-blend-mode:multiply}.home-art>span{font-size:10px;letter-spacing:5px;font-weight:700}.home-options h1{font-size:clamp(36px,4.3vw,68px);font-style:italic}.home-options>button{display:flex;justify-content:space-between;align-items:center;width:100%;max-width:420px;margin-top:12px;padding:19px 22px;font-size:18px;font-weight:700}.primary{background:var(--ink);color:#fff;border-color:var(--ink);font-weight:700}.primary:hover{background:#cd483a;border-color:#cd483a}.home-options>small{display:block;font-size:10px;letter-spacing:2px;margin-top:32px;color:#6d7280}.back{display:block;margin-top:25px;border:0;padding-left:0;font-size:13px;font-weight:700}.back:hover{background:none;color:#bd4133}.stage-card{display:block;text-align:left;padding:0;width:min(600px,100%);margin-top:25px;background:#fff4;border:2px solid #162344}.stage-card strong{display:flex;justify-content:space-between;font-size:25px;padding:20px 24px 9px}.stage-card small{display:block;padding:0 24px 22px;letter-spacing:2px;font-size:10px}.grid-preview{height:220px;position:relative;overflow:hidden;background-color:#ecece3;background-image:linear-gradient(#16234435 1px,transparent 1px),linear-gradient(90deg,#16234435 1px,transparent 1px);background-size:40px 40px}.grid-preview:after{content:'';position:absolute;left:-20%;right:-20%;height:90px;bottom:-10px;border-top:3px solid #162344;transform:perspective(100px) rotateX(25deg);background-color:#e0e4df;background-image:linear-gradient(#16234490 1px,transparent 1px),linear-gradient(90deg,#16234490 1px,transparent 1px);background-size:40px 20px}.grid-preview span{position:absolute;left:25px;top:20px;font-size:95px;font-weight:900;color:#16234418}.selection-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}.opponent-mode{display:flex;align-items:center;gap:12px;font-size:12px}.selection-summary{display:flex;gap:15px;align-items:center;margin:12px 0 24px}.selection-summary button{font-weight:700;font-size:12px}.selected{outline:3px solid #c6a434;outline-offset:3px}.roster{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:13px}.character-card{padding:0;min-width:0;text-align:left;overflow:hidden;background:#e6e5dd;border:1px solid #16234455;position:relative}.character-card img{width:100%;height:clamp(170px,23vw,345px);object-fit:cover;object-position:center top;display:block}.character-card:first-child img{object-position:52% top}.character-card strong{display:block;font-size:clamp(10px,1.1vw,17px);font-weight:900;padding:14px 10px 6px;white-space:nowrap}.character-card small{display:block;padding:0 10px 14px;font-size:9px;font-weight:700;letter-spacing:1px}.character-card.locked{cursor:not-allowed;color:#65696c;background:#d5d6d1}.character-card.locked img{filter:grayscale(1);opacity:.48}.character-card.locked:hover{background:#d5d6d1;color:#65696c}.selection-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:28px}.selection-bottom .back{margin:0}.selection-bottom p{font-size:12px}.help-columns{display:grid;grid-template-columns:1fr 1fr;gap:5vw}.help-page h2{font-size:17px;margin-top:25px}.help-page p{font-size:13px;line-height:1.65}.help-page table{width:100%;border-collapse:collapse;font-size:13px}.help-page th,.help-page td{padding:10px 8px;text-align:left;border-bottom:1px solid #16234425}.help-page th{font-size:10px;letter-spacing:1px}.help-page #controller-status{font-size:11px;color:#626d7c}.portrait.spectacular{background-size:230% auto;background-position:65% 0%}.touch{padding-bottom:0}.touch button{font-size:12px}
@media(max-width:1000px){.roster{grid-template-columns:repeat(3,1fr)}.character-card img{height:220px}.character-card strong{font-size:14px}.menu-page{padding:26px}.selection-bottom{flex-wrap:wrap}.selection-bottom p{order:3;width:100%;margin:0}.home{gap:20px}.actions{gap:4px}.actions button{padding:9px;font-size:12px}.brand{font-size:14px}.brand small{font-size:9px}}
@media(max-width:650px){header{height:75px}.brand{font-size:12px}.brand small{display:none}.actions label,.actions select{display:none}.actions{flex-wrap:wrap;justify-content:flex-end}.actions button{font-size:10px;padding:7px}.menu-page{padding:22px 16px}.home{grid-template-columns:1fr;gap:0}.home-art img{max-width:250px}.home-art>span{display:none}.home-options h1{font-size:36px}.home-options>small{margin-top:20px}.selection-heading{display:block}.selection-heading h1{font-size:30px}.opponent-mode{margin:15px 0}.roster{gap:9px}.character-card img{height:155px}.character-card strong{font-size:10px;padding:10px 6px 6px}.character-card small{font-size:8px;padding:0 6px 10px}.selection-summary{gap:10px}.selection-summary button{padding:8px;font-size:10px}.help-columns{grid-template-columns:1fr}.alpha-build{font-size:9px;right:10px;bottom:5px}.selection-bottom .primary{font-size:12px}.arena{min-height:300px}.touch button{min-width:35px;font-size:10px;padding:10px 7px}}

/* Dark viewer surround; all interactive game UI stays inside the play window. */
body{background:#10131b;color:#162344;color-scheme:dark}main{padding:24px 3.2vw 18px;max-width:1800px}.menu-screen,.arena{color-scheme:light;box-shadow:0 18px 65px #0005;border-color:#394358}.menu-screen{min-height:calc(100vh - 88px)}.home{min-height:calc(100vh - 92px)}.arena{max-height:none;min-height:0;aspect-ratio:16/9}.battle-actions{position:absolute;top:10px;left:18px;right:18px;z-index:5;justify-content:flex-end;font-size:11px;gap:6px}.battle-actions button,.battle-actions select{padding:5px 9px;background:#f5f3ebe8;font-size:11px}.battle-actions button:hover{background:#162344}.battle-actions label{font-size:9px}.hud{top:59px}.build-footer{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:15px 0 0;color:#929aaa;font-size:11px;letter-spacing:.4px}.build-footer i{font-style:normal;color:#707a8e;margin-left:8px}.alpha-build{position:static;background:none;color:#aab3c5;border-left:2px solid #cd483a;padding:0 0 0 9px;letter-spacing:2px;font-size:10px}.touch{position:absolute;bottom:35px;left:10px;right:10px;z-index:4}.stage-label{bottom:12px}
@media(max-width:850px){main{padding:12px 12px 16px}.arena{min-height:360px}.hud{top:58px}.battle-actions{left:10px;right:10px}.touch{display:flex;bottom:32px}.touch button{background:#f5f3ebc9}.stage-label{bottom:9px}.build-footer{font-size:9px;gap:8px}.build-footer i{margin-left:4px}.alpha-build{font-size:9px}.home{min-height:calc(100vh - 100px)}}

.build-footer{position:fixed;left:3.2vw;right:3.2vw;bottom:0;z-index:20;background:#10131b;padding:10px 0 12px}.build-footer i{font-style:italic}main{padding-bottom:52px}main:has(#battle-screen:not([hidden])){width:min(100%,calc((100dvh - 90px)*16/9 + 48px));padding-left:24px;padding-right:24px}@media(max-width:850px){main:has(#battle-screen:not([hidden])){width:100%;padding-left:12px;padding-right:12px}}

.pad-focus{outline:3px solid #e3bb45!important;outline-offset:3px;box-shadow:0 0 0 5px #16234444}.portrait.renegademan,.portrait.duskman,.portrait.duskdawn{background-size:240% auto;background-position:57% 1%;background-repeat:no-repeat}.ability.unavailable{opacity:.3}.ability.unavailable i{width:0!important}

/* Fit the complete arena to the display without stretching its artwork. */
#game-window{width:100%;max-width:none;padding:8px 12px 44px;min-height:100dvh}
#game-window:has(#battle-screen:not([hidden])){width:100%;padding:8px 12px 44px}
.viewer-toolbar{height:34px;display:flex;justify-content:flex-end;align-items:center;max-width:1760px;margin:0 auto 6px}
#fullscreen{color:#d8dce5;border-color:#596274;font-size:12px;padding:6px 10px;background:#1c2230}
#play-surface{position:relative;margin:0 auto;max-width:1760px}
#battle-screen{position:absolute;top:0;left:0;width:1440px;height:810px;min-height:0;max-height:none;transform-origin:top left;aspect-ratio:16/9}
#menu-screen{min-height:calc(100dvh - 100px)}
#screen-main{min-height:calc(100dvh - 104px)}
#game-window:fullscreen,#game-window:-webkit-full-screen,#game-window.fullscreen-fallback{background:#10131b;width:100%;height:100dvh;max-width:none;overflow:auto}
#game-window.fullscreen-fallback{position:fixed;inset:0;z-index:1000}
#game-window .build-footer{left:12px;right:12px}
@media(pointer:coarse){#battle-screen .touch{display:flex}#battle-screen .touch button{min-width:65px;min-height:52px;font-size:18px;padding:12px}}

.solo-level .hud{grid-template-columns:minmax(0,1fr) 150px minmax(0,1fr)}.solo-level .round{padding-top:12px}.solo-level .round span{font-size:16px;white-space:nowrap}

#wave-count{display:block;font-size:11px;letter-spacing:1px;font-weight:700;margin-top:12px;white-space:nowrap}.solo-level .round{width:180px;justify-self:center}
/* Comic sky belongs only to the main menu. */
#screen-main{background:#68afe0 url('assets/main-menu-sky-v1.png') center top / cover no-repeat}
#screen-main .home-art{width:min(100%,340px);justify-self:center;background:#fff9edec;border:1px solid #16234435;border-radius:6px;padding:10px 16px 16px;box-shadow:0 8px 24px #16234415}
#screen-main .home-art>span{background:#fff6e8db;padding:8px 12px;border-radius:3px}
#screen-main .home-options>button:not(.primary){background:#fff6e8ed}
@media(max-width:650px){#screen-main{background-size:auto 100%;padding-top:125px}}


