:root{font-family:Inter,ui-rounded,system-ui,sans-serif;color:#ecfbff;background:#06111b;font-synthesis:none}*{box-sizing:border-box}html,body{width:100%;min-height:100%;margin:0}body{background:radial-gradient(circle at 20% 0,#1b5d6b55,transparent 38%),radial-gradient(circle at 85% 100%,#73652d55,transparent 40%),linear-gradient(155deg,#06101b,#0b2130);overflow-x:hidden}.shell{width:min(980px,100%);min-height:100dvh;margin:auto;padding:12px 18px 18px}header{display:grid;grid-template-columns:96px 1fr 96px;align-items:center;gap:10px;margin-bottom:8px}header>div{text-align:center}.eyebrow{color:#ffdb63;font-size:.62rem;font-weight:900;letter-spacing:.17em}h1{margin:1px 0;font-size:clamp(1.35rem,4vw,2.2rem);letter-spacing:.08em}.back,header button{min-height:38px;padding:0 10px;color:#e8fbff;background:#0c2735;border:1px solid #2a5d70;border-radius:10px;text-decoration:none;font:800 .7rem inherit;display:grid;place-items:center;cursor:pointer}.status{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:8px}.status>div{padding:7px 10px;border:1px solid #2a5261;border-radius:10px;background:#071c28}.status small,.status b{display:block}.status small{color:#83a9b5;font-size:.52rem;font-weight:850;letter-spacing:.1em}.status b{font-size:.92rem}.status>div:last-child b{color:#ffdb63}.stage{position:relative;width:min(100%,900px,calc((100dvh - 174px)*9/7));aspect-ratio:9/7;margin:auto;padding:7px;border:1px solid #367085;border-radius:18px;background:#06151f;box-shadow:0 24px 74px #000b}canvas{display:block;width:100%;height:100%;border-radius:12px;background:#071521;touch-action:none}.overlay{position:absolute;inset:7px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;text-align:center;background:#04101be8;border-radius:12px;backdrop-filter:blur(5px)}.overlay.hidden{display:none}.courier{display:grid;width:66px;height:66px;place-items:center;margin-bottom:11px;color:#11211c;background:#ffdb63;border:7px solid #fff1ad;border-radius:20px;transform:rotate(45deg);box-shadow:0 0 45px #ffdb63;font-size:1.8rem}.overlay h2{margin:6px 0;font-size:clamp(1.45rem,4.5vw,2.5rem)}.overlay p:not(.eyebrow){max-width:530px;margin:0 0 18px;color:#a2bec7;line-height:1.45}.overlay button{min-width:210px;min-height:48px;color:#162018;background:linear-gradient(110deg,#ffdb63,#7fe7bd);border:0;border-radius:11px;font-weight:950;cursor:pointer}.controls{display:none;grid-template-columns:repeat(3,58px);grid-template-rows:repeat(2,48px);justify-content:center;gap:5px;margin-top:9px}.controls button{color:#e7fbff;background:#102e3d;border:1px solid #397285;border-radius:12px;font-size:1rem;font-weight:900}.controls [data-dir=up]{grid-column:2}.controls [data-dir=left]{grid-column:1}.controls [data-dir=down]{grid-column:2}.controls [data-dir=right]{grid-column:3}.help{margin:7px 0 0;text-align:center;color:#7297a4;font-size:.65rem}@media(pointer:coarse),(max-width:900px){.controls{display:grid}}@media(max-width:540px){.shell{padding:8px}header{grid-template-columns:68px 1fr 68px}.back,header button{min-height:34px;padding:0 6px;font-size:.57rem}.eyebrow{font-size:.47rem}h1{font-size:1.2rem}.status{gap:3px}.status>div{padding:5px}.status small{font-size:.43rem}.status b{font-size:.75rem}.stage{width:min(100%,calc((100dvh - 232px)*9/7));border-radius:13px}.overlay{padding:14px}.courier{width:50px;height:50px}.overlay p:not(.eyebrow){font-size:.8rem}.controls{grid-template-columns:repeat(3,54px);grid-template-rows:repeat(2,43px)}}@media(pointer:coarse) and (orientation:landscape), (max-height:820px) and (min-width:700px){html,body{height:100%;overflow:hidden}.shell{height:100dvh;padding:7px 10px}.shell header{margin-bottom:5px}.status{margin-bottom:5px}.status>div{padding:4px 8px}.stage{height:calc(100dvh - 117px);width:auto;max-width:calc(100vw - 230px);padding:5px}.controls{position:fixed;z-index:4;right:22px;top:50%;margin:0;transform:translateY(-42%);grid-template-columns:repeat(3,54px);grid-template-rows:repeat(2,48px)}.help{display:none}.overlay{inset:5px}.courier{width:50px;height:50px;margin-bottom:7px}.overlay p:not(.eyebrow){max-width:460px;margin-bottom:11px;font-size:.78rem}.overlay button{min-height:42px}}
