/* ============================================================
   白话金融 OpenFin Academy — 设计令牌
   风格：财经报刊的编辑感 × 交易终端的信息密度
   —— 纸感底 + 墨蓝字 + 正方切角 + hairline 分隔 + 等宽数字
   ============================================================ */

:root {
  /* ---------- 纸与墨 ---------- */
  --paper:        #F2EAE6;   /* 账簿纸：暖玫瑰调，区别于纯白与奶油 */
  --paper-deep:   #E9DEDA;   /* 纸的暗部，用于分区底 */
  --sheet:        #FFFCFA;   /* 单页白：卡片、正文面板 */
  --sheet-2:      #F8F1ED;   /* 次级面板 */
  --rule:         #DCCEC6;   /* 主界线 */
  --rule-2:       #EBE2DC;   /* 淡界线 */
  --rule-3:       #F3EBE6;   /* 极淡界线 */

  --ink:          #16232B;   /* 标题 */
  --ink-2:        #4A5B63;   /* 正文 */
  --ink-3:        #546267;   /* 辅助、注释（5.33:1，浅底上也要读得清） */
  --ink-4:        #5E6B70;   /* 占位（4.64:1，兜底的字也不能看不清） */

  /* ---------- 强调 ---------- */
  --teal:         #0B6E75;   /* 青金：链接、主图表色、选中态 */
  --teal-2:       #13888F;
  --teal-soft:    rgba(11,110,117,.07);
  --teal-line:    rgba(11,110,117,.22);

  --gold:         #A87A22;   /* 金箔：图形色——峰值圈、游标、滑块、焦点环
                                 （图形对比只需 3:1，不跟文字一个尺子） */
  --gold-text:    #7E5B18;   /* 金箔的**文字**版（纸底 5.21:1 / 卡底 6.05:1，≥4.5） */
  --gold-2:       #C79B36;
  --gold-soft:    rgba(168,122,34,.10);
  --gold-line:    rgba(168,122,34,.28);

  /* ---------- 语义（红涨绿跌，中式口径） ----------
     这几个主要是**文字**色：浅底上都必须 ≥4.5:1。
     原来的值只有 3.0–4.5，金色尤其差（3.23:1，标题级别的字都看不清）。 */
  --up:           #B03627;   /* 4.68 / 5.20 */
  --up-soft:      rgba(194,64,47,.08);
  --down:         #186A4B;   /* 4.97 / 5.52 */
  --down-soft:    rgba(27,122,87,.08);
  --flat:         #566064;   /* 4.90 / 5.44 */
  --warn:         #885713;   /* 4.66 / 5.17 */
  --warn-soft:    rgba(169,112,26,.10);
  --danger:       #A83A3A;
  --danger-soft:  rgba(168,58,58,.08);

  /* ---------- 面积填充（回放器：基准线上方=涨，下方=跌） ---------- */
  --fill-up:      rgba(194,64,47,.13);
  --fill-down:    rgba(27,122,87,.15);

  /* ---------- 字体 ---------- */
  --font-sans: "PingFang SC", "Source Han Sans SC", "Noto Sans SC", "Hiragino Sans GB",
               "Microsoft YaHei", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas,
               "Liberation Mono", "Courier New", monospace;

  /* ---------- 字号 ---------- */
  --t-masthead:  clamp(26px, 3.4vw, 36px);
  --t-hero:      clamp(24px, 3vw, 33px);
  --t-h1:        25px;
  --t-h2:        19px;
  --t-h3:        16px;
  --t-body:      15px;
  --t-small:     13px;
  --t-micro:     12px;
  --t-eyebrow:   11px;

  --lh-tight:    1.3;
  --lh-title:    1.42;
  --lh-body:     1.78;

  /* ---------- 间距 ---------- */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px;
  --s-5: 22px; --s-6: 30px; --s-7: 42px; --s-8: 60px;

  /* ---------- 圆角：金融风格用极小切角 ---------- */
  --r-0: 0px;  --r-1: 2px;  --r-2: 3px;  --r-3: 5px;

  /* ---------- 阴影：靠 hairline 而非投影分层 ---------- */
  --sh-1: 0 1px 2px rgba(22,35,43,.05);
  --sh-2: 0 4px 14px -6px rgba(22,35,43,.16);
  --sh-3: 0 16px 44px -16px rgba(22,35,43,.26);

  /* ---------- 布局尺寸 ---------- */
  --masthead-h:  58px;
  --ticker-h:    38px;
  --rail-w:      214px;
  --rail-w-min:  60px;
  --reading-w:   664px;
  --page-max:    1320px;

  /* ---------- 动效 ----------
     时长只有三档：--dur-1 交互反馈 / --dur-2 面板与进场 / --dur-3 大表面。
     缓动只有三个：--ease-out 是默认；--ease-in-out 只给颜色的双向过渡
     （hover 进出、状态换色）；--ease-spring 全站只有两处可用——
     components.css 里 .drawer 的开合与 .switch::after 的拨杆——
     清单之外禁止引用，也不许再造多段回弹。
     所有动效只许 transform / opacity；唯一允许的循环动画是
     components.css 里加载骨架的 shimmer（只在数据未到时存在）。
     使用处一律写 var(--dur-*, …ms) / var(--ease-*, cubic-bezier(…))
     并带兜底值——不许出现第四档时长，也不许裸写毫秒。 */
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --dur-1: .14s;   /* =140ms：hover / focus / 点按反馈 */
  --dur-2: .24s;   /* =240ms：面板开合、换页进场 */
  --dur-3: .42s;   /* =420ms：抽屉这类大表面 */

  /* ---------- 层级 ---------- */
  --z-sticky: 40; --z-rail: 50; --z-drawer: 80; --z-palette: 90; --z-top: 100;
}

/* 深色皮肤：夜盘终端。仍保持同一套结构语言，只换纸墨。 */
body[data-theme="night"] {
  --paper:        #14191C;
  --paper-deep:   #0E1214;
  --sheet:        #1B2226;
  --sheet-2:      #222A2E;
  --rule:         #2E383D;
  --rule-2:       #262E33;
  --rule-3:       #212A2E;
  --ink:          #E8ECEC;
  --ink-2:        #AAB6B8;
  --ink-3:        #96A2A6;   /* 辅助、注释（6.76:1，夜里的字也得看得清） */
  --ink-4:        #869296;   /* 占位（5.54:1） */
  --teal:         #4FBFC4;
  --teal-2:       #6FD6DA;
  --teal-soft:    rgba(79,191,196,.10);
  --teal-line:    rgba(79,191,196,.28);
  --gold:         #D2A64A;
  --gold-text:    #D2A64A;   /* 夜里的金本来就够亮，文字与图形同色 */
  --gold-2:       #E4BE6B;
  --gold-soft:    rgba(210,166,74,.12);
  --gold-line:    rgba(210,166,74,.32);
  --up:           #E4665A;
  --up-soft:      rgba(228,102,90,.12);
  --down:         #35B183;
  --down-soft:    rgba(53,177,131,.12);
  --warn:         #D6A54E;
  --warn-soft:    rgba(214,165,78,.12);
  --danger:       #E06A6A;
  --danger-soft:  rgba(224,106,106,.12);
  --fill-up:      rgba(228,102,90,.18);
  --fill-down:    rgba(53,177,131,.20);
  --sh-1: 0 1px 2px rgba(0,0,0,.3);
  --sh-2: 0 4px 14px -6px rgba(0,0,0,.5);
  --sh-3: 0 16px 44px -16px rgba(0,0,0,.6);
}