:root{--bg-base:#eee;--panel-bg:#ffffff73;--panel-border:#000;--accent-orange:#ff4500;--accent-yellow:#fc0;--accent-blue:#0bf;--text-primary:#000;--text-secondary:#666;--border-color:#ccc;--amber:var(--accent-yellow);--cyan:var(--accent-blue);--cyan-soft:#00bbff1f;--font-display:"Outfit", "Arial Narrow", "Roboto Condensed", Impact, system-ui, sans-serif;--font-mono:"JetBrains Mono", "SFMono-Regular", Consolas, monospace;--font-sans:"Outfit", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--ink:#151713;--ink-muted:#5e665e;--line:#1416143d;--line-strong:#f3f0e538;--muted:#a7b0a9;--panel:#f3f0e5;--panel-low:#dfdccf;--panel-top:#e6e2d5;--paper:#f8f4e8;--red:var(--accent-orange);--shell:#141714;--shell-plastic:#d7d2bd;background:var(--bg-base);color:var(--text-primary);font-family:var(--font-sans);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5}*{box-sizing:border-box}body{background-color:var(--bg-base);color:var(--text-primary);min-width:320px;margin:0}.te-grid-bg{z-index:2;pointer-events:none;background-image:linear-gradient(#00000005 1px,#0000 1px),linear-gradient(90deg,#00000005 1px,#0000 1px);background-size:30px 30px;width:100%;height:100%;position:fixed;top:0;left:0}.te-laser-axis{z-index:2;pointer-events:none;background:#ff450014;width:1px;height:100%;position:fixed;top:0;left:50%}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent}::selection{background:var(--cyan);color:var(--ink)}.app-shell{background-color:#e5e4de;justify-content:center;align-items:center;min-height:100svh;padding:40px 18px;display:flex;position:relative;overflow-y:auto}.te-grid-bg{pointer-events:none;z-index:1;background-image:linear-gradient(#00000008 1px,#0000 1px),linear-gradient(90deg,#00000008 1px,#0000 1px);background-size:24px 24px;width:100%;height:100%;position:fixed;top:0;left:0}.te-laser-axis{pointer-events:none;z-index:1;background:#ff45001f;width:1px;height:100%;position:fixed;top:0;left:50%}.device-shell{--ink:#1a1918;--ink-muted:#666560;--line:#1a1918;--chassis-bg:#f5f4ef;background:var(--chassis-bg);border:3px solid var(--ink);box-shadow:12px 12px 0px var(--ink);color:var(--ink);z-index:10;border-radius:14px;flex-direction:column;width:100%;max-width:580px;padding:24px 24px 36px;display:flex;position:relative}.po-hanger{justify-content:center;width:100%;margin-top:-46px;margin-bottom:12px;display:flex}.po-hanger-loop{border:3px solid var(--ink);background:0 0;border-bottom:none;border-radius:32px 32px 0 0;width:64px;height:38px;position:relative}.po-hanger-loop:after{content:"";border:3px solid var(--ink);background:#e5e4de;border-radius:50%;width:22px;height:22px;position:absolute;top:14px;left:18px}.shell-top{align-items:stretch;gap:12px;width:100%;margin-bottom:16px;display:flex}.cartridge-slot{border:2.5px solid var(--ink);box-shadow:4px 4px 0px var(--ink);background:#ffffffa6;flex:1;justify-content:space-between;align-items:center;padding:10px 16px;display:flex}.brand-lockup{align-items:center;gap:10px;display:flex}.brand-lockup svg{color:var(--accent-orange)}h1{font-family:var(--font-display);letter-spacing:-.03em;margin:0;font-size:1.8rem;font-weight:900;line-height:.9}.brand-lockup span{letter-spacing:.1em;color:var(--ink-muted);font-size:.62rem;font-weight:700}.cart-label{border:1.5px solid var(--ink);letter-spacing:.08em;padding:1px 4px;font-size:.55rem;font-weight:800}.github-link{border:2.5px solid var(--ink);box-shadow:4px 4px 0px var(--ink);color:var(--ink);background:#fff;justify-content:center;align-items:center;gap:6px;padding:0 14px;font-size:.7rem;font-weight:800;text-decoration:none;transition:all .1s;display:flex}.github-link:hover,.github-link:focus-visible{box-shadow:5px 5px 0px var(--accent-orange);outline:none;transform:translate(-1px,-1px)}.hardware-section-header{font-family:var(--font-mono);letter-spacing:.16em;color:var(--ink-muted);text-transform:uppercase;align-items:center;margin-top:20px;margin-bottom:8px;font-size:.58rem;font-weight:900;display:flex}.hardware-section-header:after{content:"";background-image:linear-gradient(to right, var(--ink) 30%, transparent 30%);opacity:.35;background-size:6px 1px;flex:1;height:1px;margin-left:8px}.knobs-grid{border:2px solid var(--ink);box-shadow:4px 4px 0px var(--ink);background:#ffffff73;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:8px;padding:14px 10px;display:grid}.knob-container{flex-direction:column;align-items:center;gap:4px;display:flex}.knob-label{font-family:var(--font-mono);color:var(--ink-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.52rem;font-weight:800}.knob-body{border:2.5px solid var(--ink);cursor:grab;touch-action:none;background:#fff;border-radius:50%;width:42px;height:42px;position:relative;box-shadow:0 3px 6px #0000001a,inset 0 -2px #00000026}.knob-body:active{cursor:grabbing}.knob-body.dragging{border-color:var(--accent-orange)}.knob-track{background:var(--ink);border-radius:50%;width:4px;height:4px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.knob-pointer{transform-origin:50% 17px;border-radius:50%;width:5px;height:5px;position:absolute;top:4px;left:50%;transform:translate(-50%)}.knob-pointer.knob-yellow{background:var(--accent-yellow)}.knob-pointer.knob-orange{background:var(--accent-orange)}.knob-pointer.knob-blue{background:var(--accent-blue)}.knob-pointer.knob-cyan{background:#2ee6de}.knob-value{font-family:var(--font-mono);color:var(--ink);font-size:.58rem;font-weight:800}.mixer-layout{grid-template-columns:210px 1fr;align-items:start;gap:16px;display:grid}.matrix-grid-container{flex-direction:column;gap:8px;display:flex}.matrix-heading{font-family:var(--font-mono);text-transform:uppercase;color:var(--ink-muted);letter-spacing:.08em;border-bottom:1.5px solid var(--ink);padding-bottom:2px;font-size:.52rem;font-weight:800}.matrix-grid{border:2px solid var(--ink);background:#0000000a;border-radius:6px;grid-template-rows:repeat(4,1fr);grid-template-columns:repeat(4,1fr);gap:10px;padding:12px;display:grid}.matrix-key{border:2px solid var(--ink);width:36px;height:36px;box-shadow:0px 3px 0px var(--ink);cursor:pointer;background:#fff;border-radius:50%;justify-content:center;align-items:center;padding:0;transition:all 80ms;display:flex;position:relative}.matrix-key:active{box-shadow:0px 1px 0px var(--ink);transform:translateY(2px)}.matrix-key.is-selected{box-shadow:0px 3px 0px var(--ink), 0 0 0 2px var(--accent-orange);border-width:3px}.key-number{font-family:var(--font-mono);color:var(--ink);font-size:.65rem;font-weight:900}.key-led{background:var(--chan-color,#777);width:4px;height:4px;box-shadow:0 0 4px var(--chan-color);border-radius:50%;position:absolute;top:4px;right:4px}.matrix-key.is-playing{background:var(--chan-color);border-color:var(--ink)}.matrix-key.is-playing .key-number{color:#fff}.matrix-key.is-empty{opacity:.28;cursor:default;background:#e5e4de}.matrix-key.is-empty:active{box-shadow:0px 3px 0px var(--ink);transform:none}.matrix-key.is-muted{opacity:.45;background:#eae9e0}.matrix-key.is-soloed{animation:.6s infinite alternate key-solo-blink}@keyframes key-solo-blink{0%{border-color:var(--ink)}to{border-color:var(--accent-yellow)}}.focused-channel-strip{border:2px solid var(--ink);box-shadow:4px 4px 0px var(--ink);background:#fff;flex-direction:column;gap:10px;min-height:196px;padding:12px;transition:all .15s;display:flex}.focused-channel-strip.is-idle{opacity:.6;background:#fff3;justify-content:center;align-items:center}.inspector-header{border-bottom:1.5px dashed #ccc;justify-content:space-between;align-items:center;padding-bottom:6px;display:flex}.inspector-title{align-items:center;gap:6px;display:flex}.inspector-led{background:var(--channel-color,#777);width:8px;height:8px;box-shadow:0 0 6px var(--channel-color);border-radius:50%}.inspector-title strong{font-family:var(--font-mono);font-size:.8rem;font-weight:900}.inspector-inst-label{font-family:var(--font-mono);text-transform:uppercase;color:var(--ink-muted);text-overflow:ellipsis;white-space:nowrap;background:#f0eee5;border-radius:2px;max-width:110px;padding:2px 5px;font-size:.52rem;font-weight:800;overflow:hidden}.inspector-controls{flex-direction:column;gap:8px;display:flex}.inspector-row{justify-content:space-between;align-items:center;gap:8px;display:flex}.inspector-row label{font-family:var(--font-mono);text-transform:uppercase;color:var(--ink-muted);font-size:.58rem;font-weight:900}.inspector-select{font-family:var(--font-mono);border:1.5px solid var(--ink);cursor:pointer;background:#fff;outline:none;height:22px;padding:0 4px;font-size:.55rem;font-weight:800}.pan-display-wrapper{flex:1;justify-content:flex-end;align-items:center;gap:8px;display:flex}.inspector-pan-slider{appearance:none;background:#e0ded4;outline:none;flex:1;max-width:80px;height:4px}.inspector-pan-slider::-webkit-slider-thumb{appearance:none;background:var(--ink);cursor:pointer;border:1px solid #fff;border-radius:50%;width:10px;height:10px}.inspector-volume-container{justify-content:space-between;align-items:center;margin:6px 0;display:flex}.vol-label{font-family:var(--font-mono);color:var(--ink-muted);font-size:.58rem;font-weight:900}.vertical-fader-track{border:1.5px solid var(--ink);background:#eae9e0;justify-content:center;align-items:center;width:32px;height:64px;display:flex;position:relative}.inspector-vol-fader{appearance:none;cursor:pointer;background:0 0;outline:none;width:60px;height:6px;position:absolute;transform:rotate(-90deg)}.inspector-vol-fader::-webkit-slider-thumb{appearance:none;background:var(--accent-orange);border:1.5px solid var(--ink);cursor:pointer;border-radius:0;width:22px;height:10px;box-shadow:0 1px 3px #0000004d}.inspector-vol-fader::-moz-range-thumb{background:var(--accent-orange);border:1.5px solid var(--ink);cursor:pointer;border-radius:0;width:22px;height:10px;box-shadow:0 1px 3px #0000004d}.inspector-val-readout{font-family:var(--font-mono);text-align:right;min-width:24px;font-size:.65rem;font-weight:900}.inspector-buttons{gap:8px;display:flex}.inspector-btn{border:1.5px solid var(--ink);height:24px;font-family:var(--font-mono);box-shadow:0px 2px 0px var(--ink);cursor:pointer;background:#fff;flex:1;font-size:.58rem;font-weight:900;transition:all 50ms}.inspector-btn:active{box-shadow:0px 1px 0px var(--ink);transform:translateY(1px)}.inspector-btn.active{background:var(--ink);color:#fff}.inspector-btn.btn-solo.active{background:var(--accent-yellow);color:#000}.inspector-btn.btn-mute.active{background:var(--accent-orange);color:#fff}.inspector-footer{text-align:center;font-family:var(--font-mono);color:var(--ink-muted);border-top:1.5px dashed #ccc;padding-top:6px;font-size:.48rem;font-weight:800}.inspector-empty-msg{font-family:var(--font-mono);text-align:center;color:var(--ink-muted);font-size:.62rem;line-height:1.3}.hardware-controls{grid-template-columns:auto 1fr auto;align-items:center;gap:16px;margin-top:10px;display:grid}.dpad{grid-template:".up."28px"left center right"28px".down."28px/36px 36px 36px;gap:2px;display:grid}.dpad-button,.dpad-center{border:2px solid var(--ink);box-shadow:0px 2px 0px var(--ink);cursor:pointer;font-family:var(--font-mono);background:#fff;justify-content:center;align-items:center;padding:0;font-size:.45rem;font-weight:900;display:flex}.dpad-button:active,.dpad-center:active{box-shadow:0px 1px 0px var(--ink);transform:translateY(1px)}.dpad-left{border-radius:4px 0 0 4px;grid-area:left}.dpad-right{border-radius:0 4px 4px 0;grid-area:right}.dpad-up{border-radius:4px 4px 0 0;grid-area:up}.dpad-down{border-radius:0 0 4px 4px;grid-area:down}.dpad-center{background:#e0ded4;grid-area:center}.system-buttons{justify-content:center;gap:12px;display:flex}.system-buttons button{border:2px solid var(--ink);box-shadow:0px 2.5px 0px var(--ink);cursor:pointer;font-family:var(--font-mono);text-transform:uppercase;background:#e0ded4;border-radius:12px;padding:3px 12px;font-size:.52rem;font-weight:900}.system-buttons button:active{box-shadow:0px 1px 0px var(--ink);transform:translateY(1.5px)}.action-cluster{gap:12px;display:flex}.action-button{border:2px solid var(--ink);box-shadow:0px 3.5px 0px var(--ink);cursor:pointer;background:#fff;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;width:44px;height:44px;padding:0;display:flex}.action-button:active{box-shadow:0px 1px 0px var(--ink);transform:translateY(2.5px)}.action-button.button-b{background:var(--accent-blue);color:#fff}.action-button.button-a{background:var(--accent-orange);color:#fff}.action-button strong{font-size:.72rem;font-weight:900}.action-button span{text-transform:uppercase;margin-top:-2px;font-size:.42rem;font-weight:800}@media (width<=580px){.app-shell{padding:16px 8px}.device-shell{padding:16px 14px 24px}.mixer-layout{grid-template-columns:1fr;gap:14px}.focused-channel-strip{min-height:auto}.matrix-grid{justify-content:center}}.screen-bezel{background:#0d0f0d;border:3.5px solid #1a1918;border-radius:8px;padding:12px;position:relative;overflow:hidden;box-shadow:inset 0 4px 12px #000000f2,inset 0 1px 3px #0009,0 1px #ffffff1f}.screen-bezel:before{content:"";pointer-events:none;z-index:15;background:linear-gradient(#ffffff0f 0%,#0000 100%);height:50%;position:absolute;top:0;left:0;right:0}.bezel-header{color:#6a7065;font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;justify-content:space-between;align-items:center;margin-bottom:8px;font-size:.62rem;font-weight:800;display:flex}.power-led-group{align-items:center;gap:6px;display:flex}.power-led{background:#f2554f;border-radius:50%;width:6px;height:6px;box-shadow:0 0 10px #f2554fd9}.bezel-header strong{color:#c9cfc5}.error-line{color:#ff8e8a;font-family:var(--font-mono);background:#f2554f33;border:1.5px solid #f2554f;align-items:center;gap:8px;margin-bottom:8px;padding:6px 10px;font-size:.62rem;font-weight:700;display:flex}.workbench{background:#141812;border:1.5px solid #232c1f;flex-direction:column;gap:8px;padding:8px;display:flex;position:relative}.workbench:after{content:"";pointer-events:none;z-index:12;opacity:.7;background:linear-gradient(#12101000 50%,#00000040 50%) 0 0/100% 3px,linear-gradient(90deg,#ff00000f,#00ff0005,#0000ff0f) 0 0/3px 100%;width:100%;height:100%;position:absolute;top:0;left:0}.screen-visualizer-row{width:100%}.screen-data-row{grid-template-columns:1fr 1.05fr;gap:8px;width:100%;display:grid}.screen-transport-row{width:100%}.file-drop,.scope-panel,.data-panel,.transport-panel{color:#a4b39b;z-index:10;background:#14181266;border:1.5px solid #2a3525;position:relative}.panel-heading{background:#2a352566;border-bottom:1.5px solid #2a3525;justify-content:space-between;align-items:center;min-height:24px;padding:0 8px;display:flex}.panel-heading span{font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:#6a7e62;font-size:.52rem;font-weight:800}.panel-heading strong{font-family:var(--font-mono);color:#c0cfb9;text-overflow:ellipsis;white-space:nowrap;max-width:60%;font-size:.58rem;font-weight:900;overflow:hidden}.scope-panel{border-color:#35452f;width:100%}.scope-panel canvas{background:#11150f;width:100%;height:94px;display:block}.file-drop{flex-direction:column;display:flex}.drop-target{color:#8da482;cursor:pointer;font-family:var(--font-display);text-transform:uppercase;background:#11150f99;border:1.5px dashed #3e5038;justify-content:center;align-items:center;gap:6px;min-height:38px;margin:6px;font-size:.72rem;font-weight:900;transition:all .1s;display:flex}.drop-target:hover{color:#2ee6de;background:#2ee6de14;border-color:#2ee6de}.song-selector-container{padding:0 6px 6px}.song-select-wrapper{align-items:center;width:100%;display:flex;position:relative}.song-select-icon{color:#2ee6de;pointer-events:none;z-index:10;animation:4s linear infinite spin-disc;position:absolute;left:6px}@keyframes spin-disc{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.song-select{appearance:none;color:#2ee6de;cursor:pointer;font-family:var(--font-mono);background:#11150f;border:1.5px solid #2a3525;outline:none;width:100%;height:24px;padding:0 6px 0 22px;font-size:.58rem;font-weight:800}.song-select:hover,.song-select:focus-visible{border-color:#2ee6de}.song-select option{color:#2ee6de;background:#141812}.summary-grid{grid-template-columns:1fr auto;gap:2px 8px;padding:4px 8px 6px;display:grid}.summary-grid span{font-family:var(--font-mono);color:#6a7e62;text-transform:uppercase;font-size:.52rem;font-weight:700}.summary-grid strong{font-family:var(--font-mono);color:#a4b39b;text-align:right;font-size:.58rem;font-weight:900}.data-panel .summary-grid{gap:4px 8px;padding:8px}.transport-panel{flex-direction:column;display:flex}.transport-controls{grid-template-columns:28px 28px 1fr;gap:6px;padding:6px;display:grid}.icon-button,.export-button{color:#8fa482;cursor:pointer;min-height:24px;font-family:var(--font-mono);background:#1c231a;border:1.5px solid #32432c;justify-content:center;align-items:center;font-size:.55rem;font-weight:900;display:inline-flex}.icon-button:hover,.export-button:hover{color:#a4b39b;background:#253123;border-color:#4b6045}.icon-button svg{width:12px;height:12px}.icon-button.primary{color:#2ee6de;background:#2ee6de1a;border-color:#2ee6de}.icon-button.primary:hover{color:#fff;background:#2ee6de33}.export-button{text-transform:uppercase;gap:4px}.timeline{appearance:none;background:#11150f;outline:none;width:calc(100% - 12px);height:4px;margin:2px 6px 8px}.timeline::-webkit-slider-thumb{appearance:none;cursor:pointer;background:#2ee6de;border-radius:1px;width:8px;height:12px}.timeline::-moz-range-thumb{cursor:pointer;background:#2ee6de;border-radius:1px;width:8px;height:12px}button:disabled,input:disabled{opacity:.35;cursor:not-allowed}.sr-only{clip:rect(0, 0, 0, 0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (width<=480px){.screen-data-row{grid-template-columns:1fr}}