:root{
  --dark-bg:      #153A50;
  --dark-bg-alt:  #5B8094;
  --light-bg:     #F5F6FA;
  --surface-alt:  #f0f0ee;
  --border:       #e8eaf0;

  --accent-amber: #AAD0E2;
  --accent-steel: #7198AF;
  --blue:         #4f6ef7;
  --green:        #22c55e;
  --red:          #ef4444;

  --cream-lightest: #87B1C8;
  --warm-tan:        #ECCDAE;
  --warm-sand:        #D9BCA0;

  --text-primary:   #000000;
  --text-secondary: #6a7282;
  --text-muted:     #99a1af;
  --text-on-dark:   #ffffff;

  --success-fg: #00a63e; --success-bg: #dcfce7;
  --error-fg:   #e7000b; --error-bg:   #ffe2e2;
  --warning-fg: #fe9a00; --warning-bg: #fef3c6;
  --info-fg:    #155dfc; --info-bg:    #eef6ff;
  --purple-fg:  #9810fa; --purple-bg:  #f3e8ff;
  --teal-fg:    #009689; --teal-bg:    #cbfbf1;

  --radius-card: 12px;
  --radius-ui:   8px;
  --radius-pill: 999px;
  --radius-button-asym: 24px 4px 24px 4px;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --canvas-width: 1440px;
  --page-padding: 24px 32px;
  --card-padding: 20px;
  --card-gap: 16px;

  /* --- Not part of the given Aqua spec, added so the page doesn't break ---
     Same gap as the Twilight variant: tokens.css defines --black, --surface,
     --ease, --warning-text, and the --space-1..8 spacing scale, referenced
     267 times combined across style.css and the page-specific stylesheets.
     None of these are part of the recolor, so carried over unchanged from
     tokens.css rather than invented -- omitting them would leave every
     var(--space-*)/var(--ease) reference undefined and break layout/motion,
     not just recolor it. */
  --black: #000000;
  --surface: #0a0a0f;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --warning-text: #b45309;

  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 40px;
  --space-5: 64px;
  --space-6: 80px;
  --space-7: 120px;
  --space-8: 160px;
}
