/* ==========================================================================
   Ebb design tokens — "Cold compress".
   Built from pain-perception research: white reads as relief, cool blue as
   calm, and red raises pain ratings, so nothing warm goes near the scale.
   Brand hue 232 (glacier), ink hue 245. Form archetype: Sheet — "round what
   you touch, square what you read". See docs/DESIGN.md for every decision.
   ========================================================================== */
:root {
  color-scheme: light;

  /* ---- Ground: true white is relief; bands are an ice wash ---- */
  --bg:            oklch(1 0 0);
  --field:         oklch(1 0 0);
  --surface:       oklch(0.968 0.008 230);
  --surface-2:     oklch(0.945 0.012 230);
  --surface-3:     oklch(0.915 0.016 230);
  --ink:           oklch(0.25 0.03 245);
  --ink-2:         oklch(0.35 0.03 245);
  --muted:         oklch(0.48 0.025 240);
  --muted-2:       oklch(0.54 0.022 240);
  --line:          oklch(0.90 0.01 230);
  --line-strong:   oklch(0.78 0.02 230);

  /* ---- Brand: glacier blue ---- */
  --primary:        oklch(0.50 0.105 232);
  --primary-strong: oklch(0.42 0.10 235);
  --primary-soft:   oklch(0.955 0.025 230);
  --primary-soft-2: oklch(0.90 0.045 230);
  --on-primary:     oklch(0.99 0 0);

  /* Accent stays inside the brand hue: no second colour to confuse with a status. */
  --accent:        oklch(0.80 0.08 228);
  --accent-strong: oklch(0.66 0.10 230);
  --accent-soft:   oklch(0.955 0.025 230);
  --on-accent:     oklch(0.25 0.04 245);

  /* Drench: night ink — the evening check-in and one landing band. */
  --drench:          oklch(0.24 0.045 245);
  --drench-2:        oklch(0.30 0.05 245);
  --on-drench:       oklch(0.95 0.01 240);
  --on-drench-muted: oklch(0.80 0.03 240);
  --drench-line:     oklch(0.38 0.045 245);

  /* ---- Semantic: states only, always with an icon and a label.
          Info moves off blue so a state is never mistaken for the brand. ---- */
  --success: oklch(0.56 0.12 150); --success-soft: oklch(0.95 0.035 150); --success-ink: oklch(0.38 0.09 150);
  --warning: oklch(0.76 0.14 75);  --warning-soft: oklch(0.96 0.045 80);  --warning-ink: oklch(0.45 0.10 65);
  --danger:  oklch(0.53 0.19 28);  --danger-soft:  oklch(0.95 0.03 28);   --danger-ink:  oklch(0.44 0.16 28);
  --info:    oklch(0.52 0.09 285); --info-soft:    oklch(0.955 0.02 285); --info-ink:    oklch(0.42 0.09 285);

  /* ---- Pain intensity: a neutral cool ramp. Red raises pain ratings, so the
          scale never warms up; lightness does the work and the number is printed.
          Text on 0–6 uses --on-pain-lo, on 7–10 --on-pain-hi (both ≥4.5:1). ---- */
  --pain-0:  oklch(0.965 0.006 240);
  --pain-1:  oklch(0.93 0.012 240);
  --pain-2:  oklch(0.89 0.018 240);
  --pain-3:  oklch(0.84 0.024 240);
  --pain-4:  oklch(0.78 0.03 240);
  --pain-5:  oklch(0.71 0.038 240);
  --pain-6:  oklch(0.64 0.045 240);
  --pain-7:  oklch(0.55 0.05 240);
  --pain-8:  oklch(0.47 0.05 242);
  --pain-9:  oklch(0.39 0.048 245);
  --pain-10: oklch(0.30 0.042 248);
  --on-pain-lo: oklch(0.24 0.03 245);
  --on-pain-hi: oklch(0.99 0 0);

  /* Charts: a ramp of the brand hue, not the semantic colours. */
  --c-1: oklch(0.88 0.045 232); --c-2: oklch(0.74 0.08 232);
  --c-3: oklch(0.58 0.10 232);  --c-4: oklch(0.44 0.10 232); --c-5: oklch(0.32 0.08 232);

  /* ---- Type: Literata (display, reading) + Atkinson Hyperlegible Next (UI) ---- */
  --font-display: "Literata", Georgia, "Times New Roman", serif;
  --font-body:    "Atkinson Hyperlegible Next", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono:    ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* Marketing scale — fluid; ceiling well under 6rem */
  --fs-display: clamp(2.6rem, 1.7rem + 3.4vw, 4.75rem);
  --fs-h1:      clamp(2.1rem, 1.5rem + 2.2vw, 3.5rem);
  --fs-h2:      clamp(1.75rem, 1.3rem + 1.5vw, 2.625rem);
  --fs-h3:      clamp(1.3rem, 1.12rem + 0.7vw, 1.75rem);
  --fs-lead:    clamp(1.125rem, 1.05rem + 0.35vw, 1.3125rem);
  --fs-body:    1.0625rem;            /* 17px: patient surfaces */
  --fs-small:   0.9375rem;
  --fs-xs:      0.8125rem;

  /* Product scale — fixed rem */
  --t-32: 2rem; --t-28: 1.75rem; --t-22: 1.375rem; --t-18: 1.125rem; --t-16: 1rem;
  --t-15: 0.9375rem; --t-14: 0.875rem; --t-13: 0.8125rem; --t-12: 0.75rem; --t-11: 0.6875rem;

  --lh-tight: 1.08; --lh-snug: 1.22; --lh-body: 1.6; --lh-relaxed: 1.7;
  --tracking-display: -0.02em; --tracking-ui: 0;

  /* ---- Spacing: 4px base ---- */
  --s-1: 0.25rem; --s-2: 0.5rem;  --s-3: 0.75rem; --s-4: 1rem;   --s-5: 1.5rem;
  --s-6: 2rem;    --s-7: 3rem;    --s-8: 4rem;    --s-9: 5rem;   --s-10: 6rem; --s-12: 8rem;
  --section:       clamp(4.5rem, 3rem + 5vw, 8rem);
  --section-tight: clamp(3rem, 2rem + 3vw, 5rem);
  --gutter:        clamp(1.25rem, 4vw, 2.5rem);
  --container: 1200px; --container-wide: 1400px; --container-narrow: 760px; --measure: 68ch;

  /* ==========================================================================
     FORM LAYER — archetype: Sheet.
     ========================================================================== */

  /* 1. Shape — round what you touch, square what you read. */
  --r-ctl: 12px; --r-card: 0px; --r-lg: 24px; --r-full: 999px;

  /* 2. Border weight — hairlines in tables/inputs; 1.5px on controls for low vision. */
  --bw: 1px; --bw-strong: 1.5px;
  --rule: var(--bw) solid var(--line);
  --rule-strong: var(--bw-strong) solid var(--line-strong);

  /* 3. Elevation — fill: surfaces are flat, tone carries hierarchy.
        One soft shadow, for floating layers only. */
  --elev-card: none;
  --elev-pop:  0 14px 36px -14px oklch(0.25 0.04 245 / 0.26);
  --elev-modal: 0 32px 72px -24px oklch(0.25 0.04 245 / 0.34);

  /* 4. Density — patient surfaces are fine-motor friendly. */
  --h-ctl: 56px; --h-ctl-sm: 44px; --h-row: 64px;
  --pad-card: var(--s-5); --gap-grid: var(--s-5);

  /* 5. Divider strategy — bands for patients, hairline rows in tables. */
  --cell-rule: none;
  --row-rule: var(--rule);

  /* 6. Headings — sentence case, Literata. */
  --wt-head: 560; --wt-body: 400;
  --tracking-heading: -0.01em;
  --case-head: none;

  /* Legacy elevation names (used by the prototype chrome) map onto the one model. */
  --e-1: none;
  --e-2: none;
  --e-3: var(--elev-pop);

  /* ---- Motion (emil-design-eng) ---- */
  --dur-1: 160ms; --dur-2: 200ms; --dur-3: 280ms;
  --ease: cubic-bezier(0.2, 0, 0, 1);
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);

  /* ---- Prototype chrome ---- */
  --pocbar-h: 44px;
  --z-sticky: 20; --z-layer: 60; --z-toast: 80; --z-pocbar: 90; --z-tour: 100;
}

/* Clinic and admin: calmer, denser. */
[data-density="dense"] {
  --h-ctl: 40px; --h-ctl-sm: 32px; --h-row: 44px;
  --pad-card: var(--s-4); --gap-grid: var(--s-4);
  --fs-body: 0.9375rem;
}

/* Evening mode — night ink, scoped to a surface (never a global dark theme). */
.is-evening {
  color-scheme: dark;
  --bg:          oklch(0.24 0.045 245);
  --field:       oklch(0.29 0.045 245);
  --surface:     oklch(0.28 0.045 245);
  --surface-2:   oklch(0.32 0.048 245);
  --surface-3:   oklch(0.36 0.05 245);
  --ink:         oklch(0.95 0.01 240);
  --ink-2:       oklch(0.88 0.015 240);
  --muted:       oklch(0.80 0.025 240);
  --muted-2:     oklch(0.74 0.03 240);
  --line:        oklch(0.36 0.04 245);
  --line-strong: oklch(0.50 0.04 245);
  --primary:        oklch(0.80 0.08 228);
  --primary-strong: oklch(0.88 0.05 228);
  --primary-soft:   oklch(0.33 0.06 240);
  --primary-soft-2: oklch(0.40 0.07 238);
  --on-primary:     oklch(0.22 0.045 245);
  /* The low end of the ramp dims at night so a "0" doesn't glare. Still monotonic. */
  --pain-0: oklch(0.84 0.01 240);  --pain-1: oklch(0.81 0.016 240); --pain-2: oklch(0.78 0.022 240);
  --pain-3: oklch(0.75 0.028 240); --pain-4: oklch(0.72 0.033 240); --pain-5: oklch(0.68 0.038 240);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important; animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important; scroll-behavior: auto !important;
  }
}