/* NeuralEdge — design tokens
 * Palette: clinical light. Deep navy ink, teal + slate accents.
 * Type: IBM Plex Sans (UI), IBM Plex Mono (code/data), IBM Plex Serif (editorial moments).
 * Density: balanced, leaning data-rich.
 */

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=IBM+Plex+Sans:wght@300;400;500;600;700&family=IBM+Plex+Serif:ital,wght@0,400;0,500;1,400&display=swap');

:root {
  /* Surfaces */
  --ne-bg:        #f5f7fa;          /* page bg */
  --ne-surface:   #ffffff;          /* cards */
  --ne-surface-2: #fafbfc;          /* sunken surfaces, code */
  --ne-grid:      #eef2f7;          /* faint ECG-paper grid */
  --ne-line:      #e3e8ef;          /* hairlines */
  --ne-line-2:    #cdd5df;          /* stronger borders */

  /* Ink */
  --ne-ink:       #0a2540;          /* primary text — deep navy from logo */
  --ne-ink-2:     #3d5a80;          /* secondary text */
  --ne-ink-3:     #6b7d92;          /* tertiary / metadata */
  --ne-ink-4:     #9aa7b6;          /* placeholder / disabled */

  /* Brand */
  --ne-navy:      #0a2540;
  --ne-navy-deep: #061a30;
  --ne-teal:      #1a8a96;          /* matches logo nodes */
  --ne-teal-deep: #126872;
  --ne-teal-soft: #d6ecee;
  --ne-slate:     #3d5a80;

  /* Semantic */
  --ne-ok:        #2d7a5a;
  --ne-ok-soft:   #dff0e6;
  --ne-warn:      #b87718;
  --ne-warn-soft: #fbeed0;
  --ne-danger:    #b8392a;
  --ne-danger-soft: #f7dcd6;
  --ne-info:      #1a6a96;
  --ne-info-soft: #d6e7f0;

  /* ECG signal colors */
  --ne-trace:     #0a2540;
  --ne-trace-raw: #9aa7b6;
  --ne-pqrst-p:   #1a8a96;
  --ne-pqrst-q:   #b87718;
  --ne-pqrst-r:   #b8392a;
  --ne-pqrst-s:   #6b3fa0;
  --ne-pqrst-t:   #2d7a5a;

  /* Type */
  --ne-font-sans: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --ne-font-mono: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --ne-font-serif:'IBM Plex Serif', Georgia, serif;

  /* Radii */
  --ne-r-1: 3px;
  --ne-r-2: 6px;
  --ne-r-3: 10px;
  --ne-r-4: 14px;

  /* Shadows — restrained, clinical */
  --ne-shadow-1: 0 1px 0 rgba(10,37,64,.04), 0 1px 2px rgba(10,37,64,.06);
  --ne-shadow-2: 0 1px 0 rgba(10,37,64,.04), 0 4px 12px rgba(10,37,64,.08);
  --ne-shadow-3: 0 8px 32px rgba(10,37,64,.12);

  /* Spacing scale */
  --ne-s-1: 4px;
  --ne-s-2: 8px;
  --ne-s-3: 12px;
  --ne-s-4: 16px;
  --ne-s-5: 24px;
  --ne-s-6: 32px;
  --ne-s-7: 48px;
  --ne-s-8: 64px;
  --ne-s-9: 96px;
}

/* Palette variants — toggled by [data-palette] on body */
body[data-palette="navy-teal"] {
  --ne-navy: #0a2540; --ne-teal: #1a8a96; --ne-slate: #3d5a80;
  --ne-ink: #0a2540; --ne-trace-r: #b8392a;
}
body[data-palette="graphite"] {
  --ne-navy: #1a1f24;
  --ne-teal: #4a6b7c;
  --ne-slate: #2c3744;
  --ne-ink: #1a1f24;
  --ne-ink-2: #3a4554;
  --ne-teal-soft: #e1e7eb;
  --ne-pqrst-p: #4a6b7c;
}
body[data-palette="navy-coral"] {
  --ne-navy: #0a2540;
  --ne-teal: #d04e3a;     /* coral accent */
  --ne-slate: #3d5a80;
  --ne-teal-soft: #fae0db;
  --ne-pqrst-p: #d04e3a;
}
body[data-palette="forest"] {
  --ne-navy: #1a2e2a;
  --ne-teal: #2d7a5a;
  --ne-slate: #3d5a4a;
  --ne-ink: #1a2e2a;
  --ne-teal-soft: #d8ebe0;
  --ne-pqrst-p: #2d7a5a;
}

/* Resets / base type */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; }
body {
  font-family: var(--ne-font-sans);
  font-feature-settings: 'cv11', 'ss01', 'ss03';
  color: var(--ne-ink);
  background: var(--ne-bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.ne-mono { font-family: var(--ne-font-mono); font-feature-settings: 'zero'; }
.ne-serif { font-family: var(--ne-font-serif); }
.ne-eyebrow {
  font-family: var(--ne-font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ne-teal);
}
.ne-num { font-variant-numeric: tabular-nums; font-feature-settings: 'tnum'; }