:root{color-scheme:dark;--app-bg: light-dark(#faf9f4, #000000);--app-fg: light-dark(#222222, #f0efe4);--app-chrome: light-dark(#f0efe4, #0b0b0c);--app-line: light-dark(#e2e1d8, #1d1d1f);--app-line-2: light-dark(#cfcec4, #2e2e31);--app-dim: light-dark(#6c6a64, #8a8a84);--app-dim-2: light-dark(#96948c, #5f5f5b);--leva-bg: light-dark(#f4f3eb, #2a2a2a);--leva-input: light-dark(#dddbd2, #373737);--leva-input-focus: light-dark(#f8f8f6, #414141);--leva-sep: light-dark(#e2e1d8, #3c3c3c);--leva-button: light-dark(#999997, #777775);--leva-button-pressed: #777775;--leva-fg: light-dark(#222222, #f0efe4);--leva-label: light-dark(#6f6d66, #a3a29c);--leva-accent: light-dark(#0066dc, #3c93ff);--leva-root-w: 300px;--leva-control-w: 160px;--leva-num-w: 38px;--leva-row-h: 24px;--leva-folder-h: 20px;--leva-scrub-w: 8px;--leva-scrub-h: 16px;--leva-check: 16px;--leva-row-gap: 7px;--leva-col-gap: 7px;--leva-xs: 3px;--leva-sm: 6px;--leva-md: 10px;--leva-r-xs: 0;--leva-r-sm: 0;--leva-r-lg: 0;--leva-fs: 11px;--app-r: 0;--leva-shadow: rgba(58, 34, 17, .1) 0px 4px 40px -8px, rgba(58, 34, 17, .2) 0px 12px 20px -8px, rgba(58, 34, 17, .1) 0px 0px 0px 1px;--mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;--top-h: 46px;--bot-h: 26px;--panel-inset: 16px}:root[data-ui=light]{color-scheme:light}:root[data-ui=dark]{color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--app-bg);color:var(--app-fg);font-family:var(--mono);font-size:12px;-webkit-font-smoothing:antialiased;overflow:hidden}button,input,select,textarea{font:inherit;color:inherit}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--leva-input);border-radius:8px}::-webkit-scrollbar-thumb:hover{background:var(--leva-button)}.app{display:grid;grid-template-rows:var(--top-h) 1fr var(--bot-h);grid-template-areas:"top" "stage" "status";height:100%;position:relative}.top{grid-area:top;display:flex;align-items:stretch;border-bottom:1px solid var(--app-line);background:var(--app-chrome);min-width:0}.brand{display:flex;align-items:center;gap:9px;padding:0 16px;border-right:1px solid var(--app-line);letter-spacing:.16em;font-size:11px;white-space:nowrap}.brand b{font-weight:600}.brand span{color:var(--app-dim)}.brand .mark{display:grid;grid-template-columns:repeat(3,3px);gap:2px}.brand .mark i{width:3px;height:3px;background:currentColor;display:block}.brand .mark i:nth-child(2),.brand .mark i:nth-child(4),.brand .mark i:nth-child(6),.brand .mark i:nth-child(8){opacity:.28}.gtabs{display:flex;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0}.gtabs::-webkit-scrollbar{display:none}.gtab{appearance:none;background:none;border:0;border-right:1px solid var(--app-line);padding:0 15px;color:var(--app-dim);cursor:pointer;white-space:nowrap;letter-spacing:.06em;font-size:11px;position:relative;transition:color .12s,background .12s}.gtab:hover{color:var(--app-fg)}.gtab.on{color:var(--app-fg);background:color-mix(in oklab,var(--app-fg) 8%,transparent)}.gtab.on:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:currentColor}.top-actions{display:flex;align-items:center;gap:6px;padding:0 10px 0 12px;border-left:1px solid var(--app-line)}.btn{appearance:none;background:transparent;border:1px solid var(--app-line-2);color:var(--app-dim);height:26px;padding:0 10px;cursor:pointer;letter-spacing:.07em;font-size:10.5px;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;border-radius:var(--app-r);transition:all .12s}.btn:hover{color:var(--app-fg);border-color:var(--app-fg)}.btn:active{transform:translateY(1px)}.btn.pri{color:var(--app-bg);background:var(--app-fg);border-color:var(--app-fg)}.btn.pri:hover{opacity:.85}.btn.on{color:var(--app-bg);background:var(--app-fg);border-color:var(--app-fg)}.btn.sq{width:26px;padding:0;justify-content:center}.btn:disabled{opacity:.4;cursor:not-allowed}.stage{grid-area:stage;position:relative;overflow:hidden;padding:24px;background:linear-gradient(45deg,color-mix(in oklab,var(--app-fg) 3%,transparent) 25%,transparent 25%,transparent 75%,color-mix(in oklab,var(--app-fg) 3%,transparent) 75%),linear-gradient(45deg,color-mix(in oklab,var(--app-fg) 3%,transparent) 25%,transparent 25%,transparent 75%,color-mix(in oklab,var(--app-fg) 3%,transparent) 75%);background-size:22px 22px;background-position:0 0,11px 11px}.app.with-panel .stage{padding-right:calc(var(--leva-root-w) + var(--panel-inset) * 2 + 8px)}.stage-fit{width:100%;height:100%;display:grid;place-items:center}.stage canvas{display:block;max-width:100%;max-height:100%;box-shadow:0 0 0 1px var(--app-line-2),0 24px 60px #00000073}.status{grid-area:status;display:flex;align-items:center;gap:18px;padding:0 14px;border-top:1px solid var(--app-line);background:var(--app-chrome);color:var(--app-dim-2);font-size:10px;letter-spacing:.08em;overflow:hidden;white-space:nowrap}.status b{color:var(--app-dim);font-weight:400}.status .sp{flex:1}.panel{position:absolute;top:calc(var(--top-h) + var(--panel-inset));right:var(--panel-inset);bottom:calc(var(--bot-h) + var(--panel-inset));width:var(--leva-root-w);background:var(--leva-bg);color:var(--leva-fg);border-radius:0;box-shadow:var(--leva-shadow);overflow:auto;overscroll-behavior:contain;padding-bottom:4px;font-size:var(--leva-fs);z-index:30;scrollbar-width:none;-ms-overflow-style:none}.panel::-webkit-scrollbar{width:0;height:0;display:none}.lv-sticky{position:sticky;top:0;z-index:2;background:var(--leva-bg)}.lv-head{display:flex;align-items:center;gap:8px;padding:var(--leva-md) var(--leva-md) var(--leva-sm);font-size:var(--leva-fs);letter-spacing:.04em}.lv-head .dot{width:5px;height:5px;background:var(--leva-button);flex:0 0 auto}.lv-head .sub{color:var(--leva-label);margin-left:auto;letter-spacing:.1em;font-size:9.5px}.lv-tabs{display:flex;gap:2px;padding:0 var(--leva-md) var(--leva-sm)}.lv-tab{flex:1;appearance:none;border:0;background:transparent;color:var(--leva-label);height:20px;border-radius:var(--leva-r-sm);cursor:pointer;font-size:9.5px;letter-spacing:.1em;transition:background .12s,color .12s}.lv-tab:hover{color:var(--leva-fg)}.lv-tab.on{background:var(--leva-input);color:var(--leva-fg)}.lv-body{padding:0 var(--leva-md)}.lv-note{color:var(--leva-label);line-height:1.55;padding:2px 0 var(--leva-md)}.lv-folder+.lv-folder{border-top:1px solid var(--leva-sep)}.lv-folder-title{width:100%;appearance:none;background:none;border:0;display:flex;align-items:center;gap:var(--leva-sm);height:calc(var(--leva-folder-h) + var(--leva-sm) * 2);padding:0;color:var(--leva-fg);cursor:pointer;text-align:left;font-size:var(--leva-fs)}.lv-folder-title:hover{color:var(--leva-accent)}.lv-folder-title svg{fill:var(--leva-label);flex:0 0 auto;transition:transform .15s ease}.lv-folder-title:hover svg{fill:currentColor}.lv-folder-title .n{margin-left:auto;color:var(--leva-label);font-size:9.5px}.lv-folder-body{padding:0 0 var(--leva-md) var(--leva-md);border-left:1px solid var(--leva-sep);margin-left:4px;display:flex;flex-direction:column;gap:var(--leva-row-gap)}.lv-row{display:grid;grid-template-columns:1fr var(--leva-control-w);align-items:center;column-gap:var(--leva-col-gap);min-height:var(--leva-row-h)}.lv-row.stack{grid-template-columns:1fr;row-gap:4px}.lv-label{color:var(--leva-label);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:none}.lv-label.drag{cursor:ew-resize}.lv-label.drag:hover,.lv-row.dirty .lv-label{color:var(--leva-fg)}.lv-row.dirty .lv-label:after{content:"";display:inline-block;width:3px;height:3px;background:var(--leva-accent);vertical-align:middle;margin-left:5px;margin-top:-1px}.lv-control{display:grid;align-items:center}.lv-control.split{grid-template-columns:1fr var(--leva-num-w);column-gap:var(--leva-col-gap)}.lv-hint{grid-column:1 / -1;color:var(--leva-label);opacity:.8;font-size:9.5px;margin-top:-2px}.lv-range{position:relative;height:var(--leva-row-h);display:flex;align-items:center;cursor:pointer;touch-action:none;outline:none}.lv-track{position:relative;width:100%;height:2px;background:var(--leva-input)}.lv-fill{position:absolute;left:0;top:0;bottom:0;background:var(--leva-button)}.lv-scrub{position:absolute;width:var(--leva-scrub-w);height:var(--leva-scrub-h);border-radius:var(--leva-r-xs);background:var(--leva-button)}.lv-range:hover .lv-scrub,.lv-range:focus-visible .lv-scrub{background:var(--leva-button-pressed)}.lv-range:focus-visible .lv-scrub{box-shadow:0 0 0 2px var(--leva-accent)}.lv-input{width:100%;min-width:0;background:var(--leva-input);border:0;border-radius:var(--leva-r-sm);color:var(--leva-fg);height:var(--leva-row-h);padding:0 var(--leva-sm);font-size:var(--leva-fs);outline:none}.lv-input:focus{background:var(--leva-input-focus);box-shadow:inset 0 0 0 1px var(--leva-accent)}.lv-input.num{text-align:right;font-variant-numeric:tabular-nums;padding:0 var(--leva-xs)}.lv-select{position:relative;height:var(--leva-row-h);background:var(--leva-input);border-radius:var(--leva-r-sm);display:flex;align-items:center;padding:0 var(--leva-sm);cursor:pointer}.lv-select:hover{background:var(--leva-input-focus)}.lv-select select{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;appearance:none;border:0}.lv-select .val{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lv-select svg{fill:var(--leva-label);flex:0 0 auto}.lv-check{width:var(--leva-check);height:var(--leva-check);border-radius:var(--leva-r-sm);background:var(--leva-input);border:0;padding:0;cursor:pointer;position:relative;justify-self:start;transition:background .12s}.lv-check:hover{background:var(--leva-input-focus)}.lv-check.on{background:var(--leva-button)}.lv-check.on:after{content:"";position:absolute;left:5px;top:2px;width:4px;height:8px;border:solid var(--leva-bg);border-width:0 1.5px 1.5px 0;transform:rotate(43deg)}.lv-color{display:grid;grid-template-columns:var(--leva-row-h) 1fr;column-gap:var(--leva-col-gap)}.lv-swatch{width:var(--leva-row-h);height:var(--leva-row-h);border-radius:var(--leva-r-sm);border:0;padding:0;position:relative;overflow:hidden;cursor:pointer;box-shadow:inset 0 0 0 1px #80808059}.lv-swatch input{position:absolute;inset:-6px;width:200%;height:200%;border:0;padding:0;cursor:pointer}.lv-btn{appearance:none;border:0;width:100%;height:var(--leva-row-h);border-radius:var(--leva-r-sm);background:var(--leva-button);color:light-dark(#ffffff,#f4f3eb);cursor:pointer;font-size:var(--leva-fs);letter-spacing:.02em;display:inline-flex;align-items:center;justify-content:center;gap:6px;transition:background .12s,opacity .12s}.lv-btn:hover{background:var(--leva-button-pressed)}.lv-btn:active{opacity:.8}.lv-btn:disabled{opacity:.45;cursor:not-allowed}.lv-btn.ghost{background:var(--leva-input);color:var(--leva-fg)}.lv-btn.ghost:hover{background:var(--leva-input-focus)}.lv-btn.ghost.on{background:var(--leva-button);color:light-dark(#fff,#f4f3eb)}.lv-btnrow{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:var(--leva-col-gap)}.lv-grid2{display:grid;grid-template-columns:1fr 1fr;gap:var(--leva-col-gap)}.lv-preset{display:flex;align-items:center;gap:var(--leva-sm);height:var(--leva-row-h);padding:0 var(--leva-sm);border-radius:var(--leva-r-sm);background:var(--leva-input);cursor:pointer;transition:background .12s}.lv-preset:hover{background:var(--leva-input-focus)}.lv-preset .nm{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lv-preset .meta{color:var(--leva-label);font-size:9px;letter-spacing:.08em}.lv-preset .x{appearance:none;background:none;border:0;color:var(--leva-label);cursor:pointer;padding:0 2px;line-height:1;font-size:13px}.lv-preset .x:hover{color:#e5484d}.lv-swatches{display:flex;flex-wrap:wrap;gap:var(--leva-col-gap)}.lv-thm{appearance:none;border:0;background:var(--leva-input);border-radius:var(--leva-r-sm);cursor:pointer;height:var(--leva-row-h);padding:0 var(--leva-sm);display:inline-flex;align-items:center;gap:var(--leva-sm);color:var(--leva-fg);font-size:10px}.lv-thm:hover{background:var(--leva-input-focus)}.lv-thm .chips{display:flex;border-radius:var(--leva-r-xs);overflow:hidden}.lv-thm .chips i{width:7px;height:12px;display:block}.lv-keys{color:var(--leva-label);line-height:2;font-size:10px}.lv-keys div{display:flex;align-items:center;gap:8px}.lv-kbd{display:inline-block;background:var(--leva-input);border-radius:var(--leva-r-xs);padding:0 5px;min-width:16px;text-align:center;color:var(--leva-fg);font-size:9.5px;line-height:16px}.toast{position:fixed;left:50%;bottom:46px;transform:translate(-50%);background:var(--leva-bg);color:var(--leva-fg);border-radius:var(--leva-r-lg);padding:9px 15px;letter-spacing:.04em;font-size:11px;z-index:60;box-shadow:var(--leva-shadow);max-width:70vw}.toast.err{color:#e5484d}@media(max-width:900px){.app.with-panel .stage{padding-right:24px}.panel{width:min(var(--leva-root-w),92vw)}}