#output-design-dialog{box-sizing:border-box;width:min(1100px,96vw);max-width:none;max-height:94dvh;overflow:auto;background:var(--paper,#15251f);color:var(--ink,#e3efe7);padding:24px;font:14px/1.5 system-ui}#output-design-dialog .output-head{display:flex;align-items:center;justify-content:space-between}#output-design-dialog h2{font-size:25px;margin:0}#output-design-dialog nav{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}#output-design-dialog button{min-height:42px;padding:8px 14px;border:1px solid #658b7b;border-radius:8px;background:#72dec21a;color:inherit;cursor:pointer;font:inherit;margin:4px}#output-design-dialog input,#output-design-dialog select{font:16px system-ui;color:inherit;background:transparent;border:1px solid #658b7b;border-radius:7px;padding:8px;min-height:42px;max-width:100%;box-sizing:border-box}#output-design-dialog input[type=checkbox]{width:22px;min-height:22px;accent-color:#72dec2}#output-design-dialog label{display:flex;flex-direction:column;gap:5px;font-size:12px;margin:8px 0}#output-design-dialog p{font-size:13px;color:inherit;line-height:1.7}#output-design-dialog .output-form{display:flex;align-items:end;flex-wrap:wrap;gap:16px}.dimming-graph{width:100%;height:auto;min-height:160px;touch-action:none;background:#72dec208;border:1px solid #658b7b;border-radius:12px}.dimming-graph text{fill:currentColor;font:10px system-ui}.timeline-grid{stroke:#658b7b;stroke-width:.5;opacity:.4}.timeline-curve{fill:none;stroke:#52bb9d;stroke-width:3}.timeline-handle{fill:#72dec2;stroke:#18382c;stroke-width:2;cursor:grab}.timeline-row{display:flex;align-items:center;gap:10px}.timeline-row input{width:130px}.dmx-model-slots{display:flex;gap:12px;overflow-x:auto;padding:14px 0}.dmx-slot-card{flex:0 0 210px;padding:16px;border:1px solid #658b7b;border-radius:12px;background:#72dec20c}.dmx-slot-card h3{margin:0}.dmx-slot-card input,.dmx-slot-card select{width:100%}.patch-fixtures{display:flex;gap:10px;flex-wrap:wrap}.patch-fixture{padding:12px;border:1px solid #658b7b;border-radius:10px;width:215px;cursor:grab}.patch-fixture strong,.patch-fixture small{display:block}.patch-fixture input{width:80px}.patch-fixture select{width:100%;margin:10px 0}.universe-grid{display:grid;grid-template-columns:repeat(32,minmax(0,1fr));gap:3px;margin-top:22px}.universe-slot{min-width:0;text-align:center;font:9px/26px Consolas,monospace;background:#658b7b12;border:1px solid #658b7b38;border-radius:3px}.universe-slot.occupied{background:#72dec255;border-color:#52bb9d}.universe-slot.patch-hover{outline:2px solid #b782e5;background:#b782e555}@media(max-width:650px){#output-design-dialog{width:100vw;max-height:100dvh;padding:16px;border-radius:0}.universe-grid{grid-template-columns:repeat(16,minmax(0,1fr))}.patch-fixture{width:100%}.timeline-row{gap:4px}.timeline-row input{width:105px}}

.patch-fixtures{flex-wrap:nowrap;overflow-x:auto;padding-bottom:10px}.patch-fixture{flex:0 0 215px}.patch-fixture strong{touch-action:none;user-select:none;cursor:grab}.patch-fixture strong:active{cursor:grabbing}

.output-sticky-actions{position:sticky;bottom:-24px;z-index:5;background:var(--paper,#15251f);border-top:1px solid #658b7b;padding:10px 0;display:flex;flex-wrap:wrap}.dmx-model-slots{max-height:65dvh;overflow-y:auto;align-items:flex-start}@media(max-width:650px){.output-sticky-actions{bottom:-16px}.dmx-model-slots{max-height:60dvh}}

#projects-dialog{box-sizing:border-box;width:min(560px,94vw);max-height:92dvh;overflow:auto;background:var(--paper,#15251f);color:var(--ink,#e3efe7);border:1px solid #658b7b;border-radius:14px;padding:24px;font:14px/1.5 system-ui}#projects-dialog::backdrop{background:#07100c88;backdrop-filter:blur(4px)}#projects-dialog header{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:20px}#projects-dialog h2{font:inherit;font-size:25px;margin:0}#projects-dialog label{display:flex;flex-direction:column;gap:7px;margin:16px 0;font-size:12px}#projects-dialog input,#projects-dialog select{box-sizing:border-box;min-width:0;width:100%;padding:12px;border:1px solid #658b7b;border-radius:8px;background:transparent;color:inherit;font:16px system-ui;min-height:46px}#projects-dialog input[readonly]{opacity:.65}#projects-dialog button{min-height:46px;padding:10px 15px;font:inherit;border:1px solid #658b7b;border-radius:8px;background:#72dec222;color:inherit;cursor:pointer}#projects-dialog button:disabled{opacity:.4;cursor:default}#projects-dialog .project-actions{display:flex;flex-wrap:wrap;gap:10px;margin:24px 0 12px}#projects-dialog .project-actions button{flex:1 1 180px}#projects-dialog .project-details,#projects-dialog .project-hint{font-size:12px;line-height:1.6;opacity:.72}#projects-dialog [role=status]{font-size:13px;min-height:20px}@media(max-width:500px){#projects-dialog{padding:18px;width:94vw}#projects-dialog .project-actions button{flex-basis:100%}}

/* SL-003: tab text must override the handheld navigation icon dimensions. */
#output-design-dialog nav{align-items:stretch}#output-design-dialog nav button{width:auto;height:auto;flex:1 0 auto;min-width:44px;min-height:44px;margin:0;white-space:nowrap}

.dmx-test-panel{padding:12px;color:var(--ink);overflow:auto}.dmx-test-controls,.dmx-test-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.dmx-test-controls label{min-width:100px;flex:1}.dmx-test-controls input{width:100%;min-height:32px}.dmx-test-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:8px;margin-top:12px}.dmx-test-channel{padding:10px;background:var(--paper);border:1px solid var(--line);border-radius:7px;display:grid;gap:6px}.dmx-test-channel.overridden{border-color:var(--focus)}.dmx-test-channel small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--muted)}.dmx-test-channel input[type=range]{width:100%;min-width:0;min-height:40px;touch-action:pan-y;margin:0;padding:0;accent-color:var(--focus)}.dmx-test-channel output{font:12px Consolas,monospace}.dmx-test-channel button{min-height:32px}.dmx-test-actions button{min-height:36px}

.dimming-current-time,.dimming-current-level{display:inline-block;margin:8px 18px 8px 0;font:600 13px ui-monospace,monospace}.dimming-time-controls{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:14px;margin:12px 0;border:1px solid var(--line,#8885);border-radius:8px}.dimming-time-controls strong,.dimming-time-controls input[type=range],.dimming-time-controls .dimming-notice{flex-basis:100%}.dimming-time-controls label{display:flex!important;align-items:center;gap:8px}.dimming-time-controls input[type=time]{width:150px!important}.dimming-time-controls input[type=range]{min-height:44px;padding:0!important}.dimming-time-controls output{font:12px ui-monospace,monospace}.dimming-notice{font-size:12px;margin:0;opacity:.8}.timeline-now,.timeline-preview{pointer-events:none}.timeline-now path{stroke:#269a80;stroke-width:2}.timeline-now circle{fill:#269a80;stroke:var(--paper,#15251f)}.timeline-preview path{stroke:#cc8739;stroke-width:2;stroke-dasharray:5 4}.timeline-preview circle{fill:#cc8739;stroke:var(--paper,#15251f)}

.dimming-time-controls select{width:auto!important;min-width:160px;flex:1}.dimming-time-controls label{flex-direction:row!important;margin:0}.dimming-legend{font-size:12px;opacity:.8}

/* A continuous frame and label identify every fixture footprint. */
.universe-grid{grid-template-columns:repeat(var(--patch-columns,32),minmax(0,1fr));gap:4px;align-items:stretch}
.universe-fixture-group{display:grid;grid-template-columns:repeat(var(--fixture-slots),minmax(0,1fr));grid-template-rows:20px 28px;min-width:0;border:2px solid hsl(var(--fixture-hue) 48% 48%);border-radius:6px;overflow:hidden;background:hsl(var(--fixture-hue) 40% 45% / .13)}
.universe-fixture-label{grid-column:1/-1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 4px;font:600 10px/20px system-ui;color:var(--ink,#e3efe7);background:hsl(var(--fixture-hue) 45% 45% / .24)}
.universe-fixture-group .universe-slot.occupied{border:0;border-left:1px solid hsl(var(--fixture-hue) 40% 50% / .4);border-radius:0;background:transparent;font-size:10px;line-height:28px}
.universe-fixture-group .universe-slot.occupied:nth-child(2){border-left:0}
.universe-grid>.universe-slot{align-self:end;line-height:28px;box-sizing:border-box;height:30px}
.patch-fixture{border-left:4px solid hsl(var(--fixture-hue,155) 48% 48%)}
.universe-slot.patch-hover{position:relative;z-index:1;outline-offset:-2px;background:#b782e555!important}

.patch-fixture{box-sizing:border-box;min-width:0}

.patch-fixture.fixture-marked{border-inline-start:4px solid var(--fixture-marker)}
.universe-fixture-group.fixture-marked{border-color:var(--fixture-marker)}
