/* ============================================================
   EpochCore · Colors
   ------------------------------------------------------------
   The shipped product face is WARM PAPER + VIOLET. This is the
   canonical :root. Headlines/body are Newsreader serif; labels
   are JetBrains Mono; the single hero accent is violet #6a3df0.

   A DARK face (demos, SignCellTech, Focus Pulse) is available by
   adding class `dark` (or [data-face="dark"]) to any wrapper —
   same violet language, inverted substrate.

   Oscillation Orange is a SPARING marketing punctuation only.
   Teal is logo/identity only. The 14-color Quantum Palette
   (data-viz / seeded sigils) lives in quantum-palette.css.
   ============================================================ */

:root {
  /* ── WARM PAPER SURFACE (primary product face) ──────────── */
  --bg:        #f4f0e7;   /* page background */
  --surface:   #efe9db;   /* card / panel */
  --surface-2: #eae3d3;   /* deeper panel */
  --hi:        #e4dcc9;   /* hover / featured */
  --field:     #fffdf8;   /* inputs (inset near-white) */

  /* hairlines — dark on light */
  --line:  rgba(34,27,18,0.12);
  --line2: rgba(34,27,18,0.22);

  /* ink — warm near-black text */
  --ink:   #1b1712;
  --dim:   rgba(27,23,18,0.74);
  --mute:  rgba(27,23,18,0.50);
  --faint: rgba(27,23,18,0.34);
  --on-ink: #f6f2ea;       /* text on dark / solid buttons */

  /* ── HERO ACCENT — violet ───────────────────────────────── */
  --accent:      #6a3df0;
  --accent2:     #7d5bf4;
  --accent3:     #a896f7;
  --accent-soft: rgba(106,61,240,0.09);
  --accent-line: rgba(106,61,240,0.30);
  --accent-grad: linear-gradient(100deg,#5a2fe0 0%,#7d5bf4 55%,#a896f7 100%); /* @kind color */

  /* ── SEMANTIC ───────────────────────────────────────────── */
  --ok:   #1f9d61;   /* operational / verified / included */
  --err:  #e7444e;   /* error / refused */
  --warn: #c2691c;   /* warning (amber) */

  /* ── PRODUCT-LANE ACCENTS ───────────────────────────────── */
  --lane-enterprise: #6a3df0;   /* violet */
  --lane-smb:        #1a8a7a;   /* teal */
  --lane-creator:    #c2691c;   /* amber */

  /* ── IDENTITY (logo only — never a UI accent) ───────────── */
  --teal: #1f6f72;   /* the EpochCore circuit-cube mark */

  /* ── MARKETING PUNCTUATION (use sparingly) ──────────────── */
  --orange: #ff6a1a;   /* Oscillation Orange — deck/marketing only */

  /* ── Semantic aliases (face-neutral naming) ─────────────── */
  --text-body:      var(--ink);
  --text-muted:     var(--dim);
  --text-faint:     var(--mute);
  --surface-page:   var(--bg);
  --surface-card:   var(--surface);
  --surface-raised: var(--surface-2);
  --border-hair:    var(--line);
  --border-strong:  var(--line2);
}

/* ── DARK FACE — demos, SignCellTech, Focus Pulse ─────────── */
.dark,
[data-face="dark"] {
  --bg:        #0c0a13;
  --surface:   #15121d;
  --surface-2: #1b1726;
  --hi:        #221d30;
  --field:     #100d18;

  --line:  rgba(243,240,250,0.10);
  --line2: rgba(243,240,250,0.20);

  --ink:   #f3f0fa;
  --dim:   rgba(243,240,250,0.74);
  --mute:  rgba(243,240,250,0.50);
  --faint: rgba(243,240,250,0.32);
  --on-ink: #0c0a13;

  --accent:      #7d5bf4;
  --accent2:     #a896f7;
  --accent3:     #c9bcf9;
  --accent-soft: rgba(125,91,244,0.14);
  --accent-line: rgba(125,91,244,0.34);

  --ok:  #2dd881;   /* verify green reads brighter on dark */
  --err: #ff5675;
}