@import url('https://fonts.googleapis.com/css2?family=Geist:wght@400;450;500;550;600;650;700&family=Geist+Mono:wght@400;500&display=swap');
:root{font-family:Geist,Arial,sans-serif;color:#171717;background:#fafafa;font-synthesis:none;--border:#e9e9e9;--muted:#737373}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer;border:1px solid #dedede;background:white;border-radius:6px;padding:10px 14px;font-size:14px;font-weight:500;color:inherit;transition:background .15s,border-color .15s}button:hover{background:#f3f3f3;border-color:#b7b7b7}button:focus-visible,a:focus-visible{outline:3px solid #0070f3;outline-offset:4px}button:disabled{cursor:default;opacity:.4}header{height:76px;border-bottom:1px solid var(--border);background:white;display:flex;align-items:center;padding:0 42px;gap:20px}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit;font-size:25px;font-weight:650;letter-spacing:-1px}.brand-icon{background:#171717;color:white;border-radius:7px;width:31px;height:31px;display:grid;place-items:center;font-size:28px;font-weight:400}.slash{color:#d4d4d4;margin:0 12px;font-size:30px;font-weight:400}.workspace{font-size:14px;font-weight:450;letter-spacing:0}.tag{font:11px 'Geist Mono',monospace;letter-spacing:.4px;border:1px solid var(--border);border-radius:4px;padding:5px 7px;color:#737373;white-space:nowrap}.quiet{margin-left:auto;border:0;background:none;color:#666}.question{border:1px solid #999;border-radius:50%;padding:0 4px;margin-left:8px}main{max-width:1320px;margin:auto;padding:44px 40px 0}.title-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:34px}.eyebrow{font:11px 'Geist Mono',monospace;letter-spacing:1.8px;color:#777;margin-bottom:12px}h1{font-size:36px;line-height:1.2;font-weight:600;letter-spacing:-1.5px;margin:0 0 10px}p{color:#777;font-size:14px;line-height:1.6;margin:0}.title-row p{font-size:16px}.title-row>button{color:#666}.studio{display:grid;grid-template-columns:minmax(0,1fr) 326px;gap:24px;align-items:start}.main-column{display:grid;gap:24px}.panel{background:white;border:1px solid var(--border);border-radius:10px;overflow:hidden}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:21px 24px}h2{font-size:15px;letter-spacing:-.2px;font-weight:550;margin:0;display:flex;align-items:center;gap:10px}.step{font:11px 'Geist Mono',monospace;border:1px solid var(--border);border-radius:4px;padding:4px;color:#888}.small{font-size:12px;color:var(--muted);line-height:1.6}.dropzone{display:flex;align-items:center;flex-direction:column;margin:0 24px;width:calc(100% - 48px);padding:25px 16px;border:1px dashed #d5d5d5;background:linear-gradient(125deg,#fcfcfc,#fff);gap:9px;border-radius:7px}.dropzone.drag{background:#eef6ff;border-color:#0070f3}.upload-icon{font-size:25px;width:42px;height:42px;display:grid;place-items:center;border:1px solid #e5e5e5;border-radius:9px;background:#fff;margin-bottom:5px;box-shadow:0 2px 2px #00000004}.dropzone strong{font-size:16px;font-weight:550}.dropzone>span:not(.upload-icon){font-size:14px;color:#777}.dropzone u{color:#171717;text-underline-offset:3px}.dropzone small{font-size:12px;color:#939393;margin-top:6px}.sample-row{display:flex;gap:8px;justify-content:center;align-items:center;padding:15px;color:#888;font-size:12px}.text-button{border:0;padding:4px;background:none;font-size:12px}.text-button span{margin-left:5px}.effect-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:0 24px 22px}.effect-card{text-align:left;padding:17px 14px;position:relative;border-color:var(--border);min-height:137px;border-radius:7px}.effect-card.selected{border-color:#171717;box-shadow:0 0 0 1px #171717}.effect-card .symbol{display:block;font-size:23px;height:35px;line-height:25px;font-weight:400}.effect-card strong{font-size:14px;display:block;font-weight:550;margin:4px 0 6px}.effect-card .desc{font-size:12px;line-height:1.6;color:#888;display:block}.effect-card .dot{position:absolute;right:13px;top:14px;width:15px;height:15px;border-radius:50%;border:1px solid #ddd}.effect-card.selected .dot{border:5px solid #171717}.ai{position:absolute;top:17px;right:36px;font:10px 'Geist Mono',monospace;color:#888}.effects-note{background:#fcfcfc;border-top:1px solid var(--border);font-size:12px;color:#888;padding:13px 24px;display:flex;gap:8px}.settings>.panel-heading{border-bottom:1px solid var(--border)}.settings-icon{color:#888;font-size:22px}#settings-body{padding:24px}.selected-heading{display:flex;align-items:center;gap:11px;margin-bottom:10px}.selected-heading>span{font-size:24px}.selected-heading h3{font-size:17px;font-weight:550;letter-spacing:-.4px;margin:0}.setting-description{font-size:13px;line-height:1.7;color:#888}.setting-control{margin-top:27px}.range-label{display:flex;justify-content:space-between;font-size:13px;margin-bottom:16px}.range-label output{font:12px 'Geist Mono',monospace;background:#f5f5f5;border-radius:4px;padding:3px 6px;color:#666}input[type=range]{accent-color:#171717;width:100%;height:4px;cursor:pointer}.range-extents{display:flex;justify-content:space-between;color:#999;font-size:11px;margin-top:10px}.toggle-row{display:flex;justify-content:space-between;align-items:center;font-size:13px;margin-top:25px}.toggle-row input{appearance:none;cursor:pointer;width:30px;height:18px;border-radius:30px;background:#ddd;position:relative}.toggle-row input:checked{background:#171717}.toggle-row input:after{content:'';position:absolute;width:14px;height:14px;border-radius:50%;background:white;top:2px;left:2px;transition:transform .2s}.toggle-row input:checked:after{transform:translateX(12px)}.info-box{padding:12px;background:#fafafa;border:1px solid #eee;border-radius:6px;color:#888;font-size:12px;line-height:1.7;margin-top:23px}.add-button{width:100%;margin-top:22px}.chain-section{padding:22px 24px;border-top:1px solid var(--border)}.section-label{font:10px 'Geist Mono',monospace;letter-spacing:1px;display:flex;justify-content:space-between;color:#888}.section-label span{background:#f3f3f3;padding:2px 5px;border-radius:3px}.chain-empty{font-size:12px;color:#999;border:1px dashed #e4e4e4;padding:16px 12px;border-radius:6px;margin-top:14px;text-align:center}.chain-item{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:12px;background:#fafafa;padding:6px 8px;border-radius:5px}.chain-item button{margin-left:auto;border:0;background:none;padding:4px;font-size:17px}.export-section{border-top:1px solid var(--border);padding:22px 24px}.export-line{display:flex;justify-content:space-between;align-items:center;font-size:13px}.export-line strong{font-weight:500}.export-section>.small{margin:7px 0 18px}.primary{background:#171717;color:white;border-color:#171717;width:100%;min-height:42px}.primary:hover{background:#333}.soon{font-size:10px;color:#ccc;border:1px solid #555;border-radius:3px;padding:2px 4px;margin-left:7px}.export-note{text-align:center;font-size:11px;line-height:1.6;margin-top:11px;color:#999}.player .panel-heading{padding-bottom:10px}.player h2{margin-bottom:5px}.wave-wrap{height:108px;position:relative;margin:0 24px}canvas{width:100%;height:100%}#wave-empty{position:absolute;inset:0;display:grid;place-items:center;font-size:12px;color:#999;background:#ffffffcc}.player>input{display:block;width:calc(100% - 48px);margin:2px 24px}.timeline{display:flex;justify-content:space-between;padding:10px 24px;font:10px 'Geist Mono',monospace;color:#999}.transport{border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;padding:14px 24px;gap:12px}.transport-left{display:flex;gap:12px;align-items:center}.icon-button{border:0;background:none;font-size:20px;padding:6px}.play{border-radius:50%;background:#171717;color:white;width:36px;height:36px;padding:0;border:0;font-size:12px}.play:hover{background:#444}#play-label{font-size:12px;color:#999}.volume{display:flex;align-items:center;gap:10px;font-size:11px;color:#888}.volume input{width:72px}footer{display:flex;justify-content:space-between;font-size:11px;color:#999;padding:26px 0}.mini-brand{font-size:16px;margin-right:8px;color:#666}.file-row{margin:0 24px;padding:28px 15px;display:flex;align-items:center;gap:15px;border:1px solid var(--border);border-radius:6px}.file-details{display:flex;flex-direction:column;gap:7px;min-width:0;flex:1}.file-details strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}.file-symbol{font-size:28px}#status{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#171717;color:white;padding:14px 20px;border-radius:8px;font-size:13px;box-shadow:0 4px 20px #0002;display:none;max-width:90vw;z-index:10}dialog{border:1px solid #ddd;border-radius:12px;padding:32px;max-width:470px;width:calc(100% - 32px)}dialog::backdrop{background:#0005;backdrop-filter:blur(3px)}dialog h2{font-size:24px;margin:18px 0}dialog ol{padding-left:20px;font-size:14px}dialog li{padding:8px 0}dialog p{font-size:14px;margin:7px 0}.close{float:right;border:0;padding:0 6px;font-size:22px}@media(min-width:1450px){main{padding-top:55px}.dropzone{padding:35px 16px}}@media(max-width:1000px){header{padding:0 24px}main{padding:30px 24px 0}.studio{grid-template-columns:minmax(0,1fr) 290px;gap:16px}.effect-grid{grid-template-columns:repeat(2,1fr)}.small{font-size:11px}.panel-heading{padding:19px}.panel-heading>.small{display:none}}@media(max-width:720px){header{height:65px;padding:0 18px;gap:12px}header>.tag{display:none}.brand{font-size:23px}.slash{margin:0 3px}.workspace{font-size:12px}.quiet{font-size:0}.question{font-size:14px}main{padding:28px 16px 0}h1{font-size:29px}.title-row p{font-size:14px}.title-row{align-items:flex-start;gap:12px}.title-row>button{padding:8px}.title-row>button span{display:none}.studio{grid-template-columns:1fr}.settings{order:2}.effect-grid{grid-template-columns:repeat(2,1fr)}footer{gap:20px;line-height:1.8}footer>span:last-child{display:none}.transport{padding:14px 18px}#play-label{display:none}.player .tag{font-size:9px}.dropzone{margin:0 18px;width:calc(100% - 36px)}}
.compare{display:flex;gap:5px}.compare button{font-size:12px;padding:7px}.compare button[aria-pressed=true]{background:#171717;color:white}.export-section .primary{width:100%;margin-top:8px}.export-note{overflow-wrap:anywhere}#process-state{min-height:40px} @media(max-width:600px){.player .panel-heading{flex-wrap:wrap}.workspace{display:none}}

.download{display:block;text-align:center;text-decoration:none;border-radius:6px;padding:12px;font-size:14px;cursor:pointer}.download[aria-disabled=true]{opacity:.4;pointer-events:none}

.included{display:block;font-size:11px;color:#167347;margin:5px 0}.effect-card{min-height:148px}

#wave{cursor:grab;touch-action:pan-y;user-select:none}#wave.scrubbing{cursor:grabbing;touch-action:none}#wave-empty{pointer-events:none}

#sound-preset{width:100%;padding:10px;margin:8px 0 20px;border:1px solid #ddd;border-radius:6px;background:white;color:#171717;font:inherit}

#effect-navigation{display:flex;flex-wrap:wrap;gap:6px;padding:0 24px 16px}#effect-navigation:empty{display:none}#effect-navigation button{font-size:12px;padding:7px 9px}#effect-navigation button[aria-pressed="true"]{background:#171717;color:white;border-color:#171717}.chain-item.active{outline:1px solid #171717}.chain-item .chain-edit{flex:1;text-align:left;font-size:12px;margin:0;padding:7px 3px}.chain-edit span{margin-right:5px}
/* Neon night studio */
:root{--accent:#167b68}body,header,.panel,button,dialog{transition:background-color .25s,color .25s,border-color .25s,box-shadow .25s}header .theme-toggle{margin-left:auto;display:flex;gap:8px;align-items:center;font-size:13px}header .quiet{margin-left:0}.panel{animation:panel-arrive .55s both}.effects{animation-delay:.08s}.player{animation-delay:.16s}.settings{animation-delay:.12s}.effect-card{transition:transform .2s,border-color .2s,background .2s,box-shadow .2s}.effect-card:hover{transform:translateY(-3px)}button:active,.download:active{transform:scale(.97)}.event-in{animation:event-arrive .3s ease-out}.toast-in{animation:toast-arrive .25s ease-out}.chain-item{animation:event-arrive .22s ease-out}.playing .play{animation:play-glow 2s ease-in-out infinite}#render-progress[hidden]{display:none}.render-progress{position:relative;padding:16px 12px 12px;margin-top:16px;border:1px solid var(--border);border-radius:9px;background:#f7faf9;animation:event-arrive .3s}.progress-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:11px;margin-bottom:12px}.progress-heading span:last-child{font-family:'Geist Mono',monospace;color:var(--accent)}.progress-track{height:7px;border-radius:99px;background:#dce5e2;overflow:hidden}#progress-fill{width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#16b99d,#7d65ee,#1de2bb);background-size:200% 100%;transition:width .4s ease;position:relative}.rendering #progress-fill{animation:progress-flow 2s linear infinite}.rendering .progress-track:after{content:'';display:block;position:relative;top:-7px;width:30%;height:7px;background:linear-gradient(90deg,transparent,#ffffff70,transparent);animation:progress-sweep 1.3s infinite}.progress-bars{display:flex;align-items:center;justify-content:center;gap:3px;height:22px;margin-top:9px}.progress-bars i{width:3px;height:4px;background:var(--accent);border-radius:3px}.rendering .progress-bars i{animation:meter-bounce .7s ease-in-out infinite alternate}.progress-bars i:nth-child(2){animation-delay:.15s}.progress-bars i:nth-child(3){animation-delay:.3s}.progress-bars i:nth-child(4){animation-delay:.1s}.progress-bars i:nth-child(5){animation-delay:.25s}.render-complete .render-progress{border-color:var(--accent)}

/* Quiet charcoal palette */
html[data-theme=dark]{color-scheme:dark;--border:#303237;--muted:#a6a7ad;--accent:#a8b9da;background:#141517;color:#eeedef}
html[data-theme=dark] body{background:#141517}
html[data-theme=dark] header{background:#191a1d;border-color:#2d2e33}
html[data-theme=dark] .brand{color:#f3f1ef}
html[data-theme=dark] .brand-icon{background:#e3e0dc;color:#242526;box-shadow:none}
html[data-theme=dark] .slash{color:#55565c}
html[data-theme=dark] .panel{background:#1c1d21;border-color:#303237;box-shadow:0 6px 20px #00000012}
html[data-theme=dark] h1{color:#f1efeb}
html[data-theme=dark] .eyebrow{color:#aaa9a5}
html[data-theme=dark] p,html[data-theme=dark] .small,html[data-theme=dark] .setting-description,html[data-theme=dark] .effect-card .desc,html[data-theme=dark] .effects-note,html[data-theme=dark] .info-box,html[data-theme=dark] .export-note,html[data-theme=dark] .sample-row,html[data-theme=dark] .dropzone>span:not(.upload-icon),html[data-theme=dark] .quiet,html[data-theme=dark] .title-row>button{color:#a6a7ad}
html[data-theme=dark] button{background:#25262b;border-color:#3a3b42;color:#e8e7e5}
html[data-theme=dark] button:hover{background:#2c2e34;border-color:#666973}
html[data-theme=dark] button:focus-visible,html[data-theme=dark] a:focus-visible{outline-color:#a8b9da}
html[data-theme=dark] .quiet,html[data-theme=dark] .text-button,html[data-theme=dark] .icon-button,html[data-theme=dark] .chain-item button{background:none}
html[data-theme=dark] .tag,html[data-theme=dark] .step{border-color:#3b3d44;color:#aeafb6}
html[data-theme=dark] .dropzone{background:#202125;border-color:#46474e}
html[data-theme=dark] .dropzone:hover,html[data-theme=dark] .dropzone.drag{background:#26282e;border-color:#a8b9da;box-shadow:none}
html[data-theme=dark] .dropzone u{color:#d8dfe9}
html[data-theme=dark] .upload-icon{background:#2b2d33;border-color:#41434b;color:#dddfe5;box-shadow:0 2px 4px #0002}
html[data-theme=dark] .effect-card{background:#222328;border-color:#34363d;border-radius:9px}
html[data-theme=dark] .effect-card:hover{background:#292b31}
html[data-theme=dark] .effect-card .symbol{color:#b7bac4}
html[data-theme=dark] .effect-card.selected{background:#2a2e37;border-color:#9caac5;box-shadow:inset 0 0 0 1px #9caac51a}
html[data-theme=dark] .effect-card .dot{border-color:#54565e}
html[data-theme=dark] .effect-card.selected .dot{border:5px solid #b2bfd6;box-shadow:none}
html[data-theme=dark] .included{color:#b1c4b5}
html[data-theme=dark] .effects-note,html[data-theme=dark] .info-box{background:#202126;border-color:#34363d}
html[data-theme=dark] .range-label output{background:#2d3038;color:#d4dce9}
html[data-theme=dark] input[type=range]{accent-color:#a8b9da}
html[data-theme=dark] .toggle-row input{background:#4a4c54}
html[data-theme=dark] .toggle-row input:checked{background:#91a5c9}
html[data-theme=dark] .range-extents,html[data-theme=dark] .dropzone small,html[data-theme=dark] .timeline,html[data-theme=dark] .section-label,html[data-theme=dark] footer{color:#94969f}
html[data-theme=dark] .chain-item{background:#25272d}
html[data-theme=dark] .chain-item.active{outline-color:#7e8da7}
html[data-theme=dark] .section-label span{background:#32343c;color:#dddfe5}
html[data-theme=dark] #sound-preset{background:#25272d;border-color:#40424b;color:#e4e5e9}
html[data-theme=dark] #effect-navigation button[aria-pressed=true],html[data-theme=dark] .compare button[aria-pressed=true]{background:#373e4b;border-color:#7f8ba1;color:#e2e8f2;box-shadow:none}
html[data-theme=dark] .primary,html[data-theme=dark] .play{background:#dededb;border-color:#dededb;color:#222326;box-shadow:none}
html[data-theme=dark] .primary:hover,html[data-theme=dark] .play:hover{background:#f0efeb;border-color:#f0efeb;box-shadow:none}
html[data-theme=dark] .download{background:#2c3039;border:1px solid #4b5363;color:#d7deeb;box-shadow:none}
html[data-theme=dark] .download:hover{background:#373d48;border-color:#68758b;color:#f0f2f7}
html[data-theme=dark] #wave-empty{background:#1c1d21e6;color:#a6a7ad}
html[data-theme=dark] #status{background:#30343b;border:1px solid #555c69;color:#efefed;box-shadow:0 8px 28px #0004}
html[data-theme=dark] dialog{background:#212227;border-color:#494b54;color:#eeedef}
html[data-theme=dark] .render-progress{background:#202329;border-color:#3a414d}
html[data-theme=dark] .progress-track{background:#383c45}
html[data-theme=dark] #progress-fill{background:linear-gradient(90deg,#7d8eab,#bdc9dc,#7d8eab);background-size:200% 100%;box-shadow:none}
html[data-theme=dark] .render-complete .render-progress{border-color:#647a6e;box-shadow:none}
html[data-theme=dark] .render-complete .progress-heading span:last-child{color:#b4caba}
@keyframes panel-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes event-arrive{from{opacity:.3;transform:translateY(5px)}to{opacity:1;transform:none}}@keyframes toast-arrive{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}@keyframes progress-flow{to{background-position:200% 0}}@keyframes progress-sweep{from{left:-30%}to{left:100%}}@keyframes meter-bounce{to{height:18px}}@keyframes play-glow{50%{box-shadow:0 0 0 6px #a8b9da10,0 0 22px #a8b9da15}}@media(max-width:600px){header .theme-toggle{padding:8px;font-size:15px}header .theme-toggle span{display:none}header{gap:8px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Color accents shared by both themes */
:root{--accent:#5268bb}
body{background:radial-gradient(ellipse at 0% 0%,#eef3ff,transparent 48%),#fafafa}
.brand-icon{background:#5268bb;color:white}.eyebrow{color:#6675a5}
.step{background:#eef1fc;color:#5268bb;border-color:#d8dff2}
.source .step{background:#e9f5f0;color:#35765e;border-color:#cee8dc}
.dropzone{background:linear-gradient(120deg,#f1f7fa,#f6f3fc);border-color:#c5cede}
.upload-icon{background:#eaf2fb;color:#4774ac;border-color:#cfdeee}
.effect-card{--card-accent:#647cb6;--card-tint:#f0f4fb;background:var(--card-tint)}
.effect-card:nth-child(4n+2){--card-accent:#8a6ab4;--card-tint:#f6f1fb}
.effect-card:nth-child(4n+3){--card-accent:#438979;--card-tint:#eef7f3}
.effect-card:nth-child(4n){--card-accent:#ad8043;--card-tint:#fbf5eb}
.effect-card .symbol{color:var(--card-accent)}
.effect-card:hover{border-color:var(--card-accent);background:var(--card-tint)}
.effect-card.selected{border-color:var(--card-accent);box-shadow:0 0 0 1px var(--card-accent)}
.effect-card.selected .dot{border-color:var(--card-accent)}
.primary,.play{background:#5268bb;border-color:#5268bb;color:white}.primary:hover,.play:hover{background:#435aa7}
.download{background:#edf5f1;border:1px solid #b5d5c6;color:#346b55}.download:hover{background:#e0eee6}
.range-label output{background:#eef1fb;color:#5268bb}input[type=range]{accent-color:#6379c2}
#effect-navigation button[aria-pressed=true],.compare button[aria-pressed=true]{background:#e9edfa;border-color:#9eadd7;color:#405695}
.chain-item.active{outline-color:#8194ce}.selected-heading>span{color:#7580b9}
#progress-fill{background:linear-gradient(90deg,#6b82c7,#a28acb,#6eafa6);background-size:200% 100%}
html[data-theme=dark]{--accent:#9caee5}
html[data-theme=dark] body{background:radial-gradient(ellipse at 0% 0%,#26334845,transparent 45%),radial-gradient(ellipse at 100% 35%,#37284125,transparent 40%),#141517}
html[data-theme=dark] .brand-icon{background:#b9c8ea;color:#25334d}
html[data-theme=dark] .eyebrow{color:#a9b9df}
html[data-theme=dark] .step{background:#2b344c;border-color:#3b4967;color:#b9caef}
html[data-theme=dark] .source .step{background:#263c36;border-color:#37554a;color:#a7d4bf}
html[data-theme=dark] .dropzone{background:linear-gradient(120deg,#222c35,#2a2633);border-color:#485064}
html[data-theme=dark] .upload-icon{background:#2f3e53;color:#b7cceb;border-color:#465b75}
html[data-theme=dark] .effect-card{--card-accent:#93aedf;--card-tint:#252d3a;background:var(--card-tint);border-color:#384152}
html[data-theme=dark] .effect-card:nth-child(4n+2){--card-accent:#bea2de;--card-tint:#2d2739;border-color:#463c55}
html[data-theme=dark] .effect-card:nth-child(4n+3){--card-accent:#91c4b1;--card-tint:#24332f;border-color:#394c44}
html[data-theme=dark] .effect-card:nth-child(4n){--card-accent:#d5b17b;--card-tint:#352e24;border-color:#514536}
html[data-theme=dark] .effect-card .symbol{color:var(--card-accent)}
html[data-theme=dark] .effect-card:hover{background:var(--card-tint);border-color:var(--card-accent)}
html[data-theme=dark] .effect-card.selected{background:var(--card-tint);border-color:var(--card-accent);box-shadow:inset 0 0 0 1px var(--card-accent)}
html[data-theme=dark] .effect-card.selected .dot{border-color:var(--card-accent)}
html[data-theme=dark] .primary,html[data-theme=dark] .play{background:#aebfe9;border-color:#aebfe9;color:#1f2b46}
html[data-theme=dark] .primary:hover,html[data-theme=dark] .play:hover{background:#c4d2f3;border-color:#c4d2f3}
html[data-theme=dark] .download{background:#293e35;border-color:#4e7461;color:#b9dcc8}
html[data-theme=dark] .download:hover{background:#334d41;border-color:#719782;color:#d1eddd}
html[data-theme=dark] .range-label output{background:#30394f;color:#c2d0f1}
html[data-theme=dark] input[type=range]{accent-color:#a8b9e5}
html[data-theme=dark] #effect-navigation button[aria-pressed=true],html[data-theme=dark] .compare button[aria-pressed=true]{background:#35425c;border-color:#7a91bd;color:#d3e0fb}
html[data-theme=dark] #progress-fill{background:linear-gradient(90deg,#89a2d5,#b49bcf,#8bbbae);background-size:200% 100%}
/* Shared multi-page navigation and editorial pages */
header{height:auto;min-height:76px;flex-wrap:wrap;padding-top:14px;padding-bottom:14px}.site-nav{display:flex;align-items:center;gap:4px;margin-left:auto}.site-nav a{padding:9px 10px;font-size:12px;color:#626b7d;text-decoration:none;border-radius:6px;white-space:nowrap}.site-nav a:hover,.site-nav a[aria-current=page]{background:#edf0fa;color:#435b9b}header .theme-toggle{margin-left:8px}.site-footer{border-top:1px solid var(--border);margin-top:40px;padding:30px 0 35px;display:flex;gap:25px;align-items:flex-start;justify-content:space-between}.footer-brand{font-size:21px;font-weight:600;text-decoration:none;color:inherit}.site-footer p{font-size:12px;margin:8px 0}.site-footer nav{display:flex;gap:18px;flex-wrap:wrap;justify-content:flex-end}.site-footer nav a{font-size:12px;color:#687080;text-decoration:none}.site-footer a:hover{color:#5268bb}.page-intro{max-width:800px;padding:14px 0 35px}.back-link{display:inline-block;color:#7d879a;font-size:12px;text-decoration:none;margin-bottom:35px}.page-intro h1{font-size:44px;letter-spacing:-1.6px;margin:10px 0 18px}.page-intro>p{font-size:17px;max-width:630px;line-height:1.7}.document-layout{display:flex;gap:45px;align-items:flex-start}.document-toc{flex:0 0 180px;position:sticky;top:24px;padding-top:20px}.document-toc .eyebrow{display:block;margin-bottom:20px}.document-toc a{display:block;font-size:13px;line-height:1.5;color:#748099;text-decoration:none;padding:10px 0;border-bottom:1px solid var(--border)}.document-toc a:hover{color:#5268bb}.document-card{min-width:0;flex:1;background:white;border:1px solid var(--border);border-radius:14px;padding:40px 45px;max-width:900px;box-shadow:0 8px 28px #202b4510;animation:panel-arrive .4s}.document-meta{font:11px 'Geist Mono',monospace;color:#8991a1;margin-bottom:28px}.document-callout{border-left:3px solid #8298cb;background:#f1f4fb;padding:20px 24px;border-radius:0 8px 8px 0;margin-bottom:34px}.document-callout strong{font-size:15px;font-weight:550}.document-callout p{margin-top:9px}.document-section{padding:28px 0;border-bottom:1px solid var(--border);scroll-margin-top:24px}.document-section:last-child{border:0;padding-bottom:0}.document-section h2{font-size:19px;line-height:1.4;margin-bottom:17px}.document-card p{font-size:14px;line-height:1.9;color:#6c7586}.document-card p+p{margin-top:14px}.document-card a{color:#5268bb;text-underline-offset:3px}.document-card code{background:#eef1f8;padding:2px 5px;border-radius:4px;font-size:12px}.about-feature{display:flex;gap:24px;align-items:flex-start;padding:8px 0 30px}.about-feature h2{font-size:26px;line-height:1.35;margin-bottom:16px}.about-symbol{font-size:42px;color:#8e83b5;background:#f2eef8;border-radius:12px;padding:15px 20px}.value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:15px 0 25px}.value-grid section{padding:20px;border:1px solid var(--border);border-radius:9px;background:#f9fafc}.value-grid span{color:#91a3c5;font:12px 'Geist Mono',monospace}.value-grid h2{font-size:15px;margin:17px 0 10px;line-height:1.5}.value-grid p{font-size:13px}.page-action{display:inline-block;background:#5268bb;color:white!important;border:1px solid #5268bb;text-decoration:none;padding:12px 18px;border-radius:7px;font-size:13px;margin-top:20px}.page-action:hover{background:#435b9b}.contact-topics{display:grid;grid-template-columns:1fr 1fr;gap:30px;padding-bottom:25px}.contact-topics h2{font-size:17px;margin-bottom:12px}.contact-form{border-top:1px solid var(--border);padding:24px 0}.contact-form label{display:block;font-size:13px;margin:18px 0 10px}.contact-form select,.contact-form textarea,.contact-form input{width:100%;padding:12px 14px;border:1px solid #d8dce5;border-radius:7px;font:14px Geist,Arial,sans-serif;background:#fafbfc;color:#333;resize:vertical}.contact-form :focus{outline:2px solid #8199cf;outline-offset:2px}.contact-form .form-hint{font-size:12px;margin-top:10px}.contact-form #contact-status{margin-top:16px;color:#536f63}.contact-faq{padding:18px 0;border-top:1px solid var(--border)}.contact-faq summary{font-size:14px;cursor:pointer}.contact-faq p{padding-top:13px}.information-page main{max-width:1160px}.information-page .document-layout:not(:has(.document-toc)){max-width:940px}.site-footer>div>span{font-size:11px;color:#9096a2}
html[data-theme=dark] .site-nav a,html[data-theme=dark] .site-footer nav a{color:#b0b4bf}html[data-theme=dark] .site-nav a:hover,html[data-theme=dark] .site-nav a[aria-current=page]{background:#2d374a;color:#d2dff6}html[data-theme=dark] .document-card{background:#1c1d21;border-color:#303237;box-shadow:0 8px 28px #0002}html[data-theme=dark] .document-card p{color:#b0b3bd}html[data-theme=dark] .document-callout{background:#252d3b;border-color:#8a9dc4}html[data-theme=dark] .document-card a{color:#b0c4ed}html[data-theme=dark] .document-card code{background:#303746;color:#d8e2f3}html[data-theme=dark] .value-grid section{background:#22262d}html[data-theme=dark] .about-symbol{background:#302a3e;color:#c2afe4}html[data-theme=dark] .contact-form select,html[data-theme=dark] .contact-form textarea,html[data-theme=dark] .contact-form input{background:#25272d;color:#eeedef;border-color:#444952}html[data-theme=dark] .page-action{background:#aebfe9;color:#1f2b46!important;border-color:#aebfe9}html[data-theme=dark] .contact-form #contact-status{color:#b4caba}
@media(max-width:1100px){.site-nav{order:3;width:100%;justify-content:center;margin:4px 0 0}.site-nav a{padding:8px}header .theme-toggle{margin-left:auto}.document-layout{gap:28px}.document-card{padding:30px}}@media(max-width:720px){.site-nav{justify-content:flex-start;overflow:auto;flex-wrap:nowrap}.site-nav a{font-size:11px;padding:7px 8px}.document-toc{position:static;flex:auto;display:flex;flex-wrap:wrap;gap:5px 16px;padding:0}.document-toc .eyebrow{width:100%;margin:0}.document-toc a{padding:7px 0;font-size:12px}.document-layout{display:flex;flex-direction:column}.document-card{width:100%;padding:24px 20px}.page-intro{padding-top:5px}.page-intro h1{font-size:33px}.page-intro>p{font-size:15px}.value-grid{grid-template-columns:1fr}.about-feature{flex-direction:column;gap:16px}.contact-topics{grid-template-columns:1fr;gap:20px}.site-footer{flex-direction:column}.site-footer nav{justify-content:flex-start;gap:15px}.site-footer>span:last-child{display:block}.back-link{margin-bottom:26px}}
@media(max-width:720px){.site-nav{flex-wrap:wrap;overflow:visible;gap:2px 4px}.site-nav a{font-size:11px;padding:7px 8px}header{padding-bottom:10px}}
/* Readable type scale across the studio and information pages */
body{font-size:16px}button{font-size:15px}.workspace{font-size:15px}.site-nav a{font-size:14px;padding:10px 11px}header .theme-toggle{font-size:14px}.eyebrow{font-size:12px}h2{font-size:17px}.small{font-size:14px}.panel-heading>.small{font-size:13px}.title-row p{font-size:18px}.dropzone strong{font-size:18px}.dropzone>span:not(.upload-icon){font-size:16px}.dropzone small{font-size:14px;line-height:1.6}.sample-row,.text-button{font-size:14px}.effect-card strong{font-size:16px;line-height:1.4}.effect-card .desc{font-size:14px;line-height:1.65}.effect-card{min-height:168px}.included{font-size:12px}.effects-note{font-size:14px;line-height:1.7}.selected-heading h3{font-size:19px}.setting-description{font-size:15px}.range-label{font-size:15px}.range-label output{font-size:14px}.range-extents{font-size:12px}.toggle-row{font-size:15px}.info-box{font-size:14px;line-height:1.7}.section-label{font-size:12px}.chain-item .chain-edit,#effect-navigation button{font-size:14px}.chain-empty{font-size:14px}.export-line{font-size:15px}.export-note{font-size:13px;line-height:1.7}.download{font-size:15px}.compare button{font-size:14px}.timeline{font-size:12px}#play-label,.volume{font-size:13px}.file-details strong{font-size:16px}.progress-heading{font-size:13px}#status{font-size:15px}.tag,.step{font-size:12px}.site-footer p,.site-footer nav a{font-size:14px}.site-footer>div>span{font-size:12px}.back-link{font-size:14px}.document-meta{font-size:12px}.document-toc a{font-size:15px}.document-card p{font-size:16px;line-height:1.85}.document-section h2{font-size:21px}.document-callout strong{font-size:17px}.value-grid h2{font-size:17px}.value-grid p{font-size:15px}.contact-topics h2{font-size:19px}.contact-form label{font-size:15px}.contact-form select,.contact-form textarea,.contact-form input{font-size:16px}.contact-form .form-hint{font-size:14px}.contact-faq summary{font-size:16px}.page-action{font-size:15px}dialog p,dialog ol{font-size:16px}.document-card code{font-size:14px}
@media(max-width:1100px){.site-nav a{font-size:14px;padding:9px 10px}.small{font-size:14px}}@media(max-width:720px){.site-nav a{font-size:13px;padding:8px 9px}.title-row p{font-size:16px}.effect-card{padding:16px 12px}.effect-card strong{font-size:15px}.effect-card .desc{font-size:14px}.page-intro>p{font-size:17px}.document-card p{font-size:16px}.document-toc a{font-size:14px}.brand{font-size:24px}.dropzone small{font-size:13px}.site-footer nav{gap:14px 18px}}
/* Larger, visibly readable typography */
body,button{font-size:17px}.site-nav a{font-size:16px}.workspace,header .theme-toggle{font-size:16px}.eyebrow{font-size:13px}h2{font-size:20px}.small,.panel-heading>.small{font-size:16px}.title-row p{font-size:20px}.dropzone strong{font-size:21px}.dropzone>span:not(.upload-icon){font-size:18px}.dropzone small,.sample-row,.text-button{font-size:16px}.effect-card strong{font-size:19px}.effect-card .desc{font-size:17px;line-height:1.6}.effect-card{min-height:190px}.included{font-size:14px}.effects-note{font-size:16px}.selected-heading h3{font-size:23px}.setting-description,.range-label,.toggle-row{font-size:17px}.range-label output{font-size:16px}.range-extents{font-size:14px}.info-box{font-size:16px}.section-label{font-size:14px}.chain-item .chain-edit,#effect-navigation button{font-size:16px}.export-line,.download{font-size:17px}.export-note{font-size:15px}.compare button{font-size:16px}.timeline{font-size:14px}#play-label,.volume,.progress-heading{font-size:15px}.file-details strong{font-size:18px}.tag,.step{font-size:14px}.site-footer p,.site-footer nav a,.back-link{font-size:16px}.document-toc a{font-size:17px}.document-card p{font-size:18px;line-height:1.85}.document-section h2{font-size:24px}.document-callout strong{font-size:20px}.value-grid h2{font-size:19px}.value-grid p{font-size:17px}.contact-form label,.contact-faq summary{font-size:18px}.contact-form select,.contact-form textarea,.contact-form input{font-size:18px}.contact-form .form-hint{font-size:16px}.page-action{font-size:17px}#sound-preset{font-size:17px}.studio{grid-template-columns:minmax(0,1fr) 360px}
@media(max-width:1100px){.site-nav a{font-size:16px}.studio{grid-template-columns:minmax(0,1fr) 330px}.small{font-size:16px}.effect-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:720px){.studio{grid-template-columns:1fr}.site-nav a{font-size:15px;padding:9px}.title-row p{font-size:18px}.effect-card strong{font-size:18px}.effect-card .desc{font-size:16px}.effect-card{min-height:190px}.dropzone small{font-size:15px}.page-intro>p,.document-card p{font-size:18px}.document-toc a{font-size:16px}.transport{flex-wrap:wrap}.compare{flex-wrap:wrap}.brand{font-size:26px}}
/* Responsive layout guardrails */
html{scrollbar-gutter:stable}main{width:100%}.studio,.main-column,.panel,.settings,.document-card,.document-layout,.value-grid section,.contact-topics>div{min-width:0}.effect-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.effect-card{height:auto;overflow-wrap:anywhere}.panel-heading{flex-wrap:wrap}.panel-heading>div{min-width:0}#track-title{overflow-wrap:anywhere;line-height:1.5}.range-label{gap:12px;align-items:center}.range-label output{flex-shrink:0}.progress-heading{flex-wrap:wrap}.chain-item .chain-edit{min-width:0;overflow-wrap:anywhere}.file-row{flex-wrap:wrap}.file-details{min-width:80px}.file-row button{flex-shrink:0}.effects-note>span{flex-shrink:0}.site-nav{flex-wrap:wrap}.brand{flex-shrink:0}.site-footer nav a{line-height:1.7}.document-card{overflow-wrap:anywhere}.contact-form input,.contact-form textarea,.contact-form select{max-width:100%}.value-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.title-row>div{min-width:0}.title-row>button{flex-shrink:0}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}#effect-navigation button,.site-nav a,.compare button,.icon-button{min-height:44px}#seek{height:16px}.volume input{height:16px}.toggle-row input{flex-shrink:0}.document-card p,.setting-description{overflow-wrap:anywhere}
@media(max-width:1200px){header .site-nav{order:3;width:100%;margin:4px 0 0;justify-content:center}header .theme-toggle{margin-left:auto}.effect-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.studio{grid-template-columns:minmax(0,1fr) 340px}.value-grid{grid-template-columns:1fr}}
@media(max-width:960px){.studio{grid-template-columns:1fr}.settings{order:2}.effect-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.document-layout{flex-direction:column}.document-toc{position:static;flex:auto;display:flex;flex-wrap:wrap;gap:8px 18px;width:100%;padding:0}.document-toc .eyebrow{width:100%;margin-bottom:0}.document-card{width:100%;max-width:none}.site-footer{flex-wrap:wrap}.site-footer nav{justify-content:flex-start}}
@media(max-width:720px){header{padding:12px 16px;gap:8px}.site-nav{justify-content:flex-start!important}.effect-grid{grid-template-columns:repeat(2,minmax(0,1fr));padding:0 16px 18px;gap:10px}.panel-heading{padding:18px}.title-row{gap:10px}.title-row>button{padding:8px}.document-card{padding:24px 20px}.value-grid{grid-template-columns:1fr}.contact-topics{grid-template-columns:1fr}.transport{flex-wrap:wrap;gap:16px}.transport-left{flex-wrap:wrap}.site-footer{flex-direction:column}.information-page main{padding-left:16px;padding-right:16px}.document-callout{padding:18px}.progress-heading{font-size:14px}}
@media(max-width:380px){.effect-grid{grid-template-columns:1fr}.effect-card{min-height:155px}.title-row{flex-wrap:wrap}.title-row>button{margin-left:auto}.brand .slash{display:none}.sample-row{flex-wrap:wrap;padding:15px 12px}.file-row{margin:0 16px}.wave-wrap{margin:0 16px}.document-card{padding:22px 16px}.about-feature h2{font-size:23px}.page-intro h1{font-size:30px}}
@media(hover:none){.effect-card:hover{transform:none}.effect-card:active{transform:scale(.99)}}
/* Sonic home */
.home-page{--home-ink:#242630;--home-muted:#666b7b;--home-surface:#fff;--home-line:#dfe2eb;--home-accent:#6651df;background:#f5f6fa;color:var(--home-ink)}
html[data-theme=dark] .home-page{--home-ink:#f1f0f7;--home-muted:#aaaabb;--home-surface:#23242e;--home-line:#373845;--home-accent:#b3a4ff;background:#17181e;color:var(--home-ink)}
.home-main{max-width:1440px;padding:0 64px}.home-hero{display:grid;grid-template-columns:1.05fr 1fr;align-items:center;min-height:750px;gap:35px;padding:65px 0 60px}.home-kicker{font-size:13px;letter-spacing:1.6px;font-weight:600;display:flex;gap:10px;align-items:center;margin-bottom:30px;color:var(--home-muted)}.home-kicker>span{width:24px;height:2px;background:var(--home-accent)}
.home-page .hero-copy h1{font-size:clamp(52px,5.9vw,86px);letter-spacing:-4px;line-height:1.07;font-weight:600;color:var(--home-ink);margin-bottom:28px}.hero-copy h1 em{font-style:normal;color:var(--home-accent)}.home-page .hero-copy>p{font-size:18px;line-height:1.8;max-width:430px;color:var(--home-muted)}.home-page .home-start{display:flex;align-items:center;justify-content:space-between;gap:48px;background:#6d56de;color:#fff;border:1px solid #7c68e0;padding:19px 24px;border-radius:12px;font-size:18px;margin-top:32px;box-shadow:0 9px 24px #6145b829;transition:transform .2s,background .2s}.home-page .home-start:hover{background:#7b64e5;transform:translateY(-3px)}.home-start>span{font-size:25px}.home-assurances{display:flex;flex-wrap:wrap;gap:20px;margin-top:20px;color:var(--home-muted);font-size:14px}.home-assurances span+span:before{content:'·';margin-right:20px}
.music-scene{height:600px;position:relative;display:grid;place-items:center;perspective:1100px;isolation:isolate}.music-scene:before{content:'';position:absolute;inset:10% -5%;background:radial-gradient(ellipse,#8b6cf62a,transparent 65%);z-index:-1}.scene-orbit{position:absolute;border:1px solid var(--home-line);border-radius:50%;width:510px;height:510px;transform:rotateX(55deg) rotateZ(-24deg);z-index:-1}.orbit-two{width:620px;height:620px;transform:rotateX(55deg) rotateZ(35deg)}.music-float{animation:music-float 7s ease-in-out infinite;width:330px;max-width:82%;transform-style:preserve-3d}.music-card{padding:22px;border-radius:22px;background:var(--home-surface);border:1px solid var(--home-line);box-shadow:16px 35px 60px #00000024,3px 5px 0 #6f648a20;transform:rotateY(-13deg) rotateZ(7deg) rotateX(7deg);transition:transform .35s ease-out;will-change:transform}.music-card-top{display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:1.4px;color:var(--home-muted);padding-bottom:18px}.record-art{height:240px;border-radius:12px;position:relative;overflow:hidden;background:linear-gradient(145deg,#a59aff,#7463df 45%,#edb09e);display:grid;place-items:center}.record{width:210px;height:210px;border-radius:50%;background:repeating-radial-gradient(circle,#282637 0 1px,#393647 2px 3px,#242332 4px 6px);box-shadow:10px 15px 30px #23153860;display:grid;place-items:center;position:absolute;right:-28px;top:6px;animation:record-spin 24s linear infinite}.record-label{border-radius:50%;width:76px;height:76px;background:#dbb49f;color:#352940;display:grid;align-content:center;text-align:center;font-size:36px;font-weight:600}.record-label span{font-size:8px;letter-spacing:1px}.art-caption{position:absolute;bottom:19px;left:18px;font-size:22px;line-height:1.05;font-weight:700;letter-spacing:-1px;color:#fff}.track-meta{display:flex;justify-content:space-between;align-items:center;margin:20px 0 16px}.track-meta strong{font-size:18px;letter-spacing:-.5px;display:block}.track-meta div>span{display:block;font-size:13px;color:var(--home-muted);margin-top:6px}.track-star{font-size:30px;color:var(--home-accent)}.mini-wave{height:34px;display:flex;gap:3px;align-items:center;overflow:hidden}.mini-wave i{flex:1;min-width:2px;border-radius:3px;background:var(--home-accent);animation:home-bars 1.3s ease-in-out infinite alternate;animation-delay:var(--delay)}.mini-wave i:nth-child(n+26){opacity:.3}.card-timeline{display:flex;justify-content:space-between;font-size:11px;color:var(--home-muted);margin-top:8px}.card-transport{display:flex;align-items:center;justify-content:space-around;margin:14px 0 0;color:var(--home-muted);font-size:20px}.home-page #motion-toggle{border-radius:50%;width:48px;height:48px;background:var(--home-ink);color:var(--home-surface);border:none;padding:0;font-size:18px}.floating-chip{position:absolute;z-index:2;background:var(--home-surface);border:1px solid var(--home-line);box-shadow:0 12px 30px #00000015;padding:15px 18px;border-radius:14px;display:flex;align-items:center;gap:12px;font-size:16px;animation:chip-float 6s ease-in-out infinite}.floating-chip>span{font-size:25px;color:var(--home-accent)}.floating-chip small{color:var(--home-muted);font-size:12px}.chip-top{top:56px;right:0;transform:rotate(7deg)}.chip-bottom{bottom:65px;left:-5px;animation-delay:-3s}.scene-caption{position:absolute;bottom:4px;font-size:11px;letter-spacing:2px;color:var(--home-muted)}.music-scene.motion-paused *{animation-play-state:paused!important}
.effect-ribbon{border-top:1px solid var(--home-line);border-bottom:1px solid var(--home-line);padding:24px 0;display:flex;gap:30px;align-items:center;justify-content:space-between}.effect-ribbon>span{font-size:14px;color:var(--home-muted)}.effect-ribbon>div{display:flex;flex-wrap:wrap;align-items:center;gap:18px;font-size:15px}.effect-ribbon b{font-size:14px;font-weight:400;color:var(--home-accent)}.home-how{display:grid;grid-template-columns:1fr 2fr;gap:50px;padding:80px 0}.home-page .home-how h2{font-size:34px;line-height:1.2;letter-spacing:-1px;margin-top:16px}.home-how ol{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.home-how li>span{font-size:14px;color:var(--home-accent)}.home-how h3{font-size:18px;font-weight:550;margin:18px 0 10px}.home-page .home-how p{font-size:16px;color:var(--home-muted);line-height:1.7}.home-page .site-footer{border-top:1px solid var(--home-line)}
.mode-picker{max-width:790px;padding:36px;width:calc(100% - 32px)}.mode-picker>p{font-size:16px}.mode-picker h2{font-size:30px;line-height:1.2}.mode-options{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:28px}.mode-options>a{display:block;text-decoration:none;color:inherit;border:1px solid var(--border);border-radius:14px;padding:24px;background:#7867dc0a;transition:transform .2s,border-color .2s}.mode-options>a:hover{transform:translateY(-4px);border-color:#9e8ce7}.mode-symbol{display:block;font-size:32px;color:#9e8ce7;margin-bottom:22px}.mode-number{font-size:12px;letter-spacing:1px;color:var(--muted)}.mode-options h3{font-size:24px;margin:12px 0}.mode-options p{font-size:16px;line-height:1.7}.mode-options strong{display:block;margin-top:28px;font-size:14px;color:#8170d6}.editor-mode{display:flex;align-items:center;gap:20px;margin-bottom:28px;flex-wrap:wrap}.editor-mode>a{color:var(--muted);font-size:15px}.editor-mode>span{font-size:15px;color:var(--muted)}.editor-mode>div{display:flex;gap:6px;margin-left:auto}.editor-mode button[aria-pressed=true]{background:#6d56de;color:#fff;border-color:#7e69df}
@keyframes music-float{0%,100%{transform:translateY(-12px) rotate(-1deg)}50%{transform:translateY(13px) rotate(1deg)}}@keyframes chip-float{0%,100%{translate:0 -7px}50%{translate:0 8px}}@keyframes record-spin{to{rotate:360deg}}@keyframes home-bars{to{transform:scaleY(.4)}}
@media(max-width:1100px){.home-main{padding:0 32px}.home-hero{gap:10px;min-height:680px}.music-scene{height:540px}.scene-orbit{width:400px;height:400px}.orbit-two{width:470px;height:470px}.music-float{width:300px}.record-art{height:210px}.chip-top{top:22px;right:-5px}.chip-bottom{bottom:30px;left:0}.effect-ribbon{flex-wrap:wrap;gap:16px}.home-how{grid-template-columns:1fr;gap:30px}.home-page .home-how h2 br{display:none}}
@media(max-width:760px){.home-main{padding:0 24px}.home-hero{grid-template-columns:1fr;padding:48px 0 35px;gap:30px}.hero-copy{max-width:550px}.home-page .hero-copy h1{font-size:64px;letter-spacing:-3px}.home-kicker{font-size:11px;letter-spacing:1px}.music-scene{max-width:440px;width:100%;justify-self:center;height:540px;overflow:hidden}.scene-orbit{width:350px;height:350px}.orbit-two{width:440px;height:440px}.chip-top{right:5px}.chip-bottom{left:0}.music-float{max-width:76%;width:300px}.home-how{padding:48px 0}.home-how ol{grid-template-columns:1fr;gap:28px}.home-how h3{margin-top:10px}.mode-options{grid-template-columns:1fr}.mode-picker{padding:24px}.mode-picker h2{font-size:25px}.editor-mode>div{margin-left:0;flex-wrap:wrap}.home-assurances{gap:12px;font-size:12px}.home-assurances span+span:before{margin-right:12px}.effect-ribbon>div{gap:12px;line-height:1.8}}
@media(max-width:380px){.home-main{padding:0 18px}.home-page .hero-copy h1{font-size:53px}.music-scene{height:510px}.music-card{padding:16px}.track-meta strong{font-size:16px}.floating-chip{padding:10px;font-size:14px;gap:8px}.floating-chip small{font-size:11px}.home-page .hero-copy>p{font-size:17px}}
@media(prefers-reduced-motion:reduce){.music-scene *{animation:none!important}.music-card{will-change:auto;transition:none}.home-page .home-start,.mode-options>a{transition:none}}
.music-scene{overflow:hidden}.home-hero>*{min-width:0}
@media(min-width:761px) and (max-width:900px){.home-hero{grid-template-columns:1fr;gap:24px;padding:48px 0}.hero-copy{max-width:590px}.music-scene{max-width:500px;width:100%;justify-self:center}.home-page .hero-copy h1{font-size:72px}.home-how ol{grid-template-columns:1fr}.mode-picker{max-height:calc(100dvh - 32px);overflow-y:auto}}
.mode-picker{max-height:calc(100dvh - 32px);overflow-y:auto}
@media(min-width:721px) and (max-width:900px){.home-main{padding:0 28px}.home-hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;padding:35px 0;min-height:650px}.home-page .hero-copy h1{font-size:52px;letter-spacing:-2.5px}.home-page .hero-copy>p{font-size:16px;line-height:1.75}.home-kicker{font-size:10px;letter-spacing:.8px}.music-scene{height:550px;width:100%;max-width:none}.music-float{width:270px;max-width:88%}.music-card{padding:18px}.record-art{height:205px}.track-meta strong{font-size:16px}.floating-chip{padding:11px;font-size:14px;gap:8px}.chip-top{top:22px;right:0}.chip-bottom{bottom:32px;left:0}.home-assurances{gap:8px;font-size:12px}.home-assurances span+span:before{margin-right:8px}.home-page .home-start{font-size:16px;padding:16px 20px;gap:30px}}
.music-scene.tab-hidden *{animation-play-state:paused!important}
/* Effect chooser and focused studios */
.effect-chooser .page-intro{max-width:780px}.chooser-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-bottom:40px}.chooser-card{display:flex;flex-direction:column;align-items:flex-start;text-decoration:none;color:inherit;background:#fff;border:1px solid var(--border);border-radius:16px;padding:28px;transition:transform .2s,border-color .2s,background .2s;min-width:0}.chooser-card:hover{transform:translateY(-4px);border-color:#9c8bdd}.chooser-symbol{font-size:32px;color:#7760d4;background:#7966d214;border-radius:12px;min-width:58px;height:58px;display:grid;place-items:center;margin-bottom:24px}.chooser-card h2{font-size:22px;margin-bottom:12px;line-height:1.3}.chooser-card p{font-size:17px;line-height:1.75;margin-bottom:24px}.chooser-open{font-size:14px;color:#7964d3;margin-top:auto;font-weight:550}.chooser-card:nth-child(4n+2) .chooser-symbol{color:#287f8c;background:#28828c14}.chooser-card:nth-child(4n+3) .chooser-symbol{color:#c27a37;background:#ba843014}.chooser-combine{display:flex;align-items:center;justify-content:space-between;gap:24px;border:1px solid var(--border);border-radius:14px;padding:28px;margin:30px 0 50px}.chooser-combine h2{font-size:22px;margin-bottom:10px}.chooser-combine p{font-size:17px}.chooser-combine .page-action{margin:0;flex-shrink:0}
.dedicated-effect .effects,.dedicated-effect .chain-section,.dedicated-effect #effect-navigation,.dedicated-effect #add,.dedicated-effect .editor-mode>div,.dedicated-effect #mode-description{display:none}.dedicated-effect .settings{position:sticky;top:24px}.dedicated-effect .title-row{border-bottom:1px solid var(--border);padding-bottom:30px}.dedicated-effect .title-row h1{font-size:46px;line-height:1.15}.dedicated-effect .title-row p{font-size:18px;max-width:700px}.dedicated-effect .main-column{gap:24px}.dedicated-effect .studio{grid-template-columns:minmax(0,1fr) 380px}.effect-guide{margin:64px 0 45px;border-top:1px solid var(--border);padding-top:48px}.guide-intro{max-width:900px;margin-bottom:36px}.guide-intro h2{font-size:34px;line-height:1.2;margin-bottom:22px;letter-spacing:-1px}.effect-guide p{font-size:18px;line-height:1.85;color:var(--muted)}.guide-layout{display:grid;grid-template-columns:240px minmax(0,1fr);gap:48px}.guide-toc{display:flex;flex-direction:column;gap:8px;align-self:start;position:sticky;top:24px}.guide-toc a{font-size:15px;line-height:1.6;text-decoration:none;color:var(--muted);padding:10px 12px;border-left:2px solid var(--border)}.guide-toc a:hover{color:#8c76df;border-color:#8c76df}.guide-content>section{margin-bottom:34px;padding-bottom:34px;border-bottom:1px solid var(--border);scroll-margin-top:24px}.guide-content h2{font-size:25px;line-height:1.35;margin-bottom:18px}.parameter-guide{display:grid;gap:16px}.parameter-guide>section{border:1px solid var(--border);padding:24px;border-radius:12px;background:#7966d207}.parameter-guide h3{margin:0 0 8px;font-size:20px}.parameter-range{display:block;color:#806acb;font-size:14px;line-height:1.7;margin-bottom:12px}html[data-theme=dark] .chooser-card{background:#22232b}html[data-theme=dark] .chooser-card p{color:#aaaabb}html[data-theme=dark] .chooser-card:hover{background:#2a2936}html[data-theme=dark] .chooser-open,html[data-theme=dark] .parameter-range{color:#b5a1ed}html[data-theme=dark] .chooser-symbol{color:#b5a1ed}html[data-theme=dark] .chooser-card:nth-child(4n+2) .chooser-symbol{color:#80c7ce}html[data-theme=dark] .chooser-card:nth-child(4n+3) .chooser-symbol{color:#dfb277}
@media(max-width:1100px){.chooser-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dedicated-effect .studio{grid-template-columns:minmax(0,1fr) 340px}.guide-layout{grid-template-columns:200px minmax(0,1fr);gap:28px}}
@media(max-width:960px){.dedicated-effect .studio{grid-template-columns:1fr}.dedicated-effect .settings{position:static}.guide-layout{grid-template-columns:1fr}.guide-toc{position:static;flex-direction:row;flex-wrap:wrap}.chooser-combine{flex-wrap:wrap}}
@media(max-width:600px){.chooser-grid{grid-template-columns:1fr;gap:14px}.chooser-card{padding:24px}.chooser-symbol{margin-bottom:18px}.dedicated-effect .title-row h1{font-size:34px}.effect-guide{margin-top:40px;padding-top:30px}.guide-intro h2{font-size:29px}.guide-content h2{font-size:23px}.effect-guide p{font-size:17px}.parameter-guide>section{padding:20px}.guide-toc a{font-size:14px}.chooser-combine{padding:24px}}
@media(prefers-reduced-motion:reduce){.chooser-card{transition:none}}

/* Homepage editorial guide: readable, crawlable content in both themes. */
.home-editor-guide{margin:24px 0 64px;padding:48px 0;border-top:1px solid var(--border);display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:64px;align-items:start}
.seo-guide-heading{position:sticky;top:32px;min-width:0}.seo-guide-heading h2{display:block;font-size:clamp(30px,3.3vw,46px);line-height:1.15;letter-spacing:-1.6px;margin:18px 0}.seo-guide-heading>p{font-size:18px;line-height:1.7;color:var(--muted)}
.seo-guide-copy{min-width:0}.seo-guide-copy section+section{margin-top:36px;padding-top:32px;border-top:1px solid var(--border)}.seo-guide-copy h3{font-size:23px;line-height:1.35;letter-spacing:-.4px;margin:0 0 16px;font-weight:600}.seo-guide-copy p{font-size:18px;line-height:1.85;color:var(--muted)}.seo-guide-copy p+p{margin-top:16px}.seo-guide-copy a{color:inherit;text-decoration-color:#8c76e7;text-decoration-thickness:2px;text-underline-offset:4px}.seo-guide-copy a:hover{color:#9a82ed}
@media(max-width:900px){.home-editor-guide{grid-template-columns:1fr;gap:32px}.seo-guide-heading{position:static;max-width:650px}.seo-guide-copy{max-width:760px}.home-hero .hero-copy h1{overflow-wrap:normal}}
@media(max-width:600px){.home-editor-guide{padding-top:32px;margin-bottom:24px;gap:24px}.seo-guide-copy h3{font-size:22px}.seo-guide-copy p{font-size:17px;line-height:1.8}.seo-guide-heading h2{letter-spacing:-1px}}

/* Accessible homepage FAQ with animated height and a no-JS native fallback. */
.home-faq{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:64px;border-top:1px solid var(--border);padding:48px 0 64px}.faq-heading{min-width:0}.faq-heading h2{display:block;font-size:clamp(30px,3.3vw,46px);line-height:1.15;letter-spacing:-1.5px;margin:18px 0}.faq-heading p{font-size:18px;line-height:1.7;color:var(--muted)}.faq-list{min-width:0}.faq-item{border-bottom:1px solid var(--border)}.faq-item:first-child{border-top:1px solid var(--border)}.faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:23px 4px;cursor:pointer;list-style:none;border-radius:6px}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary::marker{content:''}.faq-item summary:hover{background:rgba(124,105,205,.06)}.faq-item summary:focus-visible{outline:3px solid #8c76e7;outline-offset:4px}.faq-item h3{font-size:20px;line-height:1.45;margin:0;font-weight:550;letter-spacing:-.25px}.faq-icon{width:26px;height:26px;flex:0 0 26px;position:relative;border:1px solid var(--border);border-radius:50%}.faq-icon::before,.faq-icon::after{content:'';position:absolute;left:7px;top:11px;width:10px;height:2px;background:currentColor;transition:transform .25s ease}.faq-icon::after{transform:rotate(90deg)}.faq-item[open] .faq-icon::after{transform:rotate(0deg)}.faq-answer{overflow:hidden}.faq-answer-inner{padding:0 36px 24px 4px}.faq-answer p{font-size:18px;line-height:1.8;color:var(--muted)}.faq-answer a{color:inherit;text-decoration-color:#8c76e7;text-decoration-thickness:2px;text-underline-offset:4px}.faq-answer a:hover{color:#9a82ed}
@media(max-width:900px){.home-faq{grid-template-columns:1fr;gap:28px}.faq-heading{max-width:650px}}
@media(max-width:600px){.home-faq{gap:20px;padding:32px 0}.faq-item summary{padding:20px 4px;gap:14px}.faq-item h3{font-size:18px}.faq-answer p{font-size:17px;line-height:1.75}.faq-answer-inner{padding-right:4px}.faq-heading h2{letter-spacing:-1px}}
@media(prefers-reduced-motion:reduce){.faq-icon::before,.faq-icon::after{transition:none}}

/* Shared link language: color identifies navigation, without underlines. */
:root{--link-color:#5b3bb6;--link-hover:#432393}html[data-theme=dark]{--link-color:#b9a1ff;--link-hover:#d3c2ff}
html body a,html body a:hover,html body a:focus,html body a:active,html body a:visited{text-decoration:none!important}
html body a:any-link{color:var(--link-color)!important}
html body a:any-link:hover,html body a:any-link:focus-visible{color:var(--link-hover)!important}
html body a.primary,html body a.page-action,html body a.primary:hover,html body a.page-action:hover{color:#fff!important}
html body .dropzone u{text-decoration:none;color:var(--link-color)}

.site-logo{display:block;width:40px;height:40px;flex:0 0 40px;object-fit:contain;border-radius:7px}.footer-brand{display:inline-flex;align-items:center;gap:10px}.footer-brand .site-logo{width:32px;height:32px;flex-basis:32px}

/* A clear return action on the four information pages. */
html body a.studio-return{display:inline-flex;align-items:center;gap:12px;padding:11px 18px;margin-bottom:28px;border:1px solid #d9cff0;border-radius:12px;background:#eee8fa;color:#5b3bb6!important;font-size:16px;line-height:1.4;font-weight:600;box-shadow:0 3px 10px #34255c08;transition:background .18s,border-color .18s,transform .18s,box-shadow .18s}
.studio-return-icon{font-size:21px;line-height:1}.studio-return:hover{transform:translateY(-2px);box-shadow:0 5px 16px #34255c14}html body a.studio-return:hover{background:#e3d9f6;border-color:#bca7e4;color:#432393!important}html[data-theme=dark] body a.studio-return{background:#30283f;border-color:#514065;color:#d2baff!important}html[data-theme=dark] body a.studio-return:hover{background:#3b2f4e;border-color:#8c6eb0;color:#e3d1ff!important}
@media(prefers-reduced-motion:reduce){html body a.studio-return{transition:none}.studio-return:hover{transform:none}}

.export-line #output-format{min-width:100px;padding:9px 12px;border:1px solid var(--border);border-radius:8px;background:var(--surface,#fff);color:inherit;font:inherit}html[data-theme=dark] .export-line #output-format{background:#272831;color:#eee}

.error-scene{min-height:65dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:48px 20px 72px;gap:22px}.error-art{position:relative;padding:16px 32px;border-radius:30px;background:linear-gradient(145deg,#a99be522,#65b6bd18);border:1px solid var(--border);box-shadow:0 20px 60px #32234e0a}.error-art>span{display:block;font-size:clamp(80px,15vw,144px);font-weight:650;line-height:1.1;letter-spacing:-.06em;color:var(--link-color)}.error-wave{height:36px;display:flex;align-items:center;justify-content:center;gap:7px}.error-wave i{width:5px;height:12px;border-radius:5px;background:#9a87d0;animation:error-beat 1.7s ease-in-out infinite alternate;animation-delay:calc(var(--bar)*-.17s)}.error-scene h1{font-size:clamp(28px,5vw,44px);margin:8px 0 0;letter-spacing:-.03em}.error-scene>p{max-width:570px;font-size:18px;line-height:1.8}.error-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:18px;margin-top:8px}.error-home{padding:12px}.error-actions button{background:transparent;color:inherit}@keyframes error-beat{to{height:30px;opacity:.5}}@media(prefers-reduced-motion:reduce){.error-wave i{animation:none;height:20px}}@media(max-width:420px){.error-actions{flex-direction:column;width:100%}.error-actions .page-action{width:100%;text-align:center}}

@media(max-width:960px){.studio>.player{order:3;width:100%;min-width:0}.studio>.settings{order:2}.studio>.main-column{order:1}.studio .settings{scroll-margin-top:calc(var(--site-header-height,150px) + 20px)}}