*{box-sizing:border-box}body{margin:0;background:#0b0b0b;color:#e7e7d4;font-family:Consolas,Courier New,monospace}button,select,input{font:inherit}main{width:min(1380px,calc(100vw - 24px));margin:0 auto;padding:18px 0 28px}header{border-bottom:1px solid #555;margin-bottom:14px}h1{margin:0;font-size:30px;letter-spacing:0}h2,p{margin:4px 0 10px;color:#aaa;font-size:14px;font-weight:400}.layout{display:grid;grid-template-columns:320px 1fr;gap:14px;align-items:start}.right{display:grid;gap:14px}.panel{border:1px solid #555;background:#151515;padding:12px}.controls{display:grid;gap:12px;position:sticky;top:12px}label{display:grid;gap:6px;color:#cfcfc0;font-size:13px}select,button,input[type=range]{width:100%}select,button{min-height:34px;border:1px solid #777;background:#050505;color:#f0f0dd}button{cursor:pointer}button:hover{background:#222}.buttonRow{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}.fx{display:grid;gap:10px;padding-top:10px;border-top:1px dashed #555}.sequencer{overflow-x:auto}.stepHeader,.lane{display:grid;grid-template-columns:72px repeat(16,minmax(34px,1fr));gap:4px;min-width:700px;align-items:center}.stepHeader{margin-bottom:6px;color:#777;font-size:11px;text-align:center}.lane{margin:5px 0}.lane strong{color:#bfcfb0;font-size:12px}.step{aspect-ratio:1;min-height:34px;padding:0;border-color:#333;color:#555}.step.on{color:#111;background:#c8ef65;border-color:#e1ff94}.step.active,.activeMarker{outline:2px solid #ff4b4b;outline-offset:-2px}.debug pre{max-height:430px;overflow:auto;margin:0;white-space:pre-wrap;color:#9ac99a;font-size:12px;line-height:1.35}@media(max-width:860px){.layout{grid-template-columns:1fr}.controls{position:static}}.section{display:grid;gap:10px;padding-top:10px;border-top:1px dashed #555}.param{display:grid;gap:5px}.paramTop{display:flex;align-items:center;justify-content:space-between;gap:8px}.paramLabel{color:#cfcfc0;font-size:13px}.paramNum{width:74px;min-height:26px;padding:2px 6px;border:1px solid #777;background:#050505;color:#c8ef65;text-align:right;font:inherit}.paramNum:focus{outline:1px solid #c8ef65;outline-offset:-1px}.toggle{text-align:left;padding:0 10px}.toggleOn{background:#2a3410;border-color:#c8ef65;color:#e1ff94}.debugToggle{width:auto;padding:0 12px}.step.synthStep.on{background:#65c8ef;border-color:#94e1ff}.lane{grid-template-columns:72px repeat(16,minmax(34px,1fr))}
