:root{color-scheme:light;--bg:#edece8;--panel:#f7f6f3;--panel2:#e7e6e1;--ink:#222629;--muted:#606662;--line:#d2d4ce;--accent:#b14c17;--accent-soft:#f0e2d5;--text-xs:.75rem;--text-sm:.875rem;--text-base:1rem;--text-lg:1.125rem;--text-xl:clamp(1.5rem,2.4vw,2rem);--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--font-body:'Satoshi',sans-serif}
.intro.intro-blank{min-height:40px;padding:0}
.nozzle-editor{border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:16px;font-size:var(--text-xs)}
.nozzle-editor select{width:100%;font-size:var(--text-xs);margin:8px 0}
.nozzle-editor p{color:var(--muted);font-size:var(--text-xs);line-height:1.5}
.fader-dmx-label{font-size:var(--text-xs);color:var(--muted);width:100%;text-align:left;line-height:1.3}
.fader-strip .strip-name{min-width:0;width:100%;height:40px;min-height:40px;padding:var(--space-1) 0;border:1px dashed transparent;border-bottom-color:var(--line);border-radius:3px;background:transparent;text-align:center;font-size:var(--text-xs);line-height:1.3;font-family:inherit;color:var(--muted);cursor:text;resize:none;overflow:hidden;display:block}
.fader-strip .strip-name:hover,.fader-strip .strip-name:focus{border-color:var(--accent);background:var(--panel);color:var(--ink)}
.inspector #rear-panel{margin-bottom:var(--space-5);padding:var(--space-3);border:1px solid #42494b;border-radius:8px;background:#20282b;color:#dbe3e2;box-shadow:inset 0 1px 0 #ffffff12}
.rear-heading{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);font-size:var(--text-xs);font-weight:700;letter-spacing:1px;margin-bottom:var(--space-3)}
.rear-heading small{font-size:var(--text-xs);font-weight:400;letter-spacing:0;color:#a7b5b5}
.rear-screen{border:5px solid #111719;border-radius:4px;background:#b9d3b2;color:#172e20;padding:var(--space-3) var(--space-2);min-height:112px;font:var(--text-sm)/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;box-shadow:inset 0 2px 8px #152f2433;overflow-wrap:anywhere}
#rear-line1{min-height:42px;letter-spacing:.2px}
#rear-line2{font-weight:700;font-size:var(--text-xs)}
.rear-screen.unlit{background:#687467;color:#112115}
.rear-screen.editing #rear-line2{text-decoration:underline;text-underline-offset:4px}
.rear-keys{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-1);margin-top:var(--space-3)}
.rear-keys button{font-size:var(--text-xs);padding:var(--space-2) 0;background:#313c40;border-color:#566266;color:#e8eeed;min-height:56px;box-shadow:0 2px 0 #0f171a}
.rear-keys button span{display:block;font-weight:700;margin-top:var(--space-1)}
.rear-keys button:hover{background:#415056}
#rear-status{min-height:60px;margin-top:var(--space-3);color:#bccbcb;font-size:var(--text-xs);line-height:1.5}
#rear-panel details{font-size:var(--text-xs);line-height:1.6;border-top:1px solid #465256;margin-top:var(--space-3);padding-top:var(--space-2)}
#rear-panel summary{cursor:pointer}#rear-panel details p{margin-top:var(--space-2)}#rear-panel a{color:#ffb17c}
.flame-scale-editor{padding-bottom:var(--space-4);margin-bottom:var(--space-4);border-bottom:1px solid var(--line)}
.flame-scale-editor #size{width:100%}
.inspector.inspector{display:flex;flex-direction:column;min-width:0}
.inspector.inspector>.readout{margin:0 0 var(--space-4);align-self:stretch}
.inspector .catalog-details{padding-bottom:var(--space-3)}
.library-tabs{display:flex;margin:0 var(--space-4) var(--space-3);gap:var(--space-1)}
.library-tabs button{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--space-2);font-size:var(--text-xs)}
.library-tabs [aria-selected=true]{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}
.star-icon{display:inline-block;width:17px;height:17px;background:currentColor;clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 94%,50% 72%,21% 94%,32% 57%,2% 35%,39% 35%)}
.preset-row{display:grid;grid-template-columns:minmax(0,1fr) 32px;align-items:stretch;border-bottom:1px solid var(--line);position:relative}
.preset-row .preset{width:100%;min-width:0;grid-template-columns:28px minmax(0,1fr) 40px;gap:var(--space-2);padding:var(--space-3) var(--space-2);border:0}
.preset-row .preset>span{min-width:0}.preset-row .preset small{overflow-wrap:anywhere}
.favorite-star{border:0;border-radius:0;padding:0;display:flex;align-items:center;justify-content:center;min-width:32px;color:var(--muted);opacity:.45}
.favorite-star[aria-pressed=true]{color:var(--accent);opacity:1}
.favorite-star:hover,.favorite-star:focus-visible{opacity:1}
.favorite-sort{grid-column:1/-1;display:flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-2);background:var(--panel2)}
.favorite-sort>span{font-size:var(--text-xs);color:var(--muted);font-variant-numeric:tabular-nums;margin-right:auto}
.favorite-sort button{min-height:32px;min-width:32px;padding:var(--space-1);font-size:var(--text-sm)}
.favorite-handle{cursor:grab}.favorite-handle:active{cursor:grabbing}
.favorite-dragging{opacity:.45}.drop-before{box-shadow:inset 0 3px 0 var(--accent)}.drop-after{box-shadow:inset 0 -3px 0 var(--accent)}
#favorite-tools{margin:0 var(--space-4) var(--space-3);font-size:var(--text-xs)}
#favorite-tools[hidden],.filters[hidden]{display:none}
#favorite-tools p,#favorite-tools small{color:var(--muted);line-height:1.5;display:block;margin-bottom:var(--space-2)}
#favorite-tools label{display:block;margin-top:var(--space-2)}
#favorite-cue-name{width:100%;min-width:0;margin:var(--space-1) 0 var(--space-2);padding:var(--space-2);background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:4px;font-size:var(--text-xs)}
#save-favorite-cue{width:100%;font-size:var(--text-xs);color:var(--accent);border-color:var(--accent);margin-bottom:var(--space-2)}
#favorite-status{font-size:var(--text-xs);color:var(--muted);line-height:1.5;padding:var(--space-2) var(--space-4);overflow-wrap:anywhere}
#favorite-status:empty{display:none}
.favorite-timing{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:var(--space-2);padding:var(--space-2);font-size:var(--text-xs)}
.favorite-timing input{display:block;width:100%;min-width:0;min-height:36px;padding:var(--space-1);background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:3px;font-size:var(--text-xs)}
.favorite-timing button{font-size:var(--text-xs);padding:var(--space-1);align-self:end;min-height:36px}
.look-timing-row{display:grid;grid-template-columns:80px minmax(0,1fr) minmax(0,1fr) 64px;gap:var(--space-3);align-items:end;padding:var(--space-3) 0;border-bottom:1px solid var(--line);font-size:var(--text-xs)}
.look-timing-row label{display:block;min-width:0}.look-timing-row input{display:block;width:100%;min-width:0;padding:var(--space-2);border:1px solid var(--line);border-radius:4px;background:var(--panel);color:var(--ink)}
.look-timing-row strong{align-self:center}.look-timing-row button{font-size:var(--text-xs);padding:var(--space-2)}
#cue-look-timing{margin:var(--space-4) 0}#cue-look-timing h3{font-size:var(--text-sm)}
#cue-look-timing[hidden]{display:none}
.viewport.is-panning,.viewport.is-panning *{cursor:grabbing!important}
.fader-byte{width:100%;min-width:0;min-height:32px;border:1px solid var(--line);border-radius:4px;background:var(--panel);color:var(--ink);text-align:center;font-size:var(--text-sm);font-variant-numeric:tabular-nums;padding:var(--space-1)}
.fader-byte:hover{border-color:var(--muted)}.fader-byte:focus{border-color:var(--accent)}.fader-byte[aria-invalid=true]{border-color:#c53f35}
.fader-percent{font-size:var(--text-xs);line-height:1.2;color:var(--muted);font-variant-numeric:tabular-nums}
@media(max-width:600px){.look-timing-row{grid-template-columns:1fr 1fr;gap:var(--space-2)}.look-timing-row strong{grid-column:1/-1}}
@media(max-width:700px){.workspace .library.favorites-library{height:800px;max-height:800px}.favorites-library #preset-list{min-height:200px}}
.fader-dmx{display:block;width:100%;min-width:0;min-height:28px;background:var(--bg);color:var(--ink);border:1px solid var(--line);border-radius:3px;padding:3px;font-size:var(--text-xs);text-align:center}
.fader-dmx[aria-invalid=true]{outline:1px solid #dc784d}
.fader-dmx-row{display:flex;align-items:center;gap:3px;width:100%}
.fader-dmx-row .fader-dmx{flex:1;width:0}
.fader-dmx-row .dmx-priority{width:14px;height:14px;flex:none;margin:0;cursor:pointer}
.fader-strip.dmx-priority-mode{border-color:var(--accent);background:var(--accent-soft)}
.dmx-priority-mode .cue-assignment{opacity:.4}
.virtual-universe-label{display:flex;align-items:center;gap:5px;font-size:var(--text-xs);color:var(--muted)}
#virtual-universe{width:68px;min-height:32px;background:var(--bg);color:var(--ink);border:1px solid var(--line);border-radius:4px;padding:3px}
.rate-result{white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--muted)}
.playback-bar .speed{flex-wrap:wrap}
#virtual-dmx-monitor{order:6;display:block;margin:6px 0;line-height:1.5}
.virtual-fader-start{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:16px;padding:12px;border:1px solid var(--line);border-radius:5px;background:var(--bg)}
.virtual-fader-start p{flex:1;min-width:180px;font-size:var(--text-xs);line-height:1.6;color:var(--muted)}
.virtual-fader-start button{font-size:var(--text-xs)}
.fader-strip .fader-capture{width:100%;font-size:var(--text-xs);padding:4px 0;min-height:36px;color:var(--accent)}
@media(max-width:700px){.source-switch{flex-wrap:wrap}.virtual-fader-start{align-items:stretch}.virtual-fader-start p{flex-basis:100%}}
#bank-controls{container-type:inline-size}
.bank-console-layout{display:grid;grid-template-columns:minmax(0,1fr) 72px 142px;gap:8px;align-items:stretch}
.bank-master{display:flex;align-items:center;flex-direction:column;gap:12px;border:1px solid var(--line);border-radius:4px;padding:12px 4px;background:var(--bg);font-size:var(--text-xs)}
.bank-master strong{color:var(--accent);font-size:var(--text-xs)}.bank-master .fader-track{margin-top:44px}.bank-master small{font-size:var(--text-xs);line-height:1.4;text-align:center;color:var(--muted)}.bank-master button{font-size:var(--text-xs);padding:4px}
.macro-panel{border:1px solid var(--line);border-radius:4px;padding:8px;background:var(--bg);min-width:0}.macro-panel h3{font-size:var(--text-xs);margin:4px 0 8px;color:var(--muted)}#macro-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}.macro-cell{min-width:0}.macro-key{display:block;width:100%;padding:5px;min-height:40px}.macro-key strong{font-size:var(--text-xs)}.macro-key small{display:block;font-size:var(--text-xs);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--muted)}.macro-key[aria-pressed=true]{border-color:var(--accent);background:var(--accent-soft)}.macro-edit{font-size:var(--text-xs);min-height:24px;width:100%;padding:2px;border:0}.macro-panel .check{font-size:var(--text-xs);line-height:1.3}.virtual-arm{font-size:var(--text-xs);border-bottom:1px solid var(--line);margin-bottom:16px;padding-bottom:12px;grid-column:1/-1}.virtual-arm p{color:var(--muted);line-height:1.5}.virtual-arm .check{font-size:var(--text-sm)}
#mapping-fields{max-height:340px;overflow:auto;border-block:1px solid var(--line);margin:12px 0}.mapping-row{display:grid;grid-template-columns:1fr 76px 90px;gap:12px;align-items:center;border-bottom:1px solid var(--line);padding:8px 0;font-size:var(--text-sm)}.mapping-row input[type=number]{width:100%;min-height:40px;background:var(--bg);border:1px solid var(--line);color:var(--ink);padding:4px}.mapping-row label:last-child{display:flex;gap:8px;align-items:center;font-size:var(--text-xs)}.mapping-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}#mapping-error{font-size:var(--text-sm);color:var(--accent);line-height:1.5;margin:12px 0}
@media(max-width:1100px){.bank-console-layout{grid-template-columns:minmax(0,1fr) 70px}.macro-panel{grid-column:1/-1}#macro-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:700px){#macro-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.mapping-row{grid-template-columns:1fr 64px 72px;gap:6px}.mapping-row label{font-size:var(--text-xs)}.bank-console-layout{grid-template-columns:minmax(0,1fr) 64px}}
.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
#playback-bank{border-top:1px solid var(--line);padding:var(--space-4) var(--space-3);background:var(--panel);min-width:0}
.bank-heading{display:flex;justify-content:space-between;align-items:center;gap:var(--space-3);margin-bottom:var(--space-3)}.bank-heading h2{margin-top:var(--space-1)}.bank-heading h2 span{font-size:var(--text-xs);color:var(--muted);font-weight:500;margin-left:var(--space-2)}.bank-badge{font-size:var(--text-xs);color:var(--accent);border:1px solid var(--line);padding:var(--space-2);border-radius:4px;white-space:nowrap}
#bank-controls{border:0;padding:0;margin:0;min-width:0}#bank-controls:disabled{opacity:.5}.bank-toolbar{display:flex;gap:var(--space-3);align-items:center;flex-wrap:wrap;margin-bottom:var(--space-3);font-size:var(--text-xs)}.bank-toolbar .check{font-size:var(--text-sm)}#intensity-targets{flex:1;color:var(--muted);min-width:100px;overflow-wrap:anywhere}.bank-toolbar button{font-size:var(--text-xs)}
.bank-scroll{overflow-x:auto;max-width:100%;border:1px solid var(--line);border-radius:5px;scrollbar-width:thin;padding:var(--space-2);background:var(--bg)}
#fader-grid{display:grid;grid-template-columns:repeat(10,minmax(70px,1fr));gap:var(--space-1);min-width:770px}
@container(min-width:900px){#fader-grid{grid-template-columns:repeat(10,minmax(62px,1fr));min-width:656px}}
.fader-strip{min-width:0;text-align:center;background:var(--panel);border:1px solid var(--line);border-radius:4px;padding:var(--space-2) var(--space-1);display:flex;align-items:center;flex-direction:column;gap:var(--space-2)}
.fader-number{font-size:var(--text-xs);letter-spacing:1px;color:var(--muted)}.fader-label{height:42px;display:flex;align-items:center;justify-content:center;font-size:var(--text-xs);line-height:1.3;color:var(--muted);width:100%}
.fader-strip .cue-assignment{width:100%;min-width:0;min-height:22px;height:22px;padding:0;font-size:var(--text-xs);text-overflow:ellipsis}
.fader-strip.raised{border-color:var(--accent)}.fader-strip.raised .fader-number{color:var(--accent)}.fader-strip output{font-size:var(--text-xs);font-variant-numeric:tabular-nums;color:var(--ink)}
.fader-track{height:145px;display:flex;justify-content:center;width:100%;position:relative;background:repeating-linear-gradient(to top,transparent 0,transparent 13px,var(--line) 13px,var(--line) 14px) center/30px 100% no-repeat}
.fader-track input[type=range]{writing-mode:vertical-lr;direction:rtl;appearance:none;width:38px;height:145px;min-height:0;margin:0;cursor:ns-resize;background:transparent;touch-action:none;padding:0}
.fader-track input::-webkit-slider-runnable-track{width:6px;border-radius:3px;background:#090d10;border:1px solid #4a5053;height:100%}
.fader-track input::-webkit-slider-thumb{appearance:none;width:30px;height:15px;background:linear-gradient(#c9cdd0 0 42%,#4c5459 43% 54%,#8d969c 55%);border:1px solid #d5dadd;border-radius:2px;margin-left:-13px;box-shadow:0 2px 4px #0005}
.fader-track input::-moz-range-track{width:6px;background:#090d10;border:1px solid #4a5053}.fader-track input::-moz-range-thumb{width:30px;height:15px;background:#aab2b6;border:1px solid #d5dadd;border-radius:2px}
.fader-strip .flash-key{width:calc(100% - 4px);min-height:36px;height:36px;padding:0;display:flex;align-items:center;justify-content:center;background:#30373c;color:#fff;border:1px solid #586269;touch-action:none;user-select:none}
.fader-strip .flash-key[aria-pressed=true]{background:#aa4e20;border-color:#ffc496;box-shadow:0 0 0 2px #ffb17c44}.flash-play .play-mark{width:0;height:0;border-left:10px solid #fff;border-top:6px solid transparent;border-bottom:6px solid transparent}.flash-sun span{font:26px/1 Arial,sans-serif;color:#fff}
.fader-strip .fader-settings{min-height:32px;font-size:var(--text-xs);padding:var(--space-1);width:100%;border-color:transparent}
.cue-recorder{display:flex;gap:var(--space-2);flex-wrap:wrap;align-items:flex-end;margin-top:var(--space-4)}.cue-recorder>div{flex:1;min-width:150px}.cue-recorder label{display:block;font-size:var(--text-xs);color:var(--muted);margin-bottom:var(--space-1)}.cue-recorder input,.cue-recorder select{width:100%;min-width:0;min-height:40px;font-size:var(--text-xs);background:var(--bg);color:var(--ink);border:1px solid var(--line);border-radius:4px;padding:var(--space-2)}.cue-recorder button{font-size:var(--text-xs);min-height:40px}#cue-count{width:100%;font-size:var(--text-xs);color:var(--muted)}
#bank-status{margin-top:var(--space-3);color:var(--accent);font-size:var(--text-xs);line-height:1.6;min-height:38px}.bank-help{margin-top:var(--space-2);font-size:var(--text-xs);color:var(--muted);line-height:1.65}.bank-help summary{cursor:pointer;padding-block:var(--space-2)}.bank-help p{margin-block:var(--space-2)}
.bank-mode .transport{opacity:.4}.bank-field{display:flex;flex-direction:column;gap:var(--space-2);font-size:var(--text-sm);margin-bottom:var(--space-4)}.bank-field input,.bank-field select{min-height:44px;width:100%;padding:var(--space-2);border:1px solid var(--line);border-radius:4px;color:var(--ink);background:var(--bg)}.chase-fields{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)}.bank-hint{color:var(--muted);font-size:var(--text-xs)!important;line-height:1.6}#playback-edit-error{color:var(--accent);font-size:var(--text-sm);margin-block:var(--space-3)}#playback-editor .check{font-size:var(--text-sm);margin-bottom:var(--space-2)}
@media(max-width:700px){.simulator{width:100%;max-width:100%}#playback-bank{padding:var(--space-3) var(--space-2)}.bank-heading{align-items:flex-start}.bank-heading h2{font-size:var(--text-base)}.cue-recorder>div{min-width:100%;flex-basis:100%}.cue-recorder button{flex:1}.bank-toolbar{gap:var(--space-2)}.chase-fields{grid-template-columns:1fr 1fr}}
[data-theme=dark]{color-scheme:dark;--bg:#151719;--panel:#1c1f21;--panel2:#25282b;--ink:#e8e9e5;--muted:#a1a7a5;--line:#34383a;--accent:#f39962;--accent-soft:#372a24}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:var(--text-base)}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer;background:transparent;border:1px solid var(--line);border-radius:5px;color:inherit;min-height:44px;padding:var(--space-2) var(--space-3);font-size:var(--text-sm);transition:background .15s,border .15s}button:hover{background:var(--panel2);border-color:var(--muted)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:3px}a{color:var(--accent)}h1,h2,p{margin:0}h2{font-size:var(--text-lg);font-weight:700}input[type=checkbox]{accent-color:var(--accent);width:17px;height:17px;cursor:pointer}input[type=range]{accent-color:var(--accent);cursor:pointer;min-height:32px}select{background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:4px;min-height:44px;padding:var(--space-2)}.skip{position:absolute;top:-100px;left:10px;z-index:10;background:var(--panel);padding:var(--space-4)}.skip:focus{top:10px}.topbar{display:flex;align-items:center;justify-content:space-between;padding:var(--space-4) var(--space-8);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:var(--space-3);font-size:var(--text-lg);letter-spacing:2px}.brand svg{width:32px;height:32px;color:var(--accent)}.brand span{display:block;color:var(--muted);font-size:var(--text-xs);letter-spacing:1.5px;margin-top:var(--space-1)}.topright{display:flex;gap:var(--space-3);align-items:center}.offline{font-size:var(--text-xs);letter-spacing:1px;margin-right:var(--space-4)}i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#a1a79a;margin-right:var(--space-2)}.offline i{background:var(--accent)}.intro{display:flex;justify-content:space-between;align-items:flex-end;padding:var(--space-8)}.eyebrow{font-size:var(--text-xs);letter-spacing:1.4px;color:var(--muted);font-weight:700}.intro h1{font-size:var(--text-xl);margin-top:var(--space-2);font-weight:500;letter-spacing:-.7px}.intro p{font-size:var(--text-sm);line-height:1.7;color:var(--muted)}.workspace{margin:0 var(--space-8);display:grid;grid-template-columns:280px minmax(0,1fr) 260px;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--panel);min-height:655px}.library{display:flex;flex-direction:column;border-right:1px solid var(--line);min-width:0;max-height:740px}.section-head{display:flex;justify-content:space-between;align-items:center;padding:var(--space-5)}.count{font-size:var(--text-xs);border:1px solid var(--line);padding:var(--space-1) var(--space-2);border-radius:4px}.search-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}#search{min-height:44px;margin:0 var(--space-5);padding:var(--space-3);width:calc(100% - 40px);background:var(--bg);border:1px solid var(--line);border-radius:4px;color:var(--ink);font-size:var(--text-sm)}.filters{display:flex;margin:var(--space-3) var(--space-5);gap:var(--space-1)}.filters button{flex:1;min-width:0;border:0;padding:var(--space-2);font-size:var(--text-xs)}.filters .active{background:var(--accent-soft);color:var(--accent);font-weight:700}.list-meta{display:flex;justify-content:space-between;font-size:var(--text-xs);color:var(--muted);padding:var(--space-2) var(--space-5) var(--space-3);letter-spacing:.5px}.preset-list{overflow:auto;flex:1;min-height:200px;scrollbar-width:thin;scrollbar-color:var(--line) transparent}.preset{border:0;border-radius:0;border-top:1px solid var(--line);width:100%;display:grid;grid-template-columns:32px 1fr auto;gap:var(--space-2);align-items:center;text-align:left;padding:var(--space-3) var(--space-5);min-height:67px}.preset.active{background:var(--accent-soft)}.preset.active .id{color:var(--accent)}.preset .id{font-variant-numeric:tabular-nums;font-size:var(--text-xs);color:var(--muted)}.preset-title{font-size:var(--text-sm);font-weight:700}.preset small{display:block;font-size:var(--text-xs);color:var(--muted);margin-top:var(--space-1)}.preset .seconds{font-size:var(--text-xs);color:var(--muted);font-variant-numeric:tabular-nums}.library-foot{border-top:1px solid var(--line);padding:var(--space-4) var(--space-5);font-size:var(--text-xs);color:var(--muted);line-height:1.8}.library-foot a{text-underline-offset:3px}.simulator{min-width:0;display:flex;flex-direction:column}.viewport{position:relative;flex:1;min-height:470px;background:#0d1013;overflow:hidden}#stage{display:block;width:100%;height:100%;position:absolute;inset:0}.view-top,.view-bottom{position:absolute;left:24px;right:24px;display:flex;justify-content:space-between;color:#a6acae;font-size:var(--text-xs);letter-spacing:1px;pointer-events:none}.view-top{top:24px}.view-top i{background:#ea9a62}.view-bottom{bottom:20px;align-items:end;line-height:1.8}.view-bottom small{font-size:var(--text-xs);color:#858e93;letter-spacing:.5px}.view-bottom button{pointer-events:auto;color:#c5cbcf;border-color:#394148;font-size:var(--text-xs)}.view-bottom button:hover{background:#23282c}.transport{padding:var(--space-4) var(--space-5);border-top:1px solid var(--line)}.transport-top,.transport-bottom{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2)}.play-controls{display:flex;gap:var(--space-2);align-items:center}.play-controls #prev,.play-controls #next{font-size:var(--text-lg);width:36px;padding:var(--space-1)}.primary{background:var(--accent);color:var(--panel);font-weight:700;min-width:88px;border-color:var(--accent)}.primary:hover{background:var(--accent);filter:brightness(1.12)}.time{font-variant-numeric:tabular-nums;font-size:var(--text-sm);white-space:nowrap}.time #end-time{color:var(--muted)}.timeline-wrap{position:relative;height:48px;margin:var(--space-3) 0}.timeline-wrap canvas{height:100%;width:100%;display:block}#scrub{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:.01}#scrub:focus-visible{opacity:.7}.transport-bottom{font-size:var(--text-sm);color:var(--muted);justify-content:flex-start;gap:var(--space-5)}.check{display:flex;gap:var(--space-2);align-items:center;cursor:pointer;min-height:44px}.speed{margin-left:auto;display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-xs)}.inspector{padding:var(--space-5);border-left:1px solid var(--line);min-width:0}.preset-number{font-size:var(--text-xl);font-variant-numeric:tabular-nums;font-weight:500;letter-spacing:-1px;color:var(--accent);margin:var(--space-4) 0 var(--space-1)}.inspector h2{line-height:1.4}.pill{display:inline-block;font-size:var(--text-xs);letter-spacing:.7px;border:1px solid var(--line);padding:var(--space-1) var(--space-2);border-radius:4px;margin-top:var(--space-3);color:var(--muted)}.description{font-size:var(--text-sm);color:var(--muted);line-height:1.6;margin-top:var(--space-4)}dl{margin:var(--space-5) 0}dl>div{display:flex;justify-content:space-between;gap:var(--space-3);border-bottom:1px solid var(--line);padding:var(--space-3) 0;font-size:var(--text-xs)}dt{color:var(--muted);flex-shrink:0}dd{margin:0;text-align:right;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.display-heading{padding:var(--space-4) 0 var(--space-2)}.display-heading h2{font-size:var(--text-sm)}.display-heading span{font-size:var(--text-xs);color:var(--muted)}.setting{justify-content:space-between;font-size:var(--text-sm)}.size-label{display:flex;justify-content:space-between;font-size:var(--text-xs);margin-top:var(--space-3);color:var(--muted)}#size{width:100%;margin:var(--space-1) 0}.readout{margin-top:var(--space-3);padding:var(--space-4);background:var(--bg);border:1px solid var(--line);border-radius:4px}.readout>span{font-size:var(--text-xs);letter-spacing:.7px;color:var(--muted)}.readout strong{display:block;font-size:var(--text-lg);font-variant-numeric:tabular-nums;margin:var(--space-2) 0}.readout div{font-size:var(--text-xs);color:var(--muted)}.caution{font-size:var(--text-xs);color:var(--muted);line-height:1.6;margin-top:var(--space-4)}footer{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-4) var(--space-8);font-size:var(--text-xs);color:var(--muted)}footer>span:first-child{letter-spacing:1px}.version{color:var(--accent)}footer button{font-size:var(--text-xs);border:0}dialog{background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:8px;max-width:650px;width:calc(100% - 32px);padding:var(--space-6);max-height:85vh}dialog::backdrop{background:#05080cc9;backdrop-filter:blur(5px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-5)}dialog p,dialog li{font-size:var(--text-sm);line-height:1.8;margin-bottom:var(--space-3)}dialog h3{font-size:var(--text-base)}.empty{padding:var(--space-5);color:var(--muted);font-size:var(--text-sm);line-height:1.6}
@media(min-width:1600px){.workspace{grid-template-columns:310px minmax(0,1fr) 280px;min-height:740px}}
@media(max-width:1150px){.workspace{grid-template-columns:235px minmax(0,1fr)}.inspector{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;column-gap:32px;border-left:0;border-top:1px solid var(--line)}.inspector>.eyebrow,.inspector>.preset-number,.inspector>h2,.inspector>.pill,.inspector>.description,.inspector>dl{grid-column:1}.inspector>.display-heading{grid-column:2;grid-row:1/3}.inspector>.setting{grid-column:2}.inspector>.setting:nth-of-type(1){grid-row:3}.inspector>.setting:nth-of-type(2){grid-row:4}.size-label{grid-column:2;grid-row:5}#size{grid-column:2;grid-row:6;align-self:start}.readout{grid-column:2;grid-row:6;align-self:end;margin-top:40px}.caution{grid-column:1/-1}.viewport{min-height:460px}.library{max-height:655px}}
@media(max-width:700px){.topbar{padding:var(--space-3) var(--space-4)}.brand{font-size:var(--text-sm);letter-spacing:1px}.brand span{font-size:var(--text-xs);letter-spacing:.3px}.topright{gap:var(--space-2)}.topright #sources,.offline{display:none}.topright #theme{font-size:var(--text-xs)}.intro{padding:var(--space-5) var(--space-4)}.intro p{display:none}.workspace{margin:0 var(--space-3);display:flex;flex-direction:column;overflow:hidden}.simulator{order:0}.library{order:1;border-right:0;border-top:1px solid var(--line);max-height:420px}.inspector{order:2;display:block}.viewport{min-height:390px}.view-top,.view-bottom{left:16px;right:16px}.view-bottom{letter-spacing:0}.view-bottom button{padding:var(--space-2);min-height:44px}.transport{padding:var(--space-3)}.transport-top{flex-wrap:wrap}.play-controls{gap:var(--space-1)}.play-controls #restart{font-size:var(--text-xs);padding:var(--space-2)}.time{font-size:var(--text-xs)}.transport-bottom{gap:var(--space-3);font-size:var(--text-xs)}.speed{gap:var(--space-1)}.primary{min-width:72px}.readout{margin-top:var(--space-3)}footer{flex-wrap:wrap;padding:var(--space-4);gap:var(--space-2)}footer>span:nth-child(2){order:2;width:100%}.library-foot{padding:var(--space-3) var(--space-5)}}
.library{max-height:none;min-height:0}.preset-list{min-height:0;max-height:540px}.library-foot{flex-shrink:0}
@media(max-width:700px){.library{height:460px;max-height:460px;flex:none}.preset-list{max-height:none}}
.selection-tools{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--line);font-size:var(--text-xs)}
.selection-tools button{font-size:var(--text-xs)}#selection-count{color:var(--accent);font-weight:700;margin-right:auto}.selection-help{width:100%;color:var(--muted);line-height:1.5}
#selection-editor-note{font-size:var(--text-xs);color:var(--muted);line-height:1.6;padding-bottom:var(--space-3);margin-bottom:var(--space-3);border-bottom:1px solid var(--line);grid-column:1/-1}
#stage{touch-action:none;cursor:crosshair}#selection-box{position:absolute;pointer-events:none;z-index:5;border:1px solid #ffc292;background:#ffb17c22;box-shadow:0 0 0 1px #0007}
#fixture-handles .fixture-handle.selected{border:2px solid #ffb17c;box-shadow:0 0 0 3px #ffb17c30;background:#ffb17c17!important}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.dmx-console{margin:0 var(--space-8) var(--space-4);background:var(--panel);border:1px solid var(--line);border-radius:5px}.dmx-toolbar{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-3);flex-wrap:wrap}.source-switch{display:flex;gap:var(--space-1)}.source-switch .active{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}#dmx-status{font-size:var(--text-sm);color:var(--muted);flex:1}#dmx-setup{font-size:var(--text-xs)}#dmx-monitor{padding:var(--space-4);border-top:1px solid var(--line)}.dmx-monitor-head,.dmx-monitor-foot{display:flex;justify-content:space-between;gap:var(--space-3);font-size:var(--text-xs);flex-wrap:wrap}.dmx-monitor-head strong{font-size:var(--text-sm)}#dmx-source,#dmx-packets{color:var(--muted)}.dmx-values{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--space-2);margin:var(--space-3) 0}.dmx-channel{border:1px solid var(--line);border-radius:4px;padding:var(--space-2) var(--space-3);background:var(--bg)}.dmx-channel span{display:block;font-size:var(--text-xs);color:var(--muted)}.dmx-channel strong{display:block;font-size:var(--text-lg);font-variant-numeric:tabular-nums;margin-top:var(--space-1)}.dmx-warning{font-size:var(--text-xs);color:var(--muted);line-height:1.5;margin-top:var(--space-3)}.patch-editor{padding-bottom:var(--space-4);margin-bottom:var(--space-4);border-bottom:1px solid var(--line)}.patch-editor .position-inputs{margin:var(--space-3) 0}.patch-editor button{width:100%;font-size:var(--text-xs)}.patch-editor p{font-size:var(--text-xs);color:var(--muted);line-height:1.5;margin-top:var(--space-2)}.live-mode .catalog-details,.live-mode .transport,.live-mode #apply-all{display:none}.live-mode .library{opacity:.45}.live-mode #dmx-stage-note{display:block}#dmx-stage-note{padding:var(--space-4);font-size:var(--text-xs);color:var(--accent);line-height:1.7}#dmx-stage-note span{color:var(--muted)}.dmx-help-body{padding:var(--space-6);line-height:1.7}.dmx-help-body p{margin-bottom:var(--space-4)}.dmx-help-body .receiver-preset{border:1px solid var(--accent);border-radius:4px;padding:var(--space-2) var(--space-3);color:var(--accent);background:var(--accent-soft);font-size:var(--text-sm)}.dmx-help-body li{padding:var(--space-1) 0}.dmx-help-body h3{font-size:var(--text-base)}.dmx-help-body code{overflow-wrap:anywhere;font-size:var(--text-sm)}[hidden]{display:none!important}
@media(max-width:700px){.dmx-console{margin:0 var(--space-3) var(--space-3)}.dmx-toolbar{gap:var(--space-2)}.source-switch{width:100%}.source-switch button{flex:1}.dmx-values{grid-template-columns:repeat(3,1fr)}#dmx-status{flex-basis:100%;order:2}.dmx-help-body{padding:var(--space-4)}.dmx-help-body ol{padding-left:var(--space-5)}}
.stage-tools{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);padding:var(--space-3);border-bottom:1px solid var(--line);flex-wrap:wrap}.stage-actions,.layout-files{display:flex;align-items:center;gap:var(--space-2)}.stage-tools button{font-size:var(--text-xs)}.stage-tools .primary{color:var(--panel)}#fixture-count{font-size:var(--text-xs);white-space:nowrap;color:var(--muted)}button:disabled{opacity:.4;cursor:not-allowed}.fixture-strip{display:flex;overflow:auto;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--line);scrollbar-width:thin}.fixture-strip button{flex:none;min-height:44px;font-size:var(--text-xs);font-variant-numeric:tabular-nums}.fixture-strip button span{color:var(--muted)}.fixture-strip .active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}.simulator{align-self:start}.viewport{height:520px;min-height:520px;flex:none}#fixture-handles{position:absolute;inset:0;pointer-events:none}.fixture-handle{position:absolute;transform:translateX(-50%);pointer-events:auto;touch-action:none;cursor:grab;padding:0;border:1px solid transparent;border-radius:5px;min-height:44px;background:transparent!important;transition:border-color .15s,box-shadow .15s}.fixture-handle:hover{border-color:#cbd4d660}.fixture-handle.selected{border-color:#efa16b90;box-shadow:0 0 0 3px #efa16b0d}.fixture-handle.dragging{cursor:grabbing;border-color:#ffbd88;box-shadow:0 0 0 4px #ffbd881f}.fixture-handle:focus-visible{outline:2px solid #ffc292;outline-offset:3px}.stage-settings{padding:var(--space-2) var(--space-3);display:flex;gap:var(--space-4);align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);font-size:var(--text-xs);color:var(--muted)}#layout-status{line-height:1.5}.stage-settings label{display:flex;gap:var(--space-2);align-items:center;flex-shrink:0}.stage-settings select{font-size:var(--text-xs)}.timeline-caption{display:flex;justify-content:space-between;font-size:var(--text-xs);color:var(--muted);gap:var(--space-2);margin-top:var(--space-4)}.timeline-wrap{margin-top:var(--space-1)}.fixture-editor{padding-bottom:var(--space-5);margin-bottom:var(--space-5);border-bottom:1px solid var(--line)}.fixture-editor-title{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);margin:var(--space-2) 0}.fixture-editor-title button{font-size:var(--text-xs)}.position-inputs{display:flex;gap:var(--space-3)}.position-inputs label{width:50%;color:var(--muted);font-size:var(--text-xs)}.position-inputs input{width:100%;min-height:44px;background:var(--bg);border:1px solid var(--line);color:var(--ink);border-radius:4px;padding:var(--space-2);margin-top:var(--space-1);font-size:var(--text-sm)}#apply-all{width:100%;font-size:var(--text-xs);margin-top:var(--space-3)}.fixture-editor p{font-size:var(--text-xs);color:var(--muted);line-height:1.5;margin-top:var(--space-3)}.inspector{max-height:980px;overflow:auto;scrollbar-width:thin}.library{align-self:stretch}.preset-list{max-height:760px}
@media(max-width:1150px) and (min-width:701px){.inspector{display:block;max-height:none;column-count:2;column-gap:32px}.inspector>*{break-inside:avoid}.inspector .fixture-editor{column-span:all;display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2) var(--space-6)}.fixture-editor>.eyebrow{grid-column:1/-1}.fixture-editor-title{grid-column:1}.position-inputs{grid-column:2;grid-row:2/4}.fixture-editor p{grid-column:1/-1}.stage-tools{gap:var(--space-2)}.preset-list{max-height:720px}}
@media(max-width:700px){.viewport{height:430px;min-height:430px}.stage-tools{padding:var(--space-2)}.stage-actions{flex-wrap:wrap;gap:var(--space-1)}.stage-tools button{padding:var(--space-2)}.layout-files{width:100%;justify-content:flex-end}.stage-settings{flex-wrap:wrap;gap:var(--space-2)}#layout-status{width:100%}.stage-settings label{margin-left:auto}.fixture-strip{padding:var(--space-2)}.view-bottom{font-size:var(--text-xs);gap:var(--space-2)}#drag-hint{max-width:175px;line-height:1.5}.inspector{max-height:none;overflow:visible}.preset-list{max-height:none}.fixture-editor{margin-bottom:var(--space-5)}}
.invert-setting{margin-top:var(--space-3);padding:var(--space-2) var(--space-3);border:1px solid var(--line);border-radius:4px;background:var(--bg)}.invert-setting .setting{min-height:44px}.invert-setting small{font-size:var(--text-xs);margin-left:var(--space-2);color:var(--muted)}.invert-setting:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}.invert-setting:has(input:checked) small{color:var(--accent)}.invert-setting p{margin:0 0 var(--space-2);font-size:var(--text-xs);line-height:1.5}#output-mode{font-size:var(--text-xs);color:var(--muted);line-height:1.6;margin-top:var(--space-2);letter-spacing:.4px}#output-mode.is-inverted,.fixture-strip .invert-badge{color:var(--accent)}.fixture-strip .invert-badge{font-size:var(--text-xs);font-weight:700;margin-left:var(--space-1)}@media(min-width:701px) and (max-width:1150px){.fixture-editor .invert-setting{grid-column:2;grid-row:4/7}}
.angle-editor{border-bottom:1px solid var(--line);padding-bottom:var(--space-5);margin-bottom:var(--space-5)}
.angle-inputs{display:grid;gap:var(--space-3);margin-top:var(--space-3)}
.angle-inputs label{font-size:var(--text-xs);color:var(--muted)}
.angle-inputs select{display:block;width:100%;min-height:44px;margin-top:var(--space-1);font-size:var(--text-sm)}
.angle-editor p,.angle-editor summary{font-size:var(--text-xs);line-height:1.5;color:var(--muted)}
.angle-editor p{margin-top:var(--space-3)}.angle-editor summary{cursor:pointer;margin-top:var(--space-3)}
.angle-editor button{font-size:var(--text-xs);width:100%;margin-top:var(--space-2)}
#angle-limit-status{color:var(--accent);font-variant-numeric:tabular-nums}
/* Mobile-only controls never participate in the desktop layout. */
.mobile-only{display:none!important}
/* Stage and compact transport remain visible while operating the bank below. */
html{scroll-padding-top:var(--stage-overlay-height,0px)}
.workspace{overflow:clip}
.stage-live{position:sticky;top:0;z-index:6;background:var(--panel);border-bottom:1px solid var(--line)}
.stage-live .viewport{height:clamp(300px,42vh,460px);min-height:0}
.view-actions,.zoom-controls{display:flex;align-items:center;gap:6px}
.zoom-controls{pointer-events:auto;letter-spacing:0}
.zoom-controls button{min-width:30px;padding:3px 7px;min-height:32px}
#zoom-value{min-width:34px;text-align:center;font-variant-numeric:tabular-nums}
.stage-live .view-bottom.layout-tools{position:static;display:block;background:#0d1013;padding:8px 12px;border-top:1px solid #ffffff10;letter-spacing:0}
.layout-tools .view-actions{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;width:100%;pointer-events:auto}
.layout-tools .zoom-controls{grid-column:1/-1;gap:6px}
.layout-tools .zoom-controls button{white-space:nowrap}
.layout-tools #snap-grid[aria-pressed=true]{color:#ffb17c;background:#ffb17c18;border-color:#ffb17c}
.layout-spacing{display:flex;flex-direction:column;min-width:0;font-size:12px;line-height:1.4;cursor:pointer}
.layout-spacing>span{display:flex;align-items:center;justify-content:space-between;gap:6px}
#spacing-value{font-size:11px;color:#a6acae;font-variant-numeric:tabular-nums}
#layout-spacing{width:100%;min-width:0;margin:0;min-height:32px;touch-action:pan-y}
#layout-spacing:disabled{opacity:.35;cursor:not-allowed}
.layout-tools #snapshot{grid-column:2;grid-row:2;align-self:center}
.playback-bar #speed{width:70px;min-height:32px;background:var(--bg);color:var(--ink);border:1px solid var(--line);border-radius:4px;padding:4px;font-variant-numeric:tabular-nums}
.playback-bar #speed[aria-invalid=true]{border-color:#ef6d5b}
.group-control-help{order:6;line-height:1.5;margin:6px 0}
.playback-bar.stage-settings{padding:6px 10px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.playback-bar .transport{display:flex;align-items:center;gap:8px;flex-wrap:wrap;flex:1;padding:0;border:0;opacity:1}
.playback-bar .play-controls{gap:3px}
.playback-bar button,.playback-bar select{min-height:32px;padding:4px 7px;font-size:var(--text-xs)}
.playback-bar #play{min-width:52px}
.playback-bar .nav-arrow,.playback-bar #prev,.playback-bar #next{width:28px;min-width:28px;display:grid;place-items:center;padding:0}
.playback-bar .check{min-height:32px;font-size:var(--text-xs);gap:4px}
.playback-bar .speed{margin-left:0;gap:4px}
.playback-bar .time{font-size:var(--text-xs)}
.playback-bar .scale-control{margin-left:auto;white-space:nowrap;font-size:var(--text-xs);display:flex;align-items:center;gap:6px}
.arrow{display:block;position:relative;width:16px;height:16px}
.arrow::before{content:'';position:absolute;top:4px;left:2px;width:7px;height:7px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg)}
.arrow.back::before,.arrow.start::before{left:6px;transform:rotate(-135deg)}
.arrow.start::after,.arrow.end::after{content:'';position:absolute;left:14px;top:2px;height:12px;border-left:1.5px solid currentColor}
.arrow.start::after{left:1px}
.compact-timeline{display:flex;align-items:center;gap:10px;padding:0 10px;height:25px;font-size:var(--text-xs);color:var(--muted)}
.compact-timeline>span{max-width:180px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.compact-timeline .timeline-wrap{height:22px;flex:1;margin:0}
#playback-bank{display:flex;flex-direction:column;padding:6px 8px}
#playback-bank .bank-heading{order:0;margin-bottom:6px}
#playback-bank .bank-heading .eyebrow{display:none}
#playback-bank .bank-heading h2{font-size:var(--text-sm);margin:0}
#playback-bank .bank-badge{padding:3px 6px}
#bank-controls{order:1;display:flex;flex-direction:column}
.bank-console-layout{order:0}
.bank-toolbar{order:1;margin:6px 0 0}
.cue-recorder{order:2}
.virtual-fader-start{order:3;margin:6px 0}
#layout-status{order:4;font-size:var(--text-xs);line-height:1.5;color:var(--accent)}
#bank-status{order:5}
#mapping-status{order:6}
.bank-help{order:7}
.fader-track,.fader-track input[type=range]{height:100px}
.fader-strip{gap:4px;padding:4px}
.fader-strip .fader-label{height:28px}
.fader-strip output{white-space:nowrap;min-height:16px}
.fader-strip .flash-key{min-height:28px;height:28px}
.fader-strip .fader-settings{min-height:24px}
.fader-strip .fader-capture{min-height:30px}
.bank-master{gap:8px;padding-top:6px}
.bank-master .fader-track{margin-top:48px}
.macro-key{min-height:28px;padding:2px}
.macro-edit{min-height:18px;padding:0}
#macro-grid{gap:2px 4px}
.macro-panel .check{min-height:28px}
.stage-actions{flex-wrap:wrap}
.bank-mode .transport{opacity:1}
.live-mode .playback-bar .transport{display:none}
.live-mode .compact-timeline{display:none}
@media(max-width:700px){
 .stage-live .viewport{height:300px}
 .stage-live .view-bottom #drag-hint{display:none}
 .stage-live .view-bottom{justify-content:flex-end}
 .stage-live .view-top{font-size:10px;letter-spacing:.3px;gap:12px}
 .playback-bar.stage-settings{gap:4px;padding:4px}
 .playback-bar .transport{gap:4px}
 .playback-bar .scale-control{width:100%;justify-content:flex-end}
 .compact-timeline>span{max-width:110px}
 .bank-console-layout{grid-template-columns:minmax(0,1fr) 64px}
}
/* Phone workspace. All visual overrides are confined to the existing 700px breakpoint. */
@media(max-width:700px){
 html{scroll-padding-top:8px;scroll-padding-bottom:90px}
 body[data-mobile-panel]{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}
 .mobile-only{display:flex!important}
 .topbar{padding:10px 14px;min-height:64px}
 .topbar .brand span{display:none}
 .topbar .brand svg{width:25px;height:25px}
 .topbar #theme{min-height:44px}
 .intro.intro-blank{display:none}
 .mobile-heading{padding:12px 16px;align-items:center;justify-content:space-between;gap:10px}
 .mobile-heading #mobile-section-title{font-size:18px;font-weight:700}
 .mobile-heading small{display:block;font-size:10px;letter-spacing:.6px;color:var(--muted);margin-top:4px}
 #mobile-now{font-size:12px;color:var(--accent);font-variant-numeric:tabular-nums}
 .mobile-nav{position:fixed;bottom:0;left:0;right:0;z-index:30;background:var(--panel);border-top:1px solid var(--line);padding:8px 10px calc(8px + env(safe-area-inset-bottom,0px));gap:6px;box-shadow:0 -4px 16px #0000000d}
 .mobile-nav button{flex:1;min-width:0;min-height:48px;font-size:13px;font-weight:700;padding:8px 4px}
 .mobile-nav button[aria-pressed=true]{background:var(--accent-soft);color:var(--accent);border-color:var(--accent)}
 .workspace{margin:0 10px;min-height:0;overflow:visible;border-radius:6px}
 .workspace .simulator{display:contents}
 .stage-live{position:relative;top:auto;order:3;z-index:1}
 .stage-live .viewport{height:clamp(220px,30svh,280px);min-height:0}
 .stage-live .view-bottom{left:10px;right:10px;bottom:8px}
 .stage-live .view-actions{width:100%;justify-content:space-between}
 .zoom-controls{gap:4px}
 .zoom-controls button{min-width:44px;min-height:44px}
 #snapshot{min-height:44px;font-size:12px}
 .stage-live .view-bottom.layout-tools{padding:8px 6px}
 .layout-tools .zoom-controls{gap:4px;justify-content:space-between}
 .layout-tools .zoom-controls button{font-size:11px;padding:3px 5px}
 .layout-tools #layout-spacing{min-height:44px}
 .view-bottom #drag-hint{display:none}
 .playback-bar.stage-settings{padding:10px;gap:8px}
 .playback-bar .transport{width:100%;gap:8px;flex-wrap:wrap}
 .playback-bar .play-controls{flex:1 1 calc(100% - 64px);display:flex;gap:8px}
 .playback-bar #play{flex:1;min-height:48px;font-size:15px}
 .playback-bar #prev,.playback-bar #next{min-width:48px;width:48px;min-height:48px}
 .playback-bar .mobile-more{min-width:56px;min-height:48px;align-items:center;justify-content:center;font-size:13px}
 .playback-bar .check:has(#tour){min-height:44px;flex:1;margin:0;font-size:14px;gap:8px;white-space:nowrap}
 .playback-bar .time{margin:0;font-size:12px}
 .playback-bar #cue-start,.playback-bar #cue-end,.playback-bar #restart,
 .playback-bar .check:has(#loop),.playback-bar .speed,.playback-bar .scale-control{display:none}
 .mobile-options-open .playback-bar .play-controls{flex-wrap:wrap;flex-basis:calc(100% - 64px)}
 .mobile-options-open .playback-bar #cue-start,.mobile-options-open .playback-bar #cue-end,
 .mobile-options-open .playback-bar #restart{display:grid;min-height:44px;min-width:44px}
 .mobile-options-open .playback-bar .speed,.mobile-options-open .playback-bar .scale-control,
 .mobile-options-open .playback-bar .check:has(#loop){display:flex;min-height:44px;margin:0}
 .mobile-options-open .playback-bar .speed{flex-wrap:wrap;flex-basis:100%;gap:6px}
 .playback-bar .speed button,.playback-bar #speed,.playback-bar select{min-height:44px}
 .playback-bar .speed button{min-width:44px}
 .playback-bar .scale-control{justify-content:space-between;width:100%}
 .compact-timeline{height:40px;padding:0 10px}
 .compact-timeline .timeline-wrap{height:40px}
 .mobile-stage-actions{order:4;padding:12px;gap:10px;flex-direction:column}
 .mobile-stage-actions button{flex:1;min-height:48px;font-size:14px}
 .mobile-stage-library-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}
 .mobile-stage-library-heading h2{font-size:15px}
 .mobile-stage-library-heading>span{font-size:12px;color:var(--muted)}
 #mobile-stage-sequences{height:170px;overflow-y:auto;overscroll-behavior-y:contain;border:1px solid var(--line);border-radius:5px;scrollbar-width:thin}
 #mobile-stage-sequences .stage-sequence-row{display:grid;grid-template-columns:30px minmax(0,1fr) 44px;align-items:center;gap:8px;width:100%;height:56px;min-height:56px;padding:8px;border:0;border-bottom:1px solid var(--line);border-radius:0;text-align:left}
 .stage-sequence-number,.stage-sequence-duration{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
 .stage-sequence-duration{text-align:right}
 .stage-sequence-title{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:13px}
 #mobile-stage-sequences .active{background:var(--accent-soft)}
 #mobile-stage-sequences .active .stage-sequence-number{color:var(--accent)}
 #mobile-stage-sequences .active .stage-sequence-title{font-weight:700}
 #mobile-stage-invert{align-items:center;justify-content:center}
 #mobile-stage-invert[aria-pressed=true],#mobile-stage-invert[aria-pressed=mixed]{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}
 body[data-mobile-panel=stage] .stage-tools .layout-files{display:none}
 body[data-mobile-panel=stage] .stage-tools .stage-actions{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
 body[data-mobile-panel=stage] .stage-tools button{min-height:48px}
 body[data-mobile-panel=stage] #fixture-count{text-align:center}
 body:not([data-mobile-panel=stage]) #mobile-stage-invert{display:none!important}
 .fixture-strip{order:2;min-height:56px}
 .fixture-strip button{min-height:44px}
 .stage-tools{order:0}
 .selection-tools{order:1}
 .inspector.inspector{order:6}
 .workspace .library,.workspace .library.favorites-library{order:5;height:560px;max-height:none;min-height:440px}
 .library .section-head{padding:14px 16px}
 .library .library-foot{display:none}
 .library .filters{margin:8px 12px}
 .library .filters button{min-height:44px;font-size:13px}
 .library #search{margin:0 12px;width:calc(100% - 24px)}
 .library .list-meta{padding:8px 12px}
 .library #preset-list{min-height:180px;flex:1;overscroll-behavior-y:contain}
 .library .preset{min-height:64px;padding:10px 8px}
 .library .favorite-star{min-width:44px}
 .library .favorite-sort button{min-width:44px;min-height:44px}
 .library .favorite-row{flex-wrap:wrap}
 .library .favorite-sort{width:100%;flex-direction:row;justify-content:flex-start}
 .library .favorite-row .preset{flex:1}
 .library #favorite-tools{max-height:230px;overflow:auto}
 #playback-bank{order:5;padding:14px 10px}
 .bank-console-layout{grid-template-columns:minmax(0,1fr) 68px;gap:6px}
 .bank-scroll{overflow:visible;padding:4px}
 #fader-grid{grid-template-columns:repeat(var(--mobile-faders,6),minmax(0,1fr));width:var(--mobile-bank-width,100%);min-width:0;gap:2px}
 .fader-strip{padding:6px 1px;gap:4px;min-width:0}
 .fader-strip.mobile-fader-hidden{display:none}
 .fader-strip .fader-byte{width:100%;padding:3px 0;font-size:13px}
 .fader-strip .fader-percent{font-size:10px}
 .fader-strip .fader-settings{font-size:0!important}
 .fader-strip .fader-settings::after{content:"•••";font-size:16px}
 body:not(.mobile-fader-details) .fader-strip :is(.strip-name,.fader-dmx-row,.cue-assignment,.fader-capture){display:none}
 .fader-strip .fader-dmx-row{flex-direction:column;gap:4px;min-height:88px}
 .fader-strip .fader-dmx{width:100%;min-width:0;min-height:44px;padding:2px;font-size:12px}
 .fader-strip .dmx-priority{min-height:32px;min-width:32px}
 .fader-strip .strip-name,.fader-strip .cue-assignment{width:100%;min-width:0;padding:2px;font-size:10px!important}
 .fader-strip .fader-capture{white-space:normal;font-size:10px;padding:2px}
 .mobile-bank-tools{order:4;align-items:center;gap:6px;padding:12px 8px 8px}
 .mobile-bank-tools>div{flex:1;min-width:0}
 .mobile-bank-tools h2{font-size:14px}
 .mobile-bank-tools span{font-size:11px;color:var(--muted)}
 .mobile-bank-tools button{min-height:44px;min-width:44px;padding:4px;font-size:22px}
 #mobile-fader-assignments{font-size:11px}
 .fader-strip .strip-name{min-height:44px;font-size:12px}
 .fader-strip .cue-assignment{height:44px;min-height:44px}
 .fader-strip .fader-settings,.fader-strip .fader-capture,.fader-strip .flash-key{min-height:44px;height:auto}
 .fader-strip .fader-byte,.bank-master .fader-byte{min-height:44px;max-width:100%}
 .fader-track,.fader-track input[type=range]{height:140px}
 .fader-track input[type=range]{width:44px}
 .fader-track input::-webkit-slider-thumb{height:30px;width:36px}
 .fader-track input::-moz-range-thumb{height:30px;width:36px}
 .macro-key,.macro-edit{min-height:44px}
 #macro-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
 .virtual-fader-start{order:-1}
 .bank-toolbar{order:1}
 .dmx-console{margin:0 10px 10px}
 .dmx-toolbar{padding:8px}
 .source-switch{flex-wrap:nowrap}
 .source-switch button{font-size:12px;padding:6px;min-height:44px}
 #dmx-status{font-size:12px}
 body:not([data-mobile-panel=setup]) #dmx-setup,body:not([data-mobile-panel=setup]) #vista-layout-download{display:none}
 body[data-mobile-panel=sequences] .dmx-console{display:none}
 body[data-mobile-panel=sequences] .fixture-strip{display:none}
 body[data-mobile-panel=sequences] .stage-live .viewport,body[data-mobile-panel=sequences] .compact-timeline{display:none}
 body[data-mobile-panel=sequences] .library .section-head{display:none}
 body[data-mobile-panel=sequences] .workspace .library{height:calc(100svh - 310px);min-height:370px;padding-top:12px}
 body[data-mobile-panel=faders] .stage-live .viewport{height:240px}
 body[data-mobile-panel=faders] .stage-live{display:none}
 body[data-mobile-panel=faders] .virtual-fader-start,
 body[data-mobile-panel=faders] p.bank-hint:not(#mapping-status){display:none}
 .fader-strip.dmx-priority-mode .fader-label,
 .fader-strip.dmx-priority-mode .cue-assignment{display:none}
 body[data-mobile-panel=sequences] .view-bottom,body[data-mobile-panel=faders] .view-bottom{display:none}
 body:not([data-mobile-panel=stage]) .mobile-stage-actions{display:none!important}
 body:not([data-mobile-panel=sequences]):not([data-mobile-panel=faders]) .workspace .library{display:none}
 body:not([data-mobile-panel=faders]) #playback-bank{display:none}
 body[data-mobile-panel=faders] #playback-bank,
 body[data-mobile-panel=faders] #bank-controls,
 body[data-mobile-panel=faders] .bank-console-layout{display:contents}
 body[data-mobile-panel=faders] .bank-heading{display:none}
 body[data-mobile-panel=faders] .bank-scroll{order:4;overflow-x:auto;overscroll-behavior-x:contain;max-width:100%;min-width:0;padding:4px;border-radius:0}
 body[data-mobile-panel=faders] .bank-master{display:none}
 body[data-mobile-panel=faders] .workspace .library{order:5;display:flex}
 body[data-mobile-panel=faders] .bank-toolbar{order:6;padding:12px}
 body[data-mobile-panel=faders] .cue-recorder{order:7;padding:12px}
 body[data-mobile-panel=faders] .macro-panel{order:8;margin:12px}
 body[data-mobile-panel=faders] #layout-status,
 body[data-mobile-panel=faders] #bank-status,
 body[data-mobile-panel=faders] #virtual-dmx-monitor,
 body[data-mobile-panel=faders] #mapping-status,
 body[data-mobile-panel=faders] .bank-help{order:9;padding:0 12px 12px}
 body.bank-mode[data-mobile-panel=stage] #playback-bank,
 body.bank-mode[data-mobile-panel=stage] #bank-controls,
 body.bank-mode[data-mobile-panel=stage] .bank-console-layout{display:contents}
 body.bank-mode[data-mobile-panel=stage] .bank-scroll{order:4;overflow-x:auto;overscroll-behavior-x:contain;max-width:100%;min-width:0;padding:4px;border-radius:0}
 body.bank-mode[data-mobile-panel=stage] .mobile-stage-actions{order:5}
 body.bank-mode[data-mobile-panel=stage] #playback-bank :is(.bank-heading,.virtual-fader-start,.bank-toolbar,.bank-master,.macro-panel,.cue-recorder,#cue-stack,.bank-hint,.bank-help,#layout-status,#bank-status,#virtual-dmx-monitor){display:none}
 body:not([data-mobile-panel=setup]) .inspector.inspector,
 body:not([data-mobile-panel=setup]):not([data-mobile-panel=stage]) .stage-tools,
 body:not([data-mobile-panel=setup]) .selection-tools{display:none}
 body[data-mobile-panel=setup] .stage-live{display:none}
 body[data-mobile-panel=setup] .selection-help{font-size:0}
 body[data-mobile-panel=setup] .selection-help::after{content:"Tap a fixture to select. Edit its position and settings below.";font-size:12px}
 .stage-actions,.layout-files{gap:8px}
 .stage-actions button,.layout-files button{flex:1;min-height:44px}
 .selection-tools{flex-wrap:wrap}
 .inspector.inspector{padding:16px;border-left:0}
 .inspector.inspector>*{order:6}
 .inspector #selection-editor-note{order:-4}
 .inspector .fixture-editor{order:-3}
 .inspector .angle-editor{order:-2}
 .inspector .nozzle-editor,.inspector .flame-scale-editor{order:-1}
 .inspector .virtual-arm{order:0}
 .inspector .patch-editor{order:2}
 .inspector #rear-panel{order:3}
 .inspector .catalog-details{order:4}
 .inspector .readout{order:5}
 .inspector .catalog-details{padding-bottom:16px}
 input:not([type=checkbox]):not([type=range]),select{font-size:16px}
 .inspector input:not([type=checkbox]):not([type=range]),.inspector select{min-height:44px}
 dialog{max-width:calc(100vw - 20px);max-height:calc(100dvh - 24px);margin:auto}
 dialog .dialog-head{position:sticky;top:0;z-index:2;background:var(--panel)}
 dialog button{min-height:44px}
 footer{margin-top:16px}
}
/* Beta 0.16: compact credit history and local stage video capture. */
#credit-trend{width:42px;height:16px}
.fixture-coming:disabled{opacity:.55;cursor:not-allowed}
.fixture-coming span,.fixture-coming small{display:block;white-space:nowrap}
.fixture-coming small{font-size:10px;margin-top:3px;font-weight:400}
.view-top{align-items:center;gap:8px}
.view-top #state-label{margin-left:auto}
.view-top .layout-record{pointer-events:auto;display:flex;align-items:center;justify-content:center;gap:6px;min-width:36px;min-height:36px;padding:6px;border:1px solid #ffffff25;background:#11171d99;color:#f4f4f4;border-radius:50px;letter-spacing:0}
.record-dot{width:10px;height:10px;border-radius:50%;background:#f04444;flex:none}
.is-recording .record-dot{border-radius:2px;box-shadow:0 0 8px #f0444480}
.record-time{font-size:11px;font-variant-numeric:tabular-nums}
.record-time:empty{display:none}
#layout-recordings{max-width:740px}
.record-options{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px}
.record-options label{display:grid;gap:6px;font-size:12px;min-width:0}
.record-options select{width:100%;min-width:0}
.recording-list article{border-top:1px solid var(--line);margin-top:20px;padding-top:12px}
.recording-list h3{overflow-wrap:anywhere}
.recording-list video{display:block;max-width:100%;width:100%;max-height:360px;background:#0d1013;margin:12px 0}
.recording-list a{padding:10px;border:1px solid var(--line);border-radius:5px;text-decoration:none;display:inline-flex;align-items:center}
@media(max-width:500px){.record-options{grid-template-columns:1fr}.view-top{left:12px;right:12px}.view-top .layout-record{min-width:40px;min-height:40px}}

/* Beta 0.19: Home control inside the Nozzle Direction readout. */
.readout .home-control{display:flex;gap:8px;align-items:flex-end;margin-top:10px;width:100%}
.readout .home-control label{flex:1;display:flex;flex-direction:column;gap:4px;font-size:var(--text-xs);letter-spacing:.6px;text-transform:uppercase;color:var(--muted);text-align:left}
.readout .home-control input{width:100%;min-height:40px;padding:6px 8px;border:1px solid var(--line);border-radius:5px;background:var(--panel);color:inherit;text-align:center;font-variant-numeric:tabular-nums}
.readout .home-control button{min-width:92px;min-height:40px;font-weight:700}
.readout #home-status{margin:6px 0 0;font-size:var(--text-xs);color:var(--muted);line-height:1.4;text-align:left}
#controls-home{font-weight:700}
/* Beta 0.19: fixture quick-action menu and shortcut reference. */
.quick-menu{position:fixed;z-index:60;min-width:220px;display:flex;flex-direction:column;gap:2px;padding:6px;background:var(--panel);border:1px solid var(--line);border-radius:8px;box-shadow:0 12px 32px #00000055}
.quick-menu button{width:100%;min-height:40px;border:0;border-radius:5px;padding:6px 12px;font-size:var(--text-sm);justify-content:center}
.quick-menu button:hover,.quick-menu button:focus-visible{background:var(--accent-soft);color:var(--accent)}
.quick-menu button:disabled{opacity:.45}
.quick-menu [data-quick=remove]{color:#e5836b}
.shortcuts-dialog{border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--ink);padding:20px 22px;width:min(520px,calc(100vw - 32px))}
.shortcuts-dialog::backdrop{background:#0009}
.shortcuts-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}
.shortcuts-head h2{margin:0;font-size:var(--text-lg)}
.shortcuts-head button{min-width:44px;min-height:44px;font-size:20px}
.shortcuts-list{margin:0;display:grid;gap:8px}
.shortcuts-list>div{display:grid;grid-template-columns:170px minmax(0,1fr);gap:12px;align-items:center;padding:6px 0;border-bottom:1px solid var(--line)}
.shortcuts-list dt,.shortcuts-list dd{margin:0}
.shortcuts-list kbd{display:inline-block;font:inherit;font-size:var(--text-xs);font-weight:700;letter-spacing:.4px;padding:4px 8px;border:1px solid var(--line);border-bottom-width:2px;border-radius:5px;background:var(--bg)}
.shortcuts-list dd{font-size:var(--text-sm);color:var(--muted)}
.shortcuts-note{margin:14px 0 0;font-size:var(--text-xs);color:var(--muted)}
@media(max-width:700px){.topright #shortcuts{display:none}.shortcuts-list>div{grid-template-columns:1fr}}
/* Beta 0.19: every labelled button centers its text. List rows (sequence library, session lists) keep their column layout. */
button{text-align:center;line-height:1.25}
button:not(.preset):not(.stage-sequence-row):not(.fixture-handle):not(.workspace-grip):not(.fuel-panel button){text-align:center}
.workspace-grip,.settings-shell nav button,.monitor-card>header>button:first-child,.fuel-panel button{text-align:center}
.fuel-panel button{align-items:center}
.stage-tools button,.stage-actions button,.layout-files button,.layout-quick-defaults button,.chase-controls button,.mobile-nav button,.mobile-stage-actions button,.zoom-controls button,.view-actions button,.filters button,.source-switch button,.dmx-toolbar button,.workspace-custom-bar button,.playback-bar button,.fixture-strip button{display:inline-flex;align-items:center;justify-content:center;text-align:center}
.fixture-coming{flex-direction:column;gap:2px;line-height:1.15}
.fixture-coming small{display:block}
.fixture-strip button span{display:inline}
/* Beta 0.20: centered fader Settings and rear-panel keys; fader universe tag; Unit List drag box; shortcut hints */
.fader-strip .fader-settings{display:flex;align-items:center;justify-content:center;text-align:center;padding-inline:0!important;overflow:hidden;white-space:nowrap;font-size:clamp(9px,.62rem,11px);letter-spacing:0}
#workspace-focus .fader-strip .fader-settings::after{margin:0}
.rear-keys button{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding-inline:0!important;gap:2px;line-height:1.1;overflow:hidden}
.rear-keys button span{margin-top:0;width:100%;text-align:center}
.fader-universe{flex:none;font-size:9px;line-height:1;color:var(--muted);font-variant-numeric:tabular-nums;padding:2px 3px;border:1px solid var(--line);border-radius:3px}
.fader-universe.custom{color:var(--accent);border-color:var(--accent)}
.fader-patch{border:1px solid var(--line);border-radius:6px;padding:var(--space-2) var(--space-3);margin:var(--space-2) 0;display:grid;gap:var(--space-2)}
.fader-patch legend{font-size:var(--text-xs);font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:0 var(--space-1)}
.fader-patch input:disabled{opacity:.55}
.fixture-strip{position:relative;user-select:none}
.fixture-strip.strip-selecting{cursor:crosshair}
.strip-select-box{position:fixed;z-index:60;pointer-events:none;border:1px solid var(--accent);background:color-mix(in srgb,var(--accent) 14%,transparent);border-radius:3px}
.stage-toast{position:absolute;left:50%;top:12px;transform:translateX(-50%);z-index:8;background:#101719e6;color:#f4f1ea;border:1px solid #efa16b80;border-radius:6px;padding:6px 12px;font-size:12px;pointer-events:none;white-space:nowrap}
.dev-log-tools{display:flex;gap:8px;margin:10px 0}
.dev-log{display:grid;gap:8px;max-height:min(60vh,560px);overflow:auto;padding-right:4px;scrollbar-width:thin}
.dev-log-entry{border:1px solid var(--line);border-radius:6px;background:var(--bg)}
.dev-log-entry[open]{border-color:color-mix(in srgb,var(--accent) 45%,var(--line))}
.dev-log-entry summary{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:baseline;padding:10px 12px;cursor:pointer;list-style-position:inside}
.dev-log-entry summary strong{color:var(--accent);font-variant-numeric:tabular-nums;white-space:nowrap}
.dev-log-entry summary span{font-weight:600;min-width:0}
.dev-log-entry summary time{font-size:11px;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.dev-log-entry ul{margin:0;padding:0 16px 12px 32px;display:grid;gap:4px;font-size:13px;line-height:1.4;color:var(--ink)}.dev-log-entry li{margin:0}
@media(max-width:700px){.dev-log-entry summary{grid-template-columns:auto minmax(0,1fr)}.dev-log-entry summary time{grid-column:1/-1}.dev-log{max-height:none}}
.record-options .record-sequence{grid-column:1/-1;display:flex;align-items:flex-start;gap:10px;font-size:13px;cursor:pointer}
.record-options .record-sequence input{width:18px;height:18px;margin:2px 0 0;flex:none}
.record-options .record-sequence small{display:block;color:var(--muted);font-size:12px;margin-top:3px;line-height:1.4}
.recording-sequences{font-size:12px;color:var(--muted);overflow-wrap:anywhere;margin-top:6px}
.readout.home-panel{margin-top:var(--space-3)}
.readout.home-panel .home-control{margin-top:var(--space-2)}
.workspace-card-content .readout.home-panel{margin:0}
.readout .home-control{flex-wrap:wrap}
.readout .home-control label{flex:1 1 96px;min-width:96px;white-space:nowrap}
.readout .home-control input{min-width:70px}
.readout .home-control button{flex:1 1 92px}
/* Beta 0.29d: manual button + dialog, footer helper mark, live visitor count */
#manual-open{border-color:var(--accent);color:var(--accent)}
#manual-dialog{width:min(1100px,96vw);max-width:96vw;height:min(92vh,980px);padding:0;overflow:hidden;display:none;flex-direction:column}
#manual-dialog[open]{display:flex}
#manual-dialog .dialog-head{flex:none;margin:0;padding:12px 16px;border-bottom:1px solid var(--line)}
#manual-dialog .manual-actions{display:flex;gap:8px;align-items:center}
#manual-dialog .manual-actions a{color:var(--accent);font-size:var(--text-sm);text-decoration:none;padding:6px 10px;border:1px solid var(--line);border-radius:5px}
#manual-frame{flex:1 1 auto;width:100%;height:100%;border:0;background:#0b0e11}
footer .credits{display:inline-flex;align-items:center;gap:10px;flex-wrap:wrap}
.helper-mark{position:relative;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px}
.helper-mark .claude-mark{display:block}
.helper-bubble{position:absolute;bottom:calc(100% + 7px);left:50%;transform:translateX(-50%);background:#fff;color:#1a1a1a;font-size:10px;font-weight:700;line-height:1;padding:5px 8px;border-radius:10px;white-space:nowrap;box-shadow:0 2px 6px rgba(0,0,0,.35);font-family:"Comic Sans MS","Chalkboard SE","Comic Neue",cursive,var(--font-body)}
.helper-bubble::after{content:"";position:absolute;top:100%;left:50%;width:0;height:0;border:5px solid transparent;border-top-color:#fff;border-bottom:0;transform:translateX(-50%)}
.footer-explore{display:inline-flex;align-items:center;gap:10px;flex-wrap:wrap}
.visitors{display:inline-flex;align-items:center;gap:6px;font-size:var(--text-xs);color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.visitors[hidden]{display:none}
.visitors i{width:7px;height:7px;border-radius:50%;background:#2fbf71;box-shadow:0 0 0 0 rgba(47,191,113,.6);animation:visitor-pulse 2.4s ease-out infinite}
.visitors b{color:var(--ink);font-weight:700}
@keyframes visitor-pulse{0%{box-shadow:0 0 0 0 rgba(47,191,113,.55)}70%{box-shadow:0 0 0 7px rgba(47,191,113,0)}100%{box-shadow:0 0 0 0 rgba(47,191,113,0)}}
@media(prefers-reduced-motion:reduce){.visitors i{animation:none}}
@media(max-width:700px){.topright #manual-open{font-size:var(--text-xs)}footer .credits{gap:8px}}
/* Console follow: on-screen feedback for Vista console input (mapped bank or Live Input mirror). */
.fader-strip.console-mirror{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent-soft)}
.fader-strip.console-mirror .fader-number{color:var(--accent)}
.fader-strip.console-mirror .fader-number::after{content:"VISTA";display:block;font-size:8px;letter-spacing:.12em;line-height:1.2;color:var(--accent);opacity:.85}
#bank-controls:disabled:has(.fader-strip.console-mirror){opacity:.92}
.fader-strip.console-touched .fader-track{box-shadow:0 0 0 2px var(--accent),0 0 14px 2px #ff9a4a66;border-radius:6px;transition:box-shadow .12s}
.fader-strip .fader-track{transition:box-shadow .6s ease}
.playback-root.console-master-touched #bank-master-level,.console-master-touched #bank-master-level{box-shadow:0 0 0 2px var(--accent),0 0 14px 2px #ff9a4a66;border-radius:6px}
.fader-strip .flash-key.console-pressed,.macro-key.console-pressed{background:#d9742a;border-color:#ffd7b3;box-shadow:0 0 0 2px #ffb17c66,0 0 16px 2px #ff9a4a88;transform:translateY(1px)}
.flash-key.console-hit,.macro-key.console-hit{animation:console-hit .35s ease-out}
@keyframes console-hit{0%{box-shadow:0 0 0 0 #ffd7b3cc,0 0 0 0 #ff9a4a}60%{box-shadow:0 0 0 6px #ffd7b300,0 0 24px 6px #ff9a4a66}100%{box-shadow:0 0 0 2px #ffb17c66,0 0 16px 2px #ff9a4a88}}
@media (prefers-reduced-motion:reduce){.flash-key.console-hit,.macro-key.console-hit{animation:none}.fader-strip .fader-track{transition:none}}
/* Virtual SFX Lab branding, trial pill and trial lock (studio page). */
.brand .module-badge{display:flex;align-items:center;gap:6px;letter-spacing:.3px;text-transform:none}
.brand .module-badge b{font-size:9px;letter-spacing:1.2px;text-transform:uppercase;font-weight:700;color:var(--accent);border:1px solid var(--accent);border-radius:3px;padding:1px 5px;line-height:1.3}
.back-demo{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:var(--space-2) var(--space-3);border:1px solid var(--line);border-radius:5px;color:var(--ink);text-decoration:none;font-size:var(--text-sm);white-space:nowrap;transition:background .15s,border .15s}.back-demo:hover{background:var(--panel2);border-color:var(--muted)}.back-demo span{color:var(--accent);font-size:var(--text-base);line-height:1}.back-demo b{font-weight:500}
@media(max-width:700px){.back-demo{padding:var(--space-2);gap:0;min-width:44px;justify-content:center}.back-demo b{display:none}}
.trial-pill{display:inline-flex;align-items:center;gap:6px;font-size:var(--text-xs);letter-spacing:.4px;text-decoration:none;color:var(--ink);border:1px solid var(--line);border-radius:999px;padding:4px 10px;font-variant-numeric:tabular-nums;white-space:nowrap}
.trial-pill::before{content:"";width:6px;height:6px;border-radius:50%;background:#2fbf71}
.trial-pill.is-ending{border-color:var(--accent);color:var(--accent)}.trial-pill.is-ending::before{background:var(--accent)}
.trial-pill[data-state=expired]{border-color:#c0392b;color:#ff8a7a}.trial-pill[data-state=expired]::before{background:#c0392b}
.trial-pill:hover{border-color:var(--accent)}
html.trial-checking body{visibility:hidden}
html.trial-locked body>*:not(#trial-lock){filter:blur(2px) saturate(.6);pointer-events:none;user-select:none}
.trial-lock{width:min(640px,94vw);border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--ink);padding:28px 30px;box-shadow:0 30px 80px #000a}
.trial-lock::backdrop{background:#05070899;backdrop-filter:blur(4px)}
.trial-lock .eyebrow{font-size:var(--text-xs);letter-spacing:1.5px;font-weight:600;color:var(--accent);margin:0 0 10px}
.trial-lock h2{margin:0 0 10px;font-size:var(--text-xl);letter-spacing:-.5px}
.trial-lock p{margin:0 0 14px;line-height:1.55;color:var(--muted)}
.trial-offers{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0}
.trial-offers article{border:1px solid var(--line);border-radius:8px;padding:14px 16px;background:var(--bg)}
.trial-offers .card-tag{font-size:10px;letter-spacing:1.2px;font-weight:700;color:var(--accent)}
.trial-offers .license-price{font-size:var(--text-xl);font-weight:600;letter-spacing:-1px;color:var(--ink);margin:8px 0 4px}
.trial-offers .license-price span{font-size:var(--text-sm);font-weight:500;letter-spacing:0;color:var(--muted)}
.trial-offers p{font-size:var(--text-xs);margin:0}
.trial-lock .trial-status{font-size:var(--text-sm);border-left:3px solid var(--accent);padding-left:10px}
.trial-lock-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.trial-lock .button{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 18px;border-radius:999px;font-weight:600;text-decoration:none;font-size:var(--text-sm);border:1px solid var(--accent);color:var(--ink);background:transparent}
.trial-lock .button.primary{background:var(--accent);color:#fff5e9}
@media(max-width:700px){.trial-offers{grid-template-columns:1fr}.trial-pill{padding:3px 8px}.trial-lock{padding:20px}}

#manual-dialog .manual-auto{display:inline-flex;align-items:center;gap:6px;font-size:var(--text-xs);color:var(--muted);margin-right:6px;white-space:nowrap}#manual-dialog .manual-auto input{accent-color:var(--accent);margin:0}
@media(max-width:700px){#manual-dialog .manual-auto{display:none}}

.rotate-tools{display:inline-flex;align-items:center;gap:2px}.rotate-tools button{min-width:0;padding:var(--space-2) var(--space-3);white-space:nowrap}.rotate-tools .rotate-readout{min-width:58px;text-align:center;font-variant-numeric:tabular-nums;font-size:var(--text-xs);letter-spacing:.5px;color:var(--accent);border-color:var(--line)}.rotate-tools .rotate-readout:disabled{color:var(--muted)}

/* Beta 0.34: Pete peeks over the bottom edge next to How to explore; click him and he jumps out */
footer button.pete-peek{all:unset;box-sizing:border-box;position:relative;display:inline-block;width:54px;height:34px;padding:0;border:0;background:none;overflow:hidden;align-self:flex-end;margin:0 0 calc(-1 * var(--space-4)) 2px;cursor:pointer;vertical-align:bottom;flex:0 0 auto;line-height:0}
.pete-peek svg{position:absolute;left:0;bottom:0;width:54px;height:34px;display:block;transition:transform .35s cubic-bezier(.3,1.4,.5,1)}
.pete-peek:hover svg,.pete-peek:focus-visible svg{transform:translateY(-5px)}
.pete-peek:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:8px}
.pete-peek.is-out{pointer-events:none}
.pete-peek.is-out svg{transform:translateY(110%);transition-duration:.25s}
.pete-peek[hidden]{display:none}
@media(prefers-reduced-motion:reduce){.pete-peek svg{transition:none}}
