:root{--bg: #0a0612;--panel: #150c22;--panel-2: #1d1030;--line: #3a2550;--neon: #ff2ea6;--neon-2: #2ee6ff;--gold: #ffd166;--green: #7dff5a;--red: #ff4d6d;--text: #f3e9ff;--dim: #9b86b8;--lane-0: #ff3d8b;--lane-1: #00d9ff;--lane-2: #7dff5a;--lane-3: #ffc93d;--safe-t: env(safe-area-inset-top, 0px);--safe-b: env(safe-area-inset-bottom, 0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:Noto Sans Thai,system-ui,-apple-system,sans-serif;overscroll-behavior:none;user-select:none}body{background:radial-gradient(120% 60% at 50% -10%,#2a0f3d 0%,transparent 60%),radial-gradient(80% 50% at 50% 110%,#1b0b2e 0%,transparent 70%),var(--bg)}.scene{position:fixed;inset:0;display:none;flex-direction:column;padding:calc(var(--safe-t) + 8px) 0 calc(var(--safe-b) + 8px)}.scene[data-active]{display:flex}#scene-play{display:grid;grid-template-rows:auto auto 3px 1fr;padding:0}#scene-play:not([data-active]){opacity:0;pointer-events:none;z-index:-1}h1{font:600 1.05rem/1.2 Kanit,sans-serif;margin:0;letter-spacing:.02em}.muted{color:var(--dim);font-size:.85rem}.center{text-align:center}.big-btn{appearance:none;border:0;width:100%;padding:16px 18px;border-radius:14px;font:600 1.05rem/1 Kanit,sans-serif;color:#fff;background:linear-gradient(180deg,#ff52b8,#c4007a);box-shadow:0 0 0 1px #ff8ed0 inset,0 10px 24px -8px #ff2ea688;cursor:pointer;transition:transform .08s ease,filter .15s ease}.big-btn:active{transform:translateY(2px) scale(.99);filter:brightness(1.15)}.big-btn.gold{background:linear-gradient(180deg,#ffe08a,#e0a119);color:#3a2300;box-shadow:0 0 0 1px #fff2c4 inset,0 10px 24px -8px #ffd16688}.big-btn.ghost{background:#ffffff0d;box-shadow:0 0 0 1px var(--line) inset}.big-btn[disabled]{opacity:.45;pointer-events:none}.link-btn{appearance:none;background:none;border:0;color:var(--dim);font:500 .9rem/1 Noto Sans Thai,sans-serif;padding:10px;cursor:pointer}.link-btn:active{color:var(--text)}.icon-btn{appearance:none;background:#ffffff0f;border:1px solid var(--line);color:var(--text);width:38px;height:38px;border-radius:11px;font-size:1.1rem;line-height:1;cursor:pointer}.chip{appearance:none;background:#ffffff10;border:1px solid var(--line);color:var(--text);padding:7px 13px;border-radius:999px;font:600 .85rem Kanit,sans-serif;cursor:pointer}.topbar{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:10px;padding:0 14px 10px}.topbar h1{text-align:center}.bottombar{display:flex;justify-content:space-around;border-top:1px solid var(--line);padding-top:4px}.credit-chip{background:#ffffff0f;border:1px solid var(--line);border-radius:999px;padding:6px 13px;font:600 .85rem Kanit,sans-serif;color:var(--gold)}.credit-chip.small{padding:5px 10px;font-size:.78rem}.neon-sign{font:800 clamp(2.4rem,16vw,4.2rem)/1 "Kanit",sans-serif;letter-spacing:.06em;color:#fff;text-shadow:0 0 4px #fff,0 0 12px var(--neon),0 0 28px var(--neon),0 0 60px #ff2ea699;animation:flicker 6s infinite}.neon-sign.small{font-size:1.8rem}.neon-sub{margin-top:10px;font:600 .95rem Kanit,sans-serif;color:var(--neon-2);text-shadow:0 0 10px var(--neon-2),0 0 24px #2ee6ff66;letter-spacing:.08em}@keyframes flicker{0%,92%,to{opacity:1}93%{opacity:.55}94%{opacity:1}96%{opacity:.4}97%{opacity:1}}.open-sign{margin-top:22px;font:800 .9rem Kanit,sans-serif;letter-spacing:.35em;color:var(--green);border:2px solid var(--green);border-radius:8px;padding:5px 14px 5px 19px;text-shadow:0 0 10px var(--green);box-shadow:0 0 16px -2px var(--green);animation:flicker 4.5s infinite 1s}.boot{margin:auto;text-align:center;display:grid;gap:14px}.attract{justify-content:space-between}.attract-room{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;text-align:center}.disco-glow{position:absolute;inset:-20%;background:conic-gradient(from 0deg,#ff2ea622,transparent 25%,#2ee6ff22 50%,transparent 75%,#ff2ea622);animation:spin 18s linear infinite;filter:blur(26px);pointer-events:none}@keyframes spin{to{transform:rotate(1turn)}}.attract-foot{display:grid;gap:8px;padding:0 20px;justify-items:center}.attract-foot .big-btn{max-width:420px}.search-row{padding:0 14px 10px}input[type=search],input[type=text],input[type=number],select{width:100%;appearance:none;background:var(--panel);border:1px solid var(--line);color:var(--text);border-radius:12px;padding:12px 14px;font:400 .95rem Noto Sans Thai,sans-serif}.song-list{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:0 14px 10px;display:grid;gap:10px;align-content:start}.song-card{display:grid;grid-template-columns:76px 1fr auto;gap:12px;align-items:center;background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--line);border-radius:14px;padding:10px;text-align:left;color:inherit;cursor:pointer}.song-card:active{border-color:var(--neon)}.song-card img{width:76px;height:56px;object-fit:cover;border-radius:9px;background:#000}.song-card .sc-num{font:800 .7rem Kanit,sans-serif;color:var(--gold);letter-spacing:.1em}.song-card .sc-title{font:600 .98rem/1.25 Kanit,sans-serif;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.song-card .sc-artist{font-size:.8rem;color:var(--dim)}.song-card .sc-meta{display:flex;gap:4px;margin-top:4px}.pill{font:700 .65rem Kanit,sans-serif;padding:2px 7px;border-radius:999px;border:1px solid currentColor}.pill.easy{color:var(--green)}.pill.normal{color:var(--neon-2)}.pill.hard{color:var(--red)}.empty-state{margin:36px auto;max-width:300px;text-align:center;color:var(--dim);display:grid;gap:10px}.coin-body{flex:1;overflow-y:auto;padding:0 18px;display:grid;gap:16px;align-content:start}.now-playing{display:grid;grid-template-columns:96px 1fr;gap:12px;align-items:center}.now-playing img{width:96px;height:72px;object-fit:cover;border-radius:10px;background:#000}.np-title{font:600 1.05rem/1.25 Kanit,sans-serif}.np-artist{color:var(--dim);font-size:.85rem}.diff-grid{display:grid;gap:8px}.diff-btn{appearance:none;display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:13px 15px;color:inherit;text-align:left;cursor:pointer}.diff-btn[data-selected]{border-color:var(--neon);background:linear-gradient(180deg,#2a1038,var(--panel));box-shadow:0 0 0 1px var(--neon) inset,0 0 20px -6px var(--neon)}.diff-btn .db-name{font:600 1rem Kanit,sans-serif}.diff-btn .db-info{font-size:.78rem;color:var(--dim)}.stars{color:var(--gold);font-size:.85rem;letter-spacing:.08em}.coin-slot{position:relative;height:92px;border-radius:14px;background:linear-gradient(180deg,#2b2b33,#15151b);border:1px solid #44444f;display:grid;place-items:center;overflow:hidden}.slot-label{font:700 .75rem Kanit,sans-serif;letter-spacing:.22em;color:#9aa0b5;position:absolute;top:10px}.slot-mouth{width:64px;height:9px;border-radius:4px;background:#07070a;box-shadow:0 0 0 2px #4a4a57,0 2px 8px #000 inset;position:absolute;bottom:24px}.coin{position:absolute;top:-40px;width:34px;height:34px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff3c0,#d79b14 60%,#8a5f05);color:#5a3c00;font:800 1rem/34px Kanit,sans-serif;text-align:center;opacity:0}.coin.drop{animation:coin-drop .7s cubic-bezier(.5,0,1,.6) forwards}@keyframes coin-drop{0%{opacity:1;top:-40px;transform:rotate(0) scale(1)}70%{opacity:1;top:50px;transform:rotate(540deg) scale(.95)}to{opacity:0;top:58px;transform:rotate(640deg) scale(.4)}}.video-wrap{position:relative;width:100%;aspect-ratio:16 / 9;background:#000;padding-top:var(--safe-t)}#video-mount,#video-mount iframe{width:100%;height:100%;border:0;display:block}.crt{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(to bottom,#ffffff06 0 1px,transparent 1px 3px);box-shadow:inset 0 0 60px #000a}.icon-btn.quit{position:absolute;top:calc(var(--safe-t) + 6px);right:6px;width:32px;height:32px;font-size:.9rem;background:#000000a0}.hud{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;padding:7px 12px;background:linear-gradient(180deg,#1a0f2b,#120a1e);border-bottom:1px solid var(--line)}.hud-score{font:800 1.15rem/1 Kanit,sans-serif;color:var(--gold);font-variant-numeric:tabular-nums}.hud-acc{font-size:.72rem;color:var(--dim);font-variant-numeric:tabular-nums}.hud-mid{text-align:center;min-width:70px}.hud-combo{font:800 1.75rem/1 Kanit,sans-serif;color:#fff;text-shadow:0 0 10px var(--neon),0 0 24px var(--neon);font-variant-numeric:tabular-nums;min-height:1.75rem;transition:color .2s ease}.hud-tier{font:700 .62rem Kanit,sans-serif;letter-spacing:.22em;min-height:.8rem;margin-top:2px}.hud-combo.pop{animation:combo-pop .18s cubic-bezier(.2,1.6,.4,1)}@keyframes combo-pop{0%{transform:scale(1.45)}to{transform:scale(1)}}.hud{transition:box-shadow .35s ease,background .35s ease}body[data-combo="2"] .hud{box-shadow:inset 0 -2px #7dff5a,0 2px 18px -6px #7dff5a}body[data-combo="3"] .hud{box-shadow:inset 0 -2px #ffd166,0 2px 26px -6px #ff9a1f;background:linear-gradient(180deg,#2a1a0f,#140d1f)}body[data-combo="4"] .hud{box-shadow:inset 0 -2px #ff2ea6,0 2px 34px -4px #ff2ea6;background:linear-gradient(180deg,#2e0f2a,#170a22)}body[data-combo="5"] .hud{box-shadow:inset 0 -2px #ff6b2e,0 2px 42px -2px #ff3d00;background:linear-gradient(180deg,#33150a,#1a0a16);animation:hud-rave .9s ease-in-out infinite}@keyframes hud-rave{0%,to{filter:brightness(1)}50%{filter:brightness(1.28)}}.video-wrap{transition:box-shadow .35s ease}body[data-combo="3"] .video-wrap{box-shadow:0 0 30px -6px #ff9a1f}body[data-combo="4"] .video-wrap{box-shadow:0 0 40px -4px #ff2ea6}body[data-combo="5"] .video-wrap{box-shadow:0 0 56px -2px #ff3d00}.hud-right{justify-self:end;text-align:right;display:grid;gap:4px}.health-bar{width:78px;height:7px;border-radius:999px;background:#ffffff1a;overflow:hidden}.health-bar i{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--red),var(--gold),var(--green));transition:width .2s ease}.hud-diff{font:600 .7rem Kanit,sans-serif;color:var(--dim)}.progress{background:#ffffff12}.progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--neon),var(--neon-2))}.highway-wrap{position:relative;min-height:0}#highway{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}.overlay{position:absolute;inset:0;display:grid;place-items:center;background:#0a0612cc;backdrop-filter:blur(3px);padding:20px}.overlay-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:22px;text-align:center;display:grid;gap:12px;max-width:340px;width:100%}.overlay-card>div:first-child{font:600 1.1rem Kanit,sans-serif}.debug{position:absolute;top:6px;left:8px;font:500 .62rem/1.5 ui-monospace,monospace;color:#8affd6;background:#000000a0;padding:4px 7px;border-radius:6px;pointer-events:none;white-space:pre}#scene-result{justify-content:center;align-items:center;gap:16px;padding:calc(var(--safe-t) + 16px) 18px calc(var(--safe-b) + 16px);overflow-y:auto}.receipt{width:100%;max-width:330px;background:#f6f1e6;color:#2a2118;font:400 .85rem/1.5 ui-monospace,Noto Sans Thai,monospace;padding:18px 18px 26px;border-radius:3px;box-shadow:0 18px 40px -12px #000c;clip-path:polygon(0 0,100% 0,100% calc(100% - 8px),94% 100%,88% calc(100% - 8px),82% 100%,76% calc(100% - 8px),70% 100%,64% calc(100% - 8px),58% 100%,52% calc(100% - 8px),46% 100%,40% calc(100% - 8px),34% 100%,28% calc(100% - 8px),22% 100%,16% calc(100% - 8px),10% 100%,4% calc(100% - 8px),0 100%);animation:print .5s cubic-bezier(.2,.9,.2,1)}@keyframes print{0%{transform:translateY(-16px) scaleY(.88);opacity:0}to{transform:none;opacity:1}}.r-head{text-align:center}.r-shop{font:800 1.05rem Kanit,sans-serif;letter-spacing:.12em}.r-sub{font-size:.72rem;color:#6b5d4a}.r-rule{border-top:1px dashed #b3a690;margin:10px 0}.r-song{font:600 .98rem/1.3 Kanit,sans-serif;text-align:center}.r-diff{text-align:center;font-size:.78rem;color:#6b5d4a}.r-grade{text-align:center;font:800 3.4rem/1 Kanit,sans-serif;letter-spacing:.04em}.r-blurb{text-align:center;font-size:.82rem;color:#6b5d4a}.r-lines{display:grid;gap:3px}.r-line{display:flex;justify-content:space-between;gap:10px}.r-line b{font-variant-numeric:tabular-nums}.r-total{display:flex;justify-content:space-between;font:700 1.1rem Kanit,sans-serif}.r-foot{margin-top:14px;text-align:center;font-size:.7rem;color:#6b5d4a}.result-actions{width:100%;max-width:330px;display:grid;gap:4px;justify-items:center}.settings-body,.cal-body{flex:1;overflow-y:auto;padding:0 18px 18px;display:grid;gap:18px;align-content:start}.field{display:grid;gap:7px;font:500 .9rem Noto Sans Thai,sans-serif}.field>span b{color:var(--gold);font-variant-numeric:tabular-nums}input[type=range]{appearance:none;width:100%;height:28px;background:transparent}input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:999px;background:linear-gradient(90deg,var(--neon),var(--neon-2))}input[type=range]::-webkit-slider-thumb{appearance:none;width:24px;height:24px;margin-top:-9px;border-radius:50%;background:#fff;box-shadow:0 2px 8px #000a}.row-toggle{display:flex;align-items:center;gap:11px;font-size:.92rem}.row-toggle input{width:22px;height:22px;accent-color:var(--neon)}.credit-row{display:flex;align-items:center;gap:9px}.credit-row b{margin-left:auto;color:var(--gold);font:800 1.1rem Kanit,sans-serif}.cal-body{justify-items:center;text-align:center}.cal-ring{width:150px;height:150px;border-radius:50%;border:3px solid var(--line);display:grid;place-items:center;font:700 1.3rem Kanit,sans-serif;color:var(--dim)}.cal-ring.beat{border-color:var(--neon);box-shadow:0 0 26px -4px var(--neon);color:var(--text)}.cal-body .big-btn{max-width:420px}.toast{position:fixed;left:50%;bottom:calc(var(--safe-b) + 22px);transform:translate(-50%);background:#1d1030ee;border:1px solid var(--line);color:var(--text);padding:11px 17px;border-radius:12px;font-size:.88rem;max-width:88vw;text-align:center;z-index:50;animation:toast-in .2s ease}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%)}}@media(min-width:620px){body:before{content:"";position:fixed;inset:0;background:#05030a;z-index:-1}.scene{left:50%;transform:translate(-50%);width:430px;border-left:1px solid var(--line);border-right:1px solid var(--line)}}