feat(web): screens from docs/mock — focus flow, today, meds, doctor, profile

- /flow renders the dialog engine's current step as a mock screen (consent,
  age, onboarding and scales with progress, mood 0–10, free text, dose
  reminder, crisis with hotlines and breathing, safety plan), so every
  engine scenario gets the design without duplicating its logic
- today / meds / doctor / profile / messages tabs; navy sidebar and
  emergency rail on desktop, emergency block and tab bar on phones
- API: GET /me/{token}/today (today's doses, week marks, next visit, demo
  clock time); demo ЕМИАС sign-in seeds the persona's synthetic profile and
  prescription from the dashboard fixtures

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

web/src/theme/tokens.css

@@ -1,64 +1,57 @@
 /*
- * Design tokens — the single source of colours, type and spacing.
- * When the app moves to native (Capacitor wraps this same bundle; a React Native port would map these 1:1 to a
- * theme object), only this file changes. Components never use raw colours or pixel sizes outside the scale.
+ * Design tokens — single source of colours, type and spacing (docs/mock, series 2).
+ * Capacitor wraps this same bundle; a React Native port maps these 1:1 to a theme object.
  */
 :root {
-  /* Base: cool ink on cool white. */
-  --c-ink: #13233a;
-  --c-text: #13233a;
-  --c-text-2: #46566b;
-  --c-text-3: #6b7a8e;
-  --c-page: #f4f7fb;
+  /* Ink & surfaces */
+  --c-navy: #0f2747; /* primary buttons, headings, desktop sidebar */
+  --c-navy-hover: #0a1d37;
+  --c-navy-soft: #e8eef6;
+  --c-text: #13294b;
+  --c-text-2: #4d5d73;
+  --c-text-3: #7a889b;
+  --c-page: #ffffff;
+  --c-page-desk: #f4f7fb; /* desktop canvas behind white panels */
   --c-surface: #ffffff;
-  --c-band: #e9f0fb; /* solid tint behind the welcome hero */
-  --c-border: #dbe3ee;
-  --c-border-strong: #b3c0d1;
+  --c-tile: #f3f7fb; /* soft card fill */
+  --c-border: #e2e9f1;
+  --c-border-strong: #c9d4e1;
 
-  /* Care tracks: one colour per thing the service does. The same colour marks the track everywhere
-     (welcome preview, chat questions), so colour carries meaning, never decoration. */
-  --c-meds: #0e8c7f;
-  --c-meds-soft: #e2f4f1;
-  --c-mood: #e79a0c;
-  --c-mood-soft: #fdf1da;
-  --c-mood-ink: #8a5800; /* text on mood-soft (AA) */
-  --c-doctor: #2350c8;
-  --c-doctor-soft: #e7eefc;
+  /* Selection & positive: teal */
+  --c-teal: #17a08f;
+  --c-teal-strong: #0e7e71;
+  --c-teal-soft: #e3f5f2;
 
-  /* Action colour = the doctor/ЕМИАС blue. */
-  --c-primary: #2350c8;
-  --c-primary-hover: #1c43ac;
-  --c-primary-active: #163689;
-  --c-primary-soft: #e7eefc;
+  /* Info: blue */
+  --c-blue: #2f7fdb;
+  --c-blue-soft: #eaf3fd;
 
-  /* Mood scale 1 → 5 (heavy → good); used only for the scale. */
-  --c-scale-1: #d9485f;
-  --c-scale-2: #ef8a3c;
-  --c-scale-3: #f2c230;
-  --c-scale-4: #7cc35b;
-  --c-scale-5: #2fa36b;
+  /* Help & crisis: red */
+  --c-red: #e2383b;
+  --c-red-strong: #c62b2e;
+  --c-red-soft: #fdeded;
+  --c-red-line: #f7d3d3;
 
-  --c-danger: #c8283a;
-  --c-danger-hover: #a91f2f;
-  --c-danger-soft: #fdebed;
-  --c-success: #1e8a55;
-  --c-warning-soft: #fff4dc;
-  --c-warning-border: #e7b448;
-  --c-focus: #3b82f6;
+  /* Warning */
+  --c-amber: #e69a12;
+  --c-amber-soft: #fff4dd;
 
-  /* Type: Golos Text — Russian open-source UI typeface (OFL), bundled locally so the app works offline. */
+  --c-focus: #2f7fdb;
+
+  /* Type: Golos Text (OFL), bundled locally — works offline. */
   --font: "Golos Text", system-ui, -apple-system, "Segoe UI", sans-serif;
   --fs-12: 0.75rem;
+  --fs-13: 0.8125rem;
   --fs-14: 0.875rem;
   --fs-16: 1rem;
   --fs-18: 1.125rem;
-  --fs-22: 1.375rem;
+  --fs-20: 1.25rem;
+  --fs-24: 1.5rem;
   --fs-28: 1.75rem;
-  --fs-40: 2.5rem;
-  --lh-tight: 1.15;
-  --lh-text: 1.5;
+  --fs-34: 2.125rem;
+  --fs-48: 3rem;
 
-  /* Spacing: 4 px grid. */
+  /* Spacing: 4 px grid */
   --s-1: 4px;
   --s-2: 8px;
   --s-3: 12px;
@@ -68,19 +61,17 @@
   --s-8: 32px;
   --s-10: 40px;
   --s-12: 48px;
-  --s-16: 64px;
 
-  /* Radius hierarchy: containers > controls > fields > chips. */
-  --r-card: 14px;
-  --r-control: 10px;
-  --r-field: 8px;
-  --r-chip: 6px;
+  /* Radii: tiles > buttons > chips */
+  --r-tile: 16px;
+  --r-btn: 12px;
+  --r-chip: 999px;
 
-  --tap: 48px; /* minimum touch target */
-  --header-h: 64px;
-  --content-max: 1160px;
+  --tap: 52px;
+  --nav-h: 64px;
+  --sidebar-w: 232px;
+  --rail-w: 300px;
 
-  /* Safe areas (notch, home indicator) for the mobile shell. */
   --safe-top: env(safe-area-inset-top, 0px);
   --safe-bottom: env(safe-area-inset-bottom, 0px);
   --safe-left: env(safe-area-inset-left, 0px);