:root{color-scheme:dark;--bg: #07090c;--panel: #11151b;--panel-2: #181e26;--text: #f4f6f8;--muted: #8d97a5;--dim: #4d5661;--on: #2dd4a0;--on-text: #03140e;--off: #2a313b;--off-text: #6b7583;--unknown: #1b2028;--accent: #5aa9ff;--warn: #ffb454;--error: #ff5c6c;--radius: 18px;--fx-overdrive: #ff6a00;--fx-compressor: #4cf06a;--fx-modulation: #3a0cf5;--fx-delay: #00f0d8;--fx-reverb: #3d9bff;--fx-pitch: #ffd23f;--fx-wah-filter: #f050c8;--fx-utility: #f2f2f2;--fx-utility-eq: #f2f2f2;--fx-gate: #94a3b8;--fx-cab: #ef4444;--fx-unknown: #a8a29e;--fx-none: #2dd4a0;--fx-text: #0b0d10;font-family:Inter,SF Pro Display,Helvetica Neue,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);-webkit-tap-highlight-color:transparent;overscroll-behavior:none}body{overflow:hidden;user-select:none;-webkit-user-select:none}#app{height:100dvh;width:100%;max-width:100vw;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr auto auto;padding:max(10px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));gap:12px}button{font:inherit;color:inherit;background:var(--panel-2);border:1px solid #242b35;border-radius:12px;padding:10px 16px;cursor:pointer;min-height:44px}button:hover{border-color:#3a4450}button:disabled{opacity:.4;cursor:default}button.primary{background:var(--accent);color:#041021;border-color:transparent;font-weight:700}button.ghost{background:transparent}button.warn{color:var(--warn);border-color:#ffb45480}.topbar{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px;min-height:44px;min-width:0}.status{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:15px;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dot{width:14px;height:14px;border-radius:50%;background:var(--dim);flex:none;box-shadow:0 0 0 3px #ffffff0a}.dot[data-state=connected]{background:var(--on);box-shadow:0 0 14px #2dd4a099}.dot[data-state=connecting],.dot[data-state=reconnecting]{background:var(--warn);animation:pulse 1s infinite alternate}@keyframes pulse{0%{opacity:.35}to{opacity:1}}.badge{font-size:11px;letter-spacing:.12em;text-transform:uppercase;padding:4px 8px;border-radius:6px;background:#1c2330;color:var(--muted);flex:none}.badge.warn{color:var(--warn);background:#ffb4541f}.topbar .actions{display:flex;flex-wrap:wrap;gap:8px;flex:none;max-width:100%}.topbar .actions button{padding:8px 12px;font-size:14px}.topbar .icon-btn{padding:8px 10px;display:inline-flex;align-items:center;justify-content:center}.topbar .icon-btn svg{width:22px;height:22px}.menu-wrap{position:relative}.menu{position:absolute;right:0;top:calc(100% + 6px);min-width:180px;background:var(--panel);border:1px solid #242b35;border-radius:14px;padding:6px;display:none;flex-direction:column;gap:2px;z-index:20;box-shadow:0 12px 32px #00000080}.menu.open{display:flex}.menu-info{padding:8px 14px 6px;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.menu-sep{height:1px;background:#1f2630;margin:2px 6px}.menu-sep.strong{background:#3a4453;margin:6px 6px 2px}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:16px;min-height:44px}.setting-row .menu-select{max-width:60%}.menu-check{width:24px;height:24px;accent-color:var(--accent)}.menu-select{font:inherit;color:inherit;background:var(--panel-2);border:1px solid #242b35;border-radius:10px;padding:8px 10px;min-height:40px}.menu-item{background:transparent;border:none;border-radius:10px;text-align:left;padding:12px 14px;font-size:16px;min-height:44px;display:flex;align-items:center;gap:12px}.menu-item svg{width:20px;height:20px;flex:none;opacity:.85}.menu-item:hover{background:var(--panel-2)}.menu-item.danger{color:var(--error)}.menu-item.danger svg{color:var(--error);opacity:1}.preset{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;text-align:left;min-height:0;min-width:0;padding:0 8px;gap:8px}.fit-probe{position:absolute;visibility:hidden;pointer-events:none;white-space:nowrap;font-size:100px;line-height:1;left:0;top:0}.fit-probe>span{display:inline-block}.preset-row{display:flex;align-items:baseline;gap:.35em;width:100%;min-width:0;font-size:12vh;line-height:1.02}.slot-label{font-weight:800;letter-spacing:.02em;white-space:nowrap;flex:none}.slot-slot[data-slot="0"]{color:#ff5c5c}.slot-slot[data-slot="1"]{color:#ffb454}.slot-slot[data-slot="2"]{color:#4cf06a}.slot-slot[data-slot="3"]{color:#00f0d8}.slot-slot[data-slot="4"]{color:#3d9bff}.slot-slot[data-slot="5"]{color:#a78bfa}.slot-slot[data-slot="6"]{color:#f050c8}.slot-slot[data-slot="7"]{color:#f4f6f8}.slot-num{font-size:.4em;font-weight:600;color:var(--muted);letter-spacing:.04em;margin-left:.2em}.preset-name{font-weight:800;letter-spacing:-.02em;font-size:.8em;opacity:.9;min-width:0;flex:1 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-left:.25em}.preset-name.empty{color:var(--dim);font-weight:600}.preset-row .src{flex:none;font-size:.18em;letter-spacing:.12em;text-transform:uppercase;padding:4px 10px;border-radius:8px;background:#1c2330;color:var(--muted);align-self:center}.preset-row .src[data-source=inferred]{color:var(--warn);background:#ffb4541f}.preset-row .src[data-source=optimistic]{color:var(--accent);background:#5aa9ff1f}.preset-sub{font-size:clamp(16px,2.6vw,30px);color:var(--muted);display:flex;gap:18px;flex-wrap:wrap;justify-content:flex-start;align-items:center;background:#ffffff1a;padding:2px 10px;width:100%}.preset-sub .sep{color:var(--dim)}.preset-sub .lbl{font-size:.6em;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-right:8px;border:1px solid;border-radius:3px;padding:1px 3px}.blocks{display:flex;flex-direction:column;gap:10px;min-width:0}.hsep{height:1px;background:#3a4453}.gate-row{display:flex;align-items:center;gap:14px}.gate-row .t-slot{font-size:clamp(11px,1.2vw,15px);letter-spacing:.22em;text-transform:uppercase;font-weight:600;color:var(--muted);padding-left:6px}.tile.gate-btn{flex:none;width:clamp(56px,6vw,84px);min-height:0;height:clamp(34px,4.2vh,46px);padding:0;border-radius:12px}.tile.gate-btn .t-icon{width:clamp(18px,2vw,26px);height:auto;display:block}.tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr)) 1px repeat(3,minmax(0,1fr));min-width:0;gap:10px;min-height:clamp(90px,16vh,170px)}.vsep{width:1px;background:#3a4453;align-self:stretch}.tile-wrap{display:flex;flex-direction:column;gap:6px;min-width:0}.tile-wrap .t-slot{font-size:clamp(11px,1.2vw,15px);letter-spacing:.22em;text-transform:uppercase;font-weight:600;color:var(--muted);text-align:left;padding-left:6px}.tile-wrap .tile{flex:1}.tile{border-radius:var(--radius);background:var(--unknown);border:2px solid transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:10px 4px;color:var(--off-text);transition:background .12s ease,color .12s ease,transform 80ms ease;min-width:0;cursor:default}.tile{--fx: var(--fx-none)}.tile[data-cat=overdrive]{--fx: var(--fx-overdrive)}.tile[data-cat=compressor]{--fx: var(--fx-compressor)}.tile[data-cat=modulation]{--fx: var(--fx-modulation)}.tile[data-cat=delay]{--fx: var(--fx-delay)}.tile[data-cat=reverb]{--fx: var(--fx-reverb)}.tile[data-cat=pitch]{--fx: var(--fx-pitch)}.tile[data-cat=wah-filter]{--fx: var(--fx-wah-filter)}.tile[data-cat=utility]{--fx: var(--fx-utility)}.tile[data-cat=utility-eq]{--fx: var(--fx-utility-eq)}.tile[data-cat=gate]{--fx: var(--fx-gate)}.tile[data-cat=cab]{--fx: var(--fx-cab)}.tile[data-cat=unknown]{--fx: var(--fx-unknown)}.tile[data-on=true]{background:var(--fx);color:var(--fx-text)}.tile[data-on=true][data-cat=modulation]{color:#f4f6f8}.tile[data-on=true]{box-shadow:0 0 28px color-mix(in srgb,var(--fx) 40%,transparent)}.tile[data-on=false]{background:var(--off);color:var(--off-text);border-color:color-mix(in srgb,var(--fx) 45%,transparent);box-shadow:inset 0 4px color-mix(in srgb,var(--fx) 55%,transparent)}.tile[data-on=unknown]{background:var(--unknown);color:var(--dim);border-style:dashed;border-color:#262d37}.tile,.tile:disabled{opacity:1}.tile.writable{cursor:pointer}.tile.writable:active{transform:scale(.97)}.tile .t-cat{font-size:clamp(15px,1.6vw,30px);font-weight:800;letter-spacing:.02em;line-height:1.05;text-align:center;text-transform:uppercase;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 6px;min-height:1.05em}.tile .t-name{font-size:clamp(10px,1.2vw,15px);letter-spacing:.06em;opacity:.75;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 6px;min-height:1.2em}.tile.empty .t-name,.tile[data-cat=unknown] .t-name,.tile[data-cat=none] .t-name{font-size:clamp(15px,1.6vw,30px);font-weight:700;opacity:.6}.footer{display:flex;align-items:center;gap:12px;color:var(--dim);font-size:13px;min-height:36px;min-width:0}.footer .footer-info{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.footer .spacer{flex:1}.nav{display:none;gap:10px}.nav.visible{display:flex}.nav button{font-size:18px;padding:8px 22px}.console{position:fixed;inset:auto 0 0 0;max-height:45vh;background:#080a0df5;border-top:1px solid #222a34;display:none;flex-direction:column;font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;font-size:12px}.console.open{display:flex}.console .c-head{display:flex;gap:8px;align-items:center;padding:6px 12px;color:var(--muted);border-bottom:1px solid #1a212b}.console .c-head .spacer{flex:1}.console .c-head button{min-height:28px;padding:2px 10px;font-size:12px}.console .c-body{overflow:auto;padding:6px 12px 12px;user-select:text;-webkit-user-select:text}.console .line{white-space:pre-wrap;word-break:break-all;color:var(--muted);line-height:1.45}.console .line[data-dir=tx]{color:var(--accent)}.console .line[data-dir=rx]{color:#b9c2cf}.console .line[data-dir=warn]{color:var(--warn)}.console .line[data-dir=error]{color:var(--error)}.console .line .ts{color:var(--dim);margin-right:8px}.overlay.settings{z-index:30}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#07090ceb;display:none;align-items:center;justify-content:center;padding:24px}.overlay.open{display:flex}.card{background:var(--panel);border:1px solid #1f2630;border-radius:24px;padding:32px;max-width:560px;width:100%;display:flex;flex-direction:column;gap:18px}.card h1{margin:0;font-size:28px;letter-spacing:-.01em}.card p{margin:0;color:var(--muted);line-height:1.5;font-size:15px}.card .row{display:flex;gap:10px;flex-wrap:wrap}.card .row button{flex:1;min-width:160px;font-size:16px}.card .err{color:var(--error);font-size:14px;white-space:pre-wrap}.card .hint{font-size:13px;color:var(--dim)}@media (max-width: 700px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr)) 1px repeat(3,minmax(0,1fr));gap:6px}}