/**
 * theme.js — Shared design tokens
 *
 * Single source of truth: CSS custom properties in index.css :root {}
 * This module reads them at load time so JS components use the same
 * values as the stylesheet. To theme the app, override the CSS vars.
 */

function v(name) {
  return getComputedStyle(document.documentElement).getPropertyValue(name).trim();
}

export const T = {
  bg:          v('--bg'),
  panel:       v('--panel'),
  surface:     v('--surface'),
  border:      v('--border'),
  amber:       v('--amber'),
  amberDim:    v('--amber-dim'),
  blue:        v('--blue'),
  blueDim:     v('--blue-dim'),
  green:       v('--green'),
  red:         v('--red'),
  textPrimary: v('--text-primary'),
  textSec:     v('--text-sec'),
  textDim:     v('--text-dim'),
};
