:root{--ds-line:var(--ink);--ds-text:var(--acc);
--fs-d:var(--fs-48);--fs-1:var(--fs-36);--fs-2:var(--fs-22);--fs-b:var(--fs-16);--fs-ui:var(--fs-14);--fs-l:var(--fs-12)}

/* 滿版深色帶（本刊觀點）寬度含捲軸，桌機會多出幾 px 橫捲：整頁裁掉橫向溢出（clip 不會破壞 sticky） */
html{overflow-x:clip}

/* ── P1 字階（8 級；clamp 改用斷點，避免中間值） ── */
html body h1.head{font-size:var(--fs-36);line-height:var(--lh-h);letter-spacing:-.01em}
html body .ds-lead h1.head{font-size:var(--fs-48);line-height:var(--lh-h);letter-spacing:-.01em}
@media (max-width:900px){html body .ds-lead h1.head{font-size:var(--fs-36)}}
@media (max-width:560px){html body h1.head,html body .ds-lead h1.head{font-size:var(--fs-28)}}
html body h2.head,html body .sec h2{font:700 var(--fs-28)/var(--lh-h) var(--serif);letter-spacing:-.01em;text-transform:none}
@media (max-width:640px){html body h2.head,html body .sec h2{font-size:var(--fs-22)}}
html body .sec h2>span:not(.bi-zh):not(.bi-en){font:400 var(--fs-12)/var(--lh-ui) var(--ui);letter-spacing:0;color:var(--mute);margin-left:12px}
html body .sec a{font:500 var(--fs-14)/var(--lh-ui) var(--ui)}
html body .card h3{font:600 var(--fs-22)/var(--lh-c) var(--serif)}
html body .na-card h2{font:600 var(--fs-18)/var(--lh-c) var(--serif);margin:0 0 6px}
html body .deck{font-size:var(--fs-18);line-height:var(--lh-b)}
html body .body p{font-size:var(--fs-18);line-height:var(--lh-read,1.85);margin-bottom:1.35em;max-width:620px}
/* 2026-09-16 使用者「內文 18px 跟標籤語法一起上」。18px×620px＝每行 34 個中文字（中文每行＝版心÷字級，不是÷字級的一半）。
   標籤語法取自 Axios Smart Brevity 實測：標籤不變色、不放大、不加字距，只有字重 600 加一個冒號；
   項目符號用自訂圓點（中文的「·」是全形，位置會歪），每條之間 12px。只套沒有 class 的清單，
   避免蓋掉 .na-key ul、ol.na-watch 這些自己有樣式的清單。 */
html body .body strong,html body .body b{font-weight:600;color:inherit;letter-spacing:normal}
html body .body ul:not([class]),html body .na-key ul:not([class]){list-style:none;padding-left:18px;margin:14px 0}
html body .body ul:not([class])>li,html body .na-key ul:not([class])>li{position:relative;padding-left:8px;margin:0 0 12px;line-height:var(--lh-read,1.85)}
html body .body ul:not([class])>li::before,html body .na-key ul:not([class])>li::before{content:"";position:absolute;left:-6px;top:.78em;width:4px;height:4px;border-radius:50%;background:var(--mute)}
html body .body h3,html body .pq,html body .deck,html body .verdict,html body .more{max-width:620px}
/* 2026-09-16 使用者「內文改用思源宋體」：介面維持無襯線、論述改襯線（彭博的做法，也是同業實測裡
   最值得抄的一條）。只換散文段落與清單，不用整塊 .body 換——表格、圖說、meta 各自宣告的 --ui
   權重比 `html body .body` 低，整塊換會把它們一起吃掉。例外在下一條明寫回無襯線。 */
html body .body p,html body .body li,html body .na-view.runin p{font-family:var(--serif)}
/* 新聞單篇的正文不在 .body 底下（news_page 自己的 .nx-p／.na-lead，頁內樣式 1.02rem／1.95），
   所以前兩批的「內文 18px」與襯線都沒蓋到它＝同一個站兩種內文。這裡一起收齊。
   .na-deck（新聞的前言）維持無襯線＝日經那種「粗襯線標題→灰色無襯線前言→襯線內文」的三階，刻意保留。 */
html body .nx-p,html body .na-lead{font-family:var(--serif);font-size:var(--fs-18);line-height:var(--lh-read,1.85);max-width:620px}
html body .body .more p,html body .body figcaption,html body .body .tblwrap p,
html body .body .kn,html body .body .chart{font-family:var(--ui)}
/* 2026-09-16 使用者選 B：固定欄位（本刊觀點／本篇重點／接下來看什麼／這次與歷史不同的條件）
   從獨立色框改成段落開頭的粗體 run-in 標籤。Axios 實測的規則＝標籤與內文同字級同顏色，
   只有字重 600 加一個冒號；顏色留給連結，不給標籤。本刊觀點保留一條細左規，
   因為那是本刊自己的判斷、與事實報導要分得出來。 */
html body .rl{font:inherit;font-weight:600;color:inherit;letter-spacing:normal;text-transform:none}
html body .rl-line{margin:0 0 8px;font-size:var(--fs-18);line-height:var(--lh-read,1.85)}
html body .na-view.runin{background:none;border:0;border-left:2px solid var(--ink);border-radius:0;padding:0 0 0 18px;margin:34px 0 0;max-width:620px}
html body .na-view.runin p{font-size:var(--fs-18);line-height:var(--lh-read,1.85);margin:0 0 1.35em}
html body .na-view.runin p:last-child{margin:0}
html body .na-key.runin{background:none;border:0;border-radius:0;padding:0;margin:0 0 26px;max-width:620px}
html body .na-key.runin li{font-size:var(--fs-18);line-height:var(--lh-read,1.85)}
html body .fs-br .lb{font:inherit;font-weight:600;color:inherit;letter-spacing:normal;text-transform:none}
html body .fs-br .lb::after{content:"："}
html body .verdict.runin{background:none;border:0;border-left:2px solid var(--acc);border-radius:0;padding:0 0 0 18px;margin:24px 0;max-width:620px}
html body .verdict.runin p{font-size:var(--fs-18);line-height:var(--lh-read,1.85);margin:0}
/* 2026-09-16 使用者「手機頭圖縮小」：手機上頭圖由 16:9 改 21:9（343px 寬時 193px → 147px），上下留白一併收緊。
   實測手機正文起點 960 → 906px。圖檔本身已依 photo_library 的裁切中心切成 16:9，這裡再由中心取 21:9，
   主體仍落在畫面中央。桌機完全不動。 */
@media (max-width:640px){
  html body figure.heroimg,html body figure.na-hero{margin:12px 0 16px}
  html body figure.heroimg img,html body figure.na-hero img{aspect-ratio:21/9;object-fit:cover;object-position:center;width:100%;height:auto}
}
/* 2026-09-16 資料頁用滿整個版心：文章頁的 606px 主欄＋346px 側欄對資料表太窄（實測表格只有 450px）。
   .hero.solo 不能用——它把主欄鎖在 780px（那是給文章的）。側欄的「其他欄目」連結改排在頁尾一列。 */
html body .hero.data{grid-template-columns:minmax(0,1fr)}
html body .hero.data>div:first-child{max-width:none}
html body .mkt-more{margin-top:30px;border-top:1px solid var(--hair);padding-top:12px}
html body .mkt-more .blk{border-top:0;margin-bottom:0;padding-top:0}
html body .mkt-more ul.mlist{display:flex;flex-wrap:wrap;gap:8px 18px;margin:0;padding:0;list-style:none}
html body .mkt-more ul.mlist li{margin:0}
/* 2026-09-16 漲跌不能只靠顏色（色盲讀者分不出紅綠）：補三角記號。SVG 元素不會產生偽元素，圖表不受影響。 */
html body .up:not(:empty)::before{content:"\25B2";font-size:.72em;margin-right:3px;vertical-align:.08em}
html body .dn:not(:empty)::before{content:"\25BC";font-size:.72em;margin-right:3px;vertical-align:.08em}
html body .deck{line-height:1.7}
html body .card .deck{font-size:var(--fs-14);line-height:var(--lh-b)}
html body .btn,html body .tabs button,html body .chip,html body .md-note,html body .blk h4{font-size:var(--fs-14);line-height:var(--lh-ui)}
html body .chip,html body .blk h4{font-size:var(--fs-12)}
html body .eyebrow,html body .meta,html body figcaption,html body .ns-note,html body .kn .l,html body .md-tile .k,html body .card .foot,html body .na-secttl,html body table.mini th{font-size:var(--fs-12);line-height:var(--lh-ui)}
html body .masthead.inner .brand{font-size:var(--fs-22)}
html body .md-tile .n{font:500 var(--fs-28)/1.1 var(--mono);letter-spacing:-.01em}
html body .md-tile .n.sm{font-size:var(--fs-22)}
html body .md-tile.big .n{font-size:var(--fs-36)}
html body .md-tile .c{font:500 var(--fs-14)/var(--lh-ui) var(--mono)}
html body .md-tile .l{font-size:var(--fs-12);color:var(--mute)}
html body .kn .v{font:500 var(--fs-28)/1.1 var(--mono);letter-spacing:-.01em}
html body .card .num{font-size:var(--fs-28)}

/* ── D1 色彩：品牌藍只做連結與按鈕、眉標；區塊上線一律墨色 ── */
html body .eyebrow{color:var(--acc)}
html body .sec{position:relative;border-top:2px solid var(--ink)}
html body .sec::before{display:none}
html body .tabs button[aria-selected="true"]{background:var(--accsoft);color:var(--ink);border-color:var(--acc);font-weight:600}
html body .na-secttl{color:var(--mute);letter-spacing:.06em;border-top-color:var(--hair2);font-weight:500}
html body .md-tile.cta{background:var(--card);color:var(--ink);border-color:transparent}
html body .md-tile.cta .k,html body .md-tile.cta .l{color:var(--mute)}html body .md-tile.cta .n{color:var(--acc)}
/* 目錄目前項：accsoft 的第二個（也是最後一個）用途 */
html body .md-toc a.on,html body .md-toc li.on>a,html body .sc-toc a[aria-current="true"]{background:var(--accsoft);color:var(--ink)}

/* ── P5 間距三檔 ── */
html body .hero{padding:32px 0 24px;gap:40px}
html body #main>section{margin-top:64px}
html body #main>section.hero,html body #main>section.md-bento,html body #main>section:first-child{margin-top:0}
html body .sec{margin:64px 0 24px;padding-top:16px}
html body .sec+.sec{margin-top:24px}
html body .grid2,html body .grid3{gap:24px}
html body .md-bento{gap:24px;margin:24px 0}
html body .na-grid{margin:24px 0 0}
html body .card{padding:20px 24px;gap:8px}
html body .md-tile{padding:16px 20px}
html body .blk{margin-bottom:32px}
@media (max-width:640px){html body #main>section{margin-top:40px}html body .sec{margin:40px 0 20px;padding-top:12px}html body .hero{padding:24px 0 16px;gap:24px}}

/* ── P9 卡片減法：白底、無框、無陰影、零圓角 ── */
html body .card,html body .md-tile,html body .icov,html body .tier,html body .ch-card,html body .q-card,html body .sc-card,html body .kn>div,html body .skc,html body .fcal .day,html body .cf-box,html body .cf-gobox,html body details.cf-menu,html body .cf-three>div,html body .md-foryou,html body .md-toc,html body .md-recap2,html body .md-sup .det,html body .md-plan,html body .md-scn div,html body .md-sup .cl ul,html body .md-keybox,html body .md-brc,html body .md-recap,html body .wl .c,html body .ux-top3,html body .ux-mine,html body .cf-lockbox,html body .ns-wall,html body .ds-glancebox,html body .ds-empty,html body .md-tpfold{box-shadow:none;border-radius:0}
html body .card,html body .md-tile,html body .icov,html body .tier,html body .ch-card,html body .q-card,html body .sc-card,html body .skc,html body .fcal .day,html body .cf-three>div,html body .md-sup .det{border:0;background:var(--card)}
html body .card:hover,html body .md-tile:hover,html body .icov:hover,html body .ch-card:hover,html body a.q-card:hover{border-color:transparent}
html body .md-foryou{border:0;border-top:2px solid var(--ink);background:transparent;padding:16px 0 8px}
html body .md-toc{border:0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);background:transparent}
html body .md-recap{background:var(--card);border:0;border-left:3px solid var(--acc)}
html body .md-recap2,html body .md-plan,html body .md-scn div,html body .md-sup .cl ul{border-color:var(--hair2)}
html body .md-toast,html body .md-tip,html body .md-onb .bx,html body .wl .bx,html body .wl-tip,html body .wl-note,html body .md-palbox{box-shadow:var(--sh);border-radius:var(--r)}
html body .wl-note{border-left:3px solid var(--acc)}
html body .md-act button,html body .md-act a,html body .md-chips button,html body .md-cut button,html body .md-layers,html body .md-layers button{border-radius:999px}
html body .md-new,html body .md-recap2 .lb,html body .md-toast button.go{border-radius:var(--r)}
html body .md-sup input,html body .md-onb input{border-radius:var(--r)}
html body .md-cons .md-bar{border-radius:999px}
html body .cf-badge{border-radius:999px}
html body img,html body .cardimg img,html body .heroimg img,html body .na-thumb{border-radius:var(--r)}
html body .bintro-logo,html body .masthead img{border-radius:var(--r)}
html body .kn>div{background:transparent;border:0;border-right:1px solid var(--hair2);padding:14px 16px}
html body .kn>div:last-child{border-right:0}

/* ── P6 表格 ── */
html body table.mini{font-size:var(--fs-16);font-family:var(--ui)}
html body table.mini th{font-family:var(--ui);font-weight:500;letter-spacing:.04em;color:var(--mute);text-transform:none;border-bottom:1px solid var(--hair);padding:8px 10px;background:transparent}
html body table.mini td{padding:10px;border-bottom:1px solid var(--hair2);font-size:var(--fs-16)}
html body table.mini td.num,html body table.mini td.ds-n{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
html body table.mini th.num,html body table.mini th.ds-n{text-align:right}
html body table.mini tbody tr:hover{background:var(--paper)}
html body table.mini td .up,html body table.mini td.up{color:var(--up)}html body table.mini td .dn,html body table.mini td.dn{color:var(--dn)}

/* ── D6 走勢線 ── */
html body .md-spark svg{overflow:visible}

/* ── D7 標誌圖 ── */
html body img.is-logo{object-fit:contain!important;background:var(--paper)}
html body .cardimg:has(img.is-logo) img{max-height:96px;width:auto;margin:0 auto;aspect-ratio:auto}
html body .cardimg:has(img.is-logo){background:var(--paper);border-radius:var(--r);padding:12px 0 0}

/* ── D8 選單（P8）：圖示 14px 淡灰、被選中項 2px 底線（site_theme nav.main a.on:after） ── */
html body .navlist a .md-ic{width:14px;height:14px;color:var(--mute);opacity:1}

/* ── D9 首頁首屏 ── */
html body .ds-lead .body>*:nth-child(n+3){display:none}
html body .md-bento.ds-three{grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr)}html body .ds-three .md-tile.big{grid-row:auto}
@media (max-width:900px){html body .md-bento.ds-three{grid-template-columns:repeat(2,minmax(0,1fr))}html body .ds-three .md-tile.big{grid-column:span 2}}
html body .ds-cta{margin:4px 0 8px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
html body .ds-cta .ui{font-size:var(--fs-12);color:var(--mute)}
/* 桌機訂閱提示改頁尾一列；只有 .show（NUDGE_JS 過了 1.2 秒與 ahi-welcome 閘門）才顯示，未 .show 維持 site_theme 的 display:none */
@media (min-width:761px){html body #subnudge{left:0;right:0;bottom:0;width:auto;max-width:none;border-radius:0;border-width:1px 0 0;box-shadow:none;align-items:center;gap:16px;padding:10px max(24px,calc((100vw - 1040px)/2))}
 html body #subnudge.show{display:flex}
 html body #subnudge p{margin:0}}

/* ── D10 付費訊號 ── */
html body :is(.na-card h2,.card h3,.icov h3,.ch-h) a[href$="pay.html"]::before{content:"";display:inline-block;width:.8em;height:.8em;margin-right:.35em;vertical-align:-.04em;background:var(--mute);
 -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'%3E%3Crect x='4' y='11' width='16' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E") center/contain no-repeat;
 mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'%3E%3Crect x='4' y='11' width='16' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E") center/contain no-repeat}
html body .cf-lockbox,html body .ns-wall{border:0;border-top:2px solid var(--ink);background:var(--card);font-size:var(--fs-14);line-height:var(--lh-b)}
html body .cf-lockbox h4{color:var(--ink);font-size:var(--fs-12)}
html body .cf-lockbox .btn.ghost{border:0;background:none;color:var(--acc);padding-left:4px}
html body .md-tzcta{color:var(--mute)}

/* ── P2 分類色降級：tone 只做標籤文字色＋6px 圓點；卡片一律白底或透明列 ── */
:root{--tone-0:#4A63C8;--tone-1:#A07A2A;--tone-2:#33859A;--tone-3:#7A62B8;--tone-4:#B85C6E;--tone-5:#4A8C64}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--tone-0:#93A6EA;--tone-1:#E39A6B;--tone-2:#6FB6C8;--tone-3:#B09CE3;--tone-4:#E0919C;--tone-5:#82C49E}}
:root[data-theme="dark"]{--tone-0:#93A6EA;--tone-1:#E39A6B;--tone-2:#6FB6C8;--tone-3:#B09CE3;--tone-4:#E0919C;--tone-5:#82C49E}
[data-tone="0"]{--tn:var(--tone-0)}[data-tone="1"]{--tn:var(--tone-1)}[data-tone="2"]{--tn:var(--tone-2)}
[data-tone="3"]{--tn:var(--tone-3)}[data-tone="4"]{--tn:var(--tone-4)}[data-tone="5"]{--tn:var(--tone-5)}
html body .sec[data-tone]{background:transparent;border-left:0;border-radius:0;padding:16px 0 0}
@media (max-width:640px){html body .sec[data-tone]{padding-top:12px}}
/* 清單卡改「列」（P9）：透明列、底部髮線、上下 20px；圖片區在右側 16:9、圓角 4（標記由另一條線改成 16:9 圖，這裡只管 CSS） */
html body .na-grid{grid-template-columns:1fr 1fr;gap:0 40px;border-top:2px solid var(--ink)}
html body .na-grid:has(.na-card[data-tone]){gap:0 40px;border-top:2px solid var(--ink)}
@media (max-width:700px){html body .na-grid,html body .na-grid:has(.na-card[data-tone]){grid-template-columns:minmax(0,1fr)}}
html body .na-card,html body .na-card[data-tone],html body .free-white .na-card[data-tone]{background:transparent;border:0;border-radius:0;border-bottom:1px solid var(--hair2);padding:20px 0;box-shadow:none;transition:none}
html body .na-card:hover{background:transparent}
html body .na-cardrow{display:grid;grid-template-columns:minmax(0,1fr) 116px;gap:16px;align-items:start}
html body .na-cardrow:not(:has(.na-thumb)){grid-template-columns:minmax(0,1fr)}
html body .na-cardrow>.na-thumb{grid-column:2;grid-row:1;width:116px;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r);background:var(--card)}
html body .na-cardrow>.na-body{grid-column:1;grid-row:1;min-width:0}
html body .na-thumb.na-ph{display:flex;align-items:center;justify-content:center;text-align:center;font:500 var(--fs-12)/var(--lh-ui) var(--ui);color:var(--mute);padding:4px;background:var(--card)}
html body .na-cardtop{gap:8px;margin-bottom:6px}
html body .na-cardtop .th{font:600 var(--fs-12)/var(--lh-ui) var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--acc)}
html body .na-cardtop .m,html body .na-card .sub,html body .na-card .na-cred{font-size:var(--fs-12);line-height:var(--lh-ui);color:var(--mute)}
html body .na-card p{font:400 var(--fs-14)/1.55 var(--ui);color:var(--ink2)}
/* 2026-09-18 使用者「部分標題圖卡用白色的好閱讀」：資料型頁面（今日個股、籌碼快訊）的
   標題卡改白底卡片，從表格與名單之間浮起來；純卡片列表（免費電子報與新聞）維持 9/14 的
   透明＋細線報紙版面。權重要壓過上面那條 .na-card[data-tone]{background:transparent}。 */
html body .na-white .na-card,html body .na-white .na-card[data-tone]{
  background:var(--card);border:1px solid var(--hair2);border-radius:12px;
  padding:16px 18px;margin-bottom:12px;border-bottom:1px solid var(--hair2)}
html body .na-white .na-card:last-child{margin-bottom:0}
@media (max-width:640px){html body .na-white .na-card,html body .na-white .na-card[data-tone]{padding:14px}}
html body .na-card[data-tone] .th{color:var(--tn)}
html body .na-card[data-tone] .th::before,html body .fx .card[data-tone] .eyebrow::before,html body .nl-tag[data-tag]::after,html body .chip[data-q]::before{content:"";display:inline-block;width:6px;height:6px;border-radius:999px;background:var(--tn);margin-right:6px;vertical-align:.12em}
html body .nl-tag[data-tag]::after{margin:0 0 0 6px}
html body .md-tpfold{border:0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);background:transparent;margin:16px 0 24px}
html body .md-tpfold>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;padding:12px 0;font-family:var(--ui)}
html body .md-tpfold>summary::-webkit-details-marker{display:none}
html body .md-tpfold>summary .k{font-weight:600;font-size:var(--fs-14)}html body .md-tpfold>summary .v{color:var(--mute);font-size:var(--fs-12)}
html body .md-tpfold>summary .car{width:8px;height:8px;border-right:1.6px solid var(--mute);border-bottom:1.6px solid var(--mute);transform:rotate(45deg);margin-left:2px;transition:transform .15s}
html body .md-tpfold[open]>summary .car{transform:rotate(-135deg)}
html body .md-tpfold>summary .all{margin-left:auto;font-size:var(--fs-12)}
html body .md-tpfold .md-bento{padding:0 0 16px}
html body .fx .card[data-tone]{background:var(--card);border:0;border-top:0}
html body .fx .card[data-tone] .eyebrow{color:var(--tn)}
/* 數字圖卡（P6）：無框無底、格間髮線；漲跌只染數字 */
html body .ds-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:0;margin:8px 0 24px;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
html body .ds-cards.sm{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:0}
html body .ds-c{display:block;padding:14px 16px;border:0;border-right:1px solid var(--hair2);border-radius:0;background:transparent;color:var(--ink);text-decoration:none;min-width:0}
html body .ds-c:last-child{border-right:0}
html body a.ds-c:hover{background:var(--card)}
html body .ds-c .h{font:500 var(--fs-12)/var(--lh-ui) var(--ui);color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body .ds-c .h .ux-star{float:right}
html body .ds-c .v{font:500 var(--fs-22)/1.1 var(--mono);margin-top:6px;font-variant-numeric:tabular-nums;color:var(--ink)}
html body .ds-c .s{font-size:var(--fs-12);color:var(--mute);margin-top:4px;line-height:var(--lh-ui)}
html body .ds-upcard,html body .ds-dncard,html body .ds-ntcard{background:transparent;border-color:var(--hair2)}
html body .ds-upcard .v{color:var(--up)}
html body .ds-dncard .v{color:var(--dn)}
html body .ds-more{margin:4px 0 24px}html body .ds-more>summary{cursor:pointer;font:600 var(--fs-14)/var(--lh-ui) var(--ui);color:var(--acc);padding:6px 0}
/* 賣方共識：偏多／偏空只染標題文字 */
html body .md-cons-col h3.up{color:var(--up)}html body .md-cons-col h3.dn{color:var(--dn)}
/* 籌碼三欄：每檔一列、髮線分隔 */
html body .cf-three>div{background:transparent;border:0;padding:0}
html body .cf-three>div:nth-child(1) h3{color:var(--up)}html body .cf-three>div:nth-child(2) h3{color:var(--dn)}
html body .cf-three li{border:0;border-bottom:1px solid var(--hair2);background:transparent;border-radius:0;padding:8px 0;margin:0}
html body .cf-three .cf-tot{padding:8px 0;border-radius:0;background:transparent;border-bottom:1px solid var(--hair)}
/* 今天個股新聞：類別只染標籤文字＋圓點 */
[data-tag="營收"]{--tn:var(--tone-1)}[data-tag="法人籌碼"]{--tn:var(--tone-3)}[data-tag="公告"]{--tn:var(--tone-0)}
[data-tag="產業動態"]{--tn:var(--tone-2)}[data-tag="股價異動"]{--tn:var(--tone-4)}[data-tag="展望與法說"]{--tn:var(--tone-5)}[data-tag="其他"]{--tn:var(--mute)}
html body .nl-tag[data-tag]{background:transparent;color:var(--tn);border-radius:0;padding:0;font:500 var(--fs-12)/var(--lh-ui) var(--ui)}
html body .nl-g[data-tag]{border-left:0;padding-left:0;margin:6px 0;border-radius:0;background:transparent;border-bottom:1px solid var(--hair2)}
/* 績優股：清單標籤只染文字＋圓點 */
[data-q="revenue"]{--tn:var(--tone-1)}[data-q="margins"]{--tn:var(--tone-2)}[data-q="core"]{--tn:var(--tone-3)}[data-q="dividend"]{--tn:var(--tone-5)}[data-q="growth"]{--tn:var(--tone-0)}
html body .chip[data-q]{background:var(--card);border-color:var(--hair);color:var(--tn)}
html body .q-card[data-q],html body .q-card:not([data-q]){background:var(--card);border:0;border-top:0}

/* ── 第三輪沿用（熱力圖、一眼卡、圖示、空狀態、骨架、浮動重點卡） ── */
html body .ds-heat-g{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin:0 0 8px}
html body .ds-heat-c{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:0;border:1px solid var(--hair2);text-decoration:none;color:var(--ink);min-width:0}
html body .ds-heat-c .k{font:500 var(--fs-12)/var(--lh-ui) var(--ui);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body .ds-heat-c .v{font:500 var(--fs-16)/1.2 var(--mono);font-variant-numeric:tabular-nums}
html body .ds-heat-c:hover{border-color:var(--ink2)}
@media (max-width:900px){html body .ds-heat-g{grid-template-columns:repeat(3,minmax(0,1fr))}}
html body .ds-glancebox{border:0;border-top:2px solid var(--ink);border-radius:0;padding:16px 0 4px;margin:0 0 24px;background:transparent}
html body .ds-glance-top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px}
html body .ds-glance-nm{font:700 var(--fs-28)/var(--lh-h) var(--serif);letter-spacing:-.01em}
html body .ds-glance{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:baseline;padding:8px 0 10px;border-top:1px solid var(--hair2);font-size:var(--fs-14)}
html body .ds-glance .k{font:600 var(--fs-12)/var(--lh-ui) var(--ui);letter-spacing:.06em;color:var(--acc)}
html body .ds-glance .m{font:500 var(--fs-12)/var(--lh-ui) var(--mono);color:var(--mute)}
html body .ds-glance .tg{font:500 var(--fs-12)/var(--lh-ui) var(--ui);color:var(--ink2);border:1px solid var(--hair);border-radius:999px;padding:0 7px}
html body .ds-glance .one{flex-basis:100%;color:var(--ink2);line-height:var(--lh-b)}
html body .ds-glancebox .ux-quad{margin:0 0 10px}
/* 資料類型圖示（CSS 遮罩，全站同一組線條）；S7 區塊標題、今天段小標、分頁籤也帶同一組 */
html body .sec[data-tag] h2::before,html body .sc-h3[data-tag]::before,html body .tabs button[data-v="about"]::before,html body .tabs button[data-v="fin"]::before,html body .tabs button[data-v="cust"]::before{content:"";display:inline-block;width:.9em;height:.9em;margin-right:.35em;vertical-align:-.08em;background:currentColor;-webkit-mask:var(--ico) center/contain no-repeat;mask:var(--ico) center/contain no-repeat}
html body .tabs button[data-v="about"]{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M3 21V9l6-4v4l6-4v4l6-4v16z'/%3E%3C/svg%3E")}
html body .tabs button[data-v="fin"]{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M3 21h18M5 21V10l7-6 7 6v11M10 21v-6h4v6'/%3E%3C/svg%3E")}
html body .tabs button[data-v="cust"]{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='9' cy='8' r='3.5'/%3E%3Cpath d='M2.5 20a6.5 6.5 0 0 1 13 0M16 4a3.5 3.5 0 0 1 0 7M21.5 20a6.5 6.5 0 0 0-5-6.2'/%3E%3C/svg%3E")}
html body .nl-tag[data-tag]::before,html body .tabs button[data-v="rev"]::before,html body .tabs button[data-v="inst"]::before,html body .tabs button[data-v="chips"]::before,html body .tabs button[data-v="evt"]::before{content:"";display:inline-block;width:.9em;height:.9em;margin-right:.3em;vertical-align:-.1em;background:currentColor;-webkit-mask:var(--ico) center/contain no-repeat;mask:var(--ico) center/contain no-repeat}
html body [data-tag="營收"],html body .tabs button[data-v="rev"]{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M4 19V5M4 19h16M8 15l4-5 3 3 5-6'/%3E%3C/svg%3E")}
html body [data-tag="法人籌碼"],html body .tabs button[data-v="inst"]{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M3 21h18M5 21V10l7-6 7 6v11M10 21v-6h4v6'/%3E%3C/svg%3E")}
html body [data-tag="公告"],html body .tabs button[data-v="evt"]{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 3h9l5 5v13H6zM14 3v6h6M9 13h6M9 17h6'/%3E%3C/svg%3E")}
html body .tabs button[data-v="chips"]{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M12 8v4l3 2'/%3E%3C/svg%3E")}
html body [data-tag="產業動態"]{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M3 21V9l6-4v4l6-4v4l6-4v16z'/%3E%3C/svg%3E")}
html body [data-tag="股價異動"]{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M13 2 4 14h7l-1 8 9-12h-7z'/%3E%3C/svg%3E")}
html body [data-tag="展望與法說"]{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M4 4h16v11H8l-4 4z'/%3E%3C/svg%3E")}
html body [data-tag="其他"]{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 8v4M12 16h.01'/%3E%3C/svg%3E")}
html body .ds-empty{margin:8px 0 16px;padding:8px 0 8px 14px;border:0;border-left:3px solid var(--hair);border-radius:0;background:transparent;font:500 var(--fs-14)/var(--lh-b) var(--ui);color:var(--ink2)}
html body #mdtop[data-skel] ul{min-height:96px}
html body .ds-float{padding:16px 0 4px;border:0;border-top:2px solid var(--ink);border-radius:0;background:transparent;font:400 var(--fs-14)/var(--lh-b) var(--ui);position:relative;margin:0 0 24px}
html body .ds-float.fixed{position:fixed;left:calc(50% + 230px);top:96px;width:300px;max-height:calc(100vh - 120px);overflow:auto;z-index:30;background:var(--card);border:0;padding:16px;box-shadow:var(--sh);border-radius:var(--r)}
html body .ds-float h4{margin:0 0 6px;font:600 var(--fs-12)/var(--lh-ui) var(--ui);letter-spacing:.08em;color:var(--acc)}
html body .ds-float ul,html body .ds-float ol{margin:0 0 10px;padding-left:1.1em}html body .ds-float li{margin:0 0 4px;color:var(--ink2)}
html body .ds-float .x{position:absolute;right:8px;top:6px;border:0;background:none;color:var(--mute);cursor:pointer;font-size:var(--fs-16)}
@media (max-width:960px){html body .ds-float{display:none}}
html body.ds-hasfloat article figure,html body.ds-hasfloat article .tblwrap,html body.ds-hasfloat article .cd{max-width:760px}

/* 電子報／專題卡片頁尾：標籤列與連結分兩行，不再擠壓 */
html body .card .foot{flex-wrap:wrap;gap:6px 10px;align-items:center}html body .card .foot>a{margin-left:auto;white-space:nowrap}

/* ── 其他產生器頁內樣式的字階收斂（只在頁面用到時作用；小於 12px 一律禁止） ── */
html body .cf-lead,html body .cf-bul,html body details.cf-intro ol,html body .sc-big{font-size:var(--fs-16);line-height:var(--lh-b)}
html body .cf-note,html body .cf-links,html body .cf-dateline,html body .cf-cap,html body details.cf-delta>summary,html body .cf-three li,html body .cf-three .cf-tot,html body .cf-three h3,html body .cf-three .cf-none,html body .cf-three li .v{font-size:var(--fs-14)}
html body p.cf-hint,html body .cf-three .cf-hint,html body .cf-three li .m,html body .cf-badge,html body details.cf-rm,html body .cf-mono,html body .ds-c .h .cf-mono,html body .na-card .cf-mono{font-size:var(--fs-12)}
html body .cf-three .cf-tot b{font-size:var(--fs-22)}
html body .cf-three li .v.up,html body .cf-y.up,html body .cf-three .up{color:var(--up)}html body .cf-three li .v.dn,html body .cf-y.dn,html body .cf-three .dn{color:var(--dn)}
html body .ch-card .ch-i,html body .ch-card .ch-kv,html body .ch-card .ch-go{font-size:var(--fs-12)}
html body .md-note,html body .md-recap,html body .md-recap2,html body .md-brc,html body .md-keybox,html body .md-toc,html body .wl .c,html body .wl-tip,html body .wl-note{font-size:var(--fs-14);line-height:var(--lh-b)}
html body .md-foryou h2,html body .md-foryou h3{font:600 var(--fs-18)/var(--lh-c) var(--serif)}
html body .md-fy-list li,html body .md-fy-list a{font-size:var(--fs-14)}
html body .md-fy-list .m,html body .md-new,html body .md-recap2 .lb,html body .md-brc .sd,html body .md-scn div,html body .md-act button,html body .md-act a,html body .md-chips button,html body .md-layers button,html body .md-cut button,html body .md-fs button,html body .md-rd,html body .md-tag,html body .md-lbl,html body [data-lbl]::before{font-size:var(--fs-12)}
html body .md-toast,html body .md-tip,html body .md-plan,html body .md-onb .q,html body .md-onb label,html body .md-onb button,html body .wl .bx p,html body .wl .bx li{font-size:var(--fs-14)}
html body .wl .bx h2{font:700 var(--fs-28)/var(--lh-h) var(--serif)}
html body .wl .bx h3,html body .md-onb .bx h3{font:600 var(--fs-18)/var(--lh-c) var(--serif)}
html body .wl .wl-brand{font:700 var(--fs-36)/1 var(--serif)}
html body .wl .c b{font-size:var(--fs-14)}

/* ── 產生器頁內 <style> 的字階收斂（news_split／site_stockcards／site_quality／site_topics／site_personal／site_welcome）：對到 8 級 token ── */
html body button,html body input,html body select,html body textarea{font-family:var(--ui);font-size:var(--fs-14)}
html body .tg,html body .ux-tlist .tg,html body .ds-glance .tg{font-size:var(--fs-12)}
html body .ns-lead{font-size:var(--fs-16);line-height:var(--lh-b);max-width:680px}
html body .ns-sum{font-size:var(--fs-16);line-height:var(--lh-b);max-width:680px}
html body .ns-nav a{font-size:var(--fs-14)}
html body .ns-rate{background:var(--card);border-radius:0;font-size:var(--fs-14);line-height:var(--lh-b);max-width:680px}
html body .na-meta{font-size:var(--fs-12)}
html body .sc-h3{font:600 var(--fs-16)/var(--lh-c) var(--ui);letter-spacing:0}
html body .sc-card h3{font:600 var(--fs-18)/var(--lh-c) var(--serif)}
html body .sc-card p,html body .sc-big{font-size:var(--fs-14);line-height:var(--lh-b)}
html body .sc-card p b,html body .sc-list li .m,html body .sc-kv dt,html body .sb-grid dt{font-size:var(--fs-12);line-height:var(--lh-ui);letter-spacing:0}
html body .sc-kv dd,html body .sb-grid dd{font-size:var(--fs-14);line-height:var(--lh-ui)}
html body .md-fy-list .one,html body .md-fy-list li{font-size:var(--fs-14)}
html body .md-bento.tp .md-tile .n,html body .md-tile.tp .n{font:600 var(--fs-16)/var(--lh-c) var(--serif);letter-spacing:0}
html body .q-n,html body .q-kv{font-size:var(--fs-12)}
html body .q-why{font-size:var(--fs-14);line-height:var(--lh-b)}
html body .nl-g>summary,html body .nl-g .nl-sum,html body .nl-f,html body .nl-l,html body .nl-n{font-size:var(--fs-14)}
html body .nl-t,html body .nl-c,html body .nl-also{font-size:var(--fs-12)}
html body .wl .x,html body .wl-note .x,html body .nudge .x,html body .a2hs .x{font-size:var(--fs-18)}
html body .md-fy-list .tg,html body .md-recap2 .tg,html body .md-fy-list .m{font-size:var(--fs-12)}
html body .body.sb .sb-item dt{font-size:var(--fs-12);line-height:var(--lh-ui);letter-spacing:0}
html body .body.sb .sb-item dd{font-size:var(--fs-16);line-height:var(--lh-b)}
html body .nl-more>summary{font-size:var(--fs-14)}
html body .md-foryou h2 a,html body .sec h2 a,html body .md-foryou h2 span{font-size:var(--fs-14);font-family:var(--ui);font-weight:500}
html body .md-foryou h2{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
html body .md-foryou h2>span:first-child{font:600 var(--fs-18)/var(--lh-c) var(--serif)}
html body .tc-more{background:var(--card);border:1px solid var(--hair);border-radius:var(--rb);font-size:var(--fs-14);min-height:40px;color:var(--ink2)}
/* inline style="font-size:…" 是產生器寫死在標記上的尺寸（build_site／news_split 等），設計層只能以屬性選擇器＋!important 對到 token；
   待各產生器改掉這些 inline 值後這段可刪 */
html body [style*="font-size:.74rem"],html body [style*="font-size:.75rem"],html body [style*="font-size:.78rem"],html body [style*="font-size:.8rem"],html body [style*="font-size:.82rem"],html body [style*="font-size:11px"],html body [style*="font-size:12px"],html body [style*="font-size:13px"]{font-size:var(--fs-12)!important}
html body [style*="font-size:.84rem"],html body [style*="font-size:.85rem"],html body [style*="font-size:.86rem"],html body [style*="font-size:.88rem"],html body [style*="font-size:.9rem"],html body [style*="font-size:14px"],html body [style*="font-size:15px"]{font-size:var(--fs-14)!important}
html body [style*="font-size:.95rem"],html body [style*="font-size:1.05rem"],html body [style*="font-size:16px"],html body [style*="font-size:17px"]{font-size:var(--fs-16)!important}
html body [style*="font-size:1.25rem"],html body [style*="font-size:18px"],html body [style*="font-size:19px"]{font-size:var(--fs-18)!important}
html body [style*="font-size:20px"],html body [style*="font-size:21px"],html body [style*="font-size:22px"],html body [style*="font-size:24px"]{font-size:var(--fs-22)!important}
html body [style*="font-size:26px"],html body [style*="font-size:28px"],html body [style*="font-size:30px"]{font-size:var(--fs-28)!important}
html body [style*="font-size:34px"],html body [style*="font-size:36px"]{font-size:var(--fs-36)!important}

/* ── D11 互動 ── */
html body .card,html body .md-tile,html body .icov,html body .na-card,html body .btn,html body a{transition-duration:.15s}
html body .card:hover,html body .md-tile:hover,html body .icov:hover{transform:none;box-shadow:none}
html body .btn:active{transform:none;filter:brightness(.92)}
html body .kn .v,html body .md-tile .n,html body .card .num{text-shadow:none!important}
/* 2026-09-18 體例 D4：圖與表的節奏——圖上方留 24、圖說貼緊 8、下一段 32；
   同一節連兩張圖時第二張再壓一點，避免讀者以為是同一張的兩半。 */
html body figure.chart,html body .chartpair{margin:24px 0 8px}
html body figure.chart+figure.chart{margin-top:16px}
html body figure.chart figcaption,html body .chartpair+.cap{margin-top:8px;margin-bottom:32px}
html body .tblwrap,html body div[style*="overflow-x:auto"]{margin:20px 0 8px}
/* D1：表格數字一律等寬右對齊（—／未揭露 也算數字欄，由渲染層判定） */
html body table.mini td.mono,html body table.tbl2 td.mono{text-align:right;font-variant-numeric:tabular-nums}
html body table.tbl2 th{white-space:nowrap}

/* 2026-09-18 使用者「部分圖卡、統計圖、Table 字體沒有改到」：
   各產生器的內嵌樣式把小字寫成 .72–.8rem（11.5–12.8px），設計層的字階沒有蓋到它們。
   這裡統一把「讀者真的要讀的小字」拉到 13px，表格內文 15px；
   純標籤（代號晶片、眉標）保持小一號但不低於 12.5px。 */
html body .cf-hint,html body .cf-cap,html body .cf-dateline,html body .ns-note,html body .ns-num,
html body .na-meta,html body .na-sub,html body .sub,html body .tn,
html body .sc-note,html body .card .foot,html body figcaption,html body .cap,
html body .ns-toc p,html body .sc-toc{font-size:calc(var(--fs-14) * .9375);line-height:1.65}
/* 2026-09-22 使用者「籌碼內文標題…標題字可以大一點」：.ns-cap 是段落小標（「外資買超前 10」
   「賣超族群」「當日投本比前 N」），角色是標題不是說明文字，先前跟著小字群被壓成 13px，
   夾在整頁表格之間完全站不出來。改襯線粗體 18px（手機 16px）＋加大上方留白。 */
html body .ns-cap{font:700 var(--fs-18)/var(--lh-c) var(--serif);letter-spacing:-.01em;color:var(--ink);margin:28px 0 8px}
@media (max-width:640px){html body .ns-cap{font-size:var(--fs-16);margin-top:22px}}
html body table.mini th,html body table.tbl2 th{font-size:calc(var(--fs-14) * .9375)}
html body table.mini td,html body table.tbl2 td{font-size:var(--fs-16)}
html body .na-secttl,html body .ns-toc h4,html body .eyebrow{font-size:var(--fs-12)}
html body a.ns-sid,html body .na-cardtop .m{font-size:var(--fs-12)}
html body .sc-big{font-size:calc(var(--fs-14) * 1.125);line-height:1.8}
/* ── 可點提示（2026-09-27 使用者改選方案二，取代同日稍早的「可點一律藍字」）──
   文字連結與內文同色（--link＝墨色）；清單與卡片整塊可點＋右側灰色箭頭（見本檔末段「方向 C」）。
   :where() 把特異性壓到 (1,0,3)：深藍帶（頁首、選單、頁尾）與元件自己的連結色可以蓋過。 */
html body #main a:where(:not(.btn,.skip-link,.ds-heat-c,.im-b)){color:var(--link)}
html body #main a:where(:not(.btn,.ds-heat-c)):hover{color:var(--link);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
html body #main .band a,html body #main .hp-plans a:not(.btn),html body #main .tickw a,html body #main .brand a{color:inherit}
html body #main .brand a:hover{text-decoration:none}
/* 說明文字（2026-09-27 使用者「說明字體可以縮小一點」）：一律 13px、灰字 */
html body .ns-note,html body .md-note,html body .cf-hint,html body .hp-note,html body .td-fine,html body .cs-what,html body .cs-foot,
html body .im-fine,html body .tl-what,html body .ee-none,html body .imp-note,html body .fl-none,html body .cf-dateline,html body .cf-intro li,
html body .td-asof,html body .sec h2>span:not(.bi-zh):not(.bi-en){font-size:var(--fs-note)!important;line-height:1.6}
html body .cs-what,html body .tl-what,html body .ee-none,html body .td-fine{color:var(--mute)}
/* ── 2026-09-27 設計優化（使用者「好的，全做」）──
   #1 三色規則：藍＝可點（--link）、紅綠＝漲跌方向、灰＝說明；不可點的分類字不再用藍 */
html body span.th,html body .na-cardtop span.th{color:var(--ink2)}
html body .eyebrow{color:var(--mute)}
html body .tl-k{color:var(--mute)}
/* #5 卡片統一：圓角 8、細框；可點的卡片滑過時浮起一點 */
html body .td-hc,html body .cs-card,html body .ee-card,html body .im-box,html body .cs-stock,html body .td-cells,html body .card{border-radius:8px}
html body a.td-hc,html body .card,html body .na-card{transition:transform .15s ease,box-shadow .15s ease,background-color .15s ease}
html body a.td-hc:hover,html body .card:hover{transform:translateY(-2px);box-shadow:var(--sh)}
html body .na-card{border-radius:8px}
html body .na-card:hover{background:var(--linksoft)}
@media (prefers-reduced-motion:reduce){html body a.td-hc,html body .card,html body .na-card{transition:none}html body a.td-hc:hover,html body .card:hover{transform:none}}
html body .na-code{display:grid;place-content:center;gap:2px;aspect-ratio:16/9;border-radius:6px;background:var(--linksoft);color:var(--link);text-align:center}
html body .na-code b{font:700 var(--fs-28)/1 var(--mono)}html body .na-code span{font:500 var(--fs-14)/1.2 var(--ui);color:var(--ink2)}
/* #8 標題字：襯線粗體、稍緊字距（中文 Noto Serif TC 700） */
html body h1.head,html body .na-hl,html body .na-card h2,html body .td-nl h3,html body .hp-row h3,html body .card h3,html body .hp-big h3,html body .td-h h2,html body .cs-h h2{font-weight:700;letter-spacing:-.012em}
/* #9 ⓘ 說明：說明句收進圓形 i，點開才看 */
html body .ii{display:inline-block;position:relative;vertical-align:.1em;margin-left:6px}
html body .ii>summary{list-style:none;display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;border:1.5px solid var(--link);color:var(--link);font:italic 700 var(--fs-note)/1 var(--serif);cursor:pointer;user-select:none}
html body .ii>summary::-webkit-details-marker{display:none}html body .ii>summary::marker{content:""}
html body .ii[open]>summary{background:var(--link);color:var(--card)}
html body .ii-b{position:absolute;z-index:55;top:30px;left:50%;transform:translateX(-50%);width:max-content;max-width:min(300px,84vw);background:var(--card);border:1px solid var(--hair);border-radius:8px;box-shadow:var(--sh);padding:10px 12px;font:400 var(--fs-note)/1.6 var(--ui);color:var(--ink2);text-align:left;white-space:normal;letter-spacing:0}
html body .ii-b a{color:var(--link)}
/* 2026-09-29 使用者「這些過濾選項會跟著下滑影響到我觀看頁面」：四個下拉 2×2 在字級放大時約佔半個畫面 → 不再黏在頂端，
   留在列表最上方、隨頁面捲走（原本 position:sticky;top:var(--stick,60px);z-index:30）。
   #6 手機：新聞與專題的篩選列（2026-09-28 加「類型」後四個下拉＝兩格一排、2×2，每格改一行「標題 值」
   ＝兩列約 106px；原本三格一排的上下兩行版面放成 2×2 會佔 129px；值太長以刪節號收；下拉面板左欄往右開、右欄往左開） */
@media (max-width:640px){
 html body .fnews .tdrow{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;position:static;background:var(--paper);padding:6px 0;margin:8px 0}
 html body .fnews .tdrow>.tabdrop{margin:0;min-width:0}
 html body .fnews .tdrow .tabdrop>summary{flex-direction:row;align-items:center;justify-content:flex-start;gap:6px;min-height:44px;padding:4px 26px 4px 10px}
 html body .fnews .tdrow .tabdrop>summary .k{font-size:var(--fs-note);letter-spacing:0;flex:none}
 html body .fnews .tdrow .tabdrop>summary .v{font-size:var(--fs-14);min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 html body .fnews .tdrow .tabdrop>summary .car{position:absolute;right:10px;top:calc(50% - 6px)}
 html body .fnews .tdrow .tabdrop>.tabs{min-width:220px}
 html body .fnews .tdrow .tabdrop:nth-child(2n+1)>.tabs{left:0;right:auto}
 html body .fnews .tdrow .tabdrop:nth-child(2n)>.tabs{left:auto;right:0}
}
/* 深度專題卡（2026-09-28 併入新聞與專題）：標題前的 VIP 標誌（全站 .navvip 設計成後綴、左邊留白；放在最前面改右邊留白） */
html body .na-card h2>.navvip:first-child{margin:0 8px 0 0;vertical-align:.14em}
html body .langbtn,html body .wl .lang,html body .wl-tip .lang,html body .wl-note .lang,html body .md-onb .lang,html body .md-act .lang{display:none!important}
/* ══ 方向 C「深藍・金」＋可點提示方案二（2026-09-27 使用者選定·深色版同一套 token）══
   ① 行情條＋報頭＋主選單＝一條深藍帶（border-image 往左右外擴成全出血；不用 clip-path，免得裁掉手機下拉選單）
   ② 可點：文字連結同內文色；清單與卡片整塊可點，右側灰色箭頭（--chev 遮罩·滑過變墨色）
   ③ 按鈕＝黃銅實心深藍字；分頁／篩選選中＝墨色實心；說明與分類一律灰；區塊標題上方一道 28px 黃銅短線
   ④ 數字：--mono 改 IBM Plex Sans，全站等寬數字（tabular-nums），不再用程式碼字型 */
html body{font-variant-numeric:tabular-nums lining-nums;--chev:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E")}
/* 頁首深藍帶 */
html body #main .masthead{border-bottom:0;background:var(--band);border-image:linear-gradient(var(--band) 0 0) fill 0//0 100vmax;color:var(--bandink)}
@media (min-width:561px){html body #main .masthead{height:64px}}
html body #main .masthead .brand,html body #main .masthead .brand a{color:var(--bandink)}
html body #main .brand em{font-style:italic;font-weight:600;color:var(--brasslt)}
html body #main .masthead .util{color:var(--bandmute)}
html body #main .masthead .util a:not(.btn),html body #main #utilr a:not(.btn){color:color-mix(in srgb,var(--bandink) 84%,transparent)}
html body #main .masthead .chip,html body #main .masthead button.chip{background:transparent;color:color-mix(in srgb,var(--bandink) 84%,transparent);border-color:color-mix(in srgb,var(--bandink) 24%,transparent);border-radius:var(--rb)}
html body #main .masthead .chip:hover,html body #main .masthead button.chip:hover{color:var(--bandink);border-color:color-mix(in srgb,var(--bandink) 55%,transparent)}
html body #main .masthead .btn.ghost{background:transparent;color:var(--bandink);border-color:color-mix(in srgb,var(--bandink) 32%,transparent)}
html body #main .masthead .btn.ghost:hover{background:transparent;border-color:var(--bandink);color:var(--bandink)}
html body #main .masthead img{box-shadow:0 0 0 1px color-mix(in srgb,var(--bandink) 22%,transparent)}
html body #main nav.main{border-bottom:0;background:var(--band);border-image:linear-gradient(color-mix(in srgb,var(--bandink) 13%,var(--band)) 0 1px,var(--band) 1px) fill 0//0 100vmax}
@media (min-width:961px){
 html body #main nav.main .navlist a{color:color-mix(in srgb,var(--bandink) 72%,transparent)}
 html body #main nav.main .navlist a:hover,html body #main nav.main .navlist a.on{color:var(--bandink);text-decoration:none}
 html body #main nav.main .navlist a:after{background:var(--brasslt)}
}
html body .navvip{background:var(--brass);color:var(--onbrass);margin-left:6px;vertical-align:.12em;font-style:normal;white-space:nowrap}
html body #main nav.main .navvip{background:var(--brass);color:var(--onbrass)}
html body .tabs button .navvip{padding:2px 5px 1px}
html body .fl-links a .navvip{margin-right:2px}
html body #main nav.main .navsearch{background:color-mix(in srgb,var(--bandink) 9%,transparent);border-color:transparent;color:color-mix(in srgb,var(--bandink) 70%,transparent)}
html body #main nav.main .navsearch:focus-within{border-color:var(--brasslt)}
html body #main nav.main .navsearch input{color:var(--bandink)}
html body #main nav.main .navsearch input::placeholder{color:color-mix(in srgb,var(--bandink) 55%,transparent)}
@media (max-width:960px){
 html body #main .navtog{background:transparent;border-color:color-mix(in srgb,var(--bandink) 28%,transparent);color:var(--bandink)}
 html body #main .navtog .navlbl{color:var(--bandmute)}
 html body #main nav.main.open .navtog{border-color:var(--brasslt)}
 html body #main nav.main .navlist{background:var(--paper)}
 html body #main nav.main .navlist a{color:var(--ink2)}
 html body #main nav.main .navlist a.on{color:var(--ink);box-shadow:inset 0 -2px 0 var(--brass)}
 html body #main nav.main a.navsearchlink{background:transparent;color:var(--bandink);border-color:color-mix(in srgb,var(--bandink) 28%,transparent)}
}
/* 按鈕：黃銅實心＋深藍字；次要按鈕＝細框墨字 */
html body .btn{background:var(--brass);border-color:var(--brass);color:var(--onbrass);font-weight:600;border-radius:var(--rb)}
html body .btn:hover{background:var(--brass2);border-color:var(--brass2);color:var(--onbrass)}
html body .btn.ghost{background:transparent;color:var(--ink);border-color:var(--hair)}
html body .btn.ghost:hover{background:var(--tint);border-color:var(--ink2);color:var(--ink)}
/* 分頁與篩選：未選＝象牙底灰字、選中＝墨色實心；下拉摘要列細框墨字 */
html body .tabs button{background:var(--tint);border:1px solid transparent;border-radius:999px;color:var(--ink2);font-weight:500}
html body .tabs button:hover{border-color:var(--hair)}
html body .tabs button[aria-selected="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper);font-weight:600}
html body .tabdrop>summary{border-color:var(--hair);background:var(--card);color:var(--ink)}
html body .tabdrop>summary .k{color:var(--mute)}
html body .tabdrop>summary .v{color:var(--ink)}
html body .tabdrop[open]>summary{border-color:var(--ink2)}
html body .tabdrop.set>summary{border-color:var(--brass)}
html body .tabdrop.set>summary .v{color:var(--acc)}
/* 區塊標題：拿掉 2px 黑線，改細線＋黃銅短線；「看全部」改象牙色膠囊 */
html body :is(div,section).sec{border-top:1px solid var(--hair);padding-top:20px}
html body :is(div,section).sec h2::before{content:"";display:block;width:28px;height:2px;background:var(--brass);margin:0 0 12px}
html body #main .sec>a{display:inline-flex;align-items:center;gap:4px;padding:6px 14px;border-radius:999px;background:var(--tint);color:var(--ink);font-weight:600}
html body #main .sec>a:hover{background:var(--hair2);text-decoration:none}
html body .eyebrow{color:var(--acc);letter-spacing:.14em;font-weight:600}
/* 內文裡的連結：墨色＋淡底線（標題與整塊可點的卡片不畫線） */
html body #main :is(p,dd) a:where(:not(.btn,.im-b)){text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--ink) 30%,transparent);text-decoration-thickness:1px;text-underline-offset:4px}
html body #main :is(p,dd) a:where(:not(.btn,.im-b)):hover{text-decoration-color:var(--ink)}
html body abbr.md-gt{color:inherit}
/* 新聞卡：整張可點（標題連結撐滿卡片），沒有照片的卡右側加灰色箭頭 */
html body #main .na-card{position:relative}
html body #main .na-card h2 a::before{content:"";position:absolute;inset:0;z-index:0}
html body #main .na-card a:not(h2 a),html body #main .na-card .im-line,html body #main .na-card button,html body #main .na-card summary{position:relative;z-index:1}
html body #main .na-card:hover{background:var(--tint)}
html body #main .na-card:hover h2 a{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
html body #main .na-card:not(:has(.na-thumb)) .na-cardrow{position:relative;padding-right:30px}
html body #main .na-card:not(:has(.na-thumb)) .na-cardrow::after{content:"";position:absolute;right:4px;top:50%;width:16px;height:16px;margin-top:-8px;background:var(--mute);-webkit-mask:var(--chev) center/contain no-repeat;mask:var(--chev) center/contain no-repeat}
html body #main .na-card:hover .na-cardrow::after{background:var(--ink)}
html body .na-code{color:var(--acc)}
html body .card{border-radius:var(--rb)}
html body a.td-hc:hover,html body .card:hover{transform:none}
/* ⓘ 說明：灰色細圈；點開＝墨色實心 */
html body .ii>summary{border-color:color-mix(in srgb,var(--mute) 75%,transparent);color:var(--mute)}
html body .ii[open]>summary{background:var(--ink);border-color:var(--ink);color:var(--paper)}
html body .ii-b a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
/* 頁尾：深藍帶 */
html body #main footer.foot{background:var(--band);color:var(--bandmute);border-top:0;border-image:linear-gradient(var(--band) 0 0) fill 0//0 100vmax;padding:40px 0 56px;margin-top:72px}
html body #main footer.foot :is(p,span,div,li,small,h2,h3,h4,b,strong){color:inherit}
html body #main footer.foot :is(h2,h3,h4,b,strong){color:var(--bandink)}
html body #main footer.foot a:not(.btn){color:color-mix(in srgb,var(--bandink) 86%,transparent)}
html body #main footer.foot a:not(.btn):hover{color:var(--bandink)}
/* 報頭不換行（按鈕文字被擠成直排的修正）；分類標籤一律黃銅色（原本六色，紅綠會和漲跌混淆）；新聞格線改細線 */
html body #main .brand{white-space:nowrap;flex:0 0 auto}
html body #main .masthead .util .r>*{flex:0 0 auto;white-space:nowrap}
html body{--tone-0:var(--acc);--tone-1:var(--acc);--tone-2:var(--acc);--tone-3:var(--acc);--tone-4:var(--acc);--tone-5:var(--acc)}
html body .na-grid:has(.na-card[data-tone]){border-top:1px solid var(--hair)}
html body #main .masthead .md-mkt{border-color:color-mix(in srgb,var(--bandink) 30%,transparent);color:color-mix(in srgb,var(--bandink) 86%,transparent)}
html body #main .masthead .md-upd{color:var(--bandmute)}
@media (max-width:1439px){html body #main nav.main .md-kbd{display:none}html body #main nav.main .navsearch input{width:120px}}
/* 字級選單（頁首「字」按鈕·2026-09-27 使用者「字體幫我做 A-…合併在頁首」：A-／A／A+／A++ 四級，全站唯一的字級控制） */
html body .fswrap{position:relative;display:inline-flex}
/* 明暗切換：桌機顯示「明／暗」字樣，手機只留半月圖示（登入者版頭五顆按鈕才放得下） */
html body .thbtn{display:inline-flex;align-items:center;gap:4px}
html body .thbtn .thi{display:none}
@media (max-width:420px){html body .thbtn .thl{display:none}html body .thbtn .thi{display:block}html body #main .masthead .util .r{gap:4px}}
/* 頁首 AI 助手入口（2026-09-27 使用者「請明確讓使用者知道那是 AI 助手」）：黃銅框＋星芒圖示＋字樣，手機也顯示 */
html body #main .masthead #askshow.btn.ghost{border-color:var(--brass);color:var(--brass);font-weight:700;display:inline-flex;align-items:center}
html body #main .masthead #askshow.btn.ghost:hover{background:var(--brass);border-color:var(--brass);color:var(--onbrass)}
html body .fsbtn .v{font-weight:700}
html body .fsmenu{position:absolute;top:calc(100% + 8px);left:0;z-index:70;min-width:176px;max-width:calc(100vw - 24px);background:var(--card);color:var(--ink);border:1px solid var(--hair);border-radius:var(--rb);box-shadow:var(--sh);padding:6px;display:grid;gap:2px}
html body .fsmenu[hidden]{display:none}
html body .fsmenu button{display:flex;align-items:baseline;gap:12px;width:100%;min-height:44px;padding:8px 12px;border:0;border-radius:var(--r);background:transparent;color:var(--ink);font:500 var(--fs-14)/1.2 var(--ui);text-align:left;cursor:pointer;white-space:nowrap}
html body .fsmenu button b{min-width:40px;font-family:var(--serif);font-weight:700}
html body .fsmenu button[data-k="-1"] b{font-size:calc(var(--fs-14) * .88)}
html body .fsmenu button[data-k="1"] b{font-size:calc(var(--fs-14) * 1.12)}
html body .fsmenu button[data-k="2"] b{font-size:calc(var(--fs-14) * 1.25)}
html body .fsmenu button span{color:var(--mute);font-size:var(--fs-note)}
html body .fsmenu button:hover{background:var(--tint)}
html body .fsmenu button[aria-checked="true"]{background:var(--ink);color:var(--paper)}
html body .fsmenu button[aria-checked="true"] span{color:inherit;opacity:.75}
/* 手機底部導覽：灰字，所在頁＝墨色＋黃銅頂線 */
html body .md-bnav a,html body .md-bnav button{color:var(--mute)}
html body .md-bnav .on{color:var(--ink);font-weight:700;box-shadow:inset 0 2px 0 var(--brass)}

html body .sg-up{color:var(--up)}html body .sg-dn{color:var(--dn)}
html body .im-b{display:inline-flex;align-items:center;gap:6px;margin-right:12px;vertical-align:.14em;white-space:nowrap;font:600 var(--fs-note)/1 var(--ui);letter-spacing:.02em}
html body .im-b b{font-weight:700}
html body .im-b .im-sq{display:inline-block;width:8px;height:8px;background:currentColor;font-style:normal;flex:0 0 auto}
html body .im-b .im-sz{font-style:normal;font-weight:500;color:var(--mute)}
html body .im-neutral .im-sq{background:transparent;box-shadow:inset 0 0 0 1.5px currentColor}
html body .im-mixed .im-sq{background:linear-gradient(135deg,var(--up) 0 50%,var(--dn) 50% 100%)}
html body .im-up{color:var(--up)}html body .im-down{color:var(--dn)}html body .im-mixed{color:color-mix(in srgb,var(--warn) 82%,var(--ink))}html body .im-neutral{color:var(--mute)}
html body .im-dots{font-style:normal;font-size:var(--fs-12);letter-spacing:1px}
html body .im-who{font:500 var(--fs-14)/1.4 var(--ui);color:var(--ink2);margin-right:10px}
html body .im-who a{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
html body .im-wd{font-style:normal;margin-left:2px}html body .im-wd.im-up{color:var(--up)}html body .im-wd.im-down{color:var(--dn)}
html body .im-rx{font:500 var(--fs-14)/1.4 var(--ui);color:var(--ink2);white-space:nowrap}
html body .im-rx b{font-family:var(--mono);font-weight:600}html body .im-rx b.sg-up{color:var(--up)}html body .im-rx b.sg-dn{color:var(--dn)}
html body .im-pre{margin-left:8px;color:var(--mute)}
html body .im-line{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center;margin:0 0 6px}
html body .im-box{margin:18px 0 22px;padding:16px 18px;border:0;border-radius:var(--rb);background:var(--tint)}
html body .im-box .im-top{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center}
html body .im-box .im-b{font-size:var(--fs-14)}
html body .im-why{margin:12px 0 0;padding-left:1.4em;font:400 var(--fs-16)/1.7 var(--ui);color:var(--ink)}
html body .im-why li{margin:2px 0}
html body .im-rev,html body .im-note{margin:10px 0 0;font:400 var(--fs-16)/1.6 var(--ui);color:var(--ink2)}
html body .im-meta{margin:10px 0 0;font:400 var(--fs-14)/1.6 var(--ui);color:var(--ink2)}
html body .im-meta:empty{display:none}
html body .im-fine{margin:10px 0 0;font:400 var(--fs-14)/1.6 var(--ui);color:var(--mute)}
html body .im-fine a{color:var(--acc);margin-left:6px}

.wl{position:fixed;inset:0;z-index:95;background:color-mix(in srgb,var(--paper) 96%,transparent);display:flex;align-items:center;justify-content:center;padding:16px;font-family:var(--ui)}
.wl .bx{width:min(640px,100%);max-height:92vh;overflow:auto;background:var(--card);border:1px solid var(--hair);border-radius:14px;padding:26px 26px 20px;position:relative}
.wl .logo{display:flex;align-items:center;gap:12px;margin-bottom:6px}
.wl .logo img{width:44px;height:44px}
.wl .logo b{font:900 1.6rem/1 var(--disp);letter-spacing:-.02em}.wl .logo b em{font-style:italic;font-weight:400;color:var(--acc)}
.wl h2{font:900 1.35rem/1.3 var(--zh);margin:10px 0 6px;text-wrap:balance}
.wl p{margin:0 0 10px;font-size:.95rem;line-height:1.7;color:var(--ink2)}
.wl .cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0 6px}
.wl .c{padding:12px 14px;border:1px solid var(--hair2);border-radius:10px;background:var(--paper);min-width:0}
.wl .c b{display:block;font-size:.95rem;margin-bottom:3px}.wl .c span{font-size:.82rem;color:var(--ink2);line-height:1.6}
.wl .c i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.wl .dots{display:flex;gap:6px;margin:14px 0 0}.wl .dots i{width:8px;height:8px;border-radius:50%;background:var(--hair)}.wl .dots i.on{background:var(--acc);width:20px;border-radius:4px}
.wl .row{display:flex;gap:10px;align-items:center;justify-content:space-between;margin-top:14px;flex-wrap:wrap}
.wl .row .r{display:flex;gap:8px}
.wl .skip{border:0;background:none;color:var(--mute);font:500 .84rem var(--ui);cursor:pointer;padding:6px 4px;min-height:36px}
.wl .btn{min-height:38px}
/* 語言鈕（2026-09-16）：迎賓蓋住整頁時報頭的 EN 鈕點不到，浮層自己要有一顆 */
.wl .lang,.wl-tip .lang,.wl-note .lang,.md-onb .lang{border:1px solid var(--hair);background:var(--card);color:var(--ink2);
 border-radius:999px;font:600 .76rem/1 var(--ui);letter-spacing:.04em;padding:6px 10px;min-height:30px;cursor:pointer}
.wl .lang{position:absolute;right:52px;top:10px}
.wl.intro .lang{right:auto;left:50%;top:auto;bottom:-64px;transform:translateX(-50%)}
.wl-tip .lang,.wl-note .lang{padding:4px 8px;min-height:26px;font-size:.72rem}
.wl-note .lang{position:absolute;right:34px;top:8px}
.md-onb .lang{float:right;margin:-4px 0 0 8px}
.wl .x{position:absolute;right:10px;top:8px;border:0;background:none;font-size:1.3rem;color:var(--mute);cursor:pointer;min-width:36px;min-height:36px}
.wl .back{position:absolute;left:12px;top:10px;border:1px solid var(--hair);background:var(--card);border-radius:999px;color:var(--ink2);font:500 .84rem var(--ui);padding:6px 12px;min-height:34px;cursor:pointer}
.wl .logo.shift{margin-top:30px}
/* 過場：標誌淡入放大、字標滑入（減少動態效果時直接顯示） */
.wl.intro .bx{background:transparent;border:0;text-align:center;padding:0}
.wl .mark{width:88px;height:88px;margin:0 auto 14px;animation:wlMark .9s cubic-bezier(.2,.8,.2,1) both}
.wl .brand{font:900 2.2rem/1 var(--disp);letter-spacing:-.02em;animation:wlUp .7s .35s cubic-bezier(.2,.8,.2,1) both}
.wl .brand em{font-style:italic;font-weight:400;color:var(--acc)}
.wl .tag{margin-top:10px;color:var(--mute);font-size:.9rem;animation:wlUp .6s .6s both}
@keyframes wlMark{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@keyframes wlUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
/* 選單導覽：聚光燈＋說明泡泡 */
.wl-spot{position:fixed;z-index:94;border-radius:8px;box-shadow:0 0 0 9999px color-mix(in srgb,var(--ink) 55%,transparent),0 0 0 3px var(--acc);pointer-events:none;transition:all .25s}
.wl-tip{position:fixed;z-index:96;width:min(320px,calc(100vw - 24px));padding:14px 16px;border-radius:10px;background:var(--card);border:1px solid var(--hair);font:400 .9rem/1.6 var(--ui);color:var(--ink2);box-shadow:0 18px 40px -18px rgba(0,0,0,.45)}
.wl-tip b{display:block;color:var(--ink);margin-bottom:3px;font-size:.98rem}
.wl-tip .row{display:flex;justify-content:space-between;align-items:center;margin-top:10px;gap:8px}
.wl-tip .n{font:500 .74rem var(--mono);color:var(--mute)}
.wl-tip .btn{min-height:34px;padding:6px 14px}.wl-tip .skip{border:0;background:none;color:var(--mute);cursor:pointer;font:500 .82rem var(--ui);min-height:34px}
/* 各欄目第一次進入的指導通知（右下角，可關） */
.wl-note.pick b{display:block;font:600 var(--fs-12,12px)/1.4 var(--ui);letter-spacing:.06em;color:var(--mute);margin-bottom:4px}.wl-note.pick .t a{font:600 var(--fs-16,16px)/1.4 var(--serif);color:var(--ink);text-decoration:none}.wl-note.pick p{margin:6px 0 8px;font-size:var(--fs-14,14px);color:var(--ink2);line-height:1.5}.wl-note.pick .go{font:500 var(--fs-14,14px) var(--ui);color:var(--acc)}
.wl-note{position:fixed;right:16px;bottom:16px;z-index:60;width:min(340px,calc(100vw - 32px));padding:14px 40px 12px 16px;border-radius:10px;background:var(--card);border:1px solid var(--hair);border-left:4px solid var(--acc);font:400 .9rem/1.6 var(--ui);color:var(--ink2);box-shadow:0 14px 34px -16px rgba(0,0,0,.4)}
.wl-note b{display:block;color:var(--ink);margin-bottom:2px}
.wl-note .x{position:absolute;right:6px;top:4px;border:0;background:none;font-size:1.2rem;color:var(--mute);cursor:pointer;min-width:34px;min-height:34px}
.wl-note a{color:var(--acc)}
body.md-hasb .wl-note{bottom:calc(76px + env(safe-area-inset-bottom))}
@media (max-width:640px){.wl .cards{grid-template-columns:minmax(0,1fr)}.wl .bx{padding:20px 18px 16px}}
@media (prefers-reduced-motion:reduce){.wl .mark,.wl .brand,.wl .tag{animation:none}.wl-spot{transition:none}}

#askfab{position:fixed;right:16px;bottom:124px;z-index:60;width:46px;height:46px;border-radius:50%;
 border:1px solid var(--hair);background:var(--card);color:var(--ink);opacity:.55;cursor:grab;
 display:flex;align-items:center;justify-content:center;box-shadow:0 2px 10px rgba(0,0,0,.14);
 transition:opacity .18s,transform .18s;touch-action:none;font:inherit}
#askfab:hover,#askfab:focus-visible{opacity:1;transform:scale(1.06)}
#askfab.drag{cursor:grabbing;opacity:1;transition:none}
#askfab[hidden]{display:none}
#askfab .x{position:absolute;top:-7px;right:-7px;width:19px;height:19px;border-radius:50%;
 border:1px solid var(--hair);background:var(--bg);color:var(--mute);font-size:12px;line-height:1;
 display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
#askpanel{position:fixed;right:16px;bottom:124px;z-index:61;width:min(420px,calc(100vw - 32px));
 height:min(640px,calc(100vh - 140px));display:flex;flex-direction:column;background:var(--card);
 border:1px solid var(--hair);border-radius:var(--r);box-shadow:0 8px 34px rgba(0,0,0,.2);overflow:hidden}
#askpanel[hidden]{display:none}
#askpanel .hd{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--hair);flex:0 0 auto}
#askpanel .hd b{font-size:.95rem}#askpanel .hd .sp{flex:1}
#askpanel .hd .tag{font-size:.7rem;font-weight:700;letter-spacing:.06em;padding:2px 7px;border-radius:999px;background:var(--acc);color:var(--card);white-space:nowrap}
#askpanel .hd button{border:none;background:none;color:var(--mute);cursor:pointer;font:inherit;padding:2px 6px}
#askpanel .hd .clr{font-size:.76rem}#askpanel .hd .min{font-size:1.1rem}
#askpanel .th{flex:1 1 auto;overflow:auto;padding:12px;display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth;overscroll-behavior:contain}
#askpanel .m{max-width:92%;line-height:1.8;font-size:.93rem;white-space:pre-wrap;overflow-wrap:anywhere}
#askpanel .m.u{align-self:flex-end;max-width:85%;background:var(--acc);color:var(--card);padding:8px 13px;border-radius:18px 18px 4px 18px}
#askpanel .m.a{align-self:stretch;max-width:100%;background:none;color:var(--ink);padding:2px 2px 4px;border:0;border-radius:0}
#askpanel .m.a.err{color:var(--mute);font-size:.86rem}
#askpanel .m.a a.cite{color:var(--acc);text-decoration:none;font-weight:600}
#askpanel .m .src{margin:8px 0 0;display:flex;flex-wrap:wrap;gap:6px;align-items:center}#askpanel .m .src a{display:inline-block;padding:3px 10px;border:1px solid var(--hair);border-radius:999px;font-size:.76rem;line-height:1.4;color:var(--ink);background:var(--card);text-decoration:none;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#askpanel .m .src a:hover{border-color:var(--acc);color:var(--acc)}
#askpanel .m .src b{flex:0 0 100%;color:var(--mute);font-weight:600;font-size:.72rem;margin:4px 0 -2px}
#askpanel .m .meta{font-size:.72rem;color:var(--mute);margin-top:6px;opacity:.85}
#askpanel .m.a b.sec{display:block;margin:11px 0 3px;font-size:.76rem;letter-spacing:.05em;color:var(--mute);font-weight:600}#askpanel .m.a b.sec:first-child{margin-top:0}
#askpanel .m .lamps{display:flex;flex-wrap:wrap;gap:5px;align-items:center;margin:0 0 9px}#askpanel .m .lps{font-size:.78rem;font-weight:700;color:var(--ink);margin-right:2px;flex:0 0 100%}
#askpanel .m .lp{font-size:.72rem;padding:2px 9px;border-radius:999px;border:1px solid currentColor;line-height:1.5;font-weight:600}#askpanel .m .lp.up{color:var(--up)}#askpanel .m .lp.dn{color:var(--dn)}#askpanel .m .lp.wn{color:var(--warn)}
#askpanel .m .lpd{font-size:.68rem;color:var(--mute)}#askpanel .m.a .pn{color:var(--mute);font-weight:600}
#askpanel .m.a.err .meta,#askpanel .m.u .meta{display:none}
#askpanel .tip{font-size:.84rem;color:var(--mute);line-height:1.6;text-align:center;padding:22px 8px 8px}
#askpanel .tip b{color:var(--acc)}
#askpanel .ex{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:8px}
#askpanel .ex button{font:inherit;font-size:.78rem;padding:5px 10px;border:1px solid var(--hair);border-radius:999px;background:var(--card);color:var(--ink);cursor:pointer}
#askpanel .ex button:hover{border-color:var(--acc)}
#askpanel .ft{flex:0 0 auto;border-top:1px solid var(--hair);padding:9px 10px;display:flex;flex-wrap:wrap;gap:6px;background:var(--card)}
#askpanel .cmp{flex:1 1 100%;display:flex;align-items:flex-end;gap:6px;padding:5px 5px 5px 14px;border:1px solid var(--hair);border-radius:22px;background:var(--bg)}
#askpanel .cmp:focus-within{border-color:var(--acc)}
#askpanel textarea{flex:1;min-height:32px;max-height:120px;padding:7px 0;border:0;font:inherit;font-size:.93rem;background:transparent;color:var(--ink);resize:none}
#askpanel textarea:focus{outline:none}
#askpanel .send{flex:0 0 auto;width:36px;height:36px;border-radius:50%;border:0;background:var(--acc);color:var(--card);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
#askpanel .send:disabled{opacity:.45;cursor:default}#askpanel .send.sub{width:auto;padding:0 14px;border-radius:999px;font:inherit;font-size:.84rem;font-weight:600}
#askpanel .left{flex:0 0 100%;font-size:.72rem;color:var(--mute);margin:0;padding:0 8px}
#askpanel .left.zero{color:var(--acc);font-weight:600}
#askpanel .dis{flex:0 0 auto;padding:7px 12px;border-top:1px solid var(--hair);font-size:.72rem;line-height:1.55;color:var(--ink);opacity:.8;background:var(--bg)}
#askpanel .m .fb{display:flex;gap:6px;margin-top:8px;align-items:center;flex-wrap:wrap}
#askpanel .m .fb button{font:inherit;font-size:var(--fs-12);padding:3px 10px;border:1px solid var(--hair);border-radius:999px;background:var(--card);color:var(--mute);cursor:pointer}
#askpanel .m .fb button:hover{border-color:var(--acc);color:var(--ink)}#askpanel .m .fb span{font-size:var(--fs-12);color:var(--mute)}
#askpanel .m .src .tg{font-size:var(--fs-12);color:var(--mute)}#askpanel .m .src .cr{color:var(--warn)}
#askpanel .m.a .ld{color:var(--mute);font-size:var(--fs-14)}
.askabout{display:inline-flex;align-items:center;gap:6px;margin:18px 0 6px;padding:7px 14px;border:1px solid var(--hair);border-radius:999px;background:var(--card);color:var(--ink);font:inherit;font-size:var(--fs-14);cursor:pointer}
.askabout:hover{border-color:var(--acc)}
/* v9（2026-09-26）：資料時點列、延伸問題、段落摺疊、表格、迷你圖、深度模式、回饋原因 */
#askpanel .m .asof{font-size:var(--fs-12);color:var(--mute);margin:0 0 8px;white-space:normal}
#askpanel .m .dpb{display:inline-block;font-size:var(--fs-12);font-weight:700;padding:1px 8px;border-radius:999px;border:1px solid var(--acc);color:var(--acc);margin:0 0 6px}
#askpanel .m .dpn{font-size:var(--fs-12);color:var(--warn);margin:0 0 6px;white-space:normal}
#askpanel .m .nx{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;white-space:normal}
#askpanel .m .nx b{flex:0 0 100%;color:var(--mute);font-weight:600;font-size:var(--fs-12)}
#askpanel .m .nx button{font:inherit;font-size:var(--fs-12);padding:4px 10px;border:1px solid var(--hair);border-radius:999px;background:var(--card);color:var(--ink);cursor:pointer;text-align:left}
#askpanel .m .nx button:hover{border-color:var(--acc);color:var(--acc)}
#askpanel .m details.sx{margin:6px 0 0;border-top:1px solid var(--hair);padding-top:4px}
#askpanel .m details.sx>summary{cursor:pointer;font-size:var(--fs-12);letter-spacing:.05em;color:var(--mute);font-weight:600;list-style:none;padding:3px 0}
#askpanel .m details.sx>summary::-webkit-details-marker{display:none}
#askpanel .m details.sx>summary::before{content:"＋ ";color:var(--acc)}#askpanel .m details.sx[open]>summary::before{content:"－ "}
#askpanel .m .xall{font:inherit;font-size:var(--fs-12);margin-top:8px;padding:3px 10px;border:1px solid var(--hair);border-radius:999px;background:var(--card);color:var(--mute);cursor:pointer}
#askpanel .m .tw{overflow-x:auto;margin:4px 0 6px;white-space:normal}
#askpanel .m .sigp{display:inline-block;padding:1px 10px;border-radius:999px;font-weight:700;background:color-mix(in srgb,var(--mute) 14%,transparent);color:var(--ink)}
#askpanel .m .sigp.up{background:color-mix(in srgb,var(--up) 14%,transparent);color:var(--up)}
#askpanel .m .sigp.dn{background:color-mix(in srgb,var(--dn) 14%,transparent);color:var(--dn)}
#askpanel .m table.at{border-collapse:collapse;font-size:var(--fs-12);min-width:100%;font-variant-numeric:tabular-nums}
#askpanel .m table.at th,#askpanel .m table.at td{border-bottom:1px solid var(--hair);padding:4px 8px 4px 0;text-align:left;vertical-align:top}
#askpanel .m table.at th{color:var(--mute);font-weight:600}
#askpanel .m .spks{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 10px;white-space:normal}
#askpanel .m .sk{display:inline-flex;flex-direction:column;gap:2px;font-size:var(--fs-12);color:var(--mute)}
#askpanel .m .sk i{font-style:normal}#askpanel .m .sk em{font-style:normal;color:var(--ink);font-variant-numeric:tabular-nums}
#askpanel .m .sk svg{width:120px;height:30px;display:block}
#askpanel .m .sk svg.ln polyline{fill:none;stroke:var(--mute);stroke-width:1.5}#askpanel .m .sk svg.ln.up polyline{stroke:var(--up)}#askpanel .m .sk svg.ln.dn polyline{stroke:var(--dn)}
#askpanel .m .sk svg.br rect.u{fill:var(--up)}#askpanel .m .sk svg.br rect.d{fill:var(--dn)}
#askpanel .dp{flex:0 0 auto;display:inline-flex;align-items:center;gap:5px;font-size:var(--fs-12);color:var(--mute);padding:0 8px;cursor:pointer}
#askpanel .dp[hidden]{display:none}#askpanel .dp input{accent-color:var(--acc)}
#askpanel .m .fbw{display:flex;flex-wrap:wrap;gap:6px;align-items:center}#askpanel .m .fbw span{font-size:var(--fs-12);color:var(--mute)}
@media (prefers-reduced-motion:reduce){#askfab{transition:none}#askpanel .th{scroll-behavior:auto}}
/* 手機版（2026-09-21）：改全螢幕表單。浮在中間會浪費一半螢幕；100vh 在 iOS 不隨鍵盤縮，
   用 100dvh 並由 JS 依 visualViewport 校正；輸入框 16px 免 iOS 自動放大；點擊區 ≥44px；
   對話串 overscroll-behavior:contain 不帶動底下頁面；底部留安全區。*/
@media (max-width:640px){
 #askpanel{left:0;right:0;top:0;bottom:0;width:auto;max-width:none;height:100vh;height:100dvh;border-radius:0;border:0;box-shadow:none;box-sizing:border-box}
 #askpanel .hd{padding:calc(10px + env(safe-area-inset-top,0px)) 8px 8px 14px}
 #askpanel .hd button{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center}
 #askpanel .hd .clr{font-size:.8rem}#askpanel .hd .min{font-size:1.35rem}
 #askpanel .th{padding:12px 14px;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
 #askpanel .m{font-size:.95rem;max-width:88%}
 #askpanel .ft{padding:8px 10px calc(8px + env(safe-area-inset-bottom,0px))}
 #askpanel textarea{font-size:16px;min-height:34px}
 #askpanel .cmp{min-height:46px;padding-left:16px}#askpanel .send{width:40px;height:40px}
 #askpanel .dis{padding-bottom:calc(7px + env(safe-area-inset-bottom,0px))}
 #askfab{bottom:calc(88px + env(safe-area-inset-bottom,0px))}
 #askfab .x{width:26px;height:26px;top:-9px;right:-9px;font-size:15px}
}
@media (max-width:420px){#askshow{padding-left:8px;padding-right:8px}}

html body .crm-ov{position:fixed;inset:0;z-index:98;display:flex;align-items:center;justify-content:center;padding:16px;background:color-mix(in srgb,var(--band) 62%,transparent)}
html body .crm-su{position:relative;font-family:var(--ui);color:var(--ink);text-align:left}
html body .crm-ov .crm-su{width:min(460px,100%);max-height:calc(100vh - 32px);overflow:auto;background:var(--card);border:1px solid var(--hair);border-radius:6px;box-shadow:var(--sh);padding:22px 20px 18px}
html body .crm-su.crm-in{background:var(--card);border:1px solid var(--hair);border-radius:6px;padding:14px 14px 12px}
html body .crm-x{position:absolute;right:4px;top:4px;min-width:44px;min-height:44px;border:0;background:none;color:var(--mute);font-family:var(--ui);font-size:var(--fs-22);line-height:1;cursor:pointer;padding:0}
html body .crm-x:hover{color:var(--ink)}
html body .crm-su .crm-t{margin:0 40px 6px 0;font-family:var(--serif);font-size:var(--fs-22);font-weight:700;line-height:var(--lh-c);color:var(--ink)}
html body .crm-su.crm-in .crm-t{margin:0 0 8px;font-family:var(--ui);font-size:var(--fs-16);line-height:var(--lh-ui)}
html body .crm-su .crm-d{margin:0 0 12px;font-size:var(--fs-14);line-height:1.7;color:var(--ink2)}
html body .crm-su .crm-pw{margin:0 0 10px;font-size:var(--fs-14);line-height:1.6;color:var(--ink)}
html body .crm-su form{display:block;margin:0;padding:0;gap:0}
html body .crm-su .crm-l{display:block;margin:0 0 6px;font-size:var(--fs-12);color:var(--mute)}
html body .crm-su .crm-row{display:flex;gap:8px;flex-wrap:wrap;align-items:stretch}
html body .crm-su input{flex:1 1 12em;min-width:0;width:auto;margin:0;padding:10px 12px;border:1.5px solid var(--hair);border-radius:4px;background:var(--paper);color:var(--ink);font-family:var(--ui);font-size:max(16px,var(--fs-16));line-height:1.4}
html body .crm-su input:focus{border-color:var(--acc);outline:none}
html body .crm-su input.crm-code{flex:0 1 11em;font-family:var(--mono);letter-spacing:.3em}
html body .crm-su .btn{flex:0 0 auto;justify-content:center;white-space:nowrap;margin:0}
html body .crm-su .btn:disabled{opacity:.6;cursor:default}
html body .crm-su .crm-cs{margin:8px 0 0;font-size:var(--fs-12);line-height:1.6;color:var(--mute)}
html body .crm-su .crm-cs a,html body .crm-su .crm-ft a{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
html body .crm-su .crm-sent{margin:0 0 10px;font-size:var(--fs-14);line-height:1.6;color:var(--ink2)}
html body .crm-su .crm-lk{display:flex;gap:18px;flex-wrap:wrap;margin:6px 0 0}
html body .crm-su .crm-lk button{border:0;background:none;padding:6px 0;min-height:36px;color:var(--ink);font-family:var(--ui);font-size:var(--fs-14);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
html body .crm-su .crm-msg{margin:10px 0 0;font-size:var(--fs-14);line-height:1.6;color:var(--ink2)}
html body .crm-su .crm-msg.bad{color:var(--up)}
html body .crm-su .crm-ft{margin:12px 0 0;font-size:var(--fs-12);line-height:1.6;color:var(--mute)}
html body .crm-fw{margin:22px 0 8px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
html body .crm-fw .crm-follow{white-space:normal;text-align:left}
html body .crm-fwm{font-family:var(--ui);font-size:var(--fs-14);color:var(--mute)}
html body .crm-askreg{margin:8px 0 0;display:flex;gap:12px;flex-wrap:wrap;align-items:center;white-space:normal}
html body .crm-askreg a{color:var(--ink);text-decoration:underline}
html body .crm-first{position:fixed;right:16px;bottom:16px;z-index:97;width:min(400px,calc(100vw - 32px));max-height:calc(100vh - 32px);overflow:auto;background:var(--card);color:var(--ink);border:1px solid var(--hair);border-left:4px solid var(--brass);border-radius:6px;box-shadow:var(--sh);padding:16px 16px 14px;font-family:var(--ui)}
html body.md-hasb .crm-first{bottom:calc(76px + env(safe-area-inset-bottom,0px))}
html body .crm-first h3{margin:0 40px 4px 0;font-family:var(--serif);font-size:var(--fs-18);line-height:var(--lh-c);color:var(--ink)}
html body .crm-first .crm-d{margin:0 0 8px;font-size:var(--fs-14);line-height:1.6;color:var(--ink2)}
html body .crm-first .crm-d a{color:var(--ink);text-decoration:underline}
html body .crm-tg{display:flex;gap:10px;align-items:flex-start;padding:9px 0;border-top:1px solid var(--hair2);cursor:pointer;font-size:var(--fs-14);line-height:1.5;color:var(--ink)}
html body .crm-tg input{width:20px;height:20px;flex:0 0 auto;margin:1px 0 0;accent-color:var(--brass);cursor:pointer}
html body .crm-tg small{display:block;font-size:var(--fs-12);color:var(--mute)}
html body .crm-first details{margin:4px 0 0;border-top:1px solid var(--hair2);padding-top:6px}
html body .crm-first summary{cursor:pointer;font-size:var(--fs-14);color:var(--ink);min-height:32px;line-height:32px}
html body .crm-q{margin:10px 0 6px;font-size:var(--fs-12);color:var(--mute)}
html body .crm-first .crm-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:12px}
html body .crm-first .crm-msg{margin:8px 0 0;font-size:var(--fs-14);color:var(--ink2)}
html body .crm-first .crm-msg.bad{color:var(--up)}
html body .crm-first .crm-skip{border:0;background:none;color:var(--mute);font-family:var(--ui);font-size:var(--fs-14);cursor:pointer;min-height:36px}
html body #crmpay{margin:14px 0 18px;padding:16px;border-radius:6px;background:var(--tint);color:var(--ink)}
html body #crmpay .crm-t{margin:0 0 6px;font-family:var(--serif);font-size:var(--fs-18);font-weight:700;line-height:var(--lh-c)}
html body #crmpay .crm-d{margin:0 0 10px;font-size:var(--fs-14);line-height:1.7;color:var(--ink2)}
html body #crmpay .crm-d a{color:var(--ink);text-decoration:underline}
html body #crmpay .crm-or{margin:12px 0 0;font-size:var(--fs-14);color:var(--ink2)}
html body #crmpay .crm-msg{margin:8px 0 0;font-size:var(--fs-14);color:var(--ink2)}
html body #crmpay .crm-msg.bad{color:var(--up)}
html body .crm-acct h3{margin:24px 0 6px;font-size:var(--fs-18)}
html body .crm-acct .crm-d{margin:0 0 10px;font-size:var(--fs-14);line-height:1.7;color:var(--ink2)}
html body .crm-lim{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;margin:10px 0 12px}
html body .crm-lim div{border:1px solid var(--hair);border-radius:6px;padding:10px 12px;background:var(--card);min-width:0}
html body .crm-lim b{display:block;font-family:var(--mono);font-size:var(--fs-22);line-height:1.2;color:var(--ink)}
html body .crm-lim span{font-size:var(--fs-12);line-height:1.5;color:var(--mute)}
html body .crm-acct .crm-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:6px 0}
html body .crm-acct input.crm-ref{flex:1 1 16em;min-width:0;margin:0;padding:9px 10px;border:1.5px solid var(--hair);border-radius:4px;background:var(--paper);color:var(--ink);font-family:var(--mono);font-size:var(--fs-14)}
html body .crm-acct .crm-msg{margin:6px 0 0;font-size:var(--fs-14);color:var(--ink2);min-height:1.4em}
html body .crm-acct .crm-msg.bad{color:var(--up)}
html body .crm-acct .crm-del{margin:10px 0 0;padding:12px 14px;border:1px solid var(--up);border-radius:6px;background:var(--card)}
html body .crm-acct .crm-del p{margin:0 0 8px;font-size:var(--fs-14);line-height:1.6}
html body .crm-login-ben{margin:8px 0 0;padding:10px 12px;border-radius:6px;background:var(--tint);font-size:var(--fs-14);line-height:1.7;color:var(--ink2)}
html body .crm-start{max-width:820px;margin:28px auto 44px;font-family:var(--ui);color:var(--ink)}
html body .crm-start .crm-eb{font-size:var(--fs-12);letter-spacing:.08em;color:var(--acc);font-weight:600;margin:0 0 8px}
html body .crm-start h1{font-family:var(--serif);font-size:var(--fs-36);line-height:var(--lh-h);letter-spacing:-.01em;margin:0 0 12px;color:var(--ink)}
html body .crm-start .crm-lede{font-size:var(--fs-18);line-height:1.7;color:var(--ink2);margin:0 0 24px;max-width:40em}
html body .crm-ex{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;margin:0 0 30px}
html body .crm-ex article{border:1px solid var(--hair);border-radius:6px;background:var(--card);padding:16px 16px 14px;display:flex;flex-direction:column;gap:10px;min-width:0}
html body .crm-ex .crm-n{font-family:var(--mono);font-size:var(--fs-12);color:var(--acc);letter-spacing:.06em;font-weight:600}
html body .crm-ex h2{margin:0;font-family:var(--serif);font-size:var(--fs-18);line-height:var(--lh-c);color:var(--ink)}
html body .crm-ex p{margin:0;font-size:var(--fs-14);line-height:1.7;color:var(--ink2)}
html body .crm-ex .crm-demo{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center;padding:10px 12px;background:var(--tint);border-radius:4px;font-size:var(--fs-12);color:var(--mute)}
html body .crm-ex .crm-demo .im-b{margin-right:0}
html body .crm-lp{font-size:var(--fs-12);font-weight:600;padding:2px 9px;border:1px solid currentColor;border-radius:999px;line-height:1.5;white-space:nowrap}
html body .crm-lp.up{color:var(--up)}html body .crm-lp.dn{color:var(--dn)}html body .crm-lp.wn{color:var(--warn)}
html body .crm-bubble{align-self:flex-start;background:var(--acc);color:var(--onacc);padding:6px 12px;border-radius:14px 14px 4px 14px;font-size:var(--fs-14);line-height:1.5}
html body .crm-ex .crm-go{margin-top:auto;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
html body .crm-ex .crm-go a:not(.btn){font-size:var(--fs-14);font-weight:600;color:var(--ink);text-decoration:underline;text-underline-offset:3px}
html body .crm-join{border-top:1px solid var(--hair);padding-top:24px}
html body .crm-join h2{font-family:var(--serif);font-size:var(--fs-28);line-height:var(--lh-c);margin:0 0 10px;color:var(--ink)}
html body .crm-join ul{margin:0 0 16px;padding-left:1.2em;font-size:var(--fs-16);line-height:1.8;color:var(--ink)}
html body .crm-join .crm-note{margin:14px 0 0;font-size:var(--fs-12);line-height:1.6;color:var(--mute)}
html body .crm-join .crm-note a{color:var(--ink);text-decoration:underline}
@media (max-width:640px){
 html body .crm-ov{align-items:flex-end;padding:0}
 html body .crm-ov .crm-su{width:100%;max-height:92vh;border-radius:6px 6px 0 0;border-left:0;border-right:0;border-bottom:0;padding:20px 16px calc(16px + env(safe-area-inset-bottom,0px))}
 html body .crm-first{left:12px;right:12px;width:auto;bottom:12px}
 html body .crm-start{margin-top:18px}
 html body .crm-start h1{font-size:var(--fs-28)}
 html body .crm-start .crm-lede{font-size:var(--fs-16)}
}