/* No Outcome ABA — design tokens (tools-nooutco-me)
   Consolidated from design_handoff_site_overhaul/tokens/*.css */

@import url('https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:ital,wght@0,400;0,700;1,400;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible+Mono:wght@400;600;700&display=swap');

:root {
  /* ── Families ─────────────────────────────────────────────────────── */
  --font-sans: 'Atkinson Hyperlegible', -apple-system, BlinkMacSystemFont,
               'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-mono: 'Atkinson Hyperlegible Mono', ui-monospace, SFMono-Regular,
               Menlo, Consolas, monospace;

  /* ── Type scale ───────────────────────────────────────────────────── */
  --text-2xs: 10px;
  --text-xs:  11px;
  --text-sm:  12px;
  --text-base: 13px;
  --text-md:  14px;
  --text-lg:  16px;
  --text-xl:  18px;
  --text-2xl: 22px;
  --text-3xl: 28px;
  --text-4xl: 36px;
  --text-5xl: 48px;

  /* ── Weights ──────────────────────────────────────────────────────── */
  --weight-normal:   400;
  --weight-medium:   500;
  --weight-semibold: 600;
  --weight-bold:     700;
  --weight-heavy:    800;

  /* ── Line heights ─────────────────────────────────────────────────── */
  --leading-tight:  1.2;
  --leading-snug:   1.35;
  --leading-normal: 1.5;

  /* ── Letter spacing ───────────────────────────────────────────────── */
  --tracking-tight:  -0.01em;
  --tracking-normal:  0;
  --tracking-label:   0.06em;
  --tracking-wide:    0.03em;

  /* ── Neutrals (slate) ─────────────────────────────────────────────── */
  --slate-900: #111827;
  --slate-800: #1f2937;
  --slate-700: #374151;
  --slate-600: #4b5563;
  --slate-500: #6b7280;
  --slate-400: #9ca3af;
  --slate-300: #d1d5db;
  --slate-200: #e5e7eb;
  --slate-100: #f3f4f6;
  --slate-50:  #f9fafb;
  --white:     #ffffff;

  /* ── Sage — primary action & brand accent ─────────────────────────── */
  --sage-900: #2c331f;
  --sage-800: #3c4533;
  --sage-700: #4d5840;
  --sage-600: #5d6a4d;
  --sage-500: #6a7659;
  --sage-200: #c7cdb6;
  --sage-100: #e2e6d9;
  --sage-50:  #f1f3ec;

  /* ── Blue ─────────────────────────────────────────────────────────── */
  --blue-700: #1d4ed8;
  --blue-500: #3b82f6;
  --blue-100: #dbeafe;
  --blue-50:  #eff6ff;

  /* ── Violet ───────────────────────────────────────────────────────── */
  --violet-700: #5b21b6;
  --violet-600: #7c3aed;
  --violet-500: #8b5cf6;
  --violet-200: #ddd6fe;
  --violet-100: #ede9fe;
  --violet-50:  #f5f3ff;

  /* ── Green — success / met / completed ───────────────────────────── */
  --green-800: #15803d;
  --green-700: #16a34a;
  --green-500: #10b981;
  --green-100: #dcfce7;
  --green-50:  #ecfdf5;

  /* ── Amber / orange — warning / on-pace ──────────────────────────── */
  --amber-700: #b45309;
  --amber-500: #f59e0b;
  --amber-300: #fcd34d;
  --amber-100: #fef3c7;
  --amber-50:  #fffbeb;
  --orange-700: #9a3412;
  --orange-600: #ea580c;
  --orange-500: #f97316;
  --orange-100: #ffedd5;

  /* ── Red ──────────────────────────────────────────────────────────── */
  --red-700: #b91c1c;
  --red-600: #dc2626;
  --red-500: #ef4444;
  --red-300: #fca5a5;
  --red-100: #fee2e2;
  --red-50:  #fef2f2;

  /* ── Sky ──────────────────────────────────────────────────────────── */
  --sky-500: #0ea5e9;

  /* ── Clinical session phases ──────────────────────────────────────── */
  --phase-open-500:   #1d9e75; --phase-open-bg:   #e1f5ee;
  --phase-pair-500:   #7f77dd; --phase-pair-bg:   #eeedfe;
  --phase-work-500:   #378add; --phase-work-bg:   #e6f1fb;
  --phase-ease-500:   #ef9f27; --phase-ease-bg:   #faeeda;
  --phase-repair-500: #d85a30; --phase-repair-bg: #faece7;
  --phase-handoff-500:#888780; --phase-handoff-bg:#f1efe8;

  /* ── Semantic aliases ─────────────────────────────────────────────── */
  --surface-page:    var(--slate-50);
  --surface-card:    var(--white);
  --surface-sunken:  var(--slate-100);
  --surface-header:  var(--slate-800);
  --surface-overlay: rgba(17, 24, 39, 0.5);

  --text-primary: var(--slate-900);
  --text-body:    var(--slate-700);
  --text-muted:   var(--slate-500);
  --text-faint:   var(--slate-400);
  --text-on-dark: var(--white);
  --text-link:    var(--sage-600);

  --border-default: var(--slate-200);
  --border-strong:  var(--slate-300);
  --border-focus:   var(--sage-500);

  --brand-primary:       var(--sage-500);
  --brand-primary-hover: var(--sage-600);
  --brand-primary-text:  var(--white);
  --brand-accent:        var(--sage-700);
  --brand-ai:            var(--violet-600);
  --brand-fix:           var(--orange-600);

  --status-met:       var(--green-800);  --status-met-bg:    var(--green-100);
  --status-pace:      var(--amber-700);  --status-pace-bg:   var(--amber-100);
  --status-behind:    var(--red-700);    --status-behind-bg: var(--red-100);
  --status-over:      var(--orange-700); --status-over-bg:   var(--orange-100);

  --intent-success:    var(--green-500);  --intent-success-bg: var(--green-100);
  --intent-warning:    var(--amber-500);  --intent-warning-bg: var(--amber-100);
  --intent-danger:     var(--red-600);    --intent-danger-bg:  var(--red-100);
  --intent-info:       var(--blue-500);   --intent-info-bg:    var(--blue-50);

  /* ── Spacing (4px grid) ───────────────────────────────────────────── */
  --space-1:  4px;
  --space-2:  6px;
  --space-3:  8px;
  --space-4:  10px;
  --space-5:  12px;
  --space-6:  16px;
  --space-7:  20px;
  --space-8:  24px;
  --space-10: 32px;
  --space-12: 48px;

  /* ── Radii ────────────────────────────────────────────────────────── */
  --radius-xs:   3px;
  --radius-sm:   4px;
  --radius-md:   6px;
  --radius-lg:   8px;
  --radius-xl:   12px;
  --radius-2xl:  16px;
  --radius-pill: 999px;

  /* ── Shadows ──────────────────────────────────────────────────────── */
  --shadow-sm:    0 1px 3px rgba(17, 24, 39, 0.10);
  --shadow-md:    0 2px 8px rgba(17, 24, 39, 0.12);
  --shadow-lg:    0 4px 12px rgba(17, 24, 39, 0.12);
  --shadow-modal: 0 8px 24px rgba(0, 0, 0, 0.25);
  --shadow-focus: 0 0 0 3px rgba(106, 118, 89, 0.38);

  /* ── Motion ───────────────────────────────────────────────────────── */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --duration-fast: 0.15s;
  --duration-base: 0.25s;
  --duration-slow: 0.3s;
}