@charset "UTF-8";
/* ============================================================================
   《基础会计》数字教材 · 阅读版式与环境层 v1.0
   依赖 tokens.css + components.css。本文件不得出现硬编码色值。
   ----------------------------------------------------------------------------
   内容：
     A 页面骨架（顶部工具栏 / 左栏章节 / 主栏 / 右栏阅读仪表）
     B 账簿纸环境层（账簿横线 + 页边朱红竖线 + 装订孔，纯 CSS）
     C 正文栅格与节奏（窄正文 / 宽数据组件的版式策略）
     D 阅读器附件（进度条、检索面板、快捷导航、回到顶部）
     E 五档响应式（1440 / 1280 / 1024 / 768 / 390）
     F 深色阅读模式（令牌桥接，组件零改动）
     G 打印样式
     H 无障碍与动效降级
   ========================================================================== */

/* ==========================================================================
   A · 页面骨架
   ========================================================================== */
.dtb-body{background:var(--paper);color:var(--ink);font-family:var(--serif);
  font-size:var(--step0);line-height:var(--lh-body);letter-spacing:var(--tracking-cjk);
  -webkit-font-smoothing:antialiased;overflow-x:clip;min-height:100vh}
.dtb-topbar{position:sticky;top:0;z-index:var(--z-topbar);
  background:var(--paper-2);border-bottom:var(--hair) solid var(--rule-strong);
  box-shadow:var(--shadow-1)}
.tb-inner{max-width:var(--shell-max);margin:0 auto;padding:0 var(--gutter);
  min-height:var(--topbar-h);display:flex;align-items:center;gap:var(--sp-3) var(--sp-5);flex-wrap:wrap}
.tb-brand{display:inline-flex;align-items:center;gap:var(--sp-2);text-decoration:none;
  color:var(--navy);font-family:var(--sans);font-weight:700;font-size:var(--step0);white-space:nowrap}
.tb-mark{width:24px;height:24px;flex:0 0 auto;border:var(--hair) solid var(--navy);
  border-radius:var(--r-xs);display:grid;place-items:center;background:var(--paper-3);padding:2px}
.tb-mark svg{width:18px;height:18px;display:block}
.tb-brand:hover .tb-mark{background:var(--navy)}
.tb-brand:hover .tb-mark .fs-ink{stroke:var(--paper-3)}
.tb-brand:hover .tb-mark .fs-brass{stroke:var(--brass-leaf-2)}
.tb-chapter{font-family:var(--sans);font-size:var(--step-1);color:var(--ink-2);
  padding-left:var(--sp-4);border-left:var(--hair) solid var(--rule-strong);white-space:normal;
  overflow-wrap:anywhere;max-width:100%}
.tb-tools{margin-left:auto;display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap}
.tb-btn{display:inline-flex;align-items:center;gap:var(--sp-1);font-family:var(--sans);
  font-size:var(--step-1);font-weight:600;color:var(--ink);background:var(--paper-3);
  border:var(--hair) solid var(--rule-strong);border-radius:var(--r-sm);padding:4px 10px;
  cursor:pointer;white-space:nowrap;
  transition:background var(--dur-1) var(--ease),border-color var(--dur-1) var(--ease),
    color var(--dur-1) var(--ease)}
.tb-btn:hover{background:var(--navy-soft);border-color:var(--navy-line);color:var(--navy)}
.tb-btn[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:var(--ink-inv)}
.tb-btn .kbd{font-family:var(--num);font-size:var(--step-1);color:var(--ink-2)}
.tb-progress-text{font-family:var(--num);font-size:var(--step-1);color:var(--ink-2);
  min-width:3.2em;text-align:right}
.tb-progress{height:3px;background:var(--paper-4);position:relative;overflow:hidden} /* allow-overflow: 进度条裁切，非卡片 */
.tb-progress i{display:block;height:100%;width:0;
  background:linear-gradient(90deg,var(--brass) 0%,var(--navy-2) 100%);
  transition:width var(--dur-2) var(--ease)}

.dtb-shell{position:relative;z-index:var(--z-base);max-width:var(--shell-max);margin:0 auto;
  padding:0 var(--gutter) var(--sp-9);display:grid;gap:calc(var(--gutter) + 8px);
  grid-template-columns:minmax(0,1fr);align-items:start}

/* 左栏 · 本篇章节目录 */
.dtb-sidebar{font-family:var(--sans);min-width:0}
.dtb-sidebar>summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:var(--sp-2);
  font-size:var(--step0);font-weight:700;color:var(--navy);padding:var(--sp-3) var(--sp-4);
  background:var(--paper-3);border:var(--hair) solid var(--rule);border-radius:var(--r-sm)}
.dtb-sidebar>summary::-webkit-details-marker{display:none}
.dtb-sidebar>summary::after{content:"▾";margin-left:auto;color:var(--ink-2)}
.dtb-sidebar[open]>summary::after{content:"▴"}
.sb-body{padding:var(--sp-4) 0 0}
.sb-kicker{margin:0 0 var(--sp-3);font-family:var(--num);font-size:var(--step-1);
  font-weight:700;letter-spacing:var(--tracking-caps);color:var(--brass-deep)}
.sb-chapter{margin:0 0 var(--sp-4);padding-bottom:var(--sp-3);
  border-bottom:var(--hair) solid var(--rule);font-size:var(--step0);font-weight:700;
  line-height:1.5;color:var(--navy)}
.sb-chapter .sb-no{display:block;font-family:var(--num);font-size:var(--step-1);
  color:var(--ink-2);font-weight:400;letter-spacing:.08em;margin-bottom:2px}
.sb-list{margin:0;padding:0;list-style:none;display:grid;gap:1px;
  border-left:var(--hair) solid var(--rule)}
.sb-list a{display:block;padding:6px var(--sp-3);font-size:var(--step-1);line-height:1.6;
  color:var(--ink);text-decoration:none;border-left:var(--bw-edge) solid transparent;
  margin-left:-1px;overflow-wrap:anywhere;
  transition:background var(--dur-1) var(--ease),border-color var(--dur-1) var(--ease)}
.sb-list a .sb-n{font-family:var(--num);color:var(--ink-2);margin-right:var(--sp-2)}
.sb-list a:hover{background:var(--paper-2);border-left-color:var(--navy-line)}
.sb-list a[aria-current="true"]{background:var(--navy-soft);border-left-color:var(--brass);
  font-weight:700;color:var(--navy)}
.sb-sub{margin:0;padding:0 0 var(--sp-2) 0;list-style:none}
.sb-sub a{padding-left:var(--sp-6);font-size:var(--step-1);color:var(--ink-2)}
.sb-links{margin:var(--sp-5) 0 0;padding-top:var(--sp-4);border-top:var(--hair) solid var(--rule);
  display:grid;gap:var(--sp-2)}
.sb-links a{font-size:var(--step-1);color:var(--ink-2);text-decoration:none;
  display:flex;align-items:center;gap:var(--sp-2)}
.sb-links a:hover{color:var(--navy)}
.sb-chapnav{margin:0;padding:0;list-style:none;display:grid;gap:var(--sp-2)}
.sb-chapnav li{min-width:0}
.sb-chapnav a{display:block;font-size:var(--step-1);line-height:1.5;color:var(--ink-2);
  text-decoration:none;overflow-wrap:anywhere}
.sb-chapnav a:hover{color:var(--navy)}
.sb-chapnav a[aria-current="page"]{color:var(--navy);font-weight:700}

/* 主栏 */
.dtb-main{min-width:0}
.dtb-main-inner{position:relative;max-width:var(--wide);margin:0 auto}
.dtb-flow{display:block;min-width:0}
.dtb-flow>*{max-width:var(--measure)}
.dtb-flow>:is(.ch-opener,.tbl-wrap,.entry-card,.stmt,.kmap-figure,.fx4d-block,.flow,.tabs,
  .metrics,.glossary,.reading-list,.quiz-set,.case-card,.dtb-foot,.pager,.path,.legend-grid,
  .res-group,.ch-4d){max-width:none}

/* 右栏 · 阅读仪表 */
.dtb-rail{font-family:var(--sans);min-width:0;display:none}
.rail-inner{position:sticky;top:calc(var(--topbar-h) + var(--sp-5));
  background:var(--paper-3);border:var(--hair) solid var(--rule);border-radius:var(--r-sm);
  padding:var(--sp-4);box-shadow:var(--shadow-1)}
.rail-k{margin:0 0 var(--sp-3);font-family:var(--num);font-size:var(--step-1);font-weight:700;
  letter-spacing:var(--tracking-caps);color:var(--brass-deep)}
.rail-dial{position:relative;width:96px;height:96px;margin:0 auto var(--sp-4)}
.rail-ring{width:96px;height:96px;transform:rotate(-90deg)}
.rail-ring .ring-bg{fill:none;stroke:var(--paper-4);stroke-width:3}
.rail-ring .ring-fg{fill:none;stroke:var(--navy-2);stroke-width:3;stroke-linecap:round;
  stroke-dasharray:0 100;transition:stroke-dasharray var(--dur-3) var(--ease)}
.rail-num{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--num);
  font-size:var(--step2);font-weight:700;color:var(--navy)}
.rail-stats{margin:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--sp-2) var(--sp-3);
  font-size:var(--step-1);line-height:1.6}
.rail-stats dt{color:var(--ink-2);white-space:nowrap}
.rail-stats dd{margin:0;color:var(--ink);text-align:right;overflow-wrap:anywhere}
.rail-ticks{margin-top:var(--sp-4);padding-top:var(--sp-3);border-top:var(--hair) dashed var(--rule-strong);
  display:grid;gap:3px;grid-template-columns:repeat(13,minmax(0,1fr));height:22px;
  align-items:stretch}
.rail-ticks i{background:var(--paper-4);border-radius:1px}
.rail-ticks i.on{background:var(--brass)}
.rail-tip{margin:var(--sp-4) 0 0;padding-top:var(--sp-3);border-top:var(--hair) dashed var(--rule-strong);
  font-size:var(--step-1);line-height:1.7;color:var(--ink-2)}

/* ==========================================================================
   B · 账簿纸环境层（纯 CSS：账簿横线 + 页边朱红竖线 + 装订孔）
   ========================================================================== */
.dtb-body::before{content:"";position:fixed;inset:0;z-index:var(--z-env);
  pointer-events:none;
  background-image:
    repeating-linear-gradient(to bottom,
      transparent 0 calc(var(--rhythm) * 6 - 1px),
      var(--env-rule-strong) calc(var(--rhythm) * 6 - 1px) calc(var(--rhythm) * 6)),
    repeating-linear-gradient(to bottom,
      transparent 0 calc(var(--rhythm) - 1px),
      var(--env-rule) calc(var(--rhythm) - 1px) var(--rhythm))}
/* 装订孔 + 朱红竖线：仅在主栏左侧页边（≥1024），绝不压正文 */
@media (min-width:1024px){
  .dtb-main-inner::before{content:"";position:absolute;top:0;bottom:0;
    left:calc(-0.55 * var(--gutter));width:var(--hair);background:var(--env-margin);opacity:.34}
  .dtb-main-inner::after{content:"";position:absolute;top:var(--sp-8);bottom:var(--sp-8);
    left:calc(-0.55 * var(--gutter) - 14px);width:28px;pointer-events:none;
    background-image:radial-gradient(circle at 14px 14px,
      var(--env-hole) 0 3px,var(--env-hole-in) 3px 3.8px,transparent 3.9px);
    background-size:28px 210px;background-repeat:repeat-y}
}

/* ==========================================================================
   C · 正文栅格与节奏
   ========================================================================== */
.dtb-flow .sec:first-of-type .sec-head{margin-top:0}
.dtb-flow .h3:first-child,.dtb-flow .h4:first-child,.dtb-flow p:first-child{margin-top:0}
.sec-body{display:block}
.ch-end{margin-top:var(--sp-8);padding-top:var(--sp-6);
  border-top:var(--bw-rule) double var(--rule-strong)}
.wide-only{display:none}

/* ==========================================================================
   D · 阅读器附件
   ========================================================================== */
.dtb-palette{position:fixed;inset:0;z-index:var(--z-palette);display:grid;place-items:start center;
  padding:clamp(20px,8vh,120px) var(--gutter) var(--sp-6);
  background:var(--cover-bg-3);background-color:var(--cover-bg-3)}
.dtb-palette[hidden]{display:none!important}
.pal-panel{width:min(640px,100%);background:var(--paper-3);border:var(--hair) solid var(--rule-strong);
  border-radius:var(--r);box-shadow:var(--shadow-3);overflow:visible;
  font-family:var(--sans);color:var(--ink)}
.pal-head{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);
  border-bottom:var(--hair) solid var(--rule)}
.pal-head input{flex:1;min-width:0;font-family:var(--sans);font-size:var(--step1);
  background:var(--paper);color:var(--ink);border:var(--hair) solid var(--rule-strong);
  border-radius:var(--r-sm);padding:8px 12px}
.pal-head input::placeholder{color:var(--ink-3-strong)}
.pal-close{background:transparent;border:var(--hair) solid var(--rule-strong);border-radius:var(--r-sm);
  color:var(--ink-2);font-size:var(--step-1);padding:5px 10px;cursor:pointer}
.pal-close:hover{background:var(--paper-2);color:var(--navy)}
.pal-hint{margin:0;padding:var(--sp-2) var(--sp-4);font-size:var(--step-1);color:var(--ink-2);
  background:var(--paper-2);border-bottom:var(--hair) solid var(--rule)}
.pal-hint .kbd{font-family:var(--num);border:var(--hair) solid var(--rule-strong);
  border-radius:var(--r-xs);padding:0 4px;background:var(--paper-3);color:var(--ink)}
.pal-results{margin:0;padding:var(--sp-2);list-style:none;max-height:min(52vh,420px);overflow-y:auto}
.pal-results li{margin:0}
.pal-results a{display:block;padding:var(--sp-3) var(--sp-3);border-radius:var(--r-sm);
  text-decoration:none;color:var(--ink)}
.pal-results a:hover,.pal-results a:focus-visible{background:var(--navy-soft)}
.pal-results .pr-ch{font-family:var(--num);font-size:var(--step-1);color:var(--brass-deep);
  margin-right:var(--sp-2)}
.pal-results .pr-t{font-size:var(--step0);font-weight:600;color:var(--navy)}
.pal-results .pr-s{display:block;margin-top:2px;font-size:var(--step-1);color:var(--ink-2);
  overflow-wrap:anywhere}
.pal-results .pr-hit{background:var(--brass-soft);border-radius:2px;padding:0 2px}
.pal-empty{margin:0;padding:var(--sp-5) var(--sp-4);font-size:var(--step0);color:var(--ink-2)}

.dtb-quicknav{position:fixed;right:clamp(10px,2vw,24px);bottom:clamp(10px,2vh,24px);
  z-index:var(--z-nav);display:flex;flex-direction:column;gap:var(--sp-2);align-items:flex-end}
.dtb-quicknav .qn-btn{display:inline-flex;align-items:center;gap:var(--sp-2);cursor:pointer;
  font-family:var(--sans);font-size:var(--step-1);font-weight:600;text-decoration:none;
  color:var(--ink);background:var(--paper-3);border:var(--hair) solid var(--rule-strong);
  border-radius:var(--r-pill);padding:6px 13px;box-shadow:var(--shadow-2);
  transition:background var(--dur-1) var(--ease),color var(--dur-1) var(--ease),
    border-color var(--dur-1) var(--ease)}
.dtb-quicknav .qn-btn:hover{background:var(--navy);border-color:var(--navy);color:var(--ink-inv)}

.dtb-toast{position:fixed;left:50%;bottom:var(--sp-7);transform:translateX(-50%);
  z-index:var(--z-toast);background:var(--navy);color:var(--ink-inv);font-family:var(--sans);
  font-size:var(--step-1);padding:var(--sp-2) var(--sp-5);border-radius:var(--r-pill);
  box-shadow:var(--shadow-3);opacity:0;pointer-events:none;
  transition:opacity var(--dur-2) var(--ease)}
.dtb-toast.on{opacity:1}

/* 章节头尾的"账页"题眉 */
.page-rule{display:flex;align-items:center;gap:var(--sp-3);margin:0 0 var(--sp-5);
  font-family:var(--num);font-size:var(--step-1);letter-spacing:var(--tracking-caps);
  color:var(--ink-2)}
.page-rule::before,.page-rule::after{content:"";height:var(--hair);background:var(--rule-strong);flex:1}

/* ==========================================================================
   E · 五档响应式
   ========================================================================== */
/* 390–767：单列；一切堆叠；分录卡改上下结构 */
@media (max-width:767px){
  :root{--measure:100%;--gutter:16px}
  .tb-chapter{display:none}
  .tb-btn .tb-label{display:none}
  .tb-inner{gap:var(--sp-2) var(--sp-3)}
  .goal-grid{grid-template-columns:minmax(0,1fr)}
  .ch-tour ol{grid-template-columns:minmax(0,1fr)}
  .glossary dl{grid-template-columns:minmax(0,1fr)}
  .pager{grid-template-columns:minmax(0,1fr)}
  .cover-inner,.backcover-inner{grid-template-columns:minmax(0,1fr)}
  .backcover-inner{grid-template-columns:minmax(0,1fr);grid-template-areas:"left" "right" "band" "foot"}
  .cover-foot{flex-direction:column;align-items:flex-start}
  .cover-stage{min-height:300px}
  .dtb-quicknav{display:none}
  .tb-progress-text{display:none}
}
/* 768–1023：单列（左栏章节转为顶部折叠目录） */
@media (max-width:1023px){
  .dtb-sidebar{order:-1}
  .sb-body{max-height:none}
}
@media (min-width:768px) and (max-width:1023px){
  .goal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ch-tour ol{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* 1024–1439：两栏（左栏 + 主栏），右栏阅读仪表隐藏 */
@media (min-width:1024px){
  .dtb-sidebar>summary{display:none}
  .sb-body{display:block!important}
  .dtb-sidebar{position:sticky;top:calc(var(--topbar-h) + var(--sp-4));
    max-height:calc(100vh - var(--topbar-h) - var(--sp-8));overflow-y:auto;
    padding-right:var(--sp-2)}
  .dtb-sidebar::-webkit-scrollbar{width:6px}
  .dtb-sidebar::-webkit-scrollbar-thumb{background:var(--rule-strong);border-radius:var(--r-pill)}
}
@media (min-width:1024px) and (max-width:1439px){
  :root{--side-w:14rem}
  .dtb-shell{grid-template-columns:var(--side-w) minmax(0,1fr)}
}
/* ≥1440：三栏（左栏 + 主栏 + 阅读仪表） */
@media (min-width:1440px){
  .dtb-shell{grid-template-columns:var(--side-w) minmax(0,1fr) var(--rail-w)}
  .dtb-rail{display:block}
}
/* 窄屏分录卡：上下两组，合计校验保留 */
@media (max-width:640px){
  table.entry-table{min-width:0}
  table.entry-table thead{display:none}
  table.entry-table,table.entry-table tbody,table.entry-table tr,table.entry-table td{display:block}
  table.entry-table tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
    gap:2px var(--sp-4);padding:var(--sp-3) 0;border-bottom:var(--hair) solid var(--rule)}
  table.entry-table td{border:0;padding:2px 0}
  table.entry-table td.summary,table.entry-table td.subject{grid-column:1/-1;width:auto}
  table.entry-table td.d,table.entry-table td.c{text-align:right}
  table.entry-table td.d::before,table.entry-table td.c::before{content:attr(data-label);
    display:block;font-family:var(--sans);font-size:var(--step-1);color:var(--ink-2);text-align:left}
  table.entry-table tr.total{border-top:var(--bw-rule) double var(--rule-strong)}
  table.entry-table tr.total td{border-top:0}
  table.entry-table tr.total td.label{grid-column:1/-1;text-align:left}
  .flow-step::after{display:none}
  .tf-opts{display:grid;grid-template-columns:minmax(0,1fr)}
  .cover-plate{padding:var(--sp-5) var(--sp-4)}
  .cover-title{letter-spacing:.04em}
}

/* ==========================================================================
   F · 深色阅读模式（令牌桥接；组件代码零改动）
   ========================================================================== */
[data-theme="hq"] .dtb-body,
[data-theme="hq"].dtb-body{background:var(--paper);color:var(--ink)}
[data-theme="hq"] .dtb-topbar{background:var(--paper-2);box-shadow:none;
  border-bottom-color:var(--rule)}
[data-theme="hq"] .dtb-body::before{opacity:.5}
[data-theme="hq"] .dtb-foot{border-top-color:var(--rule-strong)}
[data-theme="hq"] .dtb-quicknav .qn-btn{background:var(--paper-3);color:var(--ink)}
[data-theme="hq"] .dtb-quicknav .qn-btn:hover{background:var(--navy);color:var(--paper)}
[data-theme="hq"] .ch-no{text-shadow:none}
[data-theme="hq"] .tb-btn:hover{background:var(--navy-soft);color:var(--navy)}

/* ==========================================================================
   G · 打印样式（A4 公文边距量级；组件不跨页断裂）
   ========================================================================== */
@media print{
  @page{size:A4;margin:18mm 16mm 16mm}
  html,body{background:var(--paper)!important;color:var(--ink)!important}
  .dtb-body{font-size:11.5pt;line-height:1.75}
  .dtb-topbar,.dtb-sidebar,.dtb-rail,.dtb-quicknav,.dtb-palette,.dtb-toast,
  .skip-link,.tb-tools,.cover-scroll{display:none!important}
  .dtb-shell{display:block;max-width:none;padding:0;gap:0}
  .dtb-main-inner{max-width:none}
  .dtb-main-inner::before,.dtb-main-inner::after{display:none}
  .dtb-body::before{position:static;display:none}
  .dtb-flow>*{max-width:none!important}
  .dtb-foot{border-top:var(--hair) solid var(--rule-strong)}
  .sec{margin-bottom:var(--sp-7)}
  .h3,.h4,.sec-title,.ch-title{break-after:avoid;page-break-after:avoid}
  .def,.callout,.entry-card,.stmt,.tbl-wrap,.quiz,.kmap-figure,.case-card,.standard,
  .term-card,.reading-list,.fx4d-block,.metrics,.flow-step{break-inside:avoid;page-break-inside:avoid}
  .pager{display:none}
  details{display:block}
  details>summary{display:block}
  details::details-content{content-visibility:visible;display:block;block-size:auto}
  .standard>summary::after,.key>summary::after{content:""!important}
  .fx4d-stage{min-height:0;background:var(--paper-2)}
  .fx4d,.fx4d-canvas{display:none}
  .cover,.backcover{min-height:0;break-after:page;-webkit-print-color-adjust:exact;
    print-color-adjust:exact}
  .cover-inner,.backcover-inner{min-height:0}
  .cover-stage{min-height:240px}
  .tb-progress{display:none}
  a{text-decoration:none;color:var(--ink)}
  a[data-ext]::after{content:" (" attr(href) ")";font-size:var(--step-1);color:var(--ink-2)}
}

/* ==========================================================================
   H · 无障碍与动效降级
   ========================================================================== */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
  .tb-progress i{transition:none}
  .opt{transition:none}
}
@media (prefers-contrast: more){
  .dtb-body::before{display:none}
  .tb-btn,.pal-head input{border-width:2px}
}
html{scroll-behavior:smooth}