/* Edge Autopsy / 邊際解剖 — 印刷品 × 金融終端
   判準：這一頁印在紙上還成立嗎。層級靠字級、留白與線條，不靠框與陰影。
   數字一律等寬 + tabular-nums。 */

/* 數字用的等寬字自架（latin 子集，29 KB）。中文與其餘字族走系統堆疊 ——
   ponytail: 中文 webfont 分片動輒 150 KB+，而本站中文用系統的 Noto Serif TC 已經對了。 */
@font-face{font-family:"IBM Plex Mono";src:url(/f/ibmplexmono-400.woff2)format("woff2");
  font-weight:400;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Mono";src:url(/f/ibmplexmono-500.woff2)format("woff2");
  font-weight:500;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ── tokens：儀器暗色是預設，亮色是「把儀器搬到日光下」 ────── */
:root{
  --paper:#0c0f13; --paper-2:#141920; --grid:#1c232c;
  --ink:#dfe6ee; --ink-2:#98a3b1;
  --rule:#2a323d; --rule-2:#3b4654;
  --accent:#6ee7a8;            /* 跡線主色（螢光綠）＝ 強調色 */
  --trace-2:#f2b45c;           /* 第二組跡線（琥珀） */
  --thresh:#d4607f;            /* 門檻參考線 —— 與 --neg 分家，見下 */
  /* 🔴 --pos 與 --accent 是同一個綠，而且是刻意的，不要「順手修好」：
     強調色與獲利共用一個綠是輕微的混淆，而那個綠同時是跡線的識別色 ——
     拆它的風險大於它解決的問題。門檻線那組（--thresh / --neg）就分家了，
     因為那組的衝突是真的：參考幾何 vs 值，同一個紅會讓參考線讀起來像警報。 */
  --pos:#6ee7a8; --neg:#e8674f; --eval:#a79ede;
  --glow:0 0 3px rgba(110,231,168,.45);

  /* ── 字級尺度：相鄰兩級至少差 15%，差不到的兩級讀者分不出來，只會讓版面變糊 ──
     🔴 用 rem 不用 px，讀者調大瀏覽器字級的時候整套要一起長。
     🔴 加新的一級之前先問：現有的哪一級不夠用？答不出來就用現有的。
        本站每頁的相異渲染字級上限是 10，而這裡有 12 級 —— 那個差額是給
        不同版型分著用的，不是給單一頁面堆的。閘門由 scripts/typecheck.mjs 量渲染後的值。 */
  --t0:.6875rem;   /* 11   */
  --t1:.8125rem;   /* 13   */
  --t2:1.0625rem;  /* 17  ← 正文的閱讀尺寸，整把尺以它為軸 */
  --t3:1.25rem;    /* 20   */
  --t4:1.46875rem; /* 23.5 */
  --t5:1.71875rem; /* 27.5 */
  --t6:2rem;       /* 32   */
  --t7:2.375rem;   /* 38   */
  --t8:2.8125rem;  /* 45   */
  --t9:3.375rem;   /* 54   */
  --t10:4rem;      /* 64   */
  --t11:5rem;      /* 80   */

  --font-prose:"Source Serif 4","Iowan Old Style","Palatino Linotype",Palatino,"Noto Serif TC","Source Han Serif TC",Georgia,serif;
  --font-ui:"Inter Tight","Segoe UI Variable Text","Segoe UI","Noto Sans TC","PingFang TC",system-ui,sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,"Cascadia Mono",Consolas,"Noto Sans Mono",monospace;

  --measure:34rem; --wide:52rem;
  --pad:clamp(1.1rem,5vw,2.5rem);
  color-scheme:dark light;
}
/* 亮色：同一台儀器在日光下 —— 跡線改深綠／深琥珀，網格更淡 */
@media (prefers-color-scheme:light){
  :root:not([data-theme="dark"]){
    --paper:#fbfaf7; --paper-2:#f2efe8; --grid:#e6e2d8;
    --ink:#1b1a17; --ink-2:#55524b;
    --rule:#ddd9cf; --rule-2:#c4bfb2;
    --accent:#1f6b46; --trace-2:#8a5a12; --thresh:#993355;
    --pos:#1f6b46; --neg:#a33a2a; --eval:#5b4fa8;
    --glow:none;
  }
}
:root[data-theme="light"]{
  --paper:#fbfaf7; --paper-2:#f2efe8; --grid:#e6e2d8;
  --ink:#1b1a17; --ink-2:#55524b;
  --rule:#ddd9cf; --rule-2:#c4bfb2;
  --accent:#1f6b46; --trace-2:#8a5a12; --thresh:#993355;
  --pos:#1f6b46; --neg:#a33a2a; --eval:#5b4fa8;
  --glow:none;
}

/* ── base ───────────────────────────────────────────────── */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font:400 var(--t2)/1.72 var(--font-prose);
  font-variant-numeric:tabular-nums;
  text-rendering:optimizeLegibility;
}
.wrap{max-width:var(--wide);margin:0 auto;padding-inline:var(--pad)}
.prose{max-width:var(--measure)}

/* 字級要有落差：h1 與中介資料之間 ≥ 4:1。h1 用襯線、中介資料用等寬，那個對比本身就是設計 */
h1{font-family:var(--font-prose);font-weight:600;
  font-size:var(--t10);line-height:1.08;letter-spacing:-.022em;
  margin:0 0 .8rem;text-wrap:balance}
h2{font-family:var(--font-ui);font-weight:600;
  font-size:var(--t5);line-height:1.2;letter-spacing:-.014em;
  margin:3.4rem 0 1.1rem;padding-top:1.2rem;border-top:1px solid var(--rule);position:relative}
h3{font-family:var(--font-ui);font-weight:600;font-size:var(--t2);line-height:1.25;margin:2.2rem 0 .5rem}
p{margin:0 0 1.15rem}
a{color:var(--accent);text-underline-offset:.18em;text-decoration-thickness:from-font}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
strong,b{font-weight:600}
hr{border:0;border-top:1px solid var(--rule);margin:2.5rem 0}
::selection{background:var(--paper-2)}

/* 章節編號放到左邊界，桌機才顯示 */
.sec-no{position:absolute;left:-3.6rem;top:1.35rem;font-family:var(--font-mono);font-size:var(--t1);
  letter-spacing:.06em;color:var(--ink-2);font-weight:400}
@media (max-width:1180px){.sec-no{display:none}}

/* 數字與中介資料 */
.num,.mono,td,code,time{font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.num{font-feature-settings:"zero" 1}
code{background:var(--paper-2);padding:.08em .32em;border-radius:2px;font-size:var(--t1)}
.small{font-size:var(--t1)}
.dim{color:var(--ink-2)}
.stale{color:var(--neg);font-family:var(--font-mono);font-size:var(--t1);letter-spacing:.02em}
.meta,.dateline,.readout,.sm-note,.meta-kicker{
  font-family:var(--font-mono);font-size:var(--t1);letter-spacing:.06em;color:var(--ink-2)}

/* ── 報頭：儀器讀數 ─────────────────────────────────────── */
.masthead{border-bottom:2px solid var(--rule);view-transition-name:masthead}
.masthead .wrap{display:grid;grid-template-columns:1fr auto;gap:.55rem 1rem;
  align-items:baseline;padding-block:1.3rem 1.05rem}
.brand{font-family:var(--font-ui);font-weight:600;font-size:var(--t2);letter-spacing:.16em;
  text-transform:uppercase;text-decoration:none;color:var(--ink);line-height:1.2}
.brand span{display:inline-block;font-size:var(--t0);letter-spacing:.34em;color:var(--ink-2);
  font-weight:500;margin-left:.9rem;text-transform:none}
/* 報頭讀數：唯一不套 .scroll-x 的捲動容器 —— 它在窄螢幕改成折行（見下方 media query），
   所以那裡沒有「看不到右邊還有東西」的問題。htmlcheck 的白名單裡有它。 */
/* readout 一律折行，不做橫向捲動。
   🔴 原本是 nowrap + overflow-x:auto + 隱藏捲軸，於是放不下的部分**無聲消失**——
      沒有省略號、沒有捲軸，讀者不知道右邊還有東西。
      2026-08-27 導覽多了「工法」（中文 nav 177→225px），readout 可用寬掉 48px，
      而它需要 564px。消失的正好是「哪一條？」——這個站唯一的資料過期警示。
      同一個元素在第 1 輪的 375 手機上也發生過一次（S1-5）。
   判準不是「哪一種語言」，是「放不放得下」——而 white-space:normal 只在放不下的時候折，
   放得下的時候行為完全一樣。所以正確的做法是拿掉那個機制，不是加一個語言條件。 */
.readout{margin:0;white-space:normal;line-height:1.5}
/* 🔴 英文導覽的標籤比中文長（Notes/Performance/Coins/Method/Practice = 374px，
   中文那組約 200px），在 1280 寬把讀數擠成 362px，資料日期被切掉。
   英文版改成折行 —— 跟窄螢幕同一個處理，理由也同一個：**日期是承重資訊，不是裝飾。**
   不縮字級也不縮 gap：那兩個只買得到幾十像素，缺的是兩百多。 */
/* 英文版曾經單獨折行（英文 nav 374px 更寬）。現在 .readout 一律折行，這條不再需要。 */
.mast-nav{display:flex;gap:1.15rem;justify-self:end;font-family:var(--font-mono);
  font-size:var(--t1);letter-spacing:.06em}
.mast-nav a{text-decoration:none;color:var(--ink-2)}
.mast-nav a:hover{color:var(--accent)}
.mast-nav a[aria-current="page"]{color:var(--ink);border-bottom:1px solid var(--accent);padding-bottom:.15rem}

/* 三態主題：文字 + 一條線，沒有盒子 */
.theme{display:flex;gap:.7rem;justify-self:end}
.theme button{font:400 var(--t0)/1.4 var(--font-mono);letter-spacing:.06em;background:none;
  color:var(--ink-2);border:0;border-bottom:1px solid transparent;padding:0 0 .15rem;cursor:pointer}
.theme button:hover{color:var(--ink)}
.theme button[aria-pressed="true"]{color:var(--ink);border-bottom-color:var(--accent)}

/* ── lede ───────────────────────────────────────────────── */
.lede{padding-block:3.4rem .4rem}
.lede h1{view-transition-name:page-title}
/* h1 裡的數字走等寬。襯線體的 2.0 跟散文長得一樣，但它是一個被事前寫死的常數 —— */
/* 字體是它跟旁邊的字有什麼不同的唯一提示。.92em 是補等寬字面較寬造成的視覺放大。 */
h1 .n{font-family:var(--font-mono);font-weight:500;letter-spacing:-.01em}
.lede .sub{font-size:var(--t3);color:var(--ink-2);max-width:var(--measure);margin-top:1.1rem}

/* 計數列 */
.tally{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) minmax(0,1.5fr);
  margin:2.4rem 0 .5rem;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:1rem 0}
.tally div{padding:.15rem 1rem;border-left:1px solid var(--rule)}
.tally div:first-child{border-left:0;padding-left:0}
.tally dt{font-family:var(--font-mono);font-size:var(--t0);letter-spacing:.1em;color:var(--ink-2);text-transform:uppercase}
.tally dd{margin:.3rem 0 0;font-family:var(--font-mono);font-size:var(--t5);line-height:1.1;
  font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.tally .zero{color:var(--accent)}
.tally-note{margin:.75rem 0 0;padding-bottom:.2rem}

/* ── 小倍數 ─────────────────────────────────────────────── */
.sm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.7rem 1.9rem;margin:2rem 0 1.2rem}
.sm{margin:0}
.sm svg{width:100%;height:auto;display:block;overflow:visible}
.sm .thr{stroke:var(--accent);stroke-width:1;stroke-dasharray:3 3;opacity:.7}
.sm .ax{stroke:var(--rule-2);stroke-width:1}
.sm .ser{fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;stroke:currentColor}
.sm .dot{fill:currentColor;stroke:var(--paper);stroke-width:1.2}
.sm .s-acc{color:var(--accent)}
.sm .s-eval{color:var(--eval)}
.sm circle.s-acc{color:var(--accent);fill:var(--accent)}
.sm figcaption{margin-top:.55rem;border-top:1px solid var(--rule);padding-top:.42rem;
  display:grid;grid-template-columns:1fr auto;gap:0 .6rem;align-items:baseline}
.sm-name{font-family:var(--font-ui);font-size:var(--t1);font-weight:600}
/* 空格子的「無軌跡紀錄」原本畫在 SVG 裡，縮放之後只剩 8.6px。搬到 HTML 才有固定的字級。 */
.sm-none{grid-column:1/-1;font-family:var(--font-mono);font-size:var(--t0);color:var(--ink-2);letter-spacing:.04em}
.sm-t{font-family:var(--font-mono);font-size:var(--t3);letter-spacing:-.01em}
.sm-t.none{color:var(--ink-2)}
.sm-note{grid-column:1/-1;font-size:var(--t0);line-height:1.45;margin-top:.18rem;letter-spacing:.02em}
@media (max-width:820px){.sm-grid{grid-template-columns:repeat(2,1fr);gap:1.5rem 1.2rem}}

/* ── 圖表 ───────────────────────────────────────────────── */
figure{margin:2.2rem 0}
.chart{width:100%;height:auto;display:block;overflow:visible}
.chart text{font-family:var(--font-mono);font-size:11px;fill:var(--ink-2)}
.chart .lbl{font-family:var(--font-ui);font-size:11.5px}
.chart .ax{stroke:var(--rule-2);stroke-width:1}
.chart .grid{stroke:var(--rule);stroke-width:1}
.chart .thr{stroke:var(--accent);stroke-width:1;stroke-dasharray:4 3;opacity:.75}
.chart .ser{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.chart .dot{stroke:var(--paper);stroke-width:1.5}
.chart .s-eval{color:var(--eval)}.chart .s-acc{color:var(--accent)}.chart .s-ink{color:var(--ink-2)}
.chart .s-eval .ser,.chart .s-acc .ser,.chart .s-ink .ser{stroke:currentColor}
.chart .s-acc.ser{stroke:var(--accent)}
.chart .s-ink.ser{stroke:var(--ink-2);stroke-width:1.5}
.chart .s-eval .dot,.chart .s-acc .dot,.chart .s-ink .dot{fill:currentColor}
.chart .endlbl{fill:currentColor;font-weight:600}
figcaption{font-size:var(--t1);color:var(--ink-2);max-width:var(--measure);margin-top:.8rem;line-height:1.6}
figcaption b{font-family:var(--font-ui);font-weight:600;color:var(--ink);margin-right:.5rem}

/* 權益曲線 */
.chart.equity .eq-band{fill:var(--accent);opacity:.13}
.chart.equity .eq-total{stroke:var(--accent);stroke-width:2}
.chart.equity .eq-realized{stroke:var(--ink-2);stroke-width:1.3;stroke-dasharray:none}
.chart.equity .eq-mark line{stroke:var(--rule-2);stroke-width:1;stroke-dasharray:2 3}
/* 這三個是 viewBox 座標單位，不是 px。權益圖的縮放介於 1.0（手機）到 1.1（桌機），
   所以宣告值就等於下限 —— 寫 10 會在手機上剛好卡在 10.0，留不住四捨五入。 */
.chart.equity .eq-mark text{font-size:11px;fill:var(--ink-2)}
.chart.equity .eq-tick{font-size:11px}
.chart.equity .eq-end{font-size:12px;fill:var(--accent);font-weight:500}
.chart.equity .eq-end.dim{fill:var(--ink-2);font-size:11px;font-weight:400}

/* ── 二部圖 ─────────────────────────────────────────────── */
.bipartite{width:100%;height:auto;display:block;margin:1.8rem 0 .4rem;overflow:visible}
.bipartite text{font-family:var(--font-mono);font-size:11px;fill:var(--ink)}
.bipartite .edge{stroke:var(--rule-2);stroke-width:1;fill:none}
.bipartite .edge.self{stroke:var(--accent);stroke-width:1.5}
.bipartite .node{fill:var(--ink-2)}
.bipartite .node.self{fill:var(--accent)}
.bipartite .lbl-self{fill:var(--accent)}
.bipartite .hd{fill:var(--ink-2);letter-spacing:.12em;font-size:10px}

/* ── 表格 ───────────────────────────────────────────────── */
.ledger{width:100%;border-collapse:collapse;font-family:var(--font-ui);font-size:var(--t1)}
.ledger thead th{font-family:var(--font-mono);font-size:var(--t0);letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-2);font-weight:400;text-align:left;padding:0 .6rem .55rem 0;border-bottom:1px solid var(--rule-2)}
.ledger thead th.r{text-align:right;padding-right:0}
.ledger tbody{border-bottom:1px solid var(--rule)}
.ledger td{padding:.68rem .6rem .1rem 0;vertical-align:baseline;border:0;font-family:inherit}
.ledger tr.why td{padding:.2rem 0 .8rem;font-family:var(--font-prose);font-size:var(--t2);color:var(--ink-2);line-height:1.62}
.ledger .name{font-weight:600}
.ledger .what{display:block;font-weight:400;font-size:var(--t1);color:var(--ink-2);margin-top:.12rem}
.ledger .t,.ledger .n{font-family:var(--font-mono);text-align:right;padding-right:0;white-space:nowrap}
.ledger .t{font-size:var(--t2)}
.ledger .n{font-size:var(--t1);color:var(--ink-2)}
.ledger tbody{transition:background .15s ease}
.ledger tbody:hover{background:var(--paper-2)}
.ledger tbody td:first-child{border-left:2px solid transparent;padding-left:.7rem;transition:border-color .15s ease}
.ledger tbody:hover td:first-child{border-left-color:var(--accent)}
.ledger.lines thead th:nth-child(2),.ledger.lines td:nth-child(2){width:3.6rem}
.ledger.lines thead th:nth-child(3),.ledger.lines td:nth-child(3){width:12rem;padding-left:1rem}
.ledger.lines thead th:nth-child(4),.ledger.lines td:nth-child(4){width:3.4rem;padding-right:1rem}
.ledger.lines thead th:nth-child(5),.ledger.lines td:nth-child(5){width:5.4rem}

/* t 相對門檻的長條 */
.bar{position:relative;display:block;height:9px;min-width:82px;max-width:190px;margin-top:.45rem;
  background:var(--paper-2);overflow:hidden}
.bar i{position:absolute;inset:0;transform-origin:left;transform:scaleX(var(--v));background:var(--ink-2)}
.bar.v-dead i{background:var(--rule-2)}
.bar b{position:absolute;top:-2px;bottom:-2px;left:var(--thr);width:1px;background:var(--accent)}
.js .in .bar i{transition:transform .55s cubic-bezier(.22,.8,.3,1) var(--d,0ms)}
.js [data-reveal] .bar i{transform:scaleX(0)}
.js [data-reveal].in .bar i{transform:scaleX(var(--v))}

/* 裁決標記：字體不用色塊。這個站沒有需要你立刻採取行動的東西，所以不該有警示色 */
.v{font-family:var(--font-mono);font-size:var(--t1);letter-spacing:.06em;white-space:nowrap}
.v::before{margin-right:.4rem}
.v-dead{color:var(--ink-2)}.v-dead::before{content:"■"}
.v-unproven{color:var(--ink)}.v-unproven::before{content:"◐"}
.v-live{color:var(--pos)}.v-live::before{content:"●"}
.v-eval{color:var(--eval)}.v-eval::before{content:"◇"}

/* ── 紀錄列表 ───────────────────────────────────────────── */
.index{list-style:none;padding:0;margin:0}
.index li{border-top:1px solid var(--rule);padding:1.3rem 0 1.35rem}
.index li:first-child{border-top:0}
.index a{font-family:var(--font-ui);font-weight:600;font-size:var(--t3);text-decoration:none;color:var(--ink);
  display:inline-block;line-height:1.3;letter-spacing:-.012em}
.index a:hover{color:var(--accent)}
.index .meta{font-family:var(--font-mono);font-size:var(--t0);letter-spacing:.06em;color:var(--ink-2);
  text-transform:uppercase;margin-bottom:.4rem}
.index .meta time{letter-spacing:.02em}
.index p{margin:.4rem 0 0;color:var(--ink-2);font-size:var(--t2);max-width:var(--measure)}

/* ── 文章 ───────────────────────────────────────────────── */
.article{padding-block:3.2rem}
.article h1{view-transition-name:page-title;max-width:24ch}
.dateline{display:flex;flex-wrap:wrap;gap:.35rem .9rem;align-items:center;margin:0 0 1.8rem}
.abstract{border-left:2px solid var(--accent);padding:.1rem 0 .1rem 1.2rem;margin:0 0 2.6rem;
  max-width:var(--measure);font-size:var(--t2);color:var(--ink-2)}
.body{max-width:var(--measure);position:relative}
.body>*{max-width:var(--measure)}
.body ul,.body ol{padding-left:1.3rem}
.body li{margin-bottom:.45rem}
.body blockquote{margin:1.9rem 0;padding:.1rem 0 .1rem 1.2rem;border-left:2px solid var(--rule-2);color:var(--ink-2)}
.body blockquote p:last-child{margin-bottom:0}
.body table,.wide{width:min(100%,var(--wide));max-width:none}
.body table{border-collapse:collapse;font-family:var(--font-mono);font-size:var(--t1);margin:1.9rem 0;
  display:block}
.body th{font-family:var(--font-mono);font-size:var(--t0);letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-2);font-weight:400;text-align:left;padding:.4rem .9rem .4rem 0;
  border-bottom:1px solid var(--rule-2);white-space:nowrap}
.body td{padding:.4rem .9rem .4rem 0;border-bottom:.5px solid var(--rule);white-space:normal;
  vertical-align:baseline;min-width:3.4em}
.body tr:last-child td{border-bottom:0}
.body img{max-width:100%;height:auto}
.body pre{background:var(--paper-2);border-left:2px solid var(--rule-2);padding:.85rem 1rem;
  font-size:var(--t1);line-height:1.6;margin:1.6rem 0;max-width:var(--wide)}
.body pre code{background:none;padding:0;font-size:1em;color:var(--ink)}

/* ── 邊注（Tufte sidenote）───────────────────────────────
   ≥1100px 浮到右邊欄；窄螢幕回到行內。🔴 永遠不用 display:none ——
   這個站的價值有一半在那些限制陳述，手機讀者一樣要看得到。 */
.marginnote{font-family:var(--font-ui);font-size:var(--t1);line-height:1.55;color:var(--ink-2);
  border-left:2px solid var(--rule-2);padding-left:1rem;margin:1.3rem 0}
.mn-no{font-family:var(--font-mono);color:var(--accent);margin-right:.45em;font-size:var(--t0)}
.mn-ref{font-family:var(--font-mono);font-size:var(--t0);vertical-align:super;color:var(--accent);
  margin-left:.12em;letter-spacing:0}
@media (min-width:1160px){
  .marginnote{position:absolute;left:calc(var(--measure) + 2.8rem);width:15.5rem;margin:0;
    border-left:0;padding-left:0;border-top:.5px solid var(--rule-2);padding-top:.5rem;
    transform:translateY(-1.6em)}
}

/* ── footer ─────────────────────────────────────────────── */
footer{border-top:2px solid var(--rule);margin-top:4.8rem}
footer .wrap{padding-block:1.7rem 3.2rem;font-size:var(--t1);color:var(--ink-2);max-width:var(--wide)}
footer p{margin:0 0 .5rem;max-width:var(--measure)}
.foot{margin-top:1rem;max-width:var(--measure)}

/* ── 績效頁 ─────────────────────────────────────────────── */
/* 合計當展示物件：量級比分位重要，讓眼睛先抓到整數部分 */
.bignum{font-family:var(--font-mono);font-size:var(--t10);line-height:1;
  letter-spacing:-.03em;font-variant-numeric:tabular-nums;margin:.4rem 0 .35rem}
.bignum .cur{font-size:var(--t4);vertical-align:.42em;color:var(--ink-2);margin-right:.06em}
.bignum .frac{color:var(--ink-2)}
.bigsub{font-family:var(--font-mono);font-size:var(--t1);letter-spacing:.06em;color:var(--ink-2);margin:0}
.perf-cols{display:grid;grid-template-columns:1.15fr .85fr;gap:2.8rem;align-items:start}
.perf-cols h2{margin-top:2.4rem}
.hd-note{font-family:var(--font-mono);font-size:var(--t0);font-weight:400;letter-spacing:.08em;
  color:var(--eval);margin-left:.7rem;white-space:nowrap;text-transform:none}
.ledger.perf .n,.ledger.perf .t,.ledger.perf thead th.r{padding-left:1.1rem}
.ledger.perf thead th:first-child{padding-left:.7rem}
.ledger.perf .t{font-size:var(--t2)}
.ledger.perf tbody.total{border-bottom:0;border-top:2px solid var(--rule-2)}
.ledger.perf tbody.total .t{font-size:var(--t4)}
.ledger.eval .name,.ledger.eval .t{color:var(--eval)}
.ledger.eval tbody:hover td:first-child{border-left-color:var(--eval)}
.eval-warn{color:var(--eval);border-left:2px solid var(--eval);padding-left:1rem;margin:1.1rem 0}
.fresh{font-family:var(--font-mono);font-size:var(--t1);color:var(--ink-2)}
.ledger tr.why td .stale{display:inline}

.ledger.trades{font-size:var(--t1)}
.ledger.trades th{padding-bottom:.5rem;border-bottom:1px solid var(--rule-2)}
.ledger.trades td{font-family:var(--font-mono);padding:.55rem .9rem .55rem 0;border-bottom:.5px solid var(--rule);
  vertical-align:baseline;white-space:nowrap}
.ledger.trades td.r,.ledger.trades th.r{text-align:right;padding-right:.9rem}
.ledger.trades tbody tr:hover{background:var(--paper-2)}
.ledger.trades .sym{font-weight:500}
.ledger.trades .up{color:var(--pos)}
.ledger.trades .down{color:var(--neg)}
.ledger.trades td .dim{font-size:var(--t0)}
.withheld{display:inline-block;white-space:normal;max-width:13.5rem;color:var(--ink-2)}
.withheld em{display:block;font-style:normal;font-family:var(--font-mono);font-size:var(--t0);line-height:1.35;margin-top:.15rem}

.chart.bars .b{transform-box:view-box;transform-origin:320px 0}
.chart.bars .pos .b{fill:var(--pos)}
.chart.bars .neg .b{fill:var(--neg)}
.chart.bars .pos .blbl{fill:var(--pos)}
.chart.bars .neg .blbl{fill:var(--neg)}
/* 🔴 長條圖不拉滿寬。渲染寬度 ÷ viewBox 寬度就是圖內文字的縮放倍率 ——
   拉到 752px 等於把 11px 的軸標放大成 23px，比 h3 還大。三筆交易不需要 752px。 */
.chart.bars{max-width:400px}
.chart.bars .blbl{font-family:var(--font-mono);font-size:12px;font-weight:500}
.js [data-reveal] .chart.bars .b{transform:scaleX(0)}
.js [data-reveal].in .chart.bars .b{transform:scaleX(1);
  transition:transform .5s cubic-bezier(.22,.8,.3,1) var(--d,0ms)}

/* ── 幣種頁 ─────────────────────────────────────────────── */
.meta-kicker{margin:0 0 .35rem;text-transform:uppercase}
.coin-h1{font-family:var(--font-mono);font-size:var(--t8);letter-spacing:-.02em;font-weight:500}

/* ── 動效 ───────────────────────────────────────────────── */
.js [data-reveal]{opacity:0;transform:translateY(8px)}
.js [data-reveal].in{opacity:1;transform:none;transition:opacity .5s ease-out,transform .5s ease-out}
.js [data-reveal] .chart .ser,.js [data-reveal] .sm .ser,.js [data-reveal] .bipartite .edge{
  stroke-dasharray:var(--len);stroke-dashoffset:var(--len)}
.js [data-reveal].in .chart .ser,.js [data-reveal].in .sm .ser,.js [data-reveal].in .bipartite .edge{
  stroke-dashoffset:0;transition:stroke-dashoffset .9s ease-out var(--d,0ms)}
.js [data-reveal] .chart .dot,.js [data-reveal] .chart .endlbl,.js [data-reveal] .sm .dot,
.js [data-reveal] .chart.equity .eq-band{opacity:0}
.js [data-reveal].in .chart .dot,.js [data-reveal].in .chart .endlbl,.js [data-reveal].in .sm .dot{
  opacity:1;transition:opacity .35s ease-out calc(var(--d,0ms) + .5s)}
.js [data-reveal].in .chart.equity .eq-band{opacity:.13;transition:opacity .5s ease-out .7s}

@view-transition{navigation:auto}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:1ms!important;animation-iteration-count:1!important;
    transition-duration:1ms!important;transition-delay:0ms!important;scroll-behavior:auto!important}
  .js [data-reveal]{opacity:1!important;transform:none!important}
  .js [data-reveal] .chart .ser,.js [data-reveal] .sm .ser,.js [data-reveal] .bipartite .edge{stroke-dashoffset:0!important}
  .js [data-reveal] .chart .dot,.js [data-reveal] .chart .endlbl,.js [data-reveal] .sm .dot{opacity:1!important}
  .js [data-reveal] .chart.equity .eq-band{opacity:.13!important}
  .js [data-reveal] .bar i{transform:scaleX(var(--v))!important}
  .js [data-reveal] .chart.bars .b{transform:none!important}
  @view-transition{navigation:none}
}

/* ── 窄螢幕 ─────────────────────────────────────────────── */
@media (max-width:900px){
  .perf-cols{grid-template-columns:1fr;gap:1rem}
  .ledger.trades{display:block}
}
@media (max-width:640px){
  body{font-size:var(--t2)}
  .masthead .wrap{padding-block:1.1rem .9rem}
  .brand{font-size:var(--t2)}
  .brand span{display:block;margin:.2rem 0 0}
  .readout{font-size:var(--t0)}
  .mast-nav{font-size:var(--t0);gap:.9rem}
  .tally{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:.9rem}
  .tally div{padding-inline:.9rem}
  .tally div:nth-child(odd){border-left:0;padding-left:0}
  .tally div:last-child{grid-column:1/-1;border-left:0;padding-left:0;border-top:1px solid var(--rule);padding-top:.8rem}
  .tally dd{font-size:var(--t4)}
  .ledger{font-size:var(--t1)}
  .ledger.lines th:nth-child(3),.ledger.lines td:nth-child(3),
  .ledger.perf:not(.eval) th:nth-child(3),.ledger.perf:not(.eval) td:nth-child(3){display:none}
  .ledger.lines th:nth-child(2),.ledger.lines td:nth-child(2){width:3.2rem}
  .ledger.lines th:nth-child(4),.ledger.lines td:nth-child(4){width:2.6rem;padding-right:.5rem}
  .ledger.lines th:nth-child(5),.ledger.lines td:nth-child(5){width:4.6rem}
  .ledger.perf .n,.ledger.perf .t{padding-left:.7rem}
  .ledger.trades{display:block}
  .ledger tr.why td{padding-right:0}
}
.readout-stale{color:var(--neg);margin-left:.7rem;text-decoration:none;border-bottom:1px solid currentColor}
.chart.equity .eq-solo{fill:var(--accent);stroke:var(--paper);stroke-width:1.5}
.eq-fig.eval .eq-total{stroke:var(--eval)}
.eq-fig.eval .eq-end{fill:var(--eval)}
.chart.equity .eq-worst circle{fill:var(--neg);stroke:var(--paper);stroke-width:1.4}
.worst-day{font-size:var(--t2);margin:.9rem 0 0;padding-left:1rem;border-left:2px solid var(--rule-2);color:var(--ink-2)}
.worst-day p{margin:0 0 .6rem}
.bipartite .vn{font-size:10px;fill:var(--ink-2)}
.bipartite .vn.lbl-self{fill:var(--accent)}
/* 中價計價的區段畫虛線。這條要蓋過描線進場的 dasharray —— 虛線在傳達資訊，動畫只是裝飾 */
.chart.equity .provisional{stroke-dasharray:5 4!important;stroke-dashoffset:0!important}
.chart.equity .eq-settled{fill:var(--accent);stroke:var(--paper);stroke-width:1.4}

/* ══ v3 儀器外殼 ══════════════════════════════════════════ */
/* 面板：分區底 + 一條細框。判準是關掉顏色之後資訊還在，所以框只是輔助 */
.panel{background:var(--paper-2);border:1px solid var(--rule);padding:1rem 1.1rem 1.15rem;position:relative}
.panel + .panel{margin-top:0}
.panel-hd{display:flex;flex-wrap:wrap;gap:.3rem .8rem;align-items:baseline;
  font-family:var(--font-mono);font-size:var(--t0);letter-spacing:.08em;color:var(--ink-2);
  border-bottom:1px solid var(--rule);padding-bottom:.5rem;margin:0 0 .8rem}
.panel-hd .nm{color:var(--ink);font-size:var(--t1);letter-spacing:.04em}
.panel-hd .unit{margin-left:auto}
.panel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin:1.4rem 0}
@media (max-width:900px){.panel-grid{grid-template-columns:1fr}}

/* 儀表頭：使用者要在這裡看到自己的錢 */
.gauge{border:1px solid var(--rule);background:var(--paper-2);padding:1.4rem 1.4rem 1.2rem;margin:1.6rem 0 0}
.gauge-total{font-family:var(--font-mono);font-size:var(--t11);line-height:1;
  letter-spacing:-.035em;color:var(--accent);text-shadow:var(--glow);font-variant-numeric:tabular-nums;margin:.2rem 0 .1rem}
.gauge-total .cur{font-size:var(--t7);vertical-align:.55em;color:var(--ink-2);text-shadow:none;margin-right:.08em}
.gauge-total .frac{color:var(--ink-2);text-shadow:none}
/* 區塊小標。原本叫 gauge-cap，但它早就不只用在儀表上 ——
   一個名字騙人的 class 會讓合理的 grep 量到錯的東西，而這個站的產出會被人 grep。 */
.sec-cap{font-family:var(--font-mono);font-size:var(--t0);letter-spacing:.1em;color:var(--ink-2);
  text-transform:uppercase;margin:0}
.gauge-lines{display:flex;flex-wrap:wrap;gap:.4rem 1.6rem;margin:1rem 0 0;padding-top:.9rem;
  border-top:1px solid var(--rule);font-family:var(--font-mono);font-size:var(--t1);list-style:none}
.gauge-lines li{color:var(--ink-2)}
.gauge-lines b{color:var(--ink);font-weight:400;margin-left:.5rem}
.gauge-eval{margin:.8rem 0 0;padding-top:.8rem;border-top:1px dashed var(--rule-2);
  font-family:var(--font-mono);font-size:var(--t1);color:var(--eval)}
.gauge-eval b{font-weight:400}

/* 註記：<details> 天生鍵盤可達，不需要 JS */
.annot{margin:.9rem 0 0;border-left:2px solid var(--thresh);padding-left:.9rem}
.annot > summary{font-family:var(--font-mono);font-size:var(--t1);color:var(--thresh);cursor:pointer;
  list-style:none;letter-spacing:.04em}
.annot > summary::-webkit-details-marker{display:none}
.annot > summary::before{content:"▸ ";}
.annot[open] > summary::before{content:"▾ ";}
.annot > summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.annot .body-txt{font-size:var(--t1);line-height:1.62;color:var(--ink-2);margin:.6rem 0 0;max-width:var(--measure)}
.annot .body-txt p{margin:0 0 .55rem}
.annot .body-txt b{color:var(--ink)}

/* 示波器：淡網格 + 螢光跡線 + 空框看得出是刻意的 */
.sm{background:var(--paper-2);border:1px solid var(--rule);padding:.7rem .8rem .8rem}
.sm.empty{border-style:dashed;background:none}
.sm .grid-l{stroke:var(--grid);stroke-width:1}
.sm .thr{stroke:var(--thresh);stroke-dasharray:3 3;opacity:.85}
.sm .sm-thr{fill:var(--thresh)}
.sm .s-acc{color:var(--accent)}
.sm .s-eval{color:var(--trace-2)}
.sm .ser{filter:drop-shadow(0 0 2px currentColor)}
.sm .dot{stroke:var(--paper-2)}
.sm figcaption{border-top:1px solid var(--rule)}
.sm-t{color:var(--accent)}
.sm-t.none{color:var(--ink-2)}
.sm .ax{stroke:var(--rule-2)}

/* 圖表在暗底下的調整 */
.chart .grid{stroke:var(--grid)}
.chart .thr{stroke:var(--thresh)}
.chart.equity .eq-total{stroke:var(--accent);filter:drop-shadow(0 0 2px var(--accent))}
.chart.equity .eq-band{fill:var(--accent);opacity:.1}
.chart.equity .eq-end{fill:var(--accent)}
.chart.equity .eq-solo,.chart.equity .eq-settled{stroke:var(--paper-2)}
.eq-fig.eval .eq-total{stroke:var(--eval);filter:drop-shadow(0 0 2px var(--eval))}
.eq-fig.eval .eq-end{fill:var(--eval)}
.eq-fig.eval .eq-band{fill:var(--eval)}
.chart .s-eval{color:var(--trace-2)}
.chart.bars .pos .b{fill:var(--accent)}
.chart.bars .pos .blbl{fill:var(--accent)}
.bar i{background:var(--ink-2)}
.bar.v-unproven i{background:var(--accent)}
.bar b{background:var(--thresh)}
.v-unproven{color:var(--accent)}
.stale{color:var(--neg)}
.readout-stale{color:var(--neg)}
code,.body pre{background:var(--paper-2)}


/* ── 存活面板：哪一條線還在說話 ────────────────────────────
   狀態靠字形（● ▲ ○）帶意義，顏色只是加強 —— 關掉顏色之後這張表仍然讀得懂。 */
.survival{border:1px solid var(--rule);background:var(--paper-2);padding:1.1rem 1.2rem 1rem;margin:1.6rem 0 0}
.ledger.surv{width:100%;border-collapse:collapse;font-family:var(--font-mono);font-size:var(--t1);margin:.7rem 0 .9rem}
.ledger.surv th{font-size:var(--t0);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2);
  font-weight:400;text-align:left;padding:0 1rem .45rem 0;border-bottom:1px solid var(--rule)}
.ledger.surv td{padding:.42rem 1rem .42rem 0;border-bottom:.5px solid var(--rule);vertical-align:baseline}
.ledger.surv tr:last-child td{border-bottom:0}
.ledger.surv .r{text-align:right;padding-right:1.4rem}
.ledger.surv th.r{text-align:right}
.ledger.surv .nm{color:var(--ink);white-space:nowrap}
.ledger.surv .d,.ledger.surv .r{color:var(--ink-2);white-space:nowrap}
.ledger.surv .st{color:var(--ink-2);white-space:nowrap}
.ledger.surv .rz{color:var(--ink-2);white-space:normal}
.ledger.surv .st-live .mk,.ledger.surv .st-live .st{color:var(--accent)}
.ledger.surv .st-down .mk,.ledger.surv .st-down .st{color:var(--thresh)}
.ledger.surv .st-down .nm{color:var(--thresh)}
.ledger.surv .st-closed .mk,.ledger.surv .st-none .mk{color:var(--ink-2)}
@media (max-width:760px){
  .ledger.surv{font-size:var(--t1)}
  .ledger.surv .st,.ledger.surv .rz{white-space:normal}
  .ledger.surv .rz{display:block;margin-left:1.1rem}
}

.ledger.surv tbody{border-bottom:0}
.ledger.surv tbody:hover{background:none}
.ledger.surv tbody td:first-child{border-left:0;padding-left:0}
.ledger.surv thead th.r{padding-right:1.4rem}
.ledger.surv thead th:last-child{padding-left:.2rem}

@media (max-width:700px){
  .survival{padding:1rem .9rem .9rem}
  .ledger.surv thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .ledger.surv tr{display:block;padding:.55rem 0;border-bottom:.5px solid var(--rule)}
  .ledger.surv tr:last-child{border-bottom:0}
  .ledger.surv td{display:inline;padding:0;border:0;white-space:normal}
  .ledger.surv .nm{display:block;font-size:var(--t1);margin-bottom:.15rem}
  .ledger.surv .d::after,.ledger.surv .r::after{content:" · ";color:var(--rule-2)}
  .ledger.surv .rz{display:block;margin:.1rem 0 0}
}

.ledger.surv .rz::before{content:" · "}
@media (max-width:700px){ .ledger.surv .rz::before{content:none} }

/* 資料層的 basis / note 各自一段，靠一條細線與圖說分開 —— 它們是限制陳述不是註腳 */
.eq-fig .cap-src{display:block;margin:.5rem 0 0;padding-top:.45rem;border-top:.5px solid var(--rule);
  color:var(--ink-2)}

/* 鏡像節的實例表：caption 是算出來的統計，所以讓它看起來像讀數不像標題 */
.body table.mirror{display:table;width:min(100%,var(--wide));table-layout:auto}
.body table.mirror caption{caption-side:top;text-align:left;font-family:var(--font-mono);
  font-size:var(--t0);letter-spacing:.04em;color:var(--ink-2);padding-bottom:.6rem;line-height:1.55}
.body table.mirror .mid{font-weight:500;color:var(--ink);white-space:nowrap}
.body table.mirror .who{white-space:nowrap;color:var(--ink-2)}
.body table.mirror td{font-size:var(--t1)}
.body table.mirror td:last-child,.body table.mirror th:last-child{white-space:nowrap}

/* ══ UI v3 §7　文章頁：儀器外殼只在頁首與圖表，正文放鬆 ══════ */
/* 行高 1.75（全站基準是 1.72，正文再放一點） */
.article .body{line-height:1.75}
/* h1 比全站的小一級：文章標題要跟報頭共處一頁，不需要壓過它 */
.article h1{font-size:var(--t9)}
/* 等寬小字的 kicker 在 h1 上面 */
.kicker{font-family:var(--font-mono);font-size:var(--t0);letter-spacing:.1em;color:var(--ink-2);
  text-transform:uppercase;margin:0 0 .55rem;display:flex;flex-wrap:wrap;gap:.3rem .9rem;align-items:baseline}
.dateline{color:var(--ink-2)}
.dateline span{color:var(--ink-2)}
/* 表格：分區底 + 細橫線；數字欄由 numCols 逐欄改右對齊 */
.body table{background:var(--paper-2)}
.body thead th{background:var(--paper-2)}
.body th,.body td{padding-inline:.9rem}
.body th:first-child,.body td:first-child{padding-left:.9rem}
.body td[style*="right"],.body th[style*="right"]{font-variant-numeric:tabular-nums}

/* 首頁題辭。原文的因果方向是「沒有新鮮事 ← 投機古老」，所以粗體落在因不在果。 */
.epigraph{margin:0;padding:1.6rem 0 0;border-top:1px solid var(--rule)}
.epigraph blockquote{margin:0;border:0;padding:0}
.epigraph blockquote p{
  font-family:var(--font-prose);font-size:var(--t4);
  line-height:1.5;color:var(--ink);margin:0 0 .9rem;max-width:32rem}
.epigraph figcaption{font-size:var(--t1);line-height:1.7;color:var(--ink-2);max-width:38rem}
.epigraph cite{font-style:italic}
/* 歸屬的更正說明不是註腳，它跟出處同一層 —— 這個站的題辭本身就是一次來源標記的示範。 */
.epigraph .attr-note{display:block;margin-top:.5rem;padding-left:.9rem;
  border-left:1px solid var(--rule)}
.epigraph .attr-note b{color:var(--ink)}
.gauge-pnl{font-family:var(--font-mono);font-size:var(--t2);margin:.2rem 0 0;font-variant-numeric:tabular-nums}
.gauge-pnl.pos{color:var(--pos)} .gauge-pnl.neg{color:var(--neg)}

/* ── 幣種索引 ─────────────────────────────────────────────
   716 個連結要能掃視：等寬、密排、下市的標紅。不做卡片、不做圖示。 */
.coin-year{margin-top:2.2rem}
.coin-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(9.5rem,1fr));
  gap:.35rem .9rem;list-style:none;padding:0;margin:.8rem 0 0;font-family:var(--font-mono);font-size:var(--t1)}
.coin-grid li{display:flex;gap:.4rem;align-items:baseline;min-width:0}
.coin-grid a{text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.coin-grid a:hover{text-decoration:underline}
.coin-grid .stale{font-size:var(--t0);letter-spacing:0}
.coin-table{font-family:var(--font-mono);font-size:var(--t1)}
.coin-table.tomb tbody tr td:first-child{border-left:2px solid var(--thresh);padding-left:.6rem}
.abstract.tomb{border-left-color:var(--thresh)}

.byline b{color:var(--ink);font-weight:600}

/* ── 目錄與文末出口 ────────────────────────────────────────
   都是導覽不是內容：等寬小字、細線分隔，不搶正文。 */
.toc{border-left:2px solid var(--rule-2);padding:.1rem 0 .1rem 1.2rem;margin:0 0 2.4rem;max-width:var(--measure)}
.toc ol{list-style:decimal;padding-left:1.2rem;margin:.5rem 0 0;font-family:var(--font-ui);font-size:var(--t1)}
.toc li{margin-bottom:.25rem;color:var(--ink-2)}
.toc a{text-decoration:none}
.toc a:hover{text-decoration:underline}

.outro{margin-top:3.6rem;border-top:2px solid var(--rule);padding-top:1.4rem;max-width:var(--wide)}
.outro section{margin-bottom:1.5rem;max-width:var(--measure)}
.outro p{margin:.35rem 0 0}
.outro ul{list-style:none;padding:0;margin:.5rem 0 0}
.outro li{display:flex;gap:.7rem;align-items:baseline;margin-bottom:.35rem}
.outro li a{flex:1 1 auto}
.outro-nav{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:1rem;
  border-top:1px solid var(--rule);padding-top:1.1rem;max-width:var(--wide)}
.outro-nav .sec-cap{display:block;margin-bottom:.15rem}

/* ── P3　觸控目標、跳過連結、手機報頭 ────────────────────────
   稽核量到的：主題鈕 13×20px、「哪一條？」渲染在 x=472（畫面寬 390，看不到）、
   `.sm-note` 11.52px、相對門檻長條在手機上 display:none。逐條修，不用隱藏解決問題。 */

/* 跳過連結：鍵盤 Tab 第一下就拿得到，滑鼠使用者永遠看不到 */
.skip{position:absolute;left:-9999px;top:0;z-index:10;background:var(--paper-2);color:var(--ink);
  border:1px solid var(--accent);padding:.6rem 1rem;font-family:var(--font-mono);font-size:var(--t1)}
.skip:focus{left:.6rem;top:.6rem}

/* 主題鈕：命中區 ≥24×24（WCAG 2.2 AA 的最低尺寸），視覺仍然只是文字加一條底線 */
.theme button{padding:.35rem .3rem;min-width:24px;min-height:24px}

/* 章節編號是裝飾：aria-hidden 寫在標記上（speak: 屬性支援度不穩，不靠它） */

@media (max-width:640px){
  /* 🔴 報頭讀數本來是 nowrap + 橫向捲動，於是「哪一條？」被推到畫面外 ——
     一個點不到的過期警示等於沒有警示。改成可以折行。 */
  .readout-stale{margin-left:.4rem}
  /* 🔴 窄螢幕上讀數自己佔一整列，不跟 brand 擠 1fr 那一欄。
     成因是量出來的，不是猜的（驗收方 2026-08-27）：
       375 的 wrap 只有 360px，nav 是 auto 欄先拿走它要的，1fr 拿剩下的。
       EN nav 312px + 主題鈕 160px → readout 容器只剩 93px，內容自然寬 500px → 8 行 132px
       ZH nav 186px + 主題鈕 103px → readout 容器 121px，內容自然寬 474px → 5 行  83px
     內容只差 5%（500 vs 474），容器差 23%（93 vs 121）——**成因在容器不在文案**。
     所以修的是版面：整列給它，一個字都不用刪。
     曾經想砍掉 `8 lines` 與 `$3,300 capital` 來省高度，那是對不是原因的東西動刀，
     而且那兩個數字在文章頁上沒有別處可看 —— `8 lines · 0 passed` 就是這個站的全部主張。 */
  .masthead .wrap > .readout{grid-column:1 / -1}
  /* 小倍數的說明字：11.52 → 12.5px */
  .sm-note{font-size:var(--t1);line-height:1.45}
    /* 相對門檻長條：不用 display:none。改成短版，資訊留著。 */
  .ledger.lines th:nth-child(3),.ledger.lines td:nth-child(3){display:table-cell;width:3.4rem;padding-left:.5rem}
  .ledger.lines td:nth-child(3) .small{display:none}
  .ledger.lines .bar{min-width:3rem}
}

/* 文章列表裡的語言標記：等寬小字，跟日期同一層 */
.index .lang-tag{font-family:var(--font-mono);letter-spacing:.06em}

/* ── 橫向捲動容器 ────────────────────────────────────────────
   🔴 全站只有這一條可以宣告 overflow-x:auto，htmlcheck 會擋掉其他的。
   理由：3px 的溢出本身無感，真正的問題是**一個沒有提示的捲動容器** ——
   讀者不知道右邊還有東西。修的是類別不是個案。
   做法是捲動陰影：cover 兩層跟著內容捲（local），陰影兩層釘在容器上（scroll）。
   捲到最左時 cover 蓋住左陰影，捲到最右時蓋住右陰影 —— 沒有溢出就兩邊都看不到。零 JS。 */
.scroll-x,
.body table,
.body pre,
.ledger.trades{
  overflow-x:auto;
  /* 🔴 那兩個 rgba(20,25,32,0) 是寫死的暗色，坐在一條其餘完全 token 化的規則裡，
     而它可以留著：漸層以預乘 alpha 內插，**alpha=0 的端點不會染色**，
     所以亮色模式不會長出暗邊。兩態量過，cover 層的實色端都跟著 --paper-2 走。
     ⚠️ 依據是機制推理，不是目視確認 —— 沒有人截圖比對過兩態的邊緣。
     🔴 不要「順手修好」成 transparent：那是 rgba(0,0,0,0)，同一類東西換個寫法。
        真要修得寫 color-mix，而那是為一個看不見的問題增加一個機制。
     🔴 真正的風險是有人把那個 0 改成 .02 想讓邊緣柔一點 ——
        亮色模式會立刻長出暗邊，而且沒有任何東西會響。改之前先讀這一段。 */
  background-image:
    linear-gradient(to right,var(--paper-2) 40%,rgba(20,25,32,0)),
    linear-gradient(to left,var(--paper-2) 40%,rgba(20,25,32,0)),
    linear-gradient(to right,rgba(0,0,0,.32),rgba(0,0,0,0)),
    linear-gradient(to left,rgba(0,0,0,.32),rgba(0,0,0,0));
  background-position:0 0,100% 0,0 0,100% 0;
  background-repeat:no-repeat;
  background-size:26px 100%,26px 100%,13px 100%,13px 100%;
  background-attachment:local,local,scroll,scroll;
}

/* 手機的大字降階。🔴 這裡不是「縮小一點」，是換到尺度上的另一級 ——
   clamp() 那種中間值在窄螢幕上會落在兩級之間，量不準也說不清。 */
@media (max-width:640px){
  h1{font-size:var(--t7)}
  h2{font-size:var(--t4)}
  .article h1{font-size:var(--t7)}
  .coin-h1{font-size:var(--t6)}
  .bignum{font-size:var(--t8)}
  .gauge-total{font-size:var(--t8)}
  .epigraph blockquote,.epigraph p{font-size:var(--t3)}
}

/* ── 幣種索引：跳頁框與榜單 ───────────────────────────────── */
/* 🔴 跳頁框是 <input list> + <datalist>：自動完成由瀏覽器做，不自己寫下拉選單。
   沒有 JS 的時候它仍然是一個可以打字的輸入框，而完整索引就在同一頁上。 */
.coin-find{margin:1.6rem 0 2rem;padding:0}
.coin-find label{display:block;font-family:var(--font-mono);font-size:var(--t0);
  letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);margin-bottom:.45rem}
.coin-find input{width:100%;max-width:22rem;padding:.55rem .7rem;background:var(--paper-2);
  border:1px solid var(--rule-2);border-radius:0;color:var(--ink);
  font-family:var(--font-mono);font-size:var(--t1);letter-spacing:.04em}
.coin-find input:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent)}
.coin-find p{margin:.5rem 0 0;max-width:var(--measure)}

/* 榜單兩欄。每張榜自己是一個 section，欄內不切斷。 */
.boards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.6rem 1.8rem;margin:1.6rem 0 2.4rem}
@media (max-width:820px){.boards{grid-template-columns:1fr}}
.board h3{margin:0 0 .2rem}
.board-what{margin:.2rem 0 .7rem;color:var(--ink-2);font-size:var(--t1);line-height:1.6}
.board .coin-table{width:100%}
.board .coin-table td,.board .coin-table th{padding:.32rem .5rem .32rem 0}
.board .coin-table .r{text-align:right}

/* 年份分組改成可收合：連結全部留在 DOM 裡，只是預設不佔版面。 */
details.coin-year{border-top:1px solid var(--rule);margin:0}
details.coin-year > summary{cursor:pointer;padding:.6rem 0;font-family:var(--font-ui);
  font-weight:600;font-size:var(--t2);list-style:revert}
details.coin-year > summary:hover{color:var(--accent)}
details.coin-year[open] > summary{color:var(--ink)}
details.coin-year .coin-grid{margin:.2rem 0 1rem}
