:root{font-family:Orbitron,Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:#f4f7ff;background:#0f0722;--pink: #ff2d87;--cyan: #4ee7ff;--amber: #ffcf40;--purple: #9c4dff;--green: #4eff9e;--red: #ff2d2d;--navy: #0f0722;--navy-2: #1a0e36}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--navy)}#app{display:block;width:100vw;height:100vh;image-rendering:pixelated;image-rendering:crisp-edges;image-rendering:-moz-crisp-edges}#flash{position:fixed;inset:0;pointer-events:none;z-index:3;opacity:0}#flash.flash-Perfect{animation:flashPop .26s ease-out;background:radial-gradient(ellipse at center,rgba(255,207,64,.55),rgba(255,45,135,.15) 40%,transparent 70%)}#flash.flash-Great{animation:flashPop .22s ease-out;background:radial-gradient(ellipse at center,rgba(78,231,255,.45),transparent 65%)}#flash.flash-Good{animation:flashPop .18s ease-out;background:radial-gradient(ellipse at center,rgba(78,255,158,.3),transparent 60%)}#flash.flash-Miss{animation:flashPop .22s ease-out;background:radial-gradient(ellipse at center,rgba(255,45,45,.35),transparent 70%)}@keyframes flashPop{0%{opacity:0}30%{opacity:1}to{opacity:0}}#hud-left,#hud-right{position:fixed;top:16px;z-index:5;display:grid;gap:6px;padding:10px 14px;min-width:220px;border-radius:10px;background:#0f0722c7;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,45,135,.4);box-shadow:0 0 24px #ff2d8740,inset 0 0 12px #4ee7ff14;font-family:Orbitron,sans-serif}#hud-left{left:16px}#hud-right{right:16px;text-align:right;border-color:#4ee7ff66;box-shadow:0 0 24px #4ee7ff40,inset 0 0 12px #ff2d8714}.hud-tag{font-size:9px;letter-spacing:.32em;font-weight:700;color:var(--pink);text-shadow:0 0 8px rgba(255,45,135,.6);text-transform:uppercase}#status{font-family:VT323,Orbitron,monospace;font-size:18px;line-height:1.1;color:var(--green);text-shadow:0 0 8px rgba(78,255,158,.7);letter-spacing:.12em;white-space:pre-line}#hud-right .stat-row{display:flex;justify-content:space-between;gap:16px;font-variant-numeric:tabular-nums;font-weight:800;font-size:22px;letter-spacing:.05em}#hud-right .stat-row .label{opacity:.7;font-weight:500;font-size:11px;letter-spacing:.15em;color:var(--cyan)}#hud-right .stat-row.small{font-size:14px;font-weight:600}#score{color:var(--amber);text-shadow:0 0 12px rgba(255,207,64,.9),0 0 4px rgba(255,207,64,1);transition:transform .15s ease}#score.pulse{animation:scorePulse .42s cubic-bezier(.2,1.2,.3,1)}@keyframes scorePulse{0%{transform:scale(1)}30%{transform:scale(1.35);color:#fffba0;text-shadow:0 0 22px rgba(255,255,160,1)}to{transform:scale(1)}}#combo{color:var(--pink);text-shadow:0 0 12px rgba(255,45,135,.9);transition:transform .15s ease}#combo.pulse{animation:comboPulse .36s cubic-bezier(.2,1.2,.3,1)}@keyframes comboPulse{0%{transform:scale(1)}30%{transform:scale(1.4) rotate(-3deg);color:#ff7ab8}to{transform:scale(1)}}#combo.break{animation:comboBreak .52s ease-out}@keyframes comboBreak{0%{transform:scale(1);color:var(--pink)}20%{transform:scale(1.3) rotate(8deg);color:var(--red)}60%{transform:scale(.8) rotate(-6deg);color:var(--red);opacity:.6}to{transform:scale(1);opacity:1;color:var(--pink)}}#score-gain-layer{position:fixed;top:70px;right:250px;width:300px;height:400px;pointer-events:none;z-index:6;overflow:visible}.score-gain{position:absolute;top:30%;right:0;font-size:28px;font-weight:900;letter-spacing:.06em;animation:gainFloat 1s cubic-bezier(.2,.8,.3,1) forwards;text-shadow:0 0 14px currentColor,0 2px 8px rgba(0,0,0,.6);white-space:nowrap}.score-gain .gain-combo{font-size:16px;opacity:.85;margin-left:6px}.gain-Perfect{color:#fff48a}.gain-Great{color:var(--cyan)}.gain-Good{color:var(--green)}@keyframes gainFloat{0%{transform:translateY(0) scale(.8);opacity:0}15%{transform:translateY(-10px) scale(1.1);opacity:1}70%{transform:translateY(-60px) scale(1);opacity:1}to{transform:translateY(-100px) scale(.9);opacity:0}}#note-area{position:fixed;left:0;right:0;bottom:90px;display:flex;flex-direction:column;align-items:center;gap:18px;z-index:4;pointer-events:none}#judgment{height:60px;font-size:48px;font-weight:900;letter-spacing:.12em;text-shadow:0 0 18px currentColor,0 4px 14px rgba(0,0,0,.5);opacity:0;font-family:Orbitron,sans-serif}#judgment.show.pop{animation:judgmentPop .8s cubic-bezier(.2,1.2,.3,1) forwards}@keyframes judgmentPop{0%{transform:scale(.5) rotate(-6deg);opacity:0}15%{transform:scale(1.5) rotate(3deg);opacity:1}30%{transform:scale(1) rotate(0);opacity:1}80%{transform:scale(1);opacity:1}to{transform:scale(1.1);opacity:0}}#judgment.Perfect{color:#ffeb3b}#judgment.Great{color:var(--cyan)}#judgment.Good{color:var(--green)}#judgment.Miss{color:var(--red)}#note-cue{display:grid;gap:6px;padding:14px 22px;min-width:260px;border-radius:12px;background:#0f0722e0;border:2px solid var(--cyan);text-align:center;transition:transform .12s ease,border-color .12s ease,box-shadow .12s ease,opacity .12s ease;box-shadow:0 0 24px #4ee7ff80,inset 0 0 12px #4ee7ff26}#note-cue.hidden{opacity:0;transform:translateY(12px)}#note-cue.hot{border-color:var(--amber);box-shadow:0 0 32px #ffcf40e6,inset 0 0 16px #ffcf404d;animation:hotPulse .3s ease-in-out infinite alternate}@keyframes hotPulse{0%{transform:scale(1)}to{transform:scale(1.04)}}#note-key{font-size:30px;font-weight:900;letter-spacing:.08em;color:var(--pink);text-shadow:0 0 14px rgba(255,45,135,.8);font-family:Orbitron,sans-serif}#note-label{font-size:13px;letter-spacing:.12em;color:var(--amber);text-shadow:0 0 8px rgba(255,207,64,.5)}#note-progress{height:8px;border-radius:4px;background:#ffffff1a;overflow:hidden;border:1px solid rgba(78,231,255,.3)}#note-progress-fill{height:100%;width:0%;background:linear-gradient(90deg,var(--cyan),var(--amber),var(--pink));transition:width 60ms linear;box-shadow:0 0 10px #ffcf40cc}#controls-hint{position:fixed;bottom:16px;left:50%;transform:translate(-50%);z-index:4;pointer-events:none;display:flex;align-items:center;gap:8px;padding:8px 16px;border-radius:999px;background:#0f0722b3;border:1px solid rgba(78,231,255,.35);box-shadow:0 0 18px #4ee7ff40,inset 0 0 12px #ff2d8714;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);font-family:Orbitron,sans-serif;flex-wrap:wrap;justify-content:center;max-width:92vw}.hint-key{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 6px;border-radius:4px;background:linear-gradient(180deg,#2a2c34,#14161c);border:1px solid rgba(78,231,255,.4);color:#e8f8ff;font-size:10px;font-weight:800;letter-spacing:.05em;text-shadow:0 0 6px rgba(78,231,255,.5);box-shadow:inset 0 1px #ffffff1f,0 1px 2px #00000080}.hint-act{font-size:10px;letter-spacing:.22em;font-weight:700;color:var(--cyan);text-shadow:0 0 6px rgba(78,231,255,.55);margin-right:6px;margin-left:2px}.hint-sep{color:#ff2d878c;font-size:11px;margin:0 2px}#cinema-bars{position:fixed;inset:0;z-index:7;pointer-events:none;overflow:hidden}.cinema-bar{position:absolute;left:0;right:0;height:9vh;background:#000;box-shadow:0 0 18px #000000d9;transition:transform .32s cubic-bezier(.55,0,.15,1)}.cinema-bar-top{top:0;transform:translateY(-110%);border-bottom:1px solid rgba(255,45,135,.3)}.cinema-bar-bottom{bottom:0;transform:translateY(110%);border-top:1px solid rgba(78,231,255,.3)}#cinema-bars.visible .cinema-bar-top,#cinema-bars.visible .cinema-bar-bottom{transform:translateY(0)}.cinema-tag{position:absolute;top:50%;right:24px;transform:translateY(-50%);font-family:Orbitron,sans-serif;font-weight:900;font-size:12px;letter-spacing:.42em;color:#fff;text-shadow:0 0 8px rgba(255,45,135,.85),0 0 16px rgba(78,231,255,.45);opacity:0}#cinema-bars.visible .cinema-tag{animation:cinemaTagPulse 1.6s ease-out forwards}@keyframes cinemaTagPulse{0%{opacity:0;transform:translateY(-50%) translate(12px)}18%{opacity:1;transform:translateY(-50%) translate(0)}72%{opacity:1;transform:translateY(-50%) translate(0)}to{opacity:0;transform:translateY(-50%) translate(-6px)}}#cinema-flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none}#cinema-bars.visible #cinema-flash{animation:cinemaFlash .24s ease-out}@keyframes cinemaFlash{0%{opacity:0}20%{opacity:.28}to{opacity:0}}#song-progress{position:fixed;top:14px;left:50%;transform:translate(-50%);width:min(880px,86vw);z-index:5;font-family:Orbitron,sans-serif;pointer-events:none;transition:opacity .22s ease}#song-progress.hidden{opacity:0}#song-progress .progress-bar{position:relative;height:14px;background:#080416b8;border:1px solid rgba(255,255,255,.18);border-radius:4px;overflow:hidden;box-shadow:inset 0 0 10px #000000b3,0 0 14px #0000008c}#song-progress .progress-sections{position:absolute;inset:0}.progress-section-block{position:absolute;top:0;bottom:0}.progress-section-block.intro,.progress-section-block.outro{background:#50506e6b}.progress-section-block.verse{background:#5082c86b}.progress-section-block.preChorus{background:#ffb4508c}.progress-section-block.chorus{background:#ff3c82b3}.progress-section-block.bridge{background:#a064dc80}#song-progress .progress-fill{position:absolute;top:0;left:0;bottom:0;width:0%;background:linear-gradient(90deg,#fff0,#ffffff2e 70%,#ffffff5c);border-right:2px solid rgba(255,255,255,.95);box-shadow:0 0 10px #ffffffd9,0 0 22px #ff3c8299;pointer-events:none}#song-progress .progress-times{display:flex;justify-content:space-between;align-items:center;margin-top:4px;font-size:11px;letter-spacing:.18em;color:#ffffffd9;text-shadow:0 0 4px rgba(0,0,0,.85)}#song-progress .progress-label{color:#fffffff2;font-weight:700;letter-spacing:.32em;text-shadow:0 0 6px rgba(255,60,130,.65)}#song-select{position:fixed;inset:0;z-index:50;display:grid;grid-template-rows:auto 1fr auto;align-items:center;justify-items:center;gap:clamp(18px,3vh,36px);padding:clamp(20px,4vh,48px) 24px;background:linear-gradient(180deg,#050214eb,#0f07228c 18%,#0f07220d 42% 58%,#0f072299 80%,#050214f2);overflow:hidden;transition:opacity .6s ease,visibility .6s ease;font-family:Orbitron,system-ui,sans-serif}#song-select.done{opacity:0;visibility:hidden;pointer-events:none}.select-bg{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0}#song-select .select-bg .select-stars,#song-select .select-bg .select-sun,#song-select .select-bg .select-grid{display:none}#song-select .select-bg .select-scanlines{opacity:.18}#song-select .select-bg .select-vignette{background:radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.45) 100%)}.select-stars{position:absolute;inset:0;background-image:radial-gradient(1px 1px at 20% 12%,#fff,transparent 60%),radial-gradient(1px 1px at 70% 8%,#aef,transparent 60%),radial-gradient(1.5px 1.5px at 35% 22%,#fff,transparent 60%),radial-gradient(1px 1px at 85% 18%,#fef,transparent 60%),radial-gradient(1px 1px at 50% 6%,#fff,transparent 60%),radial-gradient(1.5px 1.5px at 12% 32%,#aef,transparent 60%),radial-gradient(1px 1px at 92% 38%,#fff,transparent 60%),radial-gradient(1px 1px at 60% 28%,#fff,transparent 60%);opacity:.85;animation:starsTwinkle 4s ease-in-out infinite alternate}@keyframes starsTwinkle{0%{opacity:.4}to{opacity:.95}}.select-sun{position:absolute;left:50%;top:30%;transform:translate(-50%,-50%);width:clamp(360px,60vw,620px);aspect-ratio:1 / 1;border-radius:50%;background:radial-gradient(circle at 50% 45%,#fff8b0 0%,#ffcf40 18%,#ff7eb6 50%,#ff2d87 70%,transparent 78%);filter:blur(1px);box-shadow:0 0 80px #ff509680}.select-sun:after{content:"";position:absolute;inset:0;border-radius:50%;background:repeating-linear-gradient(180deg,transparent 0,transparent 38px,rgba(15,7,34,.92) 38px,rgba(15,7,34,.92) 46px,transparent 46px,transparent 78px,rgba(15,7,34,.7) 78px,rgba(15,7,34,.7) 84px,transparent 84px,transparent 130px,rgba(15,7,34,.45) 130px,rgba(15,7,34,.45) 138px);mask-image:linear-gradient(180deg,transparent 38%,black 50%,black 100%);-webkit-mask-image:linear-gradient(180deg,transparent 38%,black 50%,black 100%)}.select-grid{position:absolute;inset:58% -10% -8%;background-image:linear-gradient(0deg,rgba(255,45,135,.85) 1px,transparent 1px),linear-gradient(90deg,rgba(78,231,255,.55) 1px,transparent 1px);background-size:100% 60px,80px 100%;transform:perspective(440px) rotateX(60deg);transform-origin:top center;animation:gridScroll 4.5s linear infinite;mask-image:linear-gradient(to bottom,transparent 0%,black 40%,black 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,black 40%,black 100%);opacity:.85}@keyframes gridScroll{0%{background-position:0 0,0 0}to{background-position:0 60px,0 0}}.select-scanlines{position:absolute;inset:0;background:repeating-linear-gradient(0deg,#0000 0 2px,#0000002e 2px 3px);mix-blend-mode:multiply;opacity:.5}.select-vignette{position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 40%,rgba(0,0,0,.55) 100%)}.select-header{position:relative;z-index:2;text-align:center;display:grid;gap:8px;margin-top:6px}.select-mark{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:11px;letter-spacing:.42em;color:var(--cyan);text-shadow:0 0 10px rgba(78,231,255,.7);font-weight:700;text-transform:uppercase;margin:0 auto}.select-mark .dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--red);box-shadow:0 0 8px var(--red),0 0 16px #ff2d2d99;animation:ledBlink 2s ease-in-out infinite}.select-title{margin:0;display:grid;gap:0;line-height:.92;font-weight:900;font-style:italic;letter-spacing:.05em;text-transform:uppercase;padding-inline-end:.1em}.select-title .title-line{display:block;font-size:clamp(44px,9vw,96px);background:linear-gradient(180deg,#fffbe9,#ffe27a 28%,#ff5dab 62%,#ff2d87 90%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 14px rgba(255,45,135,.55)) drop-shadow(0 0 28px rgba(255,80,150,.4))}.select-title .title-accent{background:linear-gradient(180deg,#d6f6ff,#4ee7ff,#9c4dff 80%,#ff2d87);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 14px rgba(78,231,255,.55)) drop-shadow(0 0 28px rgba(156,77,255,.4))}.select-subtitle{font-size:clamp(14px,1.6vw,18px);letter-spacing:.42em;font-weight:700;color:var(--amber);text-shadow:0 0 8px rgba(255,207,64,.65),0 0 14px rgba(255,45,135,.35);margin-top:6px;font-style:italic;padding-inline-end:.12em}.select-sub{font-size:10px;letter-spacing:.34em;color:#ffffffa6;text-shadow:0 0 6px rgba(78,231,255,.45);font-weight:700}#cassette-rack{position:relative;z-index:2;display:flex;gap:clamp(16px,3vw,36px);align-items:flex-end;justify-content:center;flex-wrap:wrap;padding:30px 16px 50px;max-width:1200px}.cassette{position:relative;width:260px;height:168px;padding:0;margin:0;background:none;border:0;cursor:pointer;filter:drop-shadow(0 18px 26px rgba(0,0,0,.6));transition:transform .32s cubic-bezier(.2,1.2,.3,1),filter .24s ease;font-family:inherit;color:inherit}.cassette.inserted{visibility:hidden}.cassette:hover{transform:translateY(-10px) rotate(-1deg)}.cassette.selected{transform:translateY(-30px) scale(1.06);filter:drop-shadow(0 0 24px var(--c-label, #ff2d87)) drop-shadow(0 0 48px var(--c-accent, #4ee7ff))}.cassette.selected:after{content:"◢ NOW SELECTED ◣";position:absolute;left:50%;bottom:-22px;transform:translate(-50%);font-size:10px;letter-spacing:.32em;font-weight:700;color:var(--c-accent, #4ee7ff);text-shadow:0 0 10px currentColor;white-space:nowrap}.cas-body{position:relative;width:100%;height:100%;border-radius:7px;background:linear-gradient(135deg,rgba(255,255,255,.12),transparent 38%),linear-gradient(180deg,var(--c-body, #1a0e36),color-mix(in srgb,var(--c-body, #1a0e36) 60%,#000));box-shadow:inset 0 1px #ffffff38,inset 0 -2px #0000008c,inset 0 0 0 1px #ffffff0d;overflow:hidden}.cas-label{position:absolute;top:9px;left:9px;right:9px;height:88px;border-radius:3px;padding:7px 10px 6px;background:repeating-linear-gradient(0deg,color-mix(in srgb,var(--c-label) 92%,white) 0 13px,color-mix(in srgb,var(--c-label) 70%,black) 13px 14px),var(--c-label);color:var(--c-ink);display:grid;grid-template-rows:auto 1fr auto auto;text-align:center;box-shadow:inset 0 0 0 1px #0000004d,0 1px #fff3}.cas-side{font-size:8px;letter-spacing:.3em;font-weight:700;opacity:.85;text-align:left}.cas-title{font-size:18px;font-weight:900;letter-spacing:.02em;line-height:.95;align-self:end;text-shadow:0 1px 0 rgba(0,0,0,.25);font-style:italic;padding-inline-end:.25em;overflow-wrap:anywhere;word-break:break-word;max-width:100%}.cas-romaji{font-size:9px;letter-spacing:.18em;font-weight:700;opacity:.78;align-self:start;margin-top:2px;font-style:italic;text-transform:uppercase;padding-inline-end:.18em;overflow-wrap:anywhere}.cas-meta{font-size:8px;letter-spacing:.16em;opacity:.7;font-weight:700}.cas-window{position:absolute;bottom:13px;left:16px;right:16px;height:56px;border-radius:3px;background:linear-gradient(180deg,#0009,#000000e0);box-shadow:inset 0 1px 4px #000000d9,inset 0 -1px #ffffff0d,0 0 0 1px #00000080;overflow:hidden}.cas-tape{position:absolute;top:50%;left:0;right:0;height:12px;transform:translateY(-50%);background:linear-gradient(180deg,#6b3a16,#b16828,#6b3a16);opacity:.9;box-shadow:0 0 4px #00000080}.cas-reel{position:absolute;top:50%;width:30px;height:30px;border-radius:50%;background:radial-gradient(circle at 50% 50%,#2a2a2a,#0a0a0a 55%,#050505);border:2px solid #1a1a1a;transform:translateY(-50%);box-shadow:inset 0 0 0 1px #ffffff0f,0 0 6px #0009}.cas-reel.left{left:14px}.cas-reel.right{right:14px}.reel-spokes{position:absolute;inset:4px;border-radius:50%;background:conic-gradient(from 0deg,rgba(255,255,255,.18) 0deg,transparent 30deg,rgba(255,255,255,.18) 60deg,transparent 90deg,rgba(255,255,255,.18) 120deg,transparent 150deg,rgba(255,255,255,.18) 180deg,transparent 210deg,rgba(255,255,255,.18) 240deg,transparent 270deg,rgba(255,255,255,.18) 300deg,transparent 330deg);border:1px dashed rgba(255,255,255,.22)}.cassette.selected .reel-spokes{animation:reelSpin 1.6s linear infinite}@keyframes reelSpin{to{transform:rotate(360deg)}}.cas-screws{position:absolute;inset:0;pointer-events:none}.cas-screws span{position:absolute;width:8px;height:8px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#ffffff73,#000000b3 60%,#000)}.cas-screws span:nth-child(1){top:6px;left:6px}.cas-screws span:nth-child(2){top:6px;right:6px}.cas-screws span:nth-child(3){bottom:6px;left:6px}.cas-screws span:nth-child(4){bottom:6px;right:6px}#tape-deck{position:relative;z-index:2;width:min(760px,94vw);margin-bottom:6px}.deck-frame{position:relative;background:linear-gradient(180deg,#2c2f35,#1c1f24,#0f1115);border-radius:14px;padding:16px 22px 18px;box-shadow:0 26px 50px #000000a6,0 0 0 2px #4a4d54,0 0 0 4px #1a1c20,inset 0 1px #ffffff1a,inset 0 -2px #0000008c;display:grid;gap:14px}.deck-frame:before{content:"";position:absolute;inset:4px;border-radius:10px;border:1px solid rgba(255,255,255,.04);pointer-events:none}.deck-brand{display:flex;align-items:center;gap:12px;font-size:11px;letter-spacing:.32em;color:#ffffff80;text-transform:uppercase;font-weight:700}.deck-brand-spacer{flex:1}.deck-brand-tag{font-size:9px;letter-spacing:.25em;color:var(--cyan);border:1px solid rgba(78,231,255,.5);padding:2px 8px;border-radius:2px;text-shadow:0 0 6px rgba(78,231,255,.5)}.deck-led{width:9px;height:9px;border-radius:50%;background:#ff2d2d;box-shadow:0 0 8px #ff2d2d,0 0 16px #ff2d2db3;animation:ledBlink 2s ease-in-out infinite}.deck-frame.armed .deck-led{background:var(--green);box-shadow:0 0 10px var(--green),0 0 20px var(--green);animation:none}@keyframes ledBlink{0%,70%{opacity:1}85%{opacity:.25}to{opacity:1}}.deck-row{display:grid;grid-template-columns:1fr 1.35fr;gap:14px}.deck-screen{background:radial-gradient(ellipse at 50% 30%,rgba(78,255,158,.08),transparent 70%),linear-gradient(180deg,#07140e,#030906);border-radius:6px;padding:14px 18px;border:1px solid #0e1e16;box-shadow:inset 0 0 16px #4eff9e1f,inset 0 0 0 1px #000000b3,0 0 0 2px #00000080;font-family:VT323,Orbitron,monospace;display:grid;align-content:center;gap:6px}.deck-screen-row{font-size:26px;font-weight:700;letter-spacing:.08em;color:#5fff9e;text-shadow:0 0 8px rgba(78,255,158,.85),0 0 16px rgba(78,255,158,.45);line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.deck-screen-row.dim{font-size:14px;letter-spacing:.18em;opacity:.75}.deck-meter{display:flex;gap:3px;margin-top:6px}.meter-bar{flex:1;height:8px;background:#4eff9e1f;border-radius:1px;position:relative;overflow:hidden}.meter-bar:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--green) 0%,var(--amber) 70%,var(--red) 100%);transform-origin:left;transform:scaleX(.05);transition:transform .2s ease}.deck-frame.armed .meter-bar:nth-child(1):after{animation:meterPulse .42s ease-in-out infinite alternate}.deck-frame.armed .meter-bar:nth-child(2):after{animation:meterPulse .55s ease-in-out infinite alternate}.deck-frame.armed .meter-bar:nth-child(3):after{animation:meterPulse .34s ease-in-out infinite alternate}.deck-frame.armed .meter-bar:nth-child(4):after{animation:meterPulse .66s ease-in-out infinite alternate}.deck-frame.armed .meter-bar:nth-child(5):after{animation:meterPulse .48s ease-in-out infinite alternate}.deck-frame.armed .meter-bar:nth-child(6):after{animation:meterPulse .7s ease-in-out infinite alternate}.deck-frame.armed .meter-bar:nth-child(7):after{animation:meterPulse .4s ease-in-out infinite alternate}.deck-frame.armed .meter-bar:nth-child(8):after{animation:meterPulse .58s ease-in-out infinite alternate}@keyframes meterPulse{0%{transform:scaleX(.18)}to{transform:scaleX(.95)}}.deck-slot{position:relative;height:116px;background:linear-gradient(180deg,#08080c,#16161c);border-radius:6px;border:1px solid #2a2a30;box-shadow:inset 0 6px 14px #000000d9,inset 0 -1px #ffffff0a;overflow:hidden}.deck-slot-frame{position:absolute;inset:8px;border:1px dashed rgba(255,255,255,.08);border-radius:4px;pointer-events:none}.deck-slot-hint{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:11px;letter-spacing:.4em;color:#ffffff40;pointer-events:none;font-weight:700;transition:opacity .2s ease}.deck-slot-hint.hidden{opacity:0}.deck-cassette-mount{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}.deck-cassette-mount .cassette{width:220px;height:96px;filter:drop-shadow(0 8px 14px rgba(0,0,0,.65));cursor:default;transform:none}.deck-cassette-mount .cassette:after{display:none}.deck-cassette-mount .cas-label{height:50px;padding:4px 8px 3px;background:repeating-linear-gradient(0deg,color-mix(in srgb,var(--c-label) 92%,white) 0 8px,color-mix(in srgb,var(--c-label) 70%,black) 8px 9px),var(--c-label)}.deck-cassette-mount .cas-side{font-size:6px;letter-spacing:.25em}.deck-cassette-mount .cas-title{font-size:12px;padding-inline-end:.2em}.deck-cassette-mount .cas-romaji{font-size:6px;letter-spacing:.14em;margin-top:1px}.deck-cassette-mount .cas-meta{font-size:6px}.deck-cassette-mount .cas-window{height:30px;bottom:8px;left:12px;right:12px}.deck-cassette-mount .cas-tape{height:7px}.deck-cassette-mount .cas-reel{width:17px;height:17px}.deck-cassette-mount .cas-reel.left{left:8px}.deck-cassette-mount .cas-reel.right{right:8px}.deck-cassette-mount .reel-spokes{inset:2px;animation:reelSpin 1.1s linear infinite}.deck-cassette-mount .cas-screws span{width:5px;height:5px}.deck-cassette-mount .cassette.inserting{transform:translateY(-130%);transition:transform .54s cubic-bezier(.6,.04,.25,1)}.deck-controls{display:flex;gap:12px;justify-content:flex-end;align-items:center}.deck-btn{padding:10px 20px;border-radius:4px;border:1px solid rgba(255,255,255,.14);background:linear-gradient(180deg,#3c3f47,#1d2026);color:#ffffffd9;font-family:inherit;font-weight:800;font-size:13px;letter-spacing:.22em;cursor:pointer;text-shadow:0 1px 0 rgba(0,0,0,.5);box-shadow:inset 0 1px #ffffff1a,inset 0 -1px #0006,0 4px 8px #00000059;transition:filter .12s ease,transform 80ms ease}.deck-btn:hover:not(:disabled){filter:brightness(1.25)}.deck-btn:active:not(:disabled){transform:translateY(1px)}.deck-btn:disabled{opacity:.45;cursor:not-allowed}.deck-btn.primary{background:linear-gradient(135deg,var(--pink) 0%,var(--purple) 55%,var(--cyan) 100%);color:#fff;font-size:16px;padding:12px 30px;letter-spacing:.3em;text-shadow:0 1px 0 rgba(0,0,0,.45);box-shadow:inset 0 1px #ffffff40,inset 0 -1px #00000059,0 0 18px #ff2d878c,0 6px 14px #00000073}.deck-btn.primary:disabled{filter:grayscale(.85) brightness(.6);box-shadow:inset 0 1px #ffffff1a,0 4px 8px #00000059}.deck-btn.primary.ready{animation:playBreath 1.2s ease-in-out infinite alternate}@keyframes playBreath{0%{box-shadow:inset 0 1px #ffffff40,0 0 18px #ff2d8799,0 6px 14px #00000073}to{box-shadow:inset 0 1px #ffffff59,0 0 36px #4ee7fff2,0 6px 14px #00000073}}@media(max-height:760px){.select-title .title-line{font-size:clamp(36px,6vw,64px)}.cassette{width:220px;height:142px}.cas-label{height:76px}.cas-window{height:44px}.cas-title{font-size:18px}.deck-cassette-mount .cassette{width:190px;height:82px}}#countdown{position:fixed;inset:0;z-index:60;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;pointer-events:none;font-family:Orbitron,sans-serif;transition:opacity .3s ease}#countdown.hidden{opacity:0;visibility:hidden}.countdown-bg{position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(255,45,135,.25) 0%,transparent 55%),radial-gradient(ellipse at center,#000000a6,#000000d9);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.countdown-label{position:relative;font-size:14px;letter-spacing:.5em;color:var(--cyan);text-shadow:0 0 10px rgba(78,231,255,.7);font-weight:700;text-transform:uppercase}.countdown-num{position:relative;font-size:clamp(120px,22vw,240px);font-weight:900;font-style:italic;line-height:1;letter-spacing:.02em;background:linear-gradient(180deg,#fffbe9,#ffe27a 30%,#ff5dab,#4ee7ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 24px rgba(255,45,135,.7)) drop-shadow(0 0 48px rgba(78,231,255,.5));padding-inline-end:.12em}.countdown-num.pop{animation:countdownPop 1s cubic-bezier(.2,1.2,.3,1) both}.countdown-num.go{font-size:clamp(100px,18vw,200px);background:linear-gradient(180deg,#b3ffd6,#4eff9e,#4ee7ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 24px rgba(78,255,158,.85)) drop-shadow(0 0 48px rgba(78,231,255,.55))}@keyframes countdownPop{0%{transform:scale(2.4);opacity:0}18%{transform:scale(1);opacity:1}70%{transform:scale(1);opacity:1}to{transform:scale(.78);opacity:0}}.countdown-track{position:relative;font-size:12px;letter-spacing:.4em;color:var(--amber);text-shadow:0 0 8px rgba(255,207,64,.6);font-weight:700;margin-top:8px;animation:trackBlink .8s ease-in-out infinite alternate}@keyframes trackBlink{0%{opacity:.4}to{opacity:1}}#result-screen{position:fixed;inset:0;z-index:55;display:grid;grid-template-rows:auto 1fr;align-items:center;justify-items:center;gap:clamp(16px,3vh,28px);padding:clamp(20px,4vh,48px) 24px;background:radial-gradient(ellipse at 50% -10%,rgba(255,207,64,.25),transparent 55%),linear-gradient(180deg,#050214,#1a0a36 45%,#2d0050 80%,#4a0040);overflow:hidden;font-family:Orbitron,sans-serif;transition:opacity .5s ease,visibility .5s ease}#result-screen.hidden{opacity:0;visibility:hidden;pointer-events:none}#result-screen.show .result-card{animation:resultCardIn .6s cubic-bezier(.2,1.1,.3,1) both}.result-sun{top:24%!important;filter:hue-rotate(20deg) saturate(1.1)}.result-header{position:relative;z-index:2;text-align:center;display:grid;gap:6px}.result-title{margin:0;font-size:clamp(40px,7vw,76px);font-weight:900;font-style:italic;letter-spacing:.06em;text-transform:uppercase;background:linear-gradient(180deg,#fffbe9,#ffe27a 30%,#ff5dab,#4ee7ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 18px rgba(255,45,135,.55)) drop-shadow(0 0 32px rgba(78,231,255,.4));padding-inline-end:.12em}.result-card{position:relative;z-index:2;width:min(720px,94vw);background:linear-gradient(180deg,#1c0e3ceb,#0f0722f5);border-radius:14px;padding:24px clamp(20px,3vw,32px) 22px;box-shadow:0 28px 60px #000000a6,0 0 0 1px #ff2d8773,0 0 32px #ff2d8759,inset 0 0 24px #4ee7ff0f;display:grid;gap:18px;border-top:1px solid rgba(255,255,255,.06)}@keyframes resultCardIn{0%{transform:translateY(40px) scale(.95);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}.result-card-row.top{display:flex;gap:18px;align-items:stretch;justify-content:space-between}.result-track{flex:1;display:grid;gap:4px}.result-track-label{font-size:10px;letter-spacing:.36em;color:var(--cyan);text-shadow:0 0 6px rgba(78,231,255,.5);font-weight:700}.result-track-name{font-size:clamp(22px,3.4vw,32px);font-weight:900;font-style:italic;letter-spacing:.04em;color:#fff;text-shadow:0 0 14px rgba(255,45,135,.6);line-height:1.05;padding-inline-end:.18em;overflow-wrap:anywhere;word-break:break-word}.result-track-romaji{font-size:11px;letter-spacing:.28em;font-weight:700;font-style:italic;color:#ffffffc7;text-transform:uppercase;padding-inline-end:.18em;margin-top:2px}.result-track-romaji:empty{display:none}.result-track-meta{font-size:11px;letter-spacing:.24em;color:#ffffffb3}.result-rank-box{display:grid;align-items:center;justify-items:center;padding:6px 26px 8px 22px;border-radius:10px;background:linear-gradient(180deg,#ffcf402e,#ff2d871f);border:1px solid rgba(255,207,64,.5);box-shadow:inset 0 0 18px #ffcf401f,0 0 18px #ffcf4040;min-width:110px}.result-rank-label{font-size:10px;letter-spacing:.36em;color:var(--amber);text-shadow:0 0 6px rgba(255,207,64,.55);font-weight:700}.result-rank{font-size:clamp(54px,8vw,80px);font-weight:900;font-style:italic;line-height:1;background:linear-gradient(180deg,#fffbe9,#ffe27a,#ff5dab);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 14px rgba(255,207,64,.7));padding-inline-end:.1em}.result-rank[data-rank=S]{background:linear-gradient(180deg,#fffbe9,#ffe27a 40%,#ffcf40);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 18px rgba(255,207,64,.9)) drop-shadow(0 0 28px rgba(255,207,64,.55))}.result-rank[data-rank=A]{background:linear-gradient(180deg,#fff,#ff5dab 60%,#ff2d87);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.result-rank[data-rank=B]{background:linear-gradient(180deg,#d6f6ff,#4ee7ff 60%,#9c4dff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.result-rank[data-rank=C]{background:linear-gradient(180deg,#b3ffd6,#4eff9e);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.result-rank[data-rank=D]{background:linear-gradient(180deg,#ffd0d0,#ff2d2d);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.result-score-row{display:flex;align-items:baseline;justify-content:space-between;gap:18px;padding:14px 16px;border-radius:8px;background:radial-gradient(ellipse at 100% 50%,rgba(78,255,158,.08),transparent 60%),linear-gradient(180deg,#07140e,#030906);border:1px solid #0e1e16;box-shadow:inset 0 0 16px #4eff9e1f,inset 0 0 0 1px #0009;font-family:VT323,monospace}.result-score-label{font-size:18px;letter-spacing:.32em;color:#4eff9ebf;text-shadow:0 0 8px rgba(78,255,158,.4)}.result-score-value{font-size:clamp(40px,6vw,64px);font-weight:700;letter-spacing:.06em;color:#5fff9e;text-shadow:0 0 12px rgba(78,255,158,.85),0 0 24px rgba(78,255,158,.5);font-variant-numeric:tabular-nums;line-height:1}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.result-stat{display:flex;flex-direction:column;gap:4px;padding:10px 12px;border-radius:6px;background:#0f07228c;border:1px solid rgba(255,255,255,.08);font-variant-numeric:tabular-nums}.result-stat .stat-name{font-size:10px;letter-spacing:.28em;color:#ffffff8c;font-weight:700}.result-stat .stat-value{font-size:22px;font-weight:900;letter-spacing:.04em;color:#fff;text-shadow:0 0 8px rgba(255,255,255,.2);line-height:1}.result-stat.perfect .stat-value{color:#fff48a;text-shadow:0 0 10px rgba(255,244,138,.7)}.result-stat.great .stat-value{color:var(--cyan);text-shadow:0 0 10px rgba(78,231,255,.7)}.result-stat.good .stat-value{color:var(--green);text-shadow:0 0 10px rgba(78,255,158,.7)}.result-stat.miss .stat-value{color:var(--red);text-shadow:0 0 10px rgba(255,45,45,.6)}.result-stat.combo .stat-value{color:var(--pink);text-shadow:0 0 10px rgba(255,45,135,.7)}.result-stat.accuracy .stat-value{color:var(--amber);text-shadow:0 0 10px rgba(255,207,64,.7)}.result-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:4px}@media(max-width:560px){.result-stats{grid-template-columns:repeat(2,1fr)}.result-card-row.top{flex-direction:column}.result-rank-box{justify-self:stretch}}
