:root {
  /* Typography */
  --font-sans: var(--default-font-family);
  --font-mono: var(--code-font-family);
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-weight-black: 800;
  --text-2xs: .68rem;
  --text-xs: .75rem;
  --text-sm: .875rem;
  --text-md: 1rem;
  --text-lg: 1.25rem;
  --text-xl: 1.5rem;
  --text-2xl: 2rem;
  --leading-body: 1.55;
  --leading-heading: 1.15;

  /* Four-pixel spacing scale */
  --space-0: 0;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-9: 36px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-18: 72px;

  /* Component sizing */
  --radius: var(--radius-3);
  --border-width: 1px;
  --control-height: 40px;
  --control-height-large: 44px;
  --control-padding: var(--space-2) var(--space-3);
  --button-padding: var(--space-2) var(--space-4);
  --button-padding-small: var(--space-1) var(--space-3);
  --panel-padding: var(--space-6);
  --panel-padding-compact: var(--space-5);
  --page-padding-block: var(--space-10) var(--space-18);
  --page-gutter: var(--space-5);
  --section-gap: var(--space-6);
  --grid-gap: var(--space-4);

  /* Glass chrome */
  --chrome-blur: 12px;
  --chrome-saturation: 140%;
  --chrome-shadow: var(--shadow-2);

  /* Viewport-fit task pages */
  --site-header-height: var(--space-16);
  --task-page-padding-block: var(--space-2);
  --task-hero-min-height: clamp(176px, 24svh, 280px);
  --task-section-padding-block: clamp(var(--space-4), 2svh, var(--space-8));
  --task-card-padding: clamp(var(--space-5), 2svh, var(--space-8));
  --task-form-gap: clamp(var(--space-3), 1.5svh, var(--space-6));
  --task-secondary-gap: clamp(var(--space-4), 2svh, var(--space-6));
  --quiz-page-padding-block: clamp(var(--space-3), 2svh, var(--space-5)) var(--space-12);
  --quiz-heading-gap: clamp(var(--space-3), 2svh, var(--space-5));
  --quiz-card-padding: clamp(var(--space-4), 2.5svh, var(--space-6));
  --quiz-card-gap: clamp(var(--space-3), 1.5svh, var(--space-5));
  --quiz-choice-padding-block: clamp(var(--space-2), 1.25svh, var(--space-3));

  /* Radix Color Aliases: Semantic & Use-Case Mapping */
  --ink: var(--gray-12);
  --muted: var(--gray-11);
  --paper: var(--color-background);

  /* Mutable Surface & Panel Aliases */
  --panel: var(--color-panel-solid);
  --panel-translucent: var(--color-panel-translucent);
  --surface-structural: var(--color-panel-translucent);
  --surface: var(--color-surface);
  --surface-strong: var(--color-panel-solid);
  --surface-chrome: var(--color-panel-translucent);
  --surface-chrome-subtle: var(--color-panel-translucent);
  --surface-overlay: var(--color-panel-solid);
  --overlay: var(--color-overlay);

  /* Lines & Borders */
  --line: var(--gray-a6);
  --line-strong: var(--gray-a7);

  /* Accent Use Case Aliases */
  --accent: var(--accent-9);
  --accent-solid: var(--accent-9);
  --accent-solid-hover: var(--accent-10);
  --accent-text: var(--accent-11);
  --accent-strong: var(--accent-11);
  --accent-text-contrast: var(--accent-12);
  --accent-soft: var(--accent-a3);
  --accent-bg-subtle: var(--accent-a2);
  --accent-border: var(--accent-a7);

  /* Status & Functional Semantic Aliases */
  --success: var(--green-11);
  --success-text: var(--green-11);
  --success-soft: var(--green-a3);
  --green: var(--green-11);
  --green-soft: var(--green-a3);

  --warning: var(--yellow-11);
  --warning-text: var(--yellow-11);
  --warning-soft: var(--yellow-a3);
  --yellow: var(--yellow-11);
  --yellow-soft: var(--yellow-a3);

  --danger: var(--red-11);
  --danger-text: var(--red-11);
  --danger-soft: var(--red-a3);

  --info: var(--blue-11);
  --info-soft: var(--blue-a3);

  --purple: var(--purple-11);
  --purple-soft: var(--purple-a3);
  --orange: var(--orange-11);
  --orange-soft: var(--orange-a3);

  --shadow: var(--shadow-4);
}
