.synth-lab-app{color-scheme:dark;--bg:#0b111c;--panel:#151e2d;--line:#2a3950;--txt:#edf4ff;--muted:#a5b5ca;--accent:#36d5c3}
.synth-lab-app *{box-sizing:border-box}
.synth-lab-app{margin:0;background:linear-gradient(140deg,#0b111c,#101c30);color:var(--txt);font:16px/1.6 system-ui,-apple-system,Segoe UI,sans-serif}
.synth-lab-app header,.synth-lab-app main,.synth-lab-app footer{max-width:1120px;margin:auto;padding:24px}
.synth-lab-app header{padding-top:55px}
.synth-lab-app h1{font-size:clamp(2rem,5vw,3.7rem);line-height:1.1;margin:10px 0}
.synth-lab-app h2{font-size:1.65rem;margin:0 0 16px}
.synth-lab-app h3{margin:0 0 8px}
.synth-lab-app p{color:var(--muted)}
.synth-lab-app .eyebrow{color:var(--accent);font-weight:700;letter-spacing:.15em;text-transform:uppercase;font-size:.75rem}
.synth-lab-app .lead{max-width:750px;font-size:1.13rem}
.synth-lab-app .nav{display:flex;gap:9px;flex-wrap:wrap;margin:25px 0}
.synth-lab-app .nav a,.synth-lab-app .pill{border:1px solid var(--line);padding:7px 13px;border-radius:30px;color:var(--txt);text-decoration:none;background:#172337}
.synth-lab-app .panel{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:clamp(18px,3vw,30px);margin:22px 0;box-shadow:0 15px 40px #0002}
.synth-lab-app .grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.synth-lab-app .four{grid-template-columns:repeat(4,minmax(0,1fr))}
.synth-lab-app .sub{background:#101a29;border:1px solid #2b3b51;border-radius:14px;padding:17px}
.synth-lab-app .sub p{margin:6px 0}
.synth-lab-app .control{display:grid;grid-template-columns:105px 1fr 76px;gap:14px;align-items:center;margin:14px 0}
.synth-lab-app .control output{text-align:right;font-variant-numeric:tabular-nums;color:var(--accent)}
.synth-lab-app input[type=range]{width:100%;accent-color:var(--accent);cursor:pointer}
.synth-lab-app button,.synth-lab-app select{font:inherit;background:#1b2b40;color:var(--txt);border:1px solid #3c5269;border-radius:10px;padding:9px 14px;cursor:pointer}
.synth-lab-app button:hover{border-color:var(--accent)}
.synth-lab-app button.active{background:#14554f;border-color:var(--accent)}
.synth-lab-app .buttons{display:flex;gap:8px;flex-wrap:wrap;margin:15px 0}
.synth-lab-app .hint{font-size:.88rem;color:var(--muted)}
.synth-lab-app canvas{display:block;width:100%;height:200px;border-radius:12px;background:#0b1522;border:1px solid var(--line)}
.synth-lab-app table{width:100%;border-collapse:collapse}
.synth-lab-app td,.synth-lab-app th{border-bottom:1px solid var(--line);padding:10px;text-align:left;vertical-align:top}
.synth-lab-app th{color:var(--accent)}
.synth-lab-app td{color:var(--muted)}
.synth-lab-app td:first-child{color:var(--txt);font-weight:600}
.synth-lab-app .tablewrap{overflow:auto}
.synth-lab-app .keyboard{display:flex;gap:7px;flex-wrap:wrap;margin:16px 0}
.synth-lab-app .key{min-width:52px;height:64px;background:#d9e6e8;color:#162334;font-weight:700}
.synth-lab-app .key:active,.synth-lab-app .key.pressed{background:var(--accent)}
.synth-lab-app .status{color:var(--accent);min-height:25px}
.synth-lab-app footer{padding-bottom:60px;color:var(--muted)}
.synth-lab-app{display:block;isolation:isolate;width:100%;max-width:100%;padding-bottom:20px}.synth-lab-app header,.synth-lab-app main{box-sizing:border-box}.synth-lab-app button{min-height:38px}.synth-lab-app .nav a{color:var(--txt)}
