:root{color-scheme:dark;--page:#111513;--shell:#232826;--shell-top:#2b302d;--ink:#e9ece2;--muted:#868f85;--line:#363e37;--accent:#72dec2;--screen:#0c1611;--screen-ink:#b5c8a9;--control:#171c19;--shadow:#0009;font-family:Inter,"Segoe UI",Arial,sans-serif;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:var(--page);color:var(--ink);-webkit-font-smoothing:antialiased}button,input,a{-webkit-tap-highlight-color:transparent}button,a{color:inherit}button{font:inherit;cursor:pointer;border:0}button:disabled{opacity:.35;cursor:default}a{text-decoration:none}button:focus-visible,a:focus-visible,[tabindex]:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}button{transition:background .16s,transform .16s,color .16s}button:active{transform:translateY(1px)}.site-header{height:95px;max-width:1360px;margin:auto;padding:0 54px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff08}.wordmark{display:flex;align-items:center;font-size:27px;letter-spacing:-1.6px;font-weight:650;gap:8px}.wordmark svg{width:29px;height:29px;fill:none;stroke:var(--ink);stroke-width:1.8}.wordmark-dot{color:var(--accent);margin-left:-8px}.wordmark small{letter-spacing:2px;font:9px Consolas,monospace;border-left:1px solid var(--line);margin-left:13px;padding-left:19px;color:var(--muted)}nav{display:flex;align-items:center;gap:20px}nav a{font-size:11px;color:var(--muted);margin-right:9px}nav button{width:28px;height:28px;border-radius:50%;background:transparent;border:1px solid var(--line);color:var(--muted);font-size:15px}.instrument-layout{max-width:1210px;display:grid;grid-template-columns:1fr 432px 1fr;gap:58px;margin:52px auto 65px;padding:0 24px;align-items:start}.intro{padding-top:65px}.eyebrow{font:9px Consolas,monospace;letter-spacing:1.7px;color:var(--muted);display:flex;align-items:center;gap:8px}.eyebrow i,.device-live i{height:5px;width:5px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px #72dec250}.intro h1{font-size:38px;line-height:1.13;font-weight:450;letter-spacing:-1.7px;margin:25px 0}.intro>p{font-size:13px;line-height:1.9;color:var(--muted);letter-spacing:.1px}.intro-line{width:30px;height:1px;background:var(--line);margin:35px 0 24px}.intro-notes{display:flex;flex-direction:column;gap:12px;font:8px Consolas,monospace;letter-spacing:1.4px;color:#637063}.desktop-hint{margin-top:210px;font-size:11px;line-height:1.8;color:#b2baac}.desktop-hint span{color:var(--muted);font-size:10px}.pocket{background:linear-gradient(145deg,var(--shell-top),var(--shell) 57%);border-radius:23px 23px 54px 23px;border:1px solid #ffffff0c;box-shadow:0 24px 70px #0004,inset 0 1px #ffffff0b,inset -1px -3px #0003;padding:21px 23px 18px;position:relative;max-width:432px;width:100%}.device-top{display:flex;align-items:center;justify-content:space-between;margin:0 2px 18px;font-size:14px;letter-spacing:-.5px;font-weight:600}.device-top b{font-size:10px;letter-spacing:.1px;color:#b3bbaa;font-weight:400;margin-left:4px}.device-live{display:flex;align-items:center;gap:6px;font:7px Consolas,monospace;letter-spacing:1px;color:#b0bba2}.screen-bezel{padding:9px;background:#141a16;border:1px solid #070c09;border-radius:13px;box-shadow:0 2px 0 #ffffff09,inset 0 2px 8px #0005}.screen{width:100%;aspect-ratio:1;position:relative;overflow:hidden;background:var(--screen);border:1px solid #364732;border-radius:5px;isolation:isolate;color:var(--screen-ink)}.screen::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(transparent 0 3px,#00000008 3px 4px);pointer-events:none;z-index:4}.screen-top{position:absolute;top:17px;left:16px;right:14px;display:flex;justify-content:space-between;z-index:3}.screen-caption{display:block;font:6px Consolas,monospace;letter-spacing:1.5px;color:#70816c}.screen-top strong{font:10px Consolas,monospace;display:block;margin-top:6px;color:#c2d5b6}.screen-top strong span{color:#5c7455;font-size:9px}.view-switch{display:flex;background:#16241b;border:1px solid #293d2b;border-radius:4px;padding:2px;align-self:start;gap:1px}.view-switch button{background:transparent;color:#657b5e;padding:5px 8px;font:8px Consolas,monospace;border-radius:2px}.view-switch .active{background:#31432c;color:#72dec2}#scene{width:100%;height:79%;position:absolute;left:0;top:7%;touch-action:none;overflow:visible}#scene .node{cursor:pointer;outline:none}#scene .node-body{fill:#18251c;stroke:#4d6445;stroke-width:1}#scene .node.selected .node-body{fill:#2e4023;stroke:#72dec2;stroke-width:1.4}#scene .node text{fill:#a4b395;font:7.5px Consolas,monospace;pointer-events:none}#scene .node.selected .node-label{fill:#e1f5bf}#scene .node-label{font-size:8px;font-weight:600}#scene .node-meta{font-size:5px;letter-spacing:.8px;fill:#667c5c}#scene .node-meter{fill:#6c8d50}#scene .wire{fill:none;stroke:#3d5736;stroke-width:1}#scene .flow{stroke:#bddc8c;stroke-width:1.5;stroke-dasharray:2 22;animation:signal 3s linear infinite;opacity:.65;fill:none}#scene .node:focus-visible .node-body{stroke:#fff;stroke-width:2}#scene .node-side{fill:#101b13;stroke:#3e5734;stroke-width:.6}#scene .node-top{fill:#253a27;stroke:#4b6840;stroke-width:.6}#scene .scene-grid{fill:none;stroke:#658355;stroke-width:.5;opacity:.1}.screen-tools{position:absolute;left:13px;right:14px;bottom:66px;display:flex;gap:8px;align-items:center;font:7px Consolas,monospace;color:#718966}.screen-tools button{font:11px Consolas,monospace;color:#95b282;background:none;padding:0;width:15px;height:20px}.screen-tools>span:last-child{margin-left:auto;font-size:5.5px;letter-spacing:1px;color:#536c4d}.fixtures{position:absolute;left:16px;right:16px;bottom:13px;padding-top:10px;border-top:1px solid #273924;z-index:3}.fixture-caption{display:flex;justify-content:space-between;font:5.5px Consolas,monospace;letter-spacing:1px;color:#718266;margin-bottom:7px}#fixture-row{display:flex;justify-content:space-between;gap:2px}#fixture-row button{position:relative;width:20px;padding:4px 0 0;background:none;display:flex;flex-direction:column;align-items:center;gap:4px;color:#52624b;min-height:25px}#fixture-row i{height:5px;width:5px;border-radius:50%;background:var(--fixture-color,#72dec2);box-shadow:0 0 calc(var(--level,1)*8px) var(--fixture-color);opacity:calc(.2 + var(--level,1)*.8);display:block}#fixture-row .selected i{outline:1px solid #a4bb8a;outline-offset:4px}#fixture-row span{font:5px Consolas,monospace}#fixture-row .selected span{color:#b9d89f}.instrument-meta{display:flex;align-items:center;justify-content:space-between;margin:14px 2px 13px;font:7px Consolas,monospace;letter-spacing:1.5px;color:#9ba594}.instrument-meta button{background:none;color:#87917f;font:7px Consolas,monospace;letter-spacing:1px;padding:3px 0}.instrument-meta b{color:#c4ccbb;font-weight:400}.control-mode{display:flex;border-top:1px solid #ffffff0a;border-bottom:1px solid #0005;padding:9px 0;gap:5px}.control-mode button{flex:1;background:transparent;padding:8px;color:#606c60;font:6px Consolas,monospace;letter-spacing:.8px;border-radius:4px;display:flex;justify-content:center;align-items:center;gap:9px}.control-mode button span{font:10px "Segoe UI",sans-serif;letter-spacing:.2px;color:#8f9b87}.control-mode .active{background:#151c16;box-shadow:inset 0 1px 4px #0004,0 1px #ffffff09;color:#c8dfa9}.control-mode .active span{color:#d0e0bd}.parameter{padding:15px 3px 0}.parameter-label{display:flex;align-items:center;gap:8px;margin-bottom:5px;font:10px Consolas,monospace;color:#b1baa9}.parameter-label>button{background:none;color:#728469;padding:0 2px;font-size:15px}.parameter-label label{font-size:9px}.parameter-label #driver{margin-left:3px;color:#91aa7e;font-size:16px}.parameter-label output{margin-left:auto;color:#72dec2;font-size:13px;font-variant-numeric:tabular-nums}.physical-controls{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;gap:12px;margin-top:21px;min-height:107px}.dpad{width:102px;height:102px;display:grid;grid-template-columns:repeat(3,34px);grid-template-rows:repeat(3,34px);filter:drop-shadow(0 4px 2px #0007);justify-self:start}.dpad button,.dpad-center{background:#141a16;color:#64715d;display:grid;place-items:center;font-size:10px;box-shadow:inset 0 1px #ffffff06;border:1px solid #0d130e;touch-action:manipulation}.dpad button:active{background:#293624;color:#72dec2;transform:none}.dpad [data-direction=up]{grid-area:1/2;border-bottom:0;border-radius:5px 5px 0 0}.dpad [data-direction=left]{grid-area:2/1;border-right:0;border-radius:5px 0 0 5px}.dpad-center{grid-area:2/2;color:#252f23;border:0;font-size:22px;box-shadow:none}.dpad [data-direction=right]{grid-area:2/3;border-left:0;border-radius:0 5px 5px 0}.dpad [data-direction=down]{grid-area:3/2;border-top:0;border-radius:0 0 5px 5px}.encoder-wrap{display:flex;flex-direction:column;align-items:center;gap:11px}.encoder{width:73px;height:73px;border-radius:50%;background:repeating-conic-gradient(#343e30 0deg 3deg,#141b15 3deg 9deg);box-shadow:0 3px 8px #0006,inset 0 0 0 2px #171e17;display:grid;place-items:center;cursor:grab;touch-action:none}.encoder:active{cursor:grabbing}.encoder-inner{width:52px;height:52px;border-radius:50%;position:relative;background:linear-gradient(145deg,#2c3629,#1a231a);border:1px solid #48553c;box-shadow:inset 0 1px #82956c22}.encoder-inner i{position:absolute;inset:0;transform:rotate(var(--rotation,0deg))}.encoder-inner i::after{content:"";position:absolute;left:23px;top:5px;width:3px;height:8px;border-radius:2px;background:#c3d9a2}.encoder-inner span{position:absolute;inset:0;display:grid;place-items:center;color:#697e5b;font-size:16px}.hardware-label{font:5.5px Consolas,monospace;color:#738069;letter-spacing:1.7px}.action-keys{position:relative;height:103px;justify-self:end;width:98px}.action-keys>div{position:absolute;display:flex;flex-direction:column;align-items:center;gap:6px}.key-a{top:0;right:0}.key-b{bottom:0;left:0}.action-keys button{width:43px;height:43px;border-radius:50%;background:linear-gradient(145deg,#c7e699,#99b96e);border:1px solid #d5edac;color:#304125;font-size:16px;font-weight:650;box-shadow:0 4px 0 #536a3b,0 7px 12px #0004,inset 0 2px #f3ffd629;touch-action:manipulation}.key-b button{background:linear-gradient(145deg,#35412f,#242e23);border-color:#485b3d;color:#9bad8a;box-shadow:0 4px 0 #111b11,0 7px 10px #0004,inset 0 1px #ffffff09}.action-keys button:active{transform:translateY(3px);box-shadow:0 1px 0 #536a3b}.action-keys span{font:6px Consolas,monospace;letter-spacing:1px;color:#7b886e}.lower-controls{margin-top:22px;display:flex;align-items:center;justify-content:space-between}.lower-controls>button{background:#1a221a;border:1px solid #3a4733;padding:8px 10px;border-radius:5px;font:6px Consolas,monospace;letter-spacing:1.4px;color:#b3bda4;touch-action:none;user-select:none}.lower-controls #hold{display:flex;align-items:center;gap:7px}.lower-controls #hold i{width:4px;height:4px;background:#607751;border-radius:50%}.is-held #hold{background:#c3dfa1;color:#26391e;border-color:#dcf0bc}.is-held #hold i{background:#36552a;box-shadow:0 0 10px #27431c55}.transport{display:flex;gap:12px;align-items:center}.transport button{background:linear-gradient(#4a5344,#303a2b);border:1px solid #5b6550;width:29px;height:15px;border-radius:10px;transform:rotate(-17deg);color:#ccd7bd;font-size:10px;box-shadow:0 2px 0 #10180f}.transport button:active{transform:rotate(-17deg) translateY(1px)}#save span{margin-left:8px;color:#91aa7b}.device-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:20px;gap:5px}.device-bottom>span{font:6px Consolas,monospace;color:#6c7963;line-height:1.7;max-width:235px;letter-spacing:.2px}.speaker{display:flex;gap:4px;transform:rotate(-22deg);padding:0 5px 2px 0}.speaker i{width:3px;height:22px;border-radius:4px;background:#131a13;border-right:1px solid #ffffff08}.field-notes{padding-top:67px;min-width:0}.field-notes h2{font-size:29px;font-weight:400;letter-spacing:-.9px;margin:20px 0 10px}.field-notes>p{font-size:11px;line-height:1.8;color:var(--muted);max-width:180px;margin-bottom:28px}#focus-properties{border-top:1px solid var(--line);padding-top:6px}#focus-properties button{width:100%;padding:13px 0;background:none;text-align:left;display:flex;justify-content:space-between;color:var(--muted);font-size:10px;border-bottom:1px solid #ffffff05}#focus-properties button.active{color:var(--accent)}#focus-properties b{font:11px Consolas,monospace;font-weight:400}.live-readout{padding:26px 0 22px;border-bottom:1px solid var(--line)}.live-readout>span{font:7px Consolas,monospace;letter-spacing:1.3px;color:var(--muted)}.live-readout strong{display:block;font:30px Consolas,monospace;color:#c4d6ad;margin:10px 0}#waveform{width:100%;height:35px}#waveform path{stroke:#688153;stroke-width:1;fill:none}.quick-actions{padding:15px 0}.quick-actions button{background:none;display:flex;justify-content:space-between;width:100%;padding:10px 0;text-align:left;font-size:10px;color:var(--muted)}.quick-actions button span{color:#6f865d}.hold-card{border:1px solid var(--line);border-radius:6px;padding:15px;margin-top:28px}.hold-chip{display:inline-block;font:6px Consolas,monospace;letter-spacing:1px;color:#a1b68a;border:1px solid #4d5f40;border-radius:3px;padding:4px 6px}.hold-card p{font-size:11px;line-height:1.6;color:#bac3ae;margin:10px 0}.hold-card small{font:8px/2.1 Consolas,monospace;color:#6f7e64}.site-footer{border-top:1px solid #ffffff08;max-width:1250px;margin:auto;display:flex;justify-content:space-between;padding:23px 20px 27px;font:7px Consolas,monospace;letter-spacing:1px;color:#64705f}.site-footer i{margin:0 8px;font-style:normal}.site-footer>span:last-child{color:#8d9f7a}dialog{width:min(440px,calc(100% - 30px));border:1px solid #4b5c40;border-radius:15px;background:#1c251d;color:#dbe6d0;padding:23px;max-height:80dvh;box-shadow:0 30px 100px #0008}dialog::backdrop{background:#030a05b8;backdrop-filter:blur(7px)}.dialog-head{display:flex;justify-content:space-between;align-items:start;gap:20px}.dialog-head h2{font-size:24px;font-weight:450;margin:12px 0 22px;letter-spacing:-.6px}.dialog-head>button{background:none;color:#9cad8c;font-size:24px;padding:0}#menu-body{font-size:12px;line-height:1.8;color:#a7b89a}#menu-body button.menu-choice{display:flex;justify-content:space-between;align-items:center;width:100%;background:#243020;padding:13px 14px;border:1px solid #3c4f31;border-radius:6px;margin:7px 0;color:#d0e2bc;text-align:left;font-size:12px}#menu-body .menu-choice small{font:8px Consolas,monospace;color:#819d6b}#menu-body .menu-choice.danger{background:#382820;border-color:#694b37;color:#e5bea1}#menu-body .key-guide{display:grid;grid-template-columns:110px 1fr;gap:10px;font-size:10px}#menu-body .key-guide b{color:#d0e2bc;font-weight:400}#menu-body pre{white-space:pre-wrap;word-break:break-all;font:10px/1.7 Consolas,monospace;background:#121b13;padding:15px;border-radius:6px}#toast{position:fixed;bottom:23px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;padding:12px 18px;max-width:calc(100vw - 28px);width:max-content;background:#d5e7ba;color:#293b20;box-shadow:0 8px 30px #0006;border-radius:7px;font-size:11px;transition:.2s;z-index:20}#toast.visible{opacity:1;transform:translate(-50%,0)}@keyframes signal{to{stroke-dashoffset:-48}}@media(min-width:1450px){.instrument-layout{margin-top:70px}.intro h1{font-size:43px}}@media(max-width:1080px){.instrument-layout{grid-template-columns:1fr 414px;gap:50px;max-width:830px}.field-notes{display:none}.pocket{max-width:414px}.intro h1{font-size:36px}.site-header{padding:0 32px}.site-footer>span:last-child{display:none}}@media(max-width:700px){.site-header{height:65px;padding:0 21px;border:0}.wordmark{font-size:22px}.wordmark svg{width:25px}.wordmark small{font-size:7px;letter-spacing:1.5px;margin-left:8px;padding-left:13px}nav{gap:11px}nav a{display:none}nav button{width:24px;height:24px;font-size:12px}.instrument-layout{display:block;margin:0 auto 20px;padding:0 12px;max-width:420px}.intro{display:none}.pocket{border-radius:20px 20px 42px 20px;padding:17px 19px 17px;box-shadow:0 15px 40px #0003;max-width:none}.device-top{margin-bottom:14px;font-size:12px}.device-top b{font-size:9px}.screen-bezel{padding:8px}.screen-top{top:14px;left:13px;right:12px}.physical-controls{margin-top:18px;gap:9px;min-height:95px}.dpad{width:93px;height:93px;grid-template-columns:repeat(3,31px);grid-template-rows:repeat(3,31px)}.encoder{width:66px;height:66px}.encoder-inner{width:47px;height:47px}.encoder-inner i::after{left:21px;top:4px}.action-keys{height:94px;width:87px}.action-keys button{height:39px;width:39px;font-size:14px}.instrument-meta{margin:12px 1px 10px}.control-mode{padding:6px 0}.parameter{padding-top:12px}.lower-controls{margin-top:18px}.device-bottom{margin-top:17px}.site-footer{padding:10px 24px 20px;border:0;font-size:6px;letter-spacing:.5px;justify-content:center}.site-footer>span:first-child{display:none}.speaker i{height:18px}.parameter-label output{font-size:12px}}@media(max-width:360px){.instrument-layout{padding:0 8px}.pocket{padding:15px}.dpad{width:84px;height:84px;grid-template-columns:repeat(3,28px);grid-template-rows:repeat(3,28px)}.encoder{width:60px;height:60px}.action-keys{width:79px}.device-bottom>span{font-size:5.5px}.fixtures{left:12px;right:12px}}[data-theme=light]{color-scheme:light;--page:#e3e6dd;--ink:#263126;--muted:#75806c;--line:#b9c3ad}.is-held .control-mode .active{box-shadow:inset 0 0 0 1px #b7d58c55}.is-held #a-caption,.is-held #b-caption{color:#c5df9b}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* Keep screen typography readable at thumb-sized widths. */
#scene .node-label{font-size:10px}
#scene .node-meta{font-size:5.5px}
#delete-all{background:#382820!important;border-color:#694b37!important;color:#e5bea1!important}
.paused #scene .flow{animation-play-state:paused}
#menu{position:fixed;z-index:10;padding:17px;border-radius:5px;box-shadow:0 5px 20px #0007;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#536d41 #1c251d}
#menu .dialog-head h2{font-size:19px;margin:9px 0 15px}
#menu-body button.menu-choice{padding:10px 11px;font-size:11px}
#menu-body .menu-choice.menu-active{background:#35472a;border-color:#b1cb8b;color:#e4f5ca}
.fixture-grid{fill:none;stroke:#58704c;stroke-width:.6;opacity:.32}.fixture-stem{fill:none;stroke:#55704a;stroke-width:.7;stroke-dasharray:1 3;opacity:.55}.fixture-selection{fill:none;stroke:#779462;stroke-width:.6;opacity:.35}.stage-fixture.selected .fixture-selection{stroke:#72dec2;stroke-width:1.5;opacity:1;animation:fixturePulse 2.4s ease-in-out infinite}.fixture-hit{fill:transparent;stroke:none}.stage-fixture{cursor:pointer;outline:none}.stage-fixture text{font:6px Consolas,monospace;fill:#738b66;pointer-events:none}.stage-fixture.selected text{fill:#72dec2}.stage-fixture:focus-visible .fixture-selection{stroke:#fff;stroke-width:2}.schematic-tag{fill:#586e50;font:5.5px Consolas,monospace;letter-spacing:1px}.view-switch button{padding:5px 6px}@keyframes fixturePulse{50%{stroke-opacity:.4}}.paused .fixture-selection{animation-play-state:paused}

/* Relative rolling encoder: no thumb, endpoints or absolute-position jumps. */
.rolling-strip{height:45px;margin-top:3px;position:relative;border-radius:7px;cursor:ew-resize;touch-action:none;user-select:none;-webkit-user-select:none;background:#101810;border:1px solid #0a110c;box-shadow:inset 0 3px 8px #0008,0 1px #ffffff09;overflow:hidden}
.roll-window{position:absolute;inset:3px;border-radius:4px;overflow:hidden;background:linear-gradient(#1a2419,#202c1c 50%,#121b12)}
.roll-ribs{position:absolute;inset:7px -40px;background:repeating-linear-gradient(90deg,#8d9e7055 0 1px,#101a0eaa 1px 3px,transparent 3px 11px);background-position:var(--roll,0px) 0;mask-image:linear-gradient(90deg,transparent,#000 20%,#000 80%,transparent);opacity:.6}
.roll-window::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#131c13e6,transparent 27%,transparent 73%,#131c13e6);pointer-events:none}
.roll-index{position:absolute;left:50%;top:4px;bottom:4px;width:1px;background:#b9d08c;box-shadow:0 0 5px #c0e18a44;z-index:1;opacity:.7}
.roll-index::before,.roll-index::after{content:"";position:absolute;width:5px;height:2px;background:#b9d08c;left:-2px}.roll-index::before{top:0}.roll-index::after{bottom:0}
.roll-arrow{position:absolute;top:7px;color:#6b805b;font:20px Consolas,monospace;z-index:2;line-height:24px}.roll-arrow.left{left:10px}.roll-arrow.right{right:10px}
.rolling-strip.is-rolling{border-color:#647d47;box-shadow:inset 0 3px 8px #0008,0 0 0 1px #9cbd6633}.is-rolling .roll-ribs{opacity:1}.is-rolling .roll-index{opacity:1}.rolling-strip.disabled{opacity:.3;cursor:default}
.roll-labels{display:flex;justify-content:space-between;margin-top:7px;font:5.5px Consolas,monospace;letter-spacing:1px;color:#75836a}.is-held .roll-labels{color:#b5d38b}
@media(max-width:700px){.rolling-strip{height:40px}.roll-ribs{inset-block:6px}.roll-labels{font-size:5px;letter-spacing:.8px}}

/* Quiet digital surface, with color for each behavior family. */
:root{--page:#111416;--shell:#191e22;--shell-top:#191e22;--screen:#10171d;--ink:#e5eaee;--muted:#89949e;--line:#303a42;--accent:#72dec2;--screen-ink:#bac9d2}
.pocket{background:var(--shell);border:1px solid #30383f;border-radius:12px;padding:18px;box-shadow:none}
.screen-bezel{padding:0;border:0;border-radius:6px;background:none;box-shadow:none}.screen{border:1px solid #303d48;border-radius:6px}.screen::after{display:none}
.device-top{color:#b9c5ce}.device-top b,.device-live{color:#81938d}.device-live i,.eyebrow i{box-shadow:none}
.screen-top strong{color:#d2dee7}.view-switch{background:#19232b;border-color:#35414a}.view-switch button{color:#8b9eac}.view-switch .active{background:#304139;color:#d3e9dc}
#scene .node{--block:#83b9db;--block-fill:#20333f}
#scene .node[data-family=Create]{--block:#82ccab;--block-fill:#213b33}
#scene .node[data-family=Modify]{--block:#8bbce4;--block-fill:#223647}
#scene .node[data-family=Combine]{--block:#b9a1e3;--block-fill:#342c46}
#scene .node[data-family=Pick]{--block:#dfb77f;--block-fill:#423624}
#scene .node[data-family=Filter]{--block:#dd94ac;--block-fill:#432b37}
#scene .node .node-body{fill:var(--block-fill);stroke:var(--block);stroke-opacity:.5}
#scene .node.selected .node-body{fill:var(--block-fill);stroke:var(--block);stroke-opacity:1;stroke-width:1.7}
#scene .node .node-label,#scene .node.selected .node-label{fill:var(--block)}
#scene .node .node-meta{fill:var(--block);opacity:.65}#scene .node text{fill:#c3cdd4}#scene .node .node-meter{fill:var(--block)}
#scene .node-connector{fill:var(--block-fill);stroke:var(--block);stroke-width:.7;stroke-opacity:.4;pointer-events:none}
#scene .node-connector.socket{fill:var(--screen);stroke-opacity:.3}#scene .wire{stroke:#617782;opacity:.5}#scene .flow{stroke:#b4cad3;opacity:.35}
.control-mode{border-block:1px solid #ffffff0b}.control-mode .active{background:#29332f;box-shadow:none}.is-held .control-mode .active{box-shadow:none}
.dpad{filter:none}.dpad button,.dpad-center{background:#242c32;border-color:#354149;box-shadow:none;color:#a0afb9}.dpad-center{color:#50616c}
.encoder{background:#252f35;border:1px solid #4b5c64;box-shadow:none}.encoder-inner{background:#1d262c;border:1px solid #41515b;box-shadow:none}.encoder-inner span{color:#81959f}.encoder-inner i::after{background:#72dec2}
.action-keys button{background:#72dec2;border:1px solid #72dec2;box-shadow:none;color:#23352c}.key-b button{background:#283239;border:1px solid #47565f;box-shadow:none;color:#b6c5ce}.action-keys button:active{box-shadow:none;transform:translateY(1px)}
.lower-controls>button{background:#20292e;border-color:#3d4c55;color:#c3d0d7}.transport button{background:#263138;border:1px solid #45545d;border-radius:5px;height:25px;transform:none;box-shadow:none}.transport button:active{transform:translateY(1px)}
.speaker{display:none}.device-bottom>span{max-width:none;color:#8a9aa4}.hardware-label,.action-keys span{color:#8799a5}
.rolling-strip{background:#182229;border:1px solid #3a4a54;border-radius:5px;box-shadow:none}.roll-window{background:#182229}.roll-window::after{background:linear-gradient(90deg,#182229,transparent 24%,transparent 76%,#182229)}.roll-ribs{background-image:repeating-linear-gradient(90deg,#8ba0ab66 0 1px,transparent 1px 11px)}.roll-index{background:#72dec2;box-shadow:none}.roll-index::before,.roll-index::after{background:#72dec2}.roll-arrow{color:#8ea3ad}.roll-labels{color:#8a9ba6}.rolling-strip.is-rolling{border-color:#a6cbbb;box-shadow:none}
@media(max-width:700px){
 .site-header{height:57px;padding-inline:18px}.instrument-layout{width:100%;max-width:none;padding:0;margin:0 auto 20px}
 .pocket{width:100%;max-width:none;padding:0 18px 18px;border:0;border-radius:0;background:transparent;box-shadow:none}
 .device-top{margin:0 0 12px}.screen-bezel{margin-inline:-18px;border-radius:0}.screen{width:100%;border-inline:0;border-radius:0;aspect-ratio:1}
 .instrument-meta{margin-block:15px 12px}.physical-controls{margin-top:20px}.device-bottom{margin-top:15px}
}

/* Original Schéma vector wordmark from the native app logo assets. */
.wordmark .schema-logo{display:block;width:144px;height:auto}.device-brand{display:flex;align-items:center;gap:9px}.device-brand .schema-logo{width:88px;height:auto}.device-brand b{margin:0}[data-theme=light] .schema-logo{filter:brightness(0)}
@media(max-width:700px){.wordmark .schema-logo{width:125px}.device-brand .schema-logo{width:76px}}

/* Current green interlocking Schéma app mark. */
.wordmark .schema-logo{width:36px;height:36px}.device-brand .schema-logo{width:22px;height:22px}.device-brand>span{font-size:12px;letter-spacing:-.4px}.wordmark>span{font-size:25px;letter-spacing:-1px}[data-theme=light] .schema-logo{filter:none}
@media(max-width:700px){.wordmark .schema-logo{width:31px;height:31px}.wordmark>span{font-size:22px}.device-brand .schema-logo{width:21px;height:21px}}

/* Value feedback stays absolute while swipes remain relative. */
.roll-window::before{content:"";position:absolute;inset:0 auto 0 0;width:var(--value-progress,0%);background:#72dec22e;border-right:1px solid #72dec266;pointer-events:none}.roll-window::after{background:linear-gradient(90deg,#18222955,transparent 15%,transparent 85%,#18222955)}

:root{--accent:#72dec2}.screen-top{pointer-events:none}.view-switch{pointer-events:auto}#fixture-row{overflow-x:auto;justify-content:flex-start;scrollbar-width:thin}#fixture-row button{flex:0 0 30px;min-height:30px}#screen .fixtures{left:12px;right:12px}#fixture-row span{font-size:7px}.view-switch button{min-height:30px;min-width:35px}.screen-tools button{width:26px;height:26px}.dpad{width:120px;height:120px;grid-template-columns:repeat(3,40px);grid-template-rows:repeat(3,40px)}.control-mode button{min-height:40px}.lower-controls button{min-height:36px}#menu{max-height:85dvh;overflow:auto}#menu input,#menu select,#menu textarea{width:100%;font:inherit;padding:12px;border:1px solid var(--line);border-radius:5px;background:var(--page);color:var(--ink);margin:7px 0;min-height:44px}#menu button{min-height:44px}.mobile-menu-tools{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0}.mobile-menu-tools button{padding:10px 14px;background:var(--control);border:1px solid var(--line);border-radius:6px}.mobile-field{display:block;margin:12px 0;font-size:12px}.mobile-choice{display:flex;align-items:center;justify-content:space-between;gap:15px;width:100%;padding:14px;text-align:left;background:var(--control);border:1px solid var(--line);border-radius:7px;color:var(--ink);margin:6px 0}.mobile-choice small{display:block;font-size:10px;color:var(--muted);line-height:1.5;margin-top:5px}.mobile-choice img{width:34px;height:34px}.mobile-menu-status{font-size:11px;color:var(--muted)}.is-pending .device-live{opacity:.5}#expression[aria-disabled=true]{opacity:.4;cursor:not-allowed}#focus-properties button{background:none;color:var(--muted);padding:6px}#engine-status{overflow-wrap:anywhere}#scene .node-meta{font-size:6px}#scene .node-label{font-size:8px}#scene .fixture-hit{r:18px}#scene .flow{animation:none}.parameter-label #property-label{cursor:pointer}.site-footer{padding-bottom:env(safe-area-inset-bottom)}@media(max-width:700px){.site-header nav{gap:9px}.site-header nav a{margin:0;font-size:10px}.intro,.field-notes{display:none}.instrument-layout{display:block}.pocket{max-width:100%}.screen{aspect-ratio:1}.physical-controls{grid-template-columns:120px 1fr 110px;gap:8px}.action-keys{gap:9px}.site-header{padding-inline:12px}.site-footer{padding-inline:14px}#menu{width:calc(100vw - 24px);padding:18px}.device-bottom>span{font-size:8px}}@media(max-width:370px){.physical-controls{grid-template-columns:108px 1fr 98px}.dpad{width:108px;height:108px;grid-template-columns:repeat(3,36px);grid-template-rows:repeat(3,36px)}.action-keys button{width:42px;height:42px}.encoder{width:64px;height:64px}}
@media(max-width:700px){.site-header nav a{display:inline-flex;align-items:center;min-height:36px}.site-header nav button{min-width:30px;min-height:30px}}

.instrument-meta #selection-meta{font:inherit;letter-spacing:inherit;color:var(--ink);text-align:left;max-width:74%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-height:30px}.node-output{font-size:6px!important}#scene .node-output{fill:var(--block)}

#scene .fixture-live{pointer-events:none;stroke:#72dec2;stroke-width:.7;opacity:.85}#scene .fixture-layout-dot{stroke:#72dec2;stroke-width:.7}

#menu .mobile-property-input{font-size:16px;min-height:48px}#menu input.mobile-property-input[type=checkbox]{min-height:24px;width:24px;accent-color:#72dec2}#menu .mobile-property-hint{font-size:12px;line-height:1.6;color:var(--muted)}

/* The instrument owns the viewport; secondary tools live in one menu. */
.app-menu{position:relative}.app-menu summary{list-style:none;cursor:pointer;min-width:40px;min-height:40px;display:grid;place-items:center;border:1px solid var(--line);border-radius:8px}.app-menu summary::-webkit-details-marker{display:none}.app-menu-panel{position:absolute;right:0;top:calc(100% + 8px);z-index:100;width:210px;padding:8px;background:var(--shell);border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 30px #0008;max-height:75dvh;overflow:auto}.site-header .app-menu-panel>a,.site-header .app-menu-panel>button{display:flex;align-items:center;text-align:left;width:100%;height:auto;min-height:44px;margin:0;padding:10px 12px;border:0;border-radius:6px;font-size:13px;background:transparent;color:var(--ink)}.app-menu-panel>:hover{background:var(--control)}.site-header nav{gap:10px}.site-header nav>button{width:40px;height:40px;border-radius:8px}.site-header .device-live{white-space:nowrap}
@media(max-width:700px),(max-height:700px){
 html,body{width:100%;height:100%;height:100dvh;min-width:0;overflow:hidden}
 body{display:grid;grid-template-rows:auto minmax(0,1fr);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
 .site-header{height:48px;min-width:0;width:100%;padding:4px 12px;max-width:none}.wordmark>span{font-size:19px}.wordmark .schema-logo{width:26px;height:26px}.site-header nav{gap:7px}.site-header .device-live{font-size:7px}
 .intro,.field-notes,.site-footer,.device-bottom{display:none}
 .instrument-layout{display:block;min-height:0;width:100%;height:100%;max-width:520px;padding:0 10px 8px;margin:0 auto}
 .pocket{display:grid;grid-template-rows:minmax(100px,1fr) auto auto auto auto auto;gap:7px;width:100%;height:100%;min-height:0;max-width:none;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
 .screen-bezel{min-height:0;margin:0;padding:0}.screen{width:100%;height:100%;aspect-ratio:auto;border:1px solid var(--line);border-radius:8px}.screen-top{top:10px;left:10px;right:10px}
 .instrument-meta{margin:0;min-height:30px}.control-mode{padding:0}.control-mode button{min-height:36px}.parameter{padding:0}.parameter-label{min-height:24px}.rolling-strip{height:34px}.roll-labels{margin-top:3px}
 .physical-controls{margin:0;min-height:108px;grid-template-columns:108px 1fr 98px;gap:8px}.dpad{width:108px;height:108px;grid-template-columns:repeat(3,36px);grid-template-rows:repeat(3,36px)}.encoder{width:64px;height:64px}.encoder-inner{width:46px;height:46px}.hardware-label{margin-top:5px}.action-keys{width:98px;height:94px}.action-keys button{width:42px;height:42px}.lower-controls{margin:0;min-height:36px}.lower-controls button{min-height:36px}
}
@media(max-width:350px){.site-header{padding-inline:8px}.site-header .device-live{display:none}.wordmark>span{font-size:18px}.physical-controls{grid-template-columns:108px 1fr 90px}.action-keys{width:90px}}
@media(orientation:landscape) and (max-height:700px){
 .instrument-layout{max-width:none;padding:0 12px 8px}.pocket{grid-template-columns:minmax(0,1fr) minmax(280px,42%);grid-template-rows:auto auto auto minmax(90px,1fr) auto;gap:5px 14px}.screen-bezel{grid-column:1;grid-row:1/6}.instrument-meta,.control-mode,.parameter,.physical-controls,.lower-controls{grid-column:2}.physical-controls{min-height:90px}.dpad{width:90px;height:90px;grid-template-columns:repeat(3,30px);grid-template-rows:repeat(3,30px)}.physical-controls{grid-template-columns:90px 1fr 98px}.site-header{height:44px}.action-keys{height:90px}
}

/* Long authored names must not increase the fixed control rows. Full values open on tap. */
.parameter-label{min-width:0}.parameter-label #property-label{min-width:0;max-width:42%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.parameter-label output{min-width:0;max-width:48%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right}.parameter-label>button{flex-shrink:0}.screen-top>div:first-child{min-width:0;overflow:hidden}.screen-top strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.screen-top .view-switch{flex-shrink:0}

@media(max-width:700px),(max-height:700px){body{grid-template-columns:minmax(0,1fr)}.instrument-layout,.pocket>*{min-width:0}.pocket{grid-auto-columns:minmax(0,1fr)}}

/* Keep navigation and useful tools direct; use a second toolbar row on phones. */
.site-header{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto auto;gap:12px}.site-header .studio-return{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 10px;border:1px solid var(--line);border-radius:8px;font-size:12px;white-space:nowrap;color:var(--ink)}.site-header .quick-tools{justify-content:flex-end;gap:8px;min-width:0}.site-header .quick-tools>button{flex:0 0 40px;min-width:40px;height:40px;margin:0}.site-header>.app-menu{grid-column:4}.site-header>.device-live{grid-column:5}
@media(max-width:700px) and (orientation:portrait){
 .site-header{height:96px;grid-template-columns:minmax(0,1fr) auto auto;grid-template-rows:40px 44px;gap:4px 8px;padding:4px 10px}.site-header .wordmark{grid-column:1;grid-row:1;min-width:0;gap:6px}.site-header .wordmark>span{font-size:18px}.site-header .studio-return{grid-column:2;grid-row:1}.site-header>.app-menu{grid-column:3;grid-row:1}.site-header .quick-tools{grid-column:1/-1;grid-row:2;justify-content:space-between;gap:4px}.site-header .quick-tools>button{flex:0 0 44px;min-width:44px;height:44px}.site-header>.device-live{display:none}
}
@media(orientation:landscape) and (max-height:700px){.site-header{gap:7px}.site-header .quick-tools{gap:5px}.site-header .quick-tools>button{flex-basis:36px;min-width:36px;height:36px}.site-header .app-menu summary{min-height:36px;min-width:36px}.site-header .studio-return{min-height:36px}.site-header>.device-live{display:none}}
@media(orientation:landscape) and (max-width:700px){.site-header{grid-template-columns:auto auto minmax(0,1fr) auto}.site-header .wordmark>span{display:none}.site-header .wordmark .schema-logo{width:26px;height:26px}.site-header .quick-tools{gap:4px}}