/**
 * /vibe design tokens — ROOM TONE
 * Served at https://www.slashvibe.dev/vibe-tokens.css · JSON twin: /vibe-tokens.json
 *
 * ONE source for every /vibe surface: this landing page, /connect, docs, and VibeBuddy.
 * Before this file there were four palettes and four font stacks across four surfaces
 * (the Mac app was even using a Windows/Android system stack), because the brand guide
 * documented colors as prose instead of exporting them as tokens.
 *
 * The load-bearing rule, enforced by review: GREEN MEANS A PERSON OR AGENT IS ACTUALLY
 * HERE, RIGHT NOW. Nothing else in the system may use green — not success states, not
 * checkmarks, not charts. Presence is the one thing /vibe sells, so presence owns the
 * only saturated color. Blue is /vibe itself (links, actions, the slash). Pink is
 * attention and danger, used sparingly. Everything else is greyscale on near-black.
 *
 * NOT for vibeconf: that product committed to Space-Age Picturephone (cream/teal/coral,
 * Syne). Two products, two looks, one voice.
 */

:root {
  /* ── canvas ─────────────────────────────────────────────────────── */
  --bg: #0A0A0A;          /* near-black, never pure #000 — pure black kills depth */
  --panel: #111316;       /* a surface sitting on the canvas */
  --line: #1F2937;        /* 1px borders; the only separator we use */

  /* ── ink ────────────────────────────────────────────────────────── */
  --ink: #E0E0E0;         /* body */
  --dim: #9CA3AF;         /* secondary — most text in this system is dim */
  --faint: #6B7280;       /* timestamps, meta, "48m ago" */

  /* ── /vibe itself ───────────────────────────────────────────────── */
  --blue: #6B8FFF;        /* the slash, links, primary action */
  --blue-bright: #8BA8FF; /* hover only */
  --blue-dim: #3b4a7a;    /* borders/accents on blue surfaces */

  /* ── presence: RESERVED. Do not use for anything else. ──────────── */
  --green: #22c55e;       /* someone is here NOW */
  --green-dim: #15803d;   /* the same fact, at rest (away/idle trace) */

  /* ── attention ──────────────────────────────────────────────────── */
  --pink: #ff79c6;        /* danger, credential warnings, destructive actions */

  /* ── type ───────────────────────────────────────────────────────── */
  /* Monospace is honest: this product lives in a terminal. Mac-native first,
     because our users are on Macs and 'SF Mono' is what their terminal uses. */
  --mono: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  /* Long-form prose ONLY (docs paragraphs, 3+ paragraphs). Never for UI or data. */
  --prose: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, Arial, sans-serif;

  --t-11: 11px;   /* meta */
  --t-12: 12px;   /* secondary */
  --t-13: 13px;   /* dense UI, terminal-ish panels */
  --t-14: 14px;   /* body */
  --t-16: 16px;   /* lead */
  --t-20: 20px;   /* section head */
  --t-28: 28px;   /* hero */

  /* ── space + shape ──────────────────────────────────────────────── */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-6: 24px;
  --s-8: 32px;

  --r-sm: 6px;
  --r-md: 8px;
  --r-lg: 10px;   /* nothing rounder — this is an instrument, not a pill */
}
