/* 设计令牌（WP-0.2；架构第 10 节、docs/界面规范.md）。
   全站只用这一套变量：颜色、间距、圆角、控件高度、字号、卡片内边距。页面与组件不写死数字。

   一个站点一个数（界面规范 二.4）：
   - 管理端（考试站 /manage/）：控件 40px；卡片左右内边距 20px，手机 14px；卡片里的面板 15px。
   - 学员端（考试站学员页面、答题页）：可点区域 44px；卡片左右 16px，宽屏 20px。
   - 平台站、办公站：控件 44px；卡片左右 24px，手机 16px；面板 20px，手机 14px。
   布局在 <body> 上写 site-<站点> 与 layout-<布局>，下面按这两个类给同名变量换值，
   组件一律只读 --ui-gutter、--ui-panel、--ui-control。

   断点：640 / 760 / 900px（配题卡片另用 620px，05 第 6.3 节）。只用浅色；只用系统字体。
   禁止 :has()、subgrid（钉钉安卓 U4 内核报 Chrome/100，不支持；core/tests/test_frontend_lint.py 拦截）。 */

:root {
  color-scheme: light;

  /* 文字与底色 */
  --ui-ink: #1b2330;
  --ui-ink-soft: #3a4453;
  --ui-muted: #5e6878;
  --ui-faint: #8a93a2;
  --ui-line: #e2e6ec;
  --ui-line-soft: #eef1f4;
  --ui-line-strong: #d5dae1;
  --ui-ground: #f4f5f7;
  --ui-surface: #ffffff;
  --ui-surface-alt: #f7f8fa;
  --ui-hover: #f3f6fb;

  /* 主色（考试站 #1d4ed8；平台站、办公站 #1769e0，R-06-115） */
  --ui-primary: #1d4ed8;
  --ui-primary-hover: #1a44bd;
  --ui-primary-ink: #ffffff;
  --ui-primary-soft: #eaf0fe;
  --ui-primary-line: #b8c7f3;
  --ui-focus: rgba(29, 78, 216, 0.35);

  /* 语气色：成功、提醒、危险、中性 */
  --ui-success: #1b6a40;
  --ui-success-soft: #e7f4ec;
  --ui-success-line: #b9dcc6;
  --ui-warn: #a65a00;
  --ui-warn-ink: #8a4b00;
  --ui-warn-soft: #fdf1e2;
  --ui-warn-line: #f0d2a8;
  --ui-danger: #b3261e;
  --ui-danger-soft: #fff1f0;
  --ui-danger-line: #f1c5c1;
  --ui-neutral-soft: #eef1f4;

  /* 合规横幅与水印（R-06-133） */
  --ui-compliance-ink: #7e2c27;
  --ui-compliance-muted: #96635f;
  --ui-compliance-soft: #fff8f7;
  --ui-compliance-line: #edcfcc;
  --ui-compliance-mark: #9d332d;
  --ui-watermark: rgba(126, 44, 39, 0.075);
  --ui-watermark-small: rgba(126, 44, 39, 0.065);

  /* 间距（界面规范 一、三） */
  --ui-space-1: 4px;
  --ui-space-2: 8px;
  --ui-space-3: 12px;
  --ui-space-4: 16px;
  --ui-space-5: 20px;
  --ui-space-6: 24px;
  --ui-space-7: 28px;
  --ui-space-8: 32px;
  --ui-gap-section: 18px; /* 页面区块之间 */
  --ui-gap-subsection: 28px; /* 小节标题离上一块 */
  --ui-gap-card: 16px; /* 卡片里区块之间 */
  --ui-gap-field: 14px; /* 字段与字段之间 */
  --ui-gap-label: 6px; /* 字段标题与控件（全站统一，不是“至少”） */
  --ui-gap-control: 8px; /* 两个控件之间 */

  /* 圆角：卡片 12、面板 10、控件 8、标签 6；卡片不带阴影 */
  --ui-radius-card: 12px;
  --ui-radius-panel: 10px;
  --ui-radius-control: 8px;
  --ui-radius-chip: 6px;

  /* 控件高度：管理端 40；学员、平台、办公 44；卡片标题行里的小筛选 32 */
  --ui-control: 40px;
  --ui-control-sm: 32px;
  --ui-tap: 44px;

  /* 字号：正文 14、表格 13、说明 12；页面标题 24（手机 22）、卡片标题 16 */
  --ui-font-body: 14px;
  --ui-font-table: 13px;
  --ui-font-note: 12px;
  --ui-font-title: 24px;
  --ui-font-card-title: 16px;
  --ui-font-input: 14px;
  --ui-font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB",
    "Microsoft YaHei", "Noto Sans CJK SC", "Noto Sans SC", "Source Han Sans SC", system-ui, sans-serif;
  --ui-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;

  /* 卡片内边距与面板（一个站点一个数） */
  --ui-gutter: 20px;
  --ui-panel: 15px;
  --ui-page-pad: 32px; /* 页面左右留白（手机 16px） */
  --ui-page-max: 1320px;

  /* 外框尺寸 */
  --ui-topbar: 56px;
  --ui-sidenav: 232px;
  --ui-tabbar: 60px;
  --ui-safe-bottom: env(safe-area-inset-bottom, 0px);
  --ui-shadow-pop: 0 12px 32px rgba(27, 35, 48, 0.16);
  --ui-shadow-float: 0 -6px 20px rgba(27, 35, 48, 0.12);
}

/* 平台站、办公站：44px 控件、24px 卡片边距、20px 面板（R-06-115、界面规范 二.4） */
.site-portal,
.site-office {
  --ui-primary: #1769e0;
  --ui-primary-hover: #135bc4;
  --ui-primary-soft: #eaf2fd;
  --ui-primary-line: #b5cff5;
  --ui-focus: rgba(23, 105, 224, 0.35);
  --ui-control: 44px;
  --ui-gutter: 24px;
  --ui-panel: 20px;
}

/* 学员端：可点区域 44px；卡片 16px，宽屏 20px（02 第 6.3 节） */
.layout-learner,
.layout-focus {
  --ui-control: 44px;
  --ui-gutter: 16px;
  --ui-panel: 14px;
  --ui-page-max: 760px;
  --ui-font-body: 15px;
}

/* 登录、改密：考试站 40px，平台站与办公站 44px（06 第 6.3 节“控件 ≥40px，按钮整行宽”） */
.layout-bare {
  --ui-page-max: 440px;
}

@media (max-width: 899px) {
  :root {
    --ui-page-pad: 16px;
    --ui-topbar: 52px;
    --ui-font-input: 16px; /* 防 iOS 聚焦放大 */
  }
}

@media (min-width: 900px) {
  .layout-learner,
  .layout-focus {
    --ui-gutter: 20px;
  }
}

@media (max-width: 760px) {
  :root {
    --ui-gutter: 14px;
    --ui-font-title: 22px;
  }
  .site-portal,
  .site-office {
    --ui-gutter: 16px;
    --ui-panel: 14px;
  }
  .layout-learner,
  .layout-focus {
    --ui-gutter: 16px;
  }
  /* 手机上学员、平台、办公的小按钮也够手指点（可点区域 ≥44px） */
  .site-portal,
  .site-office,
  .layout-learner,
  .layout-focus {
    --ui-control-sm: 44px;
  }
}