/* ============================================================
   Noctua — Color
   Warm ink + cream paper + a single sharp "pipeline" green.
   No bluish-purple AI gradients. Warmth keeps it human; the
   green signals growth / pipeline velocity / "go".
   ============================================================ */

:root {
  /* ---- Base neutrals (warm-tinted, not pure grey) ---- */
  --ink-900: #16140F;   /* warm near-black — primary text, dark surfaces */
  --ink-800: #26231B;
  --ink-700: #3A352A;
  --ink-600: #57503F;   /* muted body on cream */
  --ink-500: #7A7261;
  --ink-400: #A39A86;
  --ink-300: #C9C0AD;
  --ink-200: #E3DCCC;
  --ink-100: #EFE9DB;
  --paper:   #F6F2E9;   /* warm cream — default page background */
  --paper-deep: #EEE8DA;/* slightly recessed cream */
  --surface: #FFFFFF;   /* card / panel */
  --surface-2: #FBF8F1; /* secondary card on white */

  /* ---- Accent: Pipeline Green ---- */
  --green-900: #0B3A2A;
  --green-700: #14533C;
  --green-600: #1A6B4D;  /* primary brand green */
  --green-500: #22875F;
  --green-400: #34A878;  /* bright / interactive */
  --green-300: #6FC9A1;
  --green-200: #B6E6CF;
  --green-100: #E1F4EA;
  --green-50:  #F0FAF4;

  /* ---- Warm secondary: Clay (used sparingly, accents only) ---- */
  --clay-600: #B45A28;
  --clay-500: #CC6B33;
  --clay-300: #E8B488;
  --clay-100: #F6E5D6;

  /* ---- Semantic ---- */
  --success: #1A6B4D;
  --success-bg: #E1F4EA;
  --warning: #B07A12;
  --warning-bg: #FBF0D6;
  --danger:  #B43A28;
  --danger-bg: #F8E0DB;
  --info:    #2A5F6B;
  --info-bg: #E0EEF1;

  /* ============================================================
     Semantic aliases — reference these in components/UI, not the
     raw scale above.
     ============================================================ */

  /* Backgrounds */
  --bg-page: var(--paper);
  --bg-page-deep: var(--paper-deep);
  --bg-ink: var(--ink-900);          /* inverted / dark sections */
  --surface-card: var(--surface);
  --surface-raised: var(--surface);
  --surface-sunken: var(--surface-2);

  /* Text */
  --text-strong: var(--ink-900);
  --text-body: var(--ink-700);
  --text-muted: var(--ink-500);
  --text-faint: var(--ink-400);
  --text-on-ink: var(--paper);
  --text-on-ink-muted: var(--ink-300);
  --text-accent: var(--green-600);
  --text-on-accent: #FFFFFF;

  /* Borders / hairlines */
  --border-soft: var(--ink-200);
  --border-mid: var(--ink-300);
  --border-strong: var(--ink-900);
  --border-accent: var(--green-600);

  /* Brand */
  --brand: var(--green-600);
  --brand-hover: var(--green-700);
  --brand-bright: var(--green-400);
  --brand-tint: var(--green-100);
}

/* Dark section scope — apply .on-ink to a dark block to flip text tokens */
.on-ink {
  --text-strong: var(--paper);
  --text-body: var(--ink-200);
  --text-muted: var(--ink-400);
  --text-faint: var(--ink-500);
  --border-soft: rgba(255,255,255,0.10);
  --border-mid: rgba(255,255,255,0.18);
  --surface-card: var(--ink-800);
  --surface-sunken: var(--ink-800);
  color: var(--text-body);
}