@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap";:root{color:#e9e9e3;font-synthesis:none;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background:#1b2020;font-family:DM Sans,sans-serif}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:#e2e7df;background:#292f2e;border:1px solid #414a48;border-radius:6px;padding:10px 13px;font-size:12px;transition:background .15s}button:hover{background:#39423e}button:disabled{opacity:.35;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline-offset:3px;outline:2px solid #d1b790}a{color:#cbd4c6;text-decoration:none}.lab-shell{max-width:1900px;margin:0 auto;padding:0 28px}.lab-header{border-bottom:1px solid #38413d;align-items:center;gap:20px;height:72px;font-size:12px;display:flex}.lab-header>a:last-child{margin-left:auto}.lab-brand{letter-spacing:3px;color:#d9c2a0;font-family:Space Grotesk,sans-serif;font-size:23px}.lab-brand b{color:#eceee4;font-size:15px}.lab-brand span{color:#97a397;letter-spacing:2px;font-size:10px}.lab-badge{letter-spacing:1.5px;color:#a7b9a6;border:1px solid #465347;border-radius:4px;padding:5px 7px;font-size:8px}.lab-title{justify-content:space-between;align-items:center;gap:22px;padding:30px 0 27px;display:flex}.lab-eyebrow{letter-spacing:1.9px;color:#9eac9f;margin:0 0 13px;font-size:9px;font-weight:700}.lab-title h1{letter-spacing:-1.5px;margin:0 0 10px;font-family:Space Grotesk,sans-serif;font-size:34px;font-weight:500}.lab-title p:last-child{color:#a9b3a8;max-width:600px;margin:0;font-size:12px;line-height:1.6}.lab-actions{flex-wrap:wrap;gap:8px;display:flex}.lab-primary{color:#202921;background:#d5c09e;border-color:#d5c09e;font-weight:700}.lab-primary:hover{background:#e6d2b1}.lab-workbench{background:#222927;border:1px solid #3d4840;border-radius:10px;grid-template-columns:230px minmax(380px,1fr) 310px;align-items:stretch;display:grid;overflow:hidden}.lab-left{background:#222726;border-right:1px solid #3d4840;padding:22px 18px}.lab-left section{margin-bottom:29px}.lab-reference{aspect-ratio:16/10;background:#101310;border-radius:5px;width:100%;padding:0;display:block;overflow:hidden}.lab-reference img{object-fit:contain;width:100%;height:100%;image-rendering:pixelated}.lab-reference.focus img{transform-origin:53% 62%;transform:scale(3)}.lab-link{color:#d2bf9d;text-align:left;background:0 0;border:0;margin:12px 0;padding:0;font-size:10px;line-height:1.5}.lab-link:hover{color:#fff;background:0 0}.lab-hint{color:#a2afa2;margin:10px 0;font-size:11px;line-height:1.6}.lab-preset{text-align:left;color:#ae9780;background:#29302c;align-items:flex-start;gap:12px;width:100%;margin-top:8px;padding:12px 8px;font-size:10px;display:flex}.lab-preset span{color:#ecede3;font-size:11px}.lab-preset small{color:#94a18f;margin-top:5px;font-size:9px;line-height:1.6;display:block}.lab-section-title{justify-content:space-between;align-items:center;gap:8px;display:flex}.lab-section-title>span{color:#92a08f;font-size:9px}.lab-section-title h2{letter-spacing:-.6px;font-family:Space Grotesk,sans-serif;font-size:19px;font-weight:500}.lab-section-title>.lab-eyebrow{margin-bottom:0}.lab-section-title button{padding:6px 9px;font-size:10px}.lab-saved{border-bottom:1px solid #3a443b;margin-top:8px;display:flex}.lab-saved button{text-align:left;background:0 0;border:0;padding:9px 3px}.lab-saved button:first-child{flex:1;min-width:0}.lab-saved strong{overflow-wrap:anywhere;font-size:11px;display:block}.lab-saved small{color:#9caa95;margin-top:6px;font-size:9px;display:block}.lab-isolation{color:#a8ae9e;border-top:1px solid #3d463e;padding-top:18px;font-size:10px;line-height:1.7}.lab-stage-panel{color:#29362c;background:#ced4c7;flex-direction:column;min-width:0;display:flex}.lab-stage-toolbar{background:#c8cfbf;border-bottom:1px solid #b2bca9;justify-content:space-between;align-items:center;gap:8px;padding:14px 16px;display:flex}.lab-stage-panel button{color:#34422f;background:0 0;border-color:#acb89f;padding:8px 10px;font-size:10px}.lab-segment{gap:2px;display:flex}.lab-segment button{border-color:#0000}.lab-stage-panel button.active{color:#eef0e7;background:#354b3c;border-color:#354b3c}.lab-stage-panel button:hover{background:#b6c3a7}.lab-canvas{flex:1;height:560px;min-height:420px;position:relative}.lab-stage-names{pointer-events:none;letter-spacing:.8px;color:#445442;text-align:center;justify-content:center;font-size:10px;font-weight:700;line-height:1.5;display:flex;position:absolute;top:19px;left:0;right:0}.lab-stage-names span{overflow-wrap:anywhere;max-width:100%;padding:0 10px}.lab-stage-names.pair span{width:50%;max-width:50%}.lab-stage-caption{text-align:center;color:#52614a;pointer-events:none;width:100%;font-size:9px;position:absolute;bottom:12px}.lab-view-controls{border-top:1px solid #b3bea9;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px;padding:10px;display:flex}.lab-metrics{border-top:1px solid #adbba2;grid-template-columns:repeat(4,1fr);gap:8px;padding:18px 12px;display:grid}.lab-metrics>div{text-align:center}.lab-metrics span{letter-spacing:1px;color:#637457;margin-bottom:8px;font-size:7px;font-weight:700;display:block}.lab-metrics strong{font-family:Space Grotesk,sans-serif;font-size:25px;font-weight:500}.lab-metrics small{color:#647358;font-size:10px;font-weight:400}.lab-stage-options{flex-wrap:wrap;justify-content:center;gap:20px;padding:0 10px 7px;font-size:10px;display:flex}.lab-stage-options label{align-items:center;gap:7px;display:flex}.lab-stage-options input{accent-color:#48624a}.lab-stage-options select{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:#33442d;background:0 0;border:1px solid #a5b199;border-radius:4px;padding:5px;font-size:10px}.lab-stage-note{text-align:center;color:#596c4f;margin:5px 18px 15px;font-size:9px}.lab-inspector{background:#252c28;border-left:1px solid #3d4840;flex-direction:column;padding:23px 20px;display:flex}.lab-inspector>input{color:#f0eee4;background:#303931;border:1px solid #4b5848;border-radius:5px;width:100%;margin-bottom:14px;padding:12px;font-size:13px}.lab-groups{flex-wrap:wrap;gap:5px;margin:5px 0 21px;display:flex}.lab-groups button{color:#aebba5;background:0 0;border-color:#4d584b;padding:8px;font-size:9px}.lab-groups button.active{color:#263027;background:#d3bc99;border-color:#d3bc99}.lab-controls{flex:1}.lab-controls h3{color:#e5e6d8;margin:0 0 18px;font-size:12px;font-weight:500}.lab-control{margin:0 0 18px}.lab-control>div:first-child{justify-content:space-between;align-items:center;gap:6px;margin-bottom:10px;display:flex}.lab-control label{color:#c1cbbc;font-size:11px}.lab-control span{align-items:center;gap:6px;display:flex}.lab-control input[type=number]{text-align:right;color:#e0e4d4;appearance:textfield;background:#313a2e;border:1px solid #4f5d4b;border-radius:3px;width:61px;padding:5px 4px;font-size:11px}.lab-control input::-webkit-inner-spin-button{appearance:none}.lab-control small{color:#83957a;font-size:9px}.lab-control input[type=range]{accent-color:#d3bc99;cursor:ew-resize;width:100%;height:16px;margin:0;display:block}.lab-range-labels{justify-content:space-between;margin-top:4px;display:flex}.lab-inspector-footer{border-top:1px solid #46533f;margin-top:18px;padding-top:15px}.lab-inspector-footer span{color:#93a587;font-size:9px;line-height:1.6;display:block}.lab-inspector-footer button{color:#cdb893;background:0 0;border:0;margin-top:12px;padding:0;font-size:10px}.lab-footer{letter-spacing:1px;color:#7f937b;justify-content:space-between;gap:15px;padding:20px 0;font-size:8px;line-height:1.6;display:flex}.lab-hidden{display:none}.lab-dialog{color:#e1e4d6;background:#222a24;border:1px solid #66755b;border-radius:10px;width:90%;max-width:960px;padding:20px}.lab-dialog::backdrop{background:#111b14cc}.lab-dialog>div{justify-content:space-between;align-items:center;display:flex}.lab-dialog h2{font-size:18px}.lab-dialog img{width:100%;image-rendering:pixelated}.lab-dialog p{color:#aebba3;font-size:12px;line-height:1.6}.lab-toast{color:#263127;z-index:10;background:#e3d4b9;border-radius:7px;align-items:center;gap:25px;width:max-content;max-width:90vw;padding:14px 18px;font-size:12px;display:flex;position:fixed;bottom:25px;left:50%;transform:translate(-50%);box-shadow:0 8px 35px #1118}.lab-toast button{color:#33412c;background:0 0;border:0;padding:0;font-size:18px}.lab-preview-error{color:#33412b;padding:50px;font-size:13px;line-height:1.6}@media (width>=1500px){.lab-workbench{grid-template-columns:260px minmax(450px,1fr) 340px}.lab-canvas{min-height:650px}}@media (width<=1100px){.lab-workbench{grid-template-columns:minmax(320px,1fr) 290px}.lab-left{border-bottom:1px solid #3d4840;border-right:0;grid-column:1/-1;grid-template-columns:1fr 1fr 1fr;gap:20px;display:grid}.lab-left section{margin:0}.lab-isolation{grid-column:1/-1;margin:0;padding:10px 0 0}.lab-title{align-items:flex-start}.lab-actions{justify-content:flex-end;max-width:220px}.lab-reference{aspect-ratio:16/7;max-width:260px}}@media (width<=700px){.lab-shell{padding:0 12px}.lab-header{gap:12px;height:60px}.lab-brand{font-size:20px}.lab-brand b{font-size:12px}.lab-brand span{display:none}.lab-badge{letter-spacing:.8px;font-size:7px}.lab-header>a:last-child{font-size:10px}.lab-title{padding:23px 0;display:block}.lab-title h1{font-size:30px}.lab-title p:last-child{font-size:11px}.lab-actions{justify-content:flex-start;max-width:none;margin-top:18px}.lab-actions button{padding:10px;font-size:10px}.lab-workbench{flex-direction:column;display:flex}.lab-left{padding:16px;display:block}.lab-left section{margin-bottom:18px}.lab-left section:first-child{grid-template-columns:1fr 1fr;gap:5px 12px;display:grid}.lab-left section:first-child .lab-eyebrow{grid-column:1/-1}.lab-reference{aspect-ratio:16/10;grid-row:2/4}.lab-left section:first-child .lab-link{align-self:start;margin:0}.lab-left section:first-child .lab-hint{margin:0;font-size:10px}.lab-canvas{flex:none;height:470px;min-height:470px}.lab-stage-panel{order:-1}.lab-inspector{border-bottom:1px solid #3d4840;border-left:0;order:0}.lab-left{order:1}.lab-metrics strong{font-size:22px}.lab-metrics span{font-size:6px}.lab-inspector{padding:20px}.lab-footer{font-size:7px;display:block}.lab-footer span{margin-top:8px;display:block}.lab-stage-options{gap:10px}.lab-stage-names{font-size:8px}.lab-toast{font-size:11px}.lab-title .lab-eyebrow{margin-bottom:10px}}@media (width>=1101px){.lab-shell{flex-direction:column;height:100dvh;min-height:660px;display:flex}.lab-header{flex-shrink:0;height:60px}.lab-title{flex-shrink:0;padding:20px 0}.lab-title h1{font-size:30px}.lab-title .lab-eyebrow{margin-bottom:9px}.lab-workbench{flex:1;min-height:0}.lab-left,.lab-inspector{scrollbar-width:thin;scrollbar-color:#52604d transparent;overflow-y:auto}.lab-stage-panel{min-height:0;overflow:hidden}.lab-canvas{height:auto;min-height:150px}.lab-metrics{padding:10px}.lab-metrics strong{font-size:22px}.lab-stage-toolbar{padding:9px 13px}.lab-view-controls{padding:7px}.lab-stage-note{margin-bottom:10px;font-size:8px}.lab-stage-options{font-size:9px}.lab-footer{flex-shrink:0;padding:12px 0}.lab-stage-caption{font-size:8px}}.lab-rig-toggle{color:#e1d0b2;align-items:center;gap:8px;margin:0 0 5px;font-size:12px;display:flex}.lab-rig-toggle input{accent-color:#d3bc99}.lab-control input:disabled{opacity:.5;cursor:default}.lab-header>button:last-child{margin-left:auto}.lab-control:has(input:disabled) label{color:#8f9a89}.lab-control{position:relative}.lab-control .control-info{position:static}.lab-control .control-info>span[role=tooltip]{top:auto;bottom:calc(100% + 5px);right:0}