B-44: intercompany ledger events, subject review and drill-down evidence

- migration 6: manual_records, ledger_event_revisions chain, current
  projections, source claims, subject suggestions, eligible_position_events
- ledger_events.py: bank-event reconciliation, reversal/adjustment/reopen,
  append-only revision chain and rebuildable current projection
- subjects.py: fixed subject mirror, draft suggestion dictionary, explicit
  administrator subject confirmation with expected_revision + idempotency
- manual_records.py: submit, approve new/link, return/exception/reverse,
  candidate hints, idempotent replay and concurrency-safe claims
- positions.py: Decimal aggregation, both-perspective conservation asserts,
  cutoff window, unresolved gross buckets, keyset pagination, evidence
  visibility (visible/masked/missing)
- server.py: admin + company intercompany APIs with tenant isolation (404 on
  cross-tenant reads, 403 on company writes) and auto reconcile wiring
- admin/company portals: balance directory, pair drill-down drawer, evidence
  drawer, subject/manual audit queue, company balance summary
- tests: ledger events, subjects, manual records, positions, HTTP API and
  migration persistence (233 total, all green)

web/admin.html

@@ -22,7 +22,7 @@
         <div class="brand"><span class="brand-mark">金</span><span class="brand-copy"><strong>金牛集团</strong><small>总账管理端</small></span></div>
         <nav class="nav-list">
           <button class="nav-item is-active" data-view="dashboard"><svg><use href="icons.svg#layout-dashboard"/></svg><span>管理总览</span></button>
-          <button class="nav-item" data-view="pair"><svg><use href="icons.svg#arrow-left-right"/></svg><span>往来查询</span></button>
+          <button class="nav-item" data-view="pair"><svg><use href="icons.svg#arrow-left-right"/></svg><span>往来余额</span></button>
           <button class="nav-item" data-view="audit"><svg><use href="icons.svg#list-checks"/></svg><span>审核中心</span><b>6</b></button>
           <button class="nav-item" data-view="flows"><svg><use href="icons.svg#file-spreadsheet"/></svg><span>流水管理</span></button>
           <button class="nav-item" data-view="companies"><svg><use href="icons.svg#users"/></svg><span>公司与账号</span></button>
@@ -147,21 +147,21 @@
           </section>
 
           <section class="app-view" data-page="pair">
-            <header class="page-heading"><div><h1>往来查询</h1><p>按公司对查询双方口径、科目和逐笔凭证</p></div></header>
+            <header class="page-heading"><div><h1>往来余额</h1><p>公司间往来余额目录、公司对明细与逐层追溯</p></div>
+              <span class="status neutral" id="balanceOpeningNote">期初不可用 · 仅显示期间净变动</span>
+            </header>
             <section class="query-band">
-              <form class="pair-query-form" data-pair-form>
-                <label class="field"><span>本方公司</span><select name="from"><option>A公司</option><option>B公司</option><option>C公司</option><option>D公司</option><option>E公司</option><option>F公司</option></select></label>
-                <button class="swap-button" type="button" data-swap aria-label="交换公司" title="交换公司"><svg><use href="icons.svg#arrow-left-right"/></svg></button>
-                <label class="field"><span>对方公司</span><select name="to"><option>B公司</option><option>C公司</option><option>D公司</option><option>E公司</option><option>F公司</option><option>A公司</option></select></label>
-                <label class="field"><span>统计截止</span><input name="end" type="date" value="2026-07-31" /></label>
+              <form class="pair-query-form" data-balance-form>
+                <label class="field"><span>统计起始</span><input name="from" type="date" value="2026-01-01" /></label>
+                <label class="field"><span>统计截止</span><input name="cutoff" type="date" value="2026-07-31" /></label>
+                <label class="field"><span>币种</span><select name="currency"><option value="">全部币种</option><option value="CNY">CNY</option><option value="RMB">RMB</option></select></label>
                 <button class="button primary" type="submit"><svg><use href="icons.svg#search"/></svg>查询</button>
               </form>
             </section>
-            <section class="pair-report" id="pairReport">
-              <header class="pair-report-heading"><div><h2><span data-pair-from>A公司</span> 与 <span data-pair-to>B公司</span></h2><p id="pairPeriod">统计口径 2026.01.01—2026.07.31</p></div><span class="status warning" id="pairReviewStatus">含 1 笔待审核</span></header>
-              <div class="pair-balance-line"><div><span>期初余额</span><strong id="pairOpening">0.00</strong></div><div><span>本期借方</span><strong id="pairDebit">2,416.00</strong></div><div><span>本期贷方</span><strong id="pairCredit">1,136.00</strong></div><div class="pair-final"><span>期末结果</span><strong id="pairFinal">应收 1,280.00<small>万元</small></strong></div></div>
-              <div class="subject-strip"><button class="is-active" data-subject-filter="all" aria-pressed="true"><span>全部往来</span><strong data-subject-total="all">5 笔</strong></button><button data-subject-filter="应收" aria-pressed="false"><span>应收</span><strong data-subject-total="应收">1,280.00</strong></button><button data-subject-filter="其他应收" aria-pressed="false"><span>其他应收</span><strong data-subject-total="其他应收">640.00</strong></button><button data-subject-filter="应付" aria-pressed="false"><span>应付</span><strong data-subject-total="应付">728.00</strong></button><button data-subject-filter="其他应付" aria-pressed="false"><span>其他应付</span><strong data-subject-total="其他应付">408.00</strong></button></div>
-              <div class="table-scroll"><table class="data-table" id="pairTransactions"><thead><tr><th>交易日期</th><th>方向</th><th>科目</th><th>本方账户</th><th>对方账户</th><th>摘要</th><th>匹配</th><th class="number">金额（万元）</th></tr></thead><tbody><tr data-subject="应收"><td>2026.07.18</td><td>转出</td><td>应收</td><td>中信 · 5316</td><td>工行 · 9481</td><td>往来款</td><td><span class="status success">双边匹配</span></td><td class="number">1,000.00</td></tr><tr data-subject="应收"><td>2026.07.06</td><td>转入</td><td>应收</td><td>中信 · 5316</td><td>工行 · 9481</td><td>归还往来款</td><td><span class="status success">双边匹配</span></td><td class="number">−320.00</td></tr><tr data-subject="其他应收"><td>2026.06.27</td><td>转出</td><td>其他应收</td><td>建行 · 0845</td><td>工行 · 9481</td><td>资金调拨</td><td><span class="status warning">单边待核</span></td><td class="number">600.00</td></tr></tbody></table></div>
+            <section class="panel company-ledger-panel" aria-label="公司余额目录">
+              <div class="panel-heading"><div><h2>公司余额目录</h2><p>每行余额都附带截止日、期初状态、本期借贷、结果与未决金额</p></div></div>
+              <div class="ledger-head is-balances"><span>公司</span><span>借方合计</span><span>贷方合计</span><span>期末结果</span><span>未决</span><span>截止日</span><span></span></div>
+              <div id="companyLedgers" class="company-ledgers" aria-live="polite"></div>
             </section>
           </section>
 
@@ -230,6 +230,17 @@
         <footer><button type="button" class="button secondary" data-close-closing>取消</button><button class="button primary" type="submit">确认执行结账</button></footer>
       </form>
     </dialog>
+    <div class="drawer-scrim" id="drawerScrim" data-close-drawer aria-hidden="true"></div>
+    <aside class="drawer" id="evidenceDrawer" aria-label="往来明细与源行证据抽屉" aria-hidden="true">
+      <header class="drawer-header">
+        <div>
+          <div class="drawer-breadcrumb" id="drawerBreadcrumb"></div>
+          <h2 id="drawerTitle">往来明细</h2>
+        </div>
+        <button type="button" class="icon-button" data-close-drawer aria-label="关闭抽屉" title="关闭"><svg><use href="icons.svg#x"/></svg></button>
+      </header>
+      <div class="drawer-body" id="drawerBody" tabindex="-1"></div>
+    </aside>
     <div class="toast-region" id="toastRegion" aria-live="polite"></div>
     <script src="app.js"></script>
   </body>

web/company.html

@@ -26,7 +26,8 @@
           <button class="nav-item" data-view="upload"><svg><use href="icons.svg#upload"/></svg><span>流水导入</span></button>
           <button class="nav-item" data-view="manual"><svg><use href="icons.svg#plus"/></svg><span>手工记录</span></button>
           <button class="nav-item" data-view="flows"><svg><use href="icons.svg#file-spreadsheet"/></svg><span>流水管理</span></button>
-          <button class="nav-item" data-view="reconcile"><svg><use href="icons.svg#arrow-left-right"/></svg><span>往来确认</span><b>2</b></button>
+          <button class="nav-item" data-view="balances"><svg><use href="icons.svg#arrow-left-right"/></svg><span>往来余额</span></button>
+          <button class="nav-item" data-view="reconcile"><svg><use href="icons.svg#circle-check"/></svg><span>往来确认</span><b>2</b></button>
           <button class="nav-item" data-view="accounts"><svg><use href="icons.svg#landmark"/></svg><span>银行账户</span></button>
           <button class="nav-item" data-view="notifications"><svg><use href="icons.svg#bell"/></svg><span>通知</span><b>2</b></button>
         </nav>
@@ -140,7 +141,7 @@
                 <div class="form-body">
                   <div class="form-grid"><label class="field"><span>交易日期</span><input name="transactionDate" type="date" value="2026-08-06" required /></label><label class="field"><span>收付方向</span><select name="direction" required><option>付款</option><option>收款</option></select></label></div>
                   <div class="form-grid"><label class="field"><span>金额（元）</span><input name="amount" type="number" min="0.01" step="0.01" required /></label><label class="field"><span>资金来源</span><select name="sourceAccount" required><option value="">请选择</option><option>个人过账</option></select></label></div>
-                  <div class="form-grid"><label class="field"><span>对方类型</span><select name="counterpartyType" required><option>集团内部公司</option><option>个人过账方</option><option>外部单位</option></select></label><label class="field"><span>对方名称</span><input name="counterparty" maxlength="100" placeholder="公司全称或个人姓名" required /></label></div>
+                  <div class="form-grid"><label class="field"><span>对方类型</span><select name="counterpartyType" required><option>集团内部公司</option><option>个人过账方</option><option>外部单位</option></select></label><label class="field"><span>对方公司</span><select name="counterparty" required><option value="">请选择集团内部公司</option></select></label></div>
                   <div class="form-grid"><label class="field"><span>对方账号</span><input name="counterpartyAccount" maxlength="64" placeholder="可选" /></label><label class="field"><span>往来科目</span><select name="subject" required><option>应收</option><option>应付</option><option>其他应收</option><option>其他应付</option></select></label></div>
                   <label class="field"><span>业务摘要</span><input name="summary" maxlength="120" placeholder="例如：个人代付后转回" required /></label>
                   <label class="field"><span>补充说明</span><textarea name="remark" rows="3" maxlength="500" placeholder="说明形成原因和核对依据" required></textarea></label>
@@ -162,6 +163,25 @@
             <section class="panel"><div class="table-summary"><span>当前结果 <strong id="flowCount">3</strong> 笔</span><span>金额单位：元</span></div><div class="table-scroll"><table class="data-table" id="flowTable"><thead><tr><th>日期</th><th>银行账户</th><th>方向</th><th>对方户名 / 账号</th><th>摘要</th><th>银行流水号</th><th>归集状态</th><th class="number">金额</th></tr></thead><tbody><tr data-bank="中信银行"><td>2026.07.18</td><td>中信银行 · 5316</td><td>转出</td><td><strong>B公司</strong><small>尾号 9481</small></td><td>往来款</td><td>CIT260718018</td><td><span class="status success">双边匹配</span></td><td class="number">10,000,000.00</td></tr><tr data-bank="建设银行"><td>2026.07.12</td><td>建设银行 · 0845</td><td>转出</td><td><strong>A公司</strong><small>尾号 5316</small></td><td>同名账户调拨</td><td>CCB260712031</td><td><span class="status neutral">同公司调拨</span></td><td class="number">2,000,000.00</td></tr><tr data-bank="中信银行"><td>2026.07.06</td><td>中信银行 · 5316</td><td>转入</td><td><strong>B公司</strong><small>尾号 9481</small></td><td>归还往来款</td><td>CIT260706041</td><td><span class="status success">双边匹配</span></td><td class="number">3,200,000.00</td></tr></tbody></table></div></section>
           </section>
 
+          <section class="app-view" data-page="balances">
+            <header class="page-heading"><div><h1>往来余额</h1><p>本公司往来余额、对方公司明细与允许查看的源证据</p></div>
+              <span class="status neutral" id="companyOpeningNote">期初不可用 · 仅显示期间净变动</span>
+            </header>
+            <div class="company-alert balance-alert" id="companyUnresolvedAlert" hidden>
+              <svg><use href="icons.svg#circle-alert"/></svg>
+              <div><strong id="companyUnresolvedText"></strong><p>未确认事项不影响已确认余额，处理前请先核对证据。</p></div>
+              <button class="button secondary" data-view-link="reconcile">去确认</button>
+            </div>
+            <section class="pair-report" id="companyBalanceSummary">
+              <header class="pair-report-heading"><div><h2>本公司往来汇总</h2><p id="companyBalancePeriod">统计口径</p></div></header>
+              <div class="pair-balance-line is-six" id="companyBalanceLine"></div>
+            </section>
+            <section class="panel company-stack-panel">
+              <div class="panel-heading"><div><h2>对方公司明细</h2><p>点击任意对方公司查看往来事件与允许的源证据</p></div></div>
+              <div class="company-list" id="companyCounterparties" aria-live="polite"></div>
+            </section>
+          </section>
+
           <section class="app-view" data-page="reconcile">
             <header class="page-heading"><div><h1>往来确认</h1><p>系统计算为主，只处理无法确定的匹配与科目</p></div></header>
             <section class="reconcile-summary"><div><span>自动确认</span><strong>18 笔</strong><small>无需人工处理</small></div><div><span>单边待匹配</span><strong id="matchPendingCount">1 笔</strong><small>需选择对方证据</small></div><div><span>科目待确认</span><strong id="subjectPendingCount">1 笔</strong><small>需选择会计科目</small></div></section>
@@ -195,6 +215,17 @@
         <footer><button type="button" class="button secondary" data-close-account>取消</button><button class="button primary" type="submit">提交登记</button></footer>
       </form>
     </dialog>
+    <div class="drawer-scrim" id="drawerScrim" data-close-drawer aria-hidden="true"></div>
+    <aside class="drawer" id="evidenceDrawer" aria-label="往来明细与源行证据抽屉" aria-hidden="true">
+      <header class="drawer-header">
+        <div>
+          <div class="drawer-breadcrumb" id="drawerBreadcrumb"></div>
+          <h2 id="drawerTitle">往来明细</h2>
+        </div>
+        <button type="button" class="icon-button" data-close-drawer aria-label="关闭抽屉" title="关闭"><svg><use href="icons.svg#x"/></svg></button>
+      </header>
+      <div class="drawer-body" id="drawerBody" tabindex="-1"></div>
+    </aside>
     <div class="toast-region" id="toastRegion" aria-live="polite"></div>
     <script src="app.js"></script>
   </body>

web/styles.css

@@ -26,6 +26,8 @@
   --color-danger-wash: rgba(255, 98, 109, 0.11);
   --color-info: #66a8ff;
   --color-info-wash: rgba(102, 168, 255, 0.11);
+  --row-h-evidence: 55px;
+  --z-drawer: 150;
   --radius-sm: 10px;
   --radius-md: 16px;
   --radius-lg: 22px;
@@ -736,3 +738,102 @@ body::before { content: ""; position: fixed; inset: 0; z-index: 0; pointer-event
 @media (prefers-reduced-motion: reduce) {
   *, *::before, *::after { scroll-behavior: auto !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
 }
+
+/* ---- B-44 intercompany balances (design tokens only, no overrides) ---- */
+.status.info { border-color: rgba(102, 168, 255, 0.18); background: var(--color-info-wash); color: var(--color-info); }
+.amount-neutral { color: var(--color-ink-muted); }
+
+/* Balance directory: 公司 | 借方 | 贷方 | 期末结果 | 未决 | 截止日 | ▸ */
+.ledger-head.is-balances, .company-ledger.is-balances summary {
+  grid-template-columns: minmax(180px, 1.3fr) minmax(100px, 0.7fr) minmax(100px, 0.7fr) minmax(150px, 0.9fr) minmax(110px, 0.7fr) minmax(96px, 0.55fr) 24px;
+}
+.company-ledger.is-balances summary { min-height: 72px; }
+.company-ledger.is-balances summary .ledger-cutoff { color: var(--color-ink-muted); font-size: 11px; white-space: nowrap; }
+.company-ledger.is-balances .ledger-result { display: flex; align-items: center; gap: 7px; min-width: 0; }
+.company-ledger.is-balances .ledger-result b { font: 600 14px var(--font-data); font-variant-numeric: tabular-nums; white-space: nowrap; }
+.company-ledger.is-balances .ledger-unresolved { font-size: 11px; white-space: nowrap; }
+.company-ledger.is-balances .ledger-unresolved.is-empty { color: var(--color-ink-muted); }
+.company-ledger.is-balances .ledger-unresolved.is-active { color: var(--color-warning); }
+.company-ledger.is-balances .currency-tag { color: var(--color-ink-muted); font-size: 10px; }
+.company-ledger.is-balances .subject-row small { white-space: nowrap; }
+@media (max-width: 900px) {
+  .ledger-head.is-balances, .company-ledger.is-balances summary { grid-template-columns: minmax(150px, 1fr) minmax(150px, 0.9fr) minmax(110px, 0.7fr) 24px; }
+  .company-ledger.is-balances summary .ledger-hide-sm { display: none; }
+}
+
+/* Pair report six-cell balance line: 期初 | 本期借 | 本期贷 | 期末 | 未决 | 截止日 */
+.pair-balance-line.is-six { grid-template-columns: repeat(6, 1fr); }
+.pair-balance-line.is-six .pair-final { grid-column: auto; border-left: 1px solid var(--color-line); }
+.pair-balance-line .pair-open-note { color: var(--color-ink-muted); font-size: 10px; margin-top: 3px; }
+.pair-balance-line .pair-unresolved b { color: var(--color-warning); }
+.pair-balance-line .pair-unresolved.is-empty b { color: var(--color-ink); }
+.pair-balance-line .pair-cutoff { color: var(--color-ink-muted); font-size: 10px; margin-top: 3px; }
+@media (max-width: 1180px) {
+  .pair-balance-line.is-six { grid-template-columns: repeat(3, 1fr); }
+  .pair-balance-line.is-six div:nth-child(4) { border-top: 1px solid var(--color-line); border-left: 0; }
+  .pair-balance-line.is-six div:nth-child(5), .pair-balance-line.is-six div:nth-child(6) { border-top: 1px solid var(--color-line); }
+}
+@media (max-width: 720px) {
+  .pair-balance-line.is-six { grid-template-columns: 1fr 1fr; }
+}
+
+/* Evidence drawer (single instance, single-layer replacement) */
+.drawer-scrim { position: fixed; inset: 0; z-index: calc(var(--z-drawer) - 1); background: rgba(5, 5, 5, 0.6); opacity: 0; pointer-events: none; transition: opacity var(--duration-standard) var(--ease-out); }
+.drawer-scrim.is-open { opacity: 1; pointer-events: auto; }
+.drawer { position: fixed; top: 0; right: 0; bottom: 0; z-index: var(--z-drawer); width: 640px; max-width: 100%; display: flex; flex-direction: column; background: rgba(17, 17, 17, 0.96); border-left: 1px solid var(--color-line-strong); box-shadow: var(--shadow-panel); transform: translateX(24px); opacity: 0; visibility: hidden; transition: transform var(--duration-standard) var(--ease-out), opacity var(--duration-standard) var(--ease-out), visibility 0s linear var(--duration-standard); }
+.drawer.is-open { transform: translateX(0); opacity: 1; visibility: visible; transition-delay: 0s; }
+@media (min-width: 1024px) and (max-width: 1180px) { .drawer { width: 480px; } }
+@media (max-width: 768px) { .drawer { width: 100%; } }
+.drawer-header { min-height: 74px; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 16px 18px; border-bottom: 1px solid var(--color-line); }
+.drawer-header .drawer-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; color: var(--color-ink-muted); font-size: 11px; }
+.drawer-header .drawer-breadcrumb button { border: 0; padding: 0; background: none; color: var(--color-info); cursor: pointer; font-size: 11px; }
+.drawer-header .drawer-breadcrumb button:hover { text-decoration: underline; }
+.drawer-header h2 { margin-top: 6px; font-size: 17px; }
+.drawer-body { flex: 1; overflow: auto; padding: 16px 18px 24px; contain: layout paint; }
+.drawer .pair-balance-line { border: 1px solid var(--color-line); border-bottom: 1px solid var(--color-line); border-radius: var(--radius-md); overflow: hidden; margin-bottom: 16px; }
+.drawer .pair-balance-line div { min-height: 64px; }
+.drawer .event-table { min-width: 640px; }
+.drawer .event-table td { height: var(--row-h-evidence); }
+.drawer .event-row { cursor: pointer; }
+.drawer .event-row:focus-visible { outline: 2px solid var(--color-primary-strong); outline-offset: -2px; }
+.drawer .evidence-stack { display: flex; flex-direction: column; gap: 10px; }
+.drawer .evidence-midline { display: flex; align-items: center; gap: 10px; color: var(--color-ink-muted); font-size: 11px; }
+.drawer .evidence-midline::before, .drawer .evidence-midline::after { content: ""; flex: 1; height: 1px; background: var(--color-line); }
+.evidence-block.is-missing { border-color: rgba(102, 168, 255, 0.28); background: var(--color-info-wash); }
+.evidence-block .evidence-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px 14px; margin-top: 10px; }
+.evidence-block .evidence-grid div { display: flex; flex-direction: column; min-width: 0; }
+.evidence-block .evidence-grid dt { color: var(--color-ink-muted); font-size: 10px; }
+.evidence-block .evidence-grid dd { color: var(--color-ink-soft); font-size: 12px; word-break: break-all; }
+.evidence-block .evidence-masked { color: var(--color-ink-muted); font-style: normal; }
+@media (max-width: 720px) { .evidence-block .evidence-grid { grid-template-columns: 1fr; } }
+
+/* Loading skeletons */
+.skeleton-row { height: var(--row-h-evidence); display: flex; align-items: center; gap: 12px; padding: 0 14px; border-bottom: 1px solid var(--color-line); }
+.skeleton-row span { height: 12px; border-radius: 6px; background: rgba(255, 255, 255, 0.06); }
+.skeleton-row span:nth-child(1) { width: 22%; } .skeleton-row span:nth-child(2) { width: 14%; }
+.skeleton-row span:nth-child(3) { width: 14%; } .skeleton-row span:nth-child(4) { width: 18%; }
+.skeleton-row span:nth-child(5) { width: 12%; }
+.skeleton-block { animation: skeleton-breathe 1200ms ease-in-out infinite; }
+
+/* Empty / error / no-permission states */
+.state-panel { display: flex; flex-direction: column; align-items: center; gap: 10px; justify-content: center; min-height: 240px; padding: 28px 18px; text-align: center; color: var(--color-ink-muted); }
+.state-panel .state-icon { width: 40px; height: 40px; color: var(--color-ink-muted); opacity: 0.7; }
+.state-panel strong { color: var(--color-ink-soft); font-size: 14px; }
+.state-panel p { max-width: 420px; font-size: 12px; }
+.state-panel .button { margin-top: 6px; }
+.state-panel.is-error { border: 1px solid rgba(255, 98, 109, 0.3); border-radius: var(--radius-lg); background: var(--color-danger-wash); }
+.state-panel.is-error strong { color: var(--color-danger); }
+.state-panel.is-denied { border: 1px solid var(--color-line); border-radius: var(--radius-lg); background: var(--color-surface); }
+
+/* Company portal alert variant + direction chips */
+.balance-alert { border-color: rgba(255, 188, 82, 0.24); background: var(--color-warning-wash); }
+.balance-alert > svg { color: var(--color-warning); }
+.balance-alert .button { color: var(--color-warning); }
+.company-row .result-direction { font-weight: 600; font-variant-numeric: tabular-nums; }
+.subject-strip button { white-space: nowrap; }
+
+/* Direction chips: text-first, arrows as affordance, never color-only */
+.direction-chip { display: inline-flex; align-items: center; gap: 4px; min-height: 23px; padding: 2px 8px; border-radius: 8px; border: 1px solid var(--color-line); background: rgba(255, 255, 255, 0.045); color: var(--color-ink-soft); font-size: 10px; white-space: nowrap; }
+
+@keyframes skeleton-breathe { 0%, 100% { opacity: 0.55; } 50% { opacity: 1; } }
+@media (prefers-reduced-motion: reduce) { .skeleton-block { animation: none; } }