@font-face{font-family:Outfit Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/outfit-latin-ext-wght-normal-DdQaqQDo.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Outfit Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/outfit-latin-wght-normal-Bc-8i84L.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Figtree Variable;font-style:normal;font-display:swap;font-weight:300 900;src:url(/assets/figtree-latin-ext-wght-normal-DCwSJGxG.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Figtree Variable;font-style:normal;font-display:swap;font-weight:300 900;src:url(/assets/figtree-latin-wght-normal-D_ZTVpCC.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:DM Mono;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/dm-mono-latin-ext-400-normal-C2zvOubV.woff2)format("woff2"),url(/assets/dm-mono-latin-ext-400-normal-1aZr6b2b.woff)format("woff");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:DM Mono;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/dm-mono-latin-400-normal-4GdczIuU.woff2)format("woff2"),url(/assets/dm-mono-latin-400-normal--0xN8mdc.woff)format("woff");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:DM Mono;font-style:normal;font-display:swap;font-weight:500;src:url(/assets/dm-mono-latin-ext-500-normal-BtRyHRi6.woff2)format("woff2"),url(/assets/dm-mono-latin-ext-500-normal-Dw3M13d8.woff)format("woff");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:DM Mono;font-style:normal;font-display:swap;font-weight:500;src:url(/assets/dm-mono-latin-500-normal-DRMDZjhP.woff2)format("woff2"),url(/assets/dm-mono-latin-500-normal-CN8Miw6E.woff)format("woff");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--s-bg:#0e1013;--s-bg-panel:#15181d;--s-bg-raised:#1c2027;--s-bg-input:#0b0d10;--s-bg-hover:#232830;--s-border:#272d36;--s-border-strong:#3a4250;--s-text:#eceef3;--s-text-dim:#b4bcc8;--s-text-faint:#8d96a4;--s-accent:#2de5b0;--s-accent-dim:#00553f;--s-on-accent:#05231a;--s-good:#4ade80;--s-warn:#fbbf24;--s-bad:#f87171;--s-radius:7px;--s-radius-lg:12px;--s-shadow-popup:0 1px 2px #0000004d, 0 16px 40px -8px #0000008c;--s-ease:.14s cubic-bezier(.2, 0, 0, 1);--s-editor-pad-y:36px;--s-editor-pad-x:44px;--font-display:"Outfit Variable", Outfit, var(--font-sans);--font-sans:"Figtree Variable", Figtree, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"DM Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--s-fs-base:16px;--s-fs-lg:15.5px;--s-fs-md:15px;--s-fs-sm:14px;--s-fs-xs:13.5px;--s-fs-2xs:13px;--s-fs-3xs:12px;--s-fs-xl:26px;--s-code-comment:var(--s-text-faint);--s-code-property:#8ab4f8;--s-code-variable:var(--s-accent);--s-code-string:#a8d8a0;--s-code-number:#f4a868;--s-code-atom:#f09ac0;--s-code-keyword:#c5a0f2;--s-code-function:#7fd3e6;--s-code-selector:#f2d27a;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}.link-button{all:unset;cursor:pointer;color:var(--s-accent);text-underline-offset:2px;text-decoration:underline}.link-button:focus-visible{outline:2px solid var(--s-accent);outline-offset:2px;border-radius:2px}.dep-graph g[role=button]:focus-visible rect:first-of-type{stroke:var(--s-accent);stroke-width:2px}.dep-graph g[role=button]:hover rect:first-of-type{stroke:var(--s-border-strong)}:root[data-studio-theme=light]{--s-bg:#f4f5f7;--s-bg-panel:#fff;--s-bg-raised:#fbfbfd;--s-bg-input:#fff;--s-bg-hover:#eceef2;--s-border:#e2e5ea;--s-border-strong:#c4c9d3;--s-text:#14171c;--s-text-dim:#464e5b;--s-text-faint:#646c79;--s-accent:#007557;--s-accent-dim:#8adfbe;--s-on-accent:#fff;--s-good:#15803d;--s-warn:#a15c07;--s-bad:#b91c1c;--s-shadow-popup:0 1px 2px #0f141e0f, 0 16px 40px -8px #0f141e2e;--s-code-property:#1f5fbf;--s-code-string:#3a7a2e;--s-code-number:#b1500c;--s-code-atom:#b02f6a;--s-code-keyword:#7a3fc4;--s-code-function:#0b6e80;--s-code-selector:#8a5a00;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body,#root{height:100%}body{font-family:var(--font-sans);font-size:var(--s-fs-base);background:var(--s-bg);color:var(--s-text);-webkit-font-smoothing:antialiased;margin:0;line-height:1.5;position:relative}button,input,select,textarea{font:inherit;color:inherit}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--s-border-strong);background-clip:content-box;border:3px solid #0000;border-radius:6px}::-webkit-scrollbar-thumb:hover{background:var(--s-text-faint);background-clip:content-box}.app{isolation:isolate;grid-template-rows:60px 1fr;height:100%;display:grid}.topbar{border-bottom:1px solid var(--s-border);background:var(--s-bg-panel);align-items:center;gap:12px;padding:0 20px;display:flex}.topbar .brand{font-family:var(--font-display);letter-spacing:.005em;align-items:center;gap:10px;font-size:17px;font-weight:500;display:flex}.topbar .brand .mark{background:linear-gradient(135deg,#38ebb4,#00c2cd);background:linear-gradient(135deg,lab(83.5588% -55.3318 13.4083),lab(71.0421% -39.7825 -18.2009));border-radius:6px;width:20px;height:20px}.topbar .brand:after{content:"";background:var(--s-border-strong);width:1px;height:20px;margin-left:6px}.topbar .spacer{flex:1}.topbar .btn.sm{padding:8px}.topbar .segmented-item{padding:5px 14px}.topbar .project-name{border-radius:var(--s-radius);min-width:140px;max-width:320px;color:var(--s-text-dim);transition:border-color var(--s-ease), color var(--s-ease), background var(--s-ease);background:0 0;border:1px solid #0000;padding:6px 10px;font-weight:500}.topbar .project-name:hover{border-color:var(--s-border);color:var(--s-text)}.topbar .project-name:focus{border-color:var(--s-accent);background:var(--s-bg-input);outline:none}.body{grid-template-columns:var(--rail-w,188px) auto minmax(320px, 1fr) auto var(--preview-w,520px);min-height:0;display:grid}.body.no-preview{grid-template-columns:var(--rail-w,188px) auto 1fr}.rail{border-right:1px solid var(--s-border);background:var(--s-bg-panel);flex-direction:column;gap:2px;padding:14px 10px;display:flex;overflow-y:auto}.rail .group-label,.value-sources .group-label{font-size:var(--s-fs-3xs);text-transform:uppercase;letter-spacing:.1em;color:var(--s-text-faint);padding:20px 10px 6px;font-weight:600}.value-sources>:first-child .group-label{padding-top:6px}.rail button{border-radius:var(--s-radius);width:100%;color:var(--s-text-dim);cursor:pointer;text-align:left;transition:background var(--s-ease), color var(--s-ease);background:0 0;border:0;align-items:center;gap:10px;padding:7px 10px;display:flex;position:relative}.rail button:hover{background:var(--s-bg-hover);color:var(--s-text)}.rail button:focus-visible{outline:2px solid var(--s-accent);outline-offset:-2px}.rail button[aria-current=page]{background:var(--s-bg-raised);color:var(--s-text);font-weight:550}.rail button[aria-current=page]:before{content:"";background:var(--s-accent);border-radius:0 3px 3px 0;width:3px;position:absolute;inset-block:8px;inset-inline-start:0}.rail button[aria-current=page] .icon{color:var(--s-accent);opacity:1}.rail-view{padding:0 0 4px}.rail .rail-view .select-trigger{border:1px solid var(--s-border);border-radius:var(--s-radius);background:var(--s-bg-input);color:var(--s-text);padding:8px 12px;font-weight:550}.rail .rail-view .select-trigger:hover{background:var(--s-bg-hover);border-color:var(--s-border-strong)}.rail .rail-view .select-trigger:focus-visible,.rail .rail-view .select-trigger[data-popup-open]{border-color:var(--s-accent)}.rail button .icon{text-align:center;opacity:.8;width:20px;font-size:var(--s-fs-sm);flex:none}.rail button .rail-label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.rail button .count{font-size:var(--s-fs-3xs);color:var(--s-text-faint);font-variant-numeric:tabular-nums;margin-left:auto}.rail-foot{font-size:var(--s-fs-2xs);color:var(--s-text-faint);margin-top:auto;padding:24px 10px 6px;line-height:1.6}.editor{min-width:0;overflow-y:auto}.editor-inner{padding:var(--s-editor-pad-y) var(--s-editor-pad-x) 120px;max-width:940px}::view-transition-group(.panel-swap){animation-duration:.14s}.preview-pane{background:var(--s-bg-panel);grid-template-rows:52px 1fr;min-width:0;display:grid}.preview-body{background:var(--s-bg);overflow:hidden}.splitter{cursor:col-resize;background:var(--s-border);touch-action:none;background-clip:content-box;border-inline:3px solid #0000;width:7px;position:relative}.splitter:hover,.splitter:focus-visible{background:var(--s-accent);outline:none}.splitter:focus-visible{border-inline-width:2px}.splitter-grip{background:var(--s-border-strong);border-radius:3px;width:3px;height:26px;position:absolute;inset-block:50% auto;inset-inline-start:50%;translate:-50% -50%}.splitter:hover .splitter-grip,.splitter:focus-visible .splitter-grip{background:var(--s-on-accent)}:root[data-resizing]{cursor:col-resize;-webkit-user-select:none;user-select:none}:root[data-resizing] iframe{pointer-events:none}.panel-head{margin-bottom:36px}.panel-head h1{font-family:var(--font-display);font-size:var(--s-fs-xl);letter-spacing:-.01em;margin:0 0 10px;font-weight:300;line-height:1.2}.panel-head p{color:var(--s-text-dim);max-width:64ch;margin:0;line-height:1.6}.section{margin-bottom:60px}.section>h2{font-size:var(--s-fs-2xs);text-transform:uppercase;letter-spacing:.09em;color:var(--s-text-dim);align-items:center;gap:12px;margin:0 0 16px;font-weight:600;display:flex}.section>h2 .section-rule{background:var(--s-border);border:0;flex:1;height:1px;margin:0}.card{background:var(--s-bg-panel);border:1px solid var(--s-border);border-radius:var(--s-radius-lg);padding:20px}.card+.card{margin-top:14px}.hint{color:var(--s-text-faint);font-size:var(--s-fs-sm);margin:10px 0 0;line-height:1.6}.field{align-content:start;gap:7px;margin-bottom:20px;display:grid}.slider-field{grid-template-columns:1fr 100px;gap:7px 12px}.slider-field>.slider{grid-column:1}.slider-field>.numberfield{grid-area:1/2;align-self:end}.slider-field>.desc{grid-column:1/-1}.field-head{align-items:baseline;gap:8px;display:flex}.field-head label,.field-head>.val{font-size:var(--s-fs-md)}.field-head label{color:var(--s-text-dim);font-weight:500}.field-head .val{font-family:var(--font-mono);font-size:var(--s-fs-xs);color:var(--s-text-faint);font-variant-numeric:tabular-nums;margin-left:auto}.field .desc,.desc{font-size:var(--s-fs-sm);color:var(--s-text-faint);line-height:1.55}.reset{width:22px;height:22px;color:var(--s-accent);cursor:pointer;transition:background var(--s-ease);background:0 0;border:0;border-radius:5px;flex:none;align-self:center;place-items:center;padding:0;display:grid}.reset:hover{background:var(--s-bg-hover)}.reset:focus-visible{outline:2px solid var(--s-accent);outline-offset:0}.field-head .reset{margin-left:auto}.field-head .reset+.val{margin-left:0}.slider-row-number{gap:4px}.row{align-items:center;gap:10px;display:flex}.row.wrap{flex-wrap:wrap}.grid2{grid-template-columns:1fr 1fr;gap:0 20px;display:grid}.grid3{grid-template-columns:repeat(3,1fr);gap:0 20px;display:grid}input:not([type=range],[type=color],[type=checkbox],[type=radio],[type=file]),select,textarea{background:var(--s-bg-input);border:1px solid var(--s-border-strong);border-radius:var(--s-radius);width:100%;font-size:var(--s-fs-lg);min-width:0;transition:border-color var(--s-ease), box-shadow var(--s-ease);padding:8px 12px}input:not([type=range],[type=color],[type=checkbox],[type=radio],[type=file]):hover,select:hover,textarea:hover{border-color:var(--s-text-faint)}input:not([type=range],[type=color],[type=checkbox],[type=radio],[type=file]):focus,select:focus,textarea:focus{border-color:var(--s-accent);box-shadow:0 0 0 3px color-mix(in oklab, var(--s-accent) 22%, transparent);outline:none}input.mono,textarea.mono{font-family:var(--font-mono);font-size:var(--s-fs-md)}input::placeholder{color:var(--s-text-faint)}input[type=color]{border:1px solid var(--s-border);border-radius:var(--s-radius);background:var(--s-bg-input);cursor:pointer;flex:none;width:38px;height:38px;padding:3px}.slider{gap:4px;display:grid}.slider-control{touch-action:none;cursor:pointer;align-items:center;width:100%;height:24px;display:flex}.slider-track{background:var(--s-border-strong);border-radius:2px;width:100%;height:4px;position:relative}.slider-indicator{background:var(--s-accent);border-radius:2px;height:100%;position:absolute}.slider-thumb{background:var(--s-text);width:16px;height:16px;transition:background var(--s-ease), box-shadow var(--s-ease), scale var(--s-ease);border:0;border-radius:50%;outline:none;box-shadow:0 1px 3px #00000059}.slider-control:hover .slider-thumb{scale:1.1}.slider-thumb:focus-visible{box-shadow:0 0 0 4px color-mix(in oklab, var(--s-accent) 35%, transparent)}.slider[data-dragging] .slider-thumb{background:var(--s-accent)}.numberfield-group{align-items:stretch;display:flex}.numberfield-input{text-align:left;font-variant-numeric:tabular-nums}.numberfield-step{border:1px solid var(--s-border-strong);background:var(--s-bg-raised);width:32px;color:var(--s-text-dim);cursor:pointer;transition:background var(--s-ease), color var(--s-ease);flex:none;place-items:center;display:grid}.numberfield-step:hover{background:var(--s-bg-hover);color:var(--s-text)}.numberfield-group>.numberfield-step:first-child{border-radius:var(--s-radius) 0 0 var(--s-radius);border-right:0}.numberfield-group>.numberfield-step:last-child{border-radius:0 var(--s-radius) var(--s-radius) 0;border-left:0}.numberfield-group:has(>.numberfield-step) .numberfield-input{border-radius:0}.btn{border-radius:var(--s-radius);cursor:pointer;border:1px solid var(--s-border-strong);background:var(--s-bg-raised);color:var(--s-text);font-size:var(--s-fs-md);white-space:nowrap;transition:background var(--s-ease), border-color var(--s-ease), color var(--s-ease), filter var(--s-ease);justify-content:center;align-items:center;gap:7px;padding:8px 15px;font-weight:500;line-height:1.35;display:inline-flex}.btn:hover{background:var(--s-bg-hover);border-color:var(--s-text-faint)}.btn:active{transform:translateY(.5px)}.btn:focus-visible{outline:2px solid var(--s-accent);outline-offset:2px}.btn.primary{background:var(--s-accent);border-color:var(--s-accent);color:var(--s-on-accent);font-weight:600}.btn.primary:hover{filter:brightness(1.08)}.btn.subtle{color:var(--s-text-dim);background:0 0;border-color:#0000}.btn.subtle:hover{background:var(--s-bg-hover);color:var(--s-text)}.btn.subtle[aria-pressed=true]{color:var(--s-text);background:var(--s-bg-raised)}.btn.danger:hover{border-color:var(--s-bad);color:var(--s-bad)}.btn.sm{font-size:var(--s-fs-sm);padding:5px 11px}.btn:disabled,.btn[data-disabled]{opacity:.4;cursor:not-allowed}.btn:disabled:hover,.btn[data-disabled]:hover{background:var(--s-bg-raised);border-color:var(--s-border)}.btn.subtle:disabled:hover,.btn.subtle[data-disabled]:hover{background:0 0}.segmented{background:var(--s-bg-input);border:1px solid var(--s-border);border-radius:var(--s-radius);gap:2px;padding:3px;display:inline-flex}.segmented.tight{margin-left:auto}.segmented-item{color:var(--s-text-dim);cursor:pointer;font-size:var(--s-fs-sm);white-space:nowrap;transition:background var(--s-ease), color var(--s-ease);background:0 0;border:0;border-radius:5px;padding:5px 12px;font-weight:500}.segmented-item[data-pressed]{background:var(--s-bg-hover);color:var(--s-text);box-shadow:0 1px 2px #00000040, inset 0 0 0 1px var(--s-border-strong)}.segmented-item:hover:not([data-pressed]){color:var(--s-text)}.segmented-item:focus-visible{outline:2px solid var(--s-accent);outline-offset:-1px}.switch-row{align-items:center;gap:10px;display:flex}.switch-label{font-size:var(--s-fs-md);color:var(--s-text-dim);cursor:pointer;font-weight:500}.switch{background:var(--s-border-strong);cursor:pointer;width:36px;height:20px;transition:background var(--s-ease);border:0;border-radius:10px;flex:none;padding:0;position:relative}.switch[data-checked]{background:var(--s-accent)}.switch:focus-visible{box-shadow:0 0 0 3px color-mix(in oklab, var(--s-accent) 35%, transparent);outline:none}.switch-thumb{background:var(--s-text);width:16px;height:16px;transition:transform var(--s-ease);border-radius:50%;position:absolute;top:2px;left:2px;box-shadow:0 1px 2px #0000004d}.switch[data-checked] .switch-thumb{background:#fff;transform:translate(16px)}.select-trigger{background:var(--s-bg-input);border:1px solid var(--s-border-strong);border-radius:var(--s-radius);width:100%;min-width:0;font-size:var(--s-fs-lg);color:var(--s-text);cursor:pointer;text-align:left;transition:border-color var(--s-ease), box-shadow var(--s-ease);align-items:center;gap:8px;padding:8px 12px;display:flex}.select-trigger:hover{border-color:var(--s-text-faint)}.select-trigger:focus-visible,.select-trigger[data-popup-open]{border-color:var(--s-accent);box-shadow:0 0 0 3px color-mix(in oklab, var(--s-accent) 22%, transparent);outline:none}.select-value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.select-icon{color:var(--s-text-faint);flex:none;margin-left:auto}.select-positioner{z-index:60;outline:none}.popup{min-width:var(--anchor-width);max-height:var(--available-height);background:var(--s-bg-panel);border:1px solid var(--s-border-strong);border-radius:var(--s-radius-lg);box-shadow:var(--s-shadow-popup);outline:none;padding:6px;transition:opacity .12s,scale .12s;overflow:hidden}.popup[data-starting-style],.popup[data-ending-style]{opacity:0;scale:.98}.popup-list{max-height:min(360px, var(--available-height));overflow-y:auto}.popup-item{cursor:pointer;font-size:var(--s-fs-lg);color:var(--s-text-dim);border-radius:5px;outline:none;align-items:center;gap:10px;padding:7px 12px 7px 8px;display:flex}.popup-item[data-highlighted]{background:var(--s-bg-hover);color:var(--s-text)}.popup-item[data-selected]{color:var(--s-text)}.popup-indicator{width:12px;color:var(--s-accent);flex:none}.popup-item-text{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.popup-item-meta{font-family:var(--font-mono);font-size:var(--s-fs-xs);color:var(--s-text-faint);text-overflow:ellipsis;white-space:nowrap;max-width:40%;margin-left:auto;overflow:hidden}.popup-empty{font-size:var(--s-fs-md);color:var(--s-text-faint);padding:8px}.menu-positioner{z-index:60;outline:none}.menu-popup{min-width:220px}.menu-popup .popup-item[data-popup-open]{background:var(--s-bg-hover);color:var(--s-text)}.menu-popup .popup-item[data-checked]{color:var(--s-text)}.menu-popup .popup-item[data-disabled]{opacity:.45;cursor:default}.menu-popup .popup-item-meta{font-family:inherit;font-size:var(--s-fs-sm);max-width:none}.menu-chevron{color:var(--s-text-faint)}.menu-trigger{gap:5px}.menu-trigger-chevron{opacity:.7;transition:rotate var(--s-ease);flex:none;margin-right:-2px}.menu-trigger[data-popup-open] .menu-trigger-chevron{rotate:180deg}.menu-popup .popup-item-meta+.menu-chevron{margin-left:2px}.menu-popup .popup-item-text+.menu-chevron{margin-left:auto}.menu-separator{background:var(--s-border);height:1px;margin:6px -6px}.scroll-arrow{color:var(--s-text-faint);background:var(--s-bg-panel);justify-content:center;padding:2px;display:flex}.token-item .swatch.sm{border-radius:3px;width:14px;height:14px}.autocomplete-group{flex:1;min-width:0;display:flex}.dialog-backdrop{z-index:70;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#00000080;transition:opacity .15s;position:fixed;inset:0}.dialog-backdrop[data-starting-style],.dialog-backdrop[data-ending-style]{opacity:0}.dialog{z-index:71;background:var(--s-bg-panel);border:1px solid var(--s-border-strong);border-radius:var(--s-radius-lg);box-shadow:var(--s-shadow-popup);outline:none;flex-direction:column;transition:opacity .15s,scale .15s;display:flex;position:fixed;top:50%;left:50%;translate:-50% -50%}.dialog[data-starting-style],.dialog[data-ending-style]{opacity:0;scale:.97}.dialog-head{border-bottom:1px solid var(--s-border);align-items:flex-start;gap:12px;padding:18px 16px 16px 24px;display:flex}.dialog-title{font-family:var(--font-display);margin:0;font-size:22px;font-weight:400}.dialog-desc{color:var(--s-text-faint);font-size:var(--s-fs-md);margin:4px 0 0}.dialog-head .btn{margin-left:auto}.dialog-foot{border-top:1px solid var(--s-border);flex-wrap:wrap;align-items:center;gap:16px;padding:14px 24px;display:flex}.value-trigger{border:1px solid var(--s-border-strong);border-radius:var(--s-radius);background:var(--s-bg-input);width:100%;min-height:36px;color:var(--s-text);cursor:pointer;text-align:left;transition:border-color var(--s-ease);align-items:center;gap:10px;padding:5px 10px 5px 6px;display:flex}.value-trigger:hover{border-color:var(--s-text-faint)}.value-trigger:focus-visible,.value-trigger[data-popup-open]{border-color:var(--s-accent);outline:none}.value-trigger-text{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:var(--s-fs-sm);flex:1;overflow:hidden}.value-trigger-alpha{font-family:var(--font-mono);font-size:var(--s-fs-3xs);color:var(--s-text-faint);flex:none}.value-dialog{width:min(820px,94vw);max-height:min(680px,92vh)}.value-dialog-body{flex:1;grid-template-columns:208px minmax(0,1fr);min-height:0;display:grid}.value-sources{border-right:1px solid var(--s-border);background:var(--s-bg);border-bottom-left-radius:var(--s-radius-lg);padding:10px;overflow-y:auto}.value-source{text-align:left;cursor:pointer;border-radius:var(--s-radius);width:100%;color:var(--s-text-dim);background:0 0;border:1px solid #0000;gap:2px;padding:7px 10px;display:grid}.value-source:hover{background:var(--s-bg-hover);color:var(--s-text)}.value-source[aria-pressed=true]{background:var(--s-bg-raised);border-color:var(--s-border-strong);color:var(--s-text)}.value-source-name{font-size:var(--s-fs-lg)}.value-source-hint{font-size:var(--s-fs-3xs);color:var(--s-text-faint);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.value-items{align-content:start;padding:18px;overflow-y:auto}.value-items.grid{grid-template-columns:repeat(auto-fill,minmax(78px,1fr));gap:10px;display:grid}.value-items.list{grid-template-columns:minmax(0,1fr);gap:6px;display:grid}.value-item{cursor:pointer;border:1px solid var(--s-border);border-radius:var(--s-radius);background:var(--s-bg-input);min-width:0;color:var(--s-text-dim);text-align:left;transition:border-color var(--s-ease), color var(--s-ease);align-items:center;gap:12px;padding:8px 10px;display:flex;position:relative}.value-item:hover{border-color:var(--s-border-strong);color:var(--s-text)}.value-item[aria-pressed=true]{border-color:var(--s-accent);color:var(--s-text)}.value-item:focus-visible{outline:2px solid var(--s-accent);outline-offset:1px}.value-items.grid .value-item{flex-direction:column;align-items:stretch;gap:5px;padding:6px}.value-item-label{font-size:var(--s-fs-sm);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.value-item-meta{font-size:var(--s-fs-xs);color:var(--s-text-faint);text-overflow:ellipsis;white-space:nowrap;text-align:right;max-width:45%;margin-left:auto;overflow:hidden}.value-item-check{color:var(--s-accent);flex:none}.value-items.grid .value-item-check{position:absolute;top:4px;right:4px}.value-preview{border:1px solid var(--s-border-strong);width:22px;height:22px;color:var(--s-text-dim);font-size:var(--s-fs-sm);border-radius:5px;flex:none;place-items:center;line-height:1;display:grid;overflow:hidden}.value-preview.lg{width:26px;height:26px}.value-preview.empty{background:repeating-linear-gradient(45deg, var(--s-border) 0 3px, transparent 3px 6px)}.value-preview.shadow{background:var(--s-bg-raised)}.value-preview.bar,.value-preview.plain{background:0 0;border:0;justify-items:start;width:108px}.value-preview.bar>span{background:var(--s-accent);border-radius:2px;min-width:1px;height:8px}.value-preview.fontSize,.value-preview.fontFamily,.value-preview.fontWeight{width:30px;color:var(--s-text);background:0 0;border:0}.value-items.grid .value-preview{border-radius:4px;width:100%;height:34px}.value-items.grid .value-item:has(.value-preview.shadow){gap:12px;padding:14px 14px 8px}.value-items.grid .value-preview.shadow{border:0;height:40px;overflow:visible}.value-result{min-width:0;font-size:var(--s-fs-sm);color:var(--s-text-dim);align-items:center;gap:8px;display:flex}.value-alpha{width:240px}.value-alpha .field{gap:2px}.value-alpha .desc,.value-alpha .numberfield{display:none}.value-alpha .slider-field{display:grid}.tooltip{background:var(--s-bg-raised);color:var(--s-text);border:1px solid var(--s-border-strong);border-radius:var(--s-radius);font-size:var(--s-fs-sm);box-shadow:var(--s-shadow-popup);z-index:70;padding:5px 10px;transition:opacity .1s}.tooltip[data-starting-style],.tooltip[data-ending-style]{opacity:0}.toast-viewport{z-index:80;pointer-events:none;flex-direction:column;align-items:center;gap:6px;display:flex;position:fixed;inset-block-end:18px;inset-inline:0}.toast{pointer-events:auto;background:var(--s-bg-raised);border:1px solid var(--s-border-strong);font-size:var(--s-fs-md);box-shadow:var(--s-shadow-popup);border-radius:99px;align-items:center;padding:8px 10px 8px 18px;transition:opacity .16s,translate .16s;display:flex}.toast[data-starting-style],.toast[data-ending-style]{opacity:0;translate:0 8px}.toast-content{align-items:center;gap:10px;display:flex}.toast-title{font-weight:500}.toast-close{width:18px;height:18px;color:var(--s-text-faint);cursor:pointer;background:0 0;border:0;border-radius:50%;place-items:center;display:grid}.toast-close:hover{background:var(--s-bg-hover);color:var(--s-text)}.item-list{flex-direction:column;gap:4px;display:flex}.item{border-radius:var(--s-radius-lg);cursor:pointer;text-align:left;width:100%;min-height:48px;color:inherit;transition:background var(--s-ease), border-color var(--s-ease);background:0 0;border:1px solid #0000;align-items:center;gap:12px;padding:10px 14px;display:flex}.item:hover{background:var(--s-bg-hover)}.item[aria-selected=true]{background:var(--s-bg-raised);border-color:var(--s-border-strong)}.item .name{font-weight:500}.item .sub{color:var(--s-text-faint);font-size:var(--s-fs-sm)}.item-row{gap:12px}.item-row[data-selected=true]{background:var(--s-bg-raised);border-color:var(--s-border-strong)}.item-row .item-main{min-width:0;color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;flex:1;align-items:center;gap:12px;padding:0;display:flex}.item-row .item-main:focus-visible{outline:2px solid var(--s-accent);outline-offset:3px;border-radius:var(--s-radius)}.item-meta{color:var(--s-text-faint);font-size:var(--s-fs-sm);white-space:nowrap;align-items:center;gap:10px;margin-inline-start:auto;padding-inline-start:10px;display:flex}.item-actions{opacity:0;flex:none;gap:6px;transition:opacity .12s}.item-row:hover .item-actions,.item-row:focus-within .item-actions,.item-row[data-selected=true] .item-actions{opacity:1}.row-ramp{border-radius:5px;flex:none;display:flex;overflow:hidden;box-shadow:inset 0 0 0 1px #7f7f7f26}.row-ramp span{width:10px;height:24px}.row-gradient{border-radius:5px;flex:none;width:64px;height:24px}.radius-list{flex-direction:column;gap:6px;display:flex}.radius-row{border:1px solid var(--s-border);border-radius:var(--s-radius-lg);background:var(--s-bg-panel);grid-template-columns:64px minmax(96px,132px) minmax(120px,148px) minmax(140px,1fr) auto;align-items:center;gap:12px;padding:8px 10px;display:grid}.radius-row[data-split=true]{align-items:start}.radius-row[data-split=true]>.radius-sample,.radius-row[data-split=true]>.radius-name{align-self:center}.radius-row.radius-columns{font-size:var(--s-fs-2xs);text-transform:uppercase;letter-spacing:.06em;color:var(--s-text-faint);background:0 0;border-color:#0000;padding:0 10px;font-weight:600}.radius-sample{background:var(--s-bg-raised);border:1px solid var(--s-border-strong);corner-shape:var(--shape,round);width:64px;height:64px}.radius-name{gap:3px;min-width:0;display:grid}.radius-name .path{font-family:var(--font-mono);font-size:var(--s-fs-2xs);color:var(--s-text-faint)}.shape-control{gap:4px;min-width:0;display:grid}.k-row{align-items:center;gap:6px;min-width:0;display:flex}.k-row .numberfield{flex:1;min-width:0}.k-label{font-family:var(--font-mono);font-size:var(--s-fs-sm);color:var(--s-text-faint);flex:none}.corner-grid{grid-column:3/5;grid-template-columns:repeat(auto-fit,minmax(176px,1fr));gap:6px;display:grid}.corner-cell{border:1px solid var(--s-border);border-radius:var(--s-radius);background:var(--s-bg-raised);grid-template-columns:minmax(0,1fr) 64px;align-items:center;gap:4px 5px;padding:6px 7px;display:grid}.corner-cell .corner-label{font-size:var(--s-fs-2xs);text-transform:uppercase;letter-spacing:.05em;color:var(--s-text-faint);grid-column:1/-1;font-weight:600}.corner-cell .shape-control{min-width:0}.radius-pill{background:var(--s-bg-raised);border:1px solid var(--s-border-strong);corner-shape:var(--shape,round);border-radius:9999px;width:132px;height:42px;margin-top:10px}.scrollbar-samples{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-top:12px;display:grid}.scrollbar-sample-wrap{gap:5px;min-width:0;display:grid}.scrollbar-sample-head{flex-wrap:wrap;align-items:baseline;gap:6px;display:flex}.scrollbar-sample-head strong{font-size:var(--s-fs-md);font-weight:600}.scrollbar-sample-head span{color:var(--s-text-faint);font-size:var(--s-fs-sm)}.scrollbar-sample{border:1px solid var(--s-border);border-radius:var(--s-radius);background:var(--s-bg-raised);height:168px;color:var(--s-text-dim);font-size:var(--s-fs-md);padding:10px 12px;line-height:1.6;overflow:auto}.scrollbar-sample p{margin:0 0 8px}.scrollbar-sample:focus-visible{outline:2px solid var(--s-accent);outline-offset:2px}.gradient-band{border-radius:var(--s-radius);border:1px solid var(--s-border);height:72px}.gradient-compare{border-radius:var(--s-radius);border:1px solid var(--s-border);height:34px}.callout{border-radius:var(--s-radius-lg);font-size:var(--s-fs-md);border:1px solid;gap:4px;margin:14px 0 0;padding:14px 16px;line-height:1.5;display:grid}.callout strong{font-weight:600}.callout>span{color:var(--s-text-dim)}.callout.warn{color:var(--s-warn);border-color:color-mix(in oklab, var(--s-warn) 40%, transparent);background:color-mix(in oklab, var(--s-warn) 9%, transparent)}.callout.bad{color:var(--s-bad);border-color:color-mix(in oklab, var(--s-bad) 40%, transparent);background:color-mix(in oklab, var(--s-bad) 9%, transparent)}.callout.good{color:var(--s-good);border-color:color-mix(in oklab, var(--s-good) 40%, transparent);background:color-mix(in oklab, var(--s-good) 9%, transparent)}.chip{font-size:var(--s-fs-2xs);background:var(--s-bg-raised);color:var(--s-text-dim);border:1px solid var(--s-border);font-variant-numeric:tabular-nums;white-space:nowrap;border-radius:99px;align-items:center;gap:5px;padding:2px 9px;font-weight:600;display:inline-flex}.chip.good{color:var(--s-good);border-color:color-mix(in oklab, var(--s-good) 35%, transparent)}.chip.warn{color:var(--s-warn);border-color:color-mix(in oklab, var(--s-warn) 35%, transparent)}.chip.bad{color:var(--s-bad);border-color:color-mix(in oklab, var(--s-bad) 35%, transparent)}.ramp{border-radius:var(--s-radius-lg);border:1px solid var(--s-border);display:flex;overflow:hidden}.ramp .stop{cursor:pointer;flex:1;place-items:center;height:56px;display:grid;position:relative}.ramp .stop span{font-size:var(--s-fs-3xs);font-family:var(--font-mono);opacity:0;pointer-events:none;transition:opacity .12s}.ramp:hover .stop span{opacity:.85}.ramp .stop[data-clipped=true]:after{content:"";background:var(--s-warn);border-radius:50%;width:4px;height:4px;position:absolute;inset-block-start:3px;inset-inline-end:3px}.editor-sticky{z-index:2;margin:calc(-1 * var(--s-editor-pad-y)) calc(-1 * var(--s-editor-pad-x)) 32px;padding:22px var(--s-editor-pad-x) 20px;background:color-mix(in oklab, var(--s-bg) 88%, transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-block-end:1px solid var(--s-border);position:sticky;inset-block-start:0}.editor-sticky-head{align-items:baseline;gap:12px;margin-block-end:14px;display:flex}.editor-sticky-head .btn{align-self:center}.editor-sticky-name{font-family:var(--font-display);font-size:var(--s-fs-xl);letter-spacing:-.005em;text-overflow:ellipsis;white-space:nowrap;font-weight:300;overflow:hidden}.editor-sticky-head .sub{color:var(--s-text-faint);font-family:var(--font-mono);font-size:var(--s-fs-sm)}.swatch{border:1px solid var(--s-border-strong);background-size:8px 8px;border-radius:5px;flex:none;width:22px;height:22px}.token-table{border-collapse:collapse;width:100%;font-size:var(--s-fs-lg)}.token-table th{text-align:left;font-size:var(--s-fs-3xs);text-transform:uppercase;letter-spacing:.08em;color:var(--s-text-faint);border-bottom:1px solid var(--s-border);padding:0 12px 10px;font-weight:600}.token-table td{border-bottom:1px solid var(--s-border);vertical-align:middle;padding:9px 12px}.token-table tr:last-child td{border-bottom-color:#0000}.token-table tr:hover td{background:color-mix(in oklab, var(--s-bg-hover) 70%, transparent)}.token-table .path{font-family:var(--font-mono);font-size:var(--s-fs-sm)}.token-table .overridden .path{color:var(--s-accent)}.token-table .overridden .path:after{content:" •";color:var(--s-accent)}.code{font-family:var(--font-mono);font-size:var(--s-fs-md);background:var(--s-bg-input);border:1px solid var(--s-border);border-radius:var(--s-radius-lg);white-space:pre;tab-size:2;max-height:min(58vh,620px);margin:0;padding:16px 18px;line-height:1.6;overflow:auto}::highlight(code-comment){color:var(--s-code-comment)}::highlight(code-property){color:var(--s-code-property)}::highlight(code-variable){color:var(--s-code-variable)}::highlight(code-string){color:var(--s-code-string)}::highlight(code-number){color:var(--s-code-number)}::highlight(code-atom){color:var(--s-code-atom)}::highlight(code-keyword){color:var(--s-code-keyword)}::highlight(code-function){color:var(--s-code-function)}::highlight(code-selector){color:var(--s-code-selector)}.code-edit{background:var(--s-bg-input);border-radius:var(--s-radius);display:grid;position:relative}.code-edit>pre,.code-edit>textarea{font-family:var(--font-mono);font-size:var(--s-fs-md);letter-spacing:normal;tab-size:2;white-space:pre;border-radius:var(--s-radius);border:1px solid #0000;margin:0;padding:8px 12px;font-weight:400;line-height:1.55}.code-edit>pre{pointer-events:none;color:var(--s-text);padding-bottom:28px;padding-right:32px;position:absolute;inset:0;overflow:hidden}.code-edit>textarea{color:#0000;caret-color:var(--s-text);border-color:var(--s-border-strong);resize:vertical;background:0 0;position:relative}.code-edit>textarea:focus{border-color:var(--s-accent)}.code-edit>textarea::placeholder{color:var(--s-text-faint)}.code-edit>textarea::selection{background:color-mix(in oklab, var(--s-accent) 28%, transparent)}.empty{color:var(--s-text-faint);text-align:center;font-size:var(--s-fs-lg);padding:40px 16px}.chip-button{cursor:pointer;background:0 0;border:0;padding:0;display:flex}.chip-button:hover .chip{background:var(--s-bg-hover)}.chip-button:focus-visible{outline:2px solid var(--s-accent);outline-offset:2px;border-radius:99px}.card.issue{padding:16px 20px}.card.issue+.card.issue{margin-top:10px}.issue-head{align-items:center;gap:10px;display:flex}.issue-head .path{font-family:var(--font-mono);font-size:var(--s-fs-sm)}.issue-detail{color:var(--s-text);margin:10px 0 0;line-height:1.6}.card.allclear strong{font-size:var(--s-fs-lg)}.save-row{cursor:default}.save-row:hover{background:0 0}.save-row .sub{margin-left:10px}.error-list{font-size:var(--s-fs-md);color:var(--s-text-dim);margin:6px 0 0;padding-left:18px}.empty.popped{place-content:center;height:100%;display:grid}.help p{max-width:68ch;color:var(--s-text-dim);margin:0 0 14px;line-height:1.7}.help p:last-child{margin-bottom:0}.help strong{color:var(--s-text);font-weight:600}.help em{color:var(--s-text);font-style:normal;font-weight:500}.help code{font-family:var(--font-mono);font-size:var(--s-fs-sm);background:var(--s-bg-input);border:1px solid var(--s-border);color:var(--s-text);white-space:nowrap;border-radius:4px;padding:0 4px}.help .steps{max-width:68ch;color:var(--s-text-dim);margin:0;padding-left:20px;line-height:1.65}.help .steps li{margin-bottom:8px}.help .steps li::marker{color:var(--s-text-faint);font-variant-numeric:tabular-nums}.help .help-list{max-width:68ch;margin:0}.help .help-list dt{color:var(--s-text);border-bottom:1px solid var(--s-border);margin-top:16px;padding-bottom:4px;font-weight:650}.help .help-list dt:first-child{margin-top:0}.help .help-list dd{color:var(--s-text-dim);margin:8px 0 0;line-height:1.65}.btn.jump{font-size:inherit;vertical-align:baseline;padding:0 5px;font-weight:500}.help .token-table td:first-child{white-space:nowrap;width:1%}.rail-foot .copyright{margin:8px 0 0}.rail-foot a{color:var(--s-text-dim);border-bottom:1px solid var(--s-border-strong);text-decoration:none}.rail-foot a:hover{color:var(--s-accent);border-bottom-color:var(--s-accent)}.version-line{flex-wrap:wrap;align-items:center;gap:6px;margin-top:8px;display:flex}.version-line .version{font-family:var(--font-mono);color:var(--s-text-dim);cursor:default;border-bottom:1px dotted var(--s-border-strong)}.version-line .version:focus-visible{outline:2px solid var(--s-accent);outline-offset:2px;border-radius:2px}.stage-flag{font-size:var(--s-fs-3xs);letter-spacing:.06em;text-transform:uppercase;color:var(--s-warn);border:1px solid color-mix(in oklab, var(--s-warn) 45%, transparent);background:color-mix(in oklab, var(--s-warn) 10%, transparent);border-radius:99px;padding:0 6px;font-weight:650}.changelog-trigger{cursor:pointer;font-size:inherit;color:var(--s-text-dim);border:0;border-bottom:1px solid var(--s-border-strong);background:0 0;margin-left:auto;padding:0}.changelog-trigger:hover{color:var(--s-accent);border-bottom-color:var(--s-accent)}.changelog-trigger:focus-visible{outline:2px solid var(--s-accent);outline-offset:2px;border-radius:2px}.version-tip dl{gap:0;margin:2px 0;display:grid}.version-tip dt{font-weight:600}.version-tip dt+dd+dt{margin-top:6px}.version-tip dd{color:var(--s-text-dim);margin:0}.changelog-dialog{width:min(640px,94vw);max-height:min(680px,92vh)}.changelog-body{padding:4px 18px 18px;overflow-y:auto}.changelog h3{border-bottom:1px solid var(--s-border);font-family:var(--font-display);font-size:var(--s-fs-lg);align-items:baseline;gap:10px;margin:18px 0 4px;padding-bottom:4px;font-weight:500;display:flex}.changelog h3.current:after{content:"This version";font-family:var(--font-sans);font-size:var(--s-fs-2xs);color:var(--s-accent)}.changelog h3 time{font-family:var(--font-sans);font-size:var(--s-fs-sm);color:var(--s-text-faint);font-weight:400}.changelog h4{font-size:var(--s-fs-2xs);text-transform:uppercase;letter-spacing:.08em;color:var(--s-text-faint);margin:10px 0 4px;font-weight:600}.changelog ul{color:var(--s-text-dim);line-height:1.6;font-size:var(--s-fs-md);margin:0;padding-left:18px}.changelog li+li{margin-top:3px}.changelog strong{color:var(--s-text);font-weight:600}.spacer{flex:1}.tz-drop{text-align:center;border:1.5px dashed var(--s-border-strong);border-radius:var(--s-radius-lg);color:var(--s-text-dim);justify-items:center;gap:8px;padding:34px 16px;transition:border-color .12s,background .12s;display:grid}.tz-drop[data-over]{border-color:var(--s-accent);background:color-mix(in oklab, var(--s-accent) 7%, transparent)}.tz-drop strong{color:var(--s-text);font-weight:600}.tz-paste{resize:vertical;min-height:140px;font-size:var(--s-fs-sm);line-height:1.55}.tz-file{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:20px;display:flex}.tz-file-name{flex:1;gap:1px;min-width:0;display:grid}.tz-file-name .mono{font-family:var(--font-mono);font-size:var(--s-fs-md);color:var(--s-text)}.tz-file-name .sub{color:var(--s-text-faint);font-size:var(--s-fs-sm)}.hint .mono{font-family:var(--font-mono);font-size:var(--s-fs-xs)}.tz-filters{flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:22px;display:flex}.tz-filters>input{flex:1;min-width:160px}.tz-add{flex-basis:100%;align-items:center;gap:6px;display:flex}.tz-add>input{flex:1;min-width:0}.tz-list{flex-direction:column;gap:2px;display:flex}.tz-row{border-radius:var(--s-radius-lg);border:1px solid #0000}.tz-row[data-open]{border-color:var(--s-border-strong);background:var(--s-bg-panel)}.tz-row-main{border-radius:var(--s-radius-lg);width:100%;min-width:0;color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;align-items:center;gap:10px;padding:6px 9px;display:flex}.tz-row-main:hover{background:var(--s-bg-hover)}.tz-row[data-open] .tz-row-main{border-end-end-radius:0;border-end-start-radius:0}.tz-row-main:focus-visible{outline:2px solid var(--s-accent);outline-offset:-2px}.tz-row-name{font-family:var(--font-mono);font-size:var(--s-fs-sm);color:var(--s-text);white-space:nowrap}.tz-row-value{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-family:var(--font-mono);font-size:var(--s-fs-xs);color:var(--s-text-faint);flex:1;overflow:hidden}.tz-row-meta{flex:none;align-items:center;gap:8px;display:flex}.tz-type{font-size:var(--s-fs-2xs);color:var(--s-text-faint);text-align:right;min-width:74px}.tz-thumb{border:1px solid var(--s-border-strong);border-radius:5px;flex:none;place-items:center;width:26px;height:26px;display:grid;overflow:hidden}.tz-thumb-plain{color:var(--s-text-dim);border-color:#0000;justify-items:start}.tz-thumb-glyph{color:var(--s-text-faint);font-size:var(--s-fs-md);border-color:#0000}.tz-thumb-text{color:var(--s-text);border-color:#0000;font-size:17px;line-height:1}.tz-thumb-bar{background:var(--s-accent);border-radius:2px;min-width:1px;height:6px;display:block}.tz-thumb-line{border-top:3px solid;width:100%;display:block}.tz-thumb-shadow{background:var(--s-bg-raised);border-color:#0000;overflow:visible}.tz-thumb-shadow>span{background:var(--s-bg-panel);border-radius:3px;width:16px;height:16px}.tz-editor{border-top:1px solid var(--s-border);gap:12px;padding:12px 14px 14px;display:grid}.tz-editor-head{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.tz-editor-id{font-size:var(--s-fs-xs);color:var(--s-text-faint)}.tz-inherit{margin:0}.tz-raw{gap:4px;display:grid}.tz-raw .row>input{flex:1;min-width:0}.tz-meta{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;display:grid}.tz-dash-sample{width:100%;height:16px;color:var(--s-text)}.tz-stack{gap:10px;min-width:0;display:grid}.tz-slot{gap:6px;min-width:0;display:grid}.tz-slot-head{align-items:center;gap:6px;min-height:26px;display:flex}.tz-slot-label{font-size:var(--s-fs-2xs);text-transform:uppercase;letter-spacing:.06em;color:var(--s-text-faint);font-weight:600}.tz-alias{gap:4px;display:grid}.tz-resolved{font-family:var(--font-mono);font-size:var(--s-fs-xs);color:var(--s-text-faint);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.tz-parts{grid-template-columns:minmax(0,1fr);gap:8px;display:grid}.tz-parts.two{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.tz-parts>.tz-slot,.tz-part{border:1px solid var(--s-border);border-radius:var(--s-radius);background:var(--s-bg-raised);padding:8px 10px}.tz-part{gap:6px;display:grid}.tz-part .tz-part-remove{justify-self:start}.tz-layer{border:1px solid var(--s-border);border-radius:var(--s-radius);background:var(--s-bg-raised);gap:8px;padding:10px;display:grid}.tz-layer .tz-parts>.tz-slot,.tz-layer .grid2>.tz-slot{background:var(--s-bg-panel);border:1px solid var(--s-border);border-radius:var(--s-radius);padding:8px 10px}.tz-layer .grid2{gap:8px}.tz-layer-head{align-items:center;gap:12px;display:flex}.tz-color{gap:4px;display:grid}.tz-color-top{align-items:flex-start;gap:12px;margin-bottom:8px;display:flex}.tz-color-top .swatch{border-radius:var(--s-radius)}.tz-color-fields{flex:1;gap:8px;min-width:0;display:grid}.tz-track .slider-track{background:var(--track);border:1px solid var(--s-border-strong);border-radius:5px;height:10px}.tz-track .slider-indicator{display:none}.tz-track .slider-thumb{background:#fff;width:15px;height:15px;box-shadow:0 0 0 1px #00000073,0 1px 3px #0006}.tz-track .slider-control{height:20px}.tz-dim-row{align-items:center;gap:10px;display:flex}.tz-dim-row .slider-row{flex:1;align-items:center;gap:10px;min-width:0;display:flex}.tz-dim-row .slider-row .slider{flex:1}.tz-unit{flex:none;width:90px}.tz-bar{background:var(--s-bg-input);border:1px solid var(--s-border);border-radius:3px;height:12px;overflow:hidden}.tz-bar>span{background:var(--s-accent);min-width:1px;height:100%;display:block}.tz-motion{background:var(--s-bg-input);border:1px solid var(--s-border);border-radius:9px;height:18px;position:relative}.tz-motion>span{background:var(--s-accent);border-radius:50%;width:10px;height:10px;animation-name:tz-slide;animation-iteration-count:infinite;animation-direction:alternate;animation-fill-mode:both;position:absolute;top:3px;left:3px}@keyframes tz-slide{0%{left:3px}to{left:calc(100% - 13px)}}.tz-bezier{flex-wrap:wrap;align-items:flex-start;gap:16px;display:flex}.tz-bezier-graph{background:var(--s-bg-input);border:1px solid var(--s-border);border-radius:var(--s-radius);touch-action:none;flex:none}.tz-bz-box{fill:var(--s-bg-panel);stroke:var(--s-border-strong);stroke-width:1px}.tz-bz-diag{stroke:var(--s-border-strong);stroke-dasharray:3 3}.tz-bz-arm{stroke:var(--s-text-faint);stroke-width:1.2px}.tz-bz-curve{fill:none;stroke:var(--s-accent);stroke-width:2.5px}.tz-bz-handle{fill:var(--s-text);stroke:var(--s-bg);stroke-width:2px;cursor:grab}.tz-bz-handle:hover,.tz-bz-handle[data-dragging]{fill:var(--s-accent)}.tz-bz-handle[data-dragging]{cursor:grabbing}.tz-weight{align-items:center;gap:14px;display:flex}.tz-aa{text-align:center;flex:none;width:56px;font-size:34px;line-height:1}.tz-type-sample{border:1px solid var(--s-border);border-radius:var(--s-radius);background:var(--s-bg-input);overflow-wrap:anywhere;margin:0;padding:12px 14px;font-size:20px;line-height:1.35}.tz-type-sample.lg{font-size:18px}.tz-font-list{gap:4px;margin:0;padding:0;list-style:none;display:grid}.tz-font-row{align-items:center;gap:4px;display:flex}.tz-font-row>input{flex:1;min-width:0}.tz-font-index{text-align:right;width:18px;font-size:var(--s-fs-xs);color:var(--s-text-faint);flex:none;margin-right:4px}.tz-stack .row>input{flex:1;min-width:0}.tz-link-img{object-fit:contain;border:1px solid var(--s-border);border-radius:var(--s-radius);background:repeating-conic-gradient(var(--s-border) 0% 25%, transparent 0% 50%) 0 0 / 12px 12px;justify-self:start;max-width:220px;max-height:120px;padding:8px}a.btn{text-decoration:none}.tz-strokes{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:6px;display:grid}.tz-stroke{cursor:pointer;border:1px solid var(--s-border);border-radius:var(--s-radius);background:var(--s-bg-input);color:var(--s-text-dim);font-size:var(--s-fs-sm);gap:8px;padding:10px 10px 8px;display:grid}.tz-stroke>span{width:100%;height:0;display:block}.tz-stroke:hover{border-color:var(--s-border-strong);color:var(--s-text)}.tz-stroke[aria-checked=true]{border-color:var(--s-accent);color:var(--s-text)}.tz-stroke:focus-visible{outline:2px solid var(--s-accent);outline-offset:1px}.tz-border-sample{border-radius:var(--s-radius);background:var(--s-bg-raised);height:56px}.tz-shadow-stage{border:1px solid var(--s-border);border-radius:var(--s-radius);background:#eef0f3;place-items:center;padding:26px;display:grid}.tz-shadow-sample{background:#fff;border-radius:8px;width:120px;height:64px}.tz-gradient-band{border-radius:var(--s-radius);border:1px solid var(--s-border);height:56px}.cc-top{align-items:flex-start;gap:14px;display:flex}.cc-top .swatch{border-radius:var(--s-radius-lg)}.cc-top-fields{flex:1;gap:4px;min-width:0;display:grid}.cc-top-fields .field{margin-bottom:4px}.cc-list{gap:6px;display:grid}.cc-row{grid-template-columns:150px minmax(0,1fr) 64px auto;align-items:center;gap:10px;display:grid}.cc-label{font-size:var(--s-fs-md);color:var(--s-text-dim);font-weight:500}.cc-flag{justify-content:flex-start;display:flex}.cc-flag.mono{font-family:var(--font-mono);font-size:var(--s-fs-sm);color:var(--s-text-faint)}.uc-ref{cursor:pointer}.tool-code{gap:8px;display:grid}.tool-code .code{max-height:min(46vh,480px)}.editor-sticky.tool-sticky{margin-top:0;padding-top:10px}.ct-sample{border-radius:var(--s-radius-lg);border:1px solid var(--s-border);font-family:var(--font-sans);margin-top:10px;padding:16px 18px}.ct-sample p{margin:0 0 8px;line-height:1.3}.ct-sample p:last-child{margin-bottom:0}.ct-scores{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px;display:grid}.ct-scores .card+.card{margin-top:0}.ct-score-head{font-size:var(--s-fs-2xs);text-transform:uppercase;letter-spacing:.06em;color:var(--s-text-faint);font-weight:600}.ct-score{font-family:var(--font-display);font-variant-numeric:tabular-nums;margin:2px 0 4px;font-size:30px;font-weight:300}.ct-tiers{margin-top:12px}.ct-tiers td:last-child{width:1%}.ct-fixes{grid-template-columns:1fr 1fr;gap:10px;display:grid}.ct-fixes .card+.card{margin-top:0}.ct-fix{align-content:start;gap:8px;display:grid}.ct-fix .mono{font-family:var(--font-mono);font-size:var(--s-fs-md)}.gm-list{gap:8px;display:grid}.gm-row{border:1px solid var(--s-border);border-radius:var(--s-radius-lg);background:var(--s-bg-panel);grid-template-columns:76px minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:8px 10px;display:grid}.gm-pair{border-radius:var(--s-radius);border:1px solid var(--s-border-strong);height:44px;display:flex;overflow:hidden}.gm-pair>span{flex:1}.gm-text{gap:2px;min-width:0;display:grid}.gm-text .mono{font-family:var(--font-mono);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.gm-stats{flex-direction:column;align-items:flex-end;gap:4px;display:flex}.gm-slice{width:100%;max-width:560px;height:auto;display:block}.gm-p3{fill:color-mix(in oklab, var(--s-accent) 12%, transparent);stroke:var(--s-accent);stroke-width:1px;stroke-dasharray:4 3}.gm-srgb{fill:color-mix(in oklab, var(--s-text) 10%, transparent);stroke:var(--s-text-dim);stroke-width:1.2px}.gm-axis{stroke:var(--s-border-strong)}.gm-tick,.gm-label,.gm-legend{font-family:var(--font-mono);fill:var(--s-text-faint);font-size:10px}.gm-label,.gm-legend-srgb{fill:var(--s-text-dim)}.gm-legend-p3{fill:var(--s-accent)}.gm-dot{stroke:var(--s-bg);stroke-width:2px}.gm-dot-original{fill:var(--s-text)}.gm-dot-clip{fill:var(--s-bad)}.gm-dot-srgb{fill:var(--s-good)}.gt-compare{grid-template-columns:200px minmax(0,1fr);align-items:center;gap:8px 12px;display:grid}.gt-stop{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr) auto;align-items:start;gap:12px;display:grid}.gt-stop>.btn{margin-top:24px}.ts-preview{border:1px solid var(--s-border);border-radius:var(--s-radius-lg);background:var(--s-bg-input);gap:4px;margin-bottom:14px;padding:12px 14px;display:grid;overflow:hidden}.ts-row{grid-template-columns:64px minmax(0,1fr);align-items:baseline;gap:12px;display:grid}.ts-meta{font-family:var(--font-mono);font-size:var(--s-fs-2xs);color:var(--s-text-faint);line-height:1.3}.ts-sample{white-space:nowrap;text-overflow:ellipsis;color:var(--s-text);overflow:hidden}.es-plot{background:var(--s-bg-input);border:1px solid var(--s-border);border-radius:var(--s-radius);width:100%;max-width:560px;height:auto;margin-top:4px;display:block}.es-axis{stroke:var(--s-border-strong)}.es-point{fill:var(--s-text)}.sh-stage{border-radius:var(--s-radius-lg);border:1px solid var(--s-border);grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:22px;padding:26px 22px;display:grid}.sh-card{height:72px;font-family:var(--font-mono);font-size:var(--s-fs-sm);color:#5b6472;border-radius:10px;place-items:center;display:grid}.cvd-grid{align-items:center;gap:6px 4px;display:grid}.cvd-swatch{border:1px solid var(--s-border);border-radius:4px;height:34px}.cvd-card{gap:10px;display:grid}.cvd-pairs{gap:6px;display:grid}.cvd-pair{align-items:center;gap:12px;display:flex}.cvd-pair .mono{font-family:var(--font-mono)}.cvd-duo{border:1px solid var(--s-border-strong);border-radius:4px;flex:none;display:flex;overflow:hidden}.cvd-duo>span{width:28px;height:24px}.pt-image{border-radius:var(--s-radius);object-fit:contain;max-width:100%;max-height:220px}.pt-bar{border-radius:var(--s-radius);border:1px solid var(--s-border);height:44px;margin-bottom:10px;display:flex;overflow:hidden}.pt-bar>button{cursor:pointer;border:0;min-width:8px;padding:0}.pt-bar>button:focus-visible{outline:2px solid var(--s-accent);outline-offset:-3px}.pt-swatches{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px;display:grid}.pt-swatch{cursor:pointer;text-align:left;border:1px solid var(--s-border);border-radius:var(--s-radius);background:var(--s-bg-input);color:var(--s-text);align-items:center;gap:8px;padding:5px 8px;display:flex}.pt-swatch:hover{border-color:var(--s-border-strong)}.pt-swatch[aria-pressed=true]{border-color:var(--s-accent)}.pt-swatch[data-off]{opacity:.5;border-style:dashed}.pt-swatch .mono{font-family:var(--font-mono);font-size:var(--s-fs-sm)}.pt-swatch .desc{margin-left:auto}.pt-harmonies{gap:8px;margin-bottom:12px;display:grid}.pt-harmony{grid-template-columns:170px minmax(0,1fr);align-items:center;gap:10px;display:grid}.pt-row{border-radius:var(--s-radius);border:1px solid var(--s-border);height:34px;display:flex;overflow:hidden}.pt-row>button{cursor:pointer;border:0;flex:1;padding:0}.pt-row>button:focus-visible{outline:2px solid var(--s-accent);outline-offset:-3px}.tf-input{border-radius:var(--s-radius)}.tf-input[data-over]{outline:2px dashed var(--s-accent);outline-offset:2px}.tf-text{min-height:220px}.pg-text{min-height:200px}.skill-list{gap:4px;display:grid}.skill-row{border-radius:var(--s-radius);border:1px solid #0000;align-items:flex-start;gap:10px;padding:8px 10px;display:flex}.skill-row:hover{background:var(--s-bg-hover)}.skill-row[data-selected=true]{background:var(--s-bg-raised);border-color:var(--s-border-strong)}.skill-row .inline-switch{margin-top:1px}.skill-row .inline-switch .switch-label{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.skill-main{min-width:0;color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;flex:1;gap:3px;padding:0;display:grid}.skill-main:focus-visible{outline:2px solid var(--s-accent);outline-offset:3px;border-radius:var(--s-radius)}.skill-head{flex-wrap:wrap;align-items:baseline;gap:8px;display:flex}.skill-head .name{font-weight:500}.skill-head .sub{color:var(--s-text-faint);font-family:var(--font-mono);font-size:var(--s-fs-sm)}.skill-desc{color:var(--s-text-dim);font-size:var(--s-fs-md);line-height:1.45}.skill-code .code{white-space:pre-wrap;max-height:min(60vh,640px)}.preview-bar{border-bottom:1px solid var(--s-border);min-width:0;font-size:var(--s-fs-sm);color:var(--s-text-dim);align-items:center;gap:6px;padding:0 8px 0 16px;display:flex}.preview-title{text-overflow:ellipsis;white-space:nowrap;flex:0 auto;min-width:0;margin-right:auto;overflow:hidden}.preview-title strong{color:var(--s-text);font-weight:550}.preview-bar .btn.sm{padding:5px 8px}.preview-bar .btn.sm[aria-label]{padding:5px}.preview-frame{background:#fff;border:0;width:100%;height:100%;display:block}@media (max-width:1180px){.body,.body.no-preview{grid-template-columns:var(--rail-w,188px) auto 1fr}.preview-pane,.body:not(.no-preview)>.splitter:nth-of-type(2){display:none}}@media (prefers-reduced-motion:reduce){*{transition-duration:1ms!important}::view-transition-group(*){animation:none!important}::view-transition-old(*){animation:none!important}::view-transition-new(*){animation:none!important}}
