/* ════════════════════════════════════════════════════════════════════
   pChisel platform design tokens — single source of truth
   ════════════════════════════════════════════════════════════════════
   Edit /home/pchisel/design-tokens/tokens.css then run sync.sh to copy
   into chisel-base/frontend/ and pchisel-app/frontend/.
   Both codebases @import './tokens.css' from their local copy.

   Canonical names are prefixed --pc-* (pchisel) to avoid collisions
   with the existing --bg / --accent / --text vars in chisel-base
   style.css and the four pchisel-app CSS files. This is a deliberate
   choice for the per-surface rollout (PWR1-PWR16): each surface pass
   replaces its local var references with --pc-* counterparts, so no
   surface gets restyled before its scheduled pass.

   Mobile-specific layout sizes (header / nav / peek heights) intentionally
   differ from the desktop equivalents and are prefixed --pc-mobile-*.
   The legacy --m-* alias block was removed during D0 of the IDE desktop
   overhaul (2026-05-20). mobile.css and mobile.js now reference --pc-*
   tokens directly.
   ════════════════════════════════════════════════════════════════════ */

:root {
  /* ── Surfaces ─────────────────────────────────────────────────────── */
  --pc-bg:           #fafafa;
  --pc-surface:      #ffffff;
  --pc-surface-2:    #f4f4f6;
  --pc-surface-3:    #e9e9ec;
  --pc-border:       #e5e5e7;
  --pc-border-2:     #d4d4d8;

  /* ── Text ─────────────────────────────────────────────────────────── */
  --pc-text:         #0a0a0a;
  --pc-text-dim:     #52525b;
  --pc-text-muted:   #9ca3af;

  /* ── Accent (brand lime — purple is dropped platform-wide) ────────
     2026-05-27: brand lime moved #84cc16 → #b9f328 for the pyChisel
     semi-brutalist redesign. This is a CANONICAL, platform-wide change
     (re-greens every surface using --pc-accent, incl. the dark builder
     chat bubbles). See planning/PYCHISEL_REDESIGN_PLAN.md.
     --pc-accent-hov / --pc-accent-glow are left as-is — they are not
     used by the redesign's buttons (hover only grows the hard shadow). */
  --pc-accent:       #b9f328;
  --pc-accent-hov:   #a3e635;
  --pc-accent-glow:  #bdff00;

  /* ── Status ───────────────────────────────────────────────────────── */
  --pc-success:      #16a34a;
  --pc-warning:      #f59e0b;
  --pc-error:        #dc2626;

  /* ── Elevation ────────────────────────────────────────────────────── */
  --pc-shadow-sm:    0 1px 2px rgba(0,0,0,0.04);
  --pc-shadow-md:    0 2px 8px rgba(0,0,0,0.08);
  --pc-shadow-lg:    0 12px 40px rgba(0,0,0,0.18);

  /* ── Radii ────────────────────────────────────────────────────────── */
  --pc-radius:       12px;
  --pc-radius-sm:    8px;
  --pc-radius-pill:  999px;

  /* ── Layout ───────────────────────────────────────────────────────── */
  --pc-header-h:        56px;   /* desktop platform header */
  --pc-mobile-header-h: 52px;   /* mobile chrome header (intentionally smaller) */
  --pc-mobile-nav-h:    60px;   /* mobile bottom nav bar */
  /* --pc-mobile-peek-h is set dynamically by mobile.js (peek-frame drag handle) */

  /* ── Type ─────────────────────────────────────────────────────────── */
  --pc-font-ui:      -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;

  /* ── Glass (defining platform identity) ────────────────────────────
     Glass is part of the pChisel platform identity — it's used on the
     mobile chat surface and on the unified-nav rail/sidebar. Three
     variants for different backdrop conditions:

     --pc-glass-bg          (light translucent, for DARK backdrops):
       used by the mobile chat surface where terminal animations bleed
       through, and by the IDE chrome (chisel-base) overlay variant.

     --pc-glass-bg-platform (semi-opaque white, for LIGHT backdrops):
       used by the unified-nav rail/sidebar on platform pages. The
       rgba(250,250,250,0.18) flavour was functionally invisible against
       the light dashboard bg, so this variant is more present while
       still letting some page-bg show through behind backdrop-filter.

     --pc-glass-bg-dark     (dark, rarely used on light backdrops). */
  --pc-glass-bg:          rgba(250, 250, 250, 0.18);
  --pc-glass-bg-platform: rgba(255, 255, 255, 0.65);
  --pc-glass-blur:        blur(10px) saturate(140%);
  --pc-glass-border:      rgba(255, 255, 255, 0.18);
  --pc-glass-bg-dark:     rgba(7, 7, 15, 0.55);
  --pc-glass-border-dark: rgba(255, 255, 255, 0.06);

  /* ── Semi-brutalist redesign (2026-05) ─────────────────────────────
     New canonical role tokens for the pyChisel redesign. Added here so
     there's a single source of truth, but APPLIED PER-SURFACE
     (landing → dashboard → …): un-migrated pages keep their current
     --pc-radius / --pc-shadow-* values until their own pass, so nothing
     half-changes. See planning/PYCHISEL_REDESIGN_PLAN.md for the full
     design-role → token map. */

  /* Ink + structural black borders (brutalist borders are black) */
  --pc-ink:            #0a0a0a;   /* == --pc-text; explicit name for brand/logo */
  --pc-ink-soft:       #1a1a1a;
  --pc-line:           #0a0a0a;   /* every structural border in the redesign */

  /* Warm paper surfaces (opt-in; warmer than --pc-bg #fafafa) */
  --pc-paper:          #fafaf7;
  --pc-paper-2:        #f4f3ee;
  --pc-card-bg:        #ffffff;
  --pc-grid-dot:       #c8c5b8;   /* dotted-grid background dots */

  /* Green family (brand lime == --pc-accent #b9f328) */
  --pc-accent-deep:    #8fc81e;   /* hover / text-on-light / wordmark "Chisel" */
  --pc-accent-bg:      #f1fbd2;   /* tinted bg for live/active pills */
  --pc-glow-soft:      #b9f32855; /* translucent lime for box-shadow glow */

  /* Muted text (warmer greys than --pc-text-dim / --pc-text-muted) */
  --pc-muted:          #6a6a66;
  --pc-muted-2:        #9a9a95;

  /* Status (warmer red than --pc-error for "missing"/error states) */
  --pc-danger:         #d94a3d;

  /* Hard-offset shadow distances (sharp, no blur — "stamped on the page") */
  --pc-offset:         2px;       /* cards */
  --pc-offset-btn:     1px;       /* buttons */

  /* Sharp radii (brutalist — do NOT overwrite --pc-radius 12 / --pc-radius-sm 8) */
  --pc-radius-card:    6px;
  --pc-radius-btn:     4px;

  /* Warm glass (redesign chrome: topbar / sidebar / flyout) */
  --pc-glass-paper:    rgba(250, 250, 247, 0.72);
  --pc-glass-blur-14:  blur(14px) saturate(1.4);
  --pc-glass-blur-8:   blur(8px) saturate(1.2);

  /* Fonts — Manrope (display) + JetBrains Mono (machine data). Self-hosted
     via @font-face in each codebase's stylesheet; these just name the stacks. */
  --pc-font-display:   'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  --pc-font-mono:      'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

}
