.astro-route-announcer{position:absolute;left:0;top:0;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden;white-space:nowrap;width:1px;height:1px}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;color-scheme:light dark}body{margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.5}img,svg{display:block;max-width:100%}button,input,select,textarea{font:inherit;color:inherit}:root{--astroexample-spacing-md: 1rem;--astroexample-spacing-lg: 2rem;--astroexample-text-base: 1rem;--astroexample-text-heading: 1.75rem;--astroexample-radius: .5rem;--astroexample-bg: #1e1e1e;--astroexample-fg: #f8fafc;--astroexample-palette-0: #1e1e1e;--astroexample-palette-1: #2d6cdf;--astroexample-palette-2: #3aa676;--astroexample-palette-3: #d97706;--astroexample-palette-4: #9b5de5;--astroexample-palette-5: #e63946;--astroexample-palette-6: #1d3557;--astroexample-palette-7: #06b6d4;--astroexample-palette-8: #475569;--astroexample-palette-9: #94a3b8;--astroexample-palette-10: #cbd5e1;--astroexample-palette-11: #e2e8f0;--astroexample-palette-12: #f1f5f9;--astroexample-palette-13: #fef3c7;--astroexample-palette-14: #bbf7d0;--astroexample-palette-15: #f8fafc;--astroexample-color-primary: var(--astroexample-palette-1);--astroexample-color-accent: var(--astroexample-palette-3);--astroexample-color-surface: var(--astroexample-palette-0);--astroexample-color-muted: var(--astroexample-palette-8);--astroexample-color-danger: var(--astroexample-palette-5);--astroexample-vsp-2xs: .25rem;--astroexample-vsp-xs: .5rem;--astroexample-vsp-sm: .75rem;--astroexample-vsp-md: 1rem;--astroexample-vsp-lg: 1.75rem;--astroexample-vsp-xl: 2.5rem;--astroexample-vsp-2xl: 3.5rem;--astroexample-hsp-xs: .25rem;--astroexample-hsp-sm: .5rem;--astroexample-hsp-md: 1rem;--astroexample-hsp-lg: 1.5rem;--astroexample-hsp-xl: 2rem;--astroexample-text-h2: 1.75rem;--astroexample-text-h3: 1.35rem;--astroexample-text-h4: 1.1rem;--astroexample-text-body: 1rem;--astroexample-text-small: .875rem;--astroexample-text-micro: .75rem;--astroexample-leading-tight: 1.2;--astroexample-leading-snug: 1.45;--astroexample-leading-relaxed: 1.75;--astroexample-code-bg: hsl(220 13% 11%);--astroexample-code-fg: hsl(220 14% 86%);--astroexample-font-mono: ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, Consolas, monospace}body{background:var(--astroexample-bg);color:var(--astroexample-fg);font-size:var(--astroexample-text-base);padding:var(--astroexample-spacing-lg)}.astroexample-stack{display:flex;flex-direction:column;gap:var(--astroexample-spacing-lg);max-width:56rem;margin:0 auto}.astroexample-heading{font-size:var(--astroexample-text-heading);font-weight:700;margin:0 0 var(--astroexample-spacing-md);color:var(--astroexample-color-primary)}.astroexample-card{background:var(--astroexample-color-surface);color:var(--astroexample-fg);padding:var(--astroexample-spacing-md);border-radius:var(--astroexample-radius);border:1px solid var(--astroexample-color-muted)}.astroexample-card+.astroexample-card{margin-top:var(--astroexample-spacing-md)}.astroexample-button{display:inline-block;padding:var(--astroexample-spacing-md);border-radius:var(--astroexample-radius);background:var(--astroexample-color-accent);color:var(--astroexample-bg);border:none;cursor:pointer}.astroexample-button:hover{background:var(--astroexample-color-primary)}.astroexample-link{color:var(--astroexample-color-accent);text-decoration:underline}.astroexample-swatch-row{display:flex;flex-wrap:wrap;gap:var(--astroexample-spacing-md)}.astroexample-swatch{width:4rem;height:4rem;border-radius:var(--astroexample-radius);display:flex;align-items:end;justify-content:center;font-size:.75rem;color:var(--astroexample-fg);text-shadow:0 1px 2px rgba(0,0,0,.7);padding:.25rem}.astroexample-meta{font-size:.875rem;color:var(--astroexample-color-muted)}.astroexample-prose{max-width:48rem;margin:0 auto;padding:var(--astroexample-vsp-2xl) var(--astroexample-hsp-xl);font-size:var(--astroexample-text-body);line-height:var(--astroexample-leading-relaxed);color:var(--astroexample-fg)}.astroexample-prose>*+*{margin-block-start:var(--flow-space, var(--astroexample-vsp-md))}.astroexample-prose :where(h2){--flow-space: var(--astroexample-vsp-xl)}.astroexample-prose :where(h3){--flow-space: var(--astroexample-vsp-lg)}.astroexample-prose :where(h4){--flow-space: var(--astroexample-vsp-md)}.astroexample-prose :where(h2,h3,h4)+:where(p,ul,ol,table,pre,blockquote){--flow-space: var(--astroexample-vsp-sm)}.astroexample-prose :where(h2,h3,h4,h5,h6)+:where(h2,h3,h4,h5,h6){--flow-space: var(--astroexample-vsp-2xs)}.astroexample-prose>:first-child{margin-block-start:0}.astroexample-prose>:last-child{margin-block-end:0}.astroexample-prose :where(h2){font-size:var(--astroexample-text-h2);font-weight:700;line-height:var(--astroexample-leading-tight);padding-block-start:var(--astroexample-vsp-sm);border-top:3px solid transparent;border-image:linear-gradient(to right,var(--astroexample-fg),var(--astroexample-color-muted)) 1}.astroexample-prose :where(h3){font-size:var(--astroexample-text-h3);font-weight:600;line-height:var(--astroexample-leading-tight);padding-block-start:var(--astroexample-vsp-xs);border-top:2px solid transparent;border-image:linear-gradient(to right,var(--astroexample-fg),var(--astroexample-color-muted)) 1}.astroexample-prose :where(h4){font-size:var(--astroexample-text-h4);font-weight:600;line-height:var(--astroexample-leading-tight)}.astroexample-prose :where(p){font-size:var(--astroexample-text-body);line-height:var(--astroexample-leading-relaxed)}.astroexample-prose :where(ul,ol){padding-inline-start:var(--astroexample-hsp-lg);line-height:var(--astroexample-leading-snug)}.astroexample-prose :where(li+li){margin-block-start:var(--astroexample-vsp-xs)}.astroexample-prose :where(blockquote){border-inline-start:3px solid var(--astroexample-color-muted);padding-inline-start:var(--astroexample-hsp-md);color:var(--astroexample-color-muted);font-style:italic}.astroexample-prose :where(hr){border:none;border-top:1px solid var(--astroexample-color-muted);margin-block:var(--astroexample-vsp-lg)}.astroexample-prose :where(:not(pre)>code){font-family:var(--astroexample-font-mono);font-size:var(--astroexample-text-micro);background:var(--astroexample-code-bg);color:var(--astroexample-code-fg);padding:var(--astroexample-hsp-xs) var(--astroexample-hsp-sm);border-radius:.25rem}.astroexample-prose :where(pre){font-family:var(--astroexample-font-mono);font-size:var(--astroexample-text-small);background:var(--astroexample-code-bg);color:var(--astroexample-code-fg);padding:var(--astroexample-vsp-md) var(--astroexample-hsp-sm);border-radius:var(--astroexample-radius, .25rem);overflow-x:auto}.astroexample-prose :where(pre>code){font-family:inherit;font-size:inherit;background:transparent;color:inherit;padding:0}.astroexample-prose :where(table){width:100%;border-collapse:collapse;font-size:var(--astroexample-text-small)}.astroexample-prose :where(th,td){padding:var(--astroexample-hsp-xs) var(--astroexample-hsp-sm);border:1px solid var(--astroexample-color-muted);text-align:left}.astroexample-prose :where(th){font-weight:600;background:var(--astroexample-color-surface)}.astroexample-prose :where(a){color:var(--astroexample-color-accent);text-decoration:underline}.astroexample-prose :where(a:hover){color:var(--astroexample-color-primary)}.astroexample-prose :where(strong){font-weight:700}.astroexample-prose :where(em){font-style:italic}:where(.tokenpanel-shell,[data-design-token-panel-modal]){--tokentweak-color-fg: var(--color-fg, oklch(87% .01 60));--tokentweak-color-bg: var(--color-bg, oklch(18% .01 50));--tokentweak-color-muted: var(--color-muted, oklch(70% .01 60));--tokentweak-color-surface: var(--color-surface, oklch(22% .01 50));--tokentweak-color-accent: var(--color-accent, oklch(65% .2 45));--tokentweak-color-accent-hover: var(--color-accent-hover, oklch(55% .18 45));--tokentweak-color-code-bg: var(--color-code-bg, oklch(17% .005 50));--tokentweak-color-code-fg: var(--color-code-fg, oklch(87% .01 60));--tokentweak-color-success: var(--color-success, oklch(65% .19 145));--tokentweak-color-danger: var(--color-danger, oklch(60% .2 10));--tokentweak-color-warning: var(--color-warning, oklch(75% .17 75));--tokentweak-font-mono: var( --font-mono, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace );--tokentweak-pad-2xs: .125rem;--tokentweak-pad-xs: .375rem;--tokentweak-pad-sm: .5rem;--tokentweak-pad-md: .75rem;--tokentweak-pad-lg: 1rem;--tokentweak-pad-xl: 1.5rem;--tokentweak-pad-2xl: 2rem;--tokentweak-gap-2xs: .4375rem;--tokentweak-gap-xs: .875rem;--tokentweak-gap-sm: 1.25rem;--tokentweak-gap-md: 1.5rem;--tokentweak-gap-lg: 1.75rem;--tokentweak-gap-xl: 2.5rem;--tokentweak-gap-2xl: 3.5rem;--tokentweak-text-micro: .75rem;--tokentweak-text-caption: .875rem;--tokentweak-text-small: 1rem;--tokentweak-text-body: 1.2rem;--tokentweak-text-subheading: 1.4rem;--tokentweak-text-heading: 3rem;--tokentweak-text-display: 3.75rem;--radius-tokentweak: .25rem}.tokenpanel-shell{z-index:50;display:flex;flex-direction:column;border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-surface);border-radius:var(--radius-tokentweak);box-shadow:0 4px 24px #00000040}.tokenpanel-header{display:flex;align-items:center;gap:var(--tokentweak-pad-md);padding-inline:var(--tokentweak-pad-xl);padding-block:var(--tokentweak-gap-xs);border-bottom:1px solid var(--tokentweak-color-muted);flex-shrink:0}.tokenpanel-title{color:var(--tokentweak-color-fg);font-weight:600;font-size:.875rem;flex-shrink:0}.tokenpanel-action-link{color:var(--tokentweak-color-accent);font-size:.75rem;background:none;border:none;padding:0;cursor:pointer;transition:color .15s ease}.tokenpanel-action-link:hover{color:var(--tokentweak-color-accent-hover)}.tokenpanel-spacer{flex:1}.tokenpanel-close-btn{color:var(--tokentweak-color-muted);background:none;border:none;padding:0;cursor:pointer;flex-shrink:0;transition:color .15s ease;display:inline-flex;align-items:center;justify-content:center}.tokenpanel-close-btn:hover{color:var(--tokentweak-color-fg)}.tokenpanel-tabbar{display:flex;align-items:center;gap:2px;border-bottom:1px solid var(--tokentweak-color-muted);padding-inline:var(--tokentweak-pad-xl);flex-shrink:0}.tokenpanel-tab-button{border:none;background:none;padding-inline:var(--tokentweak-pad-md);padding-block:var(--tokentweak-gap-xs);font-size:.875rem;cursor:pointer;border-bottom:2px solid transparent;color:var(--tokentweak-color-muted);transition:color .15s ease,border-color .15s ease}.tokenpanel-tab-button:hover,.tokenpanel-tab-button:focus-visible{color:var(--tokentweak-color-fg);text-decoration:underline}.tokenpanel-tab-button.is-active{color:var(--tokentweak-color-fg);border-bottom-color:var(--tokentweak-color-accent);text-decoration:none}.tokenpanel-body{flex:1;min-height:0;overflow-y:auto;padding-inline:var(--tokentweak-pad-xl);padding-block:var(--tokentweak-gap-sm)}.tokenpanel-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:12rem;padding-block:var(--tokentweak-gap-md);padding-inline:var(--tokentweak-pad-xl)}.tokenpanel-empty-state-text{color:var(--tokentweak-color-muted, oklch(70% .01 60));font-size:.8125rem;line-height:1.5;max-width:32rem;margin:0}.tokenpanel-empty-state-text code{font-family:var(--tokentweak-font-mono, Menlo, Monaco, Consolas, monospace);font-size:.8125rem;color:var(--tokentweak-color-fg)}.tokenpanel-empty-state-link{color:var(--tokentweak-color-accent);text-decoration:underline;transition:color .15s ease}.tokenpanel-empty-state-link:hover,.tokenpanel-empty-state-link:focus-visible{color:var(--tokentweak-color-accent-hover)}.tokenpanel-tab-content{display:flex;flex-direction:column;gap:var(--tokentweak-gap-sm)}.tokenpanel-tab-actions{display:flex;align-items:center;gap:var(--tokentweak-pad-md)}.tokenpanel-tab-section{flex-shrink:0}.tokenpanel-tab-section-heading{color:var(--tokentweak-color-muted);font-weight:600;margin-bottom:var(--tokentweak-gap-2xs);font-size:.8125rem;text-transform:uppercase;letter-spacing:.05em}.tokenpanel-tab-section-heading--color{font-size:1rem}.tokenpanel-tab-grid{display:grid;grid-template-columns:1fr;gap:var(--tokentweak-gap-xs)}@media(min-width:640px){.tokenpanel-tab-grid{grid-template-columns:1fr 1fr}}.tokenpanel-tab-advanced{flex-shrink:0}.tokenpanel-tab-advanced-summary{color:var(--tokentweak-color-muted);font-weight:600;cursor:pointer;-webkit-user-select:none;user-select:none;font-size:.8125rem;text-transform:uppercase;letter-spacing:.05em}.tokenpanel-tab-advanced-grid{display:grid;grid-template-columns:1fr;gap:var(--tokentweak-gap-xs);margin-top:var(--tokentweak-gap-2xs)}@media(min-width:640px){.tokenpanel-tab-advanced-grid{grid-template-columns:1fr 1fr}}.tokenpanel-color-preset-select{background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);border:1px solid var(--tokentweak-color-muted);padding-inline:var(--tokentweak-pad-sm);padding-block:2px;font-size:.75rem;border-radius:var(--radius-tokentweak);max-width:14rem;cursor:pointer;transition:border-color .15s ease}.tokenpanel-color-preset-select:hover{border-color:var(--tokentweak-color-fg)}.tokenpanel-color-palette-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:var(--tokentweak-pad-sm)}.tokenpanel-color-palette-grid--secondary{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--tokentweak-pad-sm)}@media(min-width:768px){.tokenpanel-color-palette-grid--secondary{grid-template-columns:repeat(9,minmax(0,1fr))}}.tokenpanel-color-base-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}.tokenpanel-color-swatch-wrap{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0;width:100%}.tokenpanel-color-swatch-button{display:block;border:1px solid var(--tokentweak-color-muted);cursor:pointer;width:3.5rem;height:3.5rem;border-radius:var(--radius-tokentweak);background:none;padding:0;transition:border-color .15s ease}.tokenpanel-color-swatch-button:hover{border-color:var(--tokentweak-color-fg)}.tokenpanel-color-swatch-label{color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);-webkit-user-select:none;user-select:none;font-size:.6875rem;line-height:1.1;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-popover{border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-surface);padding:12px;border-radius:var(--radius-tokentweak);box-shadow:0 4px 12px #0000004d}.tokenpanel-hsl-header{display:flex;align-items:center;gap:10px;margin-bottom:10px}.tokenpanel-hsl-preview{flex-shrink:0;border:1px solid var(--tokentweak-color-muted);width:3.5rem;height:3.5rem;border-radius:var(--radius-tokentweak)}.tokenpanel-hsl-hex-input{background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);border:1px solid var(--tokentweak-color-muted);padding-inline:6px;padding-block:4px;font-family:var(--tokentweak-font-mono);font-size:1rem;width:8rem;border-radius:var(--radius-tokentweak)}.tokenpanel-hsl-row{display:flex;align-items:center;gap:8px;margin-bottom:6px}.tokenpanel-hsl-row-label{color:var(--tokentweak-color-muted);flex-shrink:0;font-size:.875rem;width:1rem}.tokenpanel-hsl-row-slider{flex:1;height:1.5rem;accent-color:var(--tokentweak-color-accent)}.tokenpanel-hsl-row-value{color:var(--tokentweak-color-fg);flex-shrink:0;text-align:right;font-size:.875rem;width:2.5rem}.tokenpanel-palette-selector{position:relative;width:100%}.tokenpanel-palette-trigger{display:flex;align-items:center;gap:4px;width:100%;border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-surface);padding-inline:6px;padding-block:4px;font-size:.75rem;border-radius:var(--radius-tokentweak);cursor:pointer;transition:border-color .15s ease}.tokenpanel-palette-trigger:hover{border-color:var(--tokentweak-color-fg)}.tokenpanel-palette-trigger-label{flex:1;min-width:0;text-align:left;color:var(--tokentweak-color-fg);font-family:var(--tokentweak-font-mono);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-palette-trigger-color{flex-shrink:0;border:1px solid var(--tokentweak-color-muted);width:14px;height:14px;border-radius:2px}.tokenpanel-palette-trigger-value{flex-shrink:0;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);width:2.5em}.tokenpanel-palette-trigger-icon{color:var(--tokentweak-color-muted);flex-shrink:0}.tokenpanel-palette-options{border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-surface);padding:10px;border-radius:var(--radius-tokentweak);box-shadow:0 4px 12px #0000004d}.tokenpanel-palette-options-extras{display:flex;gap:6px;margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid var(--tokentweak-color-muted)}.tokenpanel-palette-extra-option{display:flex;align-items:center;gap:6px;padding-inline:8px;padding-block:4px;border-radius:4px;font-size:1rem;background:none;border:none;cursor:pointer;transition:background-color .15s ease}.tokenpanel-palette-extra-option:hover{background-color:rgb(from var(--tokentweak-color-fg) r g b / .1)}.tokenpanel-palette-extra-option.is-selected{background-color:rgb(from var(--tokentweak-color-accent) r g b / .2)}.tokenpanel-palette-extra-color{width:1.75rem;height:1.75rem;border-radius:3px;border:1px solid var(--tokentweak-color-muted)}.tokenpanel-palette-extra-label{color:var(--tokentweak-color-fg)}.tokenpanel-palette-options-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:5px}.tokenpanel-palette-option-button{width:3rem;height:3rem;border-radius:3px;border:1px solid var(--tokentweak-color-muted);cursor:pointer;padding:0;transition:box-shadow .15s ease}.tokenpanel-palette-option-button:hover{box-shadow:0 0 0 2px var(--tokentweak-color-fg)}.tokenpanel-palette-option-button.is-selected{box-shadow:0 0 0 2px var(--tokentweak-color-accent)}.tokenpanel-row{display:flex;align-items:center;gap:var(--tokentweak-pad-sm)}.tokenpanel-row--stacked{display:flex;flex-direction:column;gap:2px}.tokenpanel-row--column{display:flex;flex-direction:column;gap:4px}.tokenpanel-row-head{display:flex;align-items:center;gap:var(--tokentweak-pad-sm)}.tokenpanel-row-label{color:var(--tokentweak-color-fg);font-family:var(--tokentweak-font-mono);flex:1;min-width:0;font-size:.8125rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-row-label--narrow{flex:0 0 auto;max-width:12rem}.tokenpanel-row-input-group{display:flex;align-items:center;gap:4px;flex-shrink:0}.tokenpanel-row-number-input{background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);border:1px solid var(--tokentweak-color-muted);padding-inline:6px;padding-block:2px;font-family:var(--tokentweak-font-mono);text-align:right;font-size:.75rem;width:5rem;border-radius:var(--radius-tokentweak)}.tokenpanel-row-number-input:disabled{opacity:.6}.tokenpanel-row-unit{color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);-webkit-user-select:none;user-select:none;font-size:.75rem;width:2rem}.tokenpanel-row-slider{width:100%;height:1.25rem;accent-color:var(--tokentweak-color-accent)}.tokenpanel-row-slider:disabled{opacity:.5}.tokenpanel-row-select{background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);border:1px solid var(--tokentweak-color-muted);padding-inline:6px;padding-block:2px;font-family:var(--tokentweak-font-mono);font-size:.75rem;width:7rem;border-radius:var(--radius-tokentweak)}.tokenpanel-row-select:disabled{opacity:.6}.tokenpanel-row-text-input{background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);border:1px solid var(--tokentweak-color-muted);padding-inline:6px;padding-block:2px;font-family:var(--tokentweak-font-mono);font-size:.75rem;flex:1;min-width:0;border-radius:var(--radius-tokentweak)}.tokenpanel-row-text-input:disabled{opacity:.6}.tokenpanel-pill-toggle{display:flex;align-items:center;gap:var(--tokentweak-pad-xs);flex-shrink:0;cursor:pointer}.tokenpanel-pill-toggle-checkbox{accent-color:var(--tokentweak-color-accent)}.tokenpanel-pill-toggle-text{color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:.75rem}[data-design-token-panel-modal]{margin-inline:auto;width:100%;max-width:46rem;max-height:80vh;overflow-y:auto;border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);padding:var(--tokentweak-pad-xl);position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);-webkit-user-select:text;user-select:text}[data-design-token-panel-modal]::backdrop{background-color:rgb(from var(--tokentweak-color-bg) r g b / .8)}[data-design-token-panel-modal] [class*=__header]{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--tokentweak-pad-md);margin-bottom:var(--tokentweak-gap-sm)}[data-design-token-panel-modal] [class*=__title]{font-size:var(--tokentweak-text-subheading);font-weight:700;color:var(--tokentweak-color-fg)}[data-design-token-panel-modal] [class*=__hint]{font-size:var(--tokentweak-text-small);color:var(--tokentweak-color-muted);margin-bottom:var(--tokentweak-gap-xs)}[data-design-token-panel-modal] [class*=__section-heading]{font-size:var(--tokentweak-text-small);font-weight:700;color:var(--tokentweak-color-fg);margin-top:var(--tokentweak-gap-sm);margin-bottom:var(--tokentweak-gap-2xs)}[data-design-token-panel-modal] [class*=__list]:not([class*=__list-item]){overflow-x:auto;border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-code-bg);color:var(--tokentweak-color-code-fg);padding:var(--tokentweak-pad-sm);font-size:var(--tokentweak-text-small);margin-bottom:var(--tokentweak-gap-xs)}[data-design-token-panel-modal] [class*=__list-item]{font-family:var(--tokentweak-font-mono)}[data-design-token-panel-modal] [class*=__actions]{display:flex;align-items:center;gap:var(--tokentweak-pad-md);margin-top:var(--tokentweak-gap-md)}[data-design-token-panel-modal] [class*=__toggle]{display:inline-flex;align-items:center;gap:var(--tokentweak-pad-xs);font-size:var(--tokentweak-text-small);color:var(--tokentweak-color-fg);cursor:pointer;margin-bottom:var(--tokentweak-gap-xs)}[data-design-token-panel-modal] [class*=__textarea]{width:100%;min-height:12rem;border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-code-bg);color:var(--tokentweak-color-code-fg);padding:var(--tokentweak-pad-sm);font-family:var(--tokentweak-font-mono);font-size:var(--tokentweak-text-small);resize:vertical;margin-bottom:var(--tokentweak-gap-xs)}[data-design-token-panel-modal] [class*=__json]{overflow-x:auto;border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-code-bg);color:var(--tokentweak-color-code-fg);padding:var(--tokentweak-pad-sm);font-size:var(--tokentweak-text-small)}[data-design-token-panel-modal] [class*=__status]{font-size:var(--tokentweak-text-small);margin-bottom:var(--tokentweak-gap-xs)}[data-design-token-panel-modal] [class*=__status--info]{color:var(--tokentweak-color-success)}[data-design-token-panel-modal] [class*=__status--error]{color:var(--tokentweak-color-danger)}[data-design-token-panel-modal] [class*=__status--warning]{color:var(--tokentweak-color-warning)}[data-design-token-panel-modal] [class*=__status--success]{color:var(--tokentweak-color-success)}[data-design-token-panel-modal] [class*=__applying]{display:flex;align-items:center;gap:var(--tokentweak-pad-sm);border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-code-bg);color:var(--tokentweak-color-muted);padding:var(--tokentweak-pad-sm);font-size:var(--tokentweak-text-small)}[data-design-token-panel-modal] [class*=__spinner]{display:inline-block;width:1rem;height:1rem;border:2px solid var(--tokentweak-color-muted);border-top-color:var(--tokentweak-color-fg);border-radius:50%;animation:design-token-panel-modal-spin .75s linear infinite}@keyframes design-token-panel-modal-spin{to{transform:rotate(360deg)}}[data-design-token-panel-modal] [class*=__revert-hint]{font-size:var(--tokentweak-text-small);font-style:italic;color:var(--tokentweak-color-muted);margin-top:var(--tokentweak-gap-sm);margin-bottom:var(--tokentweak-gap-2xs)}[data-design-token-panel-modal] [class*=__button]{border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-muted);padding-inline:var(--tokentweak-pad-lg);padding-block:var(--tokentweak-gap-2xs);font-size:var(--tokentweak-text-small);cursor:pointer;transition:color .15s ease,border-color .15s ease,background-color .15s ease}[data-design-token-panel-modal] [class*=__button]:hover,[data-design-token-panel-modal] [class*=__button]:focus-visible{color:var(--tokentweak-color-fg);border-color:var(--tokentweak-color-fg)}[data-design-token-panel-modal] [class*=__button]:disabled{cursor:not-allowed;opacity:.5}[data-design-token-panel-modal] [class*=__button--primary]{border-color:var(--tokentweak-color-accent);background-color:var(--tokentweak-color-accent);color:var(--tokentweak-color-bg)}[data-design-token-panel-modal] [class*=__button--primary]:hover,[data-design-token-panel-modal] [class*=__button--primary]:focus-visible{border-color:var(--tokentweak-color-accent-hover);background-color:var(--tokentweak-color-accent-hover);color:var(--tokentweak-color-bg)}[data-design-token-panel-modal] [class*=__close-button]{border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-muted);padding-inline:var(--tokentweak-pad-sm);padding-block:var(--tokentweak-gap-2xs);font-size:var(--tokentweak-text-small);cursor:pointer;transition:color .15s ease,border-color .15s ease}[data-design-token-panel-modal] [class*=__close-button]:hover,[data-design-token-panel-modal] [class*=__close-button]:focus-visible{color:var(--tokentweak-color-fg);border-color:var(--tokentweak-color-fg)}