/* Zine: 1071 variables. Native defaults: Light / Comfortable / Desktop / Standard. */
:root {
  --color-neutral-0: #FFFFFF;
  --color-neutral-50: #F5F5F5;
  --color-neutral-100: #EAEAEA;
  --color-neutral-200: #D7D7D7;
  --color-neutral-300: #C1C1C1;
  --color-neutral-400: #A8A8A8;
  --color-neutral-500: #909090;
  --color-neutral-600: #666666;
  --color-neutral-700: #5B5B5B;
  --color-neutral-800: #424242;
  --color-neutral-900: #222222;
  --color-neutral-950: #181818;
  --color-neutral-1000: #000000;
  --color-neutral-850: #3C3C3C;
  --color-blue-800: #225DAC;
  --color-paper-50: #FCFCF9;
  --color-paper-100: #F3F5F7;
  --color-blue-400: #81ADEC;
  --color-blue-500: #679EEE;
  --color-blue-600: #4C8EEF;
  --color-blue-700: #2D6FCD;
  --color-blue-50: #EFF5FF;
  --color-blue-900: #172B47;
  --color-green-50: #EDF8F1;
  --color-green-400: #8ACDA5;
  --color-green-700: #216C43;
  --color-green-900: #163825;
  --color-amber-50: #FFF8E7;
  --color-amber-400: #FFCD00;
  --color-amber-700: #795214;
  --color-amber-900: #392B14;
  --color-red-50: #FFF0EE;
  --color-red-400: #F0AAA1;
  --color-red-700: #A4382A;
  --color-red-800: #872D22;
  --color-red-900: #421F1A;
  --color-transparent: #00000000;
  --color-overlay: #00000099;
  --color-shadow: #00000026;
  --color-bg-canvas: var(--color-paper-50);
  --color-bg-surface: var(--color-neutral-0);
  --color-bg-subtle: var(--color-paper-100);
  --color-bg-raised: var(--color-neutral-0);
  --color-bg-inverse: var(--color-neutral-950);
  --color-text-primary: var(--color-neutral-950);
  --color-text-secondary: var(--color-neutral-600);
  --color-text-tertiary: var(--color-neutral-700);
  --color-text-disabled: var(--color-neutral-400);
  --color-text-inverse: var(--color-paper-100);
  --color-text-link: var(--color-blue-800);
  --color-border-default: var(--color-neutral-200);
  --color-border-subtle: var(--color-neutral-100);
  --color-border-strong: var(--color-neutral-600);
  --color-border-control: var(--color-neutral-500);
  --color-border-focus: var(--color-blue-700);
  --color-action-primary-default: var(--color-neutral-950);
  --color-action-primary-hover: var(--color-neutral-800);
  --color-action-primary-pressed: var(--color-neutral-1000);
  --color-action-primary-text: var(--color-paper-100);
  --color-action-secondary-default: var(--color-paper-100);
  --color-action-secondary-hover: var(--color-neutral-200);
  --color-action-secondary-pressed: var(--color-neutral-300);
  --color-action-secondary-text: var(--color-neutral-950);
  --color-action-ghost-default: var(--color-transparent);
  --color-action-ghost-hover: var(--color-neutral-100);
  --color-action-ghost-pressed: var(--color-neutral-200);
  --color-action-ghost-text: var(--color-neutral-950);
  --color-action-danger-default: var(--color-red-700);
  --color-action-danger-hover: var(--color-red-800);
  --color-action-danger-pressed: var(--color-red-900);
  --color-action-danger-text: var(--color-neutral-0);
  --color-action-disabled-bg: var(--color-neutral-100);
  --color-action-disabled-text: var(--color-neutral-400);
  --color-selection-bg: var(--color-blue-50);
  --color-selection-foreground: var(--color-blue-800);
  --color-overlay-scrim: var(--color-overlay);
  --color-effect-shadow: var(--color-shadow);
  --color-decorative-blue: var(--color-blue-400);
  --color-decorative-cream: var(--color-paper-100);
  --color-status-info-bg: var(--color-blue-50);
  --color-status-info-text: var(--color-blue-800);
  --color-status-info-border: var(--color-blue-700);
  --color-status-success-bg: var(--color-green-50);
  --color-status-success-text: var(--color-green-700);
  --color-status-success-border: var(--color-green-700);
  --color-status-warning-bg: var(--color-amber-50);
  --color-status-warning-text: var(--color-amber-700);
  --color-status-warning-border: var(--color-amber-700);
  --color-status-danger-bg: var(--color-red-50);
  --color-status-danger-text: var(--color-red-700);
  --color-status-danger-border: var(--color-red-700);
  --space-0: var(--dimension-0);
  --space-2: var(--dimension-2);
  --space-4: var(--dimension-4);
  --space-6: var(--dimension-6);
  --space-8: var(--dimension-8);
  --space-12: var(--dimension-12);
  --space-16: var(--dimension-16);
  --space-20: var(--dimension-20);
  --space-24: var(--dimension-24);
  --space-32: var(--dimension-32);
  --space-40: var(--dimension-40);
  --space-48: var(--dimension-48);
  --space-64: var(--dimension-64);
  --space-80: var(--dimension-80);
  --space-96: var(--dimension-96);
  --space-120: var(--dimension-120);
  --radius-none: var(--dimension-0);
  --radius-xs: var(--dimension-2);
  --radius-sm: var(--dimension-4);
  --radius-md: var(--dimension-8);
  --radius-lg: var(--dimension-12);
  --radius-xl: var(--dimension-16);
  --radius-full: var(--dimension-999);
  --size-control-sm: var(--dimension-32);
  --size-control-md: var(--dimension-40);
  --size-control-lg: var(--dimension-48);
  --size-icon-sm: var(--dimension-16);
  --size-icon-md: var(--dimension-20);
  --size-icon-lg: var(--dimension-24);
  --size-avatar-sm: var(--dimension-24);
  --size-avatar-md: var(--dimension-32);
  --size-avatar-lg: var(--dimension-48);
  --size-container-max: var(--dimension-1200);
  --size-touch-min: var(--dimension-44);
  --border-width-default: var(--dimension-1);
  --border-width-focus: var(--dimension-2);
  --breakpoint-mobile: var(--dimension-375);
  --breakpoint-tablet: var(--dimension-768);
  --breakpoint-desktop: var(--dimension-1440);
  --font-family-sans: var(--font-stack-sans);
  --font-family-mono: var(--font-stack-mono);
  --type-display-large-size: var(--font-size-64);
  --type-display-large-line-height: var(--line-height-68);
  --type-display-large-tracking: var(--tracking-tightest);
  --type-display-small-size: var(--font-size-48);
  --type-display-small-line-height: var(--line-height-52);
  --type-display-small-tracking: var(--tracking-tighter);
  --type-heading-h1-size: var(--font-size-40);
  --type-heading-h1-line-height: var(--line-height-44);
  --type-heading-h1-tracking: var(--tracking-tight);
  --type-heading-h2-size: var(--font-size-32);
  --type-heading-h2-line-height: var(--line-height-38);
  --type-heading-h2-tracking: var(--tracking-compact);
  --type-heading-h3-size: var(--font-size-24);
  --type-heading-h3-line-height: var(--line-height-30);
  --type-heading-h3-tracking: var(--tracking-slight);
  --type-heading-h4-size: var(--font-size-20);
  --type-heading-h4-line-height: var(--line-height-28);
  --type-heading-h4-tracking: var(--tracking-subtle);
  --type-body-large-size: var(--font-size-18);
  --type-body-large-line-height: var(--line-height-28);
  --type-body-large-tracking: var(--tracking-normal);
  --type-body-medium-size: var(--font-size-16);
  --type-body-medium-line-height: var(--line-height-24);
  --type-body-medium-tracking: var(--tracking-normal);
  --type-body-small-size: var(--font-size-14);
  --type-body-small-line-height: var(--line-height-20);
  --type-body-small-tracking: var(--tracking-normal);
  --type-label-large-size: var(--font-size-16);
  --type-label-large-line-height: var(--line-height-20);
  --type-label-large-tracking: var(--tracking-normal);
  --type-label-medium-size: var(--font-size-14);
  --type-label-medium-line-height: var(--line-height-20);
  --type-label-medium-tracking: var(--tracking-normal);
  --type-label-small-size: var(--font-size-12);
  --type-label-small-line-height: var(--line-height-16);
  --type-label-small-tracking: var(--tracking-wide);
  --type-caption-size: var(--font-size-12);
  --type-caption-line-height: var(--line-height-18);
  --type-caption-tracking: var(--tracking-wide);
  --type-code-size: var(--font-size-12);
  --type-code-line-height: var(--line-height-18);
  --type-code-tracking: var(--tracking-normal);
  --motion-duration-fast: 120ms;
  --motion-duration-standard: 180ms;
  --motion-duration-slow: 280ms;
  --motion-duration-reduced: 0ms;
  --motion-easing-standard: cubic-bezier(0.2,0,0,1);
  --motion-easing-enter: cubic-bezier(0,0,0.2,1);
  --motion-easing-exit: cubic-bezier(0.4,0,1,1);
  --elevation-low-blur: var(--dimension-8);
  --elevation-low-y: var(--dimension-2);
  --elevation-high-blur: var(--dimension-32);
  --elevation-high-y: var(--dimension-12);
  --color-paper-200: #D8D8CE;
  --color-paper-300: #C2C2B8;
  --color-paper-400: #ABABA2;
  --color-paper-500: #95948C;
  --color-paper-600: #7E7E77;
  --color-paper-700: #686761;
  --color-paper-800: #51504B;
  --color-paper-900: #3B3A35;
  --color-paper-950: #2F2E2A;
  --color-blue-100: #DFEBFC;
  --color-blue-200: #C0D6F7;
  --color-blue-300: #A0C2F1;
  --color-blue-950: #101A2A;
  --color-green-100: #DFF2E6;
  --color-green-200: #C3E6D0;
  --color-green-300: #A6D9BB;
  --color-green-500: #67AD84;
  --color-green-600: #448C64;
  --color-green-800: #1C5234;
  --color-green-950: #0F2118;
  --color-amber-100: #FFF2C6;
  --color-amber-200: #FFE684;
  --color-amber-300: #FFD942;
  --color-amber-500: #D2A407;
  --color-amber-600: #A67B0D;
  --color-amber-800: #593E14;
  --color-amber-950: #201A10;
  --color-red-100: #FDE6E3;
  --color-red-200: #F9D2CD;
  --color-red-300: #F4BEB7;
  --color-red-500: #D78479;
  --color-red-600: #BD5E52;
  --color-red-950: #251413;
  --dimension-0: 0px;
  --dimension-2: 2px;
  --dimension-4: 4px;
  --dimension-6: 6px;
  --dimension-8: 8px;
  --dimension-12: 12px;
  --dimension-16: 16px;
  --dimension-20: 20px;
  --dimension-24: 24px;
  --dimension-32: 32px;
  --dimension-40: 40px;
  --dimension-48: 48px;
  --dimension-64: 64px;
  --dimension-80: 80px;
  --dimension-96: 96px;
  --dimension-120: 120px;
  --dimension-999: 999px;
  --dimension-1200: 1200px;
  --dimension-44: 44px;
  --dimension-1: 1px;
  --dimension-375: 375px;
  --dimension-768: 768px;
  --dimension-1440: 1440px;
  --dimension-3: 3px;
  --dimension-10: 10px;
  --dimension-28: 28px;
  --dimension-36: 36px;
  --dimension-56: 56px;
  --dimension-72: 72px;
  --dimension-112: 112px;
  --dimension-128: 128px;
  --dimension-160: 160px;
  --dimension-192: 192px;
  --dimension-200: 200px;
  --dimension-240: 240px;
  --dimension-256: 256px;
  --dimension-280: 280px;
  --dimension-320: 320px;
  --dimension-343: 343px;
  --dimension-360: 360px;
  --dimension-400: 400px;
  --dimension-480: 480px;
  --dimension-560: 560px;
  --dimension-640: 640px;
  --dimension-720: 720px;
  --dimension-960: 960px;
  --dimension-1024: 1024px;
  --dimension-1280: 1280px;
  --dimension-1536: 1536px;
  --space-1: var(--dimension-1);
  --space-3: var(--dimension-3);
  --space-10: var(--dimension-10);
  --space-28: var(--dimension-28);
  --space-36: var(--dimension-36);
  --space-56: var(--dimension-56);
  --space-72: var(--dimension-72);
  --space-112: var(--dimension-112);
  --space-128: var(--dimension-128);
  --space-160: var(--dimension-160);
  --size-control-xs: var(--dimension-24);
  --size-control-xl: var(--dimension-56);
  --size-icon-xs: var(--dimension-12);
  --size-icon-xl: var(--dimension-32);
  --size-avatar-xs: var(--dimension-16);
  --size-avatar-xl: var(--dimension-64);
  --size-avatar-2xl: var(--dimension-96);
  --size-container-sm: var(--dimension-640);
  --size-container-md: var(--dimension-768);
  --size-container-lg: var(--dimension-1024);
  --size-container-xl: var(--dimension-1280);
  --border-width-none: var(--dimension-0);
  --border-width-strong: var(--dimension-3);
  --focus-offset: var(--dimension-2);
  --spacing-stack-tight: var(--space-8);
  --spacing-stack-default: var(--space-16);
  --spacing-stack-relaxed: var(--space-24);
  --spacing-inline-tight: var(--space-4);
  --spacing-inline-default: var(--space-8);
  --spacing-inline-relaxed: var(--space-16);
  --spacing-inset-compact: var(--space-12);
  --spacing-inset-default: var(--space-16);
  --spacing-inset-relaxed: var(--space-24);
  --spacing-section-default: var(--space-64);
  --color-icon-primary: var(--color-text-primary);
  --color-icon-secondary: var(--color-text-secondary);
  --color-icon-disabled: var(--color-text-disabled);
  --color-icon-inverse: var(--color-text-inverse);
  --color-icon-brand: var(--color-selection-foreground);
  --color-focus-ring: var(--color-border-focus);
  --color-focus-gap: var(--color-bg-canvas);
  --color-surface-hover: var(--color-action-ghost-hover);
  --color-surface-pressed: var(--color-action-ghost-pressed);
  --color-surface-selected: var(--color-selection-bg);
  --color-text-placeholder: var(--color-text-secondary);
  --color-text-on-brand: var(--color-neutral-0);
  --color-border-disabled: var(--color-border-subtle);
  --color-icon-info: var(--color-status-info-text);
  --color-status-info-solid: var(--color-status-info-text);
  --color-status-info-on-solid: var(--color-neutral-0);
  --color-icon-success: var(--color-status-success-text);
  --color-status-success-solid: var(--color-status-success-text);
  --color-status-success-on-solid: var(--color-neutral-0);
  --color-icon-warning: var(--color-status-warning-text);
  --color-status-warning-solid: var(--color-status-warning-text);
  --color-status-warning-on-solid: var(--color-neutral-0);
  --color-icon-danger: var(--color-status-danger-text);
  --color-status-danger-solid: var(--color-status-danger-text);
  --color-status-danger-on-solid: var(--color-neutral-0);
  --color-chart-series-1: var(--color-blue-700);
  --color-chart-series-2: var(--color-green-700);
  --color-chart-series-3: var(--color-amber-700);
  --color-chart-series-4: var(--color-red-700);
  --font-stack-sans: "Geist";
  --font-stack-mono: "IBM Plex Mono";
  --font-weight-light: 300;
  --font-style-light: "Light";
  --font-weight-light: var(--font-weight-light);
  --font-weight-regular: 400;
  --font-style-regular: "Regular";
  --font-weight-regular: var(--font-weight-regular);
  --font-weight-medium: 500;
  --font-style-medium: "Medium";
  --font-weight-medium: var(--font-weight-medium);
  --font-weight-semibold: 600;
  --font-style-semibold: "SemiBold";
  --font-weight-semibold: var(--font-weight-semibold);
  --font-size-64: 64px;
  --line-height-68: 68px;
  --tracking-tightest: -2px;
  --type-display-large-family: var(--font-family-sans);
  --type-display-large-style: var(--font-style-light);
  --type-display-large-weight: var(--font-weight-light);
  --type-display-large-paragraph-spacing: var(--dimension-0);
  --font-size-48: 48px;
  --line-height-52: 52px;
  --tracking-tighter: -1.4px;
  --type-display-small-family: var(--font-family-sans);
  --type-display-small-style: var(--font-style-light);
  --type-display-small-weight: var(--font-weight-light);
  --type-display-small-paragraph-spacing: var(--dimension-0);
  --font-size-40: 40px;
  --line-height-44: 44px;
  --tracking-tight: -1.2px;
  --type-heading-h1-family: var(--font-family-sans);
  --type-heading-h1-style: var(--font-style-regular);
  --type-heading-h1-weight: var(--font-weight-regular);
  --type-heading-h1-paragraph-spacing: var(--dimension-0);
  --font-size-32: 32px;
  --line-height-38: 38px;
  --tracking-compact: -0.8px;
  --type-heading-h2-family: var(--font-family-sans);
  --type-heading-h2-style: var(--font-style-regular);
  --type-heading-h2-weight: var(--font-weight-regular);
  --type-heading-h2-paragraph-spacing: var(--dimension-0);
  --font-size-24: 24px;
  --line-height-30: 30px;
  --tracking-slight: -0.4px;
  --type-heading-h3-family: var(--font-family-sans);
  --type-heading-h3-style: var(--font-style-medium);
  --type-heading-h3-weight: var(--font-weight-medium);
  --type-heading-h3-paragraph-spacing: var(--dimension-0);
  --font-size-20: 20px;
  --line-height-28: 28px;
  --tracking-subtle: -0.2px;
  --type-heading-h4-family: var(--font-family-sans);
  --type-heading-h4-style: var(--font-style-medium);
  --type-heading-h4-weight: var(--font-weight-medium);
  --type-heading-h4-paragraph-spacing: var(--dimension-0);
  --font-size-18: 18px;
  --tracking-normal: 0px;
  --type-body-large-family: var(--font-family-sans);
  --type-body-large-style: var(--font-style-regular);
  --type-body-large-weight: var(--font-weight-regular);
  --type-body-large-paragraph-spacing: var(--dimension-16);
  --font-size-16: 16px;
  --line-height-24: 24px;
  --type-body-medium-family: var(--font-family-sans);
  --type-body-medium-style: var(--font-style-regular);
  --type-body-medium-weight: var(--font-weight-regular);
  --type-body-medium-paragraph-spacing: var(--dimension-16);
  --font-size-14: 14px;
  --line-height-20: 20px;
  --type-body-small-family: var(--font-family-sans);
  --type-body-small-style: var(--font-style-regular);
  --type-body-small-weight: var(--font-weight-regular);
  --type-body-small-paragraph-spacing: var(--dimension-16);
  --type-label-large-family: var(--font-family-sans);
  --type-label-large-style: var(--font-style-medium);
  --type-label-large-weight: var(--font-weight-medium);
  --type-label-large-paragraph-spacing: var(--dimension-0);
  --type-label-medium-family: var(--font-family-sans);
  --type-label-medium-style: var(--font-style-medium);
  --type-label-medium-weight: var(--font-weight-medium);
  --type-label-medium-paragraph-spacing: var(--dimension-0);
  --font-size-12: 12px;
  --line-height-16: 16px;
  --tracking-wide: 0.2px;
  --type-label-small-family: var(--font-family-sans);
  --type-label-small-style: var(--font-style-medium);
  --type-label-small-weight: var(--font-weight-medium);
  --type-label-small-paragraph-spacing: var(--dimension-0);
  --line-height-18: 18px;
  --type-caption-family: var(--font-family-sans);
  --type-caption-style: var(--font-style-regular);
  --type-caption-weight: var(--font-weight-regular);
  --type-caption-paragraph-spacing: var(--dimension-0);
  --type-code-family: var(--font-family-mono);
  --type-code-style: var(--font-style-regular);
  --type-code-weight: var(--font-weight-regular);
  --type-code-paragraph-spacing: var(--dimension-0);
  --density-control-height: var(--dimension-40);
  --density-control-padding-x: var(--dimension-16);
  --density-control-gap: var(--dimension-8);
  --density-row-height: var(--dimension-48);
  --density-inset: var(--dimension-16);
  --responsive-viewport-width: var(--dimension-1440);
  --responsive-container-max: var(--dimension-1200);
  --responsive-page-margin: var(--dimension-64);
  --responsive-grid-gutter: var(--dimension-24);
  --responsive-section-gap: var(--dimension-64);
  --responsive-content-gap: var(--dimension-24);
  --responsive-sidebar-width: var(--dimension-240);
  --responsive-dialog-max-width: var(--dimension-560);
  --responsive-drawer-width: var(--dimension-480);
  --responsive-grid-columns: 12;
  --responsive-sidebar-visible: 1;
  --responsive-display-size: var(--font-size-64);
  --responsive-display-line-height: var(--line-height-68);
  --opacity-none: 0;
  --opacity-subtle: 0.08;
  --opacity-muted: 0.4;
  --opacity-disabled: 0.4;
  --opacity-scrim: 0.6;
  --opacity-full: 1;
  --layer-base: 0;
  --layer-dropdown: 100;
  --layer-sticky: 200;
  --layer-overlay: 300;
  --layer-modal: 400;
  --layer-toast: 500;
  --layer-tooltip: 600;
  --elevation-low-x: var(--dimension-0);
  --elevation-low-spread: var(--dimension-0);
  --elevation-medium-x: var(--dimension-0);
  --elevation-medium-y: var(--dimension-8);
  --elevation-medium-blur: var(--dimension-24);
  --elevation-medium-spread: var(--dimension-0);
  --elevation-high-x: var(--dimension-0);
  --elevation-high-spread: var(--dimension-0);
  --motion-duration-instant: 0ms;
  --motion-duration-micro: 80ms;
  --motion-duration-moderate: 240ms;
  --motion-duration-enter: 320ms;
  --motion-duration-exit: 180ms;
  --motion-duration-stagger: 40ms;
  --motion-distance-subtle: 4px;
  --motion-distance-default: 8px;
  --motion-distance-large: 16px;
  --component-button-primary-control-height-sm: var(--size-control-sm);
  --component-button-primary-radius-sm: var(--radius-sm);
  --component-button-primary-background-default: var(--color-action-primary-default);
  --component-button-primary-icon-size-sm: var(--size-icon-sm);
  --component-button-primary-foreground-default: var(--color-action-primary-text);
  --component-button-primary-background-hover: var(--color-action-primary-hover);
  --component-button-primary-background-pressed: var(--color-action-primary-pressed);
  --component-button-primary-border-width-focus: var(--border-width-focus);
  --component-button-primary-border-focus: var(--color-border-focus);
  --component-button-primary-background-disabled: var(--color-action-disabled-bg);
  --component-button-primary-foreground-disabled: var(--color-action-disabled-text);
  --component-button-primary-control-height-md: var(--density-control-height);
  --component-button-primary-control-height-lg: var(--size-control-lg);
  --component-button-primary-icon-size-md: var(--size-icon-md);
  --component-button-secondary-control-height-sm: var(--size-control-sm);
  --component-button-secondary-radius-sm: var(--radius-sm);
  --component-button-secondary-border-width-default: var(--border-width-default);
  --component-button-secondary-background-default: var(--color-action-secondary-default);
  --component-button-secondary-border-default: var(--color-border-default);
  --component-button-secondary-icon-size-sm: var(--size-icon-sm);
  --component-button-secondary-foreground-default: var(--color-action-secondary-text);
  --component-button-secondary-background-hover: var(--color-action-secondary-hover);
  --component-button-secondary-background-pressed: var(--color-action-secondary-pressed);
  --component-button-secondary-border-width-focus: var(--border-width-focus);
  --component-button-secondary-border-focus: var(--color-border-focus);
  --component-button-secondary-background-disabled: var(--color-action-disabled-bg);
  --component-button-secondary-foreground-disabled: var(--color-action-disabled-text);
  --component-button-secondary-control-height-md: var(--density-control-height);
  --component-button-secondary-control-height-lg: var(--size-control-lg);
  --component-button-secondary-icon-size-md: var(--size-icon-md);
  --component-button-ghost-control-height-sm: var(--size-control-sm);
  --component-button-ghost-radius-sm: var(--radius-sm);
  --component-button-ghost-background-default: var(--color-action-ghost-default);
  --component-button-ghost-foreground-default: var(--color-action-ghost-text);
  --component-button-ghost-icon-size-sm: var(--size-icon-sm);
  --component-button-ghost-background-hover: var(--color-action-ghost-hover);
  --component-button-ghost-background-pressed: var(--color-action-ghost-pressed);
  --component-button-ghost-border-width-focus: var(--border-width-focus);
  --component-button-ghost-border-focus: var(--color-border-focus);
  --component-button-ghost-background-disabled: var(--color-action-disabled-bg);
  --component-button-ghost-foreground-disabled: var(--color-action-disabled-text);
  --component-button-ghost-control-height-md: var(--density-control-height);
  --component-button-ghost-control-height-lg: var(--size-control-lg);
  --component-button-ghost-icon-size-md: var(--size-icon-md);
  --component-button-danger-control-height-sm: var(--size-control-sm);
  --component-button-danger-radius-sm: var(--radius-sm);
  --component-button-danger-background-default: var(--color-action-danger-default);
  --component-button-danger-icon-size-sm: var(--size-icon-sm);
  --component-button-danger-foreground-default: var(--color-action-danger-text);
  --component-button-danger-background-hover: var(--color-action-danger-hover);
  --component-button-danger-background-pressed: var(--color-action-danger-pressed);
  --component-button-danger-border-width-focus: var(--border-width-focus);
  --component-button-danger-border-focus: var(--color-border-focus);
  --component-button-danger-background-disabled: var(--color-action-disabled-bg);
  --component-button-danger-foreground-disabled: var(--color-action-disabled-text);
  --component-button-danger-control-height-md: var(--density-control-height);
  --component-button-danger-control-height-lg: var(--size-control-lg);
  --component-button-danger-icon-size-md: var(--size-icon-md);
  --component-icon-button-control-height-sm: var(--size-control-sm);
  --component-icon-button-radius-sm: var(--radius-sm);
  --component-icon-button-border-width-default: var(--border-width-default);
  --component-icon-button-background-secondary-default: var(--color-action-secondary-default);
  --component-icon-button-border-default: var(--color-border-default);
  --component-icon-button-icon-size-sm: var(--size-icon-sm);
  --component-icon-button-text-primary: var(--color-text-primary);
  --component-icon-button-background-secondary-hover: var(--color-action-secondary-hover);
  --component-icon-button-background-secondary-pressed: var(--color-action-secondary-pressed);
  --component-icon-button-border-width-focus: var(--border-width-focus);
  --component-icon-button-border-focus: var(--color-border-focus);
  --component-icon-button-background-disabled: var(--color-action-disabled-bg);
  --component-icon-button-text-disabled: var(--color-text-disabled);
  --component-icon-button-control-height-md: var(--density-control-height);
  --component-icon-button-icon-size-md: var(--size-icon-md);
  --component-icon-button-background-ghost-default: var(--color-action-ghost-default);
  --component-icon-button-background-ghost-hover: var(--color-action-ghost-hover);
  --component-icon-button-background-ghost-pressed: var(--color-action-ghost-pressed);
  --component-link-text-link: var(--color-text-link);
  --component-link-icon-size-sm: var(--size-icon-sm);
  --component-link-border-width-focus: var(--border-width-focus);
  --component-link-border-focus: var(--color-border-focus);
  --component-link-text-disabled: var(--color-text-disabled);
  --component-text-field-text-primary: var(--color-text-primary);
  --component-text-field-radius-sm: var(--radius-sm);
  --component-text-field-border-width-default: var(--border-width-default);
  --component-text-field-surface-surface: var(--color-bg-surface);
  --component-text-field-border-control: var(--color-border-control);
  --component-text-field-text-secondary: var(--color-text-secondary);
  --component-text-field-border-strong: var(--color-border-strong);
  --component-text-field-border-width-focus: var(--border-width-focus);
  --component-text-field-border-focus: var(--color-border-focus);
  --component-text-field-status-danger-border: var(--color-status-danger-border);
  --component-text-field-status-danger-text: var(--color-status-danger-text);
  --component-text-field-text-disabled: var(--color-text-disabled);
  --component-text-field-background-disabled: var(--color-action-disabled-bg);
  --component-text-field-border-default: var(--color-border-default);
  --component-text-area-text-primary: var(--color-text-primary);
  --component-text-area-radius-sm: var(--radius-sm);
  --component-text-area-border-width-default: var(--border-width-default);
  --component-text-area-surface-surface: var(--color-bg-surface);
  --component-text-area-border-control: var(--color-border-control);
  --component-text-area-text-secondary: var(--color-text-secondary);
  --component-text-area-border-strong: var(--color-border-strong);
  --component-text-area-border-width-focus: var(--border-width-focus);
  --component-text-area-border-focus: var(--color-border-focus);
  --component-text-area-status-danger-border: var(--color-status-danger-border);
  --component-text-area-status-danger-text: var(--color-status-danger-text);
  --component-text-area-text-disabled: var(--color-text-disabled);
  --component-text-area-background-disabled: var(--color-action-disabled-bg);
  --component-text-area-border-default: var(--color-border-default);
  --component-select-text-primary: var(--color-text-primary);
  --component-select-radius-sm: var(--radius-sm);
  --component-select-border-width-default: var(--border-width-default);
  --component-select-surface-surface: var(--color-bg-surface);
  --component-select-border-control: var(--color-border-control);
  --component-select-text-secondary: var(--color-text-secondary);
  --component-select-border-strong: var(--color-border-strong);
  --component-select-border-width-focus: var(--border-width-focus);
  --component-select-border-focus: var(--color-border-focus);
  --component-select-status-danger-border: var(--color-status-danger-border);
  --component-select-status-danger-text: var(--color-status-danger-text);
  --component-select-text-disabled: var(--color-text-disabled);
  --component-select-background-disabled: var(--color-action-disabled-bg);
  --component-select-border-default: var(--color-border-default);
  --component-search-field-text-primary: var(--color-text-primary);
  --component-search-field-radius-sm: var(--radius-sm);
  --component-search-field-border-width-default: var(--border-width-default);
  --component-search-field-surface-surface: var(--color-bg-surface);
  --component-search-field-border-control: var(--color-border-control);
  --component-search-field-text-secondary: var(--color-text-secondary);
  --component-search-field-border-strong: var(--color-border-strong);
  --component-search-field-border-width-focus: var(--border-width-focus);
  --component-search-field-border-focus: var(--color-border-focus);
  --component-search-field-status-danger-border: var(--color-status-danger-border);
  --component-search-field-status-danger-text: var(--color-status-danger-text);
  --component-search-field-text-disabled: var(--color-text-disabled);
  --component-search-field-background-disabled: var(--color-action-disabled-bg);
  --component-search-field-border-default: var(--color-border-default);
  --component-checkbox-radius-sm: var(--radius-sm);
  --component-checkbox-border-width-default: var(--border-width-default);
  --component-checkbox-surface-surface: var(--color-bg-surface);
  --component-checkbox-border-control: var(--color-border-control);
  --component-checkbox-text-primary: var(--color-text-primary);
  --component-checkbox-border-strong: var(--color-border-strong);
  --component-checkbox-border-width-focus: var(--border-width-focus);
  --component-checkbox-border-focus: var(--color-border-focus);
  --component-checkbox-background-disabled: var(--color-action-disabled-bg);
  --component-checkbox-border-default: var(--color-border-default);
  --component-checkbox-text-disabled: var(--color-text-disabled);
  --component-checkbox-selection-foreground: var(--color-selection-foreground);
  --component-checkbox-surface-canvas: var(--color-bg-canvas);
  --component-radio-radius-full: var(--radius-full);
  --component-radio-border-width-default: var(--border-width-default);
  --component-radio-surface-surface: var(--color-bg-surface);
  --component-radio-border-control: var(--color-border-control);
  --component-radio-text-primary: var(--color-text-primary);
  --component-radio-border-strong: var(--color-border-strong);
  --component-radio-border-width-focus: var(--border-width-focus);
  --component-radio-border-focus: var(--color-border-focus);
  --component-radio-background-disabled: var(--color-action-disabled-bg);
  --component-radio-border-default: var(--color-border-default);
  --component-radio-text-disabled: var(--color-text-disabled);
  --component-radio-selection-foreground: var(--color-selection-foreground);
  --component-radio-surface-canvas: var(--color-bg-canvas);
  --component-switch-radius-full: var(--radius-full);
  --component-switch-border-width-default: var(--border-width-default);
  --component-switch-surface-surface: var(--color-bg-surface);
  --component-switch-border-control: var(--color-border-control);
  --component-switch-text-secondary: var(--color-text-secondary);
  --component-switch-text-primary: var(--color-text-primary);
  --component-switch-border-strong: var(--color-border-strong);
  --component-switch-border-width-focus: var(--border-width-focus);
  --component-switch-border-focus: var(--color-border-focus);
  --component-switch-background-disabled: var(--color-action-disabled-bg);
  --component-switch-border-default: var(--color-border-default);
  --component-switch-text-disabled: var(--color-text-disabled);
  --component-switch-selection-foreground: var(--color-selection-foreground);
  --component-switch-surface-canvas: var(--color-bg-canvas);
  --component-slider-text-primary: var(--color-text-primary);
  --component-slider-text-secondary: var(--color-text-secondary);
  --component-slider-radius-full: var(--radius-full);
  --component-slider-surface-subtle: var(--color-bg-subtle);
  --component-slider-selection-foreground: var(--color-selection-foreground);
  --component-slider-border-width-focus: var(--border-width-focus);
  --component-slider-border-focus: var(--color-border-focus);
  --component-slider-text-disabled: var(--color-text-disabled);
  --component-tab-radius-sm: var(--radius-sm);
  --component-tab-text-secondary: var(--color-text-secondary);
  --component-tab-background-ghost-hover: var(--color-action-ghost-hover);
  --component-tab-border-width-focus: var(--border-width-focus);
  --component-tab-border-focus: var(--color-border-focus);
  --component-tab-background-disabled: var(--color-action-disabled-bg);
  --component-tab-text-disabled: var(--color-text-disabled);
  --component-tab-selection-bg: var(--color-selection-bg);
  --component-tab-selection-foreground: var(--color-selection-foreground);
  --component-navigation-item-radius-sm: var(--radius-sm);
  --component-navigation-item-text-secondary: var(--color-text-secondary);
  --component-navigation-item-background-ghost-hover: var(--color-action-ghost-hover);
  --component-navigation-item-border-width-focus: var(--border-width-focus);
  --component-navigation-item-border-focus: var(--color-border-focus);
  --component-navigation-item-background-disabled: var(--color-action-disabled-bg);
  --component-navigation-item-text-disabled: var(--color-text-disabled);
  --component-navigation-item-selection-bg: var(--color-selection-bg);
  --component-navigation-item-selection-foreground: var(--color-selection-foreground);
  --component-pagination-item-radius-sm: var(--radius-sm);
  --component-pagination-item-text-secondary: var(--color-text-secondary);
  --component-pagination-item-background-ghost-hover: var(--color-action-ghost-hover);
  --component-pagination-item-border-width-focus: var(--border-width-focus);
  --component-pagination-item-border-focus: var(--color-border-focus);
  --component-pagination-item-background-disabled: var(--color-action-disabled-bg);
  --component-pagination-item-text-disabled: var(--color-text-disabled);
  --component-pagination-item-selection-bg: var(--color-selection-bg);
  --component-pagination-item-selection-foreground: var(--color-selection-foreground);
  --component-breadcrumb-text-link: var(--color-text-link);
  --component-breadcrumb-text-secondary: var(--color-text-secondary);
  --component-breadcrumb-text-primary: var(--color-text-primary);
  --component-accordion-border-width-default: var(--border-width-default);
  --component-accordion-surface-surface: var(--color-bg-surface);
  --component-accordion-border-default: var(--color-border-default);
  --component-accordion-text-primary: var(--color-text-primary);
  --component-accordion-text-secondary: var(--color-text-secondary);
  --component-accordion-surface-subtle: var(--color-bg-subtle);
  --component-accordion-border-width-focus: var(--border-width-focus);
  --component-accordion-border-focus: var(--color-border-focus);
  --component-badge-radius-full: var(--radius-full);
  --component-badge-surface-subtle: var(--color-bg-subtle);
  --component-badge-text-secondary: var(--color-text-secondary);
  --component-badge-border-width-default: var(--border-width-default);
  --component-badge-border-default: var(--color-border-default);
  --component-badge-status-info-bg: var(--color-status-info-bg);
  --component-badge-status-info-text: var(--color-status-info-text);
  --component-badge-status-info-border: var(--color-status-info-border);
  --component-badge-status-success-bg: var(--color-status-success-bg);
  --component-badge-status-success-text: var(--color-status-success-text);
  --component-badge-status-success-border: var(--color-status-success-border);
  --component-badge-status-warning-bg: var(--color-status-warning-bg);
  --component-badge-status-warning-text: var(--color-status-warning-text);
  --component-badge-status-warning-border: var(--color-status-warning-border);
  --component-badge-status-danger-bg: var(--color-status-danger-bg);
  --component-badge-status-danger-text: var(--color-status-danger-text);
  --component-badge-status-danger-border: var(--color-status-danger-border);
  --component-avatar-avatar-size-sm: var(--size-avatar-sm);
  --component-avatar-radius-full: var(--radius-full);
  --component-avatar-surface-subtle: var(--color-bg-subtle);
  --component-avatar-text-primary: var(--color-text-primary);
  --component-avatar-border-width-focus: var(--border-width-focus);
  --component-avatar-status-success-border: var(--color-status-success-border);
  --component-avatar-status-warning-border: var(--color-status-warning-border);
  --component-avatar-avatar-size-md: var(--size-avatar-md);
  --component-avatar-avatar-size-lg: var(--size-avatar-lg);
  --component-card-radius-md: var(--radius-md);
  --component-card-border-width-default: var(--border-width-default);
  --component-card-surface-surface: var(--color-bg-surface);
  --component-card-border-default: var(--color-border-default);
  --component-card-text-link: var(--color-text-link);
  --component-card-text-primary: var(--color-text-primary);
  --component-card-text-secondary: var(--color-text-secondary);
  --component-card-surface-subtle: var(--color-bg-subtle);
  --component-card-selection-bg: var(--color-selection-bg);
  --component-card-border-focus: var(--color-border-focus);
  --component-card-text-disabled: var(--color-text-disabled);
  --component-table-cell-radius-none: var(--radius-none);
  --component-table-cell-surface-surface: var(--color-bg-surface);
  --component-table-cell-text-primary: var(--color-text-primary);
  --component-table-cell-surface-subtle: var(--color-bg-subtle);
  --component-table-cell-selection-bg: var(--color-selection-bg);
  --component-table-cell-status-success-text: var(--color-status-success-text);
  --component-table-header-radius-none: var(--radius-none);
  --component-table-header-surface-subtle: var(--color-bg-subtle);
  --component-table-header-text-secondary: var(--color-text-secondary);
  --component-divider-radius-none: var(--radius-none);
  --component-divider-border-subtle: var(--color-border-subtle);
  --component-alert-radius-md: var(--radius-md);
  --component-alert-border-width-default: var(--border-width-default);
  --component-alert-status-info-bg: var(--color-status-info-bg);
  --component-alert-status-info-border: var(--color-status-info-border);
  --component-alert-status-info-text: var(--color-status-info-text);
  --component-alert-text-secondary: var(--color-text-secondary);
  --component-alert-status-success-bg: var(--color-status-success-bg);
  --component-alert-status-success-border: var(--color-status-success-border);
  --component-alert-status-success-text: var(--color-status-success-text);
  --component-alert-status-warning-bg: var(--color-status-warning-bg);
  --component-alert-status-warning-border: var(--color-status-warning-border);
  --component-alert-status-warning-text: var(--color-status-warning-text);
  --component-alert-status-danger-bg: var(--color-status-danger-bg);
  --component-alert-status-danger-border: var(--color-status-danger-border);
  --component-alert-status-danger-text: var(--color-status-danger-text);
  --component-toast-radius-md: var(--radius-md);
  --component-toast-border-width-default: var(--border-width-default);
  --component-toast-surface-raised: var(--color-bg-raised);
  --component-toast-border-default: var(--color-border-default);
  --component-toast-effect-shadow: var(--color-effect-shadow);
  --component-toast-status-info-text: var(--color-status-info-text);
  --component-toast-text-primary: var(--color-text-primary);
  --component-toast-text-secondary: var(--color-text-secondary);
  --component-toast-status-success-text: var(--color-status-success-text);
  --component-toast-status-warning-text: var(--color-status-warning-text);
  --component-toast-status-danger-text: var(--color-status-danger-text);
  --component-tooltip-effect-shadow: var(--color-effect-shadow);
  --component-tooltip-radius-sm: var(--radius-sm);
  --component-tooltip-surface-inverse: var(--color-bg-inverse);
  --component-tooltip-text-inverse: var(--color-text-inverse);
  --component-progress-text-primary: var(--color-text-primary);
  --component-progress-text-secondary: var(--color-text-secondary);
  --component-progress-radius-full: var(--radius-full);
  --component-progress-surface-subtle: var(--color-bg-subtle);
  --component-progress-selection-foreground: var(--color-selection-foreground);
  --component-progress-status-success-text: var(--color-status-success-text);
  --component-spinner-selection-foreground: var(--color-selection-foreground);
  --component-skeleton-radius-sm: var(--radius-sm);
  --component-skeleton-surface-subtle: var(--color-bg-subtle);
  --component-skeleton-radius-full: var(--radius-full);
  --component-empty-state-radius-md: var(--radius-md);
  --component-empty-state-surface-surface: var(--color-bg-surface);
  --component-empty-state-text-link: var(--color-text-link);
  --component-empty-state-text-primary: var(--color-text-primary);
  --component-empty-state-text-secondary: var(--color-text-secondary);
  --component-menu-item-radius-sm: var(--radius-sm);
  --component-menu-item-surface-surface: var(--color-bg-surface);
  --component-menu-item-text-primary: var(--color-text-primary);
  --component-menu-item-text-secondary: var(--color-text-secondary);
  --component-menu-item-surface-subtle: var(--color-bg-subtle);
  --component-menu-item-border-width-focus: var(--border-width-focus);
  --component-menu-item-border-focus: var(--color-border-focus);
  --component-menu-item-text-disabled: var(--color-text-disabled);
  --component-menu-item-status-danger-text: var(--color-status-danger-text);
  --component-dialog-radius-md: var(--radius-md);
  --component-dialog-border-width-default: var(--border-width-default);
  --component-dialog-surface-raised: var(--color-bg-raised);
  --component-dialog-border-default: var(--color-border-default);
  --component-dialog-effect-shadow: var(--color-effect-shadow);
  --component-dialog-text-primary: var(--color-text-primary);
  --component-dialog-text-secondary: var(--color-text-secondary);
  --component-popover-radius-md: var(--radius-md);
  --component-popover-border-width-default: var(--border-width-default);
  --component-popover-surface-raised: var(--color-bg-raised);
  --component-popover-border-default: var(--color-border-default);
  --component-popover-effect-shadow: var(--color-effect-shadow);
  --component-popover-text-secondary: var(--color-text-secondary);
  --component-popover-text-primary: var(--color-text-primary);
  --component-drawer-radius-none: var(--radius-none);
  --component-drawer-border-width-default: var(--border-width-default);
  --component-drawer-surface-raised: var(--color-bg-raised);
  --component-drawer-border-default: var(--color-border-default);
  --component-drawer-effect-shadow: var(--color-effect-shadow);
  --component-drawer-text-primary: var(--color-text-primary);
  --component-drawer-text-secondary: var(--color-text-secondary);
  --color-mono-paper: #F6F6F3;
  --color-mono-blue: #4C94FC;
  --color-mono-sheet: #EAEAE6;
  --brand-mono-canvas: var(--color-mono-paper);
  --brand-mono-surface: var(--color-paper-50);
  --brand-mono-subtle: var(--color-mono-sheet);
  --brand-mono-ink: var(--color-neutral-900);
  --brand-mono-muted: var(--color-neutral-600);
  --brand-mono-accent: var(--color-blue-800);
  --brand-mono-accent-decorative: var(--color-mono-blue);
  --brand-mono-grid: var(--color-blue-200);
  --brand-mono-rule: var(--color-blue-300);
  --brand-mono-selected: var(--color-blue-800);
  --brand-mono-on-selected: var(--color-neutral-0);
  --brand-mono-hover: var(--color-blue-100);
  --brand-mono-disabled: var(--color-text-disabled);
  --brand-mono-shadow: var(--color-blue-400);
  --brand-mono-blueprint: var(--color-blue-50);
  --brand-mono-inverse: var(--color-neutral-900);
  --brand-mono-on-inverse: var(--color-mono-paper);
  --font-size-80: 80px;
  --line-height-88: 88px;
  --type-mono-display-family: var(--font-family-mono);
  --type-mono-display-style: var(--font-style-regular);
  --type-mono-display-size: var(--font-size-80);
  --type-mono-display-line-height: var(--line-height-88);
  --type-mono-display-tracking: var(--tracking-normal);
  --line-height-48: 48px;
  --type-mono-headline-family: var(--font-family-mono);
  --type-mono-headline-style: var(--font-style-regular);
  --type-mono-headline-size: var(--font-size-40);
  --type-mono-headline-line-height: var(--line-height-48);
  --type-mono-headline-tracking: var(--tracking-normal);
  --line-height-32: 32px;
  --type-mono-title-family: var(--font-family-mono);
  --type-mono-title-style: var(--font-style-regular);
  --type-mono-title-size: var(--font-size-24);
  --type-mono-title-line-height: var(--line-height-32);
  --type-mono-title-tracking: var(--tracking-normal);
  --type-mono-body-family: var(--font-family-mono);
  --type-mono-body-style: var(--font-style-regular);
  --type-mono-body-size: var(--font-size-16);
  --type-mono-body-line-height: var(--line-height-24);
  --type-mono-body-tracking: var(--tracking-normal);
  --type-mono-ui-family: var(--font-family-mono);
  --type-mono-ui-style: var(--font-style-regular);
  --type-mono-ui-size: var(--font-size-14);
  --type-mono-ui-line-height: var(--line-height-20);
  --type-mono-ui-tracking: var(--tracking-normal);
  --type-mono-micro-family: var(--font-family-mono);
  --type-mono-micro-style: var(--font-style-regular);
  --type-mono-micro-size: var(--font-size-12);
  --type-mono-micro-line-height: var(--line-height-16);
  --type-mono-micro-tracking: var(--tracking-normal);
  --font-size-112: 112px;
  --line-height-128: 128px;
  --type-mono-glyph-family: var(--font-family-mono);
  --type-mono-glyph-style: var(--font-style-regular);
  --type-mono-glyph-size: var(--font-size-112);
  --type-mono-glyph-line-height: var(--line-height-128);
  --type-mono-glyph-tracking: var(--tracking-normal);
  --line-height-56: 56px;
  --type-mono-numeral-family: var(--font-family-mono);
  --type-mono-numeral-style: var(--font-style-regular);
  --type-mono-numeral-size: var(--font-size-48);
  --type-mono-numeral-line-height: var(--line-height-56);
  --type-mono-numeral-tracking: var(--tracking-normal);
  --brand-mono-inset: var(--dimension-16);
  --brand-mono-gap: var(--dimension-8);
  --brand-mono-header-height: var(--dimension-40);
  --brand-mono-cell-small: var(--dimension-48);
  --brand-mono-cell-large: var(--dimension-80);
  --brand-mono-key-small: var(--dimension-28);
  --brand-mono-key-medium: var(--dimension-36);
  --brand-mono-grid-step: var(--dimension-24);
  --component-mono-window-surface: var(--brand-mono-surface);
  --component-mono-window-ink: var(--brand-mono-ink);
  --component-mono-window-border: var(--brand-mono-rule);
  --component-mono-window-radius: var(--radius-sm);
  --component-mono-metric-surface: var(--brand-mono-surface);
  --component-mono-metric-ink: var(--brand-mono-ink);
  --component-mono-metric-border: var(--brand-mono-rule);
  --component-mono-metric-radius: var(--radius-sm);
  --component-mono-feature-surface: var(--brand-mono-surface);
  --component-mono-feature-ink: var(--brand-mono-ink);
  --component-mono-feature-border: var(--brand-mono-rule);
  --component-mono-feature-radius: var(--radius-sm);
  --component-mono-glyph-surface: var(--brand-mono-surface);
  --component-mono-glyph-ink: var(--brand-mono-ink);
  --component-mono-glyph-border: var(--brand-mono-rule);
  --component-mono-glyph-radius: var(--radius-sm);
  --component-mono-keycap-surface: var(--brand-mono-surface);
  --component-mono-keycap-ink: var(--brand-mono-ink);
  --component-mono-keycap-border: var(--brand-mono-rule);
  --component-mono-keycap-radius: var(--radius-sm);
  --component-mono-specimen-surface: var(--brand-mono-surface);
  --component-mono-specimen-ink: var(--brand-mono-ink);
  --component-mono-specimen-border: var(--brand-mono-rule);
  --component-mono-specimen-radius: var(--radius-sm);
  --component-mono-code-surface: var(--brand-mono-surface);
  --component-mono-code-ink: var(--brand-mono-ink);
  --component-mono-code-border: var(--brand-mono-rule);
  --component-mono-code-radius: var(--radius-sm);
  --component-mono-progress-surface: var(--brand-mono-surface);
  --component-mono-progress-ink: var(--brand-mono-ink);
  --component-mono-progress-border: var(--brand-mono-rule);
  --component-mono-progress-radius: var(--radius-sm);
  --component-mono-stat-surface: var(--brand-mono-surface);
  --component-mono-stat-ink: var(--brand-mono-ink);
  --component-mono-stat-border: var(--brand-mono-rule);
  --component-mono-stat-radius: var(--radius-sm);
  --component-mono-annotation-surface: var(--brand-mono-surface);
  --component-mono-annotation-ink: var(--brand-mono-ink);
  --component-mono-annotation-border: var(--brand-mono-rule);
  --component-mono-annotation-radius: var(--radius-sm);
  --component-mono-stamp-surface: var(--brand-mono-surface);
  --component-mono-stamp-ink: var(--brand-mono-ink);
  --component-mono-stamp-border: var(--brand-mono-rule);
  --component-mono-stamp-radius: var(--radius-sm);
  --component-mono-section-surface: var(--brand-mono-surface);
  --component-mono-section-ink: var(--brand-mono-ink);
  --component-mono-section-border: var(--brand-mono-rule);
  --component-mono-section-radius: var(--radius-sm);
  --brand-mono-shadow-offset-x: var(--dimension-3);
  --brand-mono-shadow-offset-y: var(--dimension-3);
  --brand-mono-shadow-blur: var(--dimension-0);
  --brand-mono-selected-hover: var(--color-blue-700);
  --illustration-hairline-plate: var(--brand-mono-canvas);
  --illustration-hairline-edge: var(--brand-mono-ink);
  --illustration-hairline-accent: var(--brand-mono-accent);
  --illustration-hairline-detail: var(--brand-mono-muted);
  --illustration-hairline-subtle: var(--color-neutral-400);
  --illustration-hairline-stroke: 0.9px;
  --illustration-hairline-small-width: 240px;
  --illustration-hairline-small-height: 192px;
  --illustration-hairline-regular-width: 400px;
  --illustration-hairline-regular-height: 320px;
}

[data-theme="light"] {
  --color-bg-canvas: var(--color-paper-50);
  --color-bg-surface: var(--color-neutral-0);
  --color-bg-subtle: var(--color-paper-100);
  --color-bg-raised: var(--color-neutral-0);
  --color-bg-inverse: var(--color-neutral-950);
  --color-text-primary: var(--color-neutral-950);
  --color-text-secondary: var(--color-neutral-600);
  --color-text-tertiary: var(--color-neutral-700);
  --color-text-disabled: var(--color-neutral-400);
  --color-text-inverse: var(--color-paper-100);
  --color-text-link: var(--color-blue-800);
  --color-border-default: var(--color-neutral-200);
  --color-border-subtle: var(--color-neutral-100);
  --color-border-strong: var(--color-neutral-600);
  --color-border-control: var(--color-neutral-500);
  --color-border-focus: var(--color-blue-700);
  --color-action-primary-default: var(--color-neutral-950);
  --color-action-primary-hover: var(--color-neutral-800);
  --color-action-primary-pressed: var(--color-neutral-1000);
  --color-action-primary-text: var(--color-paper-100);
  --color-action-secondary-default: var(--color-paper-100);
  --color-action-secondary-hover: var(--color-neutral-200);
  --color-action-secondary-pressed: var(--color-neutral-300);
  --color-action-secondary-text: var(--color-neutral-950);
  --color-action-ghost-default: var(--color-transparent);
  --color-action-ghost-hover: var(--color-neutral-100);
  --color-action-ghost-pressed: var(--color-neutral-200);
  --color-action-ghost-text: var(--color-neutral-950);
  --color-action-danger-default: var(--color-red-700);
  --color-action-danger-hover: var(--color-red-800);
  --color-action-danger-pressed: var(--color-red-900);
  --color-action-danger-text: var(--color-neutral-0);
  --color-action-disabled-bg: var(--color-neutral-100);
  --color-action-disabled-text: var(--color-neutral-400);
  --color-selection-bg: var(--color-blue-50);
  --color-selection-foreground: var(--color-blue-800);
  --color-overlay-scrim: var(--color-overlay);
  --color-effect-shadow: var(--color-shadow);
  --color-decorative-blue: var(--color-blue-400);
  --color-decorative-cream: var(--color-paper-100);
  --color-status-info-bg: var(--color-blue-50);
  --color-status-info-text: var(--color-blue-800);
  --color-status-info-border: var(--color-blue-700);
  --color-status-success-bg: var(--color-green-50);
  --color-status-success-text: var(--color-green-700);
  --color-status-success-border: var(--color-green-700);
  --color-status-warning-bg: var(--color-amber-50);
  --color-status-warning-text: var(--color-amber-700);
  --color-status-warning-border: var(--color-amber-700);
  --color-status-danger-bg: var(--color-red-50);
  --color-status-danger-text: var(--color-red-700);
  --color-status-danger-border: var(--color-red-700);
  --color-icon-primary: var(--color-text-primary);
  --color-icon-secondary: var(--color-text-secondary);
  --color-icon-disabled: var(--color-text-disabled);
  --color-icon-inverse: var(--color-text-inverse);
  --color-icon-brand: var(--color-selection-foreground);
  --color-focus-ring: var(--color-border-focus);
  --color-focus-gap: var(--color-bg-canvas);
  --color-surface-hover: var(--color-action-ghost-hover);
  --color-surface-pressed: var(--color-action-ghost-pressed);
  --color-surface-selected: var(--color-selection-bg);
  --color-text-placeholder: var(--color-text-secondary);
  --color-text-on-brand: var(--color-neutral-0);
  --color-border-disabled: var(--color-border-subtle);
  --color-icon-info: var(--color-status-info-text);
  --color-status-info-solid: var(--color-status-info-text);
  --color-status-info-on-solid: var(--color-neutral-0);
  --color-icon-success: var(--color-status-success-text);
  --color-status-success-solid: var(--color-status-success-text);
  --color-status-success-on-solid: var(--color-neutral-0);
  --color-icon-warning: var(--color-status-warning-text);
  --color-status-warning-solid: var(--color-status-warning-text);
  --color-status-warning-on-solid: var(--color-neutral-0);
  --color-icon-danger: var(--color-status-danger-text);
  --color-status-danger-solid: var(--color-status-danger-text);
  --color-status-danger-on-solid: var(--color-neutral-0);
  --color-chart-series-1: var(--color-blue-700);
  --color-chart-series-2: var(--color-green-700);
  --color-chart-series-3: var(--color-amber-700);
  --color-chart-series-4: var(--color-red-700);
  --brand-mono-canvas: var(--color-mono-paper);
  --brand-mono-surface: var(--color-paper-50);
  --brand-mono-subtle: var(--color-mono-sheet);
  --brand-mono-ink: var(--color-neutral-900);
  --brand-mono-muted: var(--color-neutral-600);
  --brand-mono-accent: var(--color-blue-800);
  --brand-mono-accent-decorative: var(--color-mono-blue);
  --brand-mono-grid: var(--color-blue-200);
  --brand-mono-rule: var(--color-blue-300);
  --brand-mono-selected: var(--color-blue-800);
  --brand-mono-on-selected: var(--color-neutral-0);
  --brand-mono-hover: var(--color-blue-100);
  --brand-mono-disabled: var(--color-text-disabled);
  --brand-mono-shadow: var(--color-blue-400);
  --brand-mono-blueprint: var(--color-blue-50);
  --brand-mono-inverse: var(--color-neutral-900);
  --brand-mono-on-inverse: var(--color-mono-paper);
  --brand-mono-selected-hover: var(--color-blue-700);
  --illustration-hairline-plate: var(--brand-mono-canvas);
  --illustration-hairline-edge: var(--brand-mono-ink);
  --illustration-hairline-accent: var(--brand-mono-accent);
  --illustration-hairline-detail: var(--brand-mono-muted);
  --illustration-hairline-subtle: var(--color-neutral-400);
}

[data-theme="dark"] {
  --color-bg-canvas: var(--color-neutral-950);
  --color-bg-surface: var(--color-neutral-900);
  --color-bg-subtle: var(--color-neutral-850);
  --color-bg-raised: var(--color-neutral-850);
  --color-bg-inverse: var(--color-paper-100);
  --color-text-primary: var(--color-paper-100);
  --color-text-secondary: var(--color-neutral-300);
  --color-text-tertiary: var(--color-neutral-400);
  --color-text-disabled: var(--color-neutral-600);
  --color-text-inverse: var(--color-neutral-950);
  --color-text-link: var(--color-blue-400);
  --color-border-default: var(--color-neutral-700);
  --color-border-subtle: var(--color-neutral-800);
  --color-border-strong: var(--color-neutral-400);
  --color-border-control: var(--color-neutral-500);
  --color-border-focus: var(--color-blue-400);
  --color-action-primary-default: var(--color-paper-100);
  --color-action-primary-hover: var(--color-neutral-0);
  --color-action-primary-pressed: var(--color-neutral-200);
  --color-action-primary-text: var(--color-neutral-950);
  --color-action-secondary-default: var(--color-neutral-800);
  --color-action-secondary-hover: var(--color-neutral-700);
  --color-action-secondary-pressed: var(--color-neutral-600);
  --color-action-secondary-text: var(--color-paper-100);
  --color-action-ghost-default: var(--color-transparent);
  --color-action-ghost-hover: var(--color-neutral-800);
  --color-action-ghost-pressed: var(--color-neutral-700);
  --color-action-ghost-text: var(--color-paper-100);
  --color-action-danger-default: var(--color-red-400);
  --color-action-danger-hover: var(--color-red-50);
  --color-action-danger-pressed: var(--color-red-400);
  --color-action-danger-text: var(--color-red-900);
  --color-action-disabled-bg: var(--color-neutral-800);
  --color-action-disabled-text: var(--color-neutral-600);
  --color-selection-bg: var(--color-blue-900);
  --color-selection-foreground: var(--color-blue-400);
  --color-overlay-scrim: var(--color-overlay);
  --color-effect-shadow: var(--color-shadow);
  --color-decorative-blue: var(--color-blue-400);
  --color-decorative-cream: var(--color-paper-100);
  --color-status-info-bg: var(--color-blue-900);
  --color-status-info-text: var(--color-blue-400);
  --color-status-info-border: var(--color-blue-400);
  --color-status-success-bg: var(--color-green-900);
  --color-status-success-text: var(--color-green-400);
  --color-status-success-border: var(--color-green-400);
  --color-status-warning-bg: var(--color-amber-900);
  --color-status-warning-text: var(--color-amber-400);
  --color-status-warning-border: var(--color-amber-400);
  --color-status-danger-bg: var(--color-red-900);
  --color-status-danger-text: var(--color-red-400);
  --color-status-danger-border: var(--color-red-400);
  --color-icon-primary: var(--color-text-primary);
  --color-icon-secondary: var(--color-text-secondary);
  --color-icon-disabled: var(--color-text-disabled);
  --color-icon-inverse: var(--color-text-inverse);
  --color-icon-brand: var(--color-selection-foreground);
  --color-focus-ring: var(--color-border-focus);
  --color-focus-gap: var(--color-bg-canvas);
  --color-surface-hover: var(--color-action-ghost-hover);
  --color-surface-pressed: var(--color-action-ghost-pressed);
  --color-surface-selected: var(--color-selection-bg);
  --color-text-placeholder: var(--color-text-secondary);
  --color-text-on-brand: var(--color-neutral-950);
  --color-border-disabled: var(--color-border-subtle);
  --color-icon-info: var(--color-status-info-text);
  --color-status-info-solid: var(--color-status-info-text);
  --color-status-info-on-solid: var(--color-neutral-950);
  --color-icon-success: var(--color-status-success-text);
  --color-status-success-solid: var(--color-status-success-text);
  --color-status-success-on-solid: var(--color-neutral-950);
  --color-icon-warning: var(--color-status-warning-text);
  --color-status-warning-solid: var(--color-status-warning-text);
  --color-status-warning-on-solid: var(--color-neutral-950);
  --color-icon-danger: var(--color-status-danger-text);
  --color-status-danger-solid: var(--color-status-danger-text);
  --color-status-danger-on-solid: var(--color-neutral-950);
  --color-chart-series-1: var(--color-blue-400);
  --color-chart-series-2: var(--color-green-400);
  --color-chart-series-3: var(--color-amber-400);
  --color-chart-series-4: var(--color-red-400);
  --brand-mono-canvas: var(--color-neutral-950);
  --brand-mono-surface: var(--color-neutral-900);
  --brand-mono-subtle: var(--color-neutral-850);
  --brand-mono-ink: var(--color-mono-paper);
  --brand-mono-muted: var(--color-neutral-300);
  --brand-mono-accent: var(--color-blue-300);
  --brand-mono-accent-decorative: var(--color-blue-400);
  --brand-mono-grid: var(--color-blue-900);
  --brand-mono-rule: var(--color-blue-700);
  --brand-mono-selected: var(--color-blue-300);
  --brand-mono-on-selected: var(--color-neutral-950);
  --brand-mono-hover: var(--color-blue-950);
  --brand-mono-disabled: var(--color-text-disabled);
  --brand-mono-shadow: var(--color-blue-950);
  --brand-mono-blueprint: var(--color-blue-950);
  --brand-mono-inverse: var(--color-mono-paper);
  --brand-mono-on-inverse: var(--color-neutral-900);
  --brand-mono-selected-hover: var(--color-blue-200);
  --illustration-hairline-plate: var(--brand-mono-canvas);
  --illustration-hairline-edge: var(--brand-mono-ink);
  --illustration-hairline-accent: var(--brand-mono-accent);
  --illustration-hairline-detail: var(--brand-mono-muted);
  --illustration-hairline-subtle: var(--color-neutral-600);
}

[data-density="comfortable"] {
  --density-control-height: var(--dimension-40);
  --density-control-padding-x: var(--dimension-16);
  --density-control-gap: var(--dimension-8);
  --density-row-height: var(--dimension-48);
  --density-inset: var(--dimension-16);
}

[data-density="compact"] {
  --density-control-height: var(--dimension-32);
  --density-control-padding-x: var(--dimension-12);
  --density-control-gap: var(--dimension-6);
  --density-row-height: var(--dimension-40);
  --density-inset: var(--dimension-12);
}

[data-density="touch"] {
  --density-control-height: var(--dimension-48);
  --density-control-padding-x: var(--dimension-20);
  --density-control-gap: var(--dimension-8);
  --density-row-height: var(--dimension-56);
  --density-inset: var(--dimension-20);
}

[data-viewport="desktop"] {
  --responsive-viewport-width: var(--dimension-1440);
  --responsive-container-max: var(--dimension-1200);
  --responsive-page-margin: var(--dimension-64);
  --responsive-grid-gutter: var(--dimension-24);
  --responsive-section-gap: var(--dimension-64);
  --responsive-content-gap: var(--dimension-24);
  --responsive-sidebar-width: var(--dimension-240);
  --responsive-dialog-max-width: var(--dimension-560);
  --responsive-drawer-width: var(--dimension-480);
  --responsive-grid-columns: 12;
  --responsive-sidebar-visible: 1;
  --responsive-display-size: var(--font-size-64);
  --responsive-display-line-height: var(--line-height-68);
}

[data-viewport="tablet"] {
  --responsive-viewport-width: var(--dimension-768);
  --responsive-container-max: var(--dimension-720);
  --responsive-page-margin: var(--dimension-24);
  --responsive-grid-gutter: var(--dimension-24);
  --responsive-section-gap: var(--dimension-48);
  --responsive-content-gap: var(--dimension-24);
  --responsive-sidebar-width: var(--dimension-200);
  --responsive-dialog-max-width: var(--dimension-480);
  --responsive-drawer-width: var(--dimension-400);
  --responsive-grid-columns: 8;
  --responsive-sidebar-visible: 1;
  --responsive-display-size: var(--font-size-48);
  --responsive-display-line-height: var(--line-height-52);
}

[data-viewport="mobile"] {
  --responsive-viewport-width: var(--dimension-375);
  --responsive-container-max: var(--dimension-343);
  --responsive-page-margin: var(--dimension-16);
  --responsive-grid-gutter: var(--dimension-16);
  --responsive-section-gap: var(--dimension-32);
  --responsive-content-gap: var(--dimension-16);
  --responsive-sidebar-width: var(--dimension-0);
  --responsive-dialog-max-width: var(--dimension-343);
  --responsive-drawer-width: var(--dimension-343);
  --responsive-grid-columns: 4;
  --responsive-sidebar-visible: 0;
  --responsive-display-size: var(--font-size-40);
  --responsive-display-line-height: var(--line-height-44);
}

[data-motion="standard"] {
  --motion-duration-fast: 120ms;
  --motion-duration-standard: 180ms;
  --motion-duration-slow: 280ms;
  --motion-duration-reduced: 0ms;
  --motion-easing-standard: cubic-bezier(0.2,0,0,1);
  --motion-easing-enter: cubic-bezier(0,0,0.2,1);
  --motion-easing-exit: cubic-bezier(0.4,0,1,1);
  --motion-duration-instant: 0ms;
  --motion-duration-micro: 80ms;
  --motion-duration-moderate: 240ms;
  --motion-duration-enter: 320ms;
  --motion-duration-exit: 180ms;
  --motion-duration-stagger: 40ms;
  --motion-distance-subtle: 4px;
  --motion-distance-default: 8px;
  --motion-distance-large: 16px;
}

[data-motion="reduced"] {
  --motion-duration-fast: 0ms;
  --motion-duration-standard: 0ms;
  --motion-duration-slow: 0ms;
  --motion-duration-reduced: 0ms;
  --motion-easing-standard: cubic-bezier(0.2,0,0,1);
  --motion-easing-enter: cubic-bezier(0,0,0.2,1);
  --motion-easing-exit: cubic-bezier(0.4,0,1,1);
  --motion-duration-instant: 0ms;
  --motion-duration-micro: 0ms;
  --motion-duration-moderate: 0ms;
  --motion-duration-enter: 0ms;
  --motion-duration-exit: 0ms;
  --motion-duration-stagger: 0ms;
  --motion-distance-subtle: 0px;
  --motion-distance-default: 0px;
  --motion-distance-large: 0px;
}

/* Recompute aliases at nested context boundaries. */
[data-theme], [data-density], [data-viewport], [data-motion] {
  --space-0: var(--dimension-0);
  --space-2: var(--dimension-2);
  --space-4: var(--dimension-4);
  --space-6: var(--dimension-6);
  --space-8: var(--dimension-8);
  --space-12: var(--dimension-12);
  --space-16: var(--dimension-16);
  --space-20: var(--dimension-20);
  --space-24: var(--dimension-24);
  --space-32: var(--dimension-32);
  --space-40: var(--dimension-40);
  --space-48: var(--dimension-48);
  --space-64: var(--dimension-64);
  --space-80: var(--dimension-80);
  --space-96: var(--dimension-96);
  --space-120: var(--dimension-120);
  --radius-none: var(--dimension-0);
  --radius-xs: var(--dimension-2);
  --radius-sm: var(--dimension-4);
  --radius-md: var(--dimension-8);
  --radius-lg: var(--dimension-12);
  --radius-xl: var(--dimension-16);
  --radius-full: var(--dimension-999);
  --size-control-sm: var(--dimension-32);
  --size-control-md: var(--dimension-40);
  --size-control-lg: var(--dimension-48);
  --size-icon-sm: var(--dimension-16);
  --size-icon-md: var(--dimension-20);
  --size-icon-lg: var(--dimension-24);
  --size-avatar-sm: var(--dimension-24);
  --size-avatar-md: var(--dimension-32);
  --size-avatar-lg: var(--dimension-48);
  --size-container-max: var(--dimension-1200);
  --size-touch-min: var(--dimension-44);
  --border-width-default: var(--dimension-1);
  --border-width-focus: var(--dimension-2);
  --breakpoint-mobile: var(--dimension-375);
  --breakpoint-tablet: var(--dimension-768);
  --breakpoint-desktop: var(--dimension-1440);
  --font-family-sans: var(--font-stack-sans);
  --font-family-mono: var(--font-stack-mono);
  --type-display-large-size: var(--font-size-64);
  --type-display-large-line-height: var(--line-height-68);
  --type-display-large-tracking: var(--tracking-tightest);
  --type-display-small-size: var(--font-size-48);
  --type-display-small-line-height: var(--line-height-52);
  --type-display-small-tracking: var(--tracking-tighter);
  --type-heading-h1-size: var(--font-size-40);
  --type-heading-h1-line-height: var(--line-height-44);
  --type-heading-h1-tracking: var(--tracking-tight);
  --type-heading-h2-size: var(--font-size-32);
  --type-heading-h2-line-height: var(--line-height-38);
  --type-heading-h2-tracking: var(--tracking-compact);
  --type-heading-h3-size: var(--font-size-24);
  --type-heading-h3-line-height: var(--line-height-30);
  --type-heading-h3-tracking: var(--tracking-slight);
  --type-heading-h4-size: var(--font-size-20);
  --type-heading-h4-line-height: var(--line-height-28);
  --type-heading-h4-tracking: var(--tracking-subtle);
  --type-body-large-size: var(--font-size-18);
  --type-body-large-line-height: var(--line-height-28);
  --type-body-large-tracking: var(--tracking-normal);
  --type-body-medium-size: var(--font-size-16);
  --type-body-medium-line-height: var(--line-height-24);
  --type-body-medium-tracking: var(--tracking-normal);
  --type-body-small-size: var(--font-size-14);
  --type-body-small-line-height: var(--line-height-20);
  --type-body-small-tracking: var(--tracking-normal);
  --type-label-large-size: var(--font-size-16);
  --type-label-large-line-height: var(--line-height-20);
  --type-label-large-tracking: var(--tracking-normal);
  --type-label-medium-size: var(--font-size-14);
  --type-label-medium-line-height: var(--line-height-20);
  --type-label-medium-tracking: var(--tracking-normal);
  --type-label-small-size: var(--font-size-12);
  --type-label-small-line-height: var(--line-height-16);
  --type-label-small-tracking: var(--tracking-wide);
  --type-caption-size: var(--font-size-12);
  --type-caption-line-height: var(--line-height-18);
  --type-caption-tracking: var(--tracking-wide);
  --type-code-size: var(--font-size-12);
  --type-code-line-height: var(--line-height-18);
  --type-code-tracking: var(--tracking-normal);
  --elevation-low-blur: var(--dimension-8);
  --elevation-low-y: var(--dimension-2);
  --elevation-high-blur: var(--dimension-32);
  --elevation-high-y: var(--dimension-12);
  --space-1: var(--dimension-1);
  --space-3: var(--dimension-3);
  --space-10: var(--dimension-10);
  --space-28: var(--dimension-28);
  --space-36: var(--dimension-36);
  --space-56: var(--dimension-56);
  --space-72: var(--dimension-72);
  --space-112: var(--dimension-112);
  --space-128: var(--dimension-128);
  --space-160: var(--dimension-160);
  --size-control-xs: var(--dimension-24);
  --size-control-xl: var(--dimension-56);
  --size-icon-xs: var(--dimension-12);
  --size-icon-xl: var(--dimension-32);
  --size-avatar-xs: var(--dimension-16);
  --size-avatar-xl: var(--dimension-64);
  --size-avatar-2xl: var(--dimension-96);
  --size-container-sm: var(--dimension-640);
  --size-container-md: var(--dimension-768);
  --size-container-lg: var(--dimension-1024);
  --size-container-xl: var(--dimension-1280);
  --border-width-none: var(--dimension-0);
  --border-width-strong: var(--dimension-3);
  --focus-offset: var(--dimension-2);
  --spacing-stack-tight: var(--space-8);
  --spacing-stack-default: var(--space-16);
  --spacing-stack-relaxed: var(--space-24);
  --spacing-inline-tight: var(--space-4);
  --spacing-inline-default: var(--space-8);
  --spacing-inline-relaxed: var(--space-16);
  --spacing-inset-compact: var(--space-12);
  --spacing-inset-default: var(--space-16);
  --spacing-inset-relaxed: var(--space-24);
  --spacing-section-default: var(--space-64);
  --font-weight-light: var(--font-weight-light);
  --font-weight-regular: var(--font-weight-regular);
  --font-weight-medium: var(--font-weight-medium);
  --font-weight-semibold: var(--font-weight-semibold);
  --type-display-large-family: var(--font-family-sans);
  --type-display-large-style: var(--font-style-light);
  --type-display-large-weight: var(--font-weight-light);
  --type-display-large-paragraph-spacing: var(--dimension-0);
  --type-display-small-family: var(--font-family-sans);
  --type-display-small-style: var(--font-style-light);
  --type-display-small-weight: var(--font-weight-light);
  --type-display-small-paragraph-spacing: var(--dimension-0);
  --type-heading-h1-family: var(--font-family-sans);
  --type-heading-h1-style: var(--font-style-regular);
  --type-heading-h1-weight: var(--font-weight-regular);
  --type-heading-h1-paragraph-spacing: var(--dimension-0);
  --type-heading-h2-family: var(--font-family-sans);
  --type-heading-h2-style: var(--font-style-regular);
  --type-heading-h2-weight: var(--font-weight-regular);
  --type-heading-h2-paragraph-spacing: var(--dimension-0);
  --type-heading-h3-family: var(--font-family-sans);
  --type-heading-h3-style: var(--font-style-medium);
  --type-heading-h3-weight: var(--font-weight-medium);
  --type-heading-h3-paragraph-spacing: var(--dimension-0);
  --type-heading-h4-family: var(--font-family-sans);
  --type-heading-h4-style: var(--font-style-medium);
  --type-heading-h4-weight: var(--font-weight-medium);
  --type-heading-h4-paragraph-spacing: var(--dimension-0);
  --type-body-large-family: var(--font-family-sans);
  --type-body-large-style: var(--font-style-regular);
  --type-body-large-weight: var(--font-weight-regular);
  --type-body-large-paragraph-spacing: var(--dimension-16);
  --type-body-medium-family: var(--font-family-sans);
  --type-body-medium-style: var(--font-style-regular);
  --type-body-medium-weight: var(--font-weight-regular);
  --type-body-medium-paragraph-spacing: var(--dimension-16);
  --type-body-small-family: var(--font-family-sans);
  --type-body-small-style: var(--font-style-regular);
  --type-body-small-weight: var(--font-weight-regular);
  --type-body-small-paragraph-spacing: var(--dimension-16);
  --type-label-large-family: var(--font-family-sans);
  --type-label-large-style: var(--font-style-medium);
  --type-label-large-weight: var(--font-weight-medium);
  --type-label-large-paragraph-spacing: var(--dimension-0);
  --type-label-medium-family: var(--font-family-sans);
  --type-label-medium-style: var(--font-style-medium);
  --type-label-medium-weight: var(--font-weight-medium);
  --type-label-medium-paragraph-spacing: var(--dimension-0);
  --type-label-small-family: var(--font-family-sans);
  --type-label-small-style: var(--font-style-medium);
  --type-label-small-weight: var(--font-weight-medium);
  --type-label-small-paragraph-spacing: var(--dimension-0);
  --type-caption-family: var(--font-family-sans);
  --type-caption-style: var(--font-style-regular);
  --type-caption-weight: var(--font-weight-regular);
  --type-caption-paragraph-spacing: var(--dimension-0);
  --type-code-family: var(--font-family-mono);
  --type-code-style: var(--font-style-regular);
  --type-code-weight: var(--font-weight-regular);
  --type-code-paragraph-spacing: var(--dimension-0);
  --elevation-low-x: var(--dimension-0);
  --elevation-low-spread: var(--dimension-0);
  --elevation-medium-x: var(--dimension-0);
  --elevation-medium-y: var(--dimension-8);
  --elevation-medium-blur: var(--dimension-24);
  --elevation-medium-spread: var(--dimension-0);
  --elevation-high-x: var(--dimension-0);
  --elevation-high-spread: var(--dimension-0);
  --component-button-primary-control-height-sm: var(--size-control-sm);
  --component-button-primary-radius-sm: var(--radius-sm);
  --component-button-primary-background-default: var(--color-action-primary-default);
  --component-button-primary-icon-size-sm: var(--size-icon-sm);
  --component-button-primary-foreground-default: var(--color-action-primary-text);
  --component-button-primary-background-hover: var(--color-action-primary-hover);
  --component-button-primary-background-pressed: var(--color-action-primary-pressed);
  --component-button-primary-border-width-focus: var(--border-width-focus);
  --component-button-primary-border-focus: var(--color-border-focus);
  --component-button-primary-background-disabled: var(--color-action-disabled-bg);
  --component-button-primary-foreground-disabled: var(--color-action-disabled-text);
  --component-button-primary-control-height-md: var(--density-control-height);
  --component-button-primary-control-height-lg: var(--size-control-lg);
  --component-button-primary-icon-size-md: var(--size-icon-md);
  --component-button-secondary-control-height-sm: var(--size-control-sm);
  --component-button-secondary-radius-sm: var(--radius-sm);
  --component-button-secondary-border-width-default: var(--border-width-default);
  --component-button-secondary-background-default: var(--color-action-secondary-default);
  --component-button-secondary-border-default: var(--color-border-default);
  --component-button-secondary-icon-size-sm: var(--size-icon-sm);
  --component-button-secondary-foreground-default: var(--color-action-secondary-text);
  --component-button-secondary-background-hover: var(--color-action-secondary-hover);
  --component-button-secondary-background-pressed: var(--color-action-secondary-pressed);
  --component-button-secondary-border-width-focus: var(--border-width-focus);
  --component-button-secondary-border-focus: var(--color-border-focus);
  --component-button-secondary-background-disabled: var(--color-action-disabled-bg);
  --component-button-secondary-foreground-disabled: var(--color-action-disabled-text);
  --component-button-secondary-control-height-md: var(--density-control-height);
  --component-button-secondary-control-height-lg: var(--size-control-lg);
  --component-button-secondary-icon-size-md: var(--size-icon-md);
  --component-button-ghost-control-height-sm: var(--size-control-sm);
  --component-button-ghost-radius-sm: var(--radius-sm);
  --component-button-ghost-background-default: var(--color-action-ghost-default);
  --component-button-ghost-foreground-default: var(--color-action-ghost-text);
  --component-button-ghost-icon-size-sm: var(--size-icon-sm);
  --component-button-ghost-background-hover: var(--color-action-ghost-hover);
  --component-button-ghost-background-pressed: var(--color-action-ghost-pressed);
  --component-button-ghost-border-width-focus: var(--border-width-focus);
  --component-button-ghost-border-focus: var(--color-border-focus);
  --component-button-ghost-background-disabled: var(--color-action-disabled-bg);
  --component-button-ghost-foreground-disabled: var(--color-action-disabled-text);
  --component-button-ghost-control-height-md: var(--density-control-height);
  --component-button-ghost-control-height-lg: var(--size-control-lg);
  --component-button-ghost-icon-size-md: var(--size-icon-md);
  --component-button-danger-control-height-sm: var(--size-control-sm);
  --component-button-danger-radius-sm: var(--radius-sm);
  --component-button-danger-background-default: var(--color-action-danger-default);
  --component-button-danger-icon-size-sm: var(--size-icon-sm);
  --component-button-danger-foreground-default: var(--color-action-danger-text);
  --component-button-danger-background-hover: var(--color-action-danger-hover);
  --component-button-danger-background-pressed: var(--color-action-danger-pressed);
  --component-button-danger-border-width-focus: var(--border-width-focus);
  --component-button-danger-border-focus: var(--color-border-focus);
  --component-button-danger-background-disabled: var(--color-action-disabled-bg);
  --component-button-danger-foreground-disabled: var(--color-action-disabled-text);
  --component-button-danger-control-height-md: var(--density-control-height);
  --component-button-danger-control-height-lg: var(--size-control-lg);
  --component-button-danger-icon-size-md: var(--size-icon-md);
  --component-icon-button-control-height-sm: var(--size-control-sm);
  --component-icon-button-radius-sm: var(--radius-sm);
  --component-icon-button-border-width-default: var(--border-width-default);
  --component-icon-button-background-secondary-default: var(--color-action-secondary-default);
  --component-icon-button-border-default: var(--color-border-default);
  --component-icon-button-icon-size-sm: var(--size-icon-sm);
  --component-icon-button-text-primary: var(--color-text-primary);
  --component-icon-button-background-secondary-hover: var(--color-action-secondary-hover);
  --component-icon-button-background-secondary-pressed: var(--color-action-secondary-pressed);
  --component-icon-button-border-width-focus: var(--border-width-focus);
  --component-icon-button-border-focus: var(--color-border-focus);
  --component-icon-button-background-disabled: var(--color-action-disabled-bg);
  --component-icon-button-text-disabled: var(--color-text-disabled);
  --component-icon-button-control-height-md: var(--density-control-height);
  --component-icon-button-icon-size-md: var(--size-icon-md);
  --component-icon-button-background-ghost-default: var(--color-action-ghost-default);
  --component-icon-button-background-ghost-hover: var(--color-action-ghost-hover);
  --component-icon-button-background-ghost-pressed: var(--color-action-ghost-pressed);
  --component-link-text-link: var(--color-text-link);
  --component-link-icon-size-sm: var(--size-icon-sm);
  --component-link-border-width-focus: var(--border-width-focus);
  --component-link-border-focus: var(--color-border-focus);
  --component-link-text-disabled: var(--color-text-disabled);
  --component-text-field-text-primary: var(--color-text-primary);
  --component-text-field-radius-sm: var(--radius-sm);
  --component-text-field-border-width-default: var(--border-width-default);
  --component-text-field-surface-surface: var(--color-bg-surface);
  --component-text-field-border-control: var(--color-border-control);
  --component-text-field-text-secondary: var(--color-text-secondary);
  --component-text-field-border-strong: var(--color-border-strong);
  --component-text-field-border-width-focus: var(--border-width-focus);
  --component-text-field-border-focus: var(--color-border-focus);
  --component-text-field-status-danger-border: var(--color-status-danger-border);
  --component-text-field-status-danger-text: var(--color-status-danger-text);
  --component-text-field-text-disabled: var(--color-text-disabled);
  --component-text-field-background-disabled: var(--color-action-disabled-bg);
  --component-text-field-border-default: var(--color-border-default);
  --component-text-area-text-primary: var(--color-text-primary);
  --component-text-area-radius-sm: var(--radius-sm);
  --component-text-area-border-width-default: var(--border-width-default);
  --component-text-area-surface-surface: var(--color-bg-surface);
  --component-text-area-border-control: var(--color-border-control);
  --component-text-area-text-secondary: var(--color-text-secondary);
  --component-text-area-border-strong: var(--color-border-strong);
  --component-text-area-border-width-focus: var(--border-width-focus);
  --component-text-area-border-focus: var(--color-border-focus);
  --component-text-area-status-danger-border: var(--color-status-danger-border);
  --component-text-area-status-danger-text: var(--color-status-danger-text);
  --component-text-area-text-disabled: var(--color-text-disabled);
  --component-text-area-background-disabled: var(--color-action-disabled-bg);
  --component-text-area-border-default: var(--color-border-default);
  --component-select-text-primary: var(--color-text-primary);
  --component-select-radius-sm: var(--radius-sm);
  --component-select-border-width-default: var(--border-width-default);
  --component-select-surface-surface: var(--color-bg-surface);
  --component-select-border-control: var(--color-border-control);
  --component-select-text-secondary: var(--color-text-secondary);
  --component-select-border-strong: var(--color-border-strong);
  --component-select-border-width-focus: var(--border-width-focus);
  --component-select-border-focus: var(--color-border-focus);
  --component-select-status-danger-border: var(--color-status-danger-border);
  --component-select-status-danger-text: var(--color-status-danger-text);
  --component-select-text-disabled: var(--color-text-disabled);
  --component-select-background-disabled: var(--color-action-disabled-bg);
  --component-select-border-default: var(--color-border-default);
  --component-search-field-text-primary: var(--color-text-primary);
  --component-search-field-radius-sm: var(--radius-sm);
  --component-search-field-border-width-default: var(--border-width-default);
  --component-search-field-surface-surface: var(--color-bg-surface);
  --component-search-field-border-control: var(--color-border-control);
  --component-search-field-text-secondary: var(--color-text-secondary);
  --component-search-field-border-strong: var(--color-border-strong);
  --component-search-field-border-width-focus: var(--border-width-focus);
  --component-search-field-border-focus: var(--color-border-focus);
  --component-search-field-status-danger-border: var(--color-status-danger-border);
  --component-search-field-status-danger-text: var(--color-status-danger-text);
  --component-search-field-text-disabled: var(--color-text-disabled);
  --component-search-field-background-disabled: var(--color-action-disabled-bg);
  --component-search-field-border-default: var(--color-border-default);
  --component-checkbox-radius-sm: var(--radius-sm);
  --component-checkbox-border-width-default: var(--border-width-default);
  --component-checkbox-surface-surface: var(--color-bg-surface);
  --component-checkbox-border-control: var(--color-border-control);
  --component-checkbox-text-primary: var(--color-text-primary);
  --component-checkbox-border-strong: var(--color-border-strong);
  --component-checkbox-border-width-focus: var(--border-width-focus);
  --component-checkbox-border-focus: var(--color-border-focus);
  --component-checkbox-background-disabled: var(--color-action-disabled-bg);
  --component-checkbox-border-default: var(--color-border-default);
  --component-checkbox-text-disabled: var(--color-text-disabled);
  --component-checkbox-selection-foreground: var(--color-selection-foreground);
  --component-checkbox-surface-canvas: var(--color-bg-canvas);
  --component-radio-radius-full: var(--radius-full);
  --component-radio-border-width-default: var(--border-width-default);
  --component-radio-surface-surface: var(--color-bg-surface);
  --component-radio-border-control: var(--color-border-control);
  --component-radio-text-primary: var(--color-text-primary);
  --component-radio-border-strong: var(--color-border-strong);
  --component-radio-border-width-focus: var(--border-width-focus);
  --component-radio-border-focus: var(--color-border-focus);
  --component-radio-background-disabled: var(--color-action-disabled-bg);
  --component-radio-border-default: var(--color-border-default);
  --component-radio-text-disabled: var(--color-text-disabled);
  --component-radio-selection-foreground: var(--color-selection-foreground);
  --component-radio-surface-canvas: var(--color-bg-canvas);
  --component-switch-radius-full: var(--radius-full);
  --component-switch-border-width-default: var(--border-width-default);
  --component-switch-surface-surface: var(--color-bg-surface);
  --component-switch-border-control: var(--color-border-control);
  --component-switch-text-secondary: var(--color-text-secondary);
  --component-switch-text-primary: var(--color-text-primary);
  --component-switch-border-strong: var(--color-border-strong);
  --component-switch-border-width-focus: var(--border-width-focus);
  --component-switch-border-focus: var(--color-border-focus);
  --component-switch-background-disabled: var(--color-action-disabled-bg);
  --component-switch-border-default: var(--color-border-default);
  --component-switch-text-disabled: var(--color-text-disabled);
  --component-switch-selection-foreground: var(--color-selection-foreground);
  --component-switch-surface-canvas: var(--color-bg-canvas);
  --component-slider-text-primary: var(--color-text-primary);
  --component-slider-text-secondary: var(--color-text-secondary);
  --component-slider-radius-full: var(--radius-full);
  --component-slider-surface-subtle: var(--color-bg-subtle);
  --component-slider-selection-foreground: var(--color-selection-foreground);
  --component-slider-border-width-focus: var(--border-width-focus);
  --component-slider-border-focus: var(--color-border-focus);
  --component-slider-text-disabled: var(--color-text-disabled);
  --component-tab-radius-sm: var(--radius-sm);
  --component-tab-text-secondary: var(--color-text-secondary);
  --component-tab-background-ghost-hover: var(--color-action-ghost-hover);
  --component-tab-border-width-focus: var(--border-width-focus);
  --component-tab-border-focus: var(--color-border-focus);
  --component-tab-background-disabled: var(--color-action-disabled-bg);
  --component-tab-text-disabled: var(--color-text-disabled);
  --component-tab-selection-bg: var(--color-selection-bg);
  --component-tab-selection-foreground: var(--color-selection-foreground);
  --component-navigation-item-radius-sm: var(--radius-sm);
  --component-navigation-item-text-secondary: var(--color-text-secondary);
  --component-navigation-item-background-ghost-hover: var(--color-action-ghost-hover);
  --component-navigation-item-border-width-focus: var(--border-width-focus);
  --component-navigation-item-border-focus: var(--color-border-focus);
  --component-navigation-item-background-disabled: var(--color-action-disabled-bg);
  --component-navigation-item-text-disabled: var(--color-text-disabled);
  --component-navigation-item-selection-bg: var(--color-selection-bg);
  --component-navigation-item-selection-foreground: var(--color-selection-foreground);
  --component-pagination-item-radius-sm: var(--radius-sm);
  --component-pagination-item-text-secondary: var(--color-text-secondary);
  --component-pagination-item-background-ghost-hover: var(--color-action-ghost-hover);
  --component-pagination-item-border-width-focus: var(--border-width-focus);
  --component-pagination-item-border-focus: var(--color-border-focus);
  --component-pagination-item-background-disabled: var(--color-action-disabled-bg);
  --component-pagination-item-text-disabled: var(--color-text-disabled);
  --component-pagination-item-selection-bg: var(--color-selection-bg);
  --component-pagination-item-selection-foreground: var(--color-selection-foreground);
  --component-breadcrumb-text-link: var(--color-text-link);
  --component-breadcrumb-text-secondary: var(--color-text-secondary);
  --component-breadcrumb-text-primary: var(--color-text-primary);
  --component-accordion-border-width-default: var(--border-width-default);
  --component-accordion-surface-surface: var(--color-bg-surface);
  --component-accordion-border-default: var(--color-border-default);
  --component-accordion-text-primary: var(--color-text-primary);
  --component-accordion-text-secondary: var(--color-text-secondary);
  --component-accordion-surface-subtle: var(--color-bg-subtle);
  --component-accordion-border-width-focus: var(--border-width-focus);
  --component-accordion-border-focus: var(--color-border-focus);
  --component-badge-radius-full: var(--radius-full);
  --component-badge-surface-subtle: var(--color-bg-subtle);
  --component-badge-text-secondary: var(--color-text-secondary);
  --component-badge-border-width-default: var(--border-width-default);
  --component-badge-border-default: var(--color-border-default);
  --component-badge-status-info-bg: var(--color-status-info-bg);
  --component-badge-status-info-text: var(--color-status-info-text);
  --component-badge-status-info-border: var(--color-status-info-border);
  --component-badge-status-success-bg: var(--color-status-success-bg);
  --component-badge-status-success-text: var(--color-status-success-text);
  --component-badge-status-success-border: var(--color-status-success-border);
  --component-badge-status-warning-bg: var(--color-status-warning-bg);
  --component-badge-status-warning-text: var(--color-status-warning-text);
  --component-badge-status-warning-border: var(--color-status-warning-border);
  --component-badge-status-danger-bg: var(--color-status-danger-bg);
  --component-badge-status-danger-text: var(--color-status-danger-text);
  --component-badge-status-danger-border: var(--color-status-danger-border);
  --component-avatar-avatar-size-sm: var(--size-avatar-sm);
  --component-avatar-radius-full: var(--radius-full);
  --component-avatar-surface-subtle: var(--color-bg-subtle);
  --component-avatar-text-primary: var(--color-text-primary);
  --component-avatar-border-width-focus: var(--border-width-focus);
  --component-avatar-status-success-border: var(--color-status-success-border);
  --component-avatar-status-warning-border: var(--color-status-warning-border);
  --component-avatar-avatar-size-md: var(--size-avatar-md);
  --component-avatar-avatar-size-lg: var(--size-avatar-lg);
  --component-card-radius-md: var(--radius-md);
  --component-card-border-width-default: var(--border-width-default);
  --component-card-surface-surface: var(--color-bg-surface);
  --component-card-border-default: var(--color-border-default);
  --component-card-text-link: var(--color-text-link);
  --component-card-text-primary: var(--color-text-primary);
  --component-card-text-secondary: var(--color-text-secondary);
  --component-card-surface-subtle: var(--color-bg-subtle);
  --component-card-selection-bg: var(--color-selection-bg);
  --component-card-border-focus: var(--color-border-focus);
  --component-card-text-disabled: var(--color-text-disabled);
  --component-table-cell-radius-none: var(--radius-none);
  --component-table-cell-surface-surface: var(--color-bg-surface);
  --component-table-cell-text-primary: var(--color-text-primary);
  --component-table-cell-surface-subtle: var(--color-bg-subtle);
  --component-table-cell-selection-bg: var(--color-selection-bg);
  --component-table-cell-status-success-text: var(--color-status-success-text);
  --component-table-header-radius-none: var(--radius-none);
  --component-table-header-surface-subtle: var(--color-bg-subtle);
  --component-table-header-text-secondary: var(--color-text-secondary);
  --component-divider-radius-none: var(--radius-none);
  --component-divider-border-subtle: var(--color-border-subtle);
  --component-alert-radius-md: var(--radius-md);
  --component-alert-border-width-default: var(--border-width-default);
  --component-alert-status-info-bg: var(--color-status-info-bg);
  --component-alert-status-info-border: var(--color-status-info-border);
  --component-alert-status-info-text: var(--color-status-info-text);
  --component-alert-text-secondary: var(--color-text-secondary);
  --component-alert-status-success-bg: var(--color-status-success-bg);
  --component-alert-status-success-border: var(--color-status-success-border);
  --component-alert-status-success-text: var(--color-status-success-text);
  --component-alert-status-warning-bg: var(--color-status-warning-bg);
  --component-alert-status-warning-border: var(--color-status-warning-border);
  --component-alert-status-warning-text: var(--color-status-warning-text);
  --component-alert-status-danger-bg: var(--color-status-danger-bg);
  --component-alert-status-danger-border: var(--color-status-danger-border);
  --component-alert-status-danger-text: var(--color-status-danger-text);
  --component-toast-radius-md: var(--radius-md);
  --component-toast-border-width-default: var(--border-width-default);
  --component-toast-surface-raised: var(--color-bg-raised);
  --component-toast-border-default: var(--color-border-default);
  --component-toast-effect-shadow: var(--color-effect-shadow);
  --component-toast-status-info-text: var(--color-status-info-text);
  --component-toast-text-primary: var(--color-text-primary);
  --component-toast-text-secondary: var(--color-text-secondary);
  --component-toast-status-success-text: var(--color-status-success-text);
  --component-toast-status-warning-text: var(--color-status-warning-text);
  --component-toast-status-danger-text: var(--color-status-danger-text);
  --component-tooltip-effect-shadow: var(--color-effect-shadow);
  --component-tooltip-radius-sm: var(--radius-sm);
  --component-tooltip-surface-inverse: var(--color-bg-inverse);
  --component-tooltip-text-inverse: var(--color-text-inverse);
  --component-progress-text-primary: var(--color-text-primary);
  --component-progress-text-secondary: var(--color-text-secondary);
  --component-progress-radius-full: var(--radius-full);
  --component-progress-surface-subtle: var(--color-bg-subtle);
  --component-progress-selection-foreground: var(--color-selection-foreground);
  --component-progress-status-success-text: var(--color-status-success-text);
  --component-spinner-selection-foreground: var(--color-selection-foreground);
  --component-skeleton-radius-sm: var(--radius-sm);
  --component-skeleton-surface-subtle: var(--color-bg-subtle);
  --component-skeleton-radius-full: var(--radius-full);
  --component-empty-state-radius-md: var(--radius-md);
  --component-empty-state-surface-surface: var(--color-bg-surface);
  --component-empty-state-text-link: var(--color-text-link);
  --component-empty-state-text-primary: var(--color-text-primary);
  --component-empty-state-text-secondary: var(--color-text-secondary);
  --component-menu-item-radius-sm: var(--radius-sm);
  --component-menu-item-surface-surface: var(--color-bg-surface);
  --component-menu-item-text-primary: var(--color-text-primary);
  --component-menu-item-text-secondary: var(--color-text-secondary);
  --component-menu-item-surface-subtle: var(--color-bg-subtle);
  --component-menu-item-border-width-focus: var(--border-width-focus);
  --component-menu-item-border-focus: var(--color-border-focus);
  --component-menu-item-text-disabled: var(--color-text-disabled);
  --component-menu-item-status-danger-text: var(--color-status-danger-text);
  --component-dialog-radius-md: var(--radius-md);
  --component-dialog-border-width-default: var(--border-width-default);
  --component-dialog-surface-raised: var(--color-bg-raised);
  --component-dialog-border-default: var(--color-border-default);
  --component-dialog-effect-shadow: var(--color-effect-shadow);
  --component-dialog-text-primary: var(--color-text-primary);
  --component-dialog-text-secondary: var(--color-text-secondary);
  --component-popover-radius-md: var(--radius-md);
  --component-popover-border-width-default: var(--border-width-default);
  --component-popover-surface-raised: var(--color-bg-raised);
  --component-popover-border-default: var(--color-border-default);
  --component-popover-effect-shadow: var(--color-effect-shadow);
  --component-popover-text-secondary: var(--color-text-secondary);
  --component-popover-text-primary: var(--color-text-primary);
  --component-drawer-radius-none: var(--radius-none);
  --component-drawer-border-width-default: var(--border-width-default);
  --component-drawer-surface-raised: var(--color-bg-raised);
  --component-drawer-border-default: var(--color-border-default);
  --component-drawer-effect-shadow: var(--color-effect-shadow);
  --component-drawer-text-primary: var(--color-text-primary);
  --component-drawer-text-secondary: var(--color-text-secondary);
  --type-mono-display-family: var(--font-family-mono);
  --type-mono-display-style: var(--font-style-regular);
  --type-mono-display-size: var(--font-size-80);
  --type-mono-display-line-height: var(--line-height-88);
  --type-mono-display-tracking: var(--tracking-normal);
  --type-mono-headline-family: var(--font-family-mono);
  --type-mono-headline-style: var(--font-style-regular);
  --type-mono-headline-size: var(--font-size-40);
  --type-mono-headline-line-height: var(--line-height-48);
  --type-mono-headline-tracking: var(--tracking-normal);
  --type-mono-title-family: var(--font-family-mono);
  --type-mono-title-style: var(--font-style-regular);
  --type-mono-title-size: var(--font-size-24);
  --type-mono-title-line-height: var(--line-height-32);
  --type-mono-title-tracking: var(--tracking-normal);
  --type-mono-body-family: var(--font-family-mono);
  --type-mono-body-style: var(--font-style-regular);
  --type-mono-body-size: var(--font-size-16);
  --type-mono-body-line-height: var(--line-height-24);
  --type-mono-body-tracking: var(--tracking-normal);
  --type-mono-ui-family: var(--font-family-mono);
  --type-mono-ui-style: var(--font-style-regular);
  --type-mono-ui-size: var(--font-size-14);
  --type-mono-ui-line-height: var(--line-height-20);
  --type-mono-ui-tracking: var(--tracking-normal);
  --type-mono-micro-family: var(--font-family-mono);
  --type-mono-micro-style: var(--font-style-regular);
  --type-mono-micro-size: var(--font-size-12);
  --type-mono-micro-line-height: var(--line-height-16);
  --type-mono-micro-tracking: var(--tracking-normal);
  --type-mono-glyph-family: var(--font-family-mono);
  --type-mono-glyph-style: var(--font-style-regular);
  --type-mono-glyph-size: var(--font-size-112);
  --type-mono-glyph-line-height: var(--line-height-128);
  --type-mono-glyph-tracking: var(--tracking-normal);
  --type-mono-numeral-family: var(--font-family-mono);
  --type-mono-numeral-style: var(--font-style-regular);
  --type-mono-numeral-size: var(--font-size-48);
  --type-mono-numeral-line-height: var(--line-height-56);
  --type-mono-numeral-tracking: var(--tracking-normal);
  --brand-mono-inset: var(--dimension-16);
  --brand-mono-gap: var(--dimension-8);
  --brand-mono-header-height: var(--dimension-40);
  --brand-mono-cell-small: var(--dimension-48);
  --brand-mono-cell-large: var(--dimension-80);
  --brand-mono-key-small: var(--dimension-28);
  --brand-mono-key-medium: var(--dimension-36);
  --brand-mono-grid-step: var(--dimension-24);
  --component-mono-window-surface: var(--brand-mono-surface);
  --component-mono-window-ink: var(--brand-mono-ink);
  --component-mono-window-border: var(--brand-mono-rule);
  --component-mono-window-radius: var(--radius-sm);
  --component-mono-metric-surface: var(--brand-mono-surface);
  --component-mono-metric-ink: var(--brand-mono-ink);
  --component-mono-metric-border: var(--brand-mono-rule);
  --component-mono-metric-radius: var(--radius-sm);
  --component-mono-feature-surface: var(--brand-mono-surface);
  --component-mono-feature-ink: var(--brand-mono-ink);
  --component-mono-feature-border: var(--brand-mono-rule);
  --component-mono-feature-radius: var(--radius-sm);
  --component-mono-glyph-surface: var(--brand-mono-surface);
  --component-mono-glyph-ink: var(--brand-mono-ink);
  --component-mono-glyph-border: var(--brand-mono-rule);
  --component-mono-glyph-radius: var(--radius-sm);
  --component-mono-keycap-surface: var(--brand-mono-surface);
  --component-mono-keycap-ink: var(--brand-mono-ink);
  --component-mono-keycap-border: var(--brand-mono-rule);
  --component-mono-keycap-radius: var(--radius-sm);
  --component-mono-specimen-surface: var(--brand-mono-surface);
  --component-mono-specimen-ink: var(--brand-mono-ink);
  --component-mono-specimen-border: var(--brand-mono-rule);
  --component-mono-specimen-radius: var(--radius-sm);
  --component-mono-code-surface: var(--brand-mono-surface);
  --component-mono-code-ink: var(--brand-mono-ink);
  --component-mono-code-border: var(--brand-mono-rule);
  --component-mono-code-radius: var(--radius-sm);
  --component-mono-progress-surface: var(--brand-mono-surface);
  --component-mono-progress-ink: var(--brand-mono-ink);
  --component-mono-progress-border: var(--brand-mono-rule);
  --component-mono-progress-radius: var(--radius-sm);
  --component-mono-stat-surface: var(--brand-mono-surface);
  --component-mono-stat-ink: var(--brand-mono-ink);
  --component-mono-stat-border: var(--brand-mono-rule);
  --component-mono-stat-radius: var(--radius-sm);
  --component-mono-annotation-surface: var(--brand-mono-surface);
  --component-mono-annotation-ink: var(--brand-mono-ink);
  --component-mono-annotation-border: var(--brand-mono-rule);
  --component-mono-annotation-radius: var(--radius-sm);
  --component-mono-stamp-surface: var(--brand-mono-surface);
  --component-mono-stamp-ink: var(--brand-mono-ink);
  --component-mono-stamp-border: var(--brand-mono-rule);
  --component-mono-stamp-radius: var(--radius-sm);
  --component-mono-section-surface: var(--brand-mono-surface);
  --component-mono-section-ink: var(--brand-mono-ink);
  --component-mono-section-border: var(--brand-mono-rule);
  --component-mono-section-radius: var(--radius-sm);
  --brand-mono-shadow-offset-x: var(--dimension-3);
  --brand-mono-shadow-offset-y: var(--dimension-3);
  --brand-mono-shadow-blur: var(--dimension-0);
}

@media (prefers-reduced-motion: reduce) {
  :root:not([data-motion]) {
    --motion-duration-fast: 0ms;
    --motion-duration-standard: 0ms;
    --motion-duration-slow: 0ms;
    --motion-duration-reduced: 0ms;
    --motion-easing-standard: cubic-bezier(0.2,0,0,1);
    --motion-easing-enter: cubic-bezier(0,0,0.2,1);
    --motion-easing-exit: cubic-bezier(0.4,0,1,1);
    --motion-duration-instant: 0ms;
    --motion-duration-micro: 0ms;
    --motion-duration-moderate: 0ms;
    --motion-duration-enter: 0ms;
    --motion-duration-exit: 0ms;
    --motion-duration-stagger: 0ms;
    --motion-distance-subtle: 0px;
    --motion-distance-default: 0px;
    --motion-distance-large: 0px;
  }
}

/* Technical diagrams v1.4 */
:root, [data-theme], [data-density], [data-viewport], [data-motion] {
  --diagram-technical-canvas: var(--brand-mono-canvas);
  --diagram-technical-ink: var(--brand-mono-accent);
  --diagram-technical-detail: var(--brand-mono-accent);
  --diagram-technical-guide: var(--brand-mono-grid);
  --diagram-technical-tint: var(--brand-mono-hover);
  --diagram-technical-label: var(--brand-mono-accent);
  --diagram-technical-stroke-outline: 1px;
  --diagram-technical-stroke-detail: 0.75px;
  --diagram-technical-stroke-guide: 0.5px;
  --diagram-technical-grid-step: 20px;
  --diagram-technical-guide-dash: 6px;
  --diagram-technical-guide-gap: 5px;
  --diagram-technical-callout-dot: 2.3px;
  --diagram-technical-inset: 24px;
}

/* Poster studio v1.6 — Paper/Mono brand palettes */
:root {
  --color-poster-pink: #F497C3;
  --color-poster-cobalt: #142AC8;
  --color-poster-ochre: #BC7414;
  --color-poster-espresso: #2D1D0E;
  --color-poster-mint: #A7C7B5;
  --color-poster-fern: #27564C;
  --color-poster-red: #EB3E36;
  --color-poster-cream: #F2E7CC;
  --poster-width: 1080px;
  --poster-height-feed: 1350px;
  --poster-height-story: 1920px;
  --poster-inset: 72px;
  --poster-safe-story-top: 160px;
  --poster-safe-story-bottom: 160px;
  --poster-gap: 32px;
  --poster-border-inset: 8px;
  --poster-halftone-step: 12px;
  --poster-halftone-radius: 3px;
  --poster-type-display-size: 140px;
  --poster-type-display-line: 151.2px;
  --poster-type-condensed-size: 112px;
  --poster-type-condensed-line: 132px;
  --poster-type-arabic-size: 70px;
  --poster-type-arabic-line: 101.5px;
  --poster-type-arabic-campaign-size: 196px;
  --poster-type-arabic-campaign-line: 244px;
  --poster-type-body-size: 30px;
  --poster-type-body-line: 40px;
  --poster-type-meta-size: 24px;
  --poster-type-meta-line: 34px;
  --poster-type-workshop-arabic-size: 150px;
  --poster-type-workshop-arabic-line: 217.5px;
  --poster-type-workshop-title-size: 96px;
  --poster-type-workshop-title-line: 118px;
  --poster-type-cover-title-size: 56px;
  --poster-type-cover-title-line: 68px;
  --poster-type-cover-meta-size: 17px;
  --poster-type-cover-meta-line: 22px;
  --poster-type-feature-arabic-size: 58px;
  --poster-type-feature-arabic-line: 84.1px;
  --poster-type-feature-title-size: 76px;
  --poster-type-feature-title-line: 91px;
  --poster-type-feature-meta-size: 21px;
  --poster-type-feature-meta-line: 26px;
}

/* Match native print masters inside explicit poster containers. */
[data-poster-palette] {
  --brand-mono-canvas: var(--color-mono-paper);
  --brand-mono-surface: var(--color-paper-50);
  --brand-mono-subtle: var(--color-mono-sheet);
  --brand-mono-ink: var(--color-neutral-900);
  --brand-mono-muted: var(--color-neutral-600);
  --brand-mono-accent: var(--color-blue-800);
  --brand-mono-accent-decorative: var(--color-mono-blue);
  --brand-mono-grid: var(--color-blue-200);
  --brand-mono-rule: var(--color-blue-300);
  --brand-mono-selected: var(--color-blue-800);
  --brand-mono-on-selected: var(--color-neutral-0);
  --brand-mono-hover: var(--color-blue-100);
  --brand-mono-disabled: var(--color-text-disabled);
  --brand-mono-shadow: var(--color-blue-400);
  --brand-mono-blueprint: var(--color-blue-50);
  --brand-mono-inverse: var(--color-neutral-900);
  --brand-mono-on-inverse: var(--color-mono-paper);
  --brand-mono-selected-hover: var(--color-blue-700);
}

:root, [data-poster-palette="paper"] {
  --poster-canvas: var(--brand-mono-canvas);
  --poster-ink: var(--brand-mono-ink);
  --poster-accent: var(--brand-mono-selected);
  --poster-accent-ink: var(--brand-mono-on-selected);
  --poster-subtle: var(--brand-mono-grid);
  --poster-paper: var(--brand-mono-canvas);
  --poster-photo-shadow: var(--brand-mono-ink);
  --poster-photo-highlight: var(--brand-mono-canvas);
}

[data-poster-palette="ink"] {
  --poster-canvas: var(--brand-mono-inverse);
  --poster-ink: var(--brand-mono-on-inverse);
  --poster-accent: var(--brand-mono-accent-decorative);
  --poster-accent-ink: var(--brand-mono-on-selected);
  --poster-subtle: var(--brand-mono-rule);
  --poster-paper: var(--brand-mono-on-inverse);
  --poster-photo-shadow: var(--brand-mono-inverse);
  --poster-photo-highlight: var(--brand-mono-on-inverse);
}

[data-poster-palette="blueprint"] {
  --poster-canvas: var(--brand-mono-blueprint);
  --poster-ink: var(--brand-mono-ink);
  --poster-accent: var(--brand-mono-selected);
  --poster-accent-ink: var(--brand-mono-on-selected);
  --poster-subtle: var(--brand-mono-grid);
  --poster-paper: var(--brand-mono-surface);
  --poster-photo-shadow: var(--brand-mono-ink);
  --poster-photo-highlight: var(--brand-mono-blueprint);
}

[data-poster-palette="blue"] {
  --poster-canvas: var(--brand-mono-selected);
  --poster-ink: var(--brand-mono-on-selected);
  --poster-accent: var(--brand-mono-ink);
  --poster-accent-ink: var(--brand-mono-on-inverse);
  --poster-subtle: var(--brand-mono-rule);
  --poster-paper: var(--brand-mono-canvas);
  --poster-photo-shadow: var(--brand-mono-selected);
  --poster-photo-highlight: var(--brand-mono-on-selected);
}

/* Zine expression and photo-zine extension — 2026-10-10. */
:root {
  --photo-zine-palette-paper: #F1F0E9;
  --photo-zine-paper: var(--photo-zine-palette-paper);
  --photo-zine-palette-ink: #202020;
  --photo-zine-ink: var(--photo-zine-palette-ink);
  --photo-zine-palette-cobalt: #2345DF;
  --photo-zine-cobalt: var(--photo-zine-palette-cobalt);
  --photo-zine-palette-on-cobalt: #F5F4EB;
  --photo-zine-on-cobalt: var(--photo-zine-palette-on-cobalt);
  --photo-zine-palette-label-paper: #F7F6EF;
  --photo-zine-label-paper: var(--photo-zine-palette-label-paper);
  --photo-zine-palette-label-ink: #2040D4;
  --photo-zine-label-ink: var(--photo-zine-palette-label-ink);
  --photo-zine-palette-line-ink: #2447ED;
  --photo-zine-line-ink: var(--photo-zine-palette-line-ink);
  --photo-zine-value-margin: 44px;
  --photo-zine-space-margin: var(--photo-zine-value-margin);
  --photo-zine-value-caption-inset: 29px;
  --photo-zine-space-caption-inset: var(--photo-zine-value-caption-inset);
  --photo-zine-value-label-x: 13px;
  --photo-zine-space-label-x: var(--photo-zine-value-label-x);
  --photo-zine-value-label-top: 9px;
  --photo-zine-space-label-top: var(--photo-zine-value-label-top);
  --photo-zine-value-label-bottom: 10px;
  --photo-zine-space-label-bottom: var(--photo-zine-value-label-bottom);
  --photo-zine-value-header-inset: 16px;
  --photo-zine-space-header-inset: var(--photo-zine-value-header-inset);
  --photo-zine-value-credit-inset: 15px;
  --photo-zine-space-credit-inset: var(--photo-zine-value-credit-inset);
  --zine-palette-vermilion: #E54B2B;
  --zine-palette-acid: #D8EC70;
  --zine-palette-muted: #66645D;
  --zine-palette-line: #CBC9BF;
  --zine-paper: var(--photo-zine-palette-paper);
  --zine-ink: var(--photo-zine-palette-ink);
  --zine-cobalt: var(--photo-zine-palette-cobalt);
  --zine-white: var(--photo-zine-palette-on-cobalt);
  --zine-vermilion: var(--zine-palette-vermilion);
  --zine-acid: var(--zine-palette-acid);
  --zine-muted: var(--zine-palette-muted);
  --zine-line: var(--zine-palette-line);
  --zine-space-small: var(--space-16);
  --zine-space-medium: var(--space-24);
  --zine-space-large: var(--space-32);
  --zine-space-inset: var(--space-64);
  --zine-texture-fine-opacity: 38%;
  --zine-texture-coarse-opacity: 68%;
}
