:root{--bg: #0b0d12;--panel: rgba(13, 15, 22, .78);--line: rgba(255, 255, 255, .09);--orange: #f5a524;--blue: #4f6bff;--text: #e8eaf2;--dim: #8a90a3;--pixel: "Press Start 2P", monospace;--mono: "JetBrains Mono", ui-monospace, monospace}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:var(--mono)}#game{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}#ui{position:fixed;inset:0;pointer-events:none}#ui button,#ui a{pointer-events:auto}a{color:var(--orange)}.title{position:absolute;inset:0;pointer-events:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:24px 16px;text-align:center;background:radial-gradient(ellipse at 50% 35%,rgba(79,107,255,.16),transparent 60%),#08090dd1;backdrop-filter:blur(3px);transition:opacity .45s;overflow-y:auto}.title.gone{opacity:0;pointer-events:none}.title[hidden]{display:none}.title .logo{display:flex;flex-direction:column;align-items:center;gap:10px}.dot-title{max-width:min(92vw,720px);height:auto;image-rendering:auto}.title .logo .dot-title+.dot-title{max-width:min(48vw,360px)}.title .tag{margin:0;font-size:15px;color:var(--text)}.title .status{font-size:12px;color:var(--dim);min-height:1.2em}.title .status b{color:var(--blue)}.title .status b.run{color:var(--orange)}.title .play{font-family:var(--pixel);font-size:18px;letter-spacing:2px;padding:16px 44px;border:0;cursor:pointer;color:#14171f;background:var(--orange);box-shadow:0 4px #a8650a,0 0 32px #f5a52459}.title .play:hover{filter:brightness(1.08)}.title .play:active{transform:translateY(3px);box-shadow:0 1px #a8650a}.title .howto{font-size:12px;color:var(--dim);line-height:1.9;max-width:560px}.title .howto b{color:var(--text);font-weight:700}.title .howto .goal{margin-top:10px;color:var(--text)}.title .touchonly{display:none}body.touch .title .touchonly{display:block}.title .foot{position:static;font-size:10px;color:var(--dim)}.hud{position:absolute;inset:0}.panel{position:absolute;top:12px;padding:10px 12px;min-width:190px;background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(6px);font-size:11px}.panel .lbl{font-family:var(--pixel);font-size:8px;color:var(--dim);letter-spacing:1px}.panel .row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px}.panel .row.dim{color:var(--dim)}.panel b{font-family:var(--pixel);font-size:13px;color:var(--orange)}.cheeks{left:12px}.pips{display:grid;grid-template-columns:repeat(15,1fr);gap:2px;margin-top:6px}.pips i{height:9px;background:#ffffff14}.pips i.on{background:var(--orange);box-shadow:0 0 6px #f5a52499}.pips.full i.on{animation:pulse .6s infinite alternate}@keyframes pulse{to{background:#ffe0a0}}.live{right:12px;min-width:210px}.live .dot{width:8px;height:8px;background:#555;display:inline-block}.live .dot.on{background:var(--blue);box-shadow:0 0 8px var(--blue)}.live .dot.run{background:var(--orange);box-shadow:0 0 8px var(--orange);animation:pulse .5s infinite alternate}.live .dot.off{background:#c0392b}.live .st{font-family:var(--pixel);font-size:8px;color:var(--blue);margin-left:auto}.live .blk{font-family:var(--pixel);font-size:12px;color:var(--blue);margin-top:8px}.bar{height:6px;background:#ffffff14;margin-top:6px}.bar i{display:block;height:100%;width:0;background:var(--blue);transition:width .6s}.bar.mine i{background:var(--orange)}.sep{height:1px;background:var(--line);margin:8px 0 2px}.tools{position:absolute;top:12px;left:50%;transform:translate(-50%);display:flex;gap:6px}.tools button{width:34px;height:34px;border:1px solid var(--line);background:var(--panel);color:var(--text);font-family:var(--pixel);font-size:12px;cursor:pointer}.hint{position:absolute;left:50%;bottom:64px;transform:translate(-50%);font-family:var(--pixel);font-size:10px;padding:10px 14px;background:var(--panel);border:1px solid var(--orange);opacity:0;transition:opacity .2s;white-space:nowrap}.hint.on{opacity:1}.hint kbd{color:var(--orange);font-family:var(--pixel)}.toasts{position:absolute;left:50%;top:96px;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:6px}.toast{font-family:var(--pixel);font-size:10px;padding:8px 12px;background:var(--panel);border-left:3px solid var(--orange);animation:pop .25s;transition:opacity .4s,transform .4s}.toast.blue{border-color:var(--blue)}.toast.gold{border-color:#fc3;color:#ffdf7a}.toast.out{opacity:0;transform:translateY(-8px)}@keyframes pop{0%{transform:scale(.8);opacity:0}}.banner{position:absolute;left:50%;top:30%;transform:translate(-50%,-50%) scale(.85);text-align:center;opacity:0;transition:opacity .3s,transform .3s;pointer-events:none;padding:0 16px;width:100%}.banner.on{opacity:1;transform:translate(-50%,-50%) scale(1)}.banner .t{font-family:var(--pixel);font-size:clamp(16px,4vw,34px);color:var(--orange);text-shadow:0 0 18px rgba(245,165,36,.6),0 4px 0 #000}.banner.live .t{color:#8fa2ff;text-shadow:0 0 18px rgba(79,107,255,.8),0 4px 0 #000}.banner .s{font-family:var(--pixel);font-size:clamp(8px,1.8vw,12px);margin-top:12px;color:var(--text);text-shadow:0 2px 0 #000}.lockhint{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:var(--pixel);font-size:10px;color:var(--text);background:var(--panel);padding:10px 14px;border:1px solid var(--line);opacity:0;transition:opacity .3s}.lockhint.on{opacity:.9}body.touch .lockhint{display:none}.foot{position:absolute;left:12px;bottom:10px;font-size:10px;color:var(--dim)}body.touch .hud .foot{display:none}.stick{position:absolute;width:120px;height:120px;border-radius:50%;border:2px solid rgba(255,255,255,.18);background:#0d0f1659;display:none}.stick.on{display:block}.stick .knob{position:absolute;left:36px;top:36px;width:48px;height:48px;border-radius:50%;background:#f5a524cc}.pad{display:none}body.touch.playing .pad{display:grid;position:absolute;right:16px;bottom:20px;grid-template-columns:64px 64px;grid-template-rows:64px 64px;gap:10px}.pad button{border:2px solid rgba(255,255,255,.2);border-radius:50%;background:#0d0f168c;color:var(--text);font-family:var(--pixel);font-size:9px;touch-action:none}.pad button.down{background:#f5a52480}.pad .b-jump{background:#f5a52459}.pad .b-act.hot{border-color:var(--orange);box-shadow:0 0 12px #f5a52499}@media (max-width: 640px){.panel{padding:7px 8px;min-width:0;font-size:10px}.cheeks{width:150px}.live{width:160px}.live .blk{font-size:9px}.panel b{font-size:11px}.tools{top:auto;bottom:12px;left:12px;transform:none}.hint{bottom:auto;top:150px;font-size:8px;white-space:normal;text-align:center;max-width:80vw}.toasts{top:190px}.toast{font-size:8px}}body.touch .title .keys{display:none}@media (max-width: 640px){.live .wname{display:none}.live .st{margin-left:0}}.gnaw{position:absolute;right:12%;top:50%;transform:translateY(-50%);width:220px;padding:14px;background:var(--panel);border:1px solid var(--orange);backdrop-filter:blur(6px);pointer-events:auto;text-align:center;box-shadow:0 0 40px #f5a52426}.gnaw[hidden]{display:none}.gtitle{font-family:var(--pixel);font-size:10px;color:var(--orange)}.gtitle .gnum{color:var(--dim)}.gbody{display:flex;justify-content:center;gap:14px;margin:14px 0 10px}.track{position:relative;width:56px;height:260px;background:repeating-linear-gradient(0deg,#1a1d26 0 12px,#20242f 12px 13px);border:2px solid #3a3f4d;overflow:hidden}.track:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:8px;transform:translate(-50%);background:linear-gradient(90deg,#8d939e,#e3e7ee,#8d939e)}.zone{position:absolute;left:0;right:0;background:#4f6bff59;border:2px solid var(--blue)}.zone.hit{background:#f5a52473;border-color:var(--orange);box-shadow:0 0 14px #f5a524b3}.teeth{position:absolute;left:6px;right:6px;height:26px;display:flex;justify-content:center;gap:3px}.teeth b{width:13px;height:26px;background:#fff8e6;border:2px solid #14171f;border-radius:0 0 4px 4px}.meter{width:12px;height:260px;background:#ffffff14;position:relative;border:1px solid var(--line)}.meter i{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(0deg,#c0392b,var(--orange) 50%,#ffe08a)}.ghelp{font-size:11px;color:var(--dim);line-height:1.5}.ghelp b{color:var(--text)}.gquit{margin-top:10px;font-family:var(--pixel);font-size:8px;padding:7px 12px;border:1px solid var(--line);background:transparent;color:var(--dim);cursor:pointer}@media (max-width: 640px){.gnaw{right:auto;left:12px;top:46%;width:150px;padding:10px}.track,.meter{height:200px}.ghelp{font-size:9px}}.toast.green{border-color:#36d46a;color:#9dffbd}