:root{color-scheme:dark;font-family:system-ui,-apple-system,sans-serif;background:var(--viz-bg,#0a131b);color:var(--viz-text,#e8f8f5)}*{box-sizing:border-box}body{margin:0}main{max-width:1100px;margin:auto;padding:clamp(12px,3vw,26px)}header{text-align:center}.eyebrow{color:var(--viz-accent,#83e5c5);font-size:11px;letter-spacing:.2em}h1{font-size:clamp(18px,3vw,29px);margin:7px 0}#viz-status,#viz-song,footer{font-size:12px;color:#9db7b5}#viz-song{min-height:1.2em}.modes{display:flex;justify-content:center;gap:7px;flex-wrap:wrap;margin:15px 0}.modes button{font:inherit;font-size:12px;padding:9px 11px;background:#142733;border:1px solid #36565d;border-radius:9px;color:#e0f5f1;cursor:pointer}.modes button.selected{background:var(--viz-accent,#166a60);border-color:#68e4c5;color:white}.modes button:focus-visible{outline:2px solid #9affdf;outline-offset:2px}canvas{display:block;width:100%;height:clamp(190px,42vw,430px);background:radial-gradient(ellipse at center,var(--viz-surface,#102831),var(--viz-bg,#071018));border:1px solid #26434a;border-radius:14px}footer{text-align:center;margin-top:14px}

body.viz-no-header header{display:none}body.viz-no-controls .modes{display:none}canvas{height:clamp(190px,42vw,var(--viz-height,430px));max-height:var(--viz-height,430px)}

.modes{max-height:140px;overflow:auto}.modes button{white-space:nowrap}.modes button.selected{color:#071d1a;background:var(--viz-accent)}
