#militia-hub.reference-screen{border:0;background:#080b38;min-height:0;box-shadow:none}
.reference-artboard{position:relative;width:100%;aspect-ratio:941/1672;isolation:isolate}
.reference-artboard>img{display:block;width:100%;height:auto;image-rendering:pixelated;user-select:none;pointer-events:none}
#militia-hub .ref-hotspot{position:absolute;z-index:4;display:block;padding:0;min-height:0;border:0;color:transparent;background:transparent;box-shadow:none;touch-action:pan-y}
#militia-hub .ref-hotspot:hover{background:#ffffff0d}#militia-hub .ref-hotspot:active{background:#ffffff29;box-shadow:inset 0 0 0 2px #d8f6ff99}
#militia-hub .ref-hotspot:focus-visible{outline:3px solid #ffef64;outline-offset:1px;background:#fff2}
.ref-value{position:absolute;z-index:2;display:block;pointer-events:none;image-rendering:pixelated}
.ref-slot-selected,.ref-level-selected,.ref-companion-selected{position:absolute;z-index:3;pointer-events:none;border:2px solid #fff071;box-shadow:0 0 0 1px #713e10,0 0 14px #ffdb4266}
.ref-slot-selected{border-color:#94ffff;box-shadow:inset 0 0 10px #52dfff55}
.ref-level-selected{border-radius:30%;border-style:dashed}.ref-companion-selected{border:0;border-bottom:3px solid #ffff83;box-shadow:none}
.ref-locked-figure{position:absolute;z-index:1;pointer-events:none;background:#02143dcc;backdrop-filter:brightness(.15) saturate(.2)}
.ref-save{background:#33143f!important;color:#ffe6a7!important;margin:0}
.ref-resume{position:absolute;z-index:5;left:28%;top:94.5%;width:44%}
.ref-resume .pixel-button{min-height:36px!important;padding:6px!important;font-size:11px!important}
.ref-modal-shade{position:fixed;z-index:50;inset:0;background:#010720da;display:flex;align-items:center;justify-content:center;padding:max(18px,env(safe-area-inset-top)) 16px max(18px,env(safe-area-inset-bottom));backdrop-filter:blur(3px)}
.ref-modal{position:relative;width:min(100%,394px);max-height:90dvh;overflow:auto;overscroll-behavior:contain;background:linear-gradient(145deg,#082452,#030e35);border:3px solid #23dfff;box-shadow:0 0 0 3px #07132a,0 0 0 5px #1483d0,inset 0 0 0 3px #155188;padding:20px 16px;color:#e7f3ff;text-align:center;scrollbar-color:#3779cc #06133a}
.ref-modal:before{content:'';position:absolute;top:3px;left:3px;width:9px;height:9px;background:#caffff;box-shadow:3px 0 #42dbff,0 3px #42dbff}
.ref-modal h2{margin:5px 0 20px;font:bold 24px/1.2 'Courier New',monospace;text-transform:uppercase;color:#ffed63;text-shadow:2px 2px #be4418,3px 3px #02091f;letter-spacing:-1px}
.ref-modal h3{font-size:17px;text-transform:uppercase;color:#96f8ff;margin:12px 0}
.ref-modal p{font:14px/1.6 'Courier New',monospace;color:#d7e9ff;margin:12px 0}.ref-modal small{display:block;font-size:11px;color:#78cffa;text-transform:uppercase}
.pixel-list-item{padding:14px 4px;border-bottom:2px solid #1c5b98;margin-bottom:10px}.pixel-list-item b{font-size:15px;color:#fff1c5}.pixel-list-item button{margin-top:10px}
#militia-hub .pixel-button{position:relative;display:block;width:100%;min-height:50px;padding:10px 12px;margin:12px 0 0;border:3px solid #49e2ff;background:linear-gradient(#0e83dd,#124ebc 48%,#072982);color:#fff7d0;box-shadow:inset 0 0 0 2px #a9f5ff,0 4px 0 #020620;clip-path:polygon(3% 0,97% 0,97% 5%,100% 5%,100% 95%,97% 95%,97% 100%,3% 100%,3% 95%,0 95%,0 5%,3% 5%);font-weight:900;font-size:15px;text-transform:uppercase;text-shadow:2px 2px #08122d;touch-action:pan-y}
#militia-hub .pixel-button[data-action=ref-upgrade],#militia-hub .pixel-button[data-action=ref-equip]{background:linear-gradient(#4dbe18,#099e19 46%,#075320);border-color:#c6ff37;box-shadow:inset 0 0 0 2px #e1ffb2,0 4px 0 #020620}
#militia-hub .pixel-button:disabled{opacity:.45}#militia-hub .pixel-button:active{filter:brightness(1.22);transform:translateY(2px)}
.unique-bottlecap{margin:15px auto;color:#ffe660;background:#683796;border:4px solid #fadb67;width:110px;height:110px;display:grid;place-items:center;font-size:70px;box-shadow:0 0 25px #d64df966;image-rendering:pixelated}
/* Only tap commands remain. The camera keeps the space previously used by pads. */
#touch{display:none!important}
#tap-command-bar{flex:none;padding:10px 14px 12px;background:linear-gradient(#122560,#081233);border-top:2px solid #2ac5f1}
#tap-command-bar p{margin:0 0 8px;text-align:center;font:11px/1.4 'Courier New',monospace;color:#aedbff}
#tap-command-bar>div{display:grid;grid-template-columns:1fr 1fr;gap:10px}
#tap-command-bar button{min-height:44px;background:linear-gradient(#194f9b,#0c275c);border:2px solid #39bcec;box-shadow:0 3px #020b21;font-size:12px;color:#f5efbc;touch-action:manipulation}
#tap-command-bar button:last-child{background:linear-gradient(#6332a4,#351e62);border-color:#b564ee}
body[data-screen=playing] #game{touch-action:none;cursor:crosshair}
body[data-screen=playing] main:fullscreen #tap-command-bar{flex:none}
/* Secondary panels inherit the same compact pixel palette. */
.portrait-menu button{font-weight:900;border-width:2px!important;box-shadow:0 3px 0 #020b21;text-transform:uppercase;text-shadow:1px 1px #0008}
.portrait-menu .app-page-bar button{box-shadow:none}.portrait-menu .hub-top{display:none}
@media(prefers-reduced-motion:reduce){.ref-modal-shade{backdrop-filter:none}}

.ref-portrait-crop{position:absolute;z-index:2;overflow:hidden;pointer-events:none;background:#061c46}.ref-portrait-crop img{position:absolute;max-width:none;image-rendering:pixelated}

.ref-battle-resume{position:absolute;z-index:5;left:20%;top:58.2%;width:60%;padding:5px 3px;background:#073b36;border:2px solid #ceff68;color:#edffd0;text-align:center;font:bold 9px monospace;box-shadow:0 3px #040c26;pointer-events:none}
