:root{color-scheme:dark;font-family:Inter,"Helvetica Neue","Noto Sans JP",sans-serif;background:#071018;color:#dceaf0}*{box-sizing:border-box}body{margin:0}main{max-width:1500px;margin:auto;padding:0 32px}header{height:90px;display:flex;align-items:center;gap:28px}a{color:#add8df;text-decoration:none}.brand{font-weight:700;letter-spacing:.18em;font-size:16px}.brand span{display:block;font-size:10px;font-weight:400;letter-spacing:.24em;color:#7895a3;margin-top:6px}.badge,.eyebrow,.micro{font-size:10px;letter-spacing:.18em;color:#8aafbc}.badge{border-left:1px solid #29414d;padding:10px 24px}button{font:inherit;cursor:pointer;border:1px solid #3b5662;background:#102330;color:#dcebf0;border-radius:3px;padding:12px 18px}button:hover{background:#203a47}button:focus-visible,input:focus-visible{outline:2px solid #b7e9f1;outline-offset:3px}header button{margin-left:auto;font-size:12px}.viewport{height:min(76vh,800px);min-height:490px;position:relative;border:1px solid #2a414d;background:radial-gradient(ellipse at center,#173248,#02070d 72%);overflow:hidden}canvas{width:100%;height:100%;display:block;touch-action:none}.hud{position:absolute;inset:25px 28px auto;display:flex;justify-content:space-between;pointer-events:none}.hud strong{font-size:23px;font-weight:400;display:block;margin-top:7px}.hud meter{display:block;width:145px;height:8px;margin-top:8px;accent-color:#9ae2d4}.progress{text-align:right}.progress #crew{font-size:11px;color:#b3cbd3;display:block;margin-top:8px;max-width:350px}.center{position:absolute;left:7%;top:48%;transform:translateY(-50%);width:390px;max-width:85%;padding:26px 30px;background:linear-gradient(100deg,#07131df2,#0b1b26ed);border:1px solid #35505f;box-shadow:0 24px 80px #0005}h1{font-size:clamp(30px,3.4vw,48px);font-weight:400;line-height:1.45;letter-spacing:.08em;margin:16px 0 20px}h2{font-size:30px;font-weight:400;line-height:1.4}.center p{font-size:13px;line-height:1.9;color:#acc2cc}.center .eyebrow{color:#8cc5cc;font-size:10px}.center label{display:block;margin:18px 0;font-size:12px;color:#afc9d3}input:not([type=checkbox]){width:100%;margin-top:8px;border:0;border-bottom:1px solid #47606b;background:#07131b;padding:10px;color:#e1edf3;font:inherit}input[type=checkbox]{accent-color:#9ae2d4;margin-right:10px}.center button{width:100%;margin-top:8px}.primary{background:#b9e1e2;color:#102631;border-color:#b9e1e2}.primary:hover{background:#d5f2f3}.primary span{float:right}.center .small,.small{font-size:10px;line-height:1.8;color:#7f9aa7}.compact{left:50%;transform:translate(-50%,-50%)}#status{position:absolute;bottom:24px;left:28px;color:#b5d8dd;font-size:12px;max-width:66%;line-height:1.6;pointer-events:none}.bottom-hud{position:absolute;right:24px;bottom:18px;display:flex;gap:8px;align-items:center}.bottom-hud button{font-size:10px;padding:10px}.bottom-hud span{font-size:12px;color:#b9eced}footer{padding:17px 0 20px;color:#9eb8c3;font-size:11px;line-height:1.8}footer p{margin:4px 0}footer b{font-size:10px;font-weight:500;border-bottom:1px solid #3b5662;padding-bottom:3px}.chip{display:inline-block;border:1px solid #35505d;padding:0 7px;margin-left:7px}button:disabled{opacity:.45;cursor:wait}[hidden]{display:none!important}@media(max-width:650px){main{padding:0 12px}header{height:70px;gap:10px}.brand{font-size:12px}.badge{font-size:8px;padding:6px 10px;max-width:95px;line-height:1.8}header button{padding:9px;font-size:10px}.viewport{height:74vh;min-height:500px}.hud{inset:18px 15px auto}.hud strong{font-size:18px}.hud meter{width:100px}.progress #crew{max-width:175px;line-height:1.7;font-size:9px}.center{padding:20px 24px;top:49%;width:330px}h1{font-size:31px}.center p{font-size:11px}.center .small{font-size:9px}#status{left:15px;bottom:65px;max-width:90%;font-size:10px}.bottom-hud{right:15px;bottom:16px}footer{font-size:10px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
#score{display:block;margin-top:7px;font-size:10px;letter-spacing:.12em;color:#8dbbc6}.boss-hud{position:absolute;top:100px;left:50%;transform:translateX(-50%);width:min(360px,75%);display:flex;flex-wrap:wrap;justify-content:space-between;gap:7px;font-size:9px;letter-spacing:.15em;color:#e5bd9b;pointer-events:none}.boss-hud meter{width:100%;height:9px;accent-color:#df9678}.boss-hud #boss-stage{letter-spacing:.05em}.cue{position:absolute;top:22%;left:50%;transform:translateX(-50%);width:85%;text-align:center;font-size:14px;letter-spacing:.13em;color:#d1e2e7;text-shadow:0 1px 15px #000;pointer-events:none}@media(max-width:650px){.cue{font-size:11px;top:25%}.boss-hud{top:120px}.bottom-hud{max-width:94%;flex-wrap:wrap;justify-content:flex-end}}
.hud,.boss-hud{z-index:2}.cue{z-index:1}.center{z-index:4}#status,.bottom-hud{z-index:3}
.center{max-height:calc(100% - 28px);overflow-y:auto}
@media(max-height:520px){main{padding:0 10px}header{height:52px;gap:12px}.brand{font-size:12px}.brand span{font-size:8px}.badge{font-size:8px;padding:5px 12px}header button{padding:8px 12px;font-size:10px}.viewport{height:calc(100svh - 60px);min-height:240px}.hud{inset:12px 16px auto}.hud strong{font-size:16px}.hud meter{width:100px}.progress #crew{font-size:8px;max-width:260px}.center{top:50%;padding:14px 22px}.center h1{font-size:26px;line-height:1.3;margin:8px 0}.center h2{font-size:24px;margin:8px 0}.center p{font-size:10px;margin:7px 0}.center label{margin:9px 0}.center button{padding:10px}.boss-hud{top:80px;width:40%}.cue{top:26%;font-size:11px}#status{bottom:16px;font-size:10px;max-width:60%}.bottom-hud{bottom:12px;right:16px}footer{padding:10px 0}}
@media(max-width:360px){.center h1{font-size:26px;letter-spacing:.04em}.center{padding-left:20px;padding-right:20px}}

.site-nav{display:flex;align-items:center;gap:14px;margin-right:auto;white-space:nowrap}.site-nav a{font-size:12px;color:#add8df}
@media(max-width:650px){.site-nav{gap:7px}.site-nav a{font-size:9px}}