/* ══════════════════════════════════════════════════════════════════════
   诺辉研究 · 原型视觉 token
   来源：brand/VI-设计规范.md（权威）与 brand/styleguide.html 的 :root（可运行事实）
   纪律：每个值都能说出出处。凡「派生」的都在行尾注明从哪个 VI 变量推来的。
   ══════════════════════════════════════════════════════════════════════ */
:root{
  /* ── 表面与线（抄自 VI §2.1）── */
  --c-bg:#FAFCFD;
  --c-surface:#F0F5F8;
  --c-surface-2:#E5EEF3;
  --c-surface-3:#D8E5EC;           /* VI --surface-3：禁用底、进度轨道、骨架屏 */
  --c-border:#D8E5EC;
  --c-border-strong:#6E7F89;       /* VI --border-strong */
  --c-line-soft:#EAF1F5;           /* VI --line-soft */

  /* ── 文字（抄自 VI §2.2）── */
  --c-text:#0D1418;
  --c-text-muted:#3B4950;
  --c-text-faint:#5A6871;
  --c-text-disabled:#566470;       /* VI §2.2：禁用文字不复用 faint，faint 压 surface-3 只有 4.47 */

  /* ── 品牌（VI §2.3：一支色两种用法，不许合并）── */
  --c-brand:#004F7D;               /* VI --accent，实心填充 */
  --c-brand-hover:#00699F;         /* 派生：明度阶上一档 VI --t-600，保证 hover 可感知且同色相 */
  --c-brand-soft:#E6F4FB;          /* VI --accent-soft */
  --c-accent:#BFE3F5;              /* VI --hl 荧光笔：垫文字下，绝不做按钮底 */
  --c-on-brand:#FAFCFD;            /* VI --on-accent */
  --c-on-brand-2:rgba(255,255,255,.80);
  --c-on-brand-3:rgba(255,255,255,.72);

  /* ── 语义色（VI §2.6：本站刻意只有两态，不引入红绿黄四件套）──
     红绿在投资语境下会被读成涨跌与好坏，那是我们最不想传递的信号。
     所以 success / info 都用品牌色，warning 用墨色加重，只有 danger 是独立的一支砖红。
     状态之间靠「底色明度 + 边框形制（实线/虚线）+ 前导标记形状」三重区分，不靠色相。 */
  --c-success:#004F7D;      --c-success-soft:#BFE3F5;   /* = brand / hl */
  --c-info:#004F7D;         --c-info-soft:#E6F4FB;
  --c-warning:#0D1418;      --c-warning-soft:#E5EEF3;   /* = text / surface-2 */
  --c-danger:#A3231C;       --c-danger-soft:#FBEAE8;    /* VI --state-danger，砖红非鲜红，避开「涨」的联想 */

  /* ── 赛道树明度阶（VI §2.5，覆盖度用同色相明度表达）── */
  --t-900:#00263C; --t-800:#003A5C; --t-700:#004F7D; --t-600:#00699F;
  --t-500:#1A85BE; --t-400:#4BA5D4; --t-300:#82C4E4; --t-200:#BFE3F5;
  --t-100:#DDF0FA; --t-050:#EFF8FD;
  --t-mute:#7A8C96;                /* 待覆盖：空心描边与虚线，压底 3.39:1 过图形阈值 */
  --t-mute-soft:#D8E5EC;

  /* ── 字体（抄自 VI §3）── */
  --font-display:"Schibsted Grotesk","Noto Sans SC",-apple-system,"PingFang SC",sans-serif;
  --font-body:"Schibsted Grotesk","Noto Sans SC",-apple-system,"PingFang SC",sans-serif;
  --font-mono:"DM Mono","SF Mono",ui-monospace,monospace;

  /* ── 字号（抄自 VI §4 的 type scale）── */
  --fs-h1:clamp(29px,4.2vw,48px);
  --fs-h2:clamp(25px,3.5vw,41px);
  --fs-h3:clamp(21px,2.5vw,29px);
  --fs-h4:clamp(19px,2.1vw,23px);
  --fs-lead:clamp(15.5px,1.85vw,19px);
  --fs-body:clamp(15px,1.6vw,17px);
  --fs-sm:14px;
  --fs-xs:12.5px;
  --fs-eyebrow:11px;
  --fs-micro:10.5px;
  --lh-body:1.78;                  /* VI §4：长文正文行高硬指标，不许为塞内容调低 */

  /* ── 间距（抄自 VI §5.1 的 4 倍数阶梯）── */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px;
  --sp-5:24px; --sp-6:32px; --sp-7:44px; --sp-8:64px;
  --sp-9:88px; --sp-10:120px;      /* 区块之间（VI §5.3）*/

  /* ── 形态（抄自 VI §6）── */
  --radius-sm:6px;
  --radius-md:10px;
  --radius-lg:16px;                /* 派生：VI 只登记 10 与 6，lg ≈ 基准 ×1.6 */
  --shadow-sm:none;                /* VI §6.3：零阴影，抬升靠底色档位 */
  --shadow-md:none;
  --scrim:rgba(13,20,24,.46);      /* VI §6.3：遮罩从文字色派生，不写死黑 */

  /* ── 动效（抄自 VI §7.3 / §7.4）── */
  --ease-out:cubic-bezier(.16,1,.3,1);     /* VI --ease：元素出现或改尺寸 */
  --ease-in:cubic-bezier(.32,0,.16,1);     /* VI --ease-emphasis：颜色/描边/填充变化 */
  --dur-fast:200ms;
  --dur-base:340ms;

  /* ── 布局（抄自 VI §5.2）── */
  --layout-max:1200px;
  --layout-read:720px;             /* 长文阅读区，正文不跟随 1200 拉满 */
  --sidebar-w:240px;

  color-scheme:light;              /* VI §2.9：本规范不提供暗色主题 */
}

/* ══════════ 基础排版（契约的一部分，一行都不能丢）══════════
   box-sizing 一没，全站每页横向溢出 2×内边距，而且肉眼只表现为「右边被切了一点」。 */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--c-bg);color:var(--c-text);
  font:400 var(--fs-sm)/1.6 var(--font-body);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0;font-family:var(--font-display);font-weight:600;letter-spacing:-.018em;line-height:1.25}
h1{font-size:var(--fs-h1)} h2{font-size:var(--fs-h2)} h3{font-size:var(--fs-h3)} h4{font-size:var(--fs-h4);font-weight:500}
p{margin:0}
a{color:inherit;text-decoration:none}
img,svg{max-width:100%}
ul,ol{margin:0;padding:0;list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
/* 浏览器给 <button> 的默认灰底+深框必须清掉：任何不用 .btn 类的自定义按钮都会中招
   （实测：报告库左侧筛选行是 <button class="frow">，没清之前每行都套着一层系统按钮外壳）*/
button{background:none;border:0;padding:0;margin:0;text-align:inherit;cursor:pointer;-webkit-appearance:none;appearance:none}
button:disabled{cursor:not-allowed}
table{border-collapse:collapse}
:focus-visible{outline:2px solid var(--c-border-strong);outline-offset:2px;border-radius:var(--radius-sm)}
::selection{background:var(--c-accent);color:var(--c-text)}
/* 数字一律等宽 + 衬线数字（VI §3.4：旧式数字会把 ¥0 画成 ¥o）*/
.num,.mono,td.num,time{font-family:var(--font-mono);font-variant-numeric:lining-nums tabular-nums}
/* grid/flex 子项默认 min-width:auto，中文长句会撑破容器 */
.grid>*,.flex>*{min-width:0}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important}
  .reveal{opacity:1!important;transform:none!important}
}
