*{margin:0;padding:0;box-sizing:border-box}:root{--accent: #1db954;--accent2: #7b2ff7}html,body{width:100%;height:100%;background:#000;color:#eee;font-family:-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;overflow:hidden}#viz{position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;display:block}.hidden{display:none!important}#start-screen{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.5rem;background:radial-gradient(ellipse at center,#10101c,#000 80%);z-index:100;text-align:center;padding:1rem}#start-screen h1{font-size:clamp(2.5rem,8vw,4.5rem);font-weight:200;letter-spacing:.35em;text-transform:uppercase;background:linear-gradient(90deg,var(--accent),var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent}.tagline{opacity:.6;font-weight:300}.source-buttons{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center}.source-btn{display:flex;flex-direction:column;align-items:center;gap:.4rem;width:240px;padding:1.4rem 1rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.15);border-radius:14px;color:#eee;cursor:pointer;transition:all .15s ease}.source-btn:hover,.source-btn:focus-visible{background:#ffffff1f;border-color:var(--accent);transform:translateY(-2px)}.src-icon{font-size:2rem}.src-name{font-size:1.1rem;font-weight:600}.src-desc{font-size:.8rem;opacity:.55}.start-error{color:#ff6b6b;max-width:420px}#overlay{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:50}#overlay>*{pointer-events:auto}body.ui-hidden #overlay{opacity:0;transition:opacity .5s}body.ui-hidden{cursor:none}#topbar{position:absolute;top:12px;right:12px;display:flex;gap:8px}#topbar button{width:42px;height:42px;border-radius:10px;border:1px solid rgba(255,255,255,.2);background:#00000073;color:#eee;font-size:1.1rem;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}#topbar button:hover{border-color:var(--accent)}#now-playing{position:absolute;left:16px;bottom:16px;display:flex;align-items:center;gap:12px;padding:10px 16px 10px 10px;background:#00000080;border-radius:12px;border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);max-width:min(70vw,480px)}#np-art{width:56px;height:56px;border-radius:8px;object-fit:cover;box-shadow:0 0 18px 2px var(--accent)}#np-track{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#np-artist{font-size:.85rem;opacity:.65;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#preset-toast{position:absolute;bottom:16px;right:16px;padding:8px 14px;background:#0000008c;border-radius:8px;font-size:.8rem;opacity:.8;max-width:40vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#silence-hint{position:absolute;top:16px;left:50%;transform:translate(-50%);display:flex;gap:10px;align-items:center;padding:10px 16px;background:#1e1e00b3;border:1px solid rgba(255,220,100,.4);border-radius:10px;font-size:.9rem}#silence-hint select{background:#111;color:#eee;border:1px solid #444;border-radius:6px;padding:4px;max-width:40vw}#settings-panel{position:absolute;top:64px;right:12px;width:min(340px,calc(100vw - 24px));padding:18px;background:#0a0a0eeb;border:1px solid rgba(255,255,255,.15);border-radius:14px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;flex-direction:column;gap:12px}#settings-panel h2{font-size:1rem;font-weight:600}#settings-panel label{display:flex;flex-direction:column;gap:5px;font-size:.85rem;opacity:.9}#settings-panel input[type=text],#settings-panel select{background:#111;color:#eee;border:1px solid #444;border-radius:6px;padding:7px;font-size:.85rem}#settings-panel input[type=checkbox]{margin-right:6px}#settings-panel label:has(input[type=checkbox]){flex-direction:row;align-items:center}#settings-panel button{padding:9px;border-radius:8px;border:1px solid rgba(255,255,255,.2);background:#ffffff14;color:#eee;cursor:pointer}#settings-panel button:hover{border-color:var(--accent)}#spotify-status{font-size:.8rem;opacity:.6}#help-panel{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:min(480px,calc(100vw - 32px));max-height:80vh;overflow-y:auto;padding:22px;background:#0a0a0ef0;border:1px solid rgba(255,255,255,.18);border-radius:16px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);font-size:.9rem;line-height:1.5}#help-panel h2{font-size:1.05rem;margin-bottom:10px}#help-panel p{margin:10px 0;opacity:.85}#help-panel table{border-collapse:collapse;margin-bottom:6px}#help-panel td{padding:3px 14px 3px 0}#help-panel kbd{background:#ffffff1f;border:1px solid rgba(255,255,255,.25);border-radius:5px;padding:1px 7px;font-family:ui-monospace,monospace;font-size:.8rem}.help-actions{display:flex;gap:10px;margin-top:14px}.help-actions button{padding:9px 14px;border-radius:8px;border:1px solid rgba(255,255,255,.2);background:#ffffff14;color:#eee;cursor:pointer}.help-actions button:hover{border-color:var(--accent)}#debug-hud{position:absolute;top:12px;left:12px;padding:12px 14px;background:#000000a6;border:1px solid rgba(0,255,140,.35);border-radius:10px;color:#7dffb0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;line-height:1.55;white-space:pre;pointer-events:none}