*{box-sizing:border-box}body{margin:0;background:#080b17;color:#edf6ff;font:15px/1.5 system-ui,sans-serif}header,main,footer{width:min(1520px,94%);margin:auto}header{display:flex;align-items:center;justify-content:space-between;padding:18px 0;gap:12px}.brand{color:#effaff;text-decoration:none;font-size:12px;letter-spacing:2px;font-weight:800}.brand span{color:#80dfe9}.tools{display:flex;gap:8px}button,select{font:inherit;color:#e7f7ff;background:#141d2d;border:1px solid #526777;border-radius:8px;min-height:42px;padding:8px 14px;cursor:pointer}button:hover,select:hover{background:#243547;border-color:#8ae5ee}button:active{transform:translateY(1px)}:focus-visible{outline:2px solid #ffe58a;outline-offset:4px}.heading{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:15px 0 20px}.eyebrow{color:#92aebe;letter-spacing:3px;font-size:10px;margin:0 0 5px}h1{font-size:clamp(22px,3vw,42px);line-height:1.15;letter-spacing:-1.5px;margin:0}.counter{text-align:right;display:flex;align-items:baseline;gap:12px}.counter span{color:#ffe58a;font-size:clamp(34px,5vw,60px);font-weight:700;font-variant-numeric:tabular-nums}.counter small{color:#a7bdce;font-size:10px;letter-spacing:1px}.stage{position:relative;aspect-ratio:16/8.5;max-height:70vh;border:1px solid #203647;border-radius:18px;overflow:hidden;background:#070b16}canvas{display:block;width:100%;height:100%;touch-action:none;cursor:crosshair}.stage-label{pointer-events:none;position:absolute;inset:50% 17% auto;display:flex;justify-content:space-between;color:#dbc990;font-size:9px;letter-spacing:2px;transform:translateY(20px)}#hint{position:absolute;left:15px;right:15px;bottom:15px;text-align:center;color:#b6ccd9;font-size:12px;pointer-events:none}#finish{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#070b16cc;text-align:center;padding:15px}#finish[hidden]{display:none}#finish h2{font-size:clamp(20px,3vw,40px);margin:0}#finish p{color:#b6ccd9}.bottom{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 0}.bottom p{font-size:13px;color:#b6ccd9}.bottom>div{display:flex;gap:8px}details{color:#aabfcc;max-width:780px;font-size:13px;margin:6px 0 18px}summary{cursor:pointer;color:#e4f5ff;padding:8px 0}footer{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid #243547;padding:17px 0;color:#9eb5c5;font-size:11px}footer nav{display:flex;gap:18px;flex-wrap:wrap}footer a{color:#b6ccd9;text-underline-offset:4px}@media(max-width:600px){header{flex-wrap:wrap;padding:12px 0}.brand{font-size:10px}.tools{gap:5px}button,select{font-size:12px;padding:8px 10px}.counter{display:block}.counter small{display:block}.heading{padding:10px 0 14px}h1{letter-spacing:-.7px}.stage{aspect-ratio:16/10}#hint{font-size:10px;bottom:7px}.stage-label{font-size:7px;letter-spacing:1px}.bottom{align-items:flex-start}.bottom p{font-size:11px;margin:5px 0;max-width:55%}}@media(orientation:landscape) and (max-height:600px){header{padding:6px 0}.heading{padding:0 0 5px}.eyebrow{display:none}h1{font-size:22px}.counter span{font-size:30px}.stage{height:calc(100svh - 155px);max-height:none;aspect-ratio:auto}.bottom{padding:5px 0}.bottom p{margin:3px 0}details,footer{display:none}}body:fullscreen{overflow:auto}
.stage-label{left:0;right:0}.stage-label span{position:absolute;transform:translateX(-50%)}#hint{bottom:4px}

body.embedded{overflow:hidden}.embedded header,.embedded footer,.embedded details,.embedded .bottom,.embedded .heading>div:first-child,.embedded .counter small{display:none}.embedded main{width:100%;height:100svh}.embedded .stage{border:0;border-radius:0;max-height:none;height:100svh;aspect-ratio:auto}.embedded .heading{position:absolute;z-index:2;top:10px;right:14px;padding:0;pointer-events:none}.embedded .counter span{font-size:28px}.embedded .heading .counter::after{content:" / 377";color:#b6ccd9;font-size:11px}