/* 01-design-tokens — Assets, tokens, and type utilities */
@font-face { font-family: "Inter"; src: url("../assets/fonts/Inter-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("../assets/fonts/Inter-Medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("../assets/fonts/Inter-SemiBold.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("../assets/fonts/Inter-Bold.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url("../assets/fonts/JetBrainsMono-Medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }

:root {
  /* --- PediRD Clinical Precision tokens --- */
  --primary: #456739;            --on-primary: #ffffff;
  --primary-container: #b0d79f;  --on-primary-container: #3d5e32;
  --primary-tint: #e8f0e4;       --clinical-green-dark: #3D5A35;
  --secondary: #575f6b;
  --secondary-container: #dbe3f1;--on-secondary-container: #3f4752;
  --tertiary-container: #ffd8e7; --on-tertiary-container: #693650;
  --accent-blue: #4A90E2;

  --success: #00796B; --success-bg: rgba(0,121,107,0.10);
  --warning: #F57C00; --warning-bg: rgba(245,124,0,0.10);
  --danger:  #D32F2F; --danger-bg: #ffdad6; --on-danger-bg: #93000a;
  --info: #4A90E2;    --info-bg: #e8f0fe;

  --bg: #f8f9fa;
  --surface-card: #ffffff;
  --surface-low: #f3f4f5;
  --surface-mid: #edeeef;
  --surface-high: #e7e8e9;
  --ink: #1A1C1E; --ink-muted: #5F6368; --ink-faint: #73796e;
  --border-subtle: #E0E0E0; --border-strong: #c3c8bc;
  --readout-bg: #22262a; --readout-ink: #f0f1f2; --readout-accent: #abd19a;

  --focus-ring: var(--accent-blue);

  --r-sm: 4px; --r-md: 8px; --r-lg: 12px; --r-xl: 16px; --r-full: 9999px;
  --container-max: 1280px;

  --shadow-card: 0 1px 3px rgba(0,0,0,0.05), 0 1px 2px rgba(0,0,0,0.01);
  --shadow-raised: 0 4px 12px rgba(0,0,0,0.05);

  --font-ui: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", "Cascadia Code", Consolas, ui-monospace, monospace;

  --shadow-sidebar: 1px 0 0 rgba(0,0,0,0.06);
}

/* 01-design-tokens §8 Base element styles */
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
::selection { background: var(--secondary-container); color: var(--on-secondary-container); }
:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
header { margin-bottom: 24px; }
h1 { color: var(--ink); font: 700 25px/1.2 var(--font-ui); letter-spacing: -0.01em; margin: 0; }

body { font: 400 14px/20px var(--font-ui); color: var(--ink); }

.headline-lg { font: 700 24px/32px var(--font-ui); letter-spacing: -0.02em; }
.headline-md { font: 600 20px/28px var(--font-ui); }
.headline-sm { font: 600 16px/24px var(--font-ui); }
.body-lg { font: 400 16px/24px var(--font-ui); }
.body-md { font: 400 14px/20px var(--font-ui); }
.body-sm { font: 400 12px/16px var(--font-ui); }
.label-caps { font: 700 11px/16px var(--font-ui); letter-spacing: 0.05em; text-transform: uppercase; }
.data-mono { font: 500 13px/20px var(--font-mono); font-variant-numeric: tabular-nums; }
.stat-num { font: 700 24px/32px var(--font-ui); font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }

.icon { width: 20px; height: 20px; flex-shrink: 0; }
.icon-sm { width: 16px; height: 16px; }
.icon-lg { width: 24px; height: 24px; }
