@charset "UTF-8";
/* ============================================================================
   《基础会计》数字教材 · 设计令牌 v1.0  ——  唯一色彩来源
   主题：现代账簿 · 学术蓝金（Modern Ledger · Academic Blue–Brass）
   概念：一本被数字化的精算账簿。纸承担长时间阅读，金铜与深蓝承担学术庄重，
        4D 挂载舱承担推演的纵深。
   ----------------------------------------------------------------------------
   ▸ 本文件是全站唯一色彩来源。除此之外的任何 CSS 不得出现硬编码色值（构建期断言）。
   ▸ 两套环境：浅底「账簿纸」（--paper 系）与深底「4D 舱」（--hq-* 系）。
     深底不是另一套组件，而是**令牌桥接**：`[data-theme="hq"]` / `.mode-hq`
     把浅底语义位重映射到 --hq-*，组件代码零改动。
   ▸ 派生色一律**具名入 :root**（不用 color-mix / filter），便于对比度实测与审计。
   ▸ 对比度红线：正文与表格 ≥7:1；次级文字 ≥4.5:1；12px 以下字号禁用。
     语义色**只承担边框 / 左缘 / 形状 / 大字**，文字一律 --ink / --navy / --hq-ink。
     实测表见 DESIGN-NOTES.md 第三节（由 design/_dev/contrast.mjs 生成，非估值）。
   ========================================================================== */

:root{
  /* ---------- 0 · 复位与显隐（必须显式声明，组件的 display 会覆盖 UA 规则） ---------- */
  /* 见文件末尾 BASE 段 */

  /* ---------- 1 · 浅底账簿纸：底与线 ---------- */
  --paper:#F7F5F0;          /* 账簿纸底（阅读页） */
  --paper-2:#EFECE4;        /* 纸面加深：表头 / 隔行 / 舱体外框 */
  --paper-3:#FBFAF7;        /* 卡片浮起 */
  --paper-4:#E6E2D8;        /* 再深一档：表头分级 / 分隔带 */
  --paper-edge:#DCD6C8;     /* 纸张切口/书口投影 */
  /* 环境层（簿记横线与装订元素）—— 低对比纹理，不得干扰数字边缘 */
  --env-rule:#E4E0D6;       /* 账簿横线（每 32px） */
  --env-rule-strong:#DAD4C6;/* 每第 6 条稍深，便于横向追踪 */
  --env-margin:#B3261E;     /* 页边朱红竖线（朱丝栏） */
  --env-hole:#C9C2B2;       /* 装订孔 */
  --env-hole-in:#F2EFE8;    /* 装订孔内高光 */
  /* 组件分隔线（卡片 / 表头 / 折叠块外框）。
     历史缺陷修复：--rule / --rule-strong 曾被 components.css 引用 50 余处却从未定义，
     导致这些边框在计算值阶段整条失效（不可见）。此处以**别名**接入既有簿记线色，
     不新增色值；深底舱经 --env-rule* 的既有桥接自动跟随，无需重复声明。 */
  --rule:var(--env-rule);            /* 分隔线：同账簿横线 */
  --rule-strong:var(--env-rule-strong); /* 分隔线加深档：表头下缘 / 组标题右侧 */

  /* ---------- 2 · 墨色（文字阶梯） ---------- */
  --ink:#1B1F27;            /* 主文字 / 正文 / 表格单元格 */
  --ink-2:#4A5260;          /* 次级文字：表头、图注、摘要 */
  --ink-3:#6D7686;          /* 弱化：仅 ≥13px 的非承载信息标签（对纸底 4.20:1，禁用承载信息） */
  --ink-3-strong:#5A6270;   /* 弱化-可读档：破折号占位/提示等需辨识的弱文字（纸底 5.6:1、卡片 5.9:1） */
  --ink-inv:#F2F5F9;        /* 深底/深蓝实底上的文字 */
  --ink-inv-2:#D6DFEA;      /* 深底次级 */

  /* ---------- 3 · 学院深蓝：结构 · 标题 · 主数据 ---------- */
  --navy:#123A63;
  --navy-2:#1D5185;         /* 亮档：链接 / hover / 主按钮 */
  --navy-3:#3A6EA5;         /* 深蓝第三档：深底上的蓝 */
  --navy-soft:#E4EAF2;      /* 深蓝浅底（表头带、选中行） */
  --navy-line:#C3D0E0;      /* 深蓝描边 */
  --navy-ink:#0C2947;       /* 深蓝文字加深（用于小字加粗标题） */

  /* ---------- 4 · 金铜：强调 · 当前 · 待办 ---------- */
  --brass:#9A6B1F;
  --brass-deep:#7A5218;     /* 金铜深档：小字强调与实底按钮（纸底 5.6:1 / 反白 6.3:1） */
  --brass-deep-2:#664310;   /* 金铜最深档：hover 实底 */
  --brass-soft:#F0E3C8;     /* 金铜浅底（徽章 / 高亮行 / 合计行） */
  --brass-line:#D8C79E;     /* 金铜描边 */
  --brass-leaf:#C08A2E;     /* 烫金箔色（深底封面专用，浅底禁用） */
  --brass-leaf-2:#E0B75C;   /* 烫金高光 */

  /* ---------- 5 · 账簿墨绿：完成 · 平衡 · 通过 ---------- */
  --ledger:#0F7A5A;
  --ledger-deep:#0B5F46;
  --ledger-soft:#DCEFE6;
  --ledger-line:#A9CFBE;

  /* ---------- 6 · 朱红：告警 · 失衡 · 印章 ---------- */
  --alarm:#B3261E;
  --alarm-deep:#8C1D17;
  --alarm-soft:#F7DED9;
  --alarm-line:#E3B0A9;

  /* ---------- 7 · 紫棠：第四语义位（定义框 tone=purple） ---------- */
  --plum:#5B4B7A;
  --plum-soft:#ECE8F3;
  --plum-line:#C9C0DC;

  /* ---------- 7b · 二维码静区（唯一允许的纯白底：保证手机识别率） ---------- */
  --qr-quiet:#FFFFFF;       /* 二维码四周静区底色：不得反色、不得叠加动画/滤镜 */
  --qr-edge:#D9D3C6;        /* 静区外框（复用账簿线色语义） */

  /* ---------- 8 · 深底 4D 挂载舱 ---------- */
  --hq-bg:#0B1420;
  --hq-bg-2:#101C2C;
  --hq-panel:#142234;
  --hq-panel-2:#1A2B42;
  --hq-line:#243A55;
  --hq-line-2:#33506F;
  --hq-ink:#EAF0F7;
  --hq-ink-2:#C6D3E2;       /* 次级：对最亮面板 --hq-panel-2 亦 ≥7:1 */
  --hq-ink-3:#9FB0C6;       /* 弱化：仅 ≥13px 辅助标签 */
  --hq-brand:#4EC5D4;       /* 青：品牌 / 结构 */
  --hq-brand-2:#7AD6E2;
  --hq-brand-soft:#123240;  /* 青 10% 桥接底 */
  --hq-brass:#E0A53A;
  --hq-brass-soft:#2E2416;
  --hq-ledger:#4CC38A;
  --hq-ledger-soft:#102C22;
  --hq-alarm:#EF6B60;
  --hq-alarm-soft:#331A18;
  --hq-grid:#16273C;        /* 舱内网格 */
  --hq-scan:rgba(78,197,212,.055);

  /* ---------- 9 · 封面 / 封底（深墨蓝布面书壳 + 烫金 + 朱印） ---------- */
  --cover-bg:#0A1728;             /* 布面深墨蓝 */
  --cover-bg-2:#122C4A;           /* 布面提亮（中心渐隐） */
  --cover-bg-3:#060F1B;           /* 布面暗角 */
  --cover-cloth:rgba(255,255,255,.035);  /* 布纹经纬（横） */
  --cover-cloth-2:rgba(0,0,0,.06);       /* 布纹经纬（纵） */
  --cover-ink:#F4F1E9;            /* 书壳主文字（暖白） */
  --cover-ink-2:#C9CFD8;          /* 书壳次级文字 */
  --cover-ink-3:#9AA6B4;          /* 书壳弱化文字（≥13px） */
  --cover-rule:rgba(192,138,46,.55);     /* 烫金细线 */
  --cover-rule-2:rgba(192,138,46,.22);   /* 烫金极淡 */
  --cover-seal:#B3261E;           /* 朱印底 */
  --cover-spine:#08111D;          /* 书脊 */
  --cover-spine-line:rgba(224,183,92,.35);
  --cover-headband:#8C1D17;       /* 堵头布 */
  --cover-stage:#07101C;          /* 4D 舞台底 */
  --cover-stage-line:rgba(78,197,212,.14);

  /* ---------- 10 · 形与影（纸面是"压印"，不是"发光"） ---------- */
  --r-xs:4px; --r-sm:6px; --r:10px; --r-lg:14px; --r-xl:20px; --r-pill:999px;
  --bw-hair:1px; --bw-rule:2px; --bw-edge:3px; --bw-edge-lg:4px;
  --shadow-1:0 1px 0 rgba(255,255,255,.72) inset,0 1px 2px rgba(27,31,39,.06);
  --shadow-2:0 10px 24px -16px rgba(18,58,99,.35);
  --shadow-3:0 22px 48px -26px rgba(18,58,99,.45);
  --shadow-sunken:inset 0 1px 3px rgba(27,31,39,.09);
  --shadow-seal:0 2px 6px -2px rgba(140,29,23,.55);
  --shadow-stage:inset 0 0 0 1px rgba(78,197,212,.12),0 30px 60px -40px rgba(0,0,0,.9);
  --bevel-hq:inset 0 1px rgba(255,255,255,.05);

  /* ---------- 11 · 字体（全部系统字体栈，C1 零外链） ---------- */
  --serif:"Source Han Serif SC","Noto Serif SC","Songti SC","SimSun","Songti TC",Georgia,"Times New Roman",serif;
  --sans:-apple-system,"Segoe UI","Microsoft YaHei","PingFang SC","Hiragino Sans GB",sans-serif;
  --num:"JetBrains Mono",Consolas,"Cascadia Mono","Courier New",ui-monospace,monospace;
  --kai:"Kaiti SC","KaiTi","STKaiti","楷体",var(--serif);   /* 引文 / 编者按 */

  /* ---------- 12 · 字号阶梯（根 16px）与行高 ---------- */
  --step-1:.8125rem;                 /* 13px 辅助文字下限区 */
  --step0:.9375rem;                  /* 15px 正文基准 */
  --step1:1rem;                      /* 16px */
  --step2:1.125rem;                  /* 18px */
  --step3:1.375rem;                  /* 22px */
  --step4:clamp(1.75rem,2.6vw,2.25rem);   /* 28–36px */
  --step5:clamp(2.2rem,4vw,3.4rem);       /* 35–54px 章号 / 书名 */
  --step6:clamp(2.9rem,6.2vw,4.6rem);     /* 封面主书名 */
  --floor:12px;                      /* 绝对下限（C3）：任何文字不得小于此值 */
  --lh-body:1.8;                     /* 正文行高 ≥1.75（C3） */
  --lh-tight:1.35;
  --lh-snug:1.5;
  --tracking-cjk:.02em;
  --tracking-caps:.14em;

  /* ---------- 13 · 空间 · 栅格 · 节奏 ---------- */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px;
  --sp-6:24px; --sp-7:32px; --sp-8:40px; --sp-9:56px; --sp-10:72px;
  --rhythm:32px;                     /* 账簿横线节奏（环境层） */
  --measure:44rem;                   /* 正文最佳行宽 ≈43 个汉字 */
  --wide:62rem;                      /* 数据组件最大宽度 */
  --shell-max:96rem;                 /* 版心外框 */
  --side-w:15rem;                    /* 左栏（本篇章节目录） */
  --rail-w:13.5rem;                  /* 右栏（阅读仪表，≥1440 出现） */
  --gutter:clamp(16px,2.4vw,32px);
  --topbar-h:56px;
  --hair:1px;

  /* ---------- 14 · 动效（会计页要"稳"） ---------- */
  --dur-1:120ms; --dur-2:200ms; --dur-3:320ms; --dur-4:520ms;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --stagger:45ms;

  /* ---------- 15 · 层级 ---------- */
  --z-env:0; --z-base:1; --z-sticky:40; --z-topbar:60; --z-rail:50;
  --z-nav:80; --z-palette:120; --z-toast:140;
}

/* ============================================================================
   深底 4D 舱 —— 令牌桥接（不改组件类名）
   用在 `[data-theme="hq"]`（整页深色阅读模式）与 `.mode-hq`（浅底页里的深色舱体）
   ========================================================================== */
[data-theme="hq"],
.mode-hq{
  --paper:var(--hq-bg);
  --paper-2:var(--hq-bg-2);
  --paper-3:var(--hq-panel);
  --paper-4:var(--hq-panel-2);
  --paper-edge:var(--hq-line);
  --env-rule:var(--hq-grid);
  --env-rule-strong:var(--hq-line);
  --env-margin:var(--hq-alarm);
  --env-hole:var(--hq-line);
  --env-hole-in:var(--hq-bg-2);

  --ink:var(--hq-ink);
  --ink-2:var(--hq-ink-2);
  --ink-3:var(--hq-ink-3);
  --ink-3-strong:var(--hq-ink-3);

  --navy:var(--hq-brand);
  --navy-2:var(--hq-brand-2);
  --navy-3:var(--hq-brand-2);
  --navy-soft:var(--hq-brand-soft);
  --navy-line:var(--hq-line-2);
  --navy-ink:var(--hq-brand);

  --brass:var(--hq-brass);
  --brass-deep:var(--hq-brass);
  --brass-deep-2:var(--hq-brass);
  --brass-soft:var(--hq-brass-soft);
  --brass-line:var(--hq-line-2);

  --ledger:var(--hq-ledger);
  --ledger-deep:var(--hq-ledger);
  --ledger-soft:var(--hq-ledger-soft);
  --ledger-line:var(--hq-line-2);

  --alarm:var(--hq-alarm);
  --alarm-deep:var(--hq-alarm);
  --alarm-soft:var(--hq-alarm-soft);
  --alarm-line:var(--hq-line-2);

  --plum:var(--hq-brand-2);
  --plum-soft:var(--hq-brand-soft);
  --plum-line:var(--hq-line-2);
  /* 二维码静区不参与深色桥接：白底是扫码识别率的硬要求（见 DESIGN-NOTES §7.5） */

  --shadow-1:var(--bevel-hq);
  --shadow-2:0 14px 30px -20px rgba(0,0,0,.8);
  --shadow-3:0 26px 54px -30px rgba(0,0,0,.9);
}

/* ============================================================================
   BASE —— 复位、显隐铁律、原生控件兜底
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box}
/* 铁律：组件的 display:flex/grid 会覆盖 UA 的 [hidden]{display:none}，必须显式声明 */
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0}
/* 原生控件兜底：不设色时 UA 黑字会压在深底上（实测可低至 1.21:1） */
button,select,input,textarea,output{color:inherit;font-family:inherit;font-size:inherit}
img,svg,canvas{max-width:100%}
a{color:var(--navy-2);text-decoration-thickness:1px;text-underline-offset:2px}
:focus-visible{outline:2px solid var(--navy-2);outline-offset:2px;border-radius:var(--r-xs)}
[data-theme="hq"] a,
.mode-hq a{color:var(--navy-2)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.skip-link{position:absolute;left:-9999px;top:0;z-index:var(--z-toast);
  background:var(--navy);color:var(--ink-inv);padding:var(--sp-3) var(--sp-4);border-radius:0 0 var(--r-sm) 0}
.skip-link:focus{left:0}