:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--paper:#f0efe3;--muted:#f0efe39e;--line:#f0efe329;--panel:#090a0ab8;--panel-hard:#10110feb;--accent:#e0ff66;--accent-2:#4bd4ff;--theme-void:#050506;--theme-surface:#141511;--theme-ink:#f0efe3;--genre-color:#e0ff66}*{box-sizing:border-box}html,body{min-height:100%}body{background:var(--theme-void);color:var(--paper);margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow-x:hidden}button{font:inherit}.appShell{isolation:isolate;background:radial-gradient(circle at 18% 22%, color-mix(in srgb, var(--accent) 18%, transparent), transparent 32%), radial-gradient(circle at 78% 12%, color-mix(in srgb, var(--accent-2) 14%, transparent), transparent 28%), linear-gradient(180deg, color-mix(in srgb, var(--theme-void) 82%, black), var(--theme-void));min-height:100vh;padding:22px 22px 128px;position:relative}.stage{z-index:-2;position:fixed;inset:0}.stageVignette{z-index:-1;pointer-events:none;background:repeating-linear-gradient(90deg, #ffffff09 0, #ffffff09 1px, transparent 1px, transparent 42px), linear-gradient(90deg, #050506d6, #0505061a 45%, #050506b8), linear-gradient(180deg, #0505063d, #050506b8 78%, var(--theme-void));mix-blend-mode:screen;opacity:.92;position:fixed;inset:0}.topBar{grid-template-columns:minmax(260px,.72fr) minmax(420px,1fr);align-items:start;gap:22px;display:grid}.eyebrow{color:var(--muted);letter-spacing:0;text-transform:uppercase;margin:0 0 12px;font-size:12px}h1{max-width:680px;color:var(--paper);letter-spacing:0;text-transform:lowercase;text-shadow:0 0 32px color-mix(in srgb, var(--accent) 42%, transparent), 0 0 84px color-mix(in srgb, var(--accent-2) 18%, transparent);margin:0;font-size:clamp(42px,7vw,118px);font-weight:760;line-height:.86}.themeTagline{max-width:520px;color:color-mix(in srgb, var(--theme-ink) 76%, transparent);margin:14px 0 0;font-size:14px;line-height:1.45}.modeTabs{border:1px solid var(--line);background:color-mix(in srgb, var(--theme-surface) 58%, transparent);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);grid-template-columns:repeat(3,minmax(0,1fr));justify-self:end;gap:8px;width:min(650px,100%);padding:6px;display:grid}.modeTab{background:linear-gradient(180deg, #ffffff0f, #ffffff03), color-mix(in srgb, var(--theme-surface) 78%, black);min-height:58px;color:var(--paper);cursor:pointer;border:1px solid #0000;gap:4px;display:grid}.modeTab span,.modeTab small{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.modeTab span{align-self:end;font-size:14px;font-weight:720}.modeTab small{color:var(--muted);align-self:start;font-size:11px}.modeTab:hover,.modeTab.active{border-color:color-mix(in srgb, var(--accent) 70%, transparent);background:linear-gradient(180deg, color-mix(in srgb, var(--accent) 18%, transparent), transparent), #131511eb;box-shadow:inset 0 -2px 0 var(--accent)}.signalPanel{border:1px solid var(--line);background:linear-gradient(145deg, #ffffff14, transparent 38%), color-mix(in srgb, var(--theme-surface) 68%, transparent);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);width:min(360px,100vw - 44px);max-height:calc(100vh - 260px);padding:16px;position:fixed;top:128px;right:22px;overflow:auto}.panelHeader{color:var(--accent);letter-spacing:0;justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px;font-size:12px;font-weight:780;display:flex}.signalPanel p{color:#f0efe3c7;margin:0;font-size:13px;line-height:1.55}.signalStats{grid-template-columns:repeat(3,1fr);gap:7px;margin:16px 0;display:grid}.signalStats div{border:1px solid var(--line);background:#0000004d;min-width:0;padding:10px}.signalStats dt{color:var(--muted);text-transform:uppercase;font-size:10px}.signalStats dd{margin:4px 0 0;font-size:24px;font-weight:780}.cardBlock{border-top:1px solid var(--line);gap:6px;padding-top:12px;display:grid}.cardBlock+.cardBlock{margin-top:12px}.cardBlock strong{color:var(--paper);letter-spacing:0;text-transform:uppercase;font-size:11px}.genreDeck{border:1px solid var(--line);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#0505066b;grid-template-columns:repeat(8,minmax(74px,1fr));gap:6px;width:min(790px,100vw - 420px);max-height:248px;padding:6px;display:grid;position:fixed;bottom:108px;left:22px;overflow:auto}.samplerDeck{grid-template-columns:repeat(10,minmax(68px,1fr));width:min(980px,100vw - 420px)}.genreChip{background:linear-gradient(180deg, color-mix(in srgb, var(--chip) 10%, transparent), transparent), color-mix(in srgb, var(--theme-surface) 82%, black);min-height:58px;color:var(--paper);text-align:left;cursor:pointer;border:1px solid #f0efe31f;align-content:space-between;padding:7px;display:grid}.genreChip:hover,.genreChip.active{border-color:var(--chip);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--chip) 40%, transparent), 0 0 22px color-mix(in srgb, var(--chip) 20%, transparent)}.genreChip span{color:var(--chip);font-size:10px;font-weight:780}.genreChip strong{text-transform:lowercase;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:12px;font-weight:650;line-height:1.1;display:-webkit-box;overflow:hidden}.playerDock{border:1px solid var(--line);background:linear-gradient(90deg, color-mix(in srgb, var(--accent) 12%, transparent), transparent 46%), color-mix(in srgb, var(--theme-surface) 88%, black);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);grid-template-columns:auto minmax(220px,.8fr) minmax(280px,.8fr) minmax(180px,.42fr);align-items:center;gap:14px;min-height:70px;padding:10px;display:grid;position:fixed;bottom:22px;left:22px;right:22px}.appShell[data-theme=wave] .stageVignette{background:repeating-linear-gradient(0deg, #d7ff3f0e 0, #d7ff3f0e 1px, transparent 1px, transparent 9px), linear-gradient(90deg, #050806d1, #05080614 46%, #050806bd), linear-gradient(180deg, transparent, var(--theme-void))}.appShell[data-theme=sampler] .stageVignette{background:linear-gradient(90deg, #090506cc, #0905062e 52%, #090506d1), repeating-linear-gradient(90deg, #ff385c14 0, #ff385c14 2px, transparent 2px, transparent 64px), linear-gradient(180deg, transparent, var(--theme-void))}.audioPlayer{min-width:0}.audioPlayer audio{width:100%;height:42px;display:block}.audioPlayer span{border:1px solid var(--line);min-height:42px;color:var(--muted);place-items:center;font-size:12px;display:grid}.transport{gap:7px;display:flex}.transport button{border:1px solid var(--line);width:42px;height:42px;color:var(--paper);cursor:pointer;background:#ffffff0a;place-items:center;display:grid}.transport .modeToggle{grid-auto-columns:max-content;grid-auto-flow:column;gap:7px;width:auto;min-width:88px;padding:0 11px}.transport .modeToggle span{font-size:12px;font-weight:700}.transport button:hover,.transport .playButton,.transport .modeToggle.active{border-color:var(--accent);color:var(--accent)}.transport .playButton{background:color-mix(in srgb, var(--accent) 14%, transparent)}.nowPlaying{align-items:center;gap:12px;min-width:0;display:flex}.recordIcon{border:1px solid color-mix(in srgb, var(--accent) 70%, transparent);width:42px;height:42px;color:var(--accent);flex:none;place-items:center;display:grid}.nowPlaying p,.nowPlaying span{text-overflow:ellipsis;white-space:nowrap;margin:0;overflow:hidden}.nowPlaying p{font-size:15px;font-weight:760}.nowPlaying span{color:var(--muted);margin-top:3px;font-size:12px;display:block}.signalStrip{grid-template-columns:repeat(22,1fr);align-items:end;gap:3px;height:42px;display:grid}.signalStrip i{height:var(--bar);background:#f0efe333;min-height:5px;display:block}.signalStrip.playing i{background:linear-gradient(180deg, var(--accent), var(--accent-2));animation:.9s ease-in-out infinite alternate meterPulse;animation-delay:calc(var(--bar) * -.008)}@keyframes meterPulse{0%{opacity:.56;transform:scaleY(.62)}to{opacity:1;transform:scaleY(1)}}@media (max-width:1050px){.topBar{grid-template-columns:1fr}.modeTabs{justify-self:stretch}.signalPanel{width:100%;max-height:none;margin-top:28px;position:relative;top:auto;right:auto}.genreDeck,.samplerDeck{grid-template-columns:repeat(auto-fill,minmax(86px,1fr));width:100%;margin-top:18px;margin-bottom:92px;position:relative;bottom:auto;left:auto}}@media (max-width:720px){.appShell{padding:14px 14px 124px}.stageVignette{background:linear-gradient(180deg, #0505063d, #050506c7), color-mix(in srgb, var(--theme-void) 42%, transparent)}h1{font-size:clamp(38px,17vw,72px)}.modeTabs{grid-template-columns:1fr}.signalPanel{margin-top:22px}.playerDock{grid-template-columns:1fr;gap:10px;bottom:10px;left:10px;right:10px}.transport{justify-content:space-between}.transport button{width:100%}.signalStrip{display:none}}