/* ─────────────────────────────────────────────────────────────
   Design tokens — editorial / mono aesthetic carried over from
   the AR Readiness app. Light by default; dark via prefers-color-scheme
   and an explicit [data-theme] override set in Settings.
   ───────────────────────────────────────────────────────────── */
:root {
  --bg:        #f0f0ed;
  --surface:   #ffffff;
  --surface2:  #e8e8e4;
  --border:    #d8d8d4;
  --text:      #111111;
  --muted:     #888888;
  --faint:     #cccccc;

  /* semantic accents */
  --accent:    #111111;   /* primary ink */
  --good:      #00a86b;   /* on-track / fresh */
  --warn:      #ff8c00;   /* getting stale */
  --bad:       #ff2d00;   /* overdue / danger */
  --up:        #ff2d00;   /* weight/fat trending up */
  --down:      #00a86b;   /* weight/fat trending down */
  --flat:      #888888;

  /* metric line colours (used in charts) */
  --line-weight: #111111;
  --line-bf:     #ff2d00;
  --line-lean:   #0066ff;
  --line-fat:    #ff8c00;

  --mono:    'DM Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --sans:    'DM Sans', system-ui, -apple-system, sans-serif;
  --display: 'Bebas Neue', 'DM Sans', system-ui, sans-serif;

  --radius: 4px;
  --shadow: 0 1px 2px rgba(0,0,0,0.04);
  --maxw: 480px;
}

:root[data-theme="dark"],
:root:not([data-theme="light"]) {
  /* fallthrough below only applies inside the dark media query */
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg:       #0d0d0d;
    --surface:  #161616;
    --surface2: #1f1f1f;
    --border:   #2a2a2a;
    --text:     #f0f0ed;
    --muted:    #777777;
    --faint:    #333333;
    --accent:   #f0f0ed;
    --line-weight: #f0f0ed;
    --shadow: 0 1px 2px rgba(0,0,0,0.4);
  }
}

/* Explicit dark override (Settings toggle) — wins over system */
:root[data-theme="dark"] {
  --bg:       #0d0d0d;
  --surface:  #161616;
  --surface2: #1f1f1f;
  --border:   #2a2a2a;
  --text:     #f0f0ed;
  --muted:    #777777;
  --faint:    #333333;
  --accent:   #f0f0ed;
  --line-weight: #f0f0ed;
  --shadow: 0 1px 2px rgba(0,0,0,0.4);
}