feat(web): patient web app with ЕМИАС (demo) and anonymous sign-in

A second channel to the same dialog engine as the Telegram bot: consent, onboarding, scales and check-ins come from app/dialog; the bot is unchanged. - API: /auth/emias (doctor's one-time connect code via EmiasMock), /auth/emias/demo (synthetic personas), /auth/anonymous (random token, nothing stored in the identity DB), /crisis/resources from crisis.yaml - web/: React + TS + Vite, mobile-first, safe areas, hash routing, tokens and texts isolated for a Capacitor mobile build Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-04 07:57:00 +03:00
parent 4d331e4c05
commit b8a93ce9d4
28 changed files with 4697 additions and 5 deletions
@@ -0,0 +1,90 @@
+/*
+ * 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.
+ */
+:root {
+  /* Base: cool ink on cool white. */
+  --c-ink: #13233a;
+  --c-text: #13233a;
+  --c-text-2: #46566b;
+  --c-text-3: #6b7a8e;
+  --c-page: #f4f7fb;
+  --c-surface: #ffffff;
+  --c-band: #e9f0fb; /* solid tint behind the welcome hero */
+  --c-border: #dbe3ee;
+  --c-border-strong: #b3c0d1;
+
+  /* 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;
+
+  /* Action colour = the doctor/ЕМИАС blue. */
+  --c-primary: #2350c8;
+  --c-primary-hover: #1c43ac;
+  --c-primary-active: #163689;
+  --c-primary-soft: #e7eefc;
+
+  /* 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;
+
+  --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;
+
+  /* Type: Golos Text — Russian open-source UI typeface (OFL), bundled locally so the app works offline. */
+  --font: "Golos Text", system-ui, -apple-system, "Segoe UI", sans-serif;
+  --fs-12: 0.75rem;
+  --fs-14: 0.875rem;
+  --fs-16: 1rem;
+  --fs-18: 1.125rem;
+  --fs-22: 1.375rem;
+  --fs-28: 1.75rem;
+  --fs-40: 2.5rem;
+  --lh-tight: 1.15;
+  --lh-text: 1.5;
+
+  /* Spacing: 4 px grid. */
+  --s-1: 4px;
+  --s-2: 8px;
+  --s-3: 12px;
+  --s-4: 16px;
+  --s-5: 20px;
+  --s-6: 24px;
+  --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;
+
+  --tap: 48px; /* minimum touch target */
+  --header-h: 64px;
+  --content-max: 1160px;
+
+  /* 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);
+  --safe-right: env(safe-area-inset-right, 0px);
+
+  --ease: cubic-bezier(0.2, 0, 0, 1);
+}