/*
 * 新站基础样式：设计变量 + 精简重置 + 元素默认样式。
 * 配色沿用现行站（《统一工作区布局与交互》：近白底 #f7f9fa、浅灰栏 #f0f3f2、鼠尾草绿 #657b5e、选中浅绿、正文 #293630）。
 * 刻度参考 Open Props（MIT）与 Radix Colors（MIT）的分级思路，元素默认参考 Pico CSS（MIT），数值为本站重新取定。
 * 将来做深色主题：只在 [data-theme="dark"] 上重定义下面的变量，部件 CSS 不写颜色字面量。
 */

:root {
  /* 表面 */
  --色-页面: #f7f9fa;
  --色-表面: #ffffff;
  --色-表面-凹: #f0f3f2;
  --色-表面-悬停: #f3f6f2;
  --色-遮罩: rgb(41 54 48 / 0.42);

  /* 边线 */
  --色-边线: #dee4e1;
  --色-边线-弱: #e8ecea;
  --色-边线-控件: #a9b4ae;
  --色-边线-控件-悬停: #7f8b84;

  /* 文字 */
  --色-文字: #293630;
  --色-文字-次: #56645c;
  --色-文字-弱: #5f6c65;
  --色-文字-占位: #6b7770;
  --色-文字-禁用: #8f9a94;
  --色-文字-反白: #ffffff;

  /* 品牌（鼠尾草绿） */
  --色-品牌: #657b5e;
  --色-品牌-悬停: #566b50;
  --色-品牌-按下: #4a5d45;
  --色-品牌-浅: #e6eee2;
  --色-品牌-浅-悬停: #dbe6d6;
  --色-品牌-文字: #4a6142;
  --色-品牌-浅上文字: #2f4429;

  /* 语义色：浅底 + 浅底上的文字 + 边线 */
  --色-成功-浅: #e5f2e8;
  --色-成功-文字: #1e6337;
  --色-成功-边: #b7d9c0;
  --色-警示-浅: #fcf0d9;
  --色-警示-文字: #7a4a00;
  --色-警示-边: #ecd29c;
  --色-危险: #b3392f;
  --色-危险-悬停: #9b2f27;
  --色-危险-浅: #fcebea;
  --色-危险-文字: #a0302a;
  --色-危险-边: #efc2be;
  --色-信息-浅: #e5eff6;
  --色-信息-文字: #1d5677;
  --色-信息-边: #b9d3e4;
  --色-中性-浅: #edf0ee;
  --色-中性-文字: #4b5852;

  --色-禁用-底: #eef1ef;
  --色-焦点: #4f6e47;

  /* 字体：系统字体，不加载网络字体 */
  --字体-正文: system-ui, -apple-system, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", "Source Han Sans SC", sans-serif;
  --字体-等宽: ui-monospace, "SFMono-Regular", "Cascadia Mono", Consolas, "Noto Sans Mono CJK SC", monospace;

  /* 字号：紧凑型界面。正文 13px，辅助 12px（下限），中文行高 1.6 */
  --字号-极小: 0.75rem;
  --字号-小: 0.75rem;
  --字号-正文: 0.8125rem;
  --字号-中: 0.875rem;
  --字号-大: 1rem;
  --字号-标题: 1.125rem;
  --字号-特大: 1.5rem;
  --行高-正文: 1.6;
  --行高-紧: 1.35;
  --字重-常规: 400;
  --字重-中: 500;
  --字重-粗: 600;

  /* 间距：4 的倍数 */
  --距-1: 0.25rem;
  --距-2: 0.5rem;
  --距-3: 0.75rem;
  --距-4: 1rem;
  --距-5: 1.25rem;
  --距-6: 1.5rem;
  --距-8: 2rem;
  --距-10: 2.5rem;
  --距-12: 3rem;

  /* 圆角：只有四档 */
  --角-小: 6px;
  --角-中: 8px;
  --角-大: 12px;
  --角-圆: 999px;

  /* 阴影：克制，只用于浮起的层 */
  --影-小: 0 1px 2px rgb(41 54 48 / 0.06);
  --影-中: 0 2px 4px rgb(41 54 48 / 0.04), 0 6px 16px rgb(41 54 48 / 0.08);
  --影-大: 0 4px 12px rgb(41 54 48 / 0.08), 0 24px 56px rgb(41 54 48 / 0.18);

  /* 控件高度 */
  --高-控件-小: 1.75rem;
  --高-控件: 2rem;
  --高-控件-大: 2.5rem;

  /* 列表行高（紧凑） */
  --高-行: 2.25rem;

  /* 布局 */
  --宽-侧栏: 12.5rem;
  --宽-侧栏-图标: 3.25rem;
  --高-顶栏: 3rem;
  --宽-正文最大: 80rem;

  /* 层级 */
  --层-吸顶: 10;
  --层-顶栏: 20;
  --层-菜单: 30;
  --层-对话框: 40;
  --层-提示: 50;

  /* 动效 */
  --时-快: 120ms;
  --时-中: 180ms;
  --缓动: cubic-bezier(0.2, 0, 0, 1);

  color-scheme: light;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --时-快: 0ms;
    --时-中: 0ms;
  }
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* 重置 */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  margin: 0;
  min-width: 360px;
  font-family: var(--字体-正文);
  font-size: var(--字号-正文);
  line-height: var(--行高-正文);
  color: var(--色-文字);
  background: var(--色-页面);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1,
h2,
h3,
h4 {
  margin: 0;
  line-height: var(--行高-紧);
  font-weight: var(--字重-粗);
  color: var(--色-文字);
}

h1 {
  font-size: var(--字号-标题);
}

h2 {
  font-size: var(--字号-大);
}

h3 {
  font-size: var(--字号-中);
}

h4 {
  font-size: var(--字号-正文);
}

p,
ul,
ol,
dl,
figure,
blockquote {
  margin: 0;
}

ul[role="list"],
ol[role="list"] {
  list-style: none;
  padding: 0;
}

img,
svg {
  display: block;
  max-width: 100%;
}

a {
  color: var(--色-品牌-文字);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
}

a:hover {
  color: var(--色-品牌-按下);
}

code,
kbd,
samp {
  font-family: var(--字体-等宽);
  font-size: 0.92em;
}

small {
  font-size: var(--字号-小);
}

hr {
  border: 0;
  border-top: 1px solid var(--色-边线);
  margin: var(--距-6) 0;
}

table {
  width: 100%;
  border-collapse: collapse;
  font-variant-numeric: tabular-nums;
}

th,
td {
  padding: var(--距-2) var(--距-3);
  text-align: left;
  border-bottom: 1px solid var(--色-边线-弱);
  vertical-align: top;
}

th {
  font-weight: var(--字重-中);
  font-size: var(--字号-小);
  color: var(--色-文字-次);
  background: var(--色-表面-凹);
}

/* 表单元素基线：部件 表单项.css 再细化 */
button,
input,
select,
textarea {
  font: inherit;
  color: inherit;
  margin: 0;
}

button {
  cursor: pointer;
}

button:disabled {
  cursor: not-allowed;
}

input::placeholder,
textarea::placeholder {
  color: var(--色-文字-占位);
  opacity: 1;
}

fieldset {
  margin: 0;
  padding: 0;
  border: 0;
  min-width: 0;
}

legend {
  padding: 0;
}

summary {
  cursor: pointer;
}

[hidden] {
  display: none !important;
}

/* 焦点：只给键盘焦点画环，颜色对白底 5.7:1 */
:focus-visible {
  outline: 2px solid var(--色-焦点);
  outline-offset: 2px;
}

:focus:not(:focus-visible) {
  outline: none;
}

/* 数字：金额、计数、日期统一用等宽数字 */
.数字 {
  font-variant-numeric: tabular-nums;
}

.仅读屏 {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.icon {
  width: 1.125rem;
  height: 1.125rem;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}