/* ============================================================
   TEN TENTHS — COLOR TOKENS
   Accent green #009638. Black & white foundation. Minimal.
   ============================================================ */
:root {
  /* --- Brand green scale --- */
  --tt-green-50:  #e9f8ef;
  --tt-green-100: #c5ebd4;
  --tt-green-200: #8fd9ab;
  --tt-green-300: #54c47f;
  --tt-green-400: #1fae58;
  --tt-green-500: #009638;  /* brand accent */
  --tt-green-600: #007e2f;
  --tt-green-700: #006225;
  --tt-green-800: #00481b;
  --tt-green-900: #002f11;

  /* --- Neutral / ink scale (warm-neutral black to white) --- */
  --tt-ink-950: #0d0f0e;  /* near-black, brand black */
  --tt-ink-900: #161918;
  --tt-ink-800: #232726;
  --tt-ink-700: #34403c;
  --tt-ink-600: #4d5754;
  --tt-ink-500: #6b7572;
  --tt-ink-400: #939b98;
  --tt-ink-300: #bcc2c0;
  --tt-ink-200: #dde0df;
  --tt-ink-100: #eef0ef;
  --tt-ink-50:  #f6f7f7;
  --tt-white:   #ffffff;
  --tt-black:   #000000;

  /* --- Semantic feedback (used sparingly) --- */
  --tt-success: var(--tt-green-500);
  --tt-warning: #e8a317;
  --tt-danger:  #c8412f;

  /* ===== Semantic aliases ===== */
  --color-accent:        var(--tt-green-500);
  --color-accent-hover:  var(--tt-green-600);
  --color-accent-press:  var(--tt-green-700);
  --color-accent-subtle: var(--tt-green-50);
  --color-on-accent:     var(--tt-white);

  --text-strong:   var(--tt-ink-950);
  --text-body:     var(--tt-ink-800);
  --text-muted:    var(--tt-ink-500);
  --text-faint:    var(--tt-ink-400);
  --text-on-dark:  var(--tt-white);
  --text-on-dark-muted: rgba(255,255,255,0.66);
  --text-accent:   var(--tt-green-600);

  --surface-page:    var(--tt-white);
  --surface-raised:  var(--tt-ink-50);
  --surface-sunken:  var(--tt-ink-100);
  --surface-card:    var(--tt-white);
  --surface-inverse: var(--tt-ink-950);
  --surface-accent:  var(--tt-green-500);

  --border-subtle:  var(--tt-ink-200);
  --border-default: var(--tt-ink-300);
  --border-strong:  var(--tt-ink-950);
  --border-on-dark: rgba(255,255,255,0.16);

  --focus-ring: var(--tt-green-500);
}
