:root{--neon-purple: #b14cff;--neon-cyan: #3ef0ff;--neon-pink: #ff3da6;--gold: #ffd24a;--bg: #0a0614;--panel: rgba(18, 8, 36, .82);--fret-green: #3fe34a;--fret-red: #ff3b30;--fret-yellow: #ffd60a;--fret-blue: #2f7cff;--fret-orange: #ff9500}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden;background:var(--bg);color:#fff;font-family:Russo One,system-ui,sans-serif;-webkit-user-select:none;user-select:none}#gl{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.hidden{display:none!important}.screen{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% -20%,rgba(177,76,255,.25),transparent 60%),radial-gradient(ellipse at 80% 110%,rgba(62,240,255,.12),transparent 50%),#0a0614e0;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);overflow-y:auto;overflow-x:hidden}.menu-inner,.results-inner,.loading-inner{width:min(720px,92vw);min-width:0;padding:44px 24px 48px;text-align:center;margin:auto}.logo{margin-bottom:4px}.logo img{width:min(480px,82vw);filter:drop-shadow(0 0 6px rgba(62,240,255,.7)) drop-shadow(0 0 22px rgba(177,76,255,.8)) drop-shadow(0 0 52px rgba(255,61,166,.45));animation:neonpulse 2s ease-in-out infinite,neonsway 7s ease-in-out infinite;transform-origin:center}@keyframes neonpulse{0%,to{filter:drop-shadow(0 0 6px rgba(62,240,255,.7)) drop-shadow(0 0 22px rgba(177,76,255,.8)) drop-shadow(0 0 52px rgba(255,61,166,.45)) brightness(1)}50%{filter:drop-shadow(0 0 12px rgba(62,240,255,1)) drop-shadow(0 0 36px rgba(177,76,255,1)) drop-shadow(0 0 78px rgba(255,61,166,.75)) brightness(1.18)}}@keyframes neonsway{0%,to{transform:scale(1) rotate(0)}50%{transform:scale(1.025) rotate(-.6deg)}}.home-link{position:fixed;top:16px;left:18px;z-index:60;display:block;line-height:0;transition:transform .18s ease,filter .18s ease,opacity .18s ease}.home-link.hidden{display:none}.home-link img{width:132px;height:auto;filter:drop-shadow(0 0 4px rgba(62,240,255,.6)) drop-shadow(0 0 14px rgba(177,76,255,.65))}.home-link:hover{transform:scale(1.05)}.home-link:hover img{filter:drop-shadow(0 0 6px rgba(62,240,255,.9)) drop-shadow(0 0 20px rgba(255,61,166,.7))}.sng-hint{margin-top:14px;font-size:11px;letter-spacing:.5px;color:#8a7cb3;line-height:1.6}.sng-hint strong{color:var(--neon-cyan)}.sng-hint a{color:var(--neon-cyan);text-decoration:none}.sng-hint a:hover{text-decoration:underline}.drop-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:150;display:flex;align-items:center;justify-content:center;padding:24px;pointer-events:none;background:#04020cd1;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);opacity:0;transition:opacity .16s ease}.drop-overlay.show{opacity:1}.drop-card{display:flex;flex-direction:column;align-items:center;gap:10px;padding:48px 64px;color:#e6dcff;text-align:center;border:2px dashed rgba(62,240,255,.55);border-radius:14px;background:radial-gradient(120% 120% at 50% 0%,#b14cff29,#0000 70%);box-shadow:0 0 60px #3ef0ff2e inset;animation:droppulse 1.1s ease-in-out infinite}.drop-card svg{width:46px;height:46px;color:var(--neon-cyan)}.drop-title{font-family:Metal Mania,cursive;font-size:34px;letter-spacing:2px;color:var(--neon-cyan);text-shadow:0 0 16px rgba(62,240,255,.5)}.drop-sub{font-size:13px;color:#c4b9e0;letter-spacing:1px}.drop-sub strong{color:var(--neon-pink)}@keyframes droppulse{0%,to{transform:scale(1);border-color:#3ef0ff73}50%{transform:scale(1.02);border-color:#ff3da6b3}}.tagline{color:var(--neon-pink);font-size:clamp(10px,1.6vw,12px);margin-bottom:30px;text-transform:uppercase;letter-spacing:2.5px;white-space:nowrap;text-shadow:0 0 12px rgba(255,61,166,.45)}:root{--notch: 16px;--font-metal: "Metal Mania", "Russo One", system-ui, cursive;--steel-edge: linear-gradient(180deg, #d9d4ec 0%, #9c91c2 16%, #564a82 42%, #241a44 62%, #170f30 78%, #6a5c98 100%);--steel-edge-dim: linear-gradient(180deg, #8a7fae 0%, #4e4276 28%, #241a44 60%, #150e2c 82%, #4a3f70 100%);--panel-fill: repeating-linear-gradient(0deg, rgba(255, 255, 255, .022) 0 1px, transparent 1px 4px), linear-gradient(180deg, rgba(22, 13, 40, .92), rgba(11, 6, 23, .92));--btn-fill: linear-gradient(180deg, rgba(255, 255, 255, .22), rgba(255, 255, 255, .04) 38%, rgba(0, 0, 0, .25) 100%), linear-gradient(165deg, #4a2a82 0%, #5e2370 55%, #2c1248 100%)}.metal-frame{position:relative;isolation:isolate;background:none;border:none}.metal-frame:before,.metal-frame:after{content:"";position:absolute;clip-path:var(--clip, polygon( var(--notch) 0, 100% 0, 100% calc(100% - var(--notch)), calc(100% - var(--notch)) 100%, 0 100%, 0 var(--notch) ))}.metal-frame:before{top:0;right:0;bottom:0;left:0;z-index:-2;background:var(--edge, var(--steel-edge))}.metal-frame:after{inset:var(--bw, 1.5px);z-index:-1;background:var(--fill, var(--panel-fill))}.search-row{margin-bottom:26px}.search-shell{padding:2px;background:var(--steel-edge);clip-path:polygon(var(--notch) 0,100% 0,100% calc(100% - var(--notch)),calc(100% - var(--notch)) 100%,0 100%,0 var(--notch));filter:drop-shadow(0 2px 10px rgba(0,0,0,.6)) drop-shadow(0 0 14px rgba(177,76,255,.18));transition:filter .2s}.search-shell:focus-within{filter:drop-shadow(0 2px 10px rgba(0,0,0,.6)) drop-shadow(0 0 18px rgba(255,61,166,.4))}.search-shell-inner{display:flex;align-items:stretch;background:var(--panel-fill);clip-path:polygon(15px 0,100% 0,100% calc(100% - 15px),calc(100% - 15px) 100%,0 100%,0 15px);padding:6px}.search-icon{width:22px;flex:0 0 22px;align-self:center;margin:0 6px 0 14px;color:#9c91c2}#search-input{flex:1;min-width:0;width:0;padding:13px 12px;font-size:15px;color:#fff;font-family:inherit;background:transparent;border:none;outline:none}#search-input::placeholder{color:#80719f;font-style:italic}.btn{font-family:inherit;font-size:14px;letter-spacing:2px;padding:14px 30px;border:none;cursor:pointer;color:#ece8f8;transition:transform .1s,filter .2s;text-shadow:0 1px 2px rgba(0,0,0,.6),0 0 10px rgba(177,76,255,.35)}.btn:hover{transform:translateY(-1px);filter:brightness(1.25)}.btn:active{transform:translateY(1px);filter:brightness(.9)}.btn-search{--clip: polygon(16px 0, 100% 0, 100% calc(100% - 12px) , calc(100% - 12px) 100%, 0 100%);--fill: var(--btn-fill);padding:14px 36px}.btn-primary{--clip: polygon(14px 0, 100% 0, 100% calc(100% - 12px) , calc(100% - 12px) 100%, 0 100%, 0 12px);--fill: var(--btn-fill);filter:drop-shadow(0 2px 8px rgba(0,0,0,.55)) drop-shadow(0 0 10px rgba(177,76,255,.3))}.btn-primary:hover{filter:drop-shadow(0 2px 8px rgba(0,0,0,.55)) drop-shadow(0 0 16px rgba(255,61,166,.5)) brightness(1.2)}.btn-ghost{--notch: 12px;--edge: var(--steel-edge-dim);--fill: linear-gradient(180deg, rgba(20, 12, 36, .7), rgba(10, 6, 20, .7));color:#b9a8e6}.btn-ghost:hover{color:#fff}.diff-header{display:flex;align-items:center;gap:16px;margin-bottom:12px}.diff-line{flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(154,140,195,.55))}.diff-line:last-child{background:linear-gradient(90deg,rgba(154,140,195,.55),transparent)}.diff-label{font-size:12px;color:#b8aede;letter-spacing:4px}.difficulty-row{display:flex;justify-content:center;gap:12px;margin-bottom:22px}.chip{flex:1;padding:1.5px;cursor:pointer;border:none;font-family:inherit;background:var(--steel-edge-dim);clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);transition:filter .15s;filter:drop-shadow(0 2px 6px rgba(0,0,0,.5))}.chip-inner{display:flex;flex-direction:column;align-items:center;gap:9px;padding:14px 10px 12px;background:var(--panel-fill);clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px)}.chip-name{font-size:12px;letter-spacing:2px;color:#b8aede;transition:color .15s}.chip-radio{width:12px;height:12px;border-radius:50%;border:1.5px solid #6e6396;background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.18),transparent 60%);transition:border-color .15s,box-shadow .15s,background .15s}.chip:hover{filter:drop-shadow(0 2px 6px rgba(0,0,0,.5)) brightness(1.35)}.chip.selected{background:linear-gradient(180deg,#ffe2b0,#d98c2e 30%,#8a4a14 62%,#5c2e0a 82%,#c97f33);filter:drop-shadow(0 2px 6px rgba(0,0,0,.5)) drop-shadow(0 0 9px rgba(230,150,50,.45))}.chip.selected .chip-name{color:#ffc66e;text-shadow:0 0 9px rgba(230,150,50,.55)}.chip.selected .chip-radio{border-color:#d98c2e;background:radial-gradient(circle,#f0963a 0 45%,transparent 50%);box-shadow:0 0 7px #e69632b3}.search-status{min-height:20px;font-size:13px;color:#8d7ab8;margin-bottom:10px}.demo-panel{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:8px;padding:14px 14px 14px 22px;--edge: var(--steel-edge);filter:drop-shadow(0 3px 10px rgba(0,0,0,.55))}.demo-text{font-size:12px;letter-spacing:2px;color:#b8aede;text-align:left;display:flex;align-items:center;gap:10px}.demo-bolt{color:#e6a23a;font-size:16px;filter:drop-shadow(0 0 7px rgba(230,162,58,.6))}.btn-demo{--clip: polygon(12px 0, 100% 0, 100% calc(100% - 10px) , calc(100% - 10px) 100%, 0 100%, 0 10px);--fill: var(--btn-fill);flex:0 0 auto;font-size:12px;padding:12px 24px}.help-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:18px;padding:13px 22px;--edge: var(--steel-edge-dim);filter:drop-shadow(0 3px 10px rgba(0,0,0,.5))}.help-group{display:flex;align-items:center;gap:5px}.help-label{font-size:11px;letter-spacing:2px;color:#80719f;margin-right:8px}kbd{display:inline-block;min-width:26px;padding:4px 7px;font-family:inherit;font-size:11px;text-align:center;letter-spacing:1px;background:linear-gradient(180deg,#342b54,#181126);border:1px solid #6e6396;border-top-color:#9c91c2;border-bottom-color:#2a2244;border-radius:4px;color:#ddd5f2;box-shadow:inset 0 1px #ffffff24,0 2px #00000080}.kbd-wide{padding:4px 12px}.footer-links{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:18px;flex-wrap:wrap}.footer-sep{color:#4a4063;font-size:10px}.github-link{display:inline-flex;align-items:center;gap:7px;font-size:10px;letter-spacing:2px;color:#80719f;text-decoration:none;transition:color .15s}.github-link svg{width:14px;height:14px}.github-link:hover{color:#d8c9ff}.github-link em{font-style:italic;color:var(--neon-cyan);text-shadow:0 0 8px rgba(62,240,255,.4)}.footer-link-btn{background:none;border:none;cursor:pointer;font-family:inherit;font-size:10px;letter-spacing:2px;color:#80719f;padding:0;transition:color .15s}.footer-link-btn:hover{color:#d8c9ff}.tos-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:24px;background:#04020cc7;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:tosfade .18s ease}.tos-overlay.hidden{display:none}@keyframes tosfade{0%{opacity:0}to{opacity:1}}.tos-modal{position:relative;width:min(640px,100%);max-height:min(84vh,760px);display:flex;flex-direction:column;overflow:hidden;--notch: 16px;--edge: var(--steel-edge);padding:28px 30px 26px;text-align:left;box-shadow:0 18px 60px #0009}.tos-close{position:absolute;top:12px;right:16px;background:none;border:none;cursor:pointer;color:#9c8fc0;font-size:26px;line-height:1;transition:color .15s,transform .1s}.tos-close:hover{color:#fff;transform:scale(1.1)}.tos-title{font-family:Metal Mania,cursive;font-size:30px;letter-spacing:1px;color:var(--neon-cyan);text-shadow:0 0 14px rgba(62,240,255,.45);margin:0 0 4px}.tos-sub{color:var(--neon-pink);font-size:11px;font-style:italic;margin:0 0 16px;opacity:.85}.tos-title,.tos-sub{flex:0 0 auto}.tos-body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding-right:6px;color:#c4b9e0;font-size:12.5px;line-height:1.65;overflow-wrap:break-word;word-break:break-word}.tos-body p{margin:0 0 12px}.tos-body ul{margin:0 0 12px;padding-left:20px}.tos-body li{margin:0 0 8px;overflow-wrap:break-word}.tos-body strong{color:#e6dcff}.tos-body a{color:var(--neon-cyan);text-decoration:underline;overflow-wrap:anywhere}.tos-body a:hover{color:#fff}.results{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px;text-align:left;max-height:42vh;overflow-y:auto;padding:2px}.song-card{display:flex;gap:12px;align-items:center;cursor:pointer;--notch: 10px;--edge: var(--steel-edge-dim);padding:10px;filter:drop-shadow(0 2px 6px rgba(0,0,0,.5));transition:filter .15s,transform .1s}.song-card:hover{transform:translateY(-2px);filter:drop-shadow(0 4px 10px rgba(0,0,0,.55)) brightness(1.3)}.song-card img{width:56px;height:56px;clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px)}.song-card .meta{overflow:hidden}.song-card .t{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.song-card .a{font-size:12px;color:#9d8cc9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.loading-art{width:140px;height:140px;margin-bottom:18px;clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);filter:drop-shadow(0 4px 14px rgba(0,0,0,.6)) drop-shadow(0 0 18px rgba(106,92,152,.45))}.loading-art[src=""]{display:none}#loading-title{font-family:var(--font-metal);font-size:34px;letter-spacing:2px;font-weight:400;margin-bottom:22px;max-width:100%;background:linear-gradient(180deg,#fff,#e9eef5 15%,#b6c1cf 33%,#6e798b 47%,#4f5867 51%,#a7b2c0 63%,#f3f6fb,#97a3b3 91%,#cdd6e2);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:.5px rgba(38,42,58,.35);filter:drop-shadow(0 1px 0 rgba(255,255,255,.25)) drop-shadow(0 2px 5px rgba(0,0,0,.6))}#loading-status{color:#9d8cc9;margin-top:18px;font-size:14px}.spinner{width:54px;height:54px;margin:0 auto;border-radius:50%;border:4px solid rgba(110,99,150,.3);border-top-color:#d98c2e;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}#hud{position:fixed;top:0;right:0;bottom:0;left:0;z-index:5;pointer-events:none}.hud-left{position:absolute;bottom:18px;left:18px;display:flex;flex-direction:column;gap:14px}.score-panel{--notch: 12px;padding:12px 18px;min-width:170px;filter:drop-shadow(0 3px 10px rgba(0,0,0,.55))}.score-label{font-size:11px;letter-spacing:3px;color:#80719f}.score-value{font-family:var(--font-metal);font-size:34px;letter-spacing:1px;color:#ece8f8;text-shadow:0 1px 2px rgba(0,0,0,.7),0 0 10px rgba(154,140,195,.4)}.mult-badge{display:inline-block;margin-top:6px;padding:2px 14px;clip-path:polygon(7px 0,100% 0,calc(100% - 7px) 100%,0 100%);font-family:var(--font-metal);font-size:18px;color:#1a1226;background:linear-gradient(180deg,#e8e4f2,#9c91b8 55%,#6e6390);transition:background .2s,transform .15s}.mult-badge.m2{background:linear-gradient(180deg,#ffd9a0,#d98c2e 55%,#8a4a14)}.mult-badge.m3{background:linear-gradient(180deg,#b8e4ec,#5a9eb0 55%,#2c5a6a)}.mult-badge.m4{background:linear-gradient(180deg,#c5a8e8,#7a4ab0 55%,#3c1f66);color:#f4eeff}.mult-badge.sp{background:linear-gradient(180deg,#c4f2fa,#4a9ec0 55%,#1f4a66);color:#0c1a26;animation:pulse .6s infinite alternate}@keyframes pulse{0%{transform:scale(1)}to{transform:scale(1.12)}}.sp-panel{--notch: 10px;padding:10px 18px;filter:drop-shadow(0 3px 10px rgba(0,0,0,.55))}.sp-label{font-size:10px;letter-spacing:3px;color:#7ab8c4;margin-bottom:6px}.sp-bar{width:150px;height:10px;background:#00000080;border:1px solid rgba(110,99,150,.45);clip-path:polygon(4px 0,100% 0,calc(100% - 4px) 100%,0 100%);overflow:hidden}.sp-fill{height:100%;width:0%;background:linear-gradient(90deg,#2a8a9c,#6fd9e8);box-shadow:0 0 8px #6fd9e899;transition:width .15s linear}.sp-fill.ready{animation:spblink .5s infinite alternate}@keyframes spblink{0%{filter:brightness(1)}to{filter:brightness(1.8)}}.hud-right{position:absolute;top:18px;right:18px;display:flex;flex-direction:column;align-items:flex-end;gap:14px}.song-tag:empty{display:none}.song-tag{--notch: 10px;padding:10px 16px;font-size:13px;color:#d8c9ff;max-width:320px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;filter:drop-shadow(0 3px 10px rgba(0,0,0,.55))}.rock-panel{--notch: 10px;padding:10px 16px;filter:drop-shadow(0 3px 10px rgba(0,0,0,.55))}.rock-label{font-size:10px;letter-spacing:3px;color:#80719f;margin-bottom:6px;text-align:right}.rock-bar{width:150px;height:12px;background:#00000080;border:1px solid rgba(110,99,150,.45);clip-path:polygon(4px 0,100% 0,calc(100% - 4px) 100%,0 100%);overflow:hidden}.rock-fill{height:100%;width:60%;background:linear-gradient(90deg,#c0392f,#d9a82e,#4a9e52);background-size:250px 100%;background-position:left;transition:width .2s}.fx-panel{--notch: 8px;position:absolute;bottom:18px;right:18px;display:flex;align-items:center;gap:10px;padding:8px 14px;pointer-events:auto;filter:drop-shadow(0 3px 10px rgba(0,0,0,.55));opacity:.78;transition:opacity .2s}.fx-panel:hover{opacity:1}.fx-label{font-size:10px;letter-spacing:3px;color:#80719f}.fx-value{font-size:11px;color:#b8aede;min-width:36px;text-align:right;font-variant-numeric:tabular-nums}.fx-slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:130px;height:6px;background:linear-gradient(90deg,#2a8a9c 0%,#6fd9e8 var(--fxpct, 100%),rgba(110,99,150,.35) var(--fxpct, 100%));border:1px solid rgba(110,99,150,.5);border-radius:3px;outline:none;cursor:pointer}.fx-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#b8aede 55%,#5a4e80);border:1px solid #2a1f4a;box-shadow:0 1px 3px #0009,0 0 6px #6fd9e880;cursor:pointer}.fx-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#b8aede 55%,#5a4e80);border:1px solid #2a1f4a;box-shadow:0 1px 3px #0009,0 0 6px #6fd9e880;cursor:pointer}.touch-controls,.m-hud{display:none}@media (hover: none) and (pointer: coarse){.touch-controls{display:block;position:absolute;left:0;right:0;bottom:0;padding:6px 6px calc(6px + env(safe-area-inset-bottom,0px));pointer-events:none;z-index:8}.touch-frets{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;width:100%;box-sizing:border-box}.touch-fret{pointer-events:auto;min-width:0;height:clamp(72px,12vh,116px);border:2px solid rgba(255,255,255,.28);border-radius:12px;background:radial-gradient(120% 80% at 50% 0%,rgba(255,255,255,.32),transparent 60%),var(--pad, #555);box-shadow:inset 0 -6px 14px #00000073,0 3px 10px #00000080;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:none;transition:transform .05s ease,filter .05s ease,box-shadow .05s ease}.touch-fret.pressed{transform:translateY(3px) scale(.97);filter:brightness(1.7) saturate(1.2);box-shadow:inset 0 4px 14px #0000008c,0 0 18px var(--pad-glow, rgba(255, 255, 255, .7))}.touch-fret.lane-0{--pad: linear-gradient(180deg, #5cff6a, #1f9e2c);--pad-glow: rgba(92, 255, 106, .8)}.touch-fret.lane-1{--pad: linear-gradient(180deg, #ff6a60, #c0271d);--pad-glow: rgba(255, 106, 96, .8)}.touch-fret.lane-2{--pad: linear-gradient(180deg, #ffe24a, #d9a300);--pad-glow: rgba(255, 226, 74, .8)}.touch-fret.lane-3{--pad: linear-gradient(180deg, #5aa0ff, #1f5ec0);--pad-glow: rgba(90, 160, 255, .8)}.touch-fret.lane-4{--pad: linear-gradient(180deg, #ffb04a, #d97400);--pad-glow: rgba(255, 176, 74, .8)}.touch-sp{pointer-events:auto;position:absolute;right:8px;bottom:calc(8px + clamp(72px,12vh,116px) + env(safe-area-inset-bottom,0px));width:52px;height:52px;border-radius:50%;border:2px solid rgba(111,217,232,.5);background:linear-gradient(180deg,#1a2a33,#0c1a22);color:#4a6573;font-size:26px;line-height:1;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:none;transition:transform .05s ease,color .15s,box-shadow .15s}.touch-sp.ready{color:#8ef0ff;border-color:#6fd9e8;box-shadow:0 0 16px #6fd9e899;animation:sppulse .6s infinite alternate}.touch-sp.active{color:#fff;border-color:#fff;box-shadow:0 0 22px #ffffffb3}.touch-sp:active{transform:translateY(3px) scale(.96)}@keyframes sppulse{0%{filter:brightness(1)}to{filter:brightness(1.5)}}.help-bar,#hud .fx-panel{display:none}}.streak-counter{position:absolute;bottom:26px;left:50%;transform:translate(-50%);font-family:var(--font-metal);font-size:20px;color:#ffc66e;letter-spacing:2px;text-shadow:0 1px 2px rgba(0,0,0,.7),0 0 12px rgba(230,150,50,.55)}.streak-counter span{font-size:30px}.judge{position:absolute;bottom:33%;left:50%;transform:translate(-50%);font-family:var(--font-metal);font-size:48px;letter-spacing:2px;animation:judgepop .45s ease-out forwards;pointer-events:none}.judge.perfect{color:#ffc66e;text-shadow:0 2px 3px rgba(0,0,0,.7),0 0 16px rgba(230,150,50,.65)}.judge.good{color:#8fd4e0;text-shadow:0 2px 3px rgba(0,0,0,.7),0 0 14px rgba(111,217,232,.55)}.judge.miss{color:#e05548;text-shadow:0 2px 3px rgba(0,0,0,.7),0 0 14px rgba(255,59,48,.55)}@keyframes judgepop{0%{transform:translate(-50%,14px) scale(.6);opacity:0}25%{transform:translate(-50%) scale(1.15);opacity:1}70%{transform:translate(-50%,-6px) scale(1);opacity:1}to{transform:translate(-50%,-18px) scale(.95);opacity:0}}.banner{position:absolute;top:22%;left:50%;transform:translate(-50%);font-family:var(--font-metal);font-size:58px;letter-spacing:3px;color:#ece8f8;text-shadow:0 2px 4px rgba(0,0,0,.8),0 0 20px rgba(122,75,176,.7),0 0 50px rgba(90,58,140,.5);animation:bannerpop 1.6s ease-out forwards;white-space:nowrap}@keyframes bannerpop{0%{transform:translate(-50%) scale(.4);opacity:0}15%{transform:translate(-50%) scale(1.1);opacity:1}80%{transform:translate(-50%) scale(1);opacity:1}to{transform:translate(-50%) scale(1.4);opacity:0}}.countdown{position:absolute;top:38%;left:50%;transform:translate(-50%,-50%);font-family:var(--font-metal);font-size:130px;background:linear-gradient(180deg,#fff 12%,#d9d4ec 38%,#8a7fae,#564a82 78%,#cfc9e8 95%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 3px 6px rgba(0,0,0,.7)) drop-shadow(0 0 24px rgba(111,217,232,.35))}#results-verdict{white-space:nowrap;font-family:var(--font-metal);font-size:clamp(24px,6.5vw,68px);letter-spacing:3px;font-weight:400;background:linear-gradient(180deg,#fff 4%,#dce7f5 20%,#9fb6d6 38%,#5b82c4 50%,#2f4f93 60%,#9db4d8 74%,#f1f6fc 86%,#b9cae6);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:.5px rgba(28,40,70,.4);filter:drop-shadow(0 3px 5px rgba(0,0,0,.75)) drop-shadow(0 0 18px rgba(90,150,235,.4))}#results-verdict.failed{background:linear-gradient(180deg,#fff 6%,#f0b0a8,#c0392f,#5c120a 72%,#e08a7a 90%);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 3px 5px rgba(0,0,0,.75)) drop-shadow(0 0 18px rgba(192,57,47,.4))}.stars{font-size:44px;letter-spacing:8px;color:#f0a93a;text-shadow:0 2px 3px rgba(0,0,0,.7),0 0 14px rgba(230,150,50,.5);margin:8px 0 4px}.results-song{color:#b9a8e6;margin-bottom:26px;font-size:15px}.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-bottom:30px}.stat{--notch: 12px;--edge: var(--steel-edge-dim);padding:16px;filter:drop-shadow(0 3px 8px rgba(0,0,0,.5))}.stat-label{font-size:10px;letter-spacing:2px;color:#80719f;margin-bottom:8px}.stat-value{font-family:var(--font-metal);font-size:30px;letter-spacing:1px;color:#ece8f8;text-shadow:0 1px 2px rgba(0,0,0,.7),0 0 10px rgba(154,140,195,.4)}.results-buttons{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}@media (max-width: 640px){.menu-inner,.results-inner,.loading-inner{padding:28px 12px 36px}.logo img{width:min(340px,86vw)}.tagline{white-space:normal;line-height:1.8;font-size:10px;letter-spacing:2px;margin-bottom:22px}.search-icon{display:none}.search-shell-inner{padding:4px}#search-input{padding:11px 10px;font-size:16px}#search-input::placeholder{font-size:13px}.btn-search{padding:11px 16px;font-size:12px;letter-spacing:1px}.difficulty-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.chip-inner{padding:12px 8px 10px;gap:7px}.results{grid-template-columns:1fr;max-height:38vh}.demo-panel{flex-direction:column;gap:12px;padding:16px 14px}.demo-text{justify-content:center;text-align:center;line-height:1.7}.help-bar{flex-direction:column;align-items:center;gap:10px;padding:14px 16px}.tos-overlay{padding:12px}.tos-modal{padding:22px 18px 18px;max-height:88vh}.tos-title{font-size:24px;padding-right:28px}.tos-body{font-size:12px}.loading-inner{display:flex;flex-direction:column;align-items:center;padding:24px 16px}#loading-title{font-size:22px;margin-bottom:16px}.loading-art{width:96px;height:96px;margin-bottom:14px}#loading-status{font-size:12px;margin-top:14px;text-align:center}.hud-left{bottom:10px;left:10px;gap:8px}.hud-right{top:10px;right:10px;gap:8px}.score-panel{min-width:120px;padding:8px 12px}.score-value{font-size:26px}.mult-badge{font-size:15px;padding:1px 10px}.sp-panel,.rock-panel{padding:7px 12px}.sp-bar,.rock-bar{width:104px}.song-tag{max-width:46vw;font-size:11px;padding:8px 12px}.fx-panel{bottom:10px;right:10px;padding:6px 10px;gap:7px}.fx-slider{width:90px}.judge{font-size:38px;bottom:auto;top:42%;transform:translate(-50%,-50%)}.banner{font-size:30px;white-space:normal;text-align:center;width:90vw;line-height:1.2;top:26%}.countdown{font-size:clamp(72px,26vw,110px);top:50%}.streak-counter{font-size:16px}.streak-counter span{font-size:24px}#results-verdict{font-size:clamp(17px,6vw,40px);letter-spacing:1px}.results-song{font-size:13px;margin-bottom:18px}.stars{font-size:36px;letter-spacing:6px}.stat-grid{grid-template-columns:1fr 1fr;gap:10px}.stat{padding:12px}.stat-value{font-size:24px}.results-buttons .btn{padding:13px 22px;font-size:13px}}@media (hover: none) and (pointer: coarse){html,body{overflow:hidden;overscroll-behavior:none}#hud{top:var(--app-top, 0px);bottom:auto;left:0;right:auto;width:var(--app-w, 100vw);height:var(--app-h, 100svh)}.home-link{top:calc(var(--app-top, 0px) + 6px);right:8px;left:auto}.home-link img{display:none}.home-link:after{content:"×";display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:#140c24b3;border:1px solid rgba(110,99,150,.45);color:#cfc2ee;font-size:22px;line-height:1}#hud .hud-left,#hud .hud-right,#hud .fx-panel,.help-bar{display:none}.m-hud{display:flex;flex-direction:column;gap:7px;position:absolute;top:0;left:0;width:100%;box-sizing:border-box;padding:8px 52px 10px 12px;background:linear-gradient(180deg,#080412b8,#08041200);pointer-events:none}.m-hud-top{display:flex;align-items:baseline;gap:10px;min-width:0}.m-score{display:flex;align-items:baseline;gap:6px;flex:0 0 auto}.m-score-num{font-family:var(--font-metal);font-size:26px;line-height:1;color:#ece8f8;text-shadow:0 1px 2px rgba(0,0,0,.7),0 0 10px rgba(154,140,195,.4);font-variant-numeric:tabular-nums}.m-mult{font-family:var(--font-metal);font-size:15px;line-height:1;color:#c9bdf0}.m-mult.m2{color:#ffc98a}.m-mult.m3{color:#8fd6e6}.m-mult.m4{color:#c8a8ff}.m-mult.sp{color:#8ef0ff;text-shadow:0 0 10px rgba(111,217,232,.7)}.m-song{flex:1 1 auto;min-width:0;font-size:12px;color:#d8c9ff;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:right}.m-meters{display:flex;gap:10px}.m-meter{flex:1 1 0;display:flex;align-items:center;gap:7px;min-width:0}.m-meter-label{font-size:9px;letter-spacing:1.5px;color:#8a7cb3;flex:0 0 auto}.m-meter-track{flex:1 1 auto;height:7px;border-radius:4px;background:#00000073;box-shadow:inset 0 0 0 1px #6e639659;overflow:hidden}.m-meter-fill{height:100%;width:0%;border-radius:4px;transition:width .15s linear}.m-sp-fill{background:linear-gradient(90deg,#2a8a9c,#6fd9e8)}.m-sp-fill.ready{animation:spblink .5s infinite alternate}.m-sp-fill.active{background:linear-gradient(90deg,#6fd9e8,#c4f2fa)}.m-rock-fill{background:linear-gradient(90deg,#c0392f,#d9a82e,#4a9e52);background-size:200px 100%}.judge,.banner,.countdown{max-width:94vw}#hud .streak-counter{bottom:calc(14px + clamp(72px,12vh,116px) + env(safe-area-inset-bottom,0px))}}