*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Arial,sans-serif;font-size:13px;background:#fff;color:#000;height:100vh;overflow:hidden}#app{display:flex;flex-direction:column;height:100vh}#toolbar{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;border-bottom:1px solid #000;background:#fff}.logo{font-size:20px;font-weight:700;color:#000}.toolbar-right{display:flex;gap:10px;align-items:center}.status{padding:4.3px 9.5px;border:1px solid #000;font-size:12px}#start-btn{padding:3px 9px;border:1px solid #000;background:#fff;color:#000;cursor:pointer}#start-btn:disabled{opacity:.5;cursor:not-allowed}#canvas{position:relative;flex:1;min-height:0;background:#fff}#wire-svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;z-index:30}.wire{fill:none;stroke:#000;stroke-width:3}.module{position:absolute;min-width:160px;border:1px solid #000;background:#fff;z-index:10}.module.dragging{z-index:20}.mod-header{padding:8px 10px;border-bottom:1px solid #000;font-weight:700;cursor:grab;background:#fff;color:#000}.mod-header:active{cursor:grabbing}.mod-body{padding:10px}.mod-knobs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.mod-ports{display:flex;justify-content:space-between;padding:14px 10px;border-top:1px solid #000}.port{width:14px;height:14px;border:1px solid #000;border-radius:50%;background:#fff;position:relative}.port-in:before,.port-out:before{position:absolute;left:50%;bottom:-14px;transform:translate(-50%);font-size:9px;color:#000}.port-in:before{content:"IN"}.port-out:before{content:"OUT"}.knob{display:flex;flex-direction:column;align-items:stretch;gap:4px;min-width:86px}.knob-label{font-size:10px;font-weight:700;color:#000;text-align:left}.knob-slider{width:100%}.knob-value{font-size:10px;color:#000;min-width:36px;text-align:left}#hint{padding:6px 12px;border-top:1px solid #000;background:#fff;color:#000;text-align:center;font-size:11px}