/* ===================================================
   TaskMasters — Design Tokens v2
   Single source of truth. Loaded by head.php.
   Based on DESIGN.md: "The Quiet Ledger"
   =================================================== */

:root {
  /* ── Colors: Primary ── */
  --tm-navy:          #0A1F3D;   /* Deep Ledger Navy */
  --tm-navy-2:        #122A4D;   /* Ledger Navy */
  --tm-navy-3:        #1E3A60;   /* Slate Ledger */

  /* ── Colors: Action ── */
  --tm-emerald:       #0F9D6E;   /* Clear Emerald */
  --tm-emerald-deep:  #0B7A55;   /* Deep Emerald (hover/press) */

  /* ── Colors: Tertiary ── */
  --tm-gold:          #C9A961;   /* Warm Audit Gold */
  --tm-gold-soft:     #E5D4A8;   /* Soft Audit Gold */

  /* ── Colors: Neutral ── */
  --tm-cream:         #FAFAF5;   /* Paper Cream — default bg */
  --tm-warm:          #F2EFE6;   /* Warm Paper — alt section fill */
  --tm-ink-900:       #0A0A0A;
  --tm-ink-700:       #374151;
  --tm-ink-500:       #6B7280;
  --tm-line-300:      #D1D5DB;
  --tm-line-200:      #E5E7EB;
  --tm-mist-100:      #F3F4F6;

  /* ── Shadows ── */
  --tm-shadow-hero:   0 30px 80px -20px rgba(10, 31, 61, 0.35);
  --tm-shadow-hover:  0 10px 30px -10px rgba(15, 157, 110, 0.20);
  --tm-shadow-micro:  0 1px 2px rgba(0, 0, 0, 0.06);

  /* ── Radii ── */
  --tm-radius-sm:     8px;
  --tm-radius-md:     10px;
  --tm-radius-lg:     14px;
  --tm-radius-xl:     18px;
  --tm-radius-pill:   999px;

  /* ── Spacing ── */
  --tm-space-xs:      8px;
  --tm-space-sm:      14px;
  --tm-space-md:      24px;
  --tm-space-lg:      32px;
  --tm-space-xl:      40px;
  --tm-space-section: 110px;

  /* ── Typography ── */
  --tm-font-body:    'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --tm-font-display: 'Fraunces', Georgia, serif;

  /* ── Scrollbar ── */
  --tm-scrollbar-thumb: #D1D5DB;
  --tm-scrollbar-hover: #6B7280;
}

/* ── Universal scrollbar (Chrome / Edge / Safari) ── */
::-webkit-scrollbar              { width: 5px; height: 5px; }
::-webkit-scrollbar-track        { background: transparent; }
::-webkit-scrollbar-corner       { background: transparent; }
::-webkit-scrollbar-thumb        { background: var(--tm-scrollbar-thumb); border-radius: 999px; }
::-webkit-scrollbar-thumb:hover  { background: var(--tm-scrollbar-hover); }

/* Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--tm-scrollbar-thumb) transparent;
}