/* ==========================================================================
   RadLevel Care — design tokens
   Values sampled directly from the project design boards (界面/2.1–2.6.png).
   ========================================================================== */

:root {
  /* --- primary: blue ramp (design board "Primary / Blue") ----------------- */
  --blue-700: #3D62DE;
  --blue-600: #4A6FE8;
  --blue-500: #5984f6;
  --blue-400: #759af8;
  --blue-300: #96b2fa;
  --blue-200: #b8cafb;
  --blue-100: #cfdcfd;
  --blue-050: #e8eefe;
  --blue-025: #f2f6ff;
  --cyan-400: #3eaeff;

  /* --- secondary: yellow ramp -------------------------------------------- */
  --yellow-500: #f5cd3d;
  --yellow-400: #f6d664;
  --yellow-300: #f9e59e;
  --yellow-100: #faf3d8;

  /* --- secondary: red ramp ----------------------------------------------- */
  --red-500: #ff6e7f;
  --red-400: #fe8b99;
  --red-300: #fdb5bf;
  --red-100: #fce0e5;

  /* --- supporting accents (report charts) -------------------------------- */
  --green-400: #52c98f;
  --violet-400: #8c7cf0;
  --slate-400: #9aa6b6;

  /* --- ink --------------------------------------------------------------- */
  --ink-900: #14161a;
  --ink-800: #2b2d40;
  --ink-700: #3f4145;
  --ink-600: #5a5c63;
  --ink-500: #758390;
  --ink-400: #9d9d9d;
  --ink-300: #c2c7cf;
  --ink-200: #e3e7ed;
  --ink-100: #eef1f5;

  /* --- surfaces ---------------------------------------------------------- */
  --canvas: #f9fafa;
  --canvas-sunken: #f3f5f8;
  --surface: #ffffff;
  --surface-tint: #f7f9fc;

  /* --- stage (presentation chrome, from cover board 2.1) ------------------ */
  --stage-deep: #0e2472;
  --stage-mid: #1c40a8;
  --stage-bright: #2f5fd8;
  --stage-ink: #eaf0ff;
  --stage-ink-dim: #9fb4e6;

  /* --- gradients --------------------------------------------------------- */
  --grad-primary: linear-gradient(90deg, var(--blue-500) 0%, var(--blue-100) 100%);
  --grad-progress: linear-gradient(90deg, #35a8ff 0%, #4d7bf3 100%);
  --grad-brand: linear-gradient(135deg, #a8cdf2 0%, #f3a6b0 55%, #fb6b7c 100%);
  --grad-liquid: linear-gradient(180deg, #6ec4fb 0%, #3f8ef0 100%);

  /* --- typography -------------------------------------------------------- */
  --font-display: "Montserrat", "Poppins", "Avenir Next", "Helvetica Neue", sans-serif;
  --font-body: "PingFang SC", "Hiragino Sans GB", "Helvetica Neue", "Microsoft YaHei", sans-serif;

  --text-xs: 0.6875rem; /* 11 */
  --text-sm: 0.75rem;   /* 12 — PingFang 12 Regular */
  --text-md: 0.875rem;  /* 14 — PingFang 14 Regular */
  --text-lg: 1rem;      /* 16 — PingFang 16 Medium */
  --text-xl: 1.25rem;   /* 20 — Montserrat 20 Semibold */
  --text-2xl: 1.5rem;   /* 24 — Montserrat 24 Semibold */

  /* --- radii ------------------------------------------------------------- */
  --r-xs: 6px;
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 26px;
  --r-pill: 999px;

  /* --- elevation --------------------------------------------------------- */
  --shadow-card: 0 6px 20px rgba(28, 42, 80, 0.05), 0 1px 2px rgba(28, 42, 80, 0.04);
  --shadow-raised: 0 12px 32px rgba(28, 42, 80, 0.1);
  --shadow-fab: 0 10px 26px rgba(251, 107, 124, 0.32);
  --shadow-device: 0 60px 120px -30px rgba(4, 16, 52, 0.65), 0 0 0 1px rgba(255, 255, 255, 0.08);

  /* --- motion ------------------------------------------------------------ */
  --dur-fast: 140ms;
  --dur-normal: 260ms;
  --dur-slow: 620ms;
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.4, 0.5, 1);

  /* --- device ------------------------------------------------------------ */
  --device-w: 390px;
  --device-h: 844px;
  --tabbar-h: 96px;
}