:root{--floor: #16120f;--floor-lift: #241d18;--rail: #3b332c;--rail-soft: #2a231d;--chrome: #cbc3b8;--chrome-dim: #8b8177;--ink: #f2ece3;--ink-dim: #a89e92;--led: #ff3b30;--pedal-w: 200px;--pedal-h: 216px;--font-display: "Archivo Black", "Archivo", system-ui, sans-serif;--font-ui: "Archivo", system-ui, -apple-system, sans-serif;--font-data: "Space Mono", ui-monospace, monospace;--ease: cubic-bezier(.22, 1, .36, 1)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:var(--font-ui);color:var(--ink);background:var(--floor);overflow:hidden}button{font:inherit;color:inherit;border:none;background:none;cursor:pointer}:focus-visible{outline:2px solid var(--chrome);outline-offset:3px;border-radius:3px}.stage{height:100%;background:radial-gradient(90% 65% at 50% 8%,#4a3b2e 0%,#2b221b 38%,transparent 72%),radial-gradient(70% 55% at 12% 96%,#2e2418 0%,transparent 68%),radial-gradient(60% 50% at 92% 88%,#241c2c 0%,transparent 70%),var(--floor)}.dropzone{height:100%;display:grid;place-items:center;position:relative;padding:32px}.dropzone__inner{text-align:center;z-index:1;max-width:460px}.dropzone__mark{font-family:var(--font-display);font-size:clamp(44px,9vw,86px);letter-spacing:-.03em;line-height:.92;margin:0 0 20px;text-transform:lowercase}.dropzone__mark span{display:block;color:var(--chrome-dim)}.dropzone__lede{font-size:17px;line-height:1.5;color:var(--ink-dim);margin:0 0 36px}.jack{position:relative;width:132px;height:132px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 50% 38%,#4a413a,#221c17 58%,#14100d);box-shadow:inset 0 2px #ffffff1a,inset 0 -3px 10px #0009,0 12px 34px #00000073;border:2px solid var(--rail);transition:transform .4s var(--ease),border-color .3s var(--ease),box-shadow .4s var(--ease)}.jack:after{content:"";width:46px;height:46px;border-radius:50%;background:radial-gradient(circle at 50% 35%,#0d0a08,#000);box-shadow:inset 0 3px 8px #000000e6,0 0 0 6px #1a1511;transition:box-shadow .4s var(--ease)}.dropzone[data-over=true] .jack{transform:scale(1.07);border-color:var(--chrome);box-shadow:inset 0 2px #ffffff29,0 0 0 10px #cbc3b812,0 18px 46px #00000080}.dropzone[data-over=true] .jack:after{box-shadow:inset 0 3px 8px #000000e6,0 0 0 6px #2b241d}.jack-mount{position:relative;width:132px;height:132px;margin:0 auto 30px}.dropzone__cable{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none;overflow:visible}.dropzone__cable path{fill:none;stroke-linecap:round}.dropzone__hint{font-family:var(--font-data);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--chrome-dim)}.dropzone__error{margin-top:20px;font-size:14px;color:#ff8b84;font-family:var(--font-data)}.linkish{color:var(--ink);text-decoration:underline;text-underline-offset:3px;cursor:pointer}.shell{height:100%;display:grid;grid-template-columns:208px minmax(0,1fr) 348px;grid-template-rows:56px minmax(0,1fr);grid-template-areas:"brand header header" "rack canvas monitor"}.brand{grid-area:brand;display:flex;align-items:center;gap:9px;padding:0 18px;font-family:var(--font-display);font-size:19px;letter-spacing:-.02em;border-bottom:1px solid var(--rail-soft);border-right:1px solid var(--rail-soft)}.brand__screw{width:13px;height:13px;flex:none}.header{grid-area:header;display:flex;align-items:center;gap:14px;padding:0 18px;border-bottom:1px solid var(--rail-soft);min-width:0}.header__name{font-family:var(--font-data);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.header__meta{font-family:var(--font-data);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--chrome-dim);white-space:nowrap}.header__spacer{flex:1}.ghost-button{font-family:var(--font-data);font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--chrome-dim);padding:7px 12px;border:1px solid var(--rail);border-radius:6px;transition:color .18s var(--ease),border-color .18s var(--ease),background .18s var(--ease);white-space:nowrap}.ghost-button:hover:not(:disabled){color:var(--ink);border-color:var(--chrome-dim);background:#ffffff08}.ghost-button:disabled{opacity:.35;cursor:not-allowed}.rack{grid-area:rack;border-right:1px solid var(--rail-soft);overflow-y:auto;padding:16px 14px 28px}.rack__title{font-family:var(--font-data);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--chrome-dim);margin:0 0 12px}.rack__item{width:100%;display:flex;align-items:center;gap:9px;text-align:left;padding:10px 12px;margin-bottom:7px;border-radius:8px;background:linear-gradient(180deg,#ffffff0b,#0000002e);border:1px solid var(--rail-soft);border-left:3px solid var(--accent);transition:transform .2s var(--ease),border-color .2s var(--ease),background .2s var(--ease)}.rack__item:hover{transform:translate(3px);border-color:var(--rail);background:linear-gradient(180deg,#ffffff12,#00000024)}.rack__item:active{transform:translate(1px) scale(.99)}.rack__mark{flex:none;color:var(--accent)}.rack__text{min-width:0}.rack__name{font-family:var(--font-display);font-size:12.5px;letter-spacing:.01em}.rack__tag{font-family:var(--font-data);font-size:10px;color:var(--chrome-dim);margin-top:2px}.canvas{grid-area:canvas;position:relative;overflow:hidden;cursor:grab;background-image:radial-gradient(circle,rgb(255 255 255 / .045) 1px,transparent 1px);background-size:26px 26px}.canvas[data-panning=true]{cursor:grabbing}.canvas__layer{position:absolute;top:0;right:0;bottom:0;left:0;transform-origin:0 0}.canvas__cables{position:absolute;top:0;right:0;bottom:0;left:0;overflow:visible;pointer-events:none}.canvas__empty{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;text-align:center;pointer-events:none;color:var(--chrome-dim);font-family:var(--font-data);font-size:13px;line-height:1.7}.zoom{position:absolute;left:16px;bottom:16px;display:flex;gap:6px;font-family:var(--font-data)}.zoom button{width:30px;height:30px;border:1px solid var(--rail-soft);border-radius:7px;color:var(--chrome-dim);font-size:14px;background:#16120fd9;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:color .16s,border-color .16s}.zoom button:hover{color:var(--ink);border-color:var(--rail)}.terminal{position:absolute;width:74px;transform:translate(-50%,-50%);text-align:center;-webkit-user-select:none;user-select:none}.terminal__ring{width:44px;height:44px;margin:0 auto 7px;border-radius:50%;background:radial-gradient(circle at 50% 34%,#4a413a,#1a1511);border:2px solid var(--rail);box-shadow:inset 0 -2px 6px #0009;display:grid;place-items:center}.terminal__ring:after{content:"";width:15px;height:15px;border-radius:50%;background:#080605;box-shadow:inset 0 2px 4px #000000e6}.terminal__label{font-family:var(--font-data);font-size:9.5px;letter-spacing:.14em;color:var(--chrome-dim)}.pedal{position:absolute;width:var(--pedal-w);height:var(--pedal-h);border-radius:12px;padding:15px 14px 12px;display:flex;flex-direction:column;-webkit-user-select:none;user-select:none;touch-action:none;background:linear-gradient(180deg,#ffffff2b,#ffffff08 34%,#00000038),var(--accent);box-shadow:inset 0 1px #ffffff47,inset 0 -2px #00000047,0 14px 30px #0000006b;transition:box-shadow .22s var(--ease),filter .26s var(--ease),opacity .26s var(--ease)}.pedal[data-dragging=true]{box-shadow:inset 0 1px #ffffff47,0 26px 48px #0000008c;cursor:grabbing}.pedal[data-live=false]{filter:saturate(.18) brightness(.72)}.pedal__grip{cursor:grab}.pedal__wordmark{font-family:var(--font-display);font-size:15px;line-height:1.05;letter-spacing:.005em;color:#fff;text-shadow:0 1px 0 rgb(0 0 0 / .28)}.pedal__tagline{font-family:var(--font-data);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:#ffffff9e;margin-top:2px}.pedal__knobs{flex:1;display:flex;align-items:center;justify-content:center;gap:10px;padding:6px 0}.pedal__footer{display:flex;align-items:center;gap:10px}.pedal__screw{position:absolute;width:9px;height:9px;opacity:.55}.pedal__screw--tl{top:6px;left:6px}.pedal__screw--tr{top:6px;right:6px}.pedal__screw--bl{bottom:6px;left:6px}.pedal__screw--br{bottom:6px;right:6px}.pedal__remove{position:absolute;top:4px;right:18px;width:20px;height:20px;border-radius:50%;color:#ffffff8c;font-size:15px;line-height:1;opacity:0;transition:opacity .16s var(--ease),color .16s}.pedal:hover .pedal__remove{opacity:1}.pedal__remove:hover{color:#fff;background:#00000040}.jack-port{position:absolute;top:50%;width:20px;height:20px;margin-top:-10px;border-radius:50%;background:radial-gradient(circle at 50% 34%,#4c433c,#17120f);box-shadow:inset 0 -1px 3px #000000b3,0 0 0 2px #00000047;transition:transform .18s var(--ease),box-shadow .18s var(--ease)}.jack-port--in{left:-10px}.jack-port--out{right:-10px;cursor:crosshair}.jack-port:hover,.jack-port[data-target=true]{transform:scale(1.28);box-shadow:inset 0 -1px 3px #000000b3,0 0 0 3px #cbc3b880}.footswitch{width:34px;height:34px;border-radius:50%;background:radial-gradient(circle at 50% 30%,#efeae3,#b6ada2 42%,#6d655c);box-shadow:0 3px #0006,inset 0 -2px 4px #0000004d;transition:transform 90ms var(--ease),box-shadow 90ms var(--ease)}.footswitch:active{transform:translateY(3px);box-shadow:0 0 #0006,inset 0 -2px 4px #0000004d}.led{width:9px;height:9px;border-radius:50%;background:#4a1f1c;box-shadow:inset 0 1px 1px #00000080;transition:background .22s var(--ease),box-shadow .22s var(--ease)}.led[data-on=true]{background:var(--led);box-shadow:0 0 8px #ff3b30d9,0 0 18px #ff3b3073,inset 0 1px 1px #fff6}.pedal__state{font-family:var(--font-data);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:#ffffff8c;margin-left:auto}.knob{width:52px;text-align:center;touch-action:none}.knob__label{font-family:var(--font-data);font-size:8.5px;letter-spacing:.11em;color:#ffffffad;margin-bottom:5px}.knob__dial{width:42px;height:42px;margin:0 auto;border-radius:50%;position:relative;cursor:ns-resize;background:conic-gradient(from 0deg,#d8d2c9,#8e857b,#d8d2c9 12deg) padding-box,radial-gradient(circle at 50% 32%,#f3efe9,#7c7369);box-shadow:0 3px 6px #00000073,inset 0 -2px 5px #00000059,inset 0 2px 3px #ffffff80}.knob__cap{position:absolute;top:6px;right:6px;bottom:6px;left:6px;border-radius:50%;background:radial-gradient(circle at 50% 30%,#f6f3ee,#b3aaa0)}.knob__pointer{position:absolute;left:50%;top:5px;width:2.5px;height:13px;margin-left:-1.25px;border-radius:2px;background:#201a16;transform-origin:50% 16px}.knob__value{font-family:var(--font-data);font-size:10px;color:#fff;margin-top:5px;font-variant-numeric:tabular-nums;white-space:nowrap}.swatch{width:52px;text-align:center}.swatch__lens{width:42px;height:42px;margin:0 auto;border-radius:50%;border:none;padding:0;cursor:pointer;box-shadow:0 3px 6px #00000073,inset 0 2px 4px #ffffff59,0 0 0 3px #00000038;overflow:hidden}.swatch__lens::-webkit-color-swatch-wrapper{padding:0}.swatch__lens::-webkit-color-swatch{border:none;border-radius:50%}.swatch__lens::-moz-color-swatch{border:none;border-radius:50%}.monitor{grid-area:monitor;border-left:1px solid var(--rail-soft);display:flex;flex-direction:column;overflow-y:auto}.monitor__section{padding:16px 18px;border-bottom:1px solid var(--rail-soft)}.monitor__title{font-family:var(--font-data);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--chrome-dim);margin:0 0 12px;display:flex;align-items:center;gap:8px}.monitor__status{margin-left:auto;letter-spacing:.08em}.monitor__status[data-tone=error]{color:#ff8b84}.screen{width:100%;aspect-ratio:16 / 10;border-radius:9px;background:repeating-conic-gradient(#1b1613,#1b1613 25%,#221c18 0%,#221c18 50%) 50% / 16px 16px;border:1px solid var(--rail-soft);display:grid;place-items:center;overflow:hidden;margin-bottom:12px}.screen img,.screen video{width:100%;height:100%;object-fit:contain;display:block}.screen__idle{font-family:var(--font-data);font-size:11px;color:var(--chrome-dim);text-align:center;padding:0 20px;line-height:1.6}.monitor audio{width:100%;height:34px;margin-bottom:10px;border-radius:8px;filter:invert(.92) hue-rotate(180deg) saturate(.25) contrast(.92)}.scrub{display:flex;align-items:center;gap:10px;margin-bottom:4px}.scrub input{flex:1;accent-color:var(--chrome)}.scrub__time{font-family:var(--font-data);font-size:11px;color:var(--chrome-dim);font-variant-numeric:tabular-nums;min-width:42px;text-align:right}.render{width:100%;display:flex;align-items:center;gap:13px;padding:13px 15px;border-radius:11px;background:linear-gradient(180deg,#352c25,#221c17);border:1px solid var(--rail);box-shadow:0 4px #0000006b;text-align:left;transition:transform .11s var(--ease),box-shadow .11s var(--ease),border-color .18s}.render:hover:not(:disabled){border-color:var(--chrome-dim)}.render:active:not(:disabled){transform:translateY(4px);box-shadow:0 0 #0000006b}.render:disabled{opacity:.45;cursor:not-allowed}.render__stomp{width:30px;height:30px;flex:none;border-radius:50%;background:radial-gradient(circle at 50% 30%,#efeae3,#6d655c);box-shadow:inset 0 -2px 4px #00000059}.render__label{display:block;font-family:var(--font-display);font-size:14px;letter-spacing:.02em}.render__sub{display:block;font-family:var(--font-data);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--chrome-dim);margin-top:2px}.meter{height:3px;border-radius:2px;background:var(--rail-soft);overflow:hidden;margin-top:12px}.meter__fill{height:100%;background:var(--chrome);transition:width .26s var(--ease)}.download{display:block;width:100%;text-align:center;margin-top:12px;padding:11px;border-radius:9px;border:1px solid var(--rail);font-family:var(--font-data);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);text-decoration:none;transition:background .18s var(--ease),border-color .18s var(--ease)}.download:hover{background:#ffffff0d;border-color:var(--chrome-dim)}.flow{animation:flow 1.1s linear infinite}@keyframes flow{to{stroke-dashoffset:-28}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}@media(max-width:1080px){.shell{grid-template-columns:170px minmax(0,1fr);grid-template-rows:56px minmax(0,1fr) auto;grid-template-areas:"brand header" "rack canvas" "monitor monitor"}.monitor{border-left:none;border-top:1px solid var(--rail-soft);max-height:44vh}}.switch{width:52px;text-align:center}.switch__body{width:26px;height:42px;margin:0 auto;padding:3px;border-radius:7px;display:block;background:linear-gradient(180deg,#141010,#2a231e);box-shadow:inset 0 2px 5px #000000bf,0 1px #ffffff24}.switch__lever{display:block;width:20px;height:18px;border-radius:5px;background:linear-gradient(180deg,#f2eee8,#9c9389 62%,#6b635a);box-shadow:0 2px 4px #00000080,inset 0 1px #ffffffb3;transform:translateY(18px);transition:transform .16s var(--ease)}.switch__body[data-on=true] .switch__lever{transform:translateY(0)}.pedal__head{display:flex;align-items:flex-start;gap:8px}.pedal__mark{flex:none;color:#ffffffe6;margin-top:1px}.pedal__tools{position:absolute;top:5px;right:17px;display:flex;gap:2px}.pedal__tool{width:19px;height:19px;border-radius:50%;display:grid;place-items:center;font-family:var(--font-data);font-size:11px;line-height:1;color:#ffffff80;opacity:0;transition:opacity .16s var(--ease),color .16s var(--ease),background .16s var(--ease)}.pedal:hover .pedal__tool,.pedal__tool:focus-visible{opacity:1}.pedal__tool:hover{color:#fff;background:#0000004d}.pedal__tool[aria-expanded=true]{opacity:1;color:#fff;background:#00000059}.info{position:absolute;top:calc(100% + 12px);left:-14px;width:268px;z-index:40;padding:14px 15px 12px;border-radius:11px;color:var(--ink);background:#14100df7;border:1px solid var(--rail);box-shadow:0 18px 44px #0009;animation:info-in .18s var(--ease);cursor:default}@keyframes info-in{0%{opacity:0;transform:translateY(-6px)}}.info[data-flip=true]{top:auto;bottom:calc(100% + 12px)}.info:before{content:"";position:absolute;top:-6px;left:26px;width:10px;height:10px;background:#14100df7;border-left:1px solid var(--rail);border-top:1px solid var(--rail);transform:rotate(45deg)}.info[data-flip=true]:before{top:auto;bottom:-6px;border:none;border-right:1px solid var(--rail);border-bottom:1px solid var(--rail)}.info__head{display:flex;align-items:center;gap:9px;margin-bottom:10px;color:var(--accent)}.info__name{font-family:var(--font-display);font-size:13px;color:var(--ink)}.info__tag{font-family:var(--font-data);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--chrome-dim)}.info__close{margin-left:auto;align-self:flex-start;color:var(--chrome-dim);font-size:16px;line-height:1;width:20px;height:20px;border-radius:50%}.info__close:hover{color:var(--ink);background:#ffffff12}.info__body{margin:0 0 12px;font-size:12.5px;line-height:1.55;color:#d9d1c6}.info__params{margin:0;display:grid;gap:8px}.info__params>div{display:grid;grid-template-columns:62px minmax(0,1fr);gap:9px}.info__params dt{font-family:var(--font-data);font-size:9.5px;letter-spacing:.08em;color:var(--accent);padding-top:1px}.info__params dd{margin:0;font-size:11.5px;line-height:1.5;color:#c4bcb1}.info__range{color:var(--chrome-dim);font-family:var(--font-data);font-size:10px}.info__foot{margin-top:12px;padding-top:10px;border-top:1px solid var(--rail-soft);font-family:var(--font-data);font-size:9.5px;letter-spacing:.05em;color:var(--chrome-dim)}.canvas[data-linking=out] .jack-port--in,.canvas[data-linking=out] .terminal__ring[data-jack-in],.canvas[data-linking=in] .jack-port--out,.canvas[data-linking=in] .terminal__ring[data-jack-out]{box-shadow:inset 0 -1px 3px #000000b3,0 0 0 3px #cbc3b873,0 0 16px #cbc3b84d;animation:seek 1.3s ease-in-out infinite}@keyframes seek{50%{box-shadow:inset 0 -1px 3px #000000b3,0 0 0 5px #cbc3b847,0 0 22px #cbc3b86b}}.canvas[data-linking=out] .pedal__knobs,.canvas[data-linking=in] .pedal__knobs{opacity:.45;transition:opacity .2s var(--ease)}.dropzone__inner{animation:rise .62s var(--ease) both}.dropzone .jack{animation:rise .62s var(--ease) 60ms both}.shell>*{animation:settle .42s var(--ease) both}.shell>.canvas{animation-delay:60ms}.shell>.monitor{animation-delay:.11s}@keyframes rise{0%{opacity:0;transform:translateY(14px)}}@keyframes settle{0%{opacity:0}}.pedal{animation:drop .34s var(--ease) both}@keyframes drop{0%{opacity:0;transform:translateY(-16px) scale(.96)}}.shell,.dropzone{-webkit-user-select:none;user-select:none}.info,.info *{-webkit-user-select:text;user-select:text}.info__warn{margin:0 0 12px;padding:8px 10px;border-radius:7px;background:#ff9f1c1a;border:1px solid rgb(255 159 28 / .3);color:#f0c489;font-size:11.5px;line-height:1.5}