/*
 * 知元医链设计 token（来源：原型总览 04「界面规范与组件」，架构文档 5.4）。
 * 官网、落地页共用；页面只用这里的变量，不再各写一套色值。
 * 禁止：阴影、渐变、玻璃拟态、描边卡片、左侧色条、emoji。
 */
:root {
  /* 品牌色 */
  --c-cobalt: #012180;          /* 主按钮、主卡、链接 */
  --c-cobalt-hover: #00135A;
  --c-ivory: #F7F5EC;           /* 页面底 */
  --c-amber: #F7AA20;           /* 只用于当前与待办（色面） */
  --c-amber-ink: #E0940A;       /* 浅底上的琥珀线条 */
  --c-cyan: #23F7F7;            /* 只在深底 */
  --c-cyan-ink: #0FB5B5;        /* 浅底上 Logo 用的压暗青 */
  --c-magenta: #FA17FA;         /* 只在深底 */
  --c-white: #FFFFFF;

  /* 文字 */
  --c-ink: #0B1533;             /* 标题、发丝线按钮 */
  --c-text: #2A3552;            /* 正文 */
  --c-mist: #4E5A78;            /* 次要文字 */
  --c-on-dark: #E3E8F6;         /* 深底正文 */
  --c-on-dark-mist: #C7D0EA;    /* 深底次要 */
  --c-on-dark-faint: #9FB0E0;   /* 深底分组标题 */

  /* 色面与线 */
  --c-mint: #DEF5EE;            /* 次级色面、选中底、提示 */
  --c-hairline: #E6E1D3;        /* 分隔 */
  --c-stroke: #D3CDBE;          /* 描边、未开始 */
  --c-disabled: #C9C3B3;
  --c-footer: #0B1533;
  --c-footer-line: #23305A;

  /* 页头 / 页脚通栏钴蓝上的前景与强调（Logo 融合设计第 3 版）；青色只作装饰线，不作文字色 */
  --c-nav-fg: #F7F4EC;
  --c-nav-fg-soft: rgba(247, 244, 236, .82);
  --c-nav-fg-faint: rgba(247, 244, 236, .7);
  --c-nav-line: rgba(247, 244, 236, .18);
  --c-underline: #25F4F4;
  --c-cta: #F7A823;
  --c-cta-hover: #FFB93D;
  --c-surface: #F5F7FB;
  --c-surface-line: #D5DCEB;
  --c-text-2: #5B6478;

  /* 状态点（Kit 只给语义；色值按原型官网页面取） */
  --c-dot-blue: #012180;        /* 进行中 */
  --c-dot-green: #1F6B4F;       /* 已完成 / 生效 */
  --c-dot-red: #A3261B;         /* 出错 / 失效 */
  --c-dot-grey: #4E5A78;        /* 已结束 */
  --c-error: #A3261B;

  --overlay: rgba(11, 21, 51, .45);

  /* 圆角：标签 4、输入 12、信息面 20（官网大面 28）、主卡 24、按钮 = 高度 / 2 */
  --r-tag: 4px;
  --r-input: 12px;
  --r-input-lg: 16px;
  --r-panel: 20px;
  --r-panel-lg: 28px;
  --r-hero: 24px;

  /* 按钮高：官网主操作 56、常规 48、紧凑 32、图标 44 */
  --h-btn: 56px;
  --h-btn-md: 48px;
  --h-btn-sm: 32px;
  --h-icon: 44px;

  /* 字体统一从 assets/typography/typography.css 加载。 */

  --w-page: 1280px;
  --gutter: 80px;
  --nav-h: 76px;
}

@media (max-width: 960px) {
  :root { --gutter: 24px; }
}
@media (max-width: 860px) {
  :root { --nav-h: 64px; }
}
@media (max-width: 480px) {
  :root { --gutter: 16px; }
}