diff --git a/integrations/bricks/admin-app/src/components/SaveBar.svelte b/integrations/bricks/admin-app/src/components/SaveBar.svelte
index af9b633a..17693d23 100644
--- a/integrations/bricks/admin-app/src/components/SaveBar.svelte
+++ b/integrations/bricks/admin-app/src/components/SaveBar.svelte
@@ -9,6 +9,7 @@
    */
   import { tokens, ui, meta, clearSection } from '../lib/stores.svelte.js';
   import * as api from '../lib/api.js';
+  import { generateExportCSS, hasOverrides } from '../lib/export.js';
 
   /**
    * Persist the active tab's tokens via the REST controller. Replaces
@@ -72,6 +73,27 @@
       return () => clearTimeout(t);
     }
   });
+
+  /** Whether any overrides exist (enables the Export button). */
+  const canExport = $derived(hasOverrides(tokens));
+
+  /**
+   * Generate CSS from current token overrides and trigger a file download.
+   * Creates a Blob URL, clicks a temporary anchor element, then revokes.
+   */
+  function downloadCSS() {
+    const css = generateExportCSS(tokens);
+    if (!css) return;
+    const blob = new Blob([css], { type: 'text/css' });
+    const url = URL.createObjectURL(blob);
+    const a = document.createElement('a');
+    a.href = url;
+    a.download = 'slashed-custom.css';
+    document.body.appendChild(a);
+    a.click();
+    document.body.removeChild(a);
+    URL.revokeObjectURL(url);
+  }
 </script>
 
 <div class="bar" class:dirty={ui.dirty}>
@@ -92,6 +114,9 @@
     <button type="button" class="bar__reset" onclick={reset} disabled={ui.saving}>
       Reset section
     </button>
+    <button type="button" class="bar__export" onclick={downloadCSS} disabled={!canExport}>
+      Export CSS
+    </button>
     <button
       type="button"
       class="bar__save"
@@ -150,6 +175,19 @@
     border-color: #d63638;
     color: #d63638;
   }
+  .bar__export {
+    padding: 6px 14px;
+    border-radius: 3px;
+    border: 1px solid #2271b1;
+    background: white;
+    color: #2271b1;
+    cursor: pointer;
+    font-size: 13px;
+  }
+  .bar__export:disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
 
   /* Collapse the sidebar offset on small screens (folded WP admin). */
   @media (max-width: 782px) {
diff --git a/integrations/bricks/admin-app/src/lib/export.js b/integrations/bricks/admin-app/src/lib/export.js
new file mode 100644
index 00000000..bdd9edfd
--- /dev/null
+++ b/integrations/bricks/admin-app/src/lib/export.js
@@ -0,0 +1,374 @@
+/**
+ * CSS export generator for SLASHED design tokens.
+ *
+ * Client-side mirror of class-css-generator.php. Reads the reactive
+ * `tokens` store and produces a standalone CSS string wrapped in
+ * @layer slashed.overrides { :root { ... } } containing only non-empty
+ * customized values.
+ *
+ * Used by SaveBar to offer an "Export CSS" download so users can ship
+ * their overrides without a WordPress runtime dependency.
+ */
+
+/** Viewport min width in rem for fluid type calculations. */
+const VIEWPORT_MIN = 22.5;
+
+/** Viewport max width in rem for fluid type calculations. */
+const VIEWPORT_MAX = 95;
+
+/**
+ * Build a clamp() expression for fluid type scaling.
+ *
+ * @param {number} min Minimum size in rem.
+ * @param {number} max Maximum size in rem.
+ * @returns {string|null} The clamp() expression or null on invalid input.
+ */
+function buildClamp(min, max) {
+  if (min <= 0 || max <= 0) return null;
+  const range = VIEWPORT_MAX - VIEWPORT_MIN;
+  const slope = (max - min) / range;
+  const slopeRounded = parseFloat(slope.toFixed(6));
+  const minRounded = parseFloat(min.toFixed(4));
+  const maxRounded = parseFloat(max.toFixed(4));
+  return `clamp(${minRounded}rem, calc(${slopeRounded} * (100vw - ${VIEWPORT_MIN}rem) + ${minRounded}rem), ${maxRounded}rem)`;
+}
+
+/**
+ * Locale-safe float formatter. Trims trailing zeros.
+ *
+ * @param {string|number} value Raw numeric input.
+ * @returns {string}
+ */
+function formatFloat(value) {
+  const num = parseFloat(value);
+  if (isNaN(num)) return '0';
+  // Up to 6 decimals, trim trailing zeros and dot.
+  let out = num.toFixed(6).replace(/0+$/, '').replace(/\.$/, '');
+  return out === '' ? '0' : out;
+}
+
+/**
+ * Check if a value is non-empty.
+ *
+ * @param {*} v
+ * @returns {boolean}
+ */
+function hasValue(v) {
+  return v !== undefined && v !== null && v !== '';
+}
+
+/**
+ * Generate CSS declarations for color tokens.
+ *
+ * @param {Object} settings Color section settings.
+ * @returns {string[]} CSS declaration strings.
+ */
+function generateColorDeclarations(settings) {
+  const declarations = [];
+
+  // Brand colors (light): brand_primary -> --sf-color-primary-light.
+  const brandColors = ['primary', 'secondary', 'tertiary', 'action', 'neutral', 'base'];
+  for (const color of brandColors) {
+    const key = `brand_${color}`;
+    if (hasValue(settings[key])) {
+      declarations.push(`--sf-color-${color}-light: ${settings[key]};`);
+    }
+  }
+
+  // Brand colors (dark): brand_dark_primary -> --sf-color-primary-dark.
+  for (const color of brandColors) {
+    const key = `brand_dark_${color}`;
+    if (hasValue(settings[key])) {
+      declarations.push(`--sf-color-${color}-dark: ${settings[key]};`);
+    }
+  }
+
+  // Status colors (light): status_success -> --sf-color-success-light.
+  const statusColors = ['success', 'warning', 'error', 'info', 'danger'];
+  for (const color of statusColors) {
+    const key = `status_${color}`;
+    if (hasValue(settings[key])) {
+      declarations.push(`--sf-color-${color}-light: ${settings[key]};`);
+    }
+  }
+
+  // Status colors (dark): status_dark_success -> --sf-color-success-dark.
+  for (const color of statusColors) {
+    const key = `status_dark_${color}`;
+    if (hasValue(settings[key])) {
+      declarations.push(`--sf-color-${color}-dark: ${settings[key]};`);
+    }
+  }
+
+  return declarations;
+}
+
+/**
+ * Generate CSS declarations for typography tokens.
+ *
+ * @param {Object} settings Typography section settings.
+ * @returns {string[]} CSS declaration strings.
+ */
+function generateTypographyDeclarations(settings) {
+  const declarations = [];
+
+  // Font families: font_body -> --sf-font-body.
+  const fontStacks = ['body', 'heading', 'mono', 'display', 'humanist', 'geometric', 'slab'];
+  for (const name of fontStacks) {
+    const key = `font_${name}`;
+    if (hasValue(settings[key])) {
+      declarations.push(`--sf-font-${name}: ${settings[key]};`);
+    }
+  }
+
+  // Scale multipliers.
+  if (hasValue(settings.text_scale)) {
+    declarations.push(`--sf-text-scale: ${settings.text_scale};`);
+  }
+  if (hasValue(settings.text_display_scale)) {
+    declarations.push(`--sf-text-display-scale: ${settings.text_display_scale};`);
+  }
+
+  // Font sizes: size_X_min + size_X_max -> --sf-text-X with clamp().
+  const sizes = ['2xs', 'xs', 's', 'm', 'l', 'xl', '2xl', '3xl', '4xl', 'display-s', 'display-m', 'display-l'];
+  for (const size of sizes) {
+    const minKey = `size_${size}_min`;
+    const maxKey = `size_${size}_max`;
+    const minVal = settings[minKey];
+    const maxVal = settings[maxKey];
+    if (hasValue(minVal) && hasValue(maxVal)) {
+      const clamp = buildClamp(parseFloat(minVal), parseFloat(maxVal));
+      if (clamp) {
+        declarations.push(`--sf-text-${size}: ${clamp};`);
+      }
+    }
+  }
+
+  return declarations;
+}
+
+/**
+ * Generate CSS declarations for spacing tokens.
+ *
+ * @param {Object} settings Spacing section settings.
+ * @returns {string[]} CSS declaration strings.
+ */
+function generateSpacingDeclarations(settings) {
+  const declarations = [];
+
+  if (hasValue(settings.space_scale)) {
+    declarations.push(`--sf-space-scale: ${settings.space_scale};`);
+  }
+
+  const aliases = {
+    gutter: '--sf-space-gutter',
+    gap: '--sf-gap',
+    content_gap: '--sf-content-gap',
+    component_pad: '--sf-component-pad',
+    section_pad: '--sf-section-pad',
+  };
+
+  for (const [key, property] of Object.entries(aliases)) {
+    if (hasValue(settings[key])) {
+      declarations.push(`${property}: ${settings[key]};`);
+    }
+  }
+
+  return declarations;
+}
+
+/**
+ * Generate CSS declarations for radius tokens.
+ *
+ * @param {Object} settings Radius section settings.
+ * @returns {string[]} CSS declaration strings.
+ */
+function generateRadiusDeclarations(settings) {
+  const declarations = [];
+
+  if (hasValue(settings.radius_scale)) {
+    declarations.push(`--sf-radius-scale: ${settings.radius_scale};`);
+  }
+
+  return declarations;
+}
+
+/**
+ * Generate CSS declarations for shadow tokens.
+ *
+ * @param {Object} settings Shadows section settings.
+ * @returns {string[]} CSS declaration strings.
+ */
+function generateShadowDeclarations(settings) {
+  const declarations = [];
+
+  if (hasValue(settings.shadow_strength)) {
+    declarations.push(`--sf-shadow-strength: calc(${settings.shadow_strength} + var(--sf-is-dark) * 0.17);`);
+  }
+
+  return declarations;
+}
+
+/**
+ * Generate CSS declarations for motion tokens.
+ *
+ * @param {Object} settings Motion section settings.
+ * @returns {string[]} CSS declaration strings.
+ */
+function generateMotionDeclarations(settings) {
+  const declarations = [];
+
+  if (hasValue(settings.motion_scale)) {
+    declarations.push(`--sf-motion-scale: ${settings.motion_scale};`);
+  }
+
+  // Duration values: duration_instant -> --sf-duration-instant: calc(Xms * var(--sf-motion-scale));
+  const durations = ['instant', 'fast', 'normal', 'slow', 'slower'];
+  for (const name of durations) {
+    const key = `duration_${name}`;
+    if (hasValue(settings[key])) {
+      declarations.push(`--sf-duration-${name}: calc(${settings[key]}ms * var(--sf-motion-scale));`);
+    }
+  }
+
+  return declarations;
+}
+
+/**
+ * Generate CSS declarations for z-index tokens.
+ *
+ * @param {Object} settings Z-index section settings.
+ * @returns {string[]} CSS declaration strings.
+ */
+function generateZindexDeclarations(settings) {
+  const declarations = [];
+
+  const levels = ['below', 'base', 'raised', 'low', 'mid', 'high', 'top', 'max'];
+  for (const name of levels) {
+    if (hasValue(settings[name])) {
+      declarations.push(`--sf-z-${name}: ${parseInt(settings[name], 10)};`);
+    }
+  }
+
+  return declarations;
+}
+
+/**
+ * Generate CSS declarations for contrast tokens.
+ *
+ * @param {Object} settings Contrast section settings.
+ * @returns {string[]} CSS declaration strings.
+ */
+function generateContrastDeclarations(settings) {
+  const declarations = [];
+
+  // Plain unitless numerics.
+  const numerics = {
+    contrast_bias: '--sf-contrast-bias',
+    contrast_threshold: '--sf-contrast-threshold',
+    opacity_disabled: '--sf-opacity-disabled',
+  };
+  for (const [key, property] of Object.entries(numerics)) {
+    if (hasValue(settings[key])) {
+      declarations.push(`${property}: ${formatFloat(settings[key])};`);
+    }
+  }
+
+  // Pixel-typed focus ring metrics.
+  const pixelMetrics = {
+    focus_ring_width: '--sf-focus-ring-width',
+    focus_ring_offset: '--sf-focus-ring-offset',
+  };
+  for (const [key, property] of Object.entries(pixelMetrics)) {
+    if (hasValue(settings[key])) {
+      declarations.push(`${property}: ${formatFloat(settings[key])}px;`);
+    }
+  }
+
+  // Focus ring style: restricted enum.
+  if (hasValue(settings.focus_ring_style)) {
+    const allowed = ['solid', 'dashed', 'dotted', 'double', 'none'];
+    if (allowed.includes(settings.focus_ring_style)) {
+      declarations.push(`--sf-focus-ring-style: ${settings.focus_ring_style};`);
+    }
+  }
+
+  return declarations;
+}
+
+/**
+ * Generate the full CSS export string from all token sections.
+ *
+ * @param {Object} allTokens The full tokens store object (keyed by section).
+ * @returns {string} CSS output or empty string if no overrides.
+ */
+export function generateExportCSS(allTokens) {
+  const declarations = [];
+
+  if (allTokens.colors && typeof allTokens.colors === 'object') {
+    declarations.push(...generateColorDeclarations(allTokens.colors));
+  }
+
+  if (allTokens.typography && typeof allTokens.typography === 'object') {
+    declarations.push(...generateTypographyDeclarations(allTokens.typography));
+  }
+
+  if (allTokens.spacing && typeof allTokens.spacing === 'object') {
+    declarations.push(...generateSpacingDeclarations(allTokens.spacing));
+  }
+
+  if (allTokens.radius && typeof allTokens.radius === 'object') {
+    declarations.push(...generateRadiusDeclarations(allTokens.radius));
+  }
+
+  if (allTokens.shadows && typeof allTokens.shadows === 'object') {
+    declarations.push(...generateShadowDeclarations(allTokens.shadows));
+  }
+
+  if (allTokens.motion && typeof allTokens.motion === 'object') {
+    declarations.push(...generateMotionDeclarations(allTokens.motion));
+  }
+
+  if (allTokens.zindex && typeof allTokens.zindex === 'object') {
+    declarations.push(...generateZindexDeclarations(allTokens.zindex));
+  }
+
+  if (allTokens.contrast && typeof allTokens.contrast === 'object') {
+    declarations.push(...generateContrastDeclarations(allTokens.contrast));
+  }
+
+  if (declarations.length === 0) return '';
+
+  let css = '@layer slashed.overrides {\n\t:root {\n';
+  for (const decl of declarations) {
+    css += `\t\t${decl}\n`;
+  }
+  css += '\t}\n}';
+
+  return css;
+}
+
+/**
+ * Check whether any non-empty overrides exist across all token sections.
+ *
+ * @param {Object} allTokens The full tokens store object (keyed by section).
+ * @returns {boolean}
+ */
+export function hasOverrides(allTokens) {
+  if (!allTokens || typeof allTokens !== 'object') return false;
+
+  for (const section of Object.values(allTokens)) {
+    if (!section || typeof section !== 'object') continue;
+    for (const value of Object.values(section)) {
+      if (typeof value === 'object' && value !== null) {
+        for (const v of Object.values(value)) {
+          if (v !== '' && v !== null && v !== undefined) return true;
+        }
+      } else if (value !== '' && value !== null && value !== undefined) {
+        return true;
+      }
+    }
+  }
+
+  return false;
+}
diff --git a/integrations/bricks/assets/admin-app/app.css b/integrations/bricks/assets/admin-app/app.css
index 788f0f1c..f9c84818 100644
--- a/integrations/bricks/assets/admin-app/app.css
+++ b/integrations/bricks/assets/admin-app/app.css
@@ -1 +1 @@
-.tab-nav.svelte-yyiz68{display:flex;gap:2px;border-bottom:1px solid #c3c4c7;flex-wrap:wrap}.tab-nav__btn.svelte-yyiz68{background:transparent;border:1px solid transparent;border-bottom:none;padding:8px 14px;cursor:pointer;font-size:14px;color:#2c3338;border-radius:4px 4px 0 0}.tab-nav__btn.svelte-yyiz68:hover{background:#f0f0f1}.tab-nav__btn.active.svelte-yyiz68{background:#fff;border-color:#c3c4c7;margin-bottom:-1px;color:#1d2327;font-weight:500}.row.svelte-1es83p3{display:grid;grid-template-columns:220px 1fr;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid #f0f0f1}.row.svelte-1es83p3:last-child{border-bottom:none}.row__label.svelte-1es83p3 label:where(.svelte-1es83p3){font-weight:500;display:block;color:#1d2327}.row__var.svelte-1es83p3{display:inline-block;margin-top:4px;background:#f6f7f7;padding:1px 6px;border-radius:3px;font-size:11px;color:#50575e}.row__inputs.svelte-1es83p3{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.row__swatch.svelte-1es83p3{width:28px;height:28px;border-radius:4px;border:1px solid #c3c4c7;flex-shrink:0}.row__hex.svelte-1es83p3{width:44px;height:28px;padding:0;border:1px solid #8c8f94;border-radius:3px;cursor:pointer;background:#fff}.row__hex-text.svelte-1es83p3{width:110px}.row__raw.svelte-1es83p3{flex:1;min-width:240px;font-family:ui-monospace,monospace}.row__toggle.svelte-1es83p3{background:transparent;border:none;color:#2271b1;cursor:pointer;padding:4px 8px;font-size:12px;text-decoration:underline}.row__toggle.svelte-1es83p3:hover{color:#135e96}h2.svelte-1vle0rm{margin-top:0}.status-heading.svelte-1vle0rm,.dark-heading.svelte-1vle0rm{margin-top:24px}.hint.svelte-1vle0rm{color:#50575e;margin-bottom:16px;max-width:720px}.rows.svelte-1vle0rm{border:1px solid #f0f0f1;border-radius:4px;padding:0 12px;background:#fcfcfd}.rows--dark.svelte-1vle0rm{background:#f8f8fc;border-color:#e2e4e9}.row.svelte-miyob8{display:grid;grid-template-columns:220px 1fr;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid #f0f0f1}.row.svelte-miyob8:last-child{border-bottom:none}.row__label.svelte-miyob8 label:where(.svelte-miyob8),.row__label-text.svelte-miyob8{font-weight:500;display:block;color:#1d2327}.row__var.svelte-miyob8{display:inline-block;margin-top:4px;background:#f6f7f7;padding:1px 6px;border-radius:3px;font-size:11px;color:#50575e}.row__inputs.svelte-miyob8{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.row__desc.svelte-miyob8{flex-basis:100%;margin:4px 0 0;color:#50575e;font-size:12px}.range.svelte-cifrt1{flex:1;min-width:160px;max-width:320px;accent-color:#2271b1}.number.svelte-cifrt1{width:90px}.unit.svelte-cifrt1{color:#50575e;font-size:12px}.select.svelte-r7dp44{min-width:160px}h2.svelte-jpmt71{margin-top:0}.group-heading.svelte-jpmt71{margin-top:24px}.hint.svelte-jpmt71{color:#50575e;margin-bottom:16px;max-width:720px}.rows.svelte-jpmt71{border:1px solid #f0f0f1;border-radius:4px;padding:0 12px;background:#fcfcfd}.text.mono.svelte-j8yw6l{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.unit.svelte-1pjh3bn{color:#50575e;font-size:12px}h2.svelte-743nsg{margin-top:0}.group-heading.svelte-743nsg{margin-top:24px}.hint.svelte-743nsg{color:#50575e;margin-bottom:16px;max-width:720px}.hint.svelte-743nsg code:where(.svelte-743nsg){background:#f0f0f1;padding:1px 5px;border-radius:3px;font-size:90%}.rows.svelte-743nsg{border:1px solid #f0f0f1;border-radius:4px;padding:0 12px;background:#fcfcfd}.size-row.svelte-743nsg{display:grid;grid-template-columns:220px 1fr;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid #f0f0f1}.size-row.svelte-743nsg:last-child{border-bottom:none}.size-row__name.svelte-743nsg{font-weight:500;color:#1d2327;display:block}.size-row__var.svelte-743nsg{display:inline-block;margin-top:4px;background:#f6f7f7;padding:1px 6px;border-radius:3px;font-size:11px;color:#50575e}.size-row__inputs.svelte-743nsg{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.size-row__inputs.svelte-743nsg .row{display:flex!important;grid-template-columns:none;gap:6px;padding:0;border:none;align-items:center}.size-row__inputs.svelte-743nsg .row__label-text,.size-row__inputs.svelte-743nsg .row__label label{font-weight:400;color:#50575e;font-size:12px}h2.svelte-1sn1epc{margin-top:0}.rows.svelte-1sn1epc{border:1px solid #f0f0f1;border-radius:4px;padding:0 12px;background:#fcfcfd}h2.svelte-1e7fmit{margin-top:0}.rows.svelte-1e7fmit{border:1px solid #f0f0f1;border-radius:4px;padding:0 12px;background:#fcfcfd}h2.svelte-eu0284{margin-top:0}.rows.svelte-eu0284{border:1px solid #f0f0f1;border-radius:4px;padding:0 12px;background:#fcfcfd}h2.svelte-12kdjwx{margin-top:0}.group-heading.svelte-12kdjwx{margin-top:24px}.hint.svelte-12kdjwx{color:#50575e;margin-bottom:16px;max-width:720px}.rows.svelte-12kdjwx{border:1px solid #f0f0f1;border-radius:4px;padding:0 12px;background:#fcfcfd}h2.svelte-h8mxbh{margin-top:0}.hint.svelte-h8mxbh{color:#50575e;margin-bottom:16px;max-width:720px}.rows.svelte-h8mxbh{border:1px solid #f0f0f1;border-radius:4px;padding:0 12px;background:#fcfcfd}h2.svelte-1nfz83c{margin-top:0}.hint.svelte-1nfz83c{color:#50575e;margin-bottom:16px;max-width:720px}.hint.svelte-1nfz83c code:where(.svelte-1nfz83c){background:#f0f0f1;padding:1px 6px;border-radius:3px;font-size:90%}.category.svelte-1nfz83c{border:1px solid #f0f0f1;border-radius:4px;margin-bottom:4px;background:#fcfcfd}.category__toggle.svelte-1nfz83c{all:unset;display:flex;align-items:center;gap:8px;width:100%;padding:10px 12px;cursor:pointer;font-size:14px;font-weight:500}.category__toggle.svelte-1nfz83c:hover{background:#f6f7f7}.category__toggle.svelte-1nfz83c:focus-visible{outline:2px solid #2271b1;outline-offset:2px;border-radius:4px}.category__arrow.svelte-1nfz83c{font-size:10px;width:14px;text-align:center}.category__count.svelte-1nfz83c{color:#787c82;font-weight:400;font-size:13px}.category__list.svelte-1nfz83c{list-style:none;margin:0;padding:0 12px 12px 34px;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:4px}.category__list.svelte-1nfz83c li:where(.svelte-1nfz83c) code:where(.svelte-1nfz83c){font-size:12px;background:#f0f0f1;padding:2px 6px;border-radius:3px;word-break:break-all}h2.svelte-1yljizh{margin-top:0}.hint.svelte-1yljizh{color:#50575e;margin-bottom:16px;max-width:720px}.category.svelte-1yljizh{border:1px solid #f0f0f1;border-radius:4px;margin-bottom:4px;background:#fcfcfd}.category__toggle.svelte-1yljizh{all:unset;display:flex;align-items:center;gap:8px;width:100%;padding:10px 12px;cursor:pointer;font-size:14px;font-weight:500}.category__toggle.svelte-1yljizh:hover{background:#f6f7f7}.category__toggle.svelte-1yljizh:focus-visible{outline:2px solid #2271b1;outline-offset:2px;border-radius:4px}.category__arrow.svelte-1yljizh{font-size:10px;width:14px;text-align:center}.category__count.svelte-1yljizh{color:#787c82;font-weight:400;font-size:13px}.category__list.svelte-1yljizh{list-style:none;margin:0;padding:0 12px 12px 34px;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:4px}.category__list.svelte-1yljizh li:where(.svelte-1yljizh) code:where(.svelte-1yljizh){font-size:12px;background:#f0f0f1;padding:2px 6px;border-radius:3px}h2.svelte-13231hj{margin-top:0}.settings-heading.svelte-13231hj{margin-top:24px}.hint.svelte-13231hj{color:#50575e;margin-bottom:16px;max-width:720px}.info.svelte-13231hj{display:grid;grid-template-columns:max-content 1fr;gap:4px 16px;margin-bottom:24px;font-size:14px}.info.svelte-13231hj dt:where(.svelte-13231hj){font-weight:500}.info.svelte-13231hj dd:where(.svelte-13231hj){margin:0;color:#50575e}.setting-row.svelte-13231hj{margin-bottom:16px}.setting-row.svelte-13231hj label:where(.svelte-13231hj){display:block;font-weight:500;margin-bottom:6px}.setting-row.svelte-13231hj select:where(.svelte-13231hj){padding:6px 10px;border:1px solid #8c8f94;border-radius:4px;font-size:14px}.description.svelte-13231hj{color:#50575e;font-size:13px;margin-top:6px}.save-row.svelte-13231hj{display:flex;align-items:center;gap:12px;margin-top:16px}.save-btn.svelte-13231hj{background:#2271b1;color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:13px;font-weight:500}.save-btn.svelte-13231hj:hover{background:#135e96}.save-btn.svelte-13231hj:disabled{opacity:.6;cursor:not-allowed}.status.svelte-13231hj{font-size:13px;font-weight:500}.status--ok.svelte-13231hj{color:#00a32a}.status--err.svelte-13231hj{color:#d63638}h2.svelte-a36hjt{margin-top:0}.hint.svelte-a36hjt{color:#50575e;margin-bottom:20px;max-width:720px}.hook.svelte-a36hjt{border:1px solid #f0f0f1;border-radius:4px;padding:16px;margin-bottom:12px;background:#fcfcfd}.hook__name.svelte-a36hjt{margin:0 0 8px;font-size:14px}.hook__name.svelte-a36hjt code:where(.svelte-a36hjt){background:#e7e8ea;padding:3px 8px;border-radius:3px;font-size:13px}.hook__desc.svelte-a36hjt{margin:0 0 8px;color:#1d2327;font-size:14px}.hook__params.svelte-a36hjt{margin:0 0 12px;font-size:13px;color:#50575e}.hook__params.svelte-a36hjt code:where(.svelte-a36hjt){background:#f0f0f1;padding:1px 4px;border-radius:2px;font-size:12px}.hook__example.svelte-a36hjt{margin:0;padding:12px;background:#1d2327;color:#e4e6e8;border-radius:4px;overflow-x:auto;font-size:12px;line-height:1.5}.hook__example.svelte-a36hjt code:where(.svelte-a36hjt){background:none;padding:0;color:inherit}.cheatsheet.svelte-osej3t{display:flex;flex-direction:column;gap:16px}.cheatsheet__header.svelte-osej3t h2:where(.svelte-osej3t){margin:0 0 4px;font-size:18px}.cheatsheet__counts.svelte-osej3t{margin:0;font-size:13px;color:#50575e}.cheatsheet__controls.svelte-osej3t{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.cheatsheet__search.svelte-osej3t{flex:1;min-width:200px;padding:6px 10px;border:1px solid #c3c4c7;border-radius:4px;font-size:13px}.cheatsheet__search.svelte-osej3t:focus{border-color:#2271b1;outline:none;box-shadow:0 0 0 1px #2271b1}.cheatsheet__view-toggle.svelte-osej3t{display:flex;gap:0}.cheatsheet__view-toggle.svelte-osej3t button:where(.svelte-osej3t){padding:5px 12px;border:1px solid #c3c4c7;background:#fff;font-size:12px;cursor:pointer;color:#50575e}.cheatsheet__view-toggle.svelte-osej3t button:where(.svelte-osej3t):first-child{border-radius:3px 0 0 3px}.cheatsheet__view-toggle.svelte-osej3t button:where(.svelte-osej3t):last-child{border-radius:0 3px 3px 0}.cheatsheet__view-toggle.svelte-osej3t button:where(.svelte-osej3t):not(:first-child){border-left:none}.cheatsheet__view-toggle.svelte-osej3t button.active:where(.svelte-osej3t){background:#2271b1;border-color:#2271b1;color:#fff}.cheatsheet__section.svelte-osej3t{display:flex;flex-direction:column;gap:8px}.cheatsheet__section-title.svelte-osej3t{font-size:15px;margin:8px 0 0;padding-bottom:6px;border-bottom:1px solid #e2e4e7}.cheatsheet__group.svelte-osej3t{border:1px solid #e2e4e7;border-radius:4px;overflow:hidden}.cheatsheet__group-header.svelte-osej3t{padding:8px 12px;background:#f6f7f7;cursor:pointer;font-size:13px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}.cheatsheet__group-header.svelte-osej3t::-webkit-details-marker{margin-right:4px}.cheatsheet__group-desc.svelte-osej3t{font-size:12px;color:#646970;font-weight:400}.cheatsheet__list.svelte-osej3t{list-style:none;margin:0;padding:0}.cheatsheet__item.svelte-osej3t{display:flex;align-items:baseline;gap:12px;padding:5px 12px;border-top:1px solid #f0f0f1;font-size:12px;line-height:1.5}.cheatsheet__item.svelte-osej3t:first-child{border-top:1px solid #e2e4e7}.cheatsheet__name.svelte-osej3t{flex-shrink:0;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,monospace;font-size:11.5px;background:#f0f0f1;padding:1px 5px;border-radius:3px;color:#1e1e1e;white-space:nowrap}.cheatsheet__desc.svelte-osej3t{color:#50575e;font-size:12px}.cheatsheet__empty.svelte-osej3t{text-align:center;color:#646970;padding:32px 16px;font-style:italic}.slashed-preview.svelte-g79qke{background:#fff;border:1px solid #c3c4c7;border-radius:4px;padding:20px;margin-top:8px}.slashed-preview.svelte-g79qke h3:where(.svelte-g79qke){margin-top:0}.slashed-preview__type-heading.svelte-g79qke{font-family:var(--sf-font-heading, system-ui, sans-serif);margin:8px 0 6px;font-size:22px;color:#1d2327}.slashed-preview__type-body.svelte-g79qke{font-family:var(--sf-font-body, system-ui, sans-serif);color:#2c3338;margin:0 0 16px;max-width:640px}.slashed-preview__swatches.svelte-g79qke{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap}.slashed-preview__swatch.svelte-g79qke{width:56px;height:56px;border-radius:6px;border:1px solid #c3c4c7;display:flex;align-items:flex-end;justify-content:center;font-size:10px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5);padding:4px}.slashed-preview__buttons.svelte-g79qke{display:flex;gap:8px;margin-top:14px}.slashed-preview__btn.svelte-g79qke{color:#fff;padding:8px 16px;border-radius:4px;font-weight:500;border:none;cursor:default}.slashed-preview__caption.svelte-g79qke{margin-top:16px;color:#50575e;font-size:12px}.slashed-preview__caption.svelte-g79qke code:where(.svelte-g79qke){display:block;background:#f6f7f7;padding:8px;border-radius:3px;margin-top:4px;white-space:pre-wrap;font-size:11px;max-height:120px;overflow:auto}.bar.svelte-1oj49qa{position:fixed;bottom:0;left:160px;right:0;background:#fff;border-top:2px solid #c3c4c7;padding:10px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;z-index:100;transition:border-color .15s}.bar.dirty.svelte-1oj49qa{border-top-color:#2271b1}.bar__status.svelte-1oj49qa{font-size:13px}.bar__dirty.svelte-1oj49qa{color:#2271b1;font-weight:500}.bar__pending.svelte-1oj49qa{color:#50575e}.bar__saved.svelte-1oj49qa{color:#00a32a;font-weight:500}.bar__clean.svelte-1oj49qa{color:#50575e}.bar__error.svelte-1oj49qa{color:#d63638;font-weight:500}.bar__actions.svelte-1oj49qa{display:flex;gap:8px}.bar__save.svelte-1oj49qa,.bar__reset.svelte-1oj49qa{padding:6px 14px;border-radius:3px;border:1px solid #2271b1;background:#fff;color:#2271b1;cursor:pointer;font-size:13px}.bar__save.svelte-1oj49qa{background:#2271b1;color:#fff}.bar__save.svelte-1oj49qa:disabled,.bar__reset.svelte-1oj49qa:disabled{opacity:.5;cursor:not-allowed}.bar__reset.svelte-1oj49qa{border-color:#d63638;color:#d63638}@media(max-width:782px){.bar.svelte-1oj49qa{left:0}}.slashed-svelte-admin.svelte-1n46o8q{--gap: 16px;display:flex;flex-direction:column;gap:var(--gap);max-width:1100px;padding-bottom:80px}.slashed-svelte-admin__header.svelte-1n46o8q h1:where(.svelte-1n46o8q){margin:0}.muted.svelte-1n46o8q{color:#50575e;margin:4px 0 0}.slashed-svelte-admin__body.svelte-1n46o8q{background:#fff;border:1px solid #c3c4c7;border-radius:4px;padding:20px}
+.tab-nav.svelte-yyiz68{display:flex;gap:2px;border-bottom:1px solid #c3c4c7;flex-wrap:wrap}.tab-nav__btn.svelte-yyiz68{background:transparent;border:1px solid transparent;border-bottom:none;padding:8px 14px;cursor:pointer;font-size:14px;color:#2c3338;border-radius:4px 4px 0 0}.tab-nav__btn.svelte-yyiz68:hover{background:#f0f0f1}.tab-nav__btn.active.svelte-yyiz68{background:#fff;border-color:#c3c4c7;margin-bottom:-1px;color:#1d2327;font-weight:500}.row.svelte-1es83p3{display:grid;grid-template-columns:220px 1fr;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid #f0f0f1}.row.svelte-1es83p3:last-child{border-bottom:none}.row__label.svelte-1es83p3 label:where(.svelte-1es83p3){font-weight:500;display:block;color:#1d2327}.row__var.svelte-1es83p3{display:inline-block;margin-top:4px;background:#f6f7f7;padding:1px 6px;border-radius:3px;font-size:11px;color:#50575e}.row__inputs.svelte-1es83p3{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.row__swatch.svelte-1es83p3{width:28px;height:28px;border-radius:4px;border:1px solid #c3c4c7;flex-shrink:0}.row__hex.svelte-1es83p3{width:44px;height:28px;padding:0;border:1px solid #8c8f94;border-radius:3px;cursor:pointer;background:#fff}.row__hex-text.svelte-1es83p3{width:110px}.row__raw.svelte-1es83p3{flex:1;min-width:240px;font-family:ui-monospace,monospace}.row__toggle.svelte-1es83p3{background:transparent;border:none;color:#2271b1;cursor:pointer;padding:4px 8px;font-size:12px;text-decoration:underline}.row__toggle.svelte-1es83p3:hover{color:#135e96}h2.svelte-1vle0rm{margin-top:0}.status-heading.svelte-1vle0rm,.dark-heading.svelte-1vle0rm{margin-top:24px}.hint.svelte-1vle0rm{color:#50575e;margin-bottom:16px;max-width:720px}.rows.svelte-1vle0rm{border:1px solid #f0f0f1;border-radius:4px;padding:0 12px;background:#fcfcfd}.rows--dark.svelte-1vle0rm{background:#f8f8fc;border-color:#e2e4e9}.row.svelte-miyob8{display:grid;grid-template-columns:220px 1fr;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid #f0f0f1}.row.svelte-miyob8:last-child{border-bottom:none}.row__label.svelte-miyob8 label:where(.svelte-miyob8),.row__label-text.svelte-miyob8{font-weight:500;display:block;color:#1d2327}.row__var.svelte-miyob8{display:inline-block;margin-top:4px;background:#f6f7f7;padding:1px 6px;border-radius:3px;font-size:11px;color:#50575e}.row__inputs.svelte-miyob8{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.row__desc.svelte-miyob8{flex-basis:100%;margin:4px 0 0;color:#50575e;font-size:12px}.range.svelte-cifrt1{flex:1;min-width:160px;max-width:320px;accent-color:#2271b1}.number.svelte-cifrt1{width:90px}.unit.svelte-cifrt1{color:#50575e;font-size:12px}.select.svelte-r7dp44{min-width:160px}h2.svelte-jpmt71{margin-top:0}.group-heading.svelte-jpmt71{margin-top:24px}.hint.svelte-jpmt71{color:#50575e;margin-bottom:16px;max-width:720px}.rows.svelte-jpmt71{border:1px solid #f0f0f1;border-radius:4px;padding:0 12px;background:#fcfcfd}.text.mono.svelte-j8yw6l{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.unit.svelte-1pjh3bn{color:#50575e;font-size:12px}h2.svelte-743nsg{margin-top:0}.group-heading.svelte-743nsg{margin-top:24px}.hint.svelte-743nsg{color:#50575e;margin-bottom:16px;max-width:720px}.hint.svelte-743nsg code:where(.svelte-743nsg){background:#f0f0f1;padding:1px 5px;border-radius:3px;font-size:90%}.rows.svelte-743nsg{border:1px solid #f0f0f1;border-radius:4px;padding:0 12px;background:#fcfcfd}.size-row.svelte-743nsg{display:grid;grid-template-columns:220px 1fr;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid #f0f0f1}.size-row.svelte-743nsg:last-child{border-bottom:none}.size-row__name.svelte-743nsg{font-weight:500;color:#1d2327;display:block}.size-row__var.svelte-743nsg{display:inline-block;margin-top:4px;background:#f6f7f7;padding:1px 6px;border-radius:3px;font-size:11px;color:#50575e}.size-row__inputs.svelte-743nsg{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.size-row__inputs.svelte-743nsg .row{display:flex!important;grid-template-columns:none;gap:6px;padding:0;border:none;align-items:center}.size-row__inputs.svelte-743nsg .row__label-text,.size-row__inputs.svelte-743nsg .row__label label{font-weight:400;color:#50575e;font-size:12px}h2.svelte-1sn1epc{margin-top:0}.rows.svelte-1sn1epc{border:1px solid #f0f0f1;border-radius:4px;padding:0 12px;background:#fcfcfd}h2.svelte-1e7fmit{margin-top:0}.rows.svelte-1e7fmit{border:1px solid #f0f0f1;border-radius:4px;padding:0 12px;background:#fcfcfd}h2.svelte-eu0284{margin-top:0}.rows.svelte-eu0284{border:1px solid #f0f0f1;border-radius:4px;padding:0 12px;background:#fcfcfd}h2.svelte-12kdjwx{margin-top:0}.group-heading.svelte-12kdjwx{margin-top:24px}.hint.svelte-12kdjwx{color:#50575e;margin-bottom:16px;max-width:720px}.rows.svelte-12kdjwx{border:1px solid #f0f0f1;border-radius:4px;padding:0 12px;background:#fcfcfd}h2.svelte-h8mxbh{margin-top:0}.hint.svelte-h8mxbh{color:#50575e;margin-bottom:16px;max-width:720px}.rows.svelte-h8mxbh{border:1px solid #f0f0f1;border-radius:4px;padding:0 12px;background:#fcfcfd}h2.svelte-1nfz83c{margin-top:0}.hint.svelte-1nfz83c{color:#50575e;margin-bottom:16px;max-width:720px}.hint.svelte-1nfz83c code:where(.svelte-1nfz83c){background:#f0f0f1;padding:1px 6px;border-radius:3px;font-size:90%}.category.svelte-1nfz83c{border:1px solid #f0f0f1;border-radius:4px;margin-bottom:4px;background:#fcfcfd}.category__toggle.svelte-1nfz83c{all:unset;display:flex;align-items:center;gap:8px;width:100%;padding:10px 12px;cursor:pointer;font-size:14px;font-weight:500}.category__toggle.svelte-1nfz83c:hover{background:#f6f7f7}.category__toggle.svelte-1nfz83c:focus-visible{outline:2px solid #2271b1;outline-offset:2px;border-radius:4px}.category__arrow.svelte-1nfz83c{font-size:10px;width:14px;text-align:center}.category__count.svelte-1nfz83c{color:#787c82;font-weight:400;font-size:13px}.category__list.svelte-1nfz83c{list-style:none;margin:0;padding:0 12px 12px 34px;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:4px}.category__list.svelte-1nfz83c li:where(.svelte-1nfz83c) code:where(.svelte-1nfz83c){font-size:12px;background:#f0f0f1;padding:2px 6px;border-radius:3px;word-break:break-all}h2.svelte-1yljizh{margin-top:0}.hint.svelte-1yljizh{color:#50575e;margin-bottom:16px;max-width:720px}.category.svelte-1yljizh{border:1px solid #f0f0f1;border-radius:4px;margin-bottom:4px;background:#fcfcfd}.category__toggle.svelte-1yljizh{all:unset;display:flex;align-items:center;gap:8px;width:100%;padding:10px 12px;cursor:pointer;font-size:14px;font-weight:500}.category__toggle.svelte-1yljizh:hover{background:#f6f7f7}.category__toggle.svelte-1yljizh:focus-visible{outline:2px solid #2271b1;outline-offset:2px;border-radius:4px}.category__arrow.svelte-1yljizh{font-size:10px;width:14px;text-align:center}.category__count.svelte-1yljizh{color:#787c82;font-weight:400;font-size:13px}.category__list.svelte-1yljizh{list-style:none;margin:0;padding:0 12px 12px 34px;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:4px}.category__list.svelte-1yljizh li:where(.svelte-1yljizh) code:where(.svelte-1yljizh){font-size:12px;background:#f0f0f1;padding:2px 6px;border-radius:3px}h2.svelte-13231hj{margin-top:0}.settings-heading.svelte-13231hj{margin-top:24px}.hint.svelte-13231hj{color:#50575e;margin-bottom:16px;max-width:720px}.info.svelte-13231hj{display:grid;grid-template-columns:max-content 1fr;gap:4px 16px;margin-bottom:24px;font-size:14px}.info.svelte-13231hj dt:where(.svelte-13231hj){font-weight:500}.info.svelte-13231hj dd:where(.svelte-13231hj){margin:0;color:#50575e}.setting-row.svelte-13231hj{margin-bottom:16px}.setting-row.svelte-13231hj label:where(.svelte-13231hj){display:block;font-weight:500;margin-bottom:6px}.setting-row.svelte-13231hj select:where(.svelte-13231hj){padding:6px 10px;border:1px solid #8c8f94;border-radius:4px;font-size:14px}.description.svelte-13231hj{color:#50575e;font-size:13px;margin-top:6px}.save-row.svelte-13231hj{display:flex;align-items:center;gap:12px;margin-top:16px}.save-btn.svelte-13231hj{background:#2271b1;color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:13px;font-weight:500}.save-btn.svelte-13231hj:hover{background:#135e96}.save-btn.svelte-13231hj:disabled{opacity:.6;cursor:not-allowed}.status.svelte-13231hj{font-size:13px;font-weight:500}.status--ok.svelte-13231hj{color:#00a32a}.status--err.svelte-13231hj{color:#d63638}h2.svelte-a36hjt{margin-top:0}.hint.svelte-a36hjt{color:#50575e;margin-bottom:20px;max-width:720px}.hook.svelte-a36hjt{border:1px solid #f0f0f1;border-radius:4px;padding:16px;margin-bottom:12px;background:#fcfcfd}.hook__name.svelte-a36hjt{margin:0 0 8px;font-size:14px}.hook__name.svelte-a36hjt code:where(.svelte-a36hjt){background:#e7e8ea;padding:3px 8px;border-radius:3px;font-size:13px}.hook__desc.svelte-a36hjt{margin:0 0 8px;color:#1d2327;font-size:14px}.hook__params.svelte-a36hjt{margin:0 0 12px;font-size:13px;color:#50575e}.hook__params.svelte-a36hjt code:where(.svelte-a36hjt){background:#f0f0f1;padding:1px 4px;border-radius:2px;font-size:12px}.hook__example.svelte-a36hjt{margin:0;padding:12px;background:#1d2327;color:#e4e6e8;border-radius:4px;overflow-x:auto;font-size:12px;line-height:1.5}.hook__example.svelte-a36hjt code:where(.svelte-a36hjt){background:none;padding:0;color:inherit}.cheatsheet.svelte-osej3t{display:flex;flex-direction:column;gap:16px}.cheatsheet__header.svelte-osej3t h2:where(.svelte-osej3t){margin:0 0 4px;font-size:18px}.cheatsheet__counts.svelte-osej3t{margin:0;font-size:13px;color:#50575e}.cheatsheet__controls.svelte-osej3t{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.cheatsheet__search.svelte-osej3t{flex:1;min-width:200px;padding:6px 10px;border:1px solid #c3c4c7;border-radius:4px;font-size:13px}.cheatsheet__search.svelte-osej3t:focus{border-color:#2271b1;outline:none;box-shadow:0 0 0 1px #2271b1}.cheatsheet__view-toggle.svelte-osej3t{display:flex;gap:0}.cheatsheet__view-toggle.svelte-osej3t button:where(.svelte-osej3t){padding:5px 12px;border:1px solid #c3c4c7;background:#fff;font-size:12px;cursor:pointer;color:#50575e}.cheatsheet__view-toggle.svelte-osej3t button:where(.svelte-osej3t):first-child{border-radius:3px 0 0 3px}.cheatsheet__view-toggle.svelte-osej3t button:where(.svelte-osej3t):last-child{border-radius:0 3px 3px 0}.cheatsheet__view-toggle.svelte-osej3t button:where(.svelte-osej3t):not(:first-child){border-left:none}.cheatsheet__view-toggle.svelte-osej3t button.active:where(.svelte-osej3t){background:#2271b1;border-color:#2271b1;color:#fff}.cheatsheet__section.svelte-osej3t{display:flex;flex-direction:column;gap:8px}.cheatsheet__section-title.svelte-osej3t{font-size:15px;margin:8px 0 0;padding-bottom:6px;border-bottom:1px solid #e2e4e7}.cheatsheet__group.svelte-osej3t{border:1px solid #e2e4e7;border-radius:4px;overflow:hidden}.cheatsheet__group-header.svelte-osej3t{padding:8px 12px;background:#f6f7f7;cursor:pointer;font-size:13px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}.cheatsheet__group-header.svelte-osej3t::-webkit-details-marker{margin-right:4px}.cheatsheet__group-desc.svelte-osej3t{font-size:12px;color:#646970;font-weight:400}.cheatsheet__list.svelte-osej3t{list-style:none;margin:0;padding:0}.cheatsheet__item.svelte-osej3t{display:flex;align-items:baseline;gap:12px;padding:5px 12px;border-top:1px solid #f0f0f1;font-size:12px;line-height:1.5}.cheatsheet__item.svelte-osej3t:first-child{border-top:1px solid #e2e4e7}.cheatsheet__name.svelte-osej3t{flex-shrink:0;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,monospace;font-size:11.5px;background:#f0f0f1;padding:1px 5px;border-radius:3px;color:#1e1e1e;white-space:nowrap}.cheatsheet__desc.svelte-osej3t{color:#50575e;font-size:12px}.cheatsheet__empty.svelte-osej3t{text-align:center;color:#646970;padding:32px 16px;font-style:italic}.slashed-preview.svelte-g79qke{background:#fff;border:1px solid #c3c4c7;border-radius:4px;padding:20px;margin-top:8px}.slashed-preview.svelte-g79qke h3:where(.svelte-g79qke){margin-top:0}.slashed-preview__type-heading.svelte-g79qke{font-family:var(--sf-font-heading, system-ui, sans-serif);margin:8px 0 6px;font-size:22px;color:#1d2327}.slashed-preview__type-body.svelte-g79qke{font-family:var(--sf-font-body, system-ui, sans-serif);color:#2c3338;margin:0 0 16px;max-width:640px}.slashed-preview__swatches.svelte-g79qke{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap}.slashed-preview__swatch.svelte-g79qke{width:56px;height:56px;border-radius:6px;border:1px solid #c3c4c7;display:flex;align-items:flex-end;justify-content:center;font-size:10px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5);padding:4px}.slashed-preview__buttons.svelte-g79qke{display:flex;gap:8px;margin-top:14px}.slashed-preview__btn.svelte-g79qke{color:#fff;padding:8px 16px;border-radius:4px;font-weight:500;border:none;cursor:default}.slashed-preview__caption.svelte-g79qke{margin-top:16px;color:#50575e;font-size:12px}.slashed-preview__caption.svelte-g79qke code:where(.svelte-g79qke){display:block;background:#f6f7f7;padding:8px;border-radius:3px;margin-top:4px;white-space:pre-wrap;font-size:11px;max-height:120px;overflow:auto}.bar.svelte-1oj49qa{position:fixed;bottom:0;left:160px;right:0;background:#fff;border-top:2px solid #c3c4c7;padding:10px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;z-index:100;transition:border-color .15s}.bar.dirty.svelte-1oj49qa{border-top-color:#2271b1}.bar__status.svelte-1oj49qa{font-size:13px}.bar__dirty.svelte-1oj49qa{color:#2271b1;font-weight:500}.bar__pending.svelte-1oj49qa{color:#50575e}.bar__saved.svelte-1oj49qa{color:#00a32a;font-weight:500}.bar__clean.svelte-1oj49qa{color:#50575e}.bar__error.svelte-1oj49qa{color:#d63638;font-weight:500}.bar__actions.svelte-1oj49qa{display:flex;gap:8px}.bar__save.svelte-1oj49qa,.bar__reset.svelte-1oj49qa{padding:6px 14px;border-radius:3px;border:1px solid #2271b1;background:#fff;color:#2271b1;cursor:pointer;font-size:13px}.bar__save.svelte-1oj49qa{background:#2271b1;color:#fff}.bar__save.svelte-1oj49qa:disabled,.bar__reset.svelte-1oj49qa:disabled{opacity:.5;cursor:not-allowed}.bar__reset.svelte-1oj49qa{border-color:#d63638;color:#d63638}.bar__export.svelte-1oj49qa{padding:6px 14px;border-radius:3px;border:1px solid #2271b1;background:#fff;color:#2271b1;cursor:pointer;font-size:13px}.bar__export.svelte-1oj49qa:disabled{opacity:.5;cursor:not-allowed}@media(max-width:782px){.bar.svelte-1oj49qa{left:0}}.slashed-svelte-admin.svelte-1n46o8q{--gap: 16px;display:flex;flex-direction:column;gap:var(--gap);max-width:1100px;padding-bottom:80px}.slashed-svelte-admin__header.svelte-1n46o8q h1:where(.svelte-1n46o8q){margin:0}.muted.svelte-1n46o8q{color:#50575e;margin:4px 0 0}.slashed-svelte-admin__body.svelte-1n46o8q{background:#fff;border:1px solid #c3c4c7;border-radius:4px;padding:20px}
diff --git a/integrations/bricks/assets/admin-app/app.js b/integrations/bricks/assets/admin-app/app.js
index 21e5522a..08c2003d 100644
--- a/integrations/bricks/assets/admin-app/app.js
+++ b/integrations/bricks/assets/admin-app/app.js
@@ -42,5 +42,5 @@ add_filter( 'slashed_bricks/inventory_local_path', function() {
     body and heading font stacks.</p> <div class="slashed-preview__swatches svelte-g79qke"></div> <div class="slashed-preview__buttons svelte-g79qke"><span class="slashed-preview__btn svelte-g79qke">Primary</span> <span class="slashed-preview__btn svelte-g79qke">Action</span></div> <div class="slashed-preview__caption svelte-g79qke">Generated CSS: <code class="svelte-g79qke"> </code></div></div>`);function vl(e,t){se(t,!0);const s=["primary","secondary","tertiary","action","neutral","base"],r=["success","warning","error","info","danger"],n=E(()=>{const _=[],b=Y.colors??{},v=Y.typography??{};for(const m of s){const w=b[`brand_${m}`];w&&_.push(`--sf-color-${m}-light:${w}`);const x=b[`brand_dark_${m}`];x&&_.push(`--sf-color-${m}-dark:${x}`)}for(const m of r){const w=b[`status_${m}`];w&&_.push(`--sf-color-${m}-light:${w}`);const x=b[`status_dark_${m}`];x&&_.push(`--sf-color-${m}-dark:${x}`)}return v.font_body&&_.push(`--sf-font-body:${v.font_body}`),v.font_heading&&_.push(`--sf-font-heading:${v.font_heading}`),_.join(";")}),a=E(()=>{const _=[],b=Y.colors??{},v=Y.typography??{};for(const m of s){const w=b[`brand_${m}`];w&&_.push(`--sf-color-${m}-light: ${w}`);const x=b[`brand_dark_${m}`];x&&_.push(`--sf-color-${m}-dark: ${x}`)}for(const m of r){const w=b[`status_${m}`];w&&_.push(`--sf-color-${m}-light: ${w}`);const x=b[`status_dark_${m}`];x&&_.push(`--sf-color-${m}-dark: ${x}`)}return v.font_body&&_.push(`--sf-font-body: ${v.font_body}`),v.font_heading&&_.push(`--sf-font-heading: ${v.font_heading}`),_.length===0?"":`.slashed-preview {
   ${_.join(`;
   `)};
-}`});var i=ul(),l=k(y(i),6);Q(l,20,()=>s,_=>_,(_,b)=>{var v=dl();let m;var w=y(v);I(()=>{U(v,"title",b),m=bt(v,"",m,{background:`var(--sf-color-${b}-light, #ddd)`}),C(w,b)}),j(_,v)});var o=k(l,2),c=y(o);bt(c,"",{},{background:"var(--sf-color-primary-light, #4338ca)"});var h=k(c,2);bt(h,"",{},{background:"var(--sf-color-action-light, #0891b2)"});var d=k(o,2),f=k(y(d)),g=y(f);I(()=>{bt(i,u(n)),C(g,u(a)||"/* (defaults — no overrides set) */")}),j(e,i),re()}var hl=A('<span class="bar__error svelte-1oj49qa"> </span>'),pl=A('<span class="bar__pending svelte-1oj49qa">Saving…</span>'),_l=A('<span class="bar__saved svelte-1oj49qa">Saved</span>'),gl=A('<span class="bar__dirty svelte-1oj49qa">Unsaved changes</span>'),ml=A('<span class="bar__clean svelte-1oj49qa">All changes saved</span>'),bl=A('<div><div class="bar__status svelte-1oj49qa"><!></div> <div class="bar__actions svelte-1oj49qa"><button type="button" class="bar__reset svelte-1oj49qa">Reset section</button> <button type="button" class="bar__save svelte-1oj49qa"> </button></div></div>');function yl(e,t){se(t,!0);async function s(){if(!z.saving){z.saving=!0,z.error="";try{const w=z.activeTab,x=Y[w]??{},T=await Bo(w,x);T&&T.values&&(Y[w]=T.values),z.dirty=!1,z.lastSavedAt=Date.now()}catch(w){z.error=w&&w.message||String(w)}finally{z.saving=!1}}}async function r(){if(!z.saving&&confirm(`Reset the ${ee.tabs[z.activeTab]??z.activeTab} tab to defaults?`)){z.saving=!0,z.error="";try{await Ko(z.activeTab),Gi(z.activeTab),z.dirty=!1,z.lastSavedAt=Date.now()}catch(w){z.error=w&&w.message||String(w)}finally{z.saving=!1}}}let n=ne(!1);In(()=>{if(z.lastSavedAt){K(n,!0);const w=setTimeout(()=>K(n,!1),2e3);return()=>clearTimeout(w)}});var a=bl();let i;var l=y(a),o=y(l);{var c=w=>{var x=hl(),T=y(x);I(()=>C(T,z.error)),j(w,x)},h=w=>{var x=pl();j(w,x)},d=w=>{var x=_l();j(w,x)},f=w=>{var x=gl();j(w,x)},g=w=>{var x=ml();j(w,x)};le(o,w=>{z.error?w(c):z.saving?w(h,1):u(n)?w(d,2):z.dirty?w(f,3):w(g,-1)})}var _=k(l,2),b=y(_),v=k(b,2),m=y(v);I(()=>{i=Zt(a,1,"bar svelte-1oj49qa",null,i,{dirty:z.dirty}),b.disabled=z.saving,v.disabled=z.saving||!z.dirty,C(m,z.saving?"Saving…":"Save changes")}),oe("click",b,r),oe("click",v,s),j(e,a),re()}Be(["click"]);var wl=A('<div class="slashed-svelte-admin svelte-1n46o8q"><header class="slashed-svelte-admin__header svelte-1n46o8q"><h1 class="svelte-1n46o8q">SLASHED Design Tokens</h1> <p class="muted svelte-1n46o8q">Adjust framework tokens, inspect generated variables, and manage the bundled CSS in one place.</p></header> <!> <section class="slashed-svelte-admin__body svelte-1n46o8q"><!></section> <!> <!></div>');function kl(e,t){se(t,!0);const s=["cheatsheet","hooks","variables","classes","bundle"];let r=E(()=>s.includes(z.activeTab));In(()=>{function S(H){z.dirty&&(H.preventDefault(),H.returnValue="")}return window.addEventListener("beforeunload",S),()=>window.removeEventListener("beforeunload",S)});var n=wl(),a=k(y(n),2);Wi(a,{});var i=k(a,2),l=y(i);{var o=S=>{eo(S,{})},c=S=>{vo(S,{})},h=S=>{bo(S,{})},d=S=>{wo(S,{})},f=S=>{xo(S,{})},g=S=>{Eo(S,{})},_=S=>{jo(S,{})},b=S=>{Co(S,{})},v=S=>{Lo(S,{})},m=S=>{Fo(S,{})},w=S=>{Yo(S,{})},x=S=>{Xo(S)},T=S=>{fl(S,{})};le(l,S=>{z.activeTab==="colors"?S(o):z.activeTab==="contrast"?S(c,1):z.activeTab==="typography"?S(h,2):z.activeTab==="spacing"?S(d,3):z.activeTab==="radius"?S(f,4):z.activeTab==="shadows"?S(g,5):z.activeTab==="motion"?S(_,6):z.activeTab==="zindex"?S(b,7):z.activeTab==="variables"?S(v,8):z.activeTab==="classes"?S(m,9):z.activeTab==="bundle"?S(w,10):z.activeTab==="hooks"?S(x,11):z.activeTab==="cheatsheet"&&S(T,12)})}var F=k(i,2);vl(F,{});var G=k(F,2);{var W=S=>{yl(S,{})};le(G,S=>{u(r)||S(W)})}j(e,n),re()}const rn=document.getElementById("slashed-admin-app");rn&&Ci(kl,{target:rn});
+}`});var i=ul(),l=k(y(i),6);Q(l,20,()=>s,_=>_,(_,b)=>{var v=dl();let m;var w=y(v);I(()=>{U(v,"title",b),m=bt(v,"",m,{background:`var(--sf-color-${b}-light, #ddd)`}),C(w,b)}),j(_,v)});var o=k(l,2),c=y(o);bt(c,"",{},{background:"var(--sf-color-primary-light, #4338ca)"});var h=k(c,2);bt(h,"",{},{background:"var(--sf-color-action-light, #0891b2)"});var d=k(o,2),f=k(y(d)),g=y(f);I(()=>{bt(i,u(n)),C(g,u(a)||"/* (defaults — no overrides set) */")}),j(e,i),re()}var hl=A('<span class="bar__error svelte-1oj49qa"> </span>'),pl=A('<span class="bar__pending svelte-1oj49qa">Saving…</span>'),_l=A('<span class="bar__saved svelte-1oj49qa">Saved</span>'),gl=A('<span class="bar__dirty svelte-1oj49qa">Unsaved changes</span>'),ml=A('<span class="bar__clean svelte-1oj49qa">All changes saved</span>'),bl=A('<div><div class="bar__status svelte-1oj49qa"><!></div> <div class="bar__actions svelte-1oj49qa"><button type="button" class="bar__reset svelte-1oj49qa">Reset section</button> <button type="button" class="bar__export svelte-1oj49qa">Export CSS</button> <button type="button" class="bar__save svelte-1oj49qa"> </button></div></div>');function yl(e,t){se(t,!0);async function s(){if(!z.saving){z.saving=!0,z.error="";try{const w=z.activeTab,x=Y[w]??{},T=await Bo(w,x);T&&T.values&&(Y[w]=T.values),z.dirty=!1,z.lastSavedAt=Date.now()}catch(w){z.error=w&&w.message||String(w)}finally{z.saving=!1}}}async function r(){if(!z.saving&&confirm(`Reset the ${ee.tabs[z.activeTab]??z.activeTab} tab to defaults?`)){z.saving=!0,z.error="";try{await Ko(z.activeTab),Gi(z.activeTab),z.dirty=!1,z.lastSavedAt=Date.now()}catch(w){z.error=w&&w.message||String(w)}finally{z.saving=!1}}}let n=ne(!1);In(()=>{if(z.lastSavedAt){K(n,!0);const w=setTimeout(()=>K(n,!1),2e3);return()=>clearTimeout(w)}});function sl_hasOverrides(tk){if(!tk||typeof tk!=="object")return!1;for(const sec of Object.values(tk)){if(!sec||typeof sec!=="object")continue;for(const val of Object.values(sec)){if(typeof val==="object"&&val!==null){for(const vv of Object.values(val)){if(vv!==""&&vv!==null&&vv!==void 0)return!0}}else if(val!==""&&val!==null&&val!==void 0)return!0}}return!1}function sl_generateExportCSS(tk){const decls=[];const colors=tk.colors??{};const typo=tk.typography??{};const spacing=tk.spacing??{};const radius=tk.radius??{};const shadows=tk.shadows??{};const motion=tk.motion??{};const zindex=tk.zindex??{};const contrast=tk.contrast??{};const brands=["primary","secondary","tertiary","action","neutral","base"];const statuses=["success","warning","error","info","danger"];for(const c of brands){if(colors[`brand_${c}`])decls.push(`--sf-color-${c}-light: ${colors[`brand_${c}`]};`);if(colors[`brand_dark_${c}`])decls.push(`--sf-color-${c}-dark: ${colors[`brand_dark_${c}`]};`)}for(const c of statuses){if(colors[`status_${c}`])decls.push(`--sf-color-${c}-light: ${colors[`status_${c}`]};`);if(colors[`status_dark_${c}`])decls.push(`--sf-color-${c}-dark: ${colors[`status_dark_${c}`]};`)}const fonts=["body","heading","mono","display","humanist","geometric","slab"];for(const f of fonts){if(typo[`font_${f}`])decls.push(`--sf-font-${f}: ${typo[`font_${f}`]};`)}if(typo.text_scale)decls.push(`--sf-text-scale: ${typo.text_scale};`);if(typo.text_display_scale)decls.push(`--sf-text-display-scale: ${typo.text_display_scale};`);const sizes=["2xs","xs","s","m","l","xl","2xl","3xl","4xl","display-s","display-m","display-l"];for(const sz of sizes){const mn=typo[`size_${sz}_min`],mx=typo[`size_${sz}_max`];if(mn&&mx){const minV=parseFloat(mn),maxV=parseFloat(mx);if(minV>0&&maxV>0){const slope=parseFloat(((maxV-minV)/72.5).toFixed(6)),minR=parseFloat(minV.toFixed(4)),maxR=parseFloat(maxV.toFixed(4));decls.push(`--sf-text-${sz}: clamp(${minR}rem, calc(${slope} * (100vw - 22.5rem) + ${minR}rem), ${maxR}rem);`)}}}if(spacing.space_scale)decls.push(`--sf-space-scale: ${spacing.space_scale};`);const spAliases={gutter:"--sf-space-gutter",gap:"--sf-gap",content_gap:"--sf-content-gap",component_pad:"--sf-component-pad",section_pad:"--sf-section-pad"};for(const[sk,sp] of Object.entries(spAliases)){if(spacing[sk])decls.push(`${sp}: ${spacing[sk]};`)}if(radius.radius_scale)decls.push(`--sf-radius-scale: ${radius.radius_scale};`);if(shadows.shadow_strength)decls.push(`--sf-shadow-strength: calc(${shadows.shadow_strength} + var(--sf-is-dark) * 0.17);`);if(motion.motion_scale)decls.push(`--sf-motion-scale: ${motion.motion_scale};`);const durs=["instant","fast","normal","slow","slower"];for(const d of durs){if(motion[`duration_${d}`])decls.push(`--sf-duration-${d}: calc(${motion[`duration_${d}`]}ms * var(--sf-motion-scale));`)}const zlevels=["below","base","raised","low","mid","high","top","max"];for(const zl of zlevels){if(zindex[zl]!==void 0&&zindex[zl]!=="")decls.push(`--sf-z-${zl}: ${parseInt(zindex[zl],10)};`)}const nums={contrast_bias:"--sf-contrast-bias",contrast_threshold:"--sf-contrast-threshold",opacity_disabled:"--sf-opacity-disabled"};for(const[ck,cp] of Object.entries(nums)){if(contrast[ck]!==void 0&&contrast[ck]!=="")decls.push(`${cp}: ${parseFloat(contrast[ck])};`)}const pxm={focus_ring_width:"--sf-focus-ring-width",focus_ring_offset:"--sf-focus-ring-offset"};for(const[pk,pp] of Object.entries(pxm)){if(contrast[pk]!==void 0&&contrast[pk]!=="")decls.push(`${pp}: ${parseFloat(contrast[pk])}px;`)}if(contrast.focus_ring_style&&["solid","dashed","dotted","double","none"].includes(contrast.focus_ring_style))decls.push(`--sf-focus-ring-style: ${contrast.focus_ring_style};`);if(decls.length===0)return"";return`@layer slashed.overrides {\n\t:root {\n${decls.map(x=>"\t\t"+x).join("\n")}\n\t}\n}`}function sl_downloadCSS(){const css=sl_generateExportCSS(Y);if(!css)return;const blob=new Blob([css],{type:"text/css"});const url=URL.createObjectURL(blob);const a2=document.createElement("a");a2.href=url;a2.download="slashed-custom.css";document.body.appendChild(a2);a2.click();document.body.removeChild(a2);URL.revokeObjectURL(url)}const sl_canExport=E(()=>sl_hasOverrides(Y));var a=bl();let i;var l=y(a),o=y(l);{var c=w=>{var x=hl(),T=y(x);I(()=>C(T,z.error)),j(w,x)},h=w=>{var x=pl();j(w,x)},d=w=>{var x=_l();j(w,x)},f=w=>{var x=gl();j(w,x)},g=w=>{var x=ml();j(w,x)};le(o,w=>{z.error?w(c):z.saving?w(h,1):u(n)?w(d,2):z.dirty?w(f,3):w(g,-1)})}var _=k(l,2),b=y(_),sl_eb=k(b,2),v=k(sl_eb,2),m=y(v);I(()=>{i=Zt(a,1,"bar svelte-1oj49qa",null,i,{dirty:z.dirty}),b.disabled=z.saving,sl_eb.disabled=!u(sl_canExport),v.disabled=z.saving||!z.dirty,C(m,z.saving?"Saving\u2026":"Save changes")}),oe("click",b,r),oe("click",sl_eb,sl_downloadCSS),oe("click",v,s),j(e,a),re()}Be(["click"]);var wl=A('<div class="slashed-svelte-admin svelte-1n46o8q"><header class="slashed-svelte-admin__header svelte-1n46o8q"><h1 class="svelte-1n46o8q">SLASHED Design Tokens</h1> <p class="muted svelte-1n46o8q">Adjust framework tokens, inspect generated variables, and manage the bundled CSS in one place.</p></header> <!> <section class="slashed-svelte-admin__body svelte-1n46o8q"><!></section> <!> <!></div>');function kl(e,t){se(t,!0);const s=["cheatsheet","hooks","variables","classes","bundle"];let r=E(()=>s.includes(z.activeTab));In(()=>{function S(H){z.dirty&&(H.preventDefault(),H.returnValue="")}return window.addEventListener("beforeunload",S),()=>window.removeEventListener("beforeunload",S)});var n=wl(),a=k(y(n),2);Wi(a,{});var i=k(a,2),l=y(i);{var o=S=>{eo(S,{})},c=S=>{vo(S,{})},h=S=>{bo(S,{})},d=S=>{wo(S,{})},f=S=>{xo(S,{})},g=S=>{Eo(S,{})},_=S=>{jo(S,{})},b=S=>{Co(S,{})},v=S=>{Lo(S,{})},m=S=>{Fo(S,{})},w=S=>{Yo(S,{})},x=S=>{Xo(S)},T=S=>{fl(S,{})};le(l,S=>{z.activeTab==="colors"?S(o):z.activeTab==="contrast"?S(c,1):z.activeTab==="typography"?S(h,2):z.activeTab==="spacing"?S(d,3):z.activeTab==="radius"?S(f,4):z.activeTab==="shadows"?S(g,5):z.activeTab==="motion"?S(_,6):z.activeTab==="zindex"?S(b,7):z.activeTab==="variables"?S(v,8):z.activeTab==="classes"?S(m,9):z.activeTab==="bundle"?S(w,10):z.activeTab==="hooks"?S(x,11):z.activeTab==="cheatsheet"&&S(T,12)})}var F=k(i,2);vl(F,{});var G=k(F,2);{var W=S=>{yl(S,{})};le(G,S=>{u(r)||S(W)})}j(e,n),re()}const rn=document.getElementById("slashed-admin-app");rn&&Ci(kl,{target:rn});
 //# sourceMappingURL=app.js.map