:root{
  --bg:#070a0f;--panel:#10151d;--panel2:#151b25;--panel3:#0b1017;--line:#293342;--line2:#39475c;
  --text:#edf5ff;--muted:#8190a3;--blue:#5bd2ff;--violet:#9271ff;--cyan:#88f2ff;--red:#ff445d;--green:#58e4ba;
  --metal1:#1d2430;--metal2:#0d1219;--shadow:0 22px 70px rgba(0,0,0,.48);
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 72% 0,rgba(91,210,255,.08),transparent 34rem),radial-gradient(circle at 22% 35%,rgba(146,113,255,.07),transparent 38rem),var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.5}button,select,input{font:inherit}.site-shell{width:min(1280px,calc(100% - 36px));margin:auto}.site-header{position:sticky;top:0;z-index:20;border-bottom:1px solid #222b38;background:rgba(7,10,15,.91);backdrop-filter:blur(14px)}.nav-row{min-height:70px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:11px;color:#fff;text-decoration:none}.brand-mark{display:grid;place-items:center;width:34px;height:34px;border:1px solid #55718b;border-radius:8px;background:linear-gradient(145deg,#263344,#0d1219);font-weight:950;font-size:12px;box-shadow:0 0 20px rgba(91,210,255,.12)}.brand strong,.brand small{display:block;line-height:1.05;letter-spacing:.11em}.brand strong{font-size:12px}.brand small{font-size:8px;color:#728297;margin-top:4px}.site-nav{display:flex;gap:24px}.site-nav a{color:#9aa8ba;text-decoration:none;font-size:12px;font-weight:750}.site-nav a:hover{color:#fff}.intro{padding:58px 0 36px}.intro-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:50px;align-items:end}.eyebrow{margin:0 0 10px;color:var(--blue);font-size:10px;font-weight:900;letter-spacing:.22em;text-transform:uppercase}.intro h1{font-size:clamp(52px,7vw,88px);line-height:.92;letter-spacing:-.055em;margin:0}.intro h1 span{color:#cfd8ff;text-shadow:0 0 28px rgba(146,113,255,.18)}.tagline{font-size:22px;font-weight:780;margin:15px 0 7px}.intro-copy{max-width:780px;color:#95a2b5;font-size:16px}.intro-status{border:1px solid #263346;border-radius:14px;overflow:hidden;background:linear-gradient(145deg,rgba(26,35,48,.8),rgba(10,14,20,.85));box-shadow:var(--shadow)}.intro-status div{display:flex;justify-content:space-between;gap:18px;padding:13px 16px;border-bottom:1px solid #202b39}.intro-status div:last-child{border-bottom:0}.intro-status span{font-size:8px;letter-spacing:.16em;color:#627187;font-weight:900}.intro-status strong{font-size:11px;color:#d9e6f5;text-align:right}
.synth-wrap{padding:18px 18px 82px}.synth-shell{max-width:1480px;margin:auto;border:1px solid #3b4758;border-radius:16px;overflow:hidden;background:linear-gradient(180deg,#151c27,#090d13 72%);box-shadow:0 45px 120px rgba(0,0,0,.62),inset 0 1px rgba(255,255,255,.05);position:relative}.synth-shell:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.16;background:repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 1px,transparent 1px 4px),linear-gradient(118deg,transparent 0 47%,rgba(255,255,255,.04) 48%,transparent 49%)}.synth-topbar{position:relative;z-index:1;min-height:92px;padding:14px 18px;display:grid;grid-template-columns:1.1fr 1fr auto auto;gap:18px;align-items:center;border-bottom:1px solid #38485d;background:linear-gradient(180deg,#252f3e 0,#141b25 45%,#0d131b 100%);box-shadow:inset 0 1px rgba(255,255,255,.08),0 8px 22px rgba(0,0,0,.24)}.synth-logo{display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:center}.synth-logo .cs-chip{grid-row:1/3;display:grid;place-items:center;width:58px;height:48px;border-radius:8px;border:1px solid #4a607b;background:#10161f;color:#9feaff;font-size:8px;font-weight:950;letter-spacing:.1em}.synth-logo strong{font-size:18px;letter-spacing:.08em}.synth-logo em{font-style:normal;color:#8be4ff}.synth-logo small{color:#65768b;font-size:8px;letter-spacing:.14em}.preset-box label,.io-box label,.control-label{display:block;color:#66768b;font-weight:900;font-size:8px;letter-spacing:.15em;margin-bottom:6px}.preset-box select,.io-box select{width:100%;height:38px;color:#dff7ff;background:#0a1018;border:1px solid #354860;border-radius:7px;padding:0 10px;font-size:11px;font-weight:800;letter-spacing:.05em;outline:none}.preset-box select:focus,.io-box select:focus{border-color:#5dcdf7;box-shadow:0 0 0 2px rgba(91,210,255,.12)}.top-status{display:flex;gap:8px;align-items:stretch}.status-readout,.clip-block{min-width:74px;padding:8px 10px;border:1px solid #324156;border-radius:7px;background:#0b1119}.status-readout span{display:block;font-size:7px;color:#607188;font-weight:900;letter-spacing:.14em}.status-readout strong{display:block;margin-top:3px;font-size:9px;color:#9fb5cc}.clip-block{min-width:54px;text-align:center}.clip-block strong{display:block;color:#7a8697;font-size:7px;letter-spacing:.13em;margin-top:3px}.clip-led{display:block;width:11px;height:11px;margin:0 auto;border-radius:50%;background:#351923;border:1px solid #6d2a39;box-shadow:inset 0 0 7px #09090a}.clip-led.active{background:#ff334e;border-color:#ff7185;box-shadow:0 0 18px rgba(255,51,78,.85),inset 0 0 4px #fff}.enable-audio{height:48px;border:1px solid #7fdfff;border-radius:8px;padding:0 17px;background:linear-gradient(180deg,#203747,#101b26);color:#a9efff;font-size:10px;font-weight:950;letter-spacing:.1em;cursor:pointer;box-shadow:0 0 26px rgba(91,210,255,.12)}.enable-audio:hover{background:linear-gradient(180deg,#2a465a,#132431)}.enable-audio.enabled{border-color:#3b7c6c;color:#6df3c3;box-shadow:none}
.synth-body{position:relative;z-index:1;display:grid;grid-template-columns:1.08fr 1.14fr .78fr;gap:1px;background:#2b3543}.module{background:linear-gradient(155deg,#111823,#0b1017);padding:16px;min-width:0}.module-title{height:35px;display:grid;grid-template-columns:28px auto 1fr;gap:7px;align-items:center;border-bottom:1px solid #283444;margin-bottom:14px}.module-title>span{width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:#121d29;border:1px solid #36516a;color:#68d8ff;font-size:8px;font-weight:950}.module-title strong{font-size:10px;letter-spacing:.13em}.module-title small{justify-self:end;color:#536378;font-size:7px;letter-spacing:.12em}.osc-row{display:grid;grid-template-columns:54px 1fr;grid-template-areas:"label display" "waves waves" "dials dials";gap:9px 12px;padding:12px;border:1px solid #263344;border-radius:10px;background:linear-gradient(160deg,#121b26,#0a1017);margin-bottom:10px;box-shadow:inset 0 1px rgba(255,255,255,.03)}.osc-row:last-child{margin-bottom:0}.osc-label{grid-area:label;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:7px}.osc-label strong{font-size:9px;letter-spacing:.08em}.osc-dot{width:7px;height:7px;border-radius:50%;background:#56e3ba;box-shadow:0 0 12px rgba(86,227,186,.6)}.wave-display{grid-area:display;width:100%;height:64px;border:1px solid #263a4e;border-radius:6px;background:#050b10;box-shadow:inset 0 0 30px rgba(47,126,170,.08)}.wave-buttons{grid-area:waves;display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.wave-buttons button,.segmented button{border:1px solid #29394c;background:#0b121b;color:#62758d;border-radius:5px;height:26px;font-size:7px;font-weight:900;letter-spacing:.08em;cursor:pointer}.wave-buttons button.active,.segmented button.active{color:#b8f5ff;border-color:#4c9aba;background:linear-gradient(180deg,#183344,#102532);box-shadow:inset 0 0 14px rgba(91,210,255,.12),0 0 11px rgba(91,210,255,.08)}.dial-pair{grid-area:dials;display:grid;grid-template-columns:1fr 1fr;gap:14px;justify-items:center}.dial{position:relative;width:74px;display:grid;justify-items:center;gap:4px;user-select:none}.dial>span:first-child{font-size:7px;color:#7e8ca0;font-weight:900;letter-spacing:.1em}.dial-face{width:48px;height:48px;border-radius:50%;position:relative;background:conic-gradient(from 225deg,#5bd2ff 0deg var(--arc,0deg),#202936 var(--arc,0deg) 270deg,#121821 270deg);box-shadow:0 6px 12px rgba(0,0,0,.45),0 0 0 1px #405064,inset 0 0 0 5px #10161f}.dial-face:before{content:"";position:absolute;inset:6px;border-radius:50%;background:radial-gradient(circle at 34% 26%,#3c4756 0 8%,#202833 34%,#0c1118 72%);border:1px solid #415064}.dial-face:after{content:"";position:absolute;width:2px;height:13px;background:#dff9ff;left:calc(50% - 1px);top:8px;border-radius:2px;transform-origin:1px 16px;transform:rotate(var(--needle,-135deg));box-shadow:0 0 5px #5bd2ff}.dial input{position:absolute;left:10px;top:15px;width:54px;height:55px;opacity:0;cursor:ew-resize}.dial output{font-size:8px;color:#a8bad0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;white-space:nowrap}.dial.large{width:94px}.dial.large .dial-face{width:64px;height:64px}.dial.large .dial-face:before{inset:7px}.dial.large .dial-face:after{height:17px;top:10px;transform-origin:1px 22px}.dial.large input{left:10px;top:14px;width:74px;height:73px}.scope-frame{height:142px;border:1px solid #304258;border-radius:8px;background:#05090e;position:relative;overflow:hidden;box-shadow:inset 0 0 35px rgba(58,161,219,.09)}#scopeCanvas{width:100%;height:100%;display:block;position:relative;z-index:2}.scope-grid{position:absolute;inset:0;background:linear-gradient(rgba(91,210,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(91,210,255,.055) 1px,transparent 1px);background-size:32px 28px;z-index:1}.scope-label{position:absolute;right:8px;top:7px;z-index:3;color:#39556d;font-size:7px;font-weight:900;letter-spacing:.14em}.control-bank{padding:16px 0;border-bottom:1px solid #253142}.control-bank:last-child{border-bottom:0}.bank-title{font-size:8px;color:#607289;font-weight:900;letter-spacing:.14em;margin-bottom:12px}.dial-grid{display:grid;align-items:start;justify-items:center}.dial-grid.two{grid-template-columns:1fr 1fr}.dial-grid.four{grid-template-columns:repeat(4,1fr)}.voice-box{padding:8px 0 18px}.segmented{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.segmented button{height:34px}.performance-dials{display:grid;grid-template-columns:1fr 1fr;justify-items:center;padding:13px 0 20px;border-top:1px solid #253142;border-bottom:1px solid #253142}.meter-panel{padding:20px 0;display:grid;grid-template-columns:1fr 20px;grid-template-rows:auto auto;gap:7px 8px}.meter-scale{grid-column:1;display:flex;justify-content:space-between;color:#4e6075;font-size:7px;font-family:ui-monospace,monospace}.meter-track{grid-column:1;height:17px;border:1px solid #314158;border-radius:4px;background:#05090e;position:relative;overflow:hidden}.meter-fill{height:100%;width:0%;background:linear-gradient(90deg,#48caa5 0 65%,#eac158 82%,#ff445d 95%);transition:width 45ms linear}.meter-peak{position:absolute;top:0;bottom:0;width:2px;left:0;background:#e9f7ff;opacity:.8}.meter-readout{grid-column:1/3;display:flex;justify-content:space-between;color:#63758b;font-size:8px;font-weight:900;letter-spacing:.1em}.meter-readout strong{color:#aabdd2;font-family:ui-monospace,monospace}.io-box{border-top:1px solid #253142;padding-top:15px}.io-box select{height:34px;font-size:9px;margin-bottom:9px}.utility-button{width:100%;height:34px;border:1px solid #3b4a5f;border-radius:6px;background:#111a25;color:#8ca0b8;font-size:8px;font-weight:900;letter-spacing:.08em;cursor:pointer}.utility-button:hover{border-color:#59718e;color:#c8d9eb}.utility-button.on{color:#71e7bd;border-color:#3c7b68}.io-box p{color:#4f5f73;font-size:8px;margin:8px 0 0}.keyboard-zone{position:relative;z-index:1;border-top:1px solid #36465a;background:linear-gradient(180deg,#111823,#080c12);padding:12px 16px 17px}.keyboard-info{display:flex;justify-content:space-between;gap:18px;align-items:center;color:#53657a;font-size:8px;letter-spacing:.08em;margin-bottom:9px}.keyboard-info strong{color:#7189a4}.keyboard{height:176px;display:flex;position:relative;border:1px solid #303c4c;border-radius:7px;overflow:hidden;background:#070a0e;touch-action:none}.key.white{position:relative;flex:1;background:linear-gradient(180deg,#e9eef3,#bfc7d0);border-right:1px solid #66717e;box-shadow:inset 0 -8px 18px rgba(55,68,82,.18);z-index:1}.key.white:last-child{border-right:0}.key.black{position:absolute;top:0;width:4.15%;height:62%;background:linear-gradient(180deg,#18212c,#05070a 70%);border:1px solid #2d3949;border-radius:0 0 4px 4px;z-index:3;box-shadow:0 7px 11px rgba(0,0,0,.55)}.key.active{background:linear-gradient(180deg,#a5ecff,#6cc8e7)!important;box-shadow:inset 0 0 24px rgba(78,196,231,.45),0 0 16px rgba(91,210,255,.24)!important}.key.black.active{background:linear-gradient(180deg,#6e63c9,#1a2245 80%)!important}.key-label{position:absolute;bottom:7px;left:50%;transform:translateX(-50%);font-size:7px;color:#5d6876;font-weight:850;pointer-events:none}.key.black .key-label{color:#7787a0;bottom:6px}.synth-footer{position:relative;z-index:1;min-height:36px;padding:0 17px;display:flex;align-items:center;justify-content:space-between;gap:18px;background:#070b10;border-top:1px solid #273343;color:#45566a;font-size:7px;letter-spacing:.12em}.details{padding:78px 0;border-top:1px solid #1c2632}.details-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.details article{padding:24px;border:1px solid #253142;border-radius:13px;background:linear-gradient(145deg,#101722,#0a0f16)}.details article>span{color:#5bd2ff;font-size:9px;font-weight:950}.details h2{font-size:24px;margin:10px 0}.details p{margin:0;color:#7f8da0;font-size:14px}.browser-note{padding:22px 0 40px;color:#657489;font-size:12px}.browser-note strong{color:#9bb0c8}
@media(max-width:1180px){.synth-body{grid-template-columns:1fr 1fr}.performance{grid-column:1/-1}.performance{display:grid;grid-template-columns:1fr 1fr 1fr;column-gap:22px}.performance .module-title{grid-column:1/-1}.voice-box{grid-column:1}.performance-dials{grid-column:2;border-top:0}.meter-panel{grid-column:3;padding-top:8px}.io-box{grid-column:1/-1}.synth-topbar{grid-template-columns:1fr 1fr}.top-status{justify-self:start}.enable-audio{justify-self:end;width:180px}.intro-grid{grid-template-columns:1fr}.intro-status{max-width:720px}}
@media(max-width:760px){.site-nav{display:none}.synth-wrap{padding-left:7px;padding-right:7px}.synth-topbar{grid-template-columns:1fr}.synth-logo{grid-template-columns:auto 1fr}.preset-box,.top-status,.enable-audio{width:100%;justify-self:stretch}.top-status{display:grid;grid-template-columns:1fr 1fr auto}.synth-body{grid-template-columns:1fr}.performance{grid-column:auto;display:block}.performance .module-title{grid-column:auto}.performance-dials,.meter-panel,.io-box,.voice-box{grid-column:auto}.performance-dials{border-top:1px solid #253142}.module-title small{display:none}.dial-grid.four{grid-template-columns:repeat(2,1fr);gap:14px}.keyboard{height:135px;min-width:700px}.keyboard-zone{overflow-x:auto}.keyboard-info{min-width:700px}.details-grid{grid-template-columns:1fr}.intro{padding-top:40px}.synth-footer{flex-wrap:wrap;padding:9px 13px}.synth-footer span{width:100%}}
