:root{--ui-scale:.75;--text-sm:.9375rem;--text-md:1.0625rem;--text-lg:1.375rem;--text-xl:1.75rem;--text-display:3.5rem;--leading:1.45;--leading-tight:1.2;--font-ui:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-7:2rem;--space-8:3rem;--radius-sm:.5rem;--radius:.875rem;--control-h:3.25rem;--control-h-sm:2.75rem;--measure:40rem;--tap-min:44px;--bg:#f6f4ee;--surface:#fff;--text:#1b1b1b;--text-muted:#5e5a52;--line:#e3ded3;--accent:#233044;--on-accent:#fff}@media (prefers-color-scheme:dark){:root{--bg:#111;--surface:#1c1c1e;--text:#f2f2f2;--text-muted:#a5a5aa;--line:#2c2c2e;--accent:#9db4d6;--on-accent:#111}}*,:before,:after{box-sizing:border-box}html{font-size:calc(var(--ui-scale) * 100%);-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--text);font:var(--text-md) / var(--leading) var(--font-ui);margin:0}:focus-visible{outline:3px solid var(--accent);outline-offset:2px}input,select,textarea{font-size:max(16px,1em)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}.ds-btn:active{transform:none}}.ds-app{min-height:100svh;padding:env(safe-area-inset-top) env(safe-area-inset-right) 0 env(safe-area-inset-left);flex-direction:column;display:flex}.ds-page{width:100%;max-width:var(--measure);padding:var(--space-6) var(--space-4);flex:1;margin:0 auto}.ds-title{font-size:var(--text-xl);line-height:var(--leading-tight);margin:0 0 var(--space-1)}.ds-heading{font-size:var(--text-lg);line-height:var(--leading-tight);margin:var(--space-7) 0 var(--space-3)}.ds-sub{color:var(--text-muted);margin:0 0 var(--space-5)}.ds-muted{color:var(--text-muted)}.ds-small{font-size:var(--text-sm)}.ds-num{font-variant-numeric:tabular-nums}.ds-display{font-size:var(--text-display);font-weight:700;line-height:var(--leading-tight);font-variant-numeric:tabular-nums}.ds-mono{font-family:var(--font-mono)}.ds-cards{gap:var(--space-3);margin:0;padding:0;list-style:none;display:grid}.ds-card{justify-content:center;gap:var(--space-1);min-height:max(var(--tap-min), 4rem);padding:var(--space-3) var(--space-4);border-radius:var(--radius);background:var(--surface);border:1px solid var(--line);color:inherit;flex-direction:column;text-decoration:none;display:flex}.ds-card:active{background:var(--line)}.ds-card-title{font-weight:600}.ds-card-text{color:var(--text-muted);font-size:var(--text-sm)}.ds-list{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);margin:0;padding:0;overflow:hidden}.ds-row{justify-content:space-between;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-top:1px solid var(--line);display:flex}.ds-row:first-child{border-top:0}.ds-row>:first-child{color:var(--text-muted);margin:0}.ds-row>:last-child{text-align:right;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;margin:0}.ds-btn{min-height:max(var(--tap-min), var(--control-h));padding:0 var(--space-4);border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);color:var(--text);font:inherit;touch-action:manipulation;flex:1;font-weight:600}.ds-btn--primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.ds-btn:active{transform:scale(.98)}.ds-seg{gap:var(--space-2);display:flex}.ds-seg>button{min-height:max(var(--tap-min), var(--control-h-sm));border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);color:var(--text);font:inherit;touch-action:manipulation;flex:1;font-weight:500}.ds-seg>button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--on-accent);font-weight:600}.ds-bar{gap:var(--space-3);width:100%;max-width:var(--measure);padding:var(--space-3) var(--space-4) calc(var(--space-3) + env(safe-area-inset-bottom));background:var(--bg);margin:0 auto;display:flex;position:sticky;bottom:0}html,body,#root{height:100%}body{overscroll-behavior:none;overflow:hidden}.studio{height:100svh;padding:env(safe-area-inset-top) env(safe-area-inset-right) 0 env(safe-area-inset-left);flex-direction:column;display:flex}.studio-bar{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--line);background:var(--bg);display:flex}.studio-page{min-width:0;min-height:max(var(--tap-min), var(--control-h-sm));padding:0 var(--space-3);border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);color:var(--text);flex:1}.studio-select{min-height:max(var(--tap-min), var(--control-h-sm));flex:none}.studio-select[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.studio-stage{flex-direction:column;flex:1;min-height:0;display:flex}.studio-canvas{flex:1;min-height:0;position:relative;overflow:hidden}.studio-frame{background:var(--surface);border:0;width:100%;height:100%;position:absolute;inset:0}.studio-canvas[data-picking]:after{content:"";box-shadow:inset 0 0 0 3px var(--accent);pointer-events:none;position:absolute;inset:0}.studio-overlay{pointer-events:none;position:absolute;inset:0;overflow:hidden}.hl{box-sizing:border-box;position:absolute}.hl-margin{border-style:solid;border-color:#f6b26b8c}.hl-padding{background:#6fa8dc2e;border-style:solid;border-color:#93c47d8c}.hl-border{outline:2px solid var(--accent);outline-offset:-2px}.hl-chip{padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);background:var(--accent);color:var(--on-accent);font:var(--text-sm) / 1.2 var(--font-mono);white-space:nowrap;text-overflow:ellipsis;max-width:calc(100% - .5rem);position:absolute;overflow:hidden}.hl-size{opacity:.8}.sheet{background:var(--bg);border-top:1px solid var(--line);min-height:0;padding-bottom:env(safe-area-inset-bottom);flex-direction:column;flex:none;display:flex;box-shadow:0 -.25rem 1.5rem #0000001a}.sheet--half{flex-basis:50%}.sheet--full{flex-basis:85%}.sheet-head{padding:0 var(--space-3) var(--space-2);flex:none}.sheet-handle{width:100%;min-height:var(--tap-min);touch-action:manipulation;background:0 0;border:0;justify-content:center;align-items:center;display:flex}.sheet-grip{background:var(--line);border-radius:1rem;width:3rem;height:.375rem}.sheet-row{align-items:center;gap:var(--space-3);display:flex}.sheet-tabs{flex:none}.sheet-tabs>button{padding:0 var(--space-4)}.sheet-sel{min-width:0;color:var(--text-muted);font-size:var(--text-sm);text-align:right;white-space:nowrap;text-overflow:ellipsis;flex:1;overflow:hidden}.sheet-body{overscroll-behavior:contain;border-top:1px solid var(--line);flex:1;min-height:0;overflow:auto}.studio-empty{padding:var(--space-4);margin:0}.tree-stats{padding:var(--space-2) var(--space-4);border-bottom:1px solid var(--line);color:var(--text-muted);font-size:var(--text-sm);margin:0}.tree{padding:var(--space-1) 0;font:var(--text-sm) / 1.3 var(--font-mono);margin:0;list-style:none}.tree-row{min-height:var(--tap-min);align-items:center;display:flex;position:relative}.tree-row[data-selected]{background:color-mix(in srgb, var(--accent) 22%, transparent);box-shadow:inset 3px 0 0 var(--accent)}.tree-toggle{width:var(--tap-min);min-height:var(--tap-min);color:var(--text-muted);font:inherit;touch-action:manipulation;background:0 0;border:0;flex:none}.tree-label{min-width:0;min-height:var(--tap-min);padding:0 var(--space-3) 0 0;color:var(--text);font:inherit;text-align:left;white-space:nowrap;text-overflow:ellipsis;touch-action:manipulation;background:0 0;border:0;flex:1;overflow:hidden}.tree-text .tree-label,.tree-shadow .tree-label{color:var(--text-muted)}.tree-flash{background:color-mix(in srgb, var(--accent) 30%, transparent);pointer-events:none;animation:.9s ease-out forwards tree-flash;position:absolute;inset:0}@keyframes tree-flash{to{opacity:0}}@media (prefers-reduced-motion:reduce){.tree-flash{box-shadow:inset 3px 0 0 color-mix(in srgb, var(--accent) 60%, transparent);background:0 0}}.tree button:focus-visible,.crumb:focus-visible{outline-offset:-3px}.inspect{padding:var(--space-3) var(--space-4) var(--space-6)}.crumbs{gap:var(--space-2);padding-bottom:var(--space-1);display:flex;overflow-x:auto}.crumb{min-width:var(--tap-min);min-height:var(--tap-min);padding:0 var(--space-2);border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);color:var(--text-muted);font:var(--text-sm) / 1 var(--font-mono);touch-action:manipulation;flex:none}.crumb[aria-current=true]{color:var(--text);border-color:var(--accent)}.inspect-title{font-family:var(--font-mono);margin-top:var(--space-3);overflow-wrap:anywhere}.inspect-sub{font-size:var(--text-md);margin:var(--space-5) 0 var(--space-2)}.inspect-attrs .ds-row>:last-child,.inspect-styles .ds-row>:last-child{font-family:var(--font-mono);font-size:var(--text-sm)}.inspect-text{color:var(--text-muted);overflow-wrap:anywhere;margin:0}.inspect-note{margin:0 0 var(--space-3)}.boxm{margin-top:var(--space-4);font-size:var(--text-sm)}.boxm-layer{border:1px dashed var(--line);border-radius:var(--radius-sm);padding:1.5rem 2rem;position:relative}.boxm-margin{background:#f6b26b2e}.boxm-border{background:var(--bg);border-style:solid;border-color:var(--text-muted)}.boxm-padding{background:#93c47d33}.boxm-content{padding:var(--space-2);border:1px solid var(--line);border-radius:var(--radius-sm);text-align:center;background:#6fa8dc40}.boxm-name{top:var(--space-1);left:var(--space-2);color:var(--text-muted);position:absolute}.boxm-v{position:absolute}.boxm-t{top:var(--space-1);left:50%;transform:translate(-50%)}.boxm-b{bottom:var(--space-1);left:50%;transform:translate(-50%)}.boxm-l{left:var(--space-2);top:50%;transform:translateY(-50%)}.boxm-r{right:var(--space-2);top:50%;transform:translateY(-50%)}