/* src/styles/tokens.css — SingleSource by ArcSentra (03_A_Design_Tokens) */
:root {
  /* Layer 4 Surface & Canvas Tokens (PRES-01) */
  --ss-bg-canvas: #20232B;           /* Charcoal — Primary Canvas Background */
  --ss-bg-surface: #111318;          /* Graphite — Secondary Surface Contrast */

  /* Layer 2 & Layer 4 System, Status & CTA Accents (INTG-01, PRES-03, PRES-04) */
  --ss-accent-primary: #8196A3;      /* Dusty Blue — Active Nav & Selected Tool States */
  --ss-accent-status: #A8B69A;       /* Sage Green — Healthy OAuth/MCP & Completed Status */
  --ss-cta-primary: #F4A261;         /* Warm Sunset — Primary Call-to-Action Buttons */

  /* Layer 4 Typography Colors (PRES-02) */
  --ss-text-primary: #F7F7FB;        /* Soft White — Primary Headings & Body Copy (14.7:1 AAA) */
  --ss-text-secondary: #A8ADBD;      /* Cool Silver — Metadata, Timestamps & Subtitles (7.02:1 AAA) */

  /* Inter Font Family & Tabular Numerals (PRES-02) */
  --ss-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --ss-font-mono: 'JetBrains Mono', 'Fira Code', monospace;

  /* 3-Column Grid Layout Tracks (PRES-04) */
  --ss-col-nav: 260px;
  --ss-col-nav-collapsed: 64px;
  --ss-col-stream: minmax(520px, 1fr);
  --ss-col-ask: 380px;
}

body.singlesource-shell {
  background-color: var(--ss-bg-canvas);
  color: var(--ss-text-primary);
  font-family: var(--ss-font-sans);
  font-feature-settings: 'cv02', 'cv03', 'cv04', 'tnum';
  margin: 0;
  padding: 0;
}

.ss-workspace-grid {
  display: grid;
  grid-template-columns: var(--ss-col-nav) var(--ss-col-stream) var(--ss-col-ask);
  min-height: 100vh;
  background-color: var(--ss-bg-canvas);
}

.ss-panel-nav,
.ss-panel-ask {
  background-color: var(--ss-bg-surface);
}

.ss-btn-cta {
  background-color: var(--ss-cta-primary);
  color: var(--ss-bg-surface);
  font-weight: 600;
}

.ss-badge-healthy {
  color: var(--ss-accent-status);
  border: 1px solid var(--ss-accent-status);
}