*{margin:0;padding:0;box-sizing:border-box}body{font-family:system-ui,-apple-system,Arial,Helvetica,sans-serif;background:var(--accent-yellow);color:var(--text);min-height:100vh;-webkit-font-smoothing:antialiased;font-weight:900}a{text-decoration:none;color:inherit}.page-content{background:var(--bg-section-warm);min-height:100vh;padding:0 24px}.inner{max-width:960px;margin:0 auto;padding-top:96px;padding-bottom:64px}.label{font-size:12px;color:var(--text-muted);letter-spacing:.08em;text-transform:uppercase;margin-bottom:12px;font-weight:500}.title{font-size:clamp(32px,6vw,52px);font-weight:600;line-height:1.08;letter-spacing:-.03em;margin-bottom:16px}.subtitle{font-size:15px;font-weight:500;color:var(--text-muted);line-height:1.55;max-width:560px;margin-bottom:28px}.cta-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;background:var(--text);color:var(--bg);font-size:14px;font-weight:700;border-radius:100px;transition:transform .15s ease;border:none;cursor:pointer}.cta-btn:hover{transform:scale(1.04)}.cta-btn:disabled{opacity:.4;cursor:default;transform:none}.cta-btn-outline{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;background:transparent;color:var(--text);font-size:13px;font-weight:700;border-radius:100px;border:2px solid var(--text);transition:all .15s ease;cursor:pointer}.cta-btn-outline:hover{background:var(--text);color:var(--bg)}.cta-btn-outline:disabled{opacity:.35;cursor:default;background:transparent;color:var(--text)}.toolbar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}.toolbar:last-of-type{margin-bottom:20px}.macro-panel{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:20px;padding:10px 16px;background:#fff;border:2px solid var(--text);border-radius:100px}.macro-panel-hint{font-size:12px;font-weight:700;color:var(--text-muted)}.macro-panel input[type=text]{font-family:inherit;font-size:13px;font-weight:700;color:var(--text);background:var(--bg-subtle);border:2px solid var(--text);border-radius:100px;padding:8px 14px;min-width:140px}.card{background:#fff;border:2px solid var(--text);border-radius:16px;box-shadow:0 4px 0 0 var(--text)}.board-viewport{overflow:auto;max-width:100%;max-height:80vh;min-height:600px;cursor:grab;touch-action:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;scrollbar-width:none}.board-viewport::-webkit-scrollbar{display:none}.board-viewport.panning{cursor:grabbing}.board{position:relative;width:2200px;height:1300px;background-image:radial-gradient(circle,var(--card-border) 1.5px,transparent 1.5px);background-size:24px 24px;background-color:var(--bg-subtle)}.board.select-mode .module-body,.board.select-mode .module-ports{pointer-events:none}.board.select-mode .module-head{cursor:pointer}.cable-layer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.cable{fill:none;stroke:var(--text);stroke-width:3;stroke-linecap:round;opacity:.55;pointer-events:stroke;cursor:pointer}.cable:hover{opacity:1;stroke:#e8384a}.cable-ghost{pointer-events:none;opacity:.9;stroke-dasharray:7 5}.hint{font-size:12px;font-weight:600;color:var(--text-muted);margin-top:12px;max-width:620px}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%) translateY(20px);background:var(--text);color:var(--bg);font-size:13px;font-weight:700;padding:10px 18px;border-radius:100px;box-shadow:0 6px 16px #00000040;opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease;z-index:50;max-width:calc(100vw - 32px);text-align:center}.toast.show{opacity:1;transform:translate(-50%) translateY(0)}.param-editor{position:fixed;z-index:60;font-family:inherit;font-size:10px;font-weight:800;color:var(--text);background:#fff;border:2px solid var(--accent-yellow);border-radius:6px;padding:2px 4px;text-align:right;box-shadow:0 2px 6px #00000040}.param-editor[hidden]{display:none}.module{position:absolute;width:190px;background:var(--accent-blue);border:2px solid var(--text);border-radius:16px;box-shadow:0 4px 0 0 var(--text);-webkit-user-select:none;-moz-user-select:none;user-select:none}.module[data-type=lfo]{background:var(--accent-pink)}.module[data-type=filter]{background:var(--accent-green)}.module[data-type=amp]{background:var(--accent-yellow)}.module[data-type=output]{background:var(--accent-orange)}.module[data-type=noise]{background:#9a9490}.module[data-type=delay]{background:#17a398}.module[data-type=env]{background:#8b5cf6}.module[data-type=mixer]{background:#c9862a}.module[data-type=macro]{background:var(--text)}.module[data-type=macro] .module-title,.module[data-type=macro] .module-remove,.module[data-type=macro] .macro-note{color:#fdf9f3}.module[data-type=macro] .module-ports{border-top-color:#fdf9f359}.module.macro-selected{outline:4px solid var(--accent-yellow);outline-offset:2px}.module-head{display:flex;align-items:center;justify-content:space-between;padding:10px 10px 4px;cursor:grab;touch-action:none}.module-title{font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.04em}.module-remove{background:none;border:none;font-size:16px;line-height:1;font-weight:900;color:var(--text);cursor:pointer;padding:0 2px}.module-body{padding:12px 10px;display:flex;flex-direction:column;gap:8px}.macro-note{font-size:11px;font-weight:700;opacity:.75}.ctrl-row{display:flex;align-items:center;gap:6px;font-size:10px}.ctrl-row label{text-transform:uppercase;letter-spacing:.04em;color:var(--text);opacity:.65;font-weight:700;flex-shrink:0;width:40px}.ctrl-row select{flex:1;font-family:inherit;font-size:11px;font-weight:700;color:var(--text);background:#fff;border:2px solid var(--text);border-radius:6px;padding:3px 4px;min-width:0}.range-wrap{position:relative;flex:1;min-width:0;display:flex;align-items:center}.mod-marker{position:absolute;top:50%;left:0%;width:4px;height:16px;background:var(--accent-yellow);border:1px solid var(--text);border-radius:2px;transform:translate(-50%,-50%);box-shadow:0 0 5px 1px #f0d020bf;pointer-events:none;display:none;transition:left .03s linear}.mod-marker.active{display:block}.ctrl-row input[type=range]{flex:1;min-width:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:8px;border-radius:100px;background:#fff;border:2px solid var(--text);cursor:pointer}.ctrl-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:15px;height:15px;border-radius:50%;background:var(--text);border:2px solid #fff;box-shadow:0 0 0 2px var(--text);cursor:pointer}.ctrl-row input[type=range]::-moz-range-track{height:8px;border-radius:100px;background:#fff;border:2px solid var(--text)}.ctrl-row input[type=range]::-moz-range-thumb{width:13px;height:13px;border-radius:50%;background:var(--text);border:2px solid #fff;box-shadow:0 0 0 2px var(--text);cursor:pointer}.ctrl-row input[type=checkbox]{accent-color:var(--text)}.ctrl-row span{font-size:10px;font-weight:700;color:var(--text);opacity:.65;flex-shrink:0;min-width:38px;text-align:right}.c-mute-label{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--text);opacity:.65;text-transform:none;width:auto}.env-trigger-btn{width:100%;font-family:inherit;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--text);background:#fff;border:2px solid var(--text);border-radius:100px;padding:6px 10px;cursor:pointer}.env-trigger-btn:active{background:var(--text);color:#fff}.module-ports{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:8px 10px 10px;border-top:2px solid var(--text)}.ports-col{display:flex;flex-direction:column;gap:8px}.ports-col.ports-out{align-items:flex-end}.jack{display:flex;align-items:center;gap:5px;cursor:pointer}.ports-out .jack{flex-direction:row-reverse}.jack-dot{width:14px;height:14px;border-radius:50%;background:#fff;border:2px solid var(--text);flex-shrink:0}.jack-label{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;color:var(--text);background:#fff;border:2px solid var(--text);padding:3px 7px;border-radius:100px;white-space:nowrap}.jack.armed .jack-dot{background:var(--accent-yellow);box-shadow:0 0 0 3px #f0d02073}.jack.connected .jack-dot{background:var(--text)}.footer-row{margin-top:24px}.back-link{font-size:14px;color:var(--text);opacity:.6}@media (max-width: 480px){.inner{padding-top:64px}.title{font-size:28px}}
