/*
 * Cofia design system — the single source of truth for palette + typography,
 * consumed by every surface (styles/dashboard.css, explorer/explorer.css, and
 * any future AI-generated UI). Define a color/type token here ONCE; never paste
 * a raw hex into a component stylesheet again. Imported first in main.tsx so the
 * :root tokens are available app-wide, including the lazy-loaded explorer chunk.
 */
:root {
  /* ── palette ── */
  --bg: #FAF9F6;          /* app background */
  --surface: #FFFEFA;     /* cards, bars, panels */
  --text: #1d1d1f;        /* primary ink */
  --muted: #6B7280;       /* secondary text */
  --muted2: #94A3B8;      /* tertiary text / meta */
  --border: #E8E4DD;      /* hairlines, dividers */
  --border2: #D5D0C8;     /* stronger borders */
  --green: #237159;       /* brand green / accent */
  --green-tint: #F6FBF9;  /* green-tinted fills, active states */

  /* ── typography ── */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  --font-display: 'Space Grotesk', 'Inter', sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
}

/*
 * Shared brand components — global so every surface (dashboard, explorer
 * splash + explorer) renders the Cofia brand identically. Surface stylesheets
 * may override a single property (e.g. the explorer bumps the wordmark size)
 * but must not redefine the component.
 */
.cofia-wordmark { font-family: var(--font-display); font-weight: 700; font-size: 14px; color: var(--text); }
.topbar-powered { font-size: 11px; color: var(--muted2); }