:root{--paper:#f9f3e6;--ink:#101211;--orange:#ff861c;--rule:#b4aea6;font:14px "Helvetica Neue",Arial,sans-serif;color:var(--ink);background:var(--paper)}*{box-sizing:border-box}body{margin:0;background:var(--paper)}.editor{width:min(1440px,100vw);min-height:800px;margin:auto;padding:0 18px;display:grid;grid-template-rows:78px 132px 254px 44px 258px 34px}.topbar{display:flex;align-items:center;border-bottom:1px solid var(--rule);position:relative}.brand{width:220px;display:flex;flex-direction:column;gap:3px}.brand small{font-size:12px;letter-spacing:.12em;opacity:.6}.brand strong{font-size:24px;letter-spacing:.14em}.transport{display:flex;align-items:center;gap:2px;margin-left:auto}.transport button,footer button{min-width:32px;height:32px;padding:0 10px;background:transparent;border:0;letter-spacing:.1em}.transport button:hover,footer button:hover{color:var(--orange)}#play{border:1px solid var(--ink);padding:0 13px}.transport input{width:58px;border:0;border-bottom:1px solid var(--rule);background:transparent;padding:7px;text-align:center}.status{width:175px;margin-left:18px;font-size:10px;opacity:.55}.wave{position:relative;border-bottom:1px solid var(--rule)}#waveform{width:100%;height:100%}.wave span{position:absolute;right:12px;top:8px;font-size:10px;letter-spacing:.12em;opacity:.55}.primary{display:grid;grid-template-columns:repeat(6,1fr);border-bottom:1px solid var(--rule)}.primary-control{position:relative;border-right:1px solid var(--rule);min-height:226px}.primary-control:last-child{border:0}.knob-wrap{position:absolute;inset:10px 12px 22px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}.primary-control input[type=range]{appearance:none;width:170px;height:170px;background:transparent;transform:rotate(-90deg);position:absolute;opacity:0;cursor:pointer}.primary-control input::-webkit-slider-thumb{appearance:none;width:16px;height:16px}.knob{width:148px;height:148px;border-radius:50%;position:relative}.knob:before{content:"";position:absolute;inset:15px;border:1px solid var(--ink);border-radius:50%;opacity:.32}.knob:after{content:"";position:absolute;width:2px;height:42px;background:var(--orange);left:73px;top:14px;transform-origin:50% 60px;transform:rotate(var(--angle,-125deg));border-radius:2px}.value{font-size:11px;opacity:.62}.caption{font-size:12px;letter-spacing:.16em}.rumble-pad{display:flex;align-items:center;justify-content:center}.rumble-pad:before{content:"";width:160px;height:160px;border-radius:50%;background:radial-gradient(circle at 58% 34%,#101211 0 5px,transparent 6px),radial-gradient(circle,#101211 0 1px,transparent 1px);background-size:auto,16px 16px;opacity:.11}.rumble-pad:after{content:"RUMBLE";position:absolute;bottom:25px;font-size:13px;letter-spacing:.18em}.rumble-pad .pad-dot{position:absolute;width:12px;height:12px;border-radius:50%;background:var(--ink);box-shadow:0 0 22px 8px #ff861c88}.tabs{display:grid;grid-template-columns:repeat(5,1fr);align-items:end;border-bottom:1px solid var(--rule)}.tabs button{height:36px;text-align:left;padding-left:18px;letter-spacing:.16em;font-size:12px;border-top:2px solid transparent}.tabs button.active{border-color:var(--orange)}.content{display:grid;grid-template-columns:minmax(0,1fr) 300px;min-height:0}.detail{display:grid;grid-template-columns:repeat(4,1fr);align-content:start;padding:16px 8px;gap:10px;border-right:1px solid var(--rule);overflow:auto}.detail h2,.output-rail h2{grid-column:1/-1;font-size:13px;letter-spacing:.16em;font-weight:400;margin:0 0 2px;color:var(--ink)}.detail h2:before,.output-rail h2:before{content:"";display:inline-block;width:14px;height:3px;background:var(--orange);vertical-align:middle;margin-right:12px}.control{border-bottom:1px solid var(--rule);padding:5px 4px 9px;display:grid;grid-template-columns:1fr auto;gap:5px;align-items:center;min-height:48px}.control label{font-size:10px;letter-spacing:.1em}.control output{font-size:10px;opacity:.62}.control input[type=range]{grid-column:1/-1;width:100%;accent-color:var(--orange);height:14px}.control select{grid-column:1/-1;background:transparent;border:0;border-bottom:1px solid var(--rule);padding:4px}.toggle{display:flex;align-items:center;gap:8px}.toggle input{accent-color:var(--orange)}.output-rail{padding:16px 18px;position:relative}.output-rail h2{margin-bottom:14px}.output-rail .control{display:block;margin-bottom:8px}.output-rail .control input{margin-top:7px}.meter{position:absolute;bottom:12px;left:18px;right:18px;color:var(--orange);letter-spacing:5px;opacity:.7;white-space:nowrap;overflow:hidden}.output-rail .control label{display:block}footer{border-top:1px solid var(--rule);display:flex;align-items:center;gap:12px;font-size:10px;letter-spacing:.12em;opacity:.7}footer span{margin-left:18px}footer label{margin-left:auto}footer input{accent-color:var(--orange);vertical-align:middle}@media(max-width:850px){.editor{display:block;padding:12px;min-height:100vh}.topbar{height:70px}.brand{width:150px}.brand strong{font-size:17px}.transport{flex-wrap:wrap;justify-content:flex-end}.status{display:none}.wave{height:110px;margin-top:12px}.primary{grid-template-columns:repeat(3,1fr);margin-top:12px}.primary-control{min-height:170px}.knob{width:100px;height:100px}.knob:after{left:49px;height:30px;transform-origin:50% 45px}.rumble-pad:before{width:100px;height:100px}.tabs{margin-top:12px;overflow:auto}.content{display:block}.detail{border-right:0;grid-template-columns:repeat(2,1fr);min-height:260px}.output-rail{border-top:1px solid var(--rule);min-height:220px}footer{margin-top:12px;height:42px}}