@font-face{font-family:Barlow;src:url('assets/BarlowCondensed-Black.ttf') format('truetype');font-weight:900;font-display:swap}
@font-face{font-family:Barlow;src:url('assets/BarlowCondensed-Medium.ttf') format('truetype');font-weight:500;font-display:swap}
:root{--bg:#080906;--ink:#e6e9dc;--acid:#c2ff3d;--red:#ff4d2e;--dim:#929986;--line:#30372a;--ui:Barlow,'Arial Narrow',Arial,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:500 14px/1.45 var(--ui)}button,input,select{font:inherit}button{color:inherit;background:none;border:0;cursor:pointer}button:disabled{cursor:default;opacity:.32}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--red);outline-offset:4px}button:not(:disabled):hover{color:var(--acid)}
.console{width:min(1680px,calc(100% - 64px));margin:24px auto 40px}.mast{display:flex;align-items:center;justify-content:space-between;letter-spacing:.7px;font-size:13px;color:var(--dim)}header{display:flex;justify-content:space-between;align-items:center;gap:32px;padding:23px 0 18px}h1{white-space:nowrap;font:900 clamp(74px,9vw,106px)/.85 var(--ui);letter-spacing:-1px;margin:0;color:var(--acid)}h1 span{font:51px/1 Arial,sans-serif;color:var(--red);vertical-align:top;margin-left:10px;display:inline-block;transform:translateY(-5px)}.header-controls{width:432px;flex-shrink:0}.primary-actions{display:grid;grid-template-columns:90px 90px minmax(0,1fr);gap:12px;align-items:stretch}.header-action{height:46px;border:1px solid var(--line);padding:0 17px;letter-spacing:.5px;text-align:left}.header-action:not(:disabled):hover{border-color:var(--acid)}.connect{width:100%;border:1px solid var(--acid);height:46px;color:var(--acid);display:flex;align-items:center;justify-content:space-between;padding:0 17px;letter-spacing:.5px}.connect:not(:disabled):hover{background:var(--acid);color:var(--bg)}.connect span{font-size:22px}.small-actions{margin:9px 0 0 204px;display:flex;justify-content:space-between;gap:8px}.small-actions button{font-size:12px;color:var(--dim);padding:0}.small-actions button.selected{color:var(--red)}#notice{min-height:34px;padding:8px 0;color:var(--dim);font-size:13px;border-bottom:1px solid var(--line)}
.instrument{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(420px,1fr);gap:48px}.visual{min-width:0;display:flex;align-items:center}.stage{position:relative;width:100%;height:720px}canvas{display:block;width:100%;height:100%}.randomize{position:absolute;top:var(--radar-y,50%);left:50%;transform:translate(-50%,-50%);width:87px;height:87px;border-radius:50%;background:var(--acid);color:var(--bg);display:grid;place-items:center;transition:background .1s}.randomize svg{width:43px;height:43px;stroke:var(--bg);stroke-width:9;fill:none}.randomize span{position:absolute;font-size:11px;line-height:1.3;left:50%;top:calc(100% + 9px);transform:translateX(-50%);color:var(--dim);white-space:nowrap;pointer-events:none}.randomize:not(:disabled):hover{background:var(--ink)}.randomize:disabled{opacity:.42}.randomize.busy{background:var(--red)}.randomize.busy svg{animation:rotate 2s linear infinite}
.performance{padding:20px 0 0}.section-label{letter-spacing:.6px;font-size:13px;color:var(--dim)}.tempo-head{display:flex;justify-content:space-between;align-items:center}.tempo-head>span:last-child{color:var(--dim);font-size:12px}.tempo{display:flex;align-items:center;justify-content:space-between;height:92px;gap:18px;border-bottom:1px solid var(--line)}.tempo-input{display:flex;align-items:baseline;min-width:0;gap:12px}.tempo-input input{min-width:0;width:176px;color:var(--ink);background:none;border:0;padding:0;font:900 68px/1 var(--ui);appearance:textfield;font-variant-numeric:tabular-nums}.tempo-input input::-webkit-inner-spin-button,.tempo-input input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.tempo-input input:disabled{color:#66705b;-webkit-text-fill-color:#66705b;opacity:1}.tempo-input>span:last-child{font-size:13px;color:var(--dim)}#auto-tempo{height:54px;width:64px;flex-shrink:0;padding:9px 10px;font-size:14px;line-height:1.3;border:1px solid var(--line);color:var(--dim)}#auto-tempo span{font-size:11px}#auto-tempo.active{color:var(--acid);border-color:var(--acid)}.tempo-foot{display:flex;justify-content:space-between;align-items:center;color:var(--dim);font-size:11px;letter-spacing:.5px;padding:0 0 13px;border-bottom:1px solid var(--line)}.tempo-foot div{display:flex;gap:8px}.tempo-foot button{border:1px solid var(--line);font-size:20px;width:32px;height:30px;line-height:24px}
.delay-control{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:16px 0 17px;border-bottom:1px solid var(--line);font-size:13px;letter-spacing:.6px;color:var(--dim)}.delay-control output{color:var(--ink);font-variant-numeric:tabular-nums}.delay-control input{grid-column:1/-1;appearance:none;-webkit-appearance:none;width:100%;height:3px;margin:5px 0;cursor:pointer;background:linear-gradient(to right,var(--acid) 0 var(--amount,100%),var(--line) var(--amount,100%) 100%)}.delay-control input::-webkit-slider-thumb{-webkit-appearance:none;width:6px;height:15px;background:var(--acid);border:0;border-radius:0}.delay-control input::-moz-range-thumb{width:6px;height:15px;background:var(--acid);border:0;border-radius:0}.delay-control input:disabled{opacity:.3;cursor:default}
.voice-head{display:flex;justify-content:space-between;align-items:center;padding:18px 0 8px}.voice-head>div{display:flex;gap:22px}.voice-head button{font-size:12px;padding:4px 0;color:var(--dim)}.drag-hint{margin:0 0 14px;max-width:none;font-size:14px;line-height:1.5;color:var(--dim)}.voice{display:grid;grid-template-columns:24px minmax(0,1fr) 34px 34px 34px;gap:14px;align-items:center;min-height:76px;padding:9px 14px;border-top:1px solid var(--line);position:relative;transition:background .1s}.voice:last-child{border-bottom:1px solid var(--line)}.voice-number{font-size:12px;color:#6b765e}.voice-identity{display:flex;gap:16px;align-items:center;text-align:left;padding:2px 0;min-width:0;cursor:grab;touch-action:none;user-select:none}.voice-identity svg{width:27px;height:27px;flex-shrink:0;stroke:var(--acid);fill:none;stroke-width:1.5;stroke-linecap:square}.voice-label{display:flex;flex-direction:column;min-width:0}.voice-name{font:900 24px/1.05 var(--ui);letter-spacing:.3px}.engine-name{font-size:12px;line-height:1.25;color:var(--dim);margin-top:4px;white-space:nowrap}.voice-toggle{height:34px;width:34px;border:1px solid var(--line);font-size:15px;color:var(--dim);padding:0}.voice-toggle[aria-pressed=true]{background:var(--acid);border-color:var(--acid);color:var(--bg)}.voice-toggle.mute[aria-pressed=true]{background:var(--red);border-color:var(--red);color:var(--bg)}.voice.silent .voice-name{color:#7c8571}.voice.silent svg{stroke:#5b6450}.voice.silent .engine-name{color:#626d55}.voice.soloed .voice-number,.voice.selected .voice-number{color:var(--acid)}.voice.selected,.voice.drag-source{background:#19200f}.voice.drag-over{background:#283419;outline:1px solid var(--acid)}.voice.hit:before{content:'';position:absolute;width:3px;height:3px;left:5px;background:var(--red)}
.sr-only{position:absolute;clip:rect(0,0,0,0);width:1px;height:1px;overflow:hidden}dialog{width:min(560px,calc(100% - 32px));max-height:85vh;background:#11150c;border:1px solid var(--acid);color:var(--ink);padding:27px;font:500 16px/1.55 var(--ui)}dialog::backdrop{background:#000b}.dialog-top{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding-bottom:15px;margin-bottom:20px}h2{font:900 40px/1 var(--ui);margin:0;color:var(--acid)}.dialog-top button{font-size:24px;color:var(--red)}dialog li{padding-left:5px;margin-bottom:11px}dialog ol{padding-left:21px}dialog p{color:var(--dim);font-size:15px}.dialog-done{border:1px solid var(--acid);color:var(--acid);padding:13px 16px;display:block;width:100%;text-align:left;margin-top:25px}dialog label{display:block;margin:20px 0;font-size:13px}dialog select{display:block;width:100%;background:var(--bg);color:var(--ink);padding:12px;border:1px solid var(--line);margin-top:8px}details{margin-top:20px}summary{cursor:pointer;color:var(--acid);font-size:13px}@keyframes rotate{to{transform:rotate(360deg)}}
@media(max-width:1100px){.console{width:calc(100% - 56px)}.instrument{grid-template-columns:minmax(0,1fr) 400px;gap:32px}.stage{height:580px}.voice{gap:10px;padding-inline:12px}.voice-identity{gap:12px}}
@media(max-width:900px) and (min-width:651px){.console{width:calc(100% - 40px)}.instrument{grid-template-columns:minmax(0,1fr) 360px;gap:24px}.stage{height:470px}.tempo-input input{width:148px;font-size:62px}.voice{grid-template-columns:20px minmax(0,1fr) 32px 32px 32px;gap:10px;padding-inline:10px}.voice-toggle{width:32px}.voice-identity{gap:10px}}
@media(max-width:650px){.console{width:calc(100% - 32px);margin-top:17px}.mast{font-size:11px}header{padding:24px 0 13px;gap:22px;flex-wrap:wrap}h1{font-size:clamp(40px,11vw,63px)}h1 span{font-size:24px;margin-left:5px;transform:translateY(-2px)}.header-controls{width:100%}.primary-actions{grid-template-columns:1fr 1fr 1.35fr;gap:10px}.header-action{height:35px;font-size:12px;padding:0 12px}.small-actions{margin-left:calc((100% - 20px)*2/3.35 + 20px)}.connect{height:35px;font-size:12px}.small-actions button{font-size:10px}.instrument{grid-template-columns:1fr;gap:0}.visual{order:2}.performance{padding-top:17px}.stage{height:350px}.tempo-input input{font-size:66px;width:170px}.voice{min-height:76px;grid-template-columns:20px minmax(0,1fr) 33px 33px 33px;gap:10px;padding:12px 10px}.voice-toggle{width:33px;height:34px}.voice-name{font-size:24px}.voice-identity svg{width:25px;height:25px}.randomize{width:82px;height:82px}}
@media(prefers-reduced-motion:reduce){*,*:before{animation:none!important;transition:none!important}}
@media(min-width:651px){.visual{position:relative;align-items:stretch}.stage{position:absolute;inset:0;height:100%}.instrument{position:relative}.instrument::after{content:'';position:absolute;left:0;right:0;top:var(--ghost-bottom,100%);border-top:1px solid var(--line);pointer-events:none}}

.voice-random{display:grid;place-items:center}.voice-random svg{width:20px;height:20px;stroke:currentColor;stroke-width:9;fill:none}.voice-random:not(:disabled):hover{border-color:var(--acid)}
@media(min-width:651px) and (max-width:900px){header{gap:20px}h1{font-size:clamp(58px,8vw,74px)}h1 span{font-size:34px}.header-controls{width:330px}.primary-actions{grid-template-columns:70px 78px minmax(0,1fr);gap:10px}.header-action,.connect{padding-inline:12px}.small-actions{margin-left:168px}}

.voice-mix{grid-column:2/-1;display:grid;grid-template-columns:1fr 1fr 1fr;gap:24px;padding:12px 0 15px;margin-top:3px;border-top:1px solid #303b24}.voice-mix[hidden]{display:none}.mix-control{min-width:0}.mix-heading{display:flex;align-items:center;gap:12px;height:26px;margin-bottom:9px;color:var(--dim);font-size:12px;letter-spacing:.5px}.mix-heading output{margin-left:auto;min-width:30px;text-align:right;color:var(--ink);font-variant-numeric:tabular-nums}.mix-control input{display:block;appearance:none;-webkit-appearance:none;width:100%;height:3px;margin:0;cursor:pointer;background:linear-gradient(to right,var(--acid) 0 var(--amount,0%),#3a442f var(--amount,0%) 100%)}.mix-control .mix-pan{background:linear-gradient(to right,#3a442f 0 var(--pan-start,50%),var(--acid) var(--pan-start,50%) var(--pan-end,50%),#3a442f var(--pan-end,50%) 100%)}.mix-control input::-webkit-slider-thumb{-webkit-appearance:none;width:5px;height:14px;background:var(--acid);border:0;border-radius:0}.mix-control input::-moz-range-thumb{width:5px;height:14px;background:var(--acid);border:0;border-radius:0}.mix-control input:disabled{opacity:.3;cursor:default}.pan-track{position:relative}.pan-track::before{content:'';position:absolute;left:50%;top:-3px;height:9px;width:1px;background:var(--dim);pointer-events:none}.voice.selected{background:#141b0d}.voice-identity[aria-expanded=true] .voice-name{color:var(--acid)}
@media(max-width:1100px){.voice-mix{grid-column:1/-1;gap:22px}.mix-heading{gap:8px}}

.tempo-input{margin-right:auto}.tempo-step{display:flex;gap:6px}.tempo-step button{border:1px solid var(--line);font-size:22px;width:30px;height:32px;line-height:24px;padding:0}#auto-tempo{height:40px;width:57px;padding:3px 8px;font-size:12px}#auto-tempo span{font-size:10px}.delay-meta{display:flex;align-items:center;gap:24px}.delay-meta output{min-width:67px;text-align:right}.delay-modes{display:flex;gap:12px}.delay-modes button{font-size:12px;padding:0;color:var(--dim)}.delay-modes button[aria-pressed=true]{color:var(--acid)}
#delay-pan{font-size:12px;padding:0 0 0 16px;border-left:1px solid var(--line);color:var(--dim);white-space:nowrap}#delay-pan[aria-pressed=true]{color:var(--acid)}
.delay-meta{gap:16px}.delay-modes{gap:10px}
@media(max-width:420px){.delay-control{column-gap:8px}.delay-meta{gap:10px}.delay-modes{gap:8px}#delay-pan{padding-left:10px}.delay-meta output{min-width:57px}}
@media(max-width:900px){.tempo{gap:10px}.voice-mix{gap:18px}.mix-heading{font-size:11px;gap:5px}.mix-heading output{min-width:25px}.delay-meta{gap:16px}}

.scale-control{display:flex;align-items:center;justify-content:space-between;gap:20px;height:44px;border-bottom:1px solid var(--line);font-size:13px;letter-spacing:.6px;color:var(--dim)}
.scale-control select{width:178px;height:32px;padding:0 24px 0 10px;border:1px solid var(--line);border-radius:0;background:var(--bg);color:var(--acid);font-size:14px;letter-spacing:.2px;cursor:pointer}
.scale-control select:disabled{opacity:.4;cursor:default}