.lab-body{--paper: #1d2bd6;--art-ink: #f4f6ff}main.lab{max-width:1200px;padding-top:calc(var(--nav-height) + 2.4rem);padding-bottom:var(--space-2xl)}.lab-head{margin-bottom:var(--space-xl)}.lab-eyebrow{color:var(--accent);font-size:.8rem;margin-bottom:.5rem}.lab-title{font-size:clamp(1.8rem,4vw,2.6rem);font-weight:700;letter-spacing:.02em;line-height:1.1}.lab-sub{margin-top:.7rem;max-width:60ch;color:var(--text-secondary);font-size:.9rem}.kbd{border:1px solid var(--border-strong);border-bottom-width:2px;border-radius:3px;padding:0 .35em;font-size:.82em;background:var(--surface);color:var(--text);white-space:nowrap}.lab-list{list-style:none;display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-md)}.lab-card{position:relative;display:flex;flex-direction:column;background:var(--bg-elevated);border:1px solid var(--ink);color:inherit;overflow:hidden;transition:transform .15s,box-shadow .15s,border-color .15s}.lab-card:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 0 var(--accent);border-color:var(--accent)}.lab-thumb{display:block;width:100%;aspect-ratio:3 / 2;object-fit:cover;border-bottom:1px solid var(--ink)}.lab-card-body{display:flex;flex-direction:column;gap:.45rem;padding:var(--space-md)}.lab-status{font-size:.74rem;font-weight:600;color:var(--text-muted)}.lab-status.live{color:var(--green)}.lc-title{font-size:1.1rem;font-weight:700;letter-spacing:.01em}.lc-desc{font-size:.84rem;color:var(--text-secondary);line-height:1.6}.lc-tags{font-size:.76rem;color:var(--text-muted);margin-top:.2rem}.lab-more{margin-top:var(--space-lg);font-size:.78rem;color:var(--text-muted)}@media (max-width: 700px){.lab-list{grid-template-columns:1fr}}.lab-wrap{display:grid;grid-template-columns:minmax(0,1fr) 326px;gap:var(--space-lg);align-items:start}.stage-col{display:flex;flex-direction:column;gap:var(--space-sm)}.stage{position:relative;background:var(--paper);border:2px solid var(--ink);box-shadow:8px 8px 0 0 var(--border-strong);min-height:440px;aspect-ratio:3 / 2;display:flex;align-items:center;justify-content:center;overflow:hidden;transition:background .25s}.stage.transparent{background:conic-gradient(#d9d9d3 25%,#f0f0eb 0,#f0f0eb 50%,#d9d9d3 0,#d9d9d3 75%,#f0f0eb 0) 0 0 / 22px 22px}.out{position:relative;z-index:1;max-width:100%;max-height:78vh;display:block;image-rendering:auto}.dropzone-hint{position:absolute;left:50%;bottom:.9rem;transform:translate(-50%);z-index:2;display:flex;align-items:baseline;gap:.5rem;text-align:center;color:var(--art-ink);pointer-events:none;padding:.4rem .8rem;background:color-mix(in srgb,var(--paper) 72%,#000 28%);border:1px solid color-mix(in srgb,var(--art-ink) 30%,transparent);font-size:.76rem;max-width:calc(100% - 1.5rem);flex-wrap:wrap;justify-content:center}.dropzone-hint.gone{display:none}.dz-glyph{font-size:.95rem;opacity:.85}.dz-line{font-weight:600}.dz-sub{opacity:.72}.drag-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;display:none;align-items:center;justify-content:center;background:color-mix(in srgb,var(--paper) 60%,#000 40%);border:3px dashed var(--art-ink);color:var(--art-ink);font-weight:700;font-size:1.1rem;letter-spacing:.05em}.stage.dragging .drag-overlay{display:flex}.stage-bar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm);flex-wrap:wrap}.sb-meta{font-size:.74rem;color:var(--text-muted)}.sb-actions{display:flex;gap:.5rem}.lab-btn{font-family:var(--font-mono);font-size:.78rem;font-weight:600;color:var(--text);background:var(--bg-elevated);border:1px solid var(--ink);padding:.4rem .7rem;cursor:pointer;box-shadow:3px 3px 0 0 var(--border-strong);transition:transform .12s,box-shadow .12s,border-color .12s,background .12s}.lab-btn:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 0 var(--accent);border-color:var(--accent)}.lab-btn:active{transform:translate(0);box-shadow:1px 1px 0 0 var(--border-strong)}.controls{padding:var(--space-lg) var(--space-md) var(--space-md);display:flex;flex-direction:column;gap:var(--space-md);position:sticky;top:calc(var(--nav-height) + 1rem)}.ctl-group{display:flex;flex-direction:column;gap:.55rem}.ctl-head{font-size:.78rem;color:var(--text-muted);letter-spacing:.02em}.ctl-sub{display:flex;flex-direction:column;gap:.55rem;padding-left:.7rem;margin-left:.1rem;border-left:1px solid var(--border-strong)}.ctl-sub[hidden]{display:none}.ctl-check input:disabled+span{opacity:.45}.export-block{display:flex;flex-direction:column;gap:.55rem;padding-top:.6rem;margin-top:.2rem;border-top:1px dashed var(--border-strong)}.export-block[hidden]{display:none}.export-label{font-size:.74rem;color:var(--accent);font-weight:600}.export-btns{display:flex;gap:.4rem;flex-wrap:wrap}.lab-btn.sm{font-size:.72rem;padding:.32rem .6rem;box-shadow:2px 2px 0 0 var(--border-strong)}.lab-btn:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:2px 2px 0 0 var(--border-strong)}.export-status{font-size:.72rem;color:var(--text-muted);min-height:1em}.ctl-row{display:flex;flex-direction:column;gap:.3rem}.ctl-row label{display:flex;justify-content:space-between;align-items:baseline;font-size:.78rem;color:var(--text-secondary)}.ctl-row output{color:var(--accent);font-weight:600}select{font-family:var(--font-mono);font-size:.8rem;color:var(--text);background:var(--bg);border:1px solid var(--border-strong);padding:.4rem .5rem;cursor:pointer;width:100%}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:3px;background:var(--border-strong);cursor:pointer}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;background:var(--accent);border:2px solid var(--bg-elevated);box-shadow:0 0 0 1px var(--accent);cursor:pointer}input[type=range]::-moz-range-thumb{width:12px;height:12px;background:var(--accent);border:2px solid var(--bg-elevated);box-shadow:0 0 0 1px var(--accent);cursor:pointer}.ctl-check{display:flex;align-items:center;gap:.5rem;font-size:.8rem;color:var(--text-secondary);cursor:pointer}.ctl-check input{accent-color:var(--accent);width:15px;height:15px;cursor:pointer}.visually-hidden-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.dropzone{display:block;cursor:pointer}.dz-btn{display:block;text-align:center;font-size:.8rem;font-weight:600;color:var(--text);border:1px dashed var(--border-strong);padding:.55rem;transition:border-color .12s,color .12s,background .12s}.dropzone:hover .dz-btn{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}.ctl-link{align-self:flex-start;font-family:var(--font-mono);font-size:.76rem;color:var(--text-muted);background:none;border:none;padding:0;cursor:pointer}.ctl-link:hover{color:var(--accent)}.ctl-link.mini{font-size:1rem;line-height:1;padding:0 .2rem}.swatches{display:flex;flex-wrap:wrap;gap:.4rem}.swatch{width:30px;height:22px;border:1px solid var(--ink);cursor:pointer;padding:0;position:relative;transition:transform .1s}.swatch:hover{transform:translateY(-2px)}.swatch.active{outline:2px solid var(--accent);outline-offset:2px}.ctl-colors{display:flex;align-items:center;gap:.6rem}.color-pick{display:flex;align-items:center;gap:.4rem;font-size:.74rem;color:var(--text-secondary)}.color-pick input[type=color]{width:26px;height:22px;padding:0;border:1px solid var(--border-strong);background:none;cursor:pointer}.color-pick.dim{opacity:.4}.color-pick.dim input{cursor:not-allowed}.ctl-hint{color:var(--text-muted);font-size:.92em}.foot-note{font-size:.72rem;color:var(--text-muted)}@media (max-width: 880px){.lab-wrap{grid-template-columns:1fr}.controls{position:static}.stage{aspect-ratio:4 / 3;min-height:320px}}@media (max-width: 620px){main.lab{padding-left:var(--space-md);padding-right:var(--space-md)}}@media (prefers-reduced-motion: reduce){.stage,.lab-btn,.swatch,.dz-btn{transition:none!important}.lab-btn:hover,.swatch:hover{transform:none!important}}