:root{--bg:#0b0b10;--text:#f3f4f6;--muted:#9ca3af;--accent:#e5e7eb;--panel:#15151d;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;font-family:system-ui,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0;overflow:hidden}.player{background:var(--panel);border-top:1px solid #23232d;flex-wrap:wrap;align-items:center;gap:8px 32px;width:100%;padding:12px 24px;display:flex}.player__meta{flex-direction:column;gap:2px;min-width:200px;display:flex}.player__meta span{color:var(--muted);font-size:14px}.player__credit{opacity:.7;font-size:11px}.player__note{max-width:320px;color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.player__controls{flex:1;align-items:center;gap:12px;min-width:280px;display:flex}.player__seek{accent-color:#9ca3af;flex:1;min-width:80px}.player__transport{align-items:center;gap:4px;display:flex}.player__button{width:40px;height:40px;color:var(--text);cursor:pointer;background:0 0;border:0;border-radius:50%;justify-content:center;align-items:center;padding:0;display:flex}.player__button svg{width:20px;height:20px}.player__button:hover:not(:disabled){background:#ffffff1f}.player__button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.player__button:disabled{opacity:.35;cursor:not-allowed}.player__button--play{color:var(--bg);background:#e5e7eb}.player__button--play:hover:not(:disabled){background:#f3f4f6}.player__volume{align-items:center;margin-left:4px;display:flex;position:relative}.player__slider{background:var(--panel);border:1px solid #23232d;border-radius:10px;margin-bottom:8px;padding:10px 6px;position:absolute;bottom:100%;left:50%;transform:translate(-50%);box-shadow:0 6px 16px #0008}.player__slider input[type=range]{writing-mode:vertical-lr;accent-color:#9ca3af;direction:rtl;width:20px;height:90px;margin:0}.player__slider input[type=range]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.player__time{min-width:4ch;color:var(--muted);font-variant-numeric:tabular-nums}.player__error{color:#f87171;width:100%;margin:0}@media (width<=600px){.player{gap:4px;min-width:0;padding:8px 12px}.player__meta{width:100%;min-width:0}.player__controls{gap:6px;width:100%;min-width:0}.player__seek{min-width:40px}}.visual-stage{background:var(--bg);width:100%;height:100%;display:block;position:absolute;inset:0}.cloud{z-index:1;width:100%;height:100%;font-family:Impact,Arial Narrow Bold,sans-serif;line-height:1;position:relative;overflow:hidden}.cloud__group{width:0;height:0;transition:transform .3s cubic-bezier(.2,.8,.2,1);animation:.2s ease-out cloud-in;position:absolute;top:50%;left:50%}.cloud__word{transform-origin:50%;white-space:nowrap;color:var(--text);opacity:0;text-shadow:0 0 3px #0000008c;transition:opacity .3s;position:absolute}.cloud__word span{position:absolute}.cloud__word--past{opacity:.8}.cloud__word--current{color:var(--accent);opacity:1;text-shadow:0 0 3px #0009,0 0 3px #ffffff4d;transition:color .5s;animation:.15s ease-out word-in}@keyframes word-in{0%{opacity:0;scale:1.5}}@keyframes cloud-in{0%{opacity:0}}.karaoke{z-index:1;text-align:center;text-shadow:0 0 3px #0000008c;flex-direction:column;justify-content:center;align-items:center;gap:.5em;width:100%;height:100%;padding:0 6%;font-family:Impact,Arial Narrow Bold,sans-serif;display:flex;position:relative}.karaoke__line{margin:0;line-height:1.15}.karaoke__line--next{min-height:1.15em;color:var(--muted);font-size:clamp(20px,3vw,40px)}.karaoke__line--current{color:var(--text);font-size:clamp(32px,5.5vw,72px);animation:.2s ease-out karaoke-in}.karaoke__word{transition:color .15s,opacity .3s}.karaoke__word--upcoming{opacity:.55}.karaoke__word--current{color:var(--accent);text-shadow:0 0 3px #0009,0 0 3px #ffffff4d}@keyframes karaoke-in{0%{opacity:0;transform:translateY(8px)}}.settings{z-index:2;font-size:12px;position:absolute;top:12px;right:12px}.settings__toggle,.settings__panel select{color:var(--muted);font:inherit;background:#0b0b1099;border:1px solid #2a2a35;border-radius:6px;padding:4px 8px}.settings__toggle{cursor:pointer}.settings__panel{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0b0b10d9;border:1px solid #2a2a35;border-radius:8px;gap:10px;min-width:220px;padding:12px;display:grid;position:absolute;top:32px;right:0}.settings__row{color:var(--muted);gap:4px;display:grid}.settings__row--inline{grid-auto-flow:column;justify-content:start;align-items:center;gap:8px}.settings__row input{accent-color:#9ca3af;margin:0}.settings__account{border-top:1px solid #2a2a35;justify-items:start;gap:8px;padding-top:10px;display:grid}.settings__email{overflow-wrap:anywhere;max-width:220px;color:var(--muted)}.settings__logout{color:var(--text);font:inherit;cursor:pointer;background:#0b0b1099;border:1px solid #2a2a35;border-radius:6px;padding:4px 8px}.settings__logout:hover{background:#ffffff1f}.app{grid-template-rows:1fr auto;height:100%;display:grid}.stage{min-height:0;position:relative;overflow:hidden}.stage__track{z-index:2;color:var(--muted);background:#0b0b1099;border:1px solid #2a2a35;border-radius:6px;padding:4px 8px;font-size:12px;position:absolute;top:12px;left:12px}.stage__image{background:var(--bg) center / cover no-repeat;filter:brightness(.45);position:absolute;inset:0}.stage__image:after{content:"";background-image:radial-gradient(circle,#00000080 .7px,#0000 1.2px);background-size:4px 4px;position:absolute;inset:0}.stage__status{color:var(--muted);justify-content:center;align-items:center;margin:0;display:flex;position:absolute;inset:0}