/* Generated by @mctlhq/css — raw tokens + semantic theme layer. */
:root {
  --mctl-color-ink: #0a0b0d;
  --mctl-color-ink2: #0f1114;
  --mctl-color-ink3: #15181d;
  --mctl-color-line: #1f242b;
  --mctl-color-line2: #2a313a;
  --mctl-color-fg: #e6e7e9;
  --mctl-color-fg2: #a4a8ae;
  --mctl-color-fg3: #6b7079;
  --mctl-color-paper: #f1ede4;
  --mctl-color-paper-ink: #15181d;
  --mctl-color-paper-fg: #3a3f47;
  --mctl-color-paper-line: #d8d2c4;
  --mctl-color-cyan: #00e5ff;
  --mctl-color-cyan-highlight: #7df2ff;
  --mctl-color-lime: #bdf24a;
  --mctl-color-lime-highlight: #dcff8c;
  --mctl-color-vermilion: #ff5a36;
  --mctl-color-vermilion-highlight: #ff8a6a;
  --mctl-color-lilac: #b07aff;
  --mctl-color-lilac-highlight: #d6b3ff;
  --mctl-color-ok: #7cf2a4;
  --mctl-color-warn: #f5a524;
  --mctl-color-bad: #ff6b6b;
  --mctl-surface-dark-bg: #0a0b0d;
  --mctl-surface-dark-elevated: #0f1114;
  --mctl-surface-dark-card: #15181d;
  --mctl-surface-dark-line: #1f242b;
  --mctl-surface-dark-line-strong: #2a313a;
  --mctl-surface-dark-fg: #e6e7e9;
  --mctl-surface-dark-fg-muted: #a4a8ae;
  --mctl-surface-dark-fg-subtle: #6b7079;
  --mctl-surface-light-bg: #f1ede4;
  --mctl-surface-light-elevated: #f1ede4;
  --mctl-surface-light-card: #f1ede4;
  --mctl-surface-light-line: #d8d2c4;
  --mctl-surface-light-line-strong: #d8d2c4;
  --mctl-surface-light-fg: #15181d;
  --mctl-surface-light-fg-muted: #3a3f47;
  --mctl-surface-light-fg-subtle: #6b7079;
  --mctl-accent-cyan-primary: #00e5ff;
  --mctl-accent-cyan-highlight: #7df2ff;
  --mctl-accent-lime-primary: #bdf24a;
  --mctl-accent-lime-highlight: #dcff8c;
  --mctl-accent-vermilion-primary: #ff5a36;
  --mctl-accent-vermilion-highlight: #ff8a6a;
  --mctl-accent-lilac-primary: #b07aff;
  --mctl-accent-lilac-highlight: #d6b3ff;
  --mctl-status-ok: #7cf2a4;
  --mctl-status-warn: #f5a524;
  --mctl-status-bad: #ff6b6b;
  --mctl-syntax-key: #7df2ff;
  --mctl-syntax-string: #bdf24a;
  --mctl-syntax-comment: #6b7079;
  --mctl-typography-font-family-display: 'Geist', system-ui, -apple-system, sans-serif;
  --mctl-typography-font-family-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
  --mctl-typography-font-family-editorial: 'Instrument Serif', Georgia, serif;
  --mctl-typography-font-weight-light: 300;
  --mctl-typography-font-weight-regular: 400;
  --mctl-typography-font-weight-medium: 500;
  --mctl-typography-font-weight-semibold: 600;
  --mctl-typography-font-weight-bold: 700;
  --mctl-typography-font-size-marker: clamp(11px, 0.78vw, 12px);
  --mctl-typography-font-size-body: clamp(15px, 1.05vw, 16px);
  --mctl-typography-font-size-lede: clamp(18px, 1.4vw, 20px);
  --mctl-typography-font-size-stat: clamp(40px, 4vw, 56px);
  --mctl-typography-font-size-section-title: clamp(28px, 3.6vw, 56px);
  --mctl-typography-font-size-hero: clamp(48px, 8.4vw, 132px);
  --mctl-typography-line-height-hero: 0.92;
  --mctl-typography-line-height-section-title: 1.05;
  --mctl-typography-line-height-lede: 1.55;
  --mctl-typography-line-height-body: 1.5;
  --mctl-typography-letter-spacing-hero: -0.02em;
  --mctl-typography-letter-spacing-marker: 0.12em;
  --mctl-typography-letter-spacing-normal: 0;
  --mctl-space-0: 0;
  --mctl-space-1: 4px;
  --mctl-space-2: 8px;
  --mctl-space-3: 12px;
  --mctl-space-4: 16px;
  --mctl-space-5: 24px;
  --mctl-space-6: 32px;
  --mctl-space-7: 48px;
  --mctl-space-8: 64px;
  --mctl-space-9: 96px;
  --mctl-space-10: 132px;
  --mctl-layout-page-padding: clamp(20px, 4vw, 56px);
  --mctl-layout-section-padding: clamp(72px, 9vw, 132px);
  --mctl-radius-none: 0;
  --mctl-radius-sm: 2px;
  --mctl-radius-md: 4px;
  --mctl-radius-lg: 8px;
  --mctl-radius-pill: 999px;
  --mctl-shadow-none: none;
  --mctl-shadow-overlay: 0 16px 48px rgba(0, 0, 0, 0.48);
  --mctl-z-index-base: 0;
  --mctl-z-index-sticky: 100;
  --mctl-z-index-nav: 200;
  --mctl-z-index-overlay: 800;
  --mctl-z-index-modal: 900;
  --mctl-z-index-toast: 1000;
  --mctl-motion-duration-fast: 120ms;
  --mctl-motion-duration-base: 200ms;
  --mctl-motion-duration-slow: 320ms;
  --mctl-motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --mctl-motion-easing-entrance: cubic-bezier(0, 0, 0, 1);
  --mctl-motion-easing-exit: cubic-bezier(0.4, 0, 1, 1);
}

/*
 * Semantic theme layer. Maps raw --mctl-* tokens (inlined above this block
 * by the build) onto stable, theme-aware variables.
 *
 *   data-theme  = "dark" (default) | "light"   — surface flip
 *   data-accent = "cyan" (default) | "lime" | "vermilion" | "lilac"
 */
:root {
  /* Surface — dark "Engineering" is the default. */
  --surface-bg: var(--mctl-surface-dark-bg);
  --surface-elevated: var(--mctl-surface-dark-elevated);
  --surface-card: var(--mctl-surface-dark-card);
  --surface-line: var(--mctl-surface-dark-line);
  --surface-line-strong: var(--mctl-surface-dark-line-strong);
  --surface-fg: var(--mctl-surface-dark-fg);
  --surface-fg-muted: var(--mctl-surface-dark-fg-muted);
  --surface-fg-subtle: var(--mctl-surface-dark-fg-subtle);

  /* Accent — cyan is the default. */
  --accent: var(--mctl-accent-cyan-primary);
  --accent-highlight: var(--mctl-accent-cyan-highlight);

  /* Status. */
  --status-ok: var(--mctl-status-ok);
  --status-warn: var(--mctl-status-warn);
  --status-bad: var(--mctl-status-bad);

  /* Syntax. */
  --syntax-key: var(--mctl-syntax-key);
  --syntax-string: var(--mctl-syntax-string);
  --syntax-comment: var(--mctl-syntax-comment);

  /* Type families. */
  --font-display: var(--mctl-typography-font-family-display);
  --font-mono: var(--mctl-typography-font-family-mono);
  --font-editorial: var(--mctl-typography-font-family-editorial);
}

[data-theme='light'] {
  --surface-bg: var(--mctl-surface-light-bg);
  --surface-elevated: var(--mctl-surface-light-elevated);
  --surface-card: var(--mctl-surface-light-card);
  --surface-line: var(--mctl-surface-light-line);
  --surface-line-strong: var(--mctl-surface-light-line-strong);
  --surface-fg: var(--mctl-surface-light-fg);
  --surface-fg-muted: var(--mctl-surface-light-fg-muted);
  --surface-fg-subtle: var(--mctl-surface-light-fg-subtle);
}

[data-accent='lime'] {
  --accent: var(--mctl-accent-lime-primary);
  --accent-highlight: var(--mctl-accent-lime-highlight);
}

[data-accent='vermilion'] {
  --accent: var(--mctl-accent-vermilion-primary);
  --accent-highlight: var(--mctl-accent-vermilion-highlight);
}

[data-accent='lilac'] {
  --accent: var(--mctl-accent-lilac-primary);
  --accent-highlight: var(--mctl-accent-lilac-highlight);
}
