@font-face{font-family:Outfit;src:url("assets/fonts/outfit-variable.ttf") format("truetype");font-weight:100 900;font-display:swap}
:root{color-scheme:light;--bg:#faf8fa;--surface:#fff;--border:#dfd3e2;--muted:#725b7a;--ink:#43234f;--accent:#986da6;--pink:#ffa9c2;--lavender:#e8ddea}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:14px Outfit,"Century Gothic","Segoe UI",sans-serif}
button,input,select{font:inherit;accent-color:var(--ink)}
button,select{min-height:42px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--ink)}
button{padding:10px 16px;cursor:pointer;transition:background .15s,transform .15s}
button:hover{background:var(--lavender)}
button:active{transform:translateY(1px)}
button:disabled{opacity:.5;cursor:wait}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline}
button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #b04374;outline-offset:3px}
select{padding:8px 28px 8px 10px;width:100%}
input[type=number]{width:55px;min-height:30px;border:1px solid var(--border);border-radius:5px;background:#fff;color:inherit;padding:4px}
input[type=range]{width:100%;min-height:28px;cursor:pointer;margin:2px 0}
[hidden]{display:none!important}
.topbar{background:var(--ink);color:white;display:flex;justify-content:space-between;align-items:center;padding:22px max(32px,calc((100vw - 1200px)/2));gap:12px}
.brand{font-size:17px;font-weight:650;letter-spacing:1px;display:flex;align-items:center;gap:12px}
.brand span:not(.brand-icon){font-size:10px;letter-spacing:2px;font-weight:400;color:#e4cde9}
.brand-icon{display:grid;place-items:center;border:1px solid #ddc2e7;border-radius:50%;width:30px;height:30px;color:var(--pink);font-size:22px;letter-spacing:-2px}
.manual-link{font-size:12px;color:#f2e6f4;white-space:nowrap}
main{max-width:1280px;margin:auto;padding:38px 36px}
.intro{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 0 30px;border-bottom:2px solid var(--ink);margin-bottom:24px}
.eyebrow{letter-spacing:2px;font-size:10px;font-weight:650;color:var(--accent);margin:0 0 12px}
h1{font-size:clamp(54px,6vw,80px);line-height:1;letter-spacing:2px;font-weight:350;margin:0}
.model-mark{font-size:17px;font-weight:700;letter-spacing:-.5px;display:inline-block;border:1px solid var(--accent);padding:5px;vertical-align:middle}
.subtitle{font-size:17px;line-height:1.5;font-weight:500;margin:17px 0 0}
.subtitle em{color:#885195;font-style:normal}
.edition{font-size:9px;line-height:2;letter-spacing:1.5px;text-align:right;align-self:end;padding-bottom:4px}
.edition strong{letter-spacing:.5px;font-weight:500;color:var(--accent);font-size:12px}
.intro-art{position:absolute;width:230px;height:180px;left:52%;top:0;z-index:-1;overflow:hidden}
.intro-art span{position:absolute;width:156px;height:156px;border-radius:50%;background:repeating-linear-gradient(130deg,var(--pink) 0 3px,transparent 3px 9px);left:6px;top:0}
.intro-art span+span{left:70px;top:22px;background:repeating-linear-gradient(40deg,var(--accent) 0 2px,transparent 2px 8px)}
.intro-art i{position:absolute;left:60px;top:44px;width:105px;height:105px;border:1px solid var(--ink);border-radius:50%}
.card{background:var(--surface);border:1px solid var(--border);border-radius:12px}
.connection{padding:18px 20px;display:flex;align-items:center;gap:18px;margin-bottom:30px}
.connection-heading{display:flex;align-items:center;gap:12px;margin-right:auto;min-width:200px}
.connection-heading strong{font-size:14px;font-weight:600}
.connection-heading small{display:block;color:var(--muted);font-size:11px;margin-top:4px;max-width:245px}
.status-dot{width:9px;height:9px;flex-shrink:0;background:#b4a2bb;border-radius:50%}
.status-dot.ready{background:#369c4e;box-shadow:0 0 0 4px #e0f1e3}
.status-dot.demo{background:#b77726;box-shadow:0 0 0 4px #fff0dc}
.primary{background:var(--ink);color:white;font-weight:550;white-space:nowrap;border-color:var(--ink)}
.primary:hover{background:#684173}
.primary span{margin-left:12px;color:var(--pink)}
.compact{font-size:10px;letter-spacing:.6px;color:var(--muted);min-width:170px}
.compact select{margin-top:4px;font-size:12px;letter-spacing:0;background:var(--bg)}
.compact.channel{min-width:70px}
.demo-switch{display:flex;align-items:center;gap:7px;white-space:nowrap;font-size:12px}
.notification{background:#ffe9ef;border:1px solid #d187a4;color:#722443;padding:14px 18px;border-radius:8px;margin-bottom:24px;line-height:1.6}
.workspace{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:34px;align-items:start}
.workspace>*,.bottom-grid>*{min-width:0}
.section-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:11px;font-weight:650;letter-spacing:1px;padding:0 0 12px;border-bottom:2px solid var(--ink)}
.tag{padding:5px 8px;background:var(--lavender);border-radius:4px;font-size:9px;font-weight:500;letter-spacing:.3px}
.bank-description{font-size:11px;line-height:1.6;color:var(--muted);min-height:34px;margin:12px 0}
.pedal-stage{display:flex;justify-content:center;padding:12px 0 20px}
.pedal{width:380px;max-width:100%;padding:25px 18px 14px;border:3px solid var(--ink);border-radius:18px;background:#91649e;color:#fff;position:relative;box-shadow:6px 7px 0 #e0d0e4;transition:background .2s}
.screw{position:absolute;top:10px;width:6px;height:6px;border-radius:50%;border:1px solid #f7e9f9}
.screw-left{left:13px}.screw-right{right:13px}
.knob-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px 8px}
.physical-control{min-width:0;text-align:center}
.physical-control label{display:flex;flex-direction:column;gap:3px;align-items:center;font-size:10px;font-weight:650;letter-spacing:.2px;line-height:1.3}
.physical-control .cc-badge{font-size:8px;color:#fff;background:#43234f55;border:0;padding:2px 5px}
.knob{width:64px;height:64px;margin:0 auto 10px;border:2px solid var(--ink);border-radius:50%;position:relative;background:#f8f3f9;box-shadow:0 0 0 4px #ffffff18;touch-action:none;cursor:grab}
.knob:active{cursor:grabbing}
.knob-mark{position:absolute;inset:6px;transform:rotate(var(--rotation,0deg))}
.knob-mark:before{content:"";position:absolute;left:calc(50% - 1.5px);top:0;width:3px;height:22px;background:var(--ink);border-radius:3px}
.physical-control input[type=range]{accent-color:var(--ink)}
.value-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.readout{font-size:11px;color:var(--muted);white-space:nowrap}
.physical-control .value-row{gap:2px}
.physical-control .readout{font-size:9px;color:#fff;letter-spacing:-.2px}
.physical-control input[type=number]{width:40px;min-height:25px;background:#f5eaf7;color:var(--ink);border-color:#e3c7eb;font-size:10px;padding:2px}
.pedal-toggles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:17px}
.pedal select{background:#f4e9f6;border:1px solid var(--ink);color:var(--ink);font-weight:550;font-size:10px;min-height:36px;padding:7px 2px;cursor:pointer}
.pedal select option{background:#fff}
.pedal-toggles label{margin-bottom:6px}
.pedal-toggles .control:before{content:"";display:block;width:13px;height:20px;border:2px solid var(--ink);border-radius:8px;background:#fff;margin:0 auto 8px;transform:rotate(-20deg)}
.pedal-art{height:107px;position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;overflow:hidden;margin:12px 0 3px}
.orbit{position:absolute;width:150px;height:92px;border-radius:50%;transform:rotate(-15deg)}
.orbit-one{left:20px;background:repeating-linear-gradient(120deg,#43234f 0 2px,transparent 2px 6px)}
.orbit-two{right:12px;background:repeating-linear-gradient(35deg,#ffa9c2 0 2px,transparent 2px 6px)}
.pedal-art strong{font-size:43px;font-weight:350;letter-spacing:3px;color:#fff;z-index:1;background:#91649eb3;padding:0 4px}
.pedal-art sup{font-size:9px;letter-spacing:0;position:absolute;margin:10px 0 0}
.pedal-art small{z-index:1;font-size:8px;letter-spacing:2px;color:#fff}
.preset-toggle{position:absolute;bottom:73px;left:calc(50% - 34px);width:68px;z-index:2;text-align:center}
.preset-toggle label{font-size:8px;letter-spacing:1px}
.preset-toggle select{font-size:8px;min-height:28px}
.footswitches{display:flex;justify-content:space-between;padding:0 8px}
.footswitches .control{width:82px}
.footswitches label{margin-bottom:8px}
.footswitches button{background:none;border:0;padding:0;display:flex;flex-direction:column;align-items:center;width:100%;gap:7px;color:#fff}
.metal-switch{width:50px;height:50px;border-radius:50%;border:3px solid var(--ink);background:#fff;box-shadow:inset 0 0 0 5px #fff,inset 0 0 0 7px var(--ink)}
.led{width:9px;height:9px;border-radius:50%;background:#fff;border:2px solid var(--ink)}
.active .led{background:#38b64d;border-color:#fff;box-shadow:0 0 0 2px #38b64d}
.footswitches .toggle-state{font-size:9px;font-weight:650;color:#fff}
.pedal-bottom{font-size:7px;letter-spacing:2px;display:flex;justify-content:center;gap:16px;margin-top:12px}
.pedal-tip{text-align:center;font-size:11px;line-height:1.7;color:var(--muted);margin:8px 0 18px}
.hidden-mode{background:#fff;color:var(--accent);border-color:var(--accent);box-shadow:6px 7px 0 #fbdce6}
.hidden-mode .knob{background:#fff;border-color:var(--ink);box-shadow:none}
.hidden-mode .physical-control .cc-badge{background:var(--lavender);color:var(--ink)}
.hidden-mode .physical-control .readout{color:var(--ink)}
.hidden-mode .pedal-art strong{background:#fff9;color:var(--ink)}
.hidden-mode .pedal-art small,.hidden-mode .footswitches button,.hidden-mode .footswitches .toggle-state{color:var(--ink)}
.hidden-mode .screw{border-color:var(--accent)}
.hidden-mode .knob-grid .control:nth-child(3n){color:#a44367}
.hidden-mode [data-cc="26"] .knob{outline:3px dotted var(--accent);outline-offset:4px}
.hidden-mode [data-cc="29"] .knob{outline:1px solid var(--accent);outline-offset:5px}
.pedal:not(.hidden-mode) [data-position="14"],.pedal:not(.hidden-mode) [data-position="17"],.pedal:not(.hidden-mode) [data-position="21"]{border-inline:1px solid #43234f66}
.pedal:not(.hidden-mode) [data-position="16"],.pedal:not(.hidden-mode) [data-position="19"],.pedal:not(.hidden-mode) [data-position="23"]{border-inline:1px dashed #ffd7e4}
.signal-card{background:var(--lavender);border-radius:8px;padding:15px 16px;display:flex;flex-direction:column;gap:7px;margin-bottom:14px}
.signal-card>span{font-size:9px;letter-spacing:1.5px;font-weight:600;color:var(--muted)}
.signal-card strong{font-size:13px;font-weight:550;overflow-wrap:anywhere}
.signal-card small{font-size:10px;color:var(--muted)}
.state-note{display:flex;gap:12px;align-items:start;border-top:1px solid var(--border);padding:13px 0;color:var(--muted);font-size:11px;line-height:1.7}
.state-note p{margin:0}.state-note strong{color:var(--ink);font-weight:600}
.stale .readout:before,.stale .cc-badge:before{content:"~ "}
.control-area{padding:26px;min-height:600px}
.panel-heading{display:flex;justify-content:space-between;align-items:center;padding-bottom:12px;border-bottom:2px solid var(--ink)}
.panel-heading .eyebrow{font-size:9px;margin-bottom:7px}
h2{font-size:27px;font-weight:600;letter-spacing:-.7px;margin:0}
.panel-icon{font-size:36px;color:var(--accent)}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--border);padding:14px 0 0;margin-bottom:22px;overflow-x:auto}
.tabs button{border:0;border-radius:5px 5px 0 0;background:none;padding:10px 12px;font-size:13px;font-weight:500;white-space:nowrap}
.tabs button[aria-selected=true]{color:var(--ink);background:var(--lavender);box-shadow:inset 0 -3px var(--accent)}
h3{font-size:20px;font-weight:600;margin:0 0 8px;letter-spacing:-.3px}
.panel-description{font-size:12px;color:var(--muted);line-height:1.65;margin:0 0 20px}
.control-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.control-grid .control{border:1px solid var(--border);border-radius:8px;padding:12px;background:#fbf9fc;min-width:0}
.control:not(.physical-control)>label{display:flex;justify-content:space-between;gap:8px;align-items:center;font-size:12px;font-weight:500;margin-bottom:9px;line-height:1.4}
.cc-badge{color:var(--muted);font-size:9px;font-weight:400;white-space:nowrap;border:1px solid var(--border);border-radius:4px;padding:2px 4px}
.control-grid .control button{width:100%}
.control-grid .toggle button{display:flex;align-items:center;justify-content:space-between;background:transparent;border:0;padding:4px 0;min-height:30px}
.switch-track{width:34px;height:19px;border-radius:20px;background:#d9cedd;position:relative}
.switch-track:before{content:"";position:absolute;width:13px;height:13px;top:3px;left:3px;border-radius:50%;background:#fff;transition:left .15s}
.active .switch-track{background:var(--accent)}
.active .switch-track:before{left:18px;background:#fff}
.toggle-state{font-size:10px;color:var(--muted)}
.active .toggle-state{color:var(--ink);font-weight:600}
.control-group[data-group^="dip-"] .switch-track{width:20px;height:36px;border:3px solid #fa4053;background:var(--ink);border-radius:0}
.control-group[data-group^="dip-"] .switch-track:before{width:10px;height:13px;left:2px;top:16px;border-radius:1px;transition:top .15s}
.control-group[data-group^="dip-"] .active .switch-track:before{left:2px;top:2px}
.control-grid select{font-size:12px;min-height:38px}
.hint{font-size:11px;color:var(--muted);line-height:1.65;margin:8px 0 0}
.action-button{font-size:12px;background:var(--lavender);font-weight:500}
h4{font-size:12px;color:var(--accent);font-weight:650;margin:24px 0 12px}
.control-group:first-of-type h4{margin-top:0}
.mode-section{margin-bottom:24px}
.mode-channel h4{display:flex;align-items:center;gap:7px;margin:15px 0 10px;font-size:13px;border-bottom:1px solid var(--border);padding-bottom:8px;color:var(--ink)}
.mode-channel h4:before{content:"";width:10px;height:13px;border-radius:70% 25% 65% 65%;transform:rotate(-35deg);background:var(--accent)}
.loop-channel h4:before{width:12px;height:12px;transform:none;border:2px solid #b0476b;background:none;border-top-color:transparent;border-radius:50%}
.mode-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.mode-card{display:flex;align-items:center;flex-direction:column;padding:10px 7px;gap:6px;border:1px solid var(--border);background:#fff;min-width:0;text-align:center}
.mode-card svg{width:100%;max-width:100px;height:52px;color:var(--accent)}
.mode-card strong{font-size:11px;letter-spacing:.7px;font-weight:600}
.mode-card span{font-size:10px;line-height:1.35;color:var(--muted)}
.mode-card[aria-pressed=true]{background:var(--lavender);border-color:var(--accent)}
.loop-channel .mode-card[aria-pressed=true]{background:#ffe6ee;border-color:#bc6381}
.loop-channel .mode-card svg{color:#ac5275}
.mode-card.stale strong:before{content:"~ "}
.mode-description{font-size:11px;line-height:1.6;background:#f6f1f7;border-radius:6px;padding:10px 12px;margin:10px 0 18px;color:var(--muted)}
.loop-channel .mode-description{background:#fff0f5}
.hidden-diagram{display:flex;align-items:center;gap:18px;background:var(--lavender);border-radius:8px;padding:12px 16px;margin-bottom:18px}
.hidden-diagram svg{width:100px;flex-shrink:0;color:var(--accent)}
.hidden-diagram strong{font-size:13px;font-weight:550}
.hidden-diagram p{font-size:11px;line-height:1.5;color:var(--muted);margin:5px 0}
.keyboard-section{margin-bottom:24px}
.keyboard-section h4{margin-top:0}
.velocity-label{font-size:12px;display:flex;align-items:center;gap:12px}
.velocity-label input{max-width:160px}
.keyboard{display:flex;gap:3px;margin:12px 0 8px;align-items:start;height:96px}
.keyboard button{padding:0 0 10px;display:flex;align-items:end;justify-content:center;font-size:10px;flex:1;border-radius:0 0 6px 6px;touch-action:none;user-select:none;min-width:0}
.white-key{height:96px;background:#fff;color:var(--ink)}
.black-key{height:66px;background:var(--ink);color:#fff}
.black-key:hover{background:#704980}
.keyboard .playing{background:var(--pink);color:var(--ink)}
.preset-actions{display:flex;align-items:end;gap:10px;margin:12px 0}
.preset-actions label{font-size:11px;display:flex;flex-direction:column;gap:6px}
.preset-actions input{width:65px;min-height:42px}
.preset-actions button{font-size:12px;padding:10px}
.danger-outline{color:#8b3354;border-color:#d99ab1;font-size:12px;background:#fff1f5}
.danger{background:#933857;color:#fff}
.danger:hover{background:#ae5271}
.bottom-grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:34px;margin-top:28px;align-items:start}
.guide,.activity{padding:20px}
summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;font-size:14px;font-weight:550}
summary::-webkit-details-marker{display:none}
summary span{color:var(--accent)}
.guide ol{padding-left:18px;margin-top:20px;font-size:12px;line-height:1.8;color:var(--muted)}
.guide li{padding-bottom:10px}
.guide>p{font-size:11px;line-height:1.8;color:var(--muted)}
.activity-heading{display:flex;justify-content:space-between;align-items:center}
.activity h3{font-size:14px;margin:0}
.text-button{background:none;border:0;color:var(--muted);font-size:11px;padding:6px;min-height:30px}
#monitor-empty{font-size:12px;color:var(--muted)}
#log{padding:0;list-style:none;margin:12px 0 0}
#log li{display:flex;justify-content:space-between;gap:8px;border-top:1px solid var(--border);padding:9px 0;font-size:11px}
#log strong{font-weight:500}
#log code{color:var(--muted);font-size:10px;white-space:nowrap}
footer{max-width:1280px;margin:auto;padding:20px 36px 30px;border-top:1px solid var(--border);display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:11px;line-height:1.7}
dialog{max-width:440px;width:calc(100% - 32px);border:1px solid var(--accent);border-radius:12px;background:#fff;color:var(--ink);padding:28px}
dialog::backdrop{background:#43234f88;backdrop-filter:blur(4px)}
dialog p:not(.eyebrow){font-size:14px;line-height:1.7;color:var(--muted)}
.dialog-actions{display:flex;justify-content:end;gap:12px;margin-top:24px}
@media(max-width:1050px){.connection{flex-wrap:wrap}.connection-heading{flex:1}.compact{flex:1}.compact.channel{flex:0 0 70px}.demo-switch{margin-left:auto}.workspace,.bottom-grid{gap:22px}.control-area{padding:20px}.tabs button{padding:10px 8px;font-size:12px}.intro-art{left:48%}.mode-card span{font-size:9px}}
@media(max-width:760px){.topbar{padding:20px}.brand span:not(.brand-icon){font-size:8px}.manual-link{font-size:10px}main{padding:28px 20px}.intro{margin-bottom:24px;min-height:180px}.intro-art{width:150px;height:150px;left:auto;right:0;opacity:.45}.intro-art span{width:120px;height:120px}.intro-art span+span{left:35px}.intro-art i{left:40px;top:35px;width:85px;height:85px}.edition{display:none}.subtitle{font-size:15px}.connection{padding:16px;gap:12px}.connection-heading{min-width:150px}.compact{min-width:130px}.workspace,.bottom-grid{grid-template-columns:minmax(0,1fr)}.pedal-area{max-width:500px;width:100%;margin:auto}.control-area{min-height:0}.tabs{justify-content:space-between}.tabs button{padding:10px 8px}.bottom-grid{margin-top:22px}footer{padding:20px;flex-direction:column;gap:8px}}
@media(max-width:380px){main{padding:24px 12px}.topbar{padding:16px 12px}.brand{gap:7px;font-size:15px}.pedal{padding:24px 12px 14px}.knob{width:56px;height:56px}.control-area{padding:16px}.control-grid{gap:9px}.control-grid .control{padding:9px}.tabs button{font-size:11px;padding:10px 5px}.readout{font-size:10px}.preset-actions{gap:6px}.preset-actions button{font-size:11px}.mode-card{padding:8px 4px}.hidden-diagram{gap:10px;padding:10px}.hidden-diagram svg{width:80px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.theme-lost-found{--bg:#f6f7ef;--border:#cdd7c5;--muted:#506754;--ink:#193c32;--accent:#628d69;--pink:#dce76a;--lavender:#e3ecd9;--pedal:#63946b;--knob:#202e25;--knob-line:#dce76a}
.theme-generation-loss-mkii{--bg:#f3f6f6;--border:#d1dcdf;--muted:#4d6670;--ink:#31535f;--accent:#709daa;--pink:#e6c47e;--lavender:#e0ebee;--pedal:#91b5c1;--knob:#f9f8f1;--knob-line:#31535f}
.theme-bad-mood{--bg:#f5f5f2;--border:#d3d3cf;--muted:#62625f;--ink:#252525;--accent:#757570;--pink:#dadad0;--lavender:#e5e5df;--pedal:#28282c;--knob:#161619;--knob-line:#f4f4e7}
body:not(.theme-mood-mkii) .pedal{background:var(--pedal);box-shadow:6px 7px 0 var(--lavender)}
body:not(.theme-mood-mkii) .knob{background:var(--knob);border-color:#26332e}
body:not(.theme-mood-mkii) .knob-mark:before{background:var(--knob-line)}
body:not(.theme-mood-mkii) .pedal-art strong{background:transparent;font-weight:700}
body:not(.theme-mood-mkii) .pedal-art sup{display:none}
body:not(.theme-mood-mkii) .pedal select,body:not(.theme-mood-mkii) .physical-control input[type=number]{background:var(--lavender);border-color:var(--border)}
body:not(.theme-mood-mkii) .pedal .readout{white-space:normal;overflow-wrap:anywhere;max-width:65px}
body:not(.theme-mood-mkii) .pedal .orbit{display:none}
body:not(.theme-mood-mkii) .control-grid .control,body:not(.theme-mood-mkii) .mode-description{background:var(--bg)}
body:not(.theme-mood-mkii) .loop-channel .mode-card svg{color:var(--accent)}
body:not(.theme-mood-mkii) .loop-channel .mode-card[aria-pressed=true],body:not(.theme-mood-mkii) .loop-channel .mode-description{background:var(--lavender);border-color:var(--accent)}
.theme-lost-found .pedal-art strong{max-width:240px;font-size:34px;line-height:1.1;letter-spacing:6px;text-align:center;color:#f5f0cc;transform:rotate(-3deg)}
.theme-lost-found .pedal-art{background:radial-gradient(circle at 8% 25%,#dbdf60 0 8px,transparent 9px),radial-gradient(circle at 92% 70%,#c7d969 0 10px,transparent 11px)}
.theme-lost-found .pedal .physical-control label{color:#edf1b4}
body.theme-generation-loss-mkii .pedal{background:linear-gradient(180deg,var(--pedal) 0 56%,#e7ece8 85%);color:var(--ink)}
.theme-generation-loss-mkii .pedal-art{background:linear-gradient(95deg,transparent 5%,#edf1e9 5% 8%,transparent 8% 11%,#edf1e9 11% 18%,transparent 18% 22%,#edf1e9 22% 25%,transparent 25% 28%,#edf1e9 28% 43%,transparent 43% 50%,#edf1e9 50% 55%,transparent 55% 60%,#edf1e9 60% 72%,transparent 72% 77%,#edf1e9 77% 90%,transparent 90%);border-bottom:2px solid #e9efe9}
.theme-generation-loss-mkii .pedal-art strong{font-size:29px;line-height:1;letter-spacing:-1px;color:var(--ink);text-align:center}
.theme-generation-loss-mkii .pedal-art small{color:var(--ink)}
body.theme-bad-mood .pedal{background:repeating-radial-gradient(ellipse at 15% 75%,#27272b 0 3px,#414146 3px 4px,#27272b 4px 8px)}
.theme-bad-mood .pedal-art strong{font-size:40px;letter-spacing:1px}
body:not(.theme-mood-mkii) .hidden-mode{background:var(--surface);color:var(--ink)}
body:not(.theme-mood-mkii) .hidden-mode .physical-control label,body:not(.theme-mood-mkii) .hidden-mode .pedal-art strong{color:var(--ink)}
.theme-generation-loss-mkii .pedal:not(.hidden-mode) .readout,.theme-generation-loss-mkii .pedal:not(.hidden-mode) .footswitches .toggle-state{color:var(--ink)}
.model-note{font-size:11px;line-height:1.7;color:var(--muted);padding:12px;background:var(--lavender);border-radius:8px}
.mode-tools{border-block:1px solid var(--border);padding:14px 0;margin:0 0 22px;display:grid;gap:12px}
.mode-tools label{font-size:12px;display:grid;gap:6px;color:var(--muted)}
.mode-tools button[aria-pressed=true]{background:var(--lavender);border-color:var(--accent)}
.effect-row{display:flex;flex-wrap:wrap;gap:7px}
.effect-row h4,.effect-row .hint{width:100%;margin:4px 0}
.effect-row button{flex:1;font-size:11px;padding:9px 6px;min-width:82px}
.mode-tools select.stale{border-style:dashed}
.selection-intro{padding:20px 0 36px;border-bottom:2px solid var(--ink);margin-bottom:32px}
.selection-intro h1{font-size:clamp(42px,6vw,76px);letter-spacing:-2px;font-weight:500;line-height:1.08}
.selection-intro h1 em{font-style:normal;color:var(--accent)}
.selection-intro>p:last-child{font-size:17px;line-height:1.7;color:var(--muted)}
.pedal-library{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.pedal-choice{color:var(--ink);border:1px solid var(--border);border-radius:16px;overflow:hidden;background:var(--bg);display:grid;grid-template-columns:45% 55%;transition:box-shadow .2s,transform .2s}
.pedal-choice:hover{box-shadow:0 8px 24px #302d3f14;transform:translateY(-3px);text-decoration:none}
.mini-stage{background:var(--lavender);padding:32px 18px;display:flex;align-items:center;justify-content:center}
.mini-pedal{width:160px;height:277px;border:2px solid var(--ink);border-radius:12px;background:var(--pedal,#91649e);box-shadow:5px 6px 0 #00000012;padding:18px 13px 12px;position:relative}
.mini-knobs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px 10px}
.mini-knobs i{display:block;width:30px;height:30px;border-radius:50%;background:var(--knob,#f8f3f9);border:2px solid #29312e;position:relative}
.mini-knobs i:before{content:"";position:absolute;top:1px;left:12px;width:2px;height:11px;background:var(--knob-line,#43234f)}
.mini-toggles{display:flex;justify-content:space-between;padding:15px 9px}
.mini-toggles i{width:6px;height:16px;background:#edece5;border:1px solid var(--ink);border-radius:4px;transform:rotate(-15deg)}
.mini-logo{text-align:center;color:#fff;font-size:22px;letter-spacing:1px;line-height:1;font-weight:650;padding:12px 0}
.mini-logo small{display:block;font-size:8px;letter-spacing:2px;margin-top:6px}
.mini-switches{display:flex;justify-content:space-between;margin:12px 2px 0}
.mini-switches i{width:31px;height:31px;border:3px solid #dad9d1;border-radius:50%;background:linear-gradient(120deg,#b0b0a9,#f7f8f3,#90938a)}
.theme-lost-found .mini-logo{color:#f7f2ca;transform:rotate(-4deg)}
.theme-generation-loss-mkii .mini-pedal{background:linear-gradient(180deg,var(--pedal) 45%,#e8eeea 80%)}
.theme-generation-loss-mkii .mini-logo{color:var(--ink);font-size:18px;letter-spacing:-.5px;background:repeating-linear-gradient(90deg,#ffffff50 0 3px,transparent 3px 9px)}
.theme-bad-mood .mini-pedal{background:repeating-radial-gradient(ellipse at 25% 75%,#27272b 0 3px,#414146 3px 4px,#27272b 4px 8px)}
.choice-content{padding:30px 22px;display:flex;flex-direction:column;justify-content:center;align-items:start;gap:12px;min-width:0}
.choice-content .eyebrow{margin:0;color:var(--muted)}
.choice-content h2{font-size:27px;line-height:1.05}
.choice-content p{font-size:13px;line-height:1.6;color:var(--muted);margin:0}
.choice-meta{font-size:10px;color:var(--muted)}
.choice-open{font-size:12px;font-weight:550;border-bottom:1px solid var(--accent);padding-bottom:4px;margin-top:7px}
.selection-note{max-width:720px;font-size:12px;line-height:1.7;color:var(--muted);margin:32px auto 4px;text-align:center}
.selection-note strong{color:var(--ink)}.selection-note p{margin:8px 0}
@media(max-width:1050px){body:not(.theme-mood-mkii) h1{font-size:clamp(36px,5vw,60px);letter-spacing:0}.pedal-choice{grid-template-columns:42% 58%}.mini-stage{padding:26px 10px}.choice-content{padding:24px 16px}.choice-content h2{font-size:23px}}
@media(max-width:760px){.pedal-library{grid-template-columns:1fr}.pedal-choice{grid-template-columns:40% 60%}.mini-pedal{width:142px;height:264px}.mini-knobs{gap:16px 6px}.choice-content h2{font-size:26px}.selection-intro h1{letter-spacing:-1px}.selection-intro>p:last-child{font-size:15px}body:not(.theme-mood-mkii) .intro{min-height:150px}body:not(.theme-mood-mkii) .intro-art{opacity:.2}}
@media(max-width:380px){.mini-stage{padding:20px 8px}.mini-pedal{width:120px;height:234px;padding:16px 9px 10px}.mini-knobs i{width:25px;height:25px}.mini-knobs i:before{left:10px}.mini-logo{font-size:18px}.theme-generation-loss-mkii .mini-logo{font-size:15px}.choice-content{padding:18px 12px}.choice-content h2{font-size:22px}.choice-content p{font-size:12px}}
.selection-page{--bg:#f4f4f0;--ink:#20282a;--muted:#596264;--border:#d3d8d5;--accent:#547d79;--pink:#dce4dd;--lavender:#e7ece8}
.selection-page .brand-icon{border-color:#83938e;color:#dce4dd;letter-spacing:0;border-radius:6px}
.selection-page .selection-intro{position:relative;isolation:isolate;overflow:hidden;padding:28px 0 42px}
.selection-page .selection-intro h1{font-size:clamp(35px,5vw,64px);letter-spacing:-1.5px;font-weight:550;max-width:850px}
.selection-page .selection-intro h1 em{color:var(--muted)}
.hub-art{position:absolute;z-index:-1;right:0;top:16px;width:220px;height:190px;opacity:.18;background:repeating-linear-gradient(90deg,transparent 0 10px,#547d79 10px 12px,transparent 12px 23px);mask-image:linear-gradient(0deg,transparent,#000,transparent);transform:skewY(-12deg)}
.selection-page .pedal-choice{background:#fff;border-color:#d3d8d5}
.selection-page .choice-content{color:#20282a;background:#fff}
.selection-page .choice-content .eyebrow,.selection-page .choice-content p{color:#596264}
.selection-page .choice-open{border-color:#91a19d}
.selection-page .mini-stage{background:#e7ece8}
.manual-links{display:flex;align-items:center;gap:22px}
.control{position:relative}
.control-help{position:absolute;right:5px;top:5px;border:0;background:transparent;color:var(--muted);font-size:10px;font-weight:650;padding:0;width:22px;min-height:22px;line-height:22px;border-radius:50%;z-index:1}
.control:not(.physical-control)>label{padding-right:20px}
.physical-control .control-help{color:currentColor;background:#ffffff22;right:0;top:0}
.physical-control:not(.range) .control-help{top:-4px}
.control-help:hover,.control-help:focus-visible{background:var(--lavender);color:var(--ink)}
.control-tooltip{position:fixed;z-index:100;width:min(320px,calc(100vw - 16px));max-height:calc(100vh - 16px);overflow:auto;background:var(--ink);color:white;border-radius:9px;padding:13px 15px;box-shadow:0 6px 26px #00000030;font-size:12px;line-height:1.65;animation:tooltip-in .1s ease-out}
@keyframes tooltip-in{from{opacity:0}to{opacity:1}}
.technical-switch{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:11px;border-top:1px solid var(--border);margin-top:24px;padding-top:12px}
body:not(.technical-view) .control input[type=number]{display:none}
.technical-view .control:after{content:"CC " attr(data-cc);font-size:9px;color:var(--muted);display:block;text-align:right;margin-top:4px}
.technical-view .physical-control:after{color:inherit;text-align:center}
.stale select{border-style:dashed}
.stale>label span:after{content:" ~";font-weight:400}
.physical-control .readout{white-space:normal;overflow-wrap:anywhere;max-width:100%!important}
.physical-control .value-row{justify-content:center;min-height:21px}
.technical-view .physical-control .value-row{justify-content:space-between}
.state-note{font-size:11px;padding:10px 0}
.preset-quick{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 18px;margin:-10px 0 28px}
.current-preset{display:grid;gap:4px;min-width:0}
.current-preset>span{font-size:9px;letter-spacing:1.5px;color:var(--muted)}
.current-preset strong{font-size:17px;font-weight:600;overflow-wrap:anywhere}
.current-preset small{font-size:11px;color:var(--muted)}
.quick-preset-actions{display:flex;gap:8px;flex-shrink:0}
.quick-preset-actions button{font-size:12px;min-height:40px;padding:8px 12px}
.preset-library-heading{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.preset-library-heading h3{margin:0}
.library-files{display:flex;gap:6px}
.library-files button{font-size:11px;padding:6px 10px;min-height:32px}
.library-filters{display:flex;align-items:center;gap:16px;margin:14px 0}
.library-filters label:first-child{flex:1;min-width:0}
.preset-manager label{font-size:11px;color:var(--muted)}
.preset-manager input:not([type=checkbox]),.preset-manager textarea{width:100%;min-height:38px;background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:8px;color:var(--ink);font:inherit}
.favorite-filter,.preset-favorite{display:flex;gap:6px;align-items:center;white-space:nowrap}
.preset-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.preset-tile{text-align:left;display:flex;flex-direction:column;gap:6px;min-width:0;padding:10px;min-height:70px}
.preset-tile small{font-size:10px;color:var(--muted)}
.preset-tile strong{font-size:12px;font-weight:550;overflow-wrap:anywhere}
.preset-tile[aria-pressed=true]{background:var(--lavender);border-color:var(--accent)}
.preset-tile.current{box-shadow:inset 0 -3px var(--accent)}
.library-pagination{display:flex;justify-content:center;align-items:center;gap:12px;margin:14px 0}
.library-pagination span{font-size:11px;color:var(--muted)}
.library-pagination button{min-height:30px;padding:5px 10px}
.preset-editor{border-block:1px solid var(--border);padding:18px 0;margin-bottom:22px}
.preset-editor-heading{display:grid;grid-template-columns:62px minmax(0,1fr);gap:10px;margin-bottom:12px}
.preset-editor .preset-favorite{grid-column:1/-1}
.preset-editor>label{display:grid;gap:6px}
.preset-editor textarea{resize:vertical}
.preset-editor .preset-actions{flex-wrap:wrap;align-items:center}
.preset-editor .preset-actions button{flex:1;min-width:90px;font-size:11px}
#preset-save-control .control>label{display:none}
#preset-save-control .control>button:not(.control-help){width:100%}
#preset-save-control .control{padding-right:28px}
.preset-local-status{font-size:11px;color:var(--muted);line-height:1.5}
#preset-setlist{padding:0;list-style:none;display:grid;gap:8px}
#preset-setlist li{display:flex;gap:5px;min-width:0}
#preset-setlist .setlist-play{flex:1;min-width:0;text-align:left;display:flex;flex-direction:column;font-size:12px;overflow-wrap:anywhere}
.setlist-play small{font-size:9px;color:var(--muted);margin-top:4px}
.setlist-play[aria-current=true]{background:var(--lavender);border-color:var(--accent)}
#preset-setlist li>button:not(.setlist-play){padding:7px;min-width:32px}
#setlist-empty{font-size:12px;color:var(--muted);line-height:1.6}
.tabs button{padding-inline:8px}
button:disabled{cursor:default}
.control-bounds{display:flex;justify-content:space-between;gap:10px;font-size:9px;color:inherit;opacity:.8;margin-top:5px;line-height:1.4;text-align:left}
.control-bounds span:last-child{text-align:right}.control-possibilities{font-size:10px;line-height:1.5;margin:6px 0 0;opacity:.8}
.control-bounds span{min-width:0;overflow-wrap:anywhere;flex:1}
.pedal-control-deck{border:1px solid var(--border);border-radius:12px;padding:18px;margin-top:24px;background:var(--surface)}
.pedal-control-deck>label{display:grid;gap:8px;font-size:11px}.pedal-control-deck>label select{width:100%}
.pedal-control-deck .mode-section{margin:18px 0}.face-bank-buttons{display:flex;gap:8px}.face-bank-buttons button{flex:1;font-size:12px}
#face-controls>.control{margin-top:12px}
.face-bank-buttons button[aria-pressed=true]{background:var(--lavender);border-color:var(--accent)}
@media(max-width:760px){.manual-links{gap:12px}.preset-quick{flex-direction:column;align-items:stretch;gap:10px}.quick-preset-actions{flex-wrap:wrap}.quick-preset-actions button{flex:1}.current-preset{grid-template-columns:1fr auto}.current-preset>span{grid-column:1/-1}.preset-quick{margin-bottom:22px}.tabs{justify-content:start}.tabs button{padding-inline:8px;font-size:12px}}
@media(max-width:380px){.preset-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.library-filters{gap:8px}.tabs button{padding-inline:6px}.manual-links{gap:9px}.manual-link{font-size:9px}.quick-preset-actions button{font-size:11px;padding-inline:8px}}