/* 全球鐘擺：乙「刻度盤」（10-17 使用者選定）。刊頭（頁首＋首屏）日＝象牙星圖＋白瓷錶盤、夜＝夜藍星空＋深藍錶盤；
   內文日＝象牙紙、夜＝深夜藍；插畫日夜各一張。冷熱兩端同明度（design/trial/palette.py），黃銅＝結構，午夜藍＝墨。
   CSP 嚴格：沒有行內樣式，位置都寫在 SVG 屬性裡；這裡只管外觀。 */
:root{
  --bg:#F3F0E8; --surface:#FAF8F2; --surface-2:#ECE7DB; --ink:#101B30; --ink-2:#26324B; --muted:#545E73; --line:#D7D1C2; --line-2:#BFB6A3;
  --brass:#9C7A3A; --brass-hi:#C9A45C; --brass-ink:#826324; --arc:#8E8570; --link:#101B30; --bob-edge:#3D4C63; --ring:#101B30;
  --c2:#067FB3; --c1:#79B7E5; --n0:#ACB1B6; --h1:#E2A461; --h2:#AB6701; --on-lv:#0D1729;
  --bar-a:#101B30; --bar-b:#B9B1A0; --hatch:#9C7A3A; --halo:rgba(16,27,48,.14); --tip-shadow:rgba(16,27,48,.12);
  --lg-brass:#9e7c3c; --lg-cold:#3d74ad; --lg-hot:#c27f27;  /* logo（C 版：量擺幅的錶盤）的三色 */
  /* 刊頭（日）：象牙星圖 */
  --m-base:#EEE8DA; --m-img:url(img/hero_day.webp);
  /* 淡出到頁面底色的那層放最上面：刊頭最底一列才會剛好是 --bg（10-18 評圖：夜間底緣有 ΔE 2.5 的接縫） */
  --m-ov:linear-gradient(180deg,rgba(243,240,232,.75) 0,rgba(243,240,232,0) 120px,rgba(243,240,232,0) 72%,var(--bg) 100%),
         linear-gradient(90deg,rgba(243,240,232,.97) 0%,rgba(243,240,232,.9) 34%,rgba(243,240,232,.42) 60%,rgba(243,240,232,.55) 100%);
  --m-ov1:linear-gradient(180deg,rgba(243,240,232,.93),rgba(243,240,232,.85) 45%,var(--bg));
  --m-ink:#101B30; --m-ink2:#26324B; --m-muted:#4C576C; --m-accent:#7A5C1F; --m-kick:#7A5C1F;
  --m-line:rgba(16,27,48,.16); --m-chip:rgba(255,255,255,.55); --m-chip-line:rgba(16,27,48,.26); --m-btn-line:rgba(16,27,48,.42);
  --m-scrim:rgba(243,240,232,.9); --m-scheme:light; --m-pop:#FAF8F2;
  /* 錶盤（日）：白瓷面、墨色刻度、暖色陰影 */
  --d-f0:#FFFDF8; --d-f1:#F8F3E8; --d-f2:#ECE4D2; --d-gl:#CDBF9F; --d-ink:#101B30; --d-muted:#4C576C; --d-orb:#B3A688;
  --d-rod:#6B5420; --d-rod-op:.42; --d-halo:#5A4A2A; --d-halo-op:.2; --bob-line:#26324B; --bobn:#0D1729;
  --hc2:#288CC1; --hc1:#79B7E5; --hn0:#ACB1B6; --hh1:#E2A461; --hh2:#BA7415;
  /* GP Fill＝各語字型缺的字（语言選單的「简」、人名的 š、別的語言頁面上照錄的繁中原文），engine/fonts.py 依頁面算出來 */
  --f-display:"GP Serif","GP Fill","Noto Serif TC","Songti TC","PMingLiU",serif; --f-head:var(--f-display);
  --f-body:"GP Sans","GP Fill","Noto Sans TC","PingFang TC","Microsoft JhengHei",system-ui,sans-serif;
  --f-num:"GP Num","GP Sans","GP Fill","Source Serif 4",Georgia,"Times New Roman",serif;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#0B1220; --surface:#111B2E; --surface-2:#16233A; --ink:#ECE5D3; --ink-2:#DCD4C1; --muted:#A4AEC0; --line:#24324A; --line-2:#33445F;
  --brass:#C9A45C; --brass-hi:#DDBB75; --brass-ink:#C9A45C; --arc:#5A6D8C; --link:#ECE5D3; --bob-edge:#0B1220; --ring:#ECE5D3;
  --c2:#0C9AD8; --c1:#99CCF5; --n0:#A1A6AB; --h1:#F8BA7A; --h2:#CB801D;
  --bar-a:#ECE5D3; --bar-b:#8A8578; --hatch:#C9A45C; --halo:rgba(236,229,211,.16); --tip-shadow:rgba(0,0,0,.4);
  --lg-brass:#C9A45C; --lg-cold:#5b93cf; --lg-hot:#d9923a;
  --m-base:#0D1729; --m-img:url(img/hero_bg.webp);
  --m-ov:linear-gradient(180deg,rgba(13,23,41,.8) 0,rgba(13,23,41,0) 120px,rgba(13,23,41,0) 72%,var(--bg) 100%),
         linear-gradient(90deg,rgba(13,23,41,.95) 0%,rgba(13,23,41,.86) 34%,rgba(13,23,41,.46) 60%,rgba(13,23,41,.6) 100%);
  --m-ov1:linear-gradient(180deg,rgba(13,23,41,.9),rgba(13,23,41,.82) 45%,var(--bg));
  --m-ink:#EFE6D1; --m-ink2:#E3DCCB; --m-muted:#A9B7CC; --m-accent:#F3D9A6; --m-kick:#C9A45C;
  --m-line:rgba(239,230,209,.18); --m-chip:rgba(239,230,209,.06); --m-chip-line:rgba(239,230,209,.3); --m-btn-line:rgba(239,230,209,.46);
  --m-scrim:rgba(11,19,34,.86); --m-scheme:dark; --m-pop:#111B2E;
  --d-f0:#1B3354; --d-f1:#12233D; --d-f2:#0D1A2E; --d-gl:#2E4262; --d-ink:#EFE6D1; --d-muted:#A9B7CC; --d-orb:#3A5070;
  --d-rod:#C9A45C; --d-rod-op:.34; --d-halo:#050B16; --d-halo-op:.9; --bob-line:#0D1729; --bobn:#0D1729;
  --hc2:#0C9AD8; --hc1:#99CCF5; --hn0:#A1A6AB; --hh1:#F8BA7A; --hh2:#CB801D; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0B1220; --surface:#111B2E; --surface-2:#16233A; --ink:#ECE5D3; --ink-2:#DCD4C1; --muted:#A4AEC0; --line:#24324A; --line-2:#33445F;
  --brass:#C9A45C; --brass-hi:#DDBB75; --brass-ink:#C9A45C; --arc:#5A6D8C; --link:#ECE5D3; --bob-edge:#0B1220; --ring:#ECE5D3;
  --c2:#0C9AD8; --c1:#99CCF5; --n0:#A1A6AB; --h1:#F8BA7A; --h2:#CB801D;
  --bar-a:#ECE5D3; --bar-b:#8A8578; --hatch:#C9A45C; --halo:rgba(236,229,211,.16); --tip-shadow:rgba(0,0,0,.4);
  --lg-brass:#C9A45C; --lg-cold:#5b93cf; --lg-hot:#d9923a;
  --m-base:#0D1729; --m-img:url(img/hero_bg.webp);
  --m-ov:linear-gradient(180deg,rgba(13,23,41,.8) 0,rgba(13,23,41,0) 120px,rgba(13,23,41,0) 72%,var(--bg) 100%),
         linear-gradient(90deg,rgba(13,23,41,.95) 0%,rgba(13,23,41,.86) 34%,rgba(13,23,41,.46) 60%,rgba(13,23,41,.6) 100%);
  --m-ov1:linear-gradient(180deg,rgba(13,23,41,.9),rgba(13,23,41,.82) 45%,var(--bg));
  --m-ink:#EFE6D1; --m-ink2:#E3DCCB; --m-muted:#A9B7CC; --m-accent:#F3D9A6; --m-kick:#C9A45C;
  --m-line:rgba(239,230,209,.18); --m-chip:rgba(239,230,209,.06); --m-chip-line:rgba(239,230,209,.3); --m-btn-line:rgba(239,230,209,.46);
  --m-scrim:rgba(11,19,34,.86); --m-scheme:dark; --m-pop:#111B2E;
  --d-f0:#1B3354; --d-f1:#12233D; --d-f2:#0D1A2E; --d-gl:#2E4262; --d-ink:#EFE6D1; --d-muted:#A9B7CC; --d-orb:#3A5070;
  --d-rod:#C9A45C; --d-rod-op:.34; --d-halo:#050B16; --d-halo-op:.9; --bob-line:#0D1729; --bobn:#0D1729;
  --hc2:#0C9AD8; --hc1:#99CCF5; --hn0:#A1A6AB; --hh1:#F8BA7A; --hh2:#CB801D; color-scheme:dark}
html[lang="ja"]{--f-display:"GP Serif","GP Fill","Noto Serif JP","Hiragino Mincho ProN",serif;--f-body:"GP Sans","GP Fill","Noto Sans JP","Hiragino Sans","Yu Gothic",system-ui,sans-serif}
html[lang="zh-Hans"]{--f-display:"GP Serif","GP Fill","Noto Serif SC","Songti SC",serif;--f-body:"GP Sans","GP Fill","Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif}
html[lang="en"]{--f-display:"GP Serif","GP Fill","Source Serif 4",Georgia,serif;--f-body:"GP Sans","GP Fill","Source Sans 3","Segoe UI",system-ui,sans-serif}
html:not([lang="zh-Hant"]) body [lang="zh-Hant"]{font-family:"GP Fill",var(--f-body)}  /* 別的語言頁面上照錄的繁中原文：用繁中字形 */

/* ---------- 基本 ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.8 var(--f-body);font-kerning:normal;-webkit-font-smoothing:antialiased}
html[lang="en"] body{font-size:17.5px;line-height:1.65}
p,li,dd,td{text-wrap:pretty}  /* td：方法頁出處表最後一行不剩一個字（第三輪評圖 P2-7） */
.gut{padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.in{max-width:1240px;margin-inline:auto;width:100%}
a{color:inherit;text-underline-offset:.24em;text-decoration-thickness:1px;text-decoration-color:var(--brass)}
a:hover{text-decoration-thickness:2px;text-decoration-color:var(--brass-hi)}
a,button,summary,input{-webkit-tap-highlight-color:rgba(201,164,92,.25)}
:focus-visible{outline:2px solid var(--ring);outline-offset:3px;border-radius:2px}  /* 黃銅框在日間只有 2:1，改用墨色／象牙（日夜都 ≥7） */
img{max-width:100%}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.skip{position:absolute;left:12px;top:-80px;z-index:10;padding:8px 14px;border-radius:4px;background:#F3D9A6;color:#0D1729;font-weight:500;text-decoration:none}
.skip:focus{top:12px}
[hidden]{display:none!important}
.nw{white-space:nowrap}
.sec{scroll-margin-top:24px}
.c2{--lv:var(--c2)} .c1{--lv:var(--c1)} .n0{--lv:var(--n0)} .h1{--lv:var(--h1)} .h2{--lv:var(--h2)}
.mast .c2{--lv:var(--hc2)} .mast .c1{--lv:var(--hc1)} .mast .n0{--lv:var(--hn0)} .mast .h1{--lv:var(--hh1)} .mast .h2{--lv:var(--hh2)}
.ico{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* ---------- 刊頭：頁首＋首屏共用一塊星圖底；圖的邊緣、字底下、頁首都淡出（字不壓在雕版線上） ---------- */
.mast{position:relative;z-index:2;display:flex;flex-direction:column;min-height:min(94vh,900px);color:var(--m-ink);background:var(--m-base);overflow:hidden;isolation:isolate}
@supports (overflow:clip){.mast{overflow-x:clip;overflow-y:visible}}  /* 只裁左右（刻度盤光暈、讀數的霧）：頁首的音樂面板、語言選單往下展開時不會被短刊頭切掉；不支援 clip 的舊瀏覽器照舊整個裁（不寫在同一條：它們會把 visible 算成 auto，刊頭變成可捲動） */
.mast::before{content:"";position:absolute;inset:0;z-index:-2;background:var(--m-img) right center/cover no-repeat;
  -webkit-mask-image:radial-gradient(ellipse 58% 80% at 74% 52%,#000 38%,rgba(0,0,0,.4) 72%,transparent 100%);
  mask-image:radial-gradient(ellipse 58% 80% at 74% 52%,#000 38%,rgba(0,0,0,.4) 72%,transparent 100%)}
.mast::after{content:"";position:absolute;inset:0;z-index:-1;background:var(--m-ov)}
.mast.subm{min-height:0}
.mast.subm::before{opacity:.55;-webkit-mask-image:linear-gradient(90deg,transparent 18%,#000 70%);mask-image:linear-gradient(90deg,transparent 18%,#000 70%)}
.top{position:relative;z-index:3}
.top .in{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:12px 28px;padding-block:18px}
.brand{display:flex;align-items:center;gap:12px;margin-right:auto;text-decoration:none;color:inherit}
.brand svg{flex:none;--brass:var(--lg-brass);--cold:var(--lg-cold);--hot:var(--lg-hot)}
.brand .zh{font:900 22px/1 var(--f-display);letter-spacing:.1em}
html[lang="en"] .brand .zh{font-weight:700;letter-spacing:.02em;font-size:23px}
.brand:hover .zh{color:var(--m-accent)}
.brand .en{display:block;font:600 9.5px/1.4 var(--f-num);letter-spacing:.34em;opacity:.72;margin-top:5px}
.mnav{display:flex;flex-wrap:wrap;gap:4px 22px;font-size:15px}
.mnav a{text-decoration:none;opacity:.86;white-space:nowrap;padding-block:4px}
.mnav a:hover{opacity:1;text-decoration:underline;text-decoration-color:var(--brass-hi);text-underline-offset:6px}
.mnav a[aria-current="page"]{opacity:1;text-decoration:underline;text-decoration-color:var(--brass);text-decoration-thickness:2px;text-underline-offset:6px}
.tools{display:flex;gap:8px;align-items:center}
.tbtn,.lang summary{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:36px;min-height:36px;color:var(--m-ink);background:var(--m-chip);border:1px solid var(--m-chip-line);border-radius:999px;cursor:pointer;touch-action:manipulation}
.tbtn{padding:0 9px}
.tbtn:hover,.lang summary:hover{border-color:var(--brass-hi)}
/* 背景音樂面板（照《靜水》：可選曲、播放／暫停、下一首、可關；使用者 10-18）：對齊頁首右緣往下展開，手機也不超出畫面 */
.mus summary{list-style:none}
.mus summary::-webkit-details-marker{display:none}
.mus.off summary .ico{opacity:.45}
.mus.playing summary{border-color:var(--brass-hi);color:var(--m-accent)}
.mpop{position:absolute;right:0;top:calc(100% - 8px);z-index:20;width:min(340px,calc(100vw - 32px));display:grid;gap:10px;padding:14px 14px 12px;border:1px solid var(--m-chip-line);border-radius:12px;background:var(--m-pop);color:var(--m-ink);box-shadow:0 10px 30px rgba(0,0,0,.18)}
.mpop p{margin:0}
.mpop .mh{font:600 13px/1.5 var(--f-body);letter-spacing:.06em;color:var(--m-muted)}
.mtr{margin:0;padding:0;list-style:none;display:grid;gap:2px}
.mtr button{width:100%;display:flex;justify-content:space-between;align-items:baseline;gap:12px;min-height:40px;padding:8px 10px;border:0;border-radius:8px;background:none;color:var(--m-ink);font:500 15px/1.4 var(--f-body);text-align:left;cursor:pointer;touch-action:manipulation}
.mtr button:hover{background:var(--m-chip)}
.mtr em{flex:0 1 auto;min-width:0;text-align:right;font-style:normal;font-size:12.5px;color:var(--m-muted)}
.mtr button > span{white-space:nowrap}  /* 曲名不拆（日文「〈灯のもとで〉」曾拆成「…／で〉」，第三輪量測）；放不下時讓樂器說明換行 */
.mtr button[aria-current="true"]{color:var(--m-accent);font-weight:600;box-shadow:inset 3px 0 0 var(--brass)}
.mctl{display:flex;gap:8px}
.pbtn{flex:1 1 0;min-height:42px;border-radius:999px;border:1px solid var(--m-chip-line);background:transparent;color:var(--m-ink);font:500 14px var(--f-body);cursor:pointer;touch-action:manipulation}
.pbtn:hover{border-color:var(--brass-hi)}
.mnote{font-size:12.5px;line-height:1.6;color:var(--m-muted);text-wrap:balance}
.mnote a{color:inherit;text-underline-offset:3px}
.lang{position:relative}
.lang summary{list-style:none;padding:0 12px 0 10px;font:500 13px/1 var(--f-body)}
.lang summary::-webkit-details-marker{display:none}
.lang ul{position:absolute;right:0;top:calc(100% + 8px);z-index:20;margin:0;padding:6px;list-style:none;min-width:132px;border:1px solid var(--m-chip-line);border-radius:10px;background:var(--m-pop);color:var(--m-ink);box-shadow:0 10px 30px rgba(0,0,0,.18)}
.lang li a{display:block;padding:9px 12px;border-radius:6px;text-decoration:none;font-size:14.5px}
.lang li a:hover{background:var(--m-chip)}
.lang li a[aria-current="true"]{font-weight:600;color:var(--m-accent)}
.mbtn,.mlang{display:none}  /* 手機主選單的按鈕與語言列：只在 879px 以下、有程式時出現 */

/* ---------- 首頁首屏 ---------- */
.hero{flex:1;display:flex;align-items:center}
.hero .in{display:grid;grid-template-columns:minmax(0,1fr);gap:28px 52px;align-items:center;padding-block:24px 64px}
.kick{margin:0;font:500 13px/1.6 var(--f-body);letter-spacing:.18em;color:var(--m-kick)}
html[lang="en"] .kick{letter-spacing:.08em;text-transform:uppercase;font-size:12.5px}
.hero h1{margin:8px 0 0;font:900 clamp(32px,9.6vw,58px)/1.16 var(--f-display);letter-spacing:.05em;text-wrap:balance;word-break:keep-all;overflow-wrap:anywhere}
html[lang="ja"] .hero h1{letter-spacing:.02em}  /* 日文斷行只落在譯稿裡的 ​ 與標點（keep-all），不會把「と市場は」拆開 */
html[lang="ja"] .stat span{word-break:keep-all;overflow-wrap:anywhere}
@media (min-width:1024px){html[lang="ja"] .hero.home h1{font-size:min(46px,9.1cqi)}html[lang="ja"] .hero.home h1 .l2{font-size:1.18em}}  /* 第二行 9 字×1.18×1.02＝10.8em 是上限 */
html[lang="en"] .hero h1{font-weight:700;letter-spacing:0;line-height:1.08}
.hero h1 span{display:block}
.hero h1 .l2{font-size:1.3em;color:var(--m-accent)}
@media (min-width:1024px){.hero.home .in{grid-template-columns:minmax(0,.8fr) minmax(0,1.3fr);column-gap:40px;align-items:start}.hero.home .txt{padding-top:clamp(40px,7vh,96px)}.hero h1{font-size:clamp(44px,4.2vw,58px)}
  /* 首頁標題跟著左欄寬度走（cqi＝左欄寬的 1%）：「全球經濟及市場，」8 字含字距 8.4em 一定放得下一行；
     不然 keep-all 整句當一個字、溢出時 overflow-wrap 會把句末逗號單獨擠到下一行（10-18 實測） */
  .hero.home .txt{container-type:inline-size}
  .hero.home h1{font-size:min(58px,11.4cqi)}
  html[lang="en"] .hero.home h1{font-size:min(58px,13cqi)}}
.hero .sub{margin:20px 0 0;font-size:18px;line-height:1.85;max-width:34em;color:var(--m-ink2)}
html[lang="en"] .hero .sub{line-height:1.6}  /* 英文行高 1.85 太鬆（內文是 1.65） */
.hero .sub,.subh .reading{text-wrap:balance}  /* 首屏與刊頭的說明：各行等長，最後一行不會只剩兩三個字（10-18 評圖 P2-3） */
.hero .sub + .sub{margin-top:12px}
.cta{display:flex;flex-wrap:wrap;gap:12px 14px;margin-top:28px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;padding:12px 24px;min-height:46px;font-weight:500;text-decoration:none;cursor:pointer;touch-action:manipulation}
.btn.pri{background:#C9A45C;color:#0D1729}
.btn.pri:hover{background:#D6B46E}
.btn.sec{border:1px solid var(--m-btn-line);color:var(--m-ink)}
.btn.sec:hover{border-color:var(--m-ink)}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 16px;margin-top:30px;padding-top:18px;border-top:1px solid var(--m-line);max-width:520px}
.stat{display:grid;gap:0;align-content:start}
.stat b{font:600 30px/1.1 var(--f-num);font-variant-numeric:lining-nums tabular-nums}
.stat span{font-size:13px;line-height:1.5;color:var(--m-muted);letter-spacing:.04em;text-wrap:balance}  /* 英文「Hot and／warm」不留孤字 */
.sw{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--lv);box-shadow:0 0 0 1px var(--bob-line);margin-right:6px;vertical-align:0}
.stat.x{padding-left:16px;border-left:1px solid var(--m-line)}
html:is([lang="zh-Hant"],[lang="zh-Hans"]) .stat span{word-break:keep-all;overflow-wrap:anywhere}  /* 「其中​擺到兩端」只在零寬空格換行 */
html[lang="en"] .stat span{letter-spacing:0}
.prdef{margin:16px 0 0;max-width:36em;font-size:14px;line-height:1.75;color:var(--m-ink2)}
.prdef b{margin-right:8px;font-weight:700;letter-spacing:.12em;color:var(--m-kick)}
.src{margin:12px 0 0;font-size:13px;color:var(--m-muted)}

/* ---------- 刻度盤 ---------- */
.dialcol{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;min-width:0}
.dialfig{margin:0;display:grid;gap:0;min-width:0}
.dial{display:block;width:100%;height:auto;overflow:visible}
.dial.mb{display:none}
.dial .f0{stop-color:var(--d-f0)} .dial .f1{stop-color:var(--d-f1)} .dial .f2{stop-color:var(--d-f2)}
.dial .halo{fill:var(--d-halo);opacity:var(--d-halo-op)}
.dial .gl{fill:none;stroke:var(--d-gl);stroke-width:.7;opacity:.5}
.dial .rim{fill:none;stroke-width:5}
.dial .rim2{fill:none;stroke:#8E6E35;stroke-width:1}
.dial .band{fill:none;stroke-width:7}
.dial .band.c2{stroke:var(--hc2)} .dial .band.c1{stroke:var(--hc1)} .dial .band.n0{stroke:var(--hn0)} .dial .band.h1{stroke:var(--hh1)} .dial .band.h2{stroke:var(--hh2)}
.dial .tk{stroke:var(--d-ink);stroke-linecap:round}
.dial .tk.mn{opacity:.7}
.dial .num{fill:var(--d-ink);font:600 18px var(--f-num);text-anchor:middle;font-variant-numeric:lining-nums}
.dial .orb{fill:none;stroke:var(--d-orb);stroke-width:1;stroke-dasharray:2 5}
.dial .olab{fill:var(--d-muted);font:500 18.5px var(--f-body);letter-spacing:.14em;text-anchor:end;paint-order:stroke;stroke:var(--m-base);stroke-width:4px;stroke-linejoin:round}  /* 外框寬度 site.py olab_rects()（OLAB_FS）估的，改字級要一起改；描邊＝底色光暈，壓在渾天儀線條上也讀得清（10-18 評圖 P2-10） */
.issdial .olab{stroke:var(--bg)}
html[lang="en"] .dial .olab{letter-spacing:.04em}
.dial .rod{stroke:var(--d-rod);stroke-width:.8;opacity:var(--d-rod-op)}
.dial .plumb{stroke:var(--d-muted);stroke-width:1;stroke-dasharray:3 5;opacity:.6}
.dial .ring{fill:none;stroke:var(--d-ink);stroke-width:1.5}
.dial .ring.off{display:none}
.dial .bob{fill:var(--lv);stroke:var(--bob-line);stroke-width:1.2}
.dial .bobn{fill:var(--bobn);font:600 16px var(--f-num);text-anchor:middle;font-variant-numeric:lining-nums tabular-nums;pointer-events:none}
.dial .mrod{stroke:var(--d-ink);stroke-width:3.4;stroke-linecap:round}
.dial .mbob{fill:var(--lv);stroke:#B08A47;stroke-width:3.2}
.dial .pv{stroke:#5E4820;stroke-width:1}
.dial .pv2{fill:#0D1729}
:is(.dial,.issdial,.explain,.lkmap,.lkkey) .c2{--lv:var(--hc2)} :is(.dial,.issdial,.explain,.lkmap,.lkkey) .c1{--lv:var(--hc1)} :is(.dial,.issdial,.explain,.lkmap,.lkkey) .n0{--lv:var(--hn0)} :is(.dial,.issdial,.explain,.lkmap,.lkkey) .h1{--lv:var(--hh1)} :is(.dial,.issdial,.explain,.lkmap,.lkkey) .h2{--lv:var(--hh2)}  /* 刻度盤在哪一頁都用錶盤那一組色 */
.issdial{margin:0 auto 28px;width:100%;max-width:720px;display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
.issdial .dlegend::before{content:none}
.isslg{display:none;margin:0 0 4px;font-size:12.5px;letter-spacing:.04em;color:var(--muted)}  /* 手機才出現（表頭收起時的欄名） */  /* 那層霧是給刊頭底圖用的：在一般頁面上左右各多出 12%，會把頁面撐寬（10-18 掃描） */  /* 每期重點：這一期的刻度盤快照（要給欄寬，不然 SVG 退回 300px 預設寬） */
.dial.mb .bobn{font-size:36px}  /* 手機擺錘編號：320 寬約 11px（使用者 10-18：「手機刻度盤的擺錘要加編號。要」） */
.dial.mb .band{stroke-width:12} .dial.mb .num{font-size:36px} .dial.mb .rod{stroke-width:1.4} .dial.mb .ring{stroke-width:2.6}
.dial.mb .plumb{stroke-width:1.6} .dial.mb .mrod{stroke-width:6} .dial.mb .bob{stroke-width:2} .dial.mb .mbob{stroke-width:5}
@media (max-width:599px){.dial.dk,.dk-only{display:none}.dial.mb{display:block}}
/* 讀數：刻在錶盤弧線下方，不用框 */
.readout{position:relative;display:grid;justify-items:center;gap:0;margin-top:-4px;text-align:center}
/* 讀數與圖例壓在底圖（渾天儀）上：後面墊一層四邊淡出的霧，沒有邊、不是框 */
.readout::before,.dlegend::before{content:"";position:absolute;inset:-14px -12%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,var(--m-scrim) 62%,transparent)}
.readout .rm{font:600 15px/1.3 var(--f-num);font-variant-numeric:lining-nums tabular-nums;color:var(--m-accent);letter-spacing:.04em}
.readout .rv{display:flex;align-items:center;gap:12px}
.readout b{font:600 52px/1 var(--f-num);font-variant-numeric:lining-nums tabular-nums;color:var(--m-ink)}  /* 大數字用墨色：冷的讀數不能穿暖色，冷熱交給旁邊的圓點 */
.readout .rl{margin-top:4px;font-size:13.5px;letter-spacing:.1em;color:var(--m-ink2)}
.readout .rd{font-size:12.5px;letter-spacing:.06em;color:var(--m-muted)}
.dlegend{position:relative;margin:0;font-size:13px;color:var(--m-ink2);display:flex;flex-wrap:wrap;justify-content:center;gap:4px 14px;align-items:center}
.dlegend .rg{display:inline-block;width:10px;height:10px;border-radius:50%;border:1.5px solid var(--m-ink);margin-right:6px;vertical-align:0}
/* 互動：擺錘繞支點擺到新位置，像有重量；中位數那支更重、擺得慢一點；只回應讀者自己的操作 */
/* 旋轉中心只在 tm.js 接手（.live：改用 CSS transform）之後才設：沒有程式時（每期重點的快照、程式還沒跑的第一個畫面）
   用的是 SVG 的 rotate(角度 x y) 屬性，CSS 的 transform-origin 也會套上去，擺錘會轉到錯的地方（10-18 實測） */
.dial.live .pend,.dial.live .rod,.dial.live .mrod,.dial.live .mpend{transform-box:view-box;transform-origin:380px 36px}
.dial.live .bobn{transform-box:fill-box;transform-origin:center}
.dial .pend,.dial .rod,.dial .bobn{transition:transform .9s cubic-bezier(.3,1.22,.5,1),opacity .3s}
.dial .mrod,.dial .mpend{transition:transform 1.15s cubic-bezier(.3,1.18,.5,1)}
.dial.still *{transition:none!important}
.dialcol.playing .dial :is(.pend,.rod,.bobn,.mrod,.mpend){transition-duration:.2s;transition-timing-function:linear}
.dial .gone{opacity:0;visibility:hidden}
.dial .pend{outline:none}
.dial.live .pend{cursor:pointer}  /* 只有程式接手（可以按）時才像按鈕：純圖快照、沒有程式時都不變 */
.dial.live .pend:not(.on):hover .bob{stroke:var(--brass);stroke-width:2}
.dial{touch-action:manipulation;-webkit-tap-highlight-color:transparent}  /* 點擊掛在整張盤上：iPhone 不畫預設點擊底色、不等雙擊放大 */
.dial .pend.on .bob{stroke:var(--brass-hi);stroke-width:3.4}
.dial.mb .pend.on .bob{stroke-width:4.5}
.dial .fr{fill:none;stroke:none}  /* 鍵盤焦點環：和「選中」分開，墨色環在盤面上夠清楚 */
.dial .pend:focus-visible .fr{stroke:var(--ring);stroke-width:2.5}
.dial.mb .pend:focus-visible .fr{stroke-width:3.5}
.dial.sel .pend:not(.on):not(.rel):not(:focus-visible){opacity:.26}
.dial.sel .rods{opacity:.4}
.dial .lkl{transition:opacity .25s}
.dial .lkl.wait{opacity:0}
.dial .lkl .ln{fill:none;stroke-width:2.2;stroke-linecap:round}
.dial .lkl .ln.ok{stroke:var(--brass)} .dial .lkl .ln.mid{stroke:var(--brass);stroke-dasharray:8 6} .dial .lkl .ln.none,.dial .lkl .ln.rev{stroke:var(--d-muted);stroke-dasharray:1 6}
.dial .lkl .ah.ok,.dial .lkl .ah.mid{fill:var(--brass)} .dial .lkl .ah.none,.dial .lkl .ah.rev{fill:var(--d-muted)}
.dial.mb .lkl .ln{stroke-width:4}
@media (prefers-reduced-motion:reduce){.dial :is(.pend,.rod,.bobn,.mrod,.mpend,.lkl){transition:none}}

/* ---------- 時光機：記錄器的紙帶，指針就是記錄筆；只是工具，不畫時期陰影 ---------- */
.tm,.pick{position:relative}
.tm::before,.pick::before{content:"";position:absolute;inset:-18px -28px;z-index:-1;pointer-events:none;background:var(--m-scrim);
  -webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent),linear-gradient(transparent,#000 14%,#000 86%,transparent);-webkit-mask-composite:source-in;
  mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent) intersect,linear-gradient(transparent,#000 14%,#000 86%,transparent)}
.tm{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;padding-top:14px;border-top:1px solid var(--m-line);color:var(--m-ink);color-scheme:var(--m-scheme)}
.tm-top{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 16px}
.tm-h{margin:0;font:700 17px/1.4 var(--f-head);letter-spacing:.08em}
.tm-h span{margin-left:12px;font:400 13.5px var(--f-body);letter-spacing:.02em;color:var(--m-muted)}
.tm-now{margin:0;display:flex;align-items:baseline;gap:14px}
.tm output{font:600 18px/1.3 var(--f-num);font-variant-numeric:lining-nums tabular-nums;color:var(--m-accent)}
.tm-back{padding:0;border:0;background:none;color:var(--m-ink);font:500 13.5px var(--f-body);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--brass);cursor:pointer;min-height:32px}
.tm-strip{position:relative;height:64px;border-block:1px solid var(--m-line)}
.tm-spark{position:absolute;top:4px;left:16px;width:calc(100% - 32px);height:calc(100% - 8px)}
.tm-spark .tb{opacity:.18} .tm-spark .tb.c2{fill:var(--hc2)} .tm-spark .tb.c1{fill:var(--hc1)} .tm-spark .tb.n0{fill:var(--hn0)} .tm-spark .tb.h1{fill:var(--hh1)} .tm-spark .tb.h2{fill:var(--hh2)}
.tm-spark .mid{stroke:var(--d-muted);stroke-width:1;stroke-dasharray:3 4;vector-effect:non-scaling-stroke;opacity:.7}
.tm-spark .mk{stroke:var(--brass);stroke-width:1.5;vector-effect:non-scaling-stroke}
.tm-spark .ln{fill:none;stroke:var(--m-ink);stroke-width:1.5;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.tm input[type=range]{position:absolute;inset:0;width:100%;height:100%;margin:0;background:transparent;-webkit-appearance:none;appearance:none;cursor:ew-resize;touch-action:pan-y}
.tm input[type=range]::-webkit-slider-runnable-track{height:100%;background:transparent;border:0}
.tm input[type=range]::-moz-range-track{height:100%;background:transparent;border:0}
/* 指針：一支黃銅記錄筆（細針＋握把），寬 32px 好抓 */
.tm input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:32px;height:64px;border:0;border-radius:0;cursor:grab;
  background:radial-gradient(circle closest-side,#F3D9A6 0 42%,#8E6E35 48% 70%,transparent 76%) center/20px 20px no-repeat,linear-gradient(90deg,transparent 15px,#B08A47 15px 17px,transparent 17px)}
.tm input[type=range]::-moz-range-thumb{width:32px;height:64px;border:0;border-radius:0;cursor:grab;
  background:radial-gradient(circle closest-side,#F3D9A6 0 42%,#8E6E35 48% 70%,transparent 76%) center/20px 20px no-repeat,linear-gradient(90deg,transparent 15px,#B08A47 15px 17px,transparent 17px)}
.tm input[type=range]:focus-visible{outline:2px solid var(--ring);outline-offset:3px}
.tm-back:hover{text-decoration-color:currentColor}
.tm-x{display:block;width:calc(100% - 32px);margin-inline:16px;height:16px;overflow:visible;font:500 12px var(--f-num);fill:var(--m-muted)}
.tm-x text{text-anchor:middle}
.tm-bot{display:flex;align-items:flex-start;gap:12px;container-type:inline-size}
@media (min-width:600px){@container (max-width:683px){.tm-bot .tm-jump{display:grid;grid-template-columns:repeat(3,1fr);flex:1 1 auto}}}  /* 中简：五顆排不進一列（約 684px）時排成 3＋2，不要 4＋1（評圖 P2-7）；三欄等寬、按鈕填滿，鈕距一致（第三輪 P2-8） */
.tm-play{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--brass);background:transparent;color:var(--m-ink);cursor:pointer;touch-action:manipulation}
.tm-play svg{width:18px;height:18px;fill:currentColor}
.tm-play:hover,.tm-jump button:hover{border-color:var(--m-ink)}
.tm-jump{display:flex;flex-wrap:wrap;gap:8px;min-width:0}
.tm-jump button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:0 14px;border-radius:999px;border:1px solid var(--m-chip-line);background:transparent;color:var(--m-ink);font:500 13.5px/1.2 var(--f-body);white-space:nowrap;cursor:pointer;touch-action:manipulation}
.tm-jump b{font:600 14px var(--f-num);font-variant-numeric:lining-nums}
.tm-jump button[aria-pressed=true]{border-color:var(--brass);box-shadow:inset 0 0 0 1px var(--brass)}
.tm-cap{margin:0;font-size:14.5px;line-height:1.75;color:var(--m-ink2)}
.dnote{margin:0;display:flex;flex-wrap:wrap;gap:2px 16px;font-size:13px;line-height:1.6;color:var(--m-muted)}  /* 刻度盤圖示說明：放在時光機下面，首屏只留顏色圖例 */
/* 滑鼠移到擺錘（或鍵盤停在擺錘）時，盤上直接標名稱與數字（tm.js 放位置） */
.dial .hl{pointer-events:none;opacity:0;transition:opacity .12s}
.dial .hl.on{opacity:1}
.dial .hlb{fill:var(--m-pop);stroke:var(--brass);stroke-width:1.2}
.dial .hlt{fill:var(--m-ink);font:600 16px var(--f-body);text-anchor:middle}
.dial .hlt tspan{font-family:var(--f-num);font-variant-numeric:lining-nums tabular-nums}
.dial.mb .hlt{font-size:36px}  /* 320 寬縮到 0.31 倍：36 才 ≥11px */
@media (min-width:600px){html:is([lang="en"],[lang="ja"]) .tm-jump{display:grid;grid-template-columns:repeat(3,1fr);flex:1 1 auto}}  /* 英日的時期名較長：排成 3＋2，不要 4＋1；三欄等寬、按鈕填滿：鈕距一律 8px（第三輪評圖 P2-8：原本照各鈕寬排，鈕距 8～63px 不均） */
@media (max-width:599px){
  .tm-h span{display:none}
  .tm-jump{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-right:28px;padding-block:6px;margin-block:-6px;scroll-padding-inline:0 44px;scroll-snap-type:x mandatory;-webkit-mask:linear-gradient(90deg,#000 calc(100% - 36px),transparent);mask:linear-gradient(90deg,#000 calc(100% - 36px),transparent)}
  .tm-jump::-webkit-scrollbar{display:none}
  .tm-jump button{flex:none;scroll-snap-align:start}  /* 捲動停下時按鈕一律對齊左緣，左邊不會切半顆（10-18 評圖） */
  .tm-cap{font-size:14px}
}
/* 按擺錘：它和誰有關（細線分隔，不用框） */
.pick{display:grid;gap:8px;padding-top:12px;border-top:1px solid var(--brass);color:var(--m-ink);font-size:14.5px;line-height:1.7}
.pick p{margin:0}
.pk-h{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px}
.pk-h b{font:700 20px/1.3 var(--f-head)}
.pk-h span{color:var(--m-ink2)}
.pk-x{margin-left:auto;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--m-chip-line);background:transparent;color:var(--m-ink);font:400 22px/1 var(--f-body);cursor:pointer}
.pk-x:hover{border-color:var(--brass-hi)}
.pk-s,.pk-n{font-size:13.5px;color:var(--m-muted)}
.pk-l{margin:0;padding:0;list-style:none;display:grid}
.pk-l li{display:grid;gap:2px;padding:9px 0;border-top:1px solid var(--m-line)}
.pk-l a{text-decoration-color:var(--brass)}
.pk-l small{font-size:13px;color:var(--m-muted)}
.pk-l .tag{font-size:12.5px;color:var(--m-muted)}
.pick .vd{margin-right:8px}

/* ---------- 子頁的刊頭（右邊一具和首頁刻度盤同一套畫法的小儀表） ---------- */
.hero.subh{flex:0 0 auto}
.hero.subh .in{display:block;padding-block:6px 48px}
.hero.subh .in.withg{display:grid;grid-template-columns:minmax(0,1fr);gap:20px 64px;align-items:end}
@media (min-width:900px){.hero.subh .in.withg{grid-template-columns:minmax(0,1fr) minmax(260px,330px)}}
.gauge{margin:0;position:relative;max-width:330px;width:100%}
.gauge::before{content:"";position:absolute;inset:-18px -26px;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,var(--m-scrim) 60%,transparent)}
.gauge svg{display:block;width:100%;height:auto;overflow:visible}
.gauge .gb{fill:none;stroke-width:8}
.gauge .gb.c2{stroke:var(--hc2)} .gauge .gb.c1{stroke:var(--hc1)} .gauge .gb.n0{stroke:var(--hn0)} .gauge .gb.h1{stroke:var(--hh1)} .gauge .gb.h2{stroke:var(--hh2)}
.gauge .gt{stroke:var(--d-ink);stroke-width:1.2;stroke-linecap:round}
.gauge .gn{fill:var(--m-muted);font:600 13px var(--f-num);text-anchor:middle;font-variant-numeric:lining-nums}  /* 手機儀表縮到 280 寬時 ≥11px（第三輪評圖 P2-9） */
.gauge .gp{stroke:var(--d-muted);stroke-width:1;stroke-dasharray:3 4;opacity:.6}
.gauge .gr{stroke:var(--d-ink);stroke-width:2;stroke-linecap:round}
.gauge .gr.s{stroke-width:1.1;opacity:.75}
.gauge .gk0{stroke:var(--bob-line);stroke-width:5.6;stroke-linecap:butt}  /* 超過五個成員：弧內側的刻痕（底下一條深色當外框）；平頭：同分的往內錯開時，道與道之間看得到空隙 */
.gauge .gk{stroke:var(--lv);stroke-width:3.4;stroke-linecap:butt}
.gauge .gm{stroke:var(--d-ink);stroke-width:3;stroke-linecap:round}
.gauge .gbob,.gauge .gmb{fill:var(--lv);stroke:var(--bob-line);stroke-width:1.2}
.gauge .gmb{stroke:#B08A47;stroke-width:2.6}
.gauge .gx{fill:none;stroke:var(--d-ink);stroke-width:1.4}
.gauge .gpv{fill:#B08A47;stroke:#5E4820;stroke-width:1}
@media (max-width:899px){.gauge{max-width:280px}}
/* 小儀表可以點（site.py gauge、site.js）：滑鼠或鍵盤停在擺錘（刻痕）標名稱與數字，點了進指標頁；觸控第一下先標 */
.gauge .gi{cursor:pointer;outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.gauge .ghit{fill:transparent}
.gauge .ghl{stroke:transparent;stroke-width:14;stroke-linecap:butt}  /* 平頭：不伸進隔壁一道；寬 14 ＜ 相差 3 的鄰居間距的兩倍，點到的一定是自己 */
.gauge .gcap{margin:6px 0 0;font-size:12.5px;line-height:1.5;color:var(--m-muted);text-align:center;text-wrap:balance}
.gauge .gcap .t{display:none}
@media (hover:none){.gauge .gcap .m{display:none}.gauge .gcap .t{display:inline}}
.gauge .gi:hover .gbob,.gauge .gi.on .gbob{stroke:var(--d-ink);stroke-width:2.2}
.gauge .gi:hover .gk0,.gauge .gi.on .gk0{stroke:var(--d-ink);stroke-width:7}
.gauge .gi:focus-visible .gbob,.gauge .gi:focus-visible .gk0{stroke:var(--ring);stroke-width:3}
.gauge .glab{opacity:0;pointer-events:none;transition:opacity .12s}
.gauge .glab.on{opacity:1}
.gauge .glab rect{fill:var(--m-pop);stroke:var(--brass);stroke-width:1}
.gauge .glab text{fill:var(--m-ink);font:600 13px var(--f-body);text-anchor:middle;dominant-baseline:central}
@media (prefers-reduced-motion:reduce){.gauge .glab{transition:none}}
.subh h1{margin:6px 0 0;font:900 clamp(26px,6vw,48px)/1.2 var(--f-display);letter-spacing:.04em;text-wrap:balance;word-break:keep-all;overflow-wrap:anywhere}  /* 最小 26：320 寬「利率與殖利率曲線」一行放得下（第三輪評圖 P2-7） */
html[lang="en"] .subh h1{font-weight:700;letter-spacing:0}
html[lang="ja"] .subh h1{word-break:normal}
.crumb{margin:0 0 12px;font-size:13.5px;color:var(--m-muted);display:flex;flex-wrap:wrap;gap:2px 8px}
.crumb a{color:inherit;text-decoration-color:var(--m-line)}
.crumb a:hover{text-decoration-color:var(--brass-hi)}
.subh .reading{margin:16px 0 0;max-width:40em;font-size:18px;line-height:1.85;color:var(--m-ink2)}
.subh .reading2{margin:6px 0 0;max-width:42em;font-size:15px;color:var(--m-muted)}
.subh .deck{margin:14px 0 0;max-width:40em;font-size:17px;line-height:1.8;color:var(--m-ink2);text-wrap:pretty}  /* 類別頁：標題下先說這一類是什麼 */
/* 類別頁的本期摘要：小標＋（合起來的位置）＋擺到兩端的一項一行＋其他一行（使用者 10-18：「一堆字擠在一起，我很難閱讀」） */
.csum{margin:22px 0 0;max-width:40em}
.csum .rk{margin:0 0 6px;font-size:13px;font-weight:600;letter-spacing:.12em;line-height:1.4;color:var(--m-accent)}
.csum .ccomp{margin:0 0 4px;font-size:17px;line-height:1.7;color:var(--m-ink2)}
.cfacts{margin:0;padding:0;list-style:none;display:grid}
.cfacts li{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"n p" "s s";gap:2px 14px;align-items:baseline;padding:10px 0;border-top:1px solid var(--m-chip-line)}
.cfacts li:last-child{border-bottom:1px solid var(--m-chip-line)}
.cfacts .fn{grid-area:n;font-size:17px;font-weight:600;color:var(--m-ink);min-width:0}
.cfacts .fp{grid-area:p;display:inline-flex;align-items:center;gap:8px;font:600 16px var(--f-num);font-variant-numeric:tabular-nums lining-nums;color:var(--m-ink);white-space:nowrap}
.cfacts .fp .chip{font-family:var(--f-body);font-size:14px;font-weight:500}
.cfacts .fs{grid-area:s;font-size:15px;line-height:1.65;color:var(--m-ink2);text-wrap:pretty}
.csum .crest{margin:10px 0 0;font-size:15.5px;line-height:1.7;color:var(--m-ink2)}
.subh .std,.std{margin:16px 0 0;max-width:40em;font-size:17px;line-height:1.8;color:var(--m-ink2);padding-left:14px;border-left:2px solid var(--brass)}
.ihead{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;max-width:46em}
.reading.big{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;margin-top:18px}
.pcbig{font:900 clamp(30px,5vw,40px)/1.1 var(--f-display);color:var(--m-ink);letter-spacing:.02em}
.xflag{display:inline-flex;align-items:center;gap:6px;font-size:13px;letter-spacing:.06em;color:var(--m-ink)}
td .xflag{margin-left:12px;color:var(--ink)}
.hl li span{max-width:46em}
.xflag::before{content:"";width:9px;height:9px;border-radius:50%;border:1.5px solid currentColor}
.reading.big .chip{font-size:15px}
.mini.big{width:150px;height:98px}
.sep{margin-inline:6px;color:var(--line-2)}
.mast .sep{color:var(--m-line)}

/* ---------- 內文區 ---------- */
main{display:grid;gap:104px;padding-block:88px 24px}
.sec{display:grid;gap:22px;align-content:start}
.eyebrow{margin:0;font:600 12.5px/1.4 var(--f-body);letter-spacing:.2em;color:var(--brass-ink);display:flex;align-items:center;gap:10px;min-width:0;flex-wrap:wrap}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--brass)}
html[lang="en"] .eyebrow{letter-spacing:.1em;text-transform:uppercase;font-size:12px}
h2{margin:0;font:700 clamp(26px,3vw,36px)/1.3 var(--f-head);letter-spacing:.03em;text-wrap:balance;word-break:keep-all;overflow-wrap:anywhere}
h3{margin:0;font:700 20px/1.45 var(--f-head);text-wrap:balance;word-break:keep-all;overflow-wrap:anywhere}
html[lang="ja"] :is(h2,h3){word-break:normal}
html[lang="ja"] :is(h1,h2,h3,.lead){word-break:auto-phrase}
html[lang="ja"] body{word-break:auto-phrase;overflow-wrap:anywhere}  /* 日文內文也照詞組換行（不支援的瀏覽器照一般斷行）：避免「ありませ／ん」「グロー／バル」；anywhere＝放不下時才在詞組中間斷，不會把格子撐寬（第三輪評圖 P1-3：/ja/links/ 320 寬橫捲） */
html:is([lang="zh-Hant"],[lang="zh-Hans"],[lang="ja"]) body{line-break:strict}  /* 行首行尾禁則：「、」「ィ」不落行首（第三輪評圖 P2-7） */
html[lang="en"] :is(h2,h3){letter-spacing:0}
.lead{margin:0;max-width:38em;color:var(--muted)}
.plain{margin:0;max-width:44em}
.note{margin:0;font-size:13.5px;line-height:1.7;color:var(--muted);max-width:52em}
.few{margin:0;padding:12px 16px;border-left:2px solid var(--line-2);font-size:15px;color:var(--muted);max-width:44em}
.split{display:grid;gap:30px 64px;align-items:center}
@media (min-width:960px){.split{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.split.rev > :first-child{order:2}}
.split.top{align-items:start}
.stack{display:grid;gap:18px;align-content:start}
/* 插畫：像銅版畫的壓印框（plate mark） */
.art{margin:0;display:grid;gap:10px}
.plate{display:block;padding:10px;background:var(--surface);border:1px solid var(--line-2);box-shadow:inset 0 0 0 5px var(--surface),inset 0 0 0 6px var(--line)}
.art img{display:block;width:100%;height:auto}
.art .night{display:none}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .art .day{display:none} :root:not([data-theme="light"]) .art .night{display:block}}
:root[data-theme="dark"] .art .day{display:none} :root[data-theme="dark"] .art .night{display:block}
.art figcaption{font-size:12.5px;color:var(--muted);letter-spacing:.04em;font-style:normal}
.morep{margin:0}
.backs{display:grid;gap:12px}
.more{font-weight:500;color:var(--ink);text-decoration:underline;text-decoration-color:var(--brass);text-underline-offset:5px}
.more .go{display:inline-block;margin-left:8px}
.more .go,.cat .go{color:var(--brass);text-decoration:none;transition:transform .2s}
.more:hover .go,.cat:hover .go{transform:translateX(3px)}

/* 冷熱標籤：小圓點＋墨色字（不用底色） */
.chip{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;line-height:1.4;color:var(--ink);white-space:nowrap}
.mast .chip{color:var(--m-ink)}
.chip i,.dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--lv);box-shadow:0 0 0 1px var(--bob-edge);flex:none}
/* 句子裡的小籤：跟著文字字級、基線對齊、是行內文字不是方塊——後面的「，」「；」不會被拆到下一行開頭（10-18 第二輪評圖 P1-C） */
p:not(.big) .chip{display:inline;font-size:1em;line-height:inherit;margin-inline:.2em .05em;vertical-align:baseline}
p:not(.big) .chip i{width:.62em;height:.62em;margin-right:.3em;vertical-align:.02em}
.reading.big .chip{margin:0}
.dot{margin-right:6px;vertical-align:-1px}

/* ---------- 指標列 ---------- */
.rows{list-style:none;margin:0;padding:0;display:grid}
.rows li{border-bottom:1px solid var(--line)}
.row{display:grid;grid-template-columns:auto 46px minmax(0,1fr) auto auto;grid-template-areas:"no g nm pc lw" "no g mt mt mt";gap:0 12px;align-items:center;padding:10px 4px;text-decoration:none;color:inherit;border-radius:4px}
.row:hover{background:var(--surface)}
.row:hover .nm{text-decoration:underline;text-decoration-color:var(--brass);text-underline-offset:4px}
.row .no{grid-area:no;display:inline-grid;place-items:center;width:22px;height:22px;border:1px solid var(--line-2);border-radius:50%;font:600 11px/1 var(--f-num);font-variant-numeric:tabular-nums;color:var(--muted)}
.row .g{grid-area:g}
.row .nm{grid-area:nm;font-weight:500}
html:is([lang="zh-Hant"],[lang="zh-Hans"],[lang="ja"]) .row .nm{word-break:keep-all;overflow-wrap:anywhere}  /* 指標名稱當一個詞：「美債10年殖／利率」「期待インフレ／率」不拆（第三輪評圖 P2-7） */
.row .pc{grid-area:pc;font:600 19px var(--f-num);font-variant-numeric:lining-nums tabular-nums;text-align:right;min-width:2ch}
.row .lw{grid-area:lw;min-width:4.6em}
.row .mt{grid-area:mt;font-size:13px;line-height:1.5;color:var(--muted)}
.rows:not(:has(.no)) .row{grid-template-columns:46px minmax(0,1fr) auto auto;grid-template-areas:"g nm pc lw" "g mt mt mt"}
@media (max-width:480px){.row .mt > .nw{display:block}.row .mt .sep{display:none}}  /* 手機：資料月份另起一行，分隔線「｜」不會落在行首（10-18 第二輪評圖 P2-4） */
.row.hold .pc,.row.hold .nm{color:var(--muted)}
.few.after1 b{margin-right:10px;font-weight:600;color:var(--ink)}
.rows.cols{grid-template-columns:repeat(auto-fill,minmax(min(100%,440px),1fr));column-gap:48px}
.mini{width:46px;height:30px;display:block;overflow:visible}
.mini .a{fill:none;stroke:var(--arc);stroke-width:2}
.mini .p{stroke:var(--brass);stroke-width:1.3}
.mini .b{fill:var(--lv);stroke:var(--bob-edge);stroke-width:1}
.mini .x{fill:none;stroke:var(--ring);stroke-width:1.5}
.mast .mini .a{stroke:var(--d-muted)}

/* ---------- 四股力量（一股一列：左邊清單，右邊走勢） ---------- */
.forces{display:grid;gap:56px}
.force{display:grid;gap:14px;border-top:1px solid var(--line-2);padding-top:18px;min-width:0}
.fh{display:grid;gap:4px}
.fh h3{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;font-size:22px}
.fh h3 small{font:400 14px var(--f-body);color:var(--muted)}
.fr{margin:0;font-size:15px;color:var(--ink-2)}
.fx{display:inline-block;margin-left:14px;font-size:13.5px;color:var(--muted)}
.fb{display:grid;gap:22px 48px;min-width:0}
@media (min-width:1000px){.fb{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}}

/* ---------- 時間軸位置圖 ---------- */
.tl{margin:0;display:grid;gap:4px;min-width:0;align-content:start;outline-offset:6px}
.tl-plot{position:relative;height:210px;margin-left:28px;margin-right:64px;border-bottom:1px solid var(--line-2);touch-action:pan-y;cursor:crosshair;-webkit-user-select:none;user-select:none}
.tl.sm .tl-plot{height:128px}
.tl.xl .tl-plot{height:300px}
.tl-s,.tl-o{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.tl .tb,.sps .tb{opacity:.15}
.tb.c2{fill:var(--c2)} .tb.c1{fill:var(--c1)} .tb.n0{fill:var(--n0)} .tb.h1{fill:var(--h1)} .tb.h2{fill:var(--h2)}
.tl-line{fill:none;stroke-width:1.7;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.tl-line.a{stroke:var(--ink)} .tl-line.b{stroke:var(--brass);stroke-width:2.2}
/* 整體走勢圖疊上指數（site.py tl 的 over、site.js）：按鈕兼圖例；線預設不畫，按了才出現 */
.tl-ovs{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:0 0 14px}
.tl-ovs[hidden]{display:none}
.tl-ovl{font-size:14px;color:var(--muted)}
.tl-ovb{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--line-2);background:transparent;color:var(--ink);font:500 14px var(--f-body);cursor:pointer;touch-action:manipulation}
.tl-ovb i{width:20px;border-top:2.5px solid var(--brass)}
.tl-ovb.o2 i{border-top-style:dashed;border-top-color:var(--brass-ink)}
.tl-ovb:hover{border-color:var(--ink)}
.tl-ovb[aria-pressed="true"]{border-color:var(--brass);box-shadow:inset 0 0 0 1px var(--brass)}
.tl-ovb:focus-visible{outline:2px solid var(--ring);outline-offset:2px}
.tl-ovn{flex-basis:100%;font-size:13px;line-height:1.6;color:var(--muted)}
.tl:not(.o1-on):not(.o2-on) .tl-ovn{display:none}
@media (max-width:599px){.tl-ovl{flex-basis:100%}.tl-ovb{padding:0 12px}}  /* 手機：小標自成一行，兩顆鈕並排 */
.tl-step{display:none;align-items:center;justify-content:center;gap:4px;margin:10px 0 0}  /* 觸控才出現：逐月（季）、逐年移動游標（使用者 10-18） */
@media (hover:none){.tl-step:not([hidden]){display:flex}}
.tl-step button{min-width:44px;min-height:44px;padding:0;border-radius:999px;border:1px solid var(--line-2);background:transparent;color:var(--ink);font:600 18px/1 var(--f-num);cursor:pointer;touch-action:manipulation}
.tl-step button:active{border-color:var(--brass)}
.tl-stepm{min-width:7em;text-align:center;font:500 14px var(--f-num);font-variant-numeric:tabular-nums lining-nums;color:var(--ink-2)}
.tl-ov{display:none;fill:none;stroke-width:2;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.tl-ov.o1{stroke:var(--brass)} .tl-ov.o2{stroke:var(--brass-ink);stroke-dasharray:6 4}
.tl.o1-on .tl-ov.o1,.tl.o2-on .tl-ov.o2{display:inline}
.tl-o .hl{stroke:var(--hatch);stroke-width:1.1;opacity:.75}
.tl-o .ep{opacity:.9}
.tl-o .gl{stroke:var(--ink);stroke-width:1;stroke-dasharray:1 4;opacity:.28}
.tl-o .zl{stroke:var(--ink);stroke-width:1;opacity:.5}
.tl-o .yl{font:500 11.5px var(--f-num);fill:var(--muted);text-anchor:end;font-variant-numeric:tabular-nums}
.tl-o .evl{stroke:var(--brass);stroke-width:1;opacity:.55}
.tl-o .halo{fill:var(--halo)}
.tl-o .dot{fill:var(--lv);stroke:var(--bg);stroke-width:2}
.tl-o .dot.ln-b{stroke:var(--brass);stroke-width:2}
.tl-o .el{font:600 13px var(--f-body);fill:var(--ink)}
.tl-o .el.b{fill:var(--brass-ink)}
.tl-o .ss{font:500 11px var(--f-body);fill:var(--muted)}
.tl-a{display:block;width:calc(100% - 92px);margin-left:28px;height:46px;overflow:visible;font:500 12.5px var(--f-body)}
.tl-a .evt{fill:var(--brass-ink)}
.tl-a .evc{stroke:var(--brass);stroke-width:1;opacity:.55}
.tl-x{display:block;width:calc(100% - 92px);margin-left:28px;height:22px;overflow:visible;font:500 12px var(--f-num)}
.tl-x .xt,.sp-x .xt{stroke:var(--line-2);stroke-width:1}
.tl-x .xl,.sp-x .xl{fill:var(--muted);text-anchor:middle}
.tl .src{margin-top:6px;margin-left:28px;font-size:12.5px;color:var(--muted)}
.tl-key{display:flex;flex-wrap:wrap;gap:4px 18px;margin:0;font-size:13px;color:var(--muted)}
.tl-key .sw{box-shadow:none;opacity:.75}
.tl-key .sw.hx{border-radius:2px;background:repeating-linear-gradient(135deg,var(--hatch) 0 1.2px,transparent 1.2px 4px);opacity:1}
.tl-key .ln{display:inline-block;width:22px;height:0;margin-right:6px;vertical-align:4px;border-top:2px solid var(--ink)}
.tl-key .ln.b{border-top:3px solid var(--brass)}
/* 游標或鍵盤的逐月讀數（site.js 用 CSSOM 移動，不是行內樣式） */
.tl-rule{position:absolute;top:0;bottom:0;border-left:1px solid var(--ink);opacity:.45;pointer-events:none}
.tl-hd{position:absolute;width:11px;height:11px;border-radius:50%;background:var(--lv);box-shadow:0 0 0 2px var(--bg),0 0 0 3.2px var(--ink);transform:translate(-50%,-50%);pointer-events:none}
.tl-hd.b{box-shadow:0 0 0 2px var(--bg),0 0 0 3.2px var(--brass)}
.tl-tip{position:absolute;top:6px;width:max-content;max-width:calc(100vw - 48px);padding:5px 11px;border-radius:4px;background:var(--surface);box-shadow:0 0 0 1px var(--line-2),0 4px 14px var(--tip-shadow);font:500 13px/1.4 var(--f-body);font-variant-numeric:tabular-nums;color:var(--ink);pointer-events:none;z-index:2}
/* 讀數框的左右位置由 site.js 算（游標右邊放不下就放左邊，再不行就貼齊圖框），窄螢幕放不下一行就換行 */

/* ---------- 長條對照表：共用零軸，數字對齊在右欄；長條用墨色，級別看前面的小圓點 ---------- */
.bt{margin:0;display:grid;gap:12px;max-width:640px}
.bt-key{margin:0;display:flex;flex-wrap:wrap;gap:4px 20px;font-size:13px;color:var(--muted)}
.bt-key .k{display:inline-block;width:16px;height:10px;border-radius:2px;margin-right:6px;vertical-align:0}
.bt-key .k.a{background:var(--bar-a)} .bt-key .k.b{background:var(--bar-b)}
.bt-key .dot{width:8px;height:8px;margin-right:4px}
.bt-key .bt-u{flex-basis:100%;color:var(--ink-2)}  /* 先說長條是什麼（10-18 讀者測試：沒寫是中位數） */
.bt-g{display:grid;grid-template-columns:6.4em minmax(0,1fr);gap:4px 14px;align-items:center}
.bt-n{font-size:14px;font-weight:500;line-height:1.35}
.bt-b{display:grid;gap:6px}
.bt-r{display:grid;grid-template-columns:minmax(0,1fr) 10em;gap:12px;align-items:center}
.bt-t{display:block;width:100%;height:16px;overflow:visible}
.bt-t .z{stroke:var(--ink);stroke-width:1;opacity:.6}
.bt-t .a{fill:var(--bar-a)} .bt-t .b{fill:var(--bar-b)} .bt-t :is(.h2,.c2){fill:var(--lv)}  /* 最熱、最冷兩條用名稱前圓點的顏色 */
.bt-v{font:600 14.5px/1.3 var(--f-num);font-variant-numeric:lining-nums tabular-nums;white-space:nowrap;text-align:right}
.bt-v small{margin-left:8px;font:400 12.5px var(--f-body);color:var(--muted)}
@media (max-width:599px){.bt-g{grid-template-columns:minmax(0,1fr)}.bt-r{grid-template-columns:minmax(0,1fr) 9.4em}}

/* ---------- 方向不一致：每個指標一條小走勢（共用時間軸，10 年一格） ---------- */
.sps{margin:0;display:grid;gap:6px;align-content:start}
.sp{display:grid;grid-template-columns:8em minmax(0,1fr) 2.4em;gap:12px;align-items:center}  /* 8em：「美債 10 年殖利率」一行放得下 */
.sp-n{font-size:14px;font-weight:500;line-height:1.3;text-wrap:balance}
/* 名稱只在空格與名稱裡的零寬空格換行（content_zh 的短名稱）：不會斷成「殖利／率」；
   小走勢、關係清單與關係卡的名稱、表格第一欄與表格裡的名稱連結都一樣（10-18 第二輪評圖 P2-3）。break-word 不影響表格欄寬的計算：欄會撐到放得下名稱 */
html:is([lang="zh-Hant"],[lang="zh-Hans"]) :is(.sp-n,.lkl-list b,.lk-h b,table th[scope=row],table td a){word-break:keep-all;overflow-wrap:break-word}
.sp-n small{display:block;font:400 11.5px/1.3 var(--f-body);color:var(--muted)}
.sp-p{position:relative;height:42px;border-bottom:1px solid var(--line-2)}
.sp-v{font:600 15px var(--f-num);font-variant-numeric:lining-nums tabular-nums;text-align:right}
.sp-x{display:block;width:100%;height:18px;overflow:visible;font:500 11.5px var(--f-num)}

/* ---------- 時期列表 ---------- */
.eps{margin:0;padding:0;list-style:none;display:grid}
/* 兩列：起訖與「開始後一年」同一列，說明另起一列（放在半欄裡也不會被擠成一個字一行） */
.eps li{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"when aft" "what what";gap:2px 20px;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--line)}
.eps li>b{grid-area:when}
.eps li>span{grid-area:what}
.eps li>.aft{grid-area:aft}
.eps b{font-weight:600;font-variant-numeric:tabular-nums}
.eps span{font-size:14.5px;color:var(--muted)}
.eps .aft{color:var(--ink);text-align:right;font-variant-numeric:tabular-nums}
/* 開始後 1、2、3 年：三欄對齊，欄名在清單上方一次（site.py ep_list）；桌機格內的「1 年」只給讀屏，手機才顯示 */
.eps-h{display:flex;justify-content:flex-end;align-items:baseline;margin:0;padding:0 0 6px;border-bottom:1px solid var(--line);font-size:13px;color:var(--muted)}
.eps-h span{width:5.4em;text-align:right}
.eps-h span:first-child{width:auto;margin-right:12px}
.eps .aft{display:flex;justify-content:flex-end}
.eps .aft>span{width:5.4em;text-align:right;font-size:15px;color:var(--ink)}
.eps .aft>span.na{font-size:13px;color:var(--muted)}
.eps .aft i{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.eps .aft.one{display:block;font-size:14.5px;color:var(--ink)}

/* ---------- 兩欄問答 ---------- */
.q2{display:grid;gap:40px 64px}
@media (min-width:960px){.q2{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media (min-width:960px) and (max-width:1279px){html:is([lang="en"],[lang="ja"]) .q2{grid-template-columns:minmax(0,1fr)}}  /* 英日的表頭較長：1280 以下兩欄放不下「之後擺到哪」表，改單欄（10-18 第三輪評圖 P1-2） */
.q{display:grid;gap:12px;min-width:0;align-content:start}
.q > p{margin:0}
.qn{display:block;font:600 12.5px/1.6 var(--f-body);letter-spacing:.16em;color:var(--brass-ink);margin-bottom:2px}

/* ---------- 關係卡 ---------- */
/* 關係總覽：拓樸圖（10-18 照《靜水》知識地圖）。線的樣式和首頁按擺錘時的關係線同一套——黃銅實線＝資料支持、黃銅虛線＝偏弱、灰點線＝看不出來或相反；本期亮起的加粗。
   桌機一張橫式、手機一張直式（版面建站時算好，graph_layout.py）；滑鼠移到（手機點）一個指標，只亮它的線，其他淡掉 */
.lkmapw{margin:6px 0 4px}
.lkg{display:block;width:100%;height:auto;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.lkg.mb{display:none;max-width:560px;margin-inline:auto}
@media (max-width:899px){.lkg.dk{display:none}.lkg.mb{display:block}}
.lkmap .ch .cv,.lkkey .ch{fill:none;stroke-width:1.3;opacity:.5}
.lkmap .hit{fill:none;stroke:transparent;stroke-width:14;pointer-events:stroke}  /* 線很細：透明粗線當點擊區 */
.lkmap .ch.ok .cv,.lkkey .ch.ok{stroke:var(--brass)}
.lkmap .ch.mid .cv,.lkkey .ch.mid{stroke:var(--brass);stroke-dasharray:7 5}
.lkmap .ch:is(.none,.rev) .cv,.lkkey .ch:is(.none,.rev){stroke:var(--muted);stroke-dasharray:1 5;stroke-linecap:round}
.lkmap .ch.lit .cv,.lkkey .ch.lit{stroke-width:2.8;opacity:1}
.lkmap .ch.lit:is(.none,.rev) .cv{stroke-width:1.8}  /* 亮起但資料看不出來／相反：不要比資料支持的線還搶眼 */
.lkg.mb .ch .cv{stroke-width:2.2} .lkg.mb .ch.lit .cv{stroke-width:4.4} .lkg.mb .ch.lit:is(.none,.rev) .cv{stroke-width:2.8} .lkg.mb .hit{stroke-width:22}
.lkkey .ch{opacity:1}
.lkmap a.ch:hover .cv{opacity:1;stroke-width:3.4}
.lkmap .ahB{fill:var(--brass)} .lkmap .ahM{fill:var(--muted)}
.lkg .nd-g{cursor:pointer}
.lkg .nd{fill:var(--lv);stroke:var(--bob-line);stroke-width:1.2}
.lkg .nd.na{fill:var(--bg);stroke:var(--muted)}
.lkg text{fill:var(--ink-2);font:500 17px var(--f-body);paint-order:stroke;stroke:var(--bg);stroke-width:5px;stroke-linejoin:round}  /* 名稱描一圈底色：線從後面穿過也讀得清楚 */
.lkg.mb text{font-size:23px;stroke-width:7px}
.lkg .nd-g,.lkg .ch{transition:opacity .15s}
.lkg.foc .ch:not(.on){opacity:.06}
.lkg.foc .ch.on .cv{opacity:1}
.lkg.foc .nd-g:not(.on):not(.nb){opacity:.22}
.lkg .nd-g.on .nd{stroke:var(--brass);stroke-width:3}
.lkg.mb .nd-g.on .nd{stroke-width:4.5}
.lkg .nd-g.on text{fill:var(--ink);font-weight:700}
.litonly .lkg .nd-g:not(.lit){opacity:.3}
@media (prefers-reduced-motion:reduce){.lkg .nd-g,.lkg .ch{transition:none}}
/* 點一個指標後的小卡：上方一條細線，不用框（和關係卡同一種） */
.lkpeek{margin:16px 0 0;padding-top:14px;border-top:1px solid var(--line-2);display:grid;gap:8px;max-width:760px}
.lkpeek p{margin:0}
.lkpeek .pk-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;font:700 18px/1.4 var(--f-head)}
.lkpeek .pk-h span{display:inline-flex;align-items:center;gap:6px;font:500 14.5px var(--f-body);color:var(--ink-2)}
.lkpeek .pk-x{margin-left:auto;min-width:40px;min-height:40px;border:1px solid var(--line-2);border-radius:999px;background:none;color:var(--ink);font:500 18px/1 var(--f-body);cursor:pointer;touch-action:manipulation}
.lkpeek .pk-x:hover{border-color:var(--brass)}
.lkpeek .pk-s{font-size:13px;letter-spacing:.06em;color:var(--muted)}
.lkpeek ul{margin:0;padding:0;list-style:none;display:grid;gap:2px}
.lkpeek li{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 12px;padding:6px 0;border-bottom:1px solid var(--line)}
.lkpeek li a{font-weight:600;text-decoration:none}
.lkpeek li a:hover{text-decoration:underline;text-decoration-color:var(--brass);text-underline-offset:4px}
.lkpeek li .vd{font-size:13px}
.lkpeek li .litm{font-size:12.5px;font-weight:600;color:var(--brass-ink);letter-spacing:.06em}
.lkkey{display:grid;gap:8px;margin:0 0 16px;font-size:13.5px;color:var(--ink-2)}  /* 圖例在圖上方：點一行、線一行 */
.lkkey p{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;margin:0}
.lkkey b{font-weight:600;color:var(--ink)}
.lkkey .sw{margin-right:0}
.lkkey .lkk-fade{display:none}
.litonly .lkkey .lkk-fade{display:inline-flex}
.lkkey span{display:inline-flex;align-items:center;gap:8px}
.lkkey svg{width:30px;height:8px;overflow:visible}
@media (max-width:599px){.lkkey b{flex-basis:100%}}  /* 手機：小標自成一行，圖例項目排在下面 */
.lkfilt{margin:16px 0 0}
.litbtn{display:inline-flex;align-items:center;min-height:42px;padding:0 18px;border-radius:999px;border:1px solid var(--line-2);background:var(--surface);color:var(--ink);font:500 14.5px var(--f-body);cursor:pointer;touch-action:manipulation}
.litbtn:hover{border-color:var(--brass)}
.litbtn[aria-pressed=true]{border-color:var(--brass);box-shadow:inset 0 0 0 1px var(--brass)}
.litonly .lkl-list li:not(.lit),.litonly .lkmap .ch:not(.lit){display:none}
.litonly .sec:has(.lkl-list):not(:has(li.lit,.lks)){display:none}  /* 這一組沒有亮起的：整組收起 */
.lks{display:grid;gap:30px 40px;grid-template-columns:repeat(auto-fill,minmax(min(100%,350px),1fr))}
/* 每一列排滿：桌機 6 格、每張佔 2（三欄）；多 2 張時末列兩張各佔 3，多 1 張時末 4 張排成 2＋2（site.py lks() 加 r0／r1／r2） */
@media (min-width:1080px){
  .lks{grid-template-columns:repeat(6,minmax(0,1fr))}
  .lk{grid-column:span 2}
  .lks.r2 .lk:nth-last-child(-n+2),.lks.r1 .lk:nth-last-child(-n+4){grid-column:span 3}
}
@media (min-width:740px) and (max-width:1079px){.lks.odd .lk:last-child{grid-column:1 / -1}}  /* 兩欄時單數張：最後一張佔滿 */
.lk{display:grid;gap:8px;align-content:start;border-top:1px solid var(--line-2);padding-top:14px;min-width:0}
.lk p{margin:0}
.lk-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 12px;font:700 18px/1.5 var(--f-head)}
.lk-h a{text-decoration:none}
.lk-h a:hover b{text-decoration:underline;text-decoration-color:var(--brass);text-underline-offset:4px}
.lk-h .ar{color:var(--brass)}
.tag{font:500 12.5px var(--f-body);letter-spacing:.06em;color:var(--muted)}
.lk-m,.lk-now{font-size:14.5px;line-height:1.7}
.lk-d{font-size:13.5px;color:var(--muted)}
.lk-sp{font-size:13px;line-height:1.6;color:var(--muted)}  /* 判定和時段結果看起來打架時的一句說明（第三輪評圖 P1-4） */
.vd{display:inline-flex;align-items:center;gap:6px;margin-right:10px;font-weight:600;font-size:13px;color:var(--ink);min-width:0}
.vd-s{color:var(--brass);letter-spacing:.04em;font-size:11px;white-space:nowrap;flex:none}  /* 圓點不拆；文字可以換行：日文「当サイトのデータは一般的な説明と逆」不准換行時約 304px，把 320 寬手機的整頁撐開（第三輪評圖 P1-3） */
.vd.none .vd-s,.vd.rev .vd-s{color:var(--muted)}
/* 關係卡的小尺：因在上、果在下 */
.pg{height:66px;max-width:620px;padding-inline:7px}  /* 兩端的點（半徑 6）和靠邊的標籤不會超出卡片（10-18 第二輪評圖 P2-17） */
.pg svg{display:block;width:100%;height:66px;overflow:visible}
.pg .tb{opacity:.45}
.pg .mid{stroke:var(--ink);stroke-width:1;opacity:.5}
.pg .pd{fill:var(--lv);stroke:var(--bg);stroke-width:2}
.pg .pt{font:500 12.5px var(--f-body);fill:var(--muted)}
.pg .pn{font-weight:600;fill:var(--ink)}

/* ---------- 全部指標的儀器櫃 ---------- */
.cats{display:grid;gap:0 32px;grid-template-columns:repeat(auto-fill,minmax(min(100%,270px),1fr))}
.cat{display:grid;grid-template-columns:52px minmax(0,1fr) auto;grid-template-areas:"m cn go" "m cc go";gap:2px 14px;align-items:center;padding:14px 4px;border-top:1px solid var(--line);text-decoration:none;color:inherit}
.cat:hover{background:var(--surface)}
.medal{grid-area:m;width:52px;height:52px;color:var(--brass)}
.hmark{display:flex;align-items:center;gap:16px;margin-top:6px}  /* 分類頁、指標頁刊頭：標題左邊掛類別圓章 */
.hmark .medal{flex:none;width:58px;height:58px}
.subh .hmark h1{margin:0}
.mast .medal .ico{stroke:var(--m-ink)}
@media (max-width:600px){.hmark{gap:12px}.hmark .medal{width:44px;height:44px}}
.medal .rg{fill:none;stroke:currentColor;stroke-width:1.1}
.medal .tk{stroke:currentColor;stroke-width:1;stroke-linecap:round}
.medal .ico{fill:none;stroke:var(--ink);stroke-width:1.4}
.medal .nd{stroke:var(--brass);stroke-width:1.2;opacity:.8}
.medal .nb{fill:var(--lv);stroke:var(--bob-edge);stroke-width:1}
.cat .cn{grid-area:cn;font:700 16.5px/1.35 var(--f-head)}
.cat:hover .cn{text-decoration:underline;text-decoration-color:var(--brass);text-underline-offset:4px}
.cat .cc{grid-area:cc;font-size:13px;line-height:1.5;color:var(--muted);font-variant-numeric:tabular-nums}
.cat .go{grid-area:go;font-size:18px}
/* 寬螢幕：14 類排成兩層、每層七格的儀器櫃（不留半空的最後一列） */
@media (min-width:1100px){
  .cats{grid-template-columns:repeat(7,minmax(0,1fr));gap:0 20px}
  .cat{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto 1fr;grid-template-areas:"m m" "cn go" "cc cc";align-items:start;align-content:start;gap:6px 6px;padding:18px 2px 18px;border-top:1px solid var(--line-2)}
  .medal{width:56px;height:56px;margin-bottom:6px}
  .cat .cn{font-size:16px}
  .cat .go{font-size:16px;line-height:1.35}
}
.catls{columns:2 460px;column-gap:56px}  /* 報紙式分欄：一類接一類往下排，兩欄不會因為類別長短不同留下大洞（10-18 評圖） */
.catl{display:grid;gap:8px;align-content:start;break-inside:avoid;margin-bottom:40px}
.catl h3{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 12px;padding-bottom:8px;border-bottom:1px solid var(--line-2)}
.catl h3 a{text-decoration-color:var(--brass)}
.catl h3 small{font:400 13px var(--f-body);color:var(--muted)}

/* ---------- 本期重點 ---------- */
.hl{margin:0;padding:0;list-style:none;display:grid;gap:16px;counter-reset:hl}
.hl li{display:grid;grid-template-columns:36px minmax(0,1fr);gap:4px 14px;align-items:start}
.hl li::before{counter-increment:hl;content:counter(hl);grid-row:1/3;font:600 22px/1.3 var(--f-num);color:var(--brass);text-align:center;border-right:1px solid var(--line-2)}
.lead-in{font-weight:700;color:var(--brass-ink);letter-spacing:.06em;font-size:14px}

/* ---------- 冷熱怎麼算 ---------- */
/* 說明圖：和首頁刻度盤同一套畫法；標註是圖上的編號＋下面的清單 */
.explain{width:100%;height:auto;display:block;max-width:600px}
.explain .f0{stop-color:var(--d-f0)} .explain .f1{stop-color:var(--d-f1)} .explain .f2{stop-color:var(--d-f2)}
.explain .band{fill:none;stroke-width:8}
.explain .band.c2{stroke:var(--hc2)} .explain .band.c1{stroke:var(--hc1)} .explain .band.n0{stroke:var(--hn0)} .explain .band.h1{stroke:var(--hh1)} .explain .band.h2{stroke:var(--hh2)}
.explain .xrim{fill:none;stroke:var(--brass);stroke-width:3}
.explain .xtk{stroke:var(--d-ink);stroke-width:1.4;stroke-linecap:round}
.explain .xn{fill:var(--ink);font:600 16px var(--f-num);text-anchor:middle;dominant-baseline:central;font-variant-numeric:lining-nums}
.explain .xn.s{fill:var(--muted);font-size:13px}
.explain .xn.e{text-anchor:end} .explain .xn.st{text-anchor:start}  /* 弧外的數字往外長（site.py explain_svg） */
.explain .xbr{fill:none;stroke:var(--ink);stroke-width:1.6;stroke-linecap:round}
.explain .xplumb{stroke:var(--d-muted);stroke-width:1;stroke-dasharray:3 5;opacity:.7}
.explain .xrod{stroke:var(--d-ink);stroke-width:2.4;stroke-linecap:round}
.explain .xring{fill:none;stroke:var(--d-ink);stroke-width:1.5}
.explain .bob{fill:var(--lv);stroke:var(--bob-line);stroke-width:1.4}
.explain .pivot{fill:var(--brass);stroke:#5E4820;stroke-width:1}
.explain .xm{fill:var(--bg);stroke:var(--brass);stroke-width:1.4}
.explain .xmn{fill:var(--ink);font:600 13px var(--f-num);text-anchor:middle;dominant-baseline:central;font-variant-numeric:lining-nums}
.xkey{list-style:none;margin:0;padding:0;display:grid;gap:8px;max-width:42em;font-size:15.5px;line-height:1.65}
.xkey li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:baseline}
.xkey .xm{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;border:1.4px solid var(--brass);font:600 12.5px/1 var(--f-num);color:var(--ink)}
.howfig{display:grid;gap:18px;justify-items:start;padding-top:6px}
/* 關於：製作說明三張卡（標誌、字型、顏色）與作者 */
.colo{display:grid;gap:26px 36px;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));margin:4px 0 22px}
.co{margin:0;display:grid;gap:12px;align-content:start;padding-top:16px;border-top:1px solid var(--line-2)}  /* 和關係卡同一種：上方一條細線，不用白底框（10-18 第二輪評圖 P2-12） */
.co figcaption{font-size:14.5px;line-height:1.7;color:var(--ink-2);text-wrap:pretty}
.co figcaption b{display:block;margin-bottom:4px;font-size:13px;font-weight:600;letter-spacing:.12em;color:var(--brass-ink)}
.co-logo{width:72px;height:72px;--brass:var(--lg-brass);--cold:var(--lg-cold);--hot:var(--lg-hot)}
.co-type{margin:0;display:flex;gap:18px;align-items:baseline;font-size:34px;line-height:1.1;color:var(--ink)}
.co-type .ts{font-family:var(--f-display);font-weight:900}
.co-type .tb{font-family:var(--f-body);font-weight:500}
.co-type .tn{font-family:var(--f-num);font-weight:600;font-variant-numeric:lining-nums}
.co-sw{margin:0;display:flex;flex-wrap:wrap;gap:10px 8px;align-items:flex-start}
.co-sw span{display:grid;justify-items:center;gap:5px;font-size:12.5px;line-height:1.2;color:var(--ink-2);white-space:nowrap}
.co-sw i{width:26px;height:26px;border-radius:50%;background:var(--lv);box-shadow:0 0 0 1px var(--bob-edge)}
.co-sw .br{flex-basis:100%;display:flex;align-items:center;gap:8px}  /* 黃銅不是第六級：自成一行、標名稱（使用者 10-18：「5級有6種顏色？」） */
.co-sw .br i{background:var(--brass)}
.who{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:start}
.who img{width:64px;height:64px;border-radius:50%}
.who p{margin:0}
.who b{display:block;margin-bottom:2px;font-size:14px;letter-spacing:.14em}
.steps{margin:0;padding-left:1.3em;display:grid;gap:10px;max-width:42em}
.steps li::marker{color:var(--brass-ink);font-family:var(--f-num);font-weight:600}

/* ---------- 指標頁 ---------- */
.ww{display:grid;gap:24px 56px;max-width:60em}
@media (min-width:860px){.ww{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.ww h3{font-size:16px;letter-spacing:.08em;color:var(--brass-ink);margin-bottom:6px}
.ww p{margin:0}
.alt{margin:0;max-width:52em;padding:12px 16px;border-left:2px solid var(--brass);font-size:15px}
.alt b{display:block;font-size:12.5px;letter-spacing:.14em;color:var(--brass-ink)}

/* ---------- 表格（數字右對齊、等寬數字） ---------- */
.tw{overflow-x:auto;max-width:100%}
table{border-collapse:collapse;width:100%;max-width:860px;font-size:15px}
caption{caption-side:top;text-align:left;padding-bottom:10px;font-size:14px;color:var(--muted)}
th,td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--line);vertical-align:baseline}
thead th{font-weight:500;font-size:12.5px;color:var(--muted);letter-spacing:.06em;border-bottom-color:var(--line-2)}
tbody th{font-weight:500}
td.n,th.n{font-family:var(--f-num);font-variant-numeric:lining-nums tabular-nums;text-align:right;white-space:nowrap}
td .sub{margin-left:10px}
.stale{display:block;font:400 12px var(--f-body);color:var(--muted)}
table.alts{max-width:none;font-size:14px}
table.alts td,table.alts th{padding:10px 12px}
table.alts th[scope=row]{min-width:9em} table.alts td:first-of-type{min-width:7em}  /* 方法頁兩張表：指標欄、本站改用欄不會被長說明擠成一兩個字寬（P2-3） */
.isf{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:6px 28px;font-size:15px}
.isl{margin:0;padding:0;list-style:none;display:grid}
.isl li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 20px;padding:12px 0;border-bottom:1px solid var(--line)}
.isl span{color:var(--muted);font-size:14.5px}
.dd{margin:0;display:grid;gap:0;max-width:52em}
.dd div{display:grid;grid-template-columns:9em minmax(0,1fr);gap:4px 20px;padding:11px 0;border-bottom:1px solid var(--line)}
.dd dt{font-size:13.5px;color:var(--muted);letter-spacing:.04em}
.dd dd{margin:0}

/* ---------- 關係清單與關係卡頁 ---------- */
.lkl-list{margin:0;padding:0;list-style:none;display:grid}
.lkl-list li{display:grid;grid-template-columns:minmax(0,17.5em) minmax(0,1fr) auto;grid-template-areas:"h m n" "t m l";gap:2px 20px;padding:12px 0;border-bottom:1px solid var(--line);align-items:baseline}
.lkl-list li > a,.lkl-list li > .pair{grid-area:h;font-weight:600;text-decoration:none}  /* 疊加列「甲 × 乙」包成一格（10-18 第二輪評圖：原本拆成三格整組錯位） */
.lkl-list li > a:hover b{text-decoration:underline;text-decoration-color:var(--brass);text-underline-offset:4px}
.lkl-list .tag{grid-area:t}
.lkl-list .m{grid-area:m;font-size:14.5px;color:var(--ink-2)}
.lkl-list .n{grid-area:n;font-size:13px;color:var(--muted);text-align:right;font-variant-numeric:tabular-nums}  /* 不再 nowrap：英文「Not lit this issue: …」在 320～360 寬撐出橫捲（第三輪評圖 P1-3）；桌機有空間時照樣一行 */
.lkl-list .litm{grid-area:l;justify-self:end;font-size:12.5px;font-weight:600;color:var(--brass-ink);letter-spacing:.06em}
.gates{margin:0;padding:0;list-style:none;display:grid}
.gates li{display:grid;grid-template-columns:minmax(0,9em) minmax(0,1fr) auto;gap:4px 20px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--line)}
.gates small{display:block;margin-top:4px;font-size:13px;color:var(--muted)}
.gates cite{font-style:normal}
.lagbars{margin:0;padding:0;list-style:none;display:grid;gap:8px;max-width:560px}
.lagbars li{display:grid;grid-template-columns:7em minmax(0,1fr) 3.6em;gap:12px;align-items:center;font-size:14px}
.lagbars .lb{display:block;width:100%;height:8px;overflow:visible}
.lagbars .lb rect{fill:var(--brass)}
.lagbars .v{text-align:right;font-family:var(--f-num);font-variant-numeric:tabular-nums}

/* ---------- 文字頁：正文一欄，寬螢幕右邊有目錄（捲動時停在畫面上） ---------- */
.textpage{display:grid;gap:40px;align-items:start}
@media (min-width:1100px){.textpage{grid-template-columns:minmax(0,46em) 15em;justify-content:space-between}}
.toc{position:sticky;top:24px;font-size:14px;line-height:1.6;border-left:1px solid var(--line-2);padding-left:18px}
.toc ol{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.toc li{text-wrap:balance}  /* 目錄一條兩行時兩行等長，不會剩「去比」兩個字（P2-5） */
.toc a{color:var(--muted);text-decoration:none}
.toc a:hover{color:var(--ink);text-decoration:underline;text-decoration-color:var(--brass)}
@media (max-width:1099px){.toc{display:none}}
.prose .howfig{margin:0 0 12px;justify-items:start}
.prose{display:grid;gap:16px;max-width:46em;min-width:0}
.prose h2{scroll-margin-top:24px}
.prose h2{margin-top:28px;font-size:clamp(22px,2.4vw,27px)}
.prose h2:first-child{margin-top:0}
.prose p,.prose ul,.prose ol{margin:0}
.prose ul,.prose ol{padding-left:1.3em;display:grid;gap:8px}
.prose li::marker{color:var(--brass-ink)}
.prose .tw,.prose table{max-width:none}
.disc{gap:14px!important}
.gl{margin:0;display:grid}
.gl div{display:grid;grid-template-columns:minmax(0,11em) minmax(0,1fr);gap:4px 24px;padding:14px 0;border-bottom:1px solid var(--line)}
.gl > div{scroll-margin-top:96px}  /* 從正文連過來時，不被頁首蓋住 */
.gl > div:target{box-shadow:inset 3px 0 0 var(--brass);padding-left:14px}
a.gl-a{color:inherit;text-decoration:underline dotted;text-decoration-color:color-mix(in srgb,currentColor 50%,transparent);text-decoration-thickness:1px;text-underline-offset:3px}  /* 正文名詞連到名詞解釋：點狀底線，不搶內文 */
a.gl-a:hover{text-decoration-style:solid;text-decoration-color:var(--brass)}
.gl dt{font-weight:700;font-family:var(--f-head);text-wrap:balance}  /* 長名詞折兩行時兩行等長，不留「數／字」孤字（第三輪評圖 P2-7） */
.gl dd{margin:0}
.mail{font-family:var(--f-num);letter-spacing:.01em;user-select:all}

/* ---------- 頁尾 ---------- */
.foot{border-top:1px solid var(--line-2);margin-top:88px;padding-block:48px;font-size:14px;line-height:1.75;color:var(--muted)}
.foot .in{display:grid;gap:24px}
.foot p{margin:0}
.f-cols{display:grid;gap:32px 56px;grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr))}
.f-cols > div{display:grid;gap:10px;align-content:start}
.foot .brand{margin:0 0 4px;color:var(--ink)}
.f-h{font:600 12.5px/1.4 var(--f-body);letter-spacing:.18em;color:var(--brass-ink)}
.sis{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.sis a{color:var(--ink);font-weight:500;text-decoration-color:var(--line-2)}
.sis a:hover{text-decoration-color:var(--brass)}
.sis small{display:block;font-size:12.5px;line-height:1.6}
.copy{margin-left:10px;padding:0 12px;min-height:32px;border:1px solid var(--line-2);border-radius:999px;background:none;color:var(--ink);font:500 12.5px var(--f-body);cursor:pointer;vertical-align:1px;touch-action:manipulation}
.pk-x{touch-action:manipulation}
@media (prefers-reduced-motion:reduce){.more .go,.cat .go{transition:none}}
.copy:hover{border-color:var(--brass)}
.flinks{display:flex;flex-wrap:wrap;gap:6px 22px;padding-top:18px;border-top:1px solid var(--line)}
.flinks a{color:var(--ink);text-decoration:none}
.flinks a:hover{text-decoration:underline;text-decoration-color:var(--brass)}
.f-note{font-size:13px}

/* ---------- 單欄首屏（平板、手機）：標題 → 兩句說明 → 刻度盤 → 按鈕；刻度盤最寬 720px（1024×768 才不會只看到上半扇） ---------- */
@media (max-width:1023px){
  .mast::before{-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.35) 60%,transparent);mask-image:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.35) 60%,transparent)}
  .mast::after{background:var(--m-ov1)}
  .hero .in{gap:0;padding-block:16px 48px}
  .hero.home .txt{display:contents}
  /* 手機：核准的首屏文案（副標＋「冷熱只代表位置…不給買賣建議」）兩句都留在第一個畫面，刻度盤接在後面（10-18 三語讀者測試） */
  .kick{order:1} .hero h1{order:2} .hero .s1{order:3} .hero .s2{order:4;margin-top:16px} .dialcol{order:5;margin:18px auto 8px;width:100%;max-width:720px} .cta{order:6} .stats{order:7} .prdef{order:8} .src{order:9}
}
@media (pointer:coarse){.tbtn,.lang summary{min-width:44px;min-height:44px}:is(.mtr button,.pbtn,.tm-back,.pk-x,.copy,.litbtn,.tl-ovb){min-height:44px}.pk-x{min-width:44px}}  /* 觸控：可點的東西至少 44px 高（電腦版維持原尺寸） */
@media (max-width:879px){
  .top .in{gap:10px 12px;padding-block:14px}
  .mnav{order:3;width:100%;gap:2px 18px;font-size:14.5px}
}
/* 有程式：頁首收成一列（站名＋日夜、音樂、選單鈕），主選單與語言收進按鈕，展開時在頁首下面往下推。
   收合的寬度依語言實測（選單字數不同，再窄就排不成一列；10-18 選單加「整體」成 7 項、量法 engine/qa/nav_fit.mjs，各留 10px）：中文 984、英文 1079、日文 1189 以下 */
@media (max-width:984px){html:is([lang="zh-Hant"],[lang="zh-Hans"]).js .mbtn{display:inline-flex}html:is([lang="zh-Hant"],[lang="zh-Hans"]).js :is(.tools .lang,.mnav:not(.open)){display:none}}
@media (max-width:1079px){html[lang="en"].js .mbtn{display:inline-flex}html[lang="en"].js :is(.tools .lang,.mnav:not(.open)){display:none}}
@media (max-width:1189px){
  html[lang="ja"].js .mbtn{display:inline-flex}html[lang="ja"].js :is(.tools .lang,.mnav:not(.open)){display:none}
  .js .mnav.open{order:3;width:100%;display:flex;flex-direction:column;flex-wrap:nowrap;gap:0;padding:6px;border:1px solid var(--m-chip-line);border-radius:14px;background:var(--m-pop);color:var(--m-ink);box-shadow:0 14px 34px rgba(0,0,0,.16);font-size:16px}
  .js .mnav.open > a{padding:12px 14px;border-radius:9px;opacity:1}
  .js .mnav.open > a:hover{background:var(--m-chip);text-decoration:none}
  .js .mnav.open > a[aria-current="page"]{font-weight:600;text-decoration:none;background:var(--m-chip);box-shadow:inset 3px 0 0 var(--brass)}
  .js .mnav.open .mlang{display:flex;gap:8px;margin:6px 4px 4px;padding-top:12px;border-top:1px solid var(--m-chip-line)}
  .js .mlang a{flex:1 1 0;display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 6px;border:1px solid var(--m-chip-line);border-radius:999px;font-size:14.5px;opacity:1}
  .js .mlang a:hover{border-color:var(--brass-hi);text-decoration:none}
  .js .mlang a[aria-current="true"]{font-weight:600;color:var(--m-accent);border-color:var(--brass)}
}
@media (max-width:720px){
  .stat b{font-size:26px}
  .stats{gap:10px 8px}
  .stat span{font-size:12px;letter-spacing:.02em}
  .stat.x{padding-left:10px}
  main{gap:76px;padding-block:64px 16px}
  .gates li{grid-template-columns:minmax(0,1fr)}
  .eps li{grid-template-columns:minmax(0,1fr);grid-template-areas:"when" "what" "aft"}
  .eps .aft{text-align:left}
  .eps-h{justify-content:flex-start}
  .eps-h span:not(:first-child){display:none}
  .eps .aft{justify-content:flex-start;flex-wrap:wrap;gap:4px 18px;margin-top:4px}
  .eps .aft>span{width:auto;text-align:left}
  .eps .aft i{position:static;width:auto;height:auto;overflow:visible;clip-path:none;margin-right:5px;font-style:normal;font-size:13px;color:var(--muted)}
  .lkl-list li{grid-template-columns:minmax(0,1fr);grid-template-areas:"h" "t" "m" "n" "l"}
  .lkl-list .n,.lkl-list .litm{text-align:left;justify-self:start}
  .cta .btn{flex:1 1 0}
  .gl div,.dd div{grid-template-columns:minmax(0,1fr)}
  .isl li{grid-template-columns:minmax(0,1fr)}
}
/* 首屏統計：欄太窄（手機、1024～1366 兩欄時的左欄）四格會把「其中擺到兩端」「Hot and warm」折成兩行、留孤字 →
   改成冷熱三格一列，「其中擺到兩端」另起一列寫成一行（10-18 第二輪評圖 P2-5） */
@media (max-width:511px){.stats{grid-template-columns:repeat(3,minmax(0,1fr))}.stat.x{grid-column:1/-1;display:flex;align-items:baseline;gap:10px;padding:10px 0 0;border-left:0;border-top:1px solid var(--m-line)}}
@container (max-width:479px){.stats{grid-template-columns:repeat(3,minmax(0,1fr))}.stat.x{grid-column:1/-1;display:flex;align-items:baseline;gap:10px;padding:10px 0 0;border-left:0;border-top:1px solid var(--m-line)}}
@media (max-width:600px){
  .tl-plot{height:170px;margin-right:56px}
  .tl.xl .tl-plot{height:220px}
  .tl.sm .tl-plot{height:110px}
  .tl-a{display:none}
  .tl-x,.tl-a{width:calc(100% - 84px)}
  .lagbars li{grid-template-columns:5.6em minmax(0,1fr) 3.4em}
  .cat{grid-template-columns:42px minmax(0,1fr) auto;padding:11px 2px}
  .medal{width:42px;height:42px}
  .cat .cn{font-size:15.5px}
  .row{grid-template-columns:auto 40px minmax(0,1fr) auto auto;gap:0 10px}
  .rows:not(:has(.no)) .row{grid-template-columns:40px minmax(0,1fr) auto auto}
  .row .lw{min-width:0}
  .mini{width:40px;height:26px}
  .sp{grid-template-columns:7.8em minmax(0,1fr) 2.2em;gap:8px}  /* 7.8em：「美債 10 年殖利率」手機也一行 */
  /* 窄螢幕：表格改成一列一張小卡（欄名寫在每格前面） */
  table.resp thead{display:none}
  table.resp,table.resp tbody,table.resp tr{display:block;width:100%}
  table.resp tr{padding:10px 0;border-bottom:1px solid var(--line)}
  table.resp th[scope=row]{display:block;padding:0 0 4px;border:0;font-weight:600}
  table.resp td{display:flex;justify-content:space-between;gap:12px;padding:3px 0;border:0;text-align:right}
  table.resp td::before{content:attr(data-l);font:400 13px var(--f-body);color:var(--muted);text-align:left}
  table.resp caption{display:block}  /* 表格改成區塊後，說明要跟著改，不然會被擠成兩個字寬 */
  table.resp.alts td{display:block;text-align:left}  /* 長文字的表：欄名在上、內容在下 */
  table.resp.alts td::before{display:block;margin-bottom:2px}
  .tl-x .xl.x2{display:none}  /* 年份很密的長走勢：手機隔一個標一個 */
  /* 每期重點的 17 列：一列一行（名稱｜百分位｜冷熱｜小字月份），不再每格重複欄名（10-18 評圖 P2-8：原本整張 2,453px） */
  table.resp.iss tr{display:grid;grid-template-columns:minmax(4.5em,1fr) auto auto auto;column-gap:10px;align-items:baseline;padding:8px 0}  /* 名稱欄至少 4.5 字：320 寬不拆「美股估／值」（第三輪評圖 P2-7） */
  table.resp.iss th[scope=row]{padding:0;font-weight:500}
  table.resp.iss td{display:block;padding:0}
  table.resp.iss td{position:relative}
  table.resp.iss td::before{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}  /* 欄名看不到、讀屏念得到 */
  .isslg{display:block}
  table.resp.iss td:nth-of-type(2){text-align:left}
  table.resp.iss td:nth-of-type(3){font-size:12px;color:var(--muted)}
}
@media (max-width:480px){
  html[lang="en"] .brand .zh{display:block;font-size:19px;line-height:1.05;max-width:5.4em}  /* 英文站名排兩行，三個按鈕才放得進同一列（span 要是區塊，寬度上限才有用） */
  html[lang="ja"] .brand .zh{font-size:18px;letter-spacing:.04em}  /* 「世界の振り子」六個字：縮一點才和三個按鈕同一列 */
  /* 日文標題比中文長：31px 時「世界の経済と市場は、」「冷たいか、熱いか？」各一行，首屏才看得到刻度盤的讀數（10-18 評圖 P1-7） */
  html[lang="ja"] .hero.home h1{font-size:31px}
  html[lang="ja"] .hero h1 .l2{font-size:1.12em}
  html[lang="ja"] .hero .sub{font-size:16px}
  .cta{flex-direction:column}
  .cta .btn{width:100%}
  .brand svg{width:36px;height:36px}
  .brand .zh{font-size:20px}
  .brand .en{display:none}
  .hero .sub{font-size:17px}
}
@media (max-width:400px){.lang summary span{display:none}.lang summary{padding:0 9px}}
@media (max-width:359px){.js .mnav.open .mlang{flex-wrap:wrap}.js .mlang a{flex:1 1 calc(50% - 4px)}}  /* 四顆語言鈕排不下：2×2 */
@media (max-width:340px){html:is([lang="en"],[lang="ja"]) .brand .zh{font-size:16px}.brand{gap:8px}.brand svg{width:32px;height:32px}.tools{gap:4px}}  /* 320 寬：英日站名再縮，三顆按鈕才留在同一列 */
@media (max-width:600px){  /* 說明圖跟著欄寬縮到約 0.56 倍：編號圈與刻度數字放大才對得到下面的清單 */
  .explain .xm{r:16px}
  .explain .xmn{font-size:20px}
  .explain .xn{font-size:24px}
  .explain .xn.s{font-size:19px}
}
@media (max-width:400px){  /* 320–400 寬縮到 0.47–0.56 倍：再放大，圖上的字才都 ≥11px（評圖 P2-9） */
  .explain .xm{r:18px}
  .explain .xmn{font-size:24px}
  .explain .xn{font-size:28px}
  .explain .xn.s{font-size:24px}
}
@media (max-width:600px){.lang ul{right:auto;left:0}}  /* 手機：選單從地球鈕左緣往右開——英文版頁首換行後地球鈕在最左，往左開會超出螢幕 */