*,:before,:after{box-sizing:border-box;-webkit-user-select:none;user-select:none}:root{--text-primary:#fff;--text-secondary:#ffffffc7;--text-muted:#ffffff7a;--card-bg:#0000002e;--focus-ring:#fff6}html,body,#app{min-height:100%;margin:0}body{text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--text-primary);background:#0a0608;font-family:Inter Variable,Inter,SF Pro Text,Segoe UI,Roboto,Helvetica Neue,Helvetica,sans-serif;line-height:1.4}.controller-page{opacity:0;justify-content:center;align-items:center;min-height:100vh;padding:14px;transition:opacity .6s;display:flex;position:relative;overflow:hidden}.controller-page.is-ready{opacity:1}.bg-cover{background-position:50%;background-size:cover;transition:filter .8s;position:absolute;inset:0}.bg-cover--old{z-index:0}.bg-cover--new{z-index:1;animation:.8s ease-out forwards coverFadeIn}@keyframes coverFadeIn{0%{opacity:0}to{opacity:1}}.bg-video{object-fit:cover;z-index:2;opacity:0;width:100%;height:100%;transition:opacity .8s,filter .8s,transform 1.2s;position:absolute;inset:0;transform:scale(1)}.bg-video--ready{opacity:1}.bg-video--out{opacity:0!important}.is-paused .bg-cover{filter:grayscale()}.is-paused .bg-video{filter:grayscale();transform:scale(1.08)}.bg-overlay{z-index:3;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:linear-gradient(165deg,#00000040,#00000080);position:absolute;inset:0}.controller-card{aspect-ratio:1;background:var(--card-bg);-webkit-backdrop-filter:blur(14px)saturate(1.1);backdrop-filter:blur(14px)saturate(1.1);z-index:5;text-align:center;border:1px solid #ffffff14;border-radius:24px;flex-direction:column;justify-content:center;width:min(100%,340px);padding:24px;display:flex;position:relative;overflow:hidden;box-shadow:0 22px 50px #00000059}.lyrics-display{z-index:4;pointer-events:none;justify-content:center;padding:0 5%;display:flex;position:absolute;left:0;right:0;overflow:hidden}.lyrics-display--top{-webkit-mask-image:linear-gradient(#000 0% 70%,#0000008c 100%);align-items:center;top:0;bottom:calc(50% + min(50%,180px));mask-image:linear-gradient(#000 0% 90%,#000c 100%)}.lyrics-display--bottom{-webkit-mask-image:linear-gradient(#0000008c 0%,#000 30% 100%);align-items:center;top:calc(50% + min(50%,180px));bottom:0;mask-image:linear-gradient(#000c 0%,#000 10% 100%)}.lyrics-line{text-align:center;letter-spacing:.04em;text-transform:uppercase;word-break:break-word;color:#ffffffa6;text-shadow:0 2px 12px #00000080;max-width:100%;margin:0;font-size:clamp(28px,9vw,64px);font-weight:900;line-height:1.05;animation:.4s ease-out lyricFadeIn}@keyframes lyricFadeIn{0%{opacity:0;filter:blur(6px);transform:scale(.97)}to{opacity:1;filter:blur();transform:scale(1)}}.marquee{white-space:nowrap;position:relative;overflow:hidden}.marquee-inner{will-change:transform;display:inline-block}.marquee-inner--scrolling{animation:6s ease-in-out infinite alternate marqueeScroll}@keyframes marqueeScroll{0%,18%{transform:translate(0)}82%,to{transform:translateX(calc(var(--marquee-overflow,0px) * -1))}}.artist-name{letter-spacing:.01em;color:var(--text-secondary);margin:0;font-size:13px;font-weight:480}.song-name{letter-spacing:-.025em;color:var(--text-primary);margin:6px 0 0;font-size:clamp(26px,7.2vw,36px);font-weight:700;line-height:1.1}.album-name{letter-spacing:.005em;color:var(--text-muted);min-height:18px;margin:6px 0 0;font-size:13px;font-weight:420}.transport-controls{justify-content:center;align-items:center;gap:4px;margin-top:22px;display:flex}.icon-button{color:#ffffffd9;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;padding:0;transition:color .12s,background-color .12s,transform .1s;display:inline-flex}.icon-button svg{display:block}.icon-button--primary{color:#fff;background:#ffffff21;border-radius:50%;width:62px;height:62px}.mode-controls{justify-content:center;align-items:center;gap:2px;margin-top:4px;display:flex}.mode-button{color:#ffffff59;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;padding:0;transition:color .12s,background-color .12s,transform .1s;display:inline-flex}.mode-button.is-active,.mode-button.is-track-one{color:#fff;background:0 0}.mode-button svg{display:block}.seek-controls{grid-template-columns:34px 1fr 34px;align-items:center;gap:8px;margin-top:16px;display:grid}.time-label{letter-spacing:.02em;color:#ffffff6b;font-variant-numeric:tabular-nums;font-size:11px;font-weight:460}.seek-slider{appearance:none;cursor:pointer;background:0 0;width:100%;height:20px}.seek-slider::-webkit-slider-runnable-track{background:linear-gradient(90deg, #ffffffb3 0%, #ffffffb3 var(--seek-progress,0%), #ffffff26 var(--seek-progress,0%), #ffffff26 100%);border-radius:999px;height:4px}.seek-slider::-webkit-slider-thumb{appearance:none;background:#fff;border:none;border-radius:50%;width:12px;height:12px;margin-top:-4px;box-shadow:0 1px 6px #0000004d}.seek-slider::-moz-range-track{background:#ffffff26;border-radius:999px;height:4px}.seek-slider::-moz-range-progress{background:#ffffffb3;border-radius:999px;height:4px}.seek-slider::-moz-range-thumb{background:#fff;border:none;border-radius:50%;width:12px;height:12px;box-shadow:0 1px 6px #0000004d}.status-message{letter-spacing:.03em;color:var(--text-secondary);text-align:center;margin:10px 0 0;font-size:11px;font-weight:480}.status-message--error{color:#ffb9b9}button:disabled,input:disabled{opacity:.4;cursor:not-allowed}button:focus-visible,input:focus-visible{box-shadow:0 0 0 2px var(--focus-ring);outline:none}@media (hover:hover){.icon-button:hover:not(:disabled){color:#fff;background:#ffffff1a}.icon-button--primary:hover:not(:disabled){background:#ffffff38}.mode-button:hover:not(:disabled){color:#ffffffe6;background:#ffffff14}.mode-button.is-active:hover:not(:disabled),.mode-button.is-track-one:hover:not(:disabled){color:#fff;background:#ffffff14}}@media (prefers-reduced-motion:reduce){.icon-button,.mode-button{transition:none}.marquee-inner--scrolling,.bg-cover--new{animation:none}.bg-cover,.bg-video{transition:none}.lyrics-line{animation:none}.lyrics-word{transition:none}}
