:root {
  color-scheme: light;

  /* Brand primitives */
  --ah-ink: #0B1020;
  --ah-indigo: #5657E6;
  --ah-indigo-deep: #3730A3;
  --ah-lime: #B7F34A;
  --ah-cyan: #20C7D6;
  --ah-canvas: #F8FAFC;
  --ah-white: #FFFFFF;
  --ah-soft: #F1F4F8;
  --ah-border-primitive: #E1E7EE;
  --ah-text-secondary-primitive: #5E6878;
  --ah-dark-surface-primitive: #101629;

  /* Semantic colors — Light */
  --ah-color-bg: #F8FAFC;
  --ah-color-surface: #FFFFFF;
  --ah-color-surface-soft: #F1F4F8;
  --ah-color-surface-raised: #FFFFFF;

  --ah-color-text: #0B1020;
  --ah-color-text-secondary: #5E6878;
  --ah-color-text-muted: #7B8594;
  --ah-color-text-inverse: #F8FAFC;

  --ah-color-border: #E1E7EE;
  --ah-color-border-strong: #CBD5E1;

  --ah-color-brand: #5657E6;
  --ah-color-brand-hover: #494AD6;
  --ah-color-brand-active: #3730A3;

  --ah-color-signal: #B7F34A;
  --ah-color-intelligence: #20C7D6;

  --ah-color-dark-bg: #0B1020;
  --ah-color-dark-surface: #101629;
  --ah-color-dark-border: #26324A;

  /* Typography */
  --ah-font-sans: "Manrope Variable", Manrope, Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ah-font-mono: "IBM Plex Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;

  --ah-font-size-xs: 0.75rem;
  --ah-font-size-sm: 0.875rem;
  --ah-font-size-body: 1rem;
  --ah-font-size-body-lg: clamp(1.125rem, 1.4vw, 1.375rem);
  --ah-font-size-h4: clamp(1.2rem, 1.6vw, 1.5rem);
  --ah-font-size-h3: clamp(1.5rem, 2.5vw, 2.5rem);
  --ah-font-size-h2: clamp(2.25rem, 4.5vw, 4.5rem);
  --ah-font-size-display: clamp(2.75rem, 6vw, 6rem);

  /* Spacing */
  --ah-space-1: 4px;
  --ah-space-2: 8px;
  --ah-space-3: 12px;
  --ah-space-4: 16px;
  --ah-space-5: 24px;
  --ah-space-6: 32px;
  --ah-space-7: 48px;
  --ah-space-8: 64px;
  --ah-space-9: 80px;
  --ah-space-10: 96px;
  --ah-space-11: 128px;
  --ah-space-12: 160px;

  /* Layout */
  --ah-container-narrow: 760px;
  --ah-container-standard: 1180px;
  --ah-container-wide: 1280px;
  --ah-container-feature: 1440px;
  --ah-gutter: clamp(20px, 3vw, 48px);
  --ah-section-space: clamp(72px, 9vw, 144px);

  /* Radius */
  --ah-radius-xs: 8px;
  --ah-radius-sm: 10px;
  --ah-radius-md: 14px;
  --ah-radius-lg: 22px;
  --ah-radius-xl: 28px;
  --ah-radius-pill: 999px;

  /* Shadows */
  --ah-shadow-sm: 0 1px 2px rgba(11, 16, 32, 0.06), 0 8px 24px rgba(11, 16, 32, 0.04);
  --ah-shadow-md: 0 12px 32px rgba(11, 16, 32, 0.08);
  --ah-shadow-feature: 0 24px 64px rgba(11, 16, 32, 0.12);

  /* Motion */
  --ah-ease-standard: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ah-ease-enter: cubic-bezier(0.16, 1, 0.3, 1);
  --ah-ease-exit: cubic-bezier(0.4, 0, 1, 1);
  --ah-ease-emphasis: cubic-bezier(0.22, 1, 0.36, 1);

  --ah-duration-fast: 160ms;
  --ah-duration-base: 220ms;
  --ah-duration-medium: 480ms;
  --ah-duration-slow: 650ms;
  --ah-duration-emphasis: 800ms;

  /* Focus */
  --ah-focus-ring: 0 0 0 3px rgba(86, 87, 230, 0.28);
}

/* Explicit Dark Mode */
html[data-theme="dark"] {
  color-scheme: dark;

  --ah-color-bg: #0B1020;
  --ah-color-surface: #101629;
  --ah-color-surface-soft: #151D33;
  --ah-color-surface-raised: #182139;

  --ah-color-text: #F8FAFC;
  --ah-color-text-secondary: #B2BDCC;
  --ah-color-text-muted: #8E9AAD;
  --ah-color-text-inverse: #0B1020;

  --ah-color-border: #26324A;
  --ah-color-border-strong: #34415D;

  --ah-color-brand: #7778EF;
  --ah-color-brand-hover: #8A8BF4;
  --ah-color-brand-active: #9C9DF7;

  --ah-color-signal: #B7F34A;
  --ah-color-intelligence: #3AD4E1;

  --ah-color-dark-bg: #080D1A;
  --ah-color-dark-surface: #101629;
  --ah-color-dark-border: #26324A;

  --ah-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.24), 0 10px 28px rgba(0, 0, 0, 0.18);
  --ah-shadow-md: 0 16px 40px rgba(0, 0, 0, 0.26);
  --ah-shadow-feature: 0 28px 72px rgba(0, 0, 0, 0.34);

  --ah-focus-ring: 0 0 0 3px rgba(119, 120, 239, 0.34);
}

/* System Mode is applied only when the user explicitly chooses System. */
@media (prefers-color-scheme: dark) {
  html[data-theme="system"] {
    color-scheme: dark;

    --ah-color-bg: #0B1020;
    --ah-color-surface: #101629;
    --ah-color-surface-soft: #151D33;
    --ah-color-surface-raised: #182139;

    --ah-color-text: #F8FAFC;
    --ah-color-text-secondary: #B2BDCC;
    --ah-color-text-muted: #8E9AAD;
    --ah-color-text-inverse: #0B1020;

    --ah-color-border: #26324A;
    --ah-color-border-strong: #34415D;

    --ah-color-brand: #7778EF;
    --ah-color-brand-hover: #8A8BF4;
    --ah-color-brand-active: #9C9DF7;

    --ah-color-signal: #B7F34A;
    --ah-color-intelligence: #3AD4E1;

    --ah-color-dark-bg: #080D1A;
    --ah-color-dark-surface: #101629;
    --ah-color-dark-border: #26324A;

    --ah-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.24), 0 10px 28px rgba(0, 0, 0, 0.18);
    --ah-shadow-md: 0 16px 40px rgba(0, 0, 0, 0.26);
    --ah-shadow-feature: 0 28px 72px rgba(0, 0, 0, 0.34);

    --ah-focus-ring: 0 0 0 3px rgba(119, 120, 239, 0.34);
  }
}

/* Strategic dark sections remain intentionally dark in every global mode. */
.ah-section--dark {
  --ah-color-bg: #0B1020;
  --ah-color-surface: #101629;
  --ah-color-surface-soft: #151D33;
  --ah-color-surface-raised: #182139;
  --ah-color-text: #F8FAFC;
  --ah-color-text-secondary: #B2BDCC;
  --ah-color-text-muted: #8E9AAD;
  --ah-color-border: #26324A;
  --ah-color-border-strong: #34415D;
  --ah-color-brand: #7778EF;
  --ah-color-brand-hover: #8A8BF4;
  --ah-color-brand-active: #9C9DF7;
  --ah-color-intelligence: #3AD4E1;
}