:root {
  /* Brand colour scale: extracted from Launch System 1.4.1 and Mi Cuenta 0.5.1. */
  --cui-coal-950: #11110f;
  --cui-coal-900: #151513;
  --cui-coal-850: #191917;
  --cui-coal-800: #20201c;
  --cui-coal-750: #24231e;
  --cui-ink: #24211d;

  --cui-ivory-100: #f5f1e7;
  --cui-ivory-150: #eee9dc;
  --cui-ivory-200: #eee6d7;
  --cui-paper-white: #fffdf8;

  --cui-red-800: #681719;
  --cui-red-700: #881f21;
  --cui-red-600: #9e3d38;
  --cui-red-500: #a02729;

  --cui-gold-700: #9d874a;
  --cui-gold-600: #b8a881;
  --cui-gold-500: #c7a957;

  --cui-neutral-600: #756e64;
  --cui-neutral-500: #a39c8f;
  --cui-neutral-400: #bdb4a4;

  /* Semantic colour roles. */
  --cui-color-bg: var(--cui-ivory-150);
  --cui-color-surface: var(--cui-ivory-100);
  --cui-color-surface-raised: var(--cui-paper-white);
  --cui-color-text: var(--cui-ink);
  --cui-color-text-muted: var(--cui-neutral-600);
  --cui-color-line: var(--cui-neutral-400);
  --cui-color-action: var(--cui-red-700);
  --cui-color-action-hover: var(--cui-red-800);
  --cui-color-accent: var(--cui-gold-700);
  --cui-color-focus: var(--cui-gold-500);

  /* Typography: editorial voice versus interface mechanics. */
  --cui-font-editorial: Georgia, "Times New Roman", serif;
  --cui-font-ui: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --cui-font-size-1: 0.625rem;
  --cui-font-size-2: 0.75rem;
  --cui-font-size-3: 0.875rem;
  --cui-font-size-4: 1rem;
  --cui-font-size-5: 1.0625rem;
  --cui-font-size-6: 1.3125rem;
  --cui-font-size-7: 1.6875rem;
  --cui-font-size-8: clamp(2rem, 4vw, 3.25rem);
  --cui-font-size-9: clamp(2.875rem, 6vw, 4.25rem);
  --cui-leading-tight: 1;
  --cui-leading-heading: 1.12;
  --cui-leading-body: 1.55;
  --cui-leading-reading: 1.78;
  --cui-tracking-label: 0.18em;

  /* Spacing. */
  --cui-space-1: 0.25rem;
  --cui-space-2: 0.5rem;
  --cui-space-3: 0.75rem;
  --cui-space-4: 1rem;
  --cui-space-5: 1.25rem;
  --cui-space-6: 1.5rem;
  --cui-space-8: 2rem;
  --cui-space-10: 2.5rem;
  --cui-space-12: 3rem;
  --cui-space-16: 4rem;
  --cui-space-20: 5rem;
  --cui-space-24: 6rem;
  --cui-space-30: 7.5rem;

  /* Layout. */
  --cui-container-text: 45rem;
  --cui-container-content: 67.5rem;
  --cui-container-wide: 70rem;
  --cui-container-max: 80rem;
  --cui-gutter: max(1.3125rem, 5vw);

  /* Structural geometry is square. Pills and circular controls are explicit. */
  --cui-radius-structural: 0;
  --cui-radius-pill: 999px;
  --cui-border-width: 1px;
  --cui-control-height: 3.5rem;
  --cui-button-height: 3.625rem;

  /* Motion and elevation. */
  --cui-duration-fast: 160ms;
  --cui-duration-base: 180ms;
  --cui-ease-standard: ease;
  --cui-shadow-modal: 0 15px 45px rgb(0 0 0 / 35%);
  --cui-shadow-object: 28px 35px 32px rgb(0 0 0 / 50%);
}

.cui-theme-dark {
  --cui-color-bg: var(--cui-coal-850);
  --cui-color-surface: var(--cui-coal-800);
  --cui-color-surface-raised: var(--cui-coal-750);
  --cui-color-text: var(--cui-ivory-200);
  --cui-color-text-muted: var(--cui-neutral-500);
  --cui-color-line: rgb(238 230 215 / 15%);
  --cui-color-action: var(--cui-red-600);
  --cui-color-action-hover: var(--cui-red-500);
  --cui-color-accent: var(--cui-gold-500);
  --cui-color-focus: var(--cui-gold-500);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --cui-duration-fast: 0ms;
    --cui-duration-base: 0ms;
  }
}