:root{--bg:#070407;--fg:#e8e0e4;--muted:#e8e0e48c;--accent:#ff2742;--font-ui:"Helvetica Neue", Helvetica, Arial, sans-serif;--font-title:Georgia, "Times New Roman", serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--fg);font-family:var(--font-ui);-webkit-font-smoothing:antialiased;overflow:hidden}button{cursor:pointer;font-family:inherit}.song-title{font-family:var(--font-title);letter-spacing:.02em;margin:0;font-size:clamp(2.2rem,6vw,4rem);font-style:italic;font-weight:400}.screen,.gate,.intro{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:.5rem;padding:1.5rem;display:flex;position:fixed;inset:0}.screen{color:var(--muted)}.gate__form{flex-direction:column;gap:.7rem;width:min(320px,80vw);margin-top:2rem;display:flex}.gate__form input{color:var(--fg);letter-spacing:.05em;background:0 0;border:1px solid #e8e0e440;border-radius:2px;outline:none;padding:.7rem .9rem;font-size:.95rem;transition:border-color .2s}.gate__form input:focus{border-color:var(--accent)}.gate__form button{background:var(--accent);color:#fff;letter-spacing:.3em;text-indent:.3em;text-transform:uppercase;border:none;border-radius:2px;margin-top:.4rem;padding:.7rem;font-size:.85rem;transition:opacity .2s}.gate__form button:disabled{opacity:.5;cursor:wait}.gate__error{color:var(--accent);margin:0;font-size:.8rem}.player{background:var(--bg);position:fixed;inset:0}.player--idle{cursor:none}.player__canvas{filter:grayscale()contrast(1.08)brightness(1.02);width:100%;height:100%;display:block;position:absolute;inset:0}.player__grade{pointer-events:none;mix-blend-mode:multiply;background:radial-gradient(circle at 50% 42%,#ff7d9e 0%,#ff2742 48%,#5e0a16 100%);position:absolute;inset:0}.intro{background:radial-gradient(#ff274212,#0000 65%)}.intro__play{filter:drop-shadow(0 0 18px #ff274280);background:0 0;border:none;place-items:center;width:96px;height:96px;margin-top:2rem;padding:0;display:grid}.intro__play-img{object-fit:contain;width:100%;height:100%;transition:transform .25s;animation:1.7s ease-in-out infinite heart-pulse;display:block}.intro__play:hover .intro__play-img{animation-play-state:paused;transform:scale(1.12)}@keyframes heart-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}.lyrics{text-align:center;max-width:min(82vw,760px);font-family:var(--font-title);color:var(--fg);text-shadow:0 2px 26px #000000f2,0 0 10px #000c;pointer-events:none;font-size:clamp(1.4rem,3.2vw,2.3rem);font-style:italic;line-height:1.35;animation:.45s lyric-in;position:absolute;bottom:18vh;left:50%;transform:translate(-50%)}@keyframes lyric-in{0%{opacity:0;transform:translate(-50%)translateY(10px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.lyrics--love{color:#ffdbe2;text-shadow:0 2px 26px #000000f2,0 0 24px #ff2742b8,0 0 52px #ff274273;will-change:transform;font-size:clamp(1.9rem,4.4vw,3.2rem);animation:.5s lyric-in,2.4s ease-in-out .5s infinite love-pulse}.lyrics--love:before,.lyrics--love:after{content:"♥";color:var(--accent);vertical-align:.18em;opacity:.85;margin:0 .45em;font-size:.62em}@keyframes love-pulse{0%,to{transform:translate(-50%)scale(1)}50%{transform:translate(-50%)scale(1.05)}}.player__signout{color:var(--muted);transition:opacity .5s,color .2s;position:absolute;top:.9rem;right:1rem}.player__controls{background:linear-gradient(#0000,#070407d9);align-items:center;gap:.9rem;padding:1rem 1.4rem;transition:opacity .5s;display:flex;position:absolute;bottom:0;left:0;right:0}.player--idle .player__controls,.player--idle .player__signout{opacity:0;pointer-events:none}.btn-icon{color:var(--fg);background:0 0;border:none;padding:.3rem .5rem;font-size:1rem;line-height:1;transition:color .2s}.btn-icon:hover{color:var(--accent)}.btn-ghost{color:var(--muted);letter-spacing:.15em;background:0 0;border:1px solid #e8e0e440;border-radius:2px;padding:.35rem .8rem;font-size:.7rem;transition:border-color .2s,color .2s}.btn-ghost:hover{border-color:var(--accent);color:var(--fg)}input[type=range]{appearance:none;background:#e8e0e440;border-radius:2px;outline:none;height:3px}input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--accent);border:none;border-radius:50%;width:11px;height:11px}input[type=range]::-moz-range-thumb{background:var(--accent);border:none;border-radius:50%;width:11px;height:11px}.player__seek{flex:1}.player__volume{width:90px}@media (width<=720px){.player__volume{display:none}}