/* 讀書頁（reading/view.html）閱讀舒適度層　2026-10-02
 * 範圍：FS_PROMO／FSEQ_TECH／FSEQ_ENG 的 reading/view.html（在各頁 <style> 與 reader-nav.css 之後載入）。
 * 目標：長時間閱讀不累——欄寬 620px（約 36em，扣內距後每行 33–36 字）、正文 17px／行高 1.8、
 *       白話解釋比原文淺一階但仍 ≥8:1、白底頁不放大面積黑色塊、不靠 emoji 當圖示。
 * 刻意不用 design-fix.css：它的 .chip／.tab 44px 規則會撐高讀書卡內的標籤。 */

@import url("/assets/print.css") print;
:root{--rd-ink:#2b2b2b;--rd-soft:#4a4f59;--rd-navy:#1e3a5f;--rd-wash:#eef3fb;--rd-wash2:#e4ecf7;--rd-line:#cfdcee}

/* ═══ 1. 欄寬、字級、行高（#5）═══════════════════════════════════════ */
.ch-body{font-size:18px;line-height:1.8}
/* 文字型容器限寬 620px（≈36em；用 px 是因為 em 會隨各元素字級浮動，標題列會量出不同寬），置左；
   表格／比較卡／圖解／樹狀圖維持原寬，不被擠。 */
.ch-body .art-card,.ch-body article.card,.ch-body .secmap,.ch-body .chmap,.ch-body .intro-box,.ch-body .note,
.ch-body .section-title,.ch-body .section-head,.ch-body .chapter-head,.ch-body .law-grp,.ch-body .grp,
.ch-body .book-body>p,.ch-body .book-body>ul,.ch-body .book-body>ol,.ch-body .book-body>h2,.ch-body .book-body>h3,
.ch-body .card,.ch-body h3.sec,.ch-body .notice,.ch-body .repealed-banner,.ch-body .tip-skip,.ch-body .qa,.ch-body .case-box{max-width:620px}
.ch-body .compare,.ch-body .compare-wrap{max-width:760px}
.ch-body .card>p{font-size:18px;line-height:1.8;color:var(--rd-ink)}
.ch-body .book-body{font-size:18px}
.ch-body .book-body>p,.ch-body .book-body>ul,.ch-body .book-body>ol{font-size:1em;line-height:1.8}
.ch-body article.card{font-size:18px;line-height:1.8}
.ch-body article.card .meta{font-size:14px}
.ch-body article.card figcaption,.ch-body article.card .hit{font-size:14px}
.ch-body article.card details.more>summary{font-size:16px}
.ch-body .secmap .story,.ch-body .law-map .story{font-size:16px;line-height:1.85}
.ch-body .secmap .g,.ch-body .secmap .g a{font-size:16px}
.ch-body .secmap .g .gq{font-size:14px}
.ch-body .chmap{font-size:16px}
.ch-body .grp{font-size:18px}
.ch-body .intro-box p{font-size:16px;line-height:1.8}
.ch-body .note{font-size:16px}
.ch-body .branch-detail,.ch-body .qa,.ch-body .template,.ch-body .mnemonic,.ch-body .mnemonic-box,.ch-body .risk-flag,
.ch-body .priority-warn,.ch-body .case-box,.ch-body .notice,.ch-body .techcard .tc-body,.ch-body .tl-content,
.ch-body .compare-body .side p,.ch-body .compare .col p,.ch-body .skeleton ol,.ch-body .sample-essay p,
.ch-body .tip-skip,.ch-body .examnote,.ch-body .compare-key,.ch-body .compare-col{font-size:16px;line-height:1.8}
.ch-body .sample-essay p{line-height:1.95}
.ch-body .flow{font-size:16px}
.ch-body .compare-cols .side,.ch-body .compare-card .diff{font-size:16px;line-height:1.75}
.ch-body .compare-card .ttl{font-size:16px}
.ch-body .compare-card .cite,.ch-body .xref-line{font-size:14px;line-height:1.75}
.ch-body .tree-root{font-size:1rem}
.ch-body .branch-label{font-size:1rem}
.ch-body table.ref,.ch-body table.pen-tbl,.ch-body .mini-table{font-size:16px}
.ch-body .src-note,.ch-body .warn-box,.ch-body .locked-inline,.ch-body .orig-note{font-size:14px;line-height:1.75}
.ch-body .art-card .flno{font-size:14px}
.ch-body .paywall-hint{font-size:14px}

/* ═══ 2. 階層：白話要比原文好讀，主從清楚（#6）══════════════════════════ */
/* FSEQ 設備士／設備師：.orig 原文、.explain 白話、.exam 考點 */
.ch-body .art-card .orig{font-size:18px;line-height:1.8;color:var(--rd-ink)}
.ch-body .art-card .orig .para-no{font-size:14px}
.ch-body .art-card .orig .para-cont{font-size:14px}
.ch-body .art-card .explain{font-size:16px;line-height:1.8;color:var(--rd-soft)}
.ch-body .art-card .explain b{color:var(--rd-ink)}
.ch-body .exam{font-size:16px;line-height:1.75}
.ch-body .law-change{font-size:16px;line-height:1.75}
/* FS_PROMO 升官等：.lawtext 原文、.plain 白話、.example／.exam */
.ch-body .lawtext{font-size:18px;line-height:1.8;color:var(--rd-ink)}
.ch-body .lawtext .para-no{font-size:14px}
.ch-body .plain,.ch-body .plain p{font-size:16px;line-height:1.8;color:var(--rd-soft)}
.ch-body .plain b{color:var(--promo,#1e3a5f)}
.ch-body .example{font-size:16px;line-height:1.75;color:var(--rd-soft)}
.ch-body .art-num{font-size:14px}
/* 讀書卡 chip（原 #8a6d1a on #fff6d8 只有 4.5:1，12.8px）→ 約 6.8:1、15px */
.ch-body .chip{font-size:14px}
.ch-body details.chip{border-radius:14px}
.ch-body details.chip summary{font-size:16px}
.ch-body details.chip .cbody{font-size:16px;line-height:1.75}
.ch-body .chip.warn,.ch-body .chip.warn .cbody{color:#6b5210}
.ch-body .techcard.warn .tc-title,.ch-body .techcard.warn{color:#6b5210}
.ch-body .skeleton .warn-note{color:#6b5210;font-size:14px}

/* ═══ 3. 白底頁的大面積黑色塊 → 淺藏青淡底（#7）═════════════════════════ */
/* 頂端試讀／解鎖提示條（FS_PROMO）：淺藍底細邊、左藏青色棒，高度壓在 56px 附近 */
.unlock-banner{background:var(--rd-wash);color:#26364d;border:1px solid var(--rd-line);border-left:4px solid var(--rd-navy);
  border-radius:12px;padding:6px 14px 6px 16px;gap:6px 14px;margin-bottom:18px;font-size:.875rem;line-height:1.45}
.unlock-banner b{color:var(--rd-navy)}
.unlock-btn{padding:7px 16px;font-size:.75rem;min-height:36px;display:inline-flex;align-items:center}
.preview-cta{background:var(--rd-wash);color:#26364d;border:1px solid var(--rd-line);border-left:4px solid var(--rd-navy);
  border-radius:12px;padding:12px 16px 12px 18px;margin-top:20px;line-height:1.65}
.preview-cta b{color:var(--rd-navy)}
.preview-cta-btn{background:var(--rd-navy);color:#fff}
/* 左側導覽軌（電腦）與手機章節條：淡藏青底、深藏青字 */
html.rn-pc #rn-rail{background:var(--rd-wash2);border-right:1px solid var(--rd-line)}
#rn-rail button,#rn-rail a{color:#3d5675;font-size:12px}
#rn-rail a.on,#rn-rail a:hover,#rn-rail button:hover{background:#d2e0f2;color:var(--rd-navy)}
#rn-rail a.on b{color:var(--rd-navy)}
#rn-rail .rn-sep{background:rgba(30,58,95,.18)}
#rn-rail .rn-lb{font-size:12px;max-width:52px}
html.rn-mob #rn-mtop{background:var(--rd-wash2);color:var(--rd-navy);border-bottom:1px solid var(--rd-line)}
#rn-mtop .rn-tt{color:var(--rd-navy)}
#rn-mtop .rn-cr{color:#4a5d78;opacity:1;font-size:12px}
#rn-mtop .rn-pb{background:var(--rd-line)}
#rn-mtop .rn-pb i{background:var(--rd-navy)}
html.rn-mob #rn-mbot button{font-size:12px}

/* ═══ 4. 線條圖示（取代 emoji）═══════════════════════════════════════ */
.hb-ic{display:inline-block;width:1.05em;height:1.05em;background-color:currentColor;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat;vertical-align:-.17em;flex:none}
.hb-lock{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='9.5' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E")}
.hb-unlock{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='9.5' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 7.6-1.7'/%3E%3C/svg%3E")}
.hb-warn{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4 2.8 20h18.4z'/%3E%3Cpath d='M12 10v4.5M12 17.4v.1'/%3E%3C/svg%3E")}
.hb-search{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='m16 16 4.5 4.5'/%3E%3C/svg%3E")}
.hb-chat{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5.5h16v10.5H9.5L5.5 19.5V16H4z'/%3E%3C/svg%3E")}
.locked-ico{color:#5b7aa3;line-height:1}
.locked-ico .hb-ic{width:1.1em;height:1.1em}
.ch-lock{color:#5b7aa3}
.ch-lock .hb-ic{width:1em;height:1em}
.repealed-head .hb-ic{vertical-align:-.2em;margin-right:4px}
.ch-body h3.sec.sec-hit::after{content:'就是這一張'}
.fb-btn{display:inline-flex;align-items:center;gap:6px}

/* ═══ 5. 焦點、減少動態（取自 design-fix.css，範圍限讀書頁）═══════════════ */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--rd-navy);outline-offset:2px;border-radius:6px}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}

/* ═══ 6. 手機：窄欄換成實際可讀的行寬 ═══════════════════════════════════ */
@media (max-width:640px){
  main.content{padding:20px 14px 110px}
  .ch-body .art-card{padding:14px 14px 40px}
  .ch-body article.card{padding:12px 14px 48px}
  .ch-body .intro-box{padding:16px 16px}
  .ch-body .note{padding:16px 16px}
  .unlock-banner{padding:10px 12px 10px 14px}
}
/* 觸控裝置：熟悉度按鈕要點得到（≥44px 高），卡片底部多留空間不蓋到字 */
@media (hover:none){
  .mark-btn{font-size:14px;min-height:44px;padding:6px 14px}
  .ch-body .art-card{padding-bottom:60px}
  .ch-body article.card{padding-bottom:62px}
}
.mark-btn{font-size:12px}
.mark-menu button{font-size:14px}

/* ═══ 7. 小字下限 12px（側欄分組標題、展開箭頭、鍵位、導覽標籤、登入晶片）══ */
.art-grp,.grp-label,.art-sec,.sys-tree-label,.art-legend,.art-legend .lg,.scope-n,.ch-free,.subj-caret,.ch-caret,.ch-grp-ar,kbd,.rn-sidesearch kbd{font-size:12px}
.nav-tag,.nav-tag a{font-size:12px}
.nav-a>span{font-size:12px!important}
.ch-body a.exam-link,.ch-body span.exam-link{font-size:12px;color:#5b4a8a}
.ch-body a.exam-link:hover{color:#3f2f6b}

/* ═══ 8. 手機點擊目標 ≥44px（頂導覽、章節抽屜）═══════════════════════════ */
@media (max-width:820px){
  html .nav-brand{min-height:44px;padding:0 6px;margin-left:-6px}
  html .nav>a.nav-a{min-height:44px;height:44px!important;padding:0 9px!important;display:inline-flex;align-items:center}
  html .nav-switch-btn{min-height:44px;padding:0 11px;display:inline-flex;align-items:center}
}
@media (max-width:400px){html .nav-switch-btn{padding:0 7px}}
html.rn-mob #tsidebar .subj-link,html.rn-mob #tsidebar .ch-link,html.rn-mob #tsidebar .art-link,html.rn-mob #tsidebar .art-grp,
html.rn-mob #tsidebar .ch-fold,html.rn-mob #tsidebar .sys-node,html.rn-mob #tsidebar .ch-grp-h{min-height:44px;display:flex;align-items:center;flex-wrap:wrap}
html.rn-mob #tsidebar .rn-sidesearch{min-height:44px}
html.rn-mob #tsidebar .rn-back{position:relative}
html.rn-mob #tsidebar .rn-back::after{content:'';position:absolute;left:-4px;right:-4px;top:-12px;bottom:-12px}
@media (max-width:820px){.fb-btn{min-height:44px}}
html.rn-mob #rn-mbot button{min-height:48px;justify-content:center}
html.rn-mob #tsidebar .ch-fold{min-width:44px;justify-content:center}
@media (max-width:820px){.pn-link{display:inline-flex;align-items:center;min-height:44px}}

/* ── 相關條文連結改膠囊鈕（2026-10-02 使用檢驗 U15）──
   「單一法規相關條文快速聯動」的唯一入口原本只有 13px 字、16px 高的行內連結（升官等還是瀏覽器預設藍），
   改成與面板條文清單同色系的膠囊：站內藏青、14px、點擊高度 40px（手機 44px）。 */
.ch-body .xref-line a{display:inline-flex;align-items:center;min-height:40px;padding:0 12px;margin:3px 4px 3px 0;
  border-radius:999px;background:#eaf1fb;border:1px solid #c9d8ec;color:var(--hb-link,#1e3a5f)!important;font-size:14px;font-weight:600;
  line-height:1.3;text-decoration:none!important;vertical-align:middle}
.ch-body .xref-line a:hover{background:#1e3a5f;border-color:#1e3a5f;color:#fff!important}
.ch-body .xref-line a:focus-visible{outline:2px solid #1e3a5f;outline-offset:2px}
@media (max-width:760px){.ch-body .xref-line a{min-height:44px}}

/* ═══ 9. 最終驗收（2026-10-02）═══════════════════════════════════════════ */
/* 法規異動框：內文 ≥15px、強調字 #8a3f0e on #fdece0（約 6.3:1；原 #b35c1e 4.09:1） */
.ch-body .law-change,.ch-body .law-change p{font-size:16px;line-height:1.8}
.ch-body .law-change b,.ch-body .law-change .lc-title{color:#8a3f0e}
/* 螢幕閱讀器用的隱藏標題（補 h1→h3 之間缺的 h2，畫面上看不到） */
.hb-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* 重新標成 h4 的比較欄標題（來源內容是 h5，跳級），樣式比照原 h5 */
.ch-body .compare-col h4{margin:0 0 6px;color:var(--promo,#1e3a5f);font-size:.875rem}
.ch-body .compare .col h4{margin:0 0 8px;color:var(--accent,#1e3a5f);font-size:.875rem}
/* 手機章節抽屜收起時不再參與版面與焦點（原本只靠 translateX 移出畫面，內容仍可被 Tab 到、也被量成貼邊） */
@media (max-width:900px){
  body:not(.sidebar-open) #tsidebar{visibility:hidden;transition:transform .2s,visibility 0s linear .2s}
}
/* 手機點擊目標 ≥44px：返回鈕、解鎖／註冊鈕、查看方案、對應歷屆考題連結 */
@media (max-width:820px){
  .rn-back{min-height:44px;padding:0 14px 0 10px}
  .unlock-btn{min-height:44px;padding:0 18px}
  .preview-cta-btn{display:inline-flex;align-items:center;min-height:44px}
  .ch-body a.exam-link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding:0 8px}
}
/* 電腦左側導覽軌 60→76px：標籤文字不貼邊（左右各留 ≥12px） */
html.rn-pc #rn-rail{width:76px}
/* 綠框（.exam／.examnote）內的強調字：#1f7a44／#3f7d5c on #eef6f0 只有 4.44／4.2:1 → #17653a（約 6.2:1） */
.ch-body .exam b,.ch-body .examnote b{color:#17653a}

/* ═══ 考點標籤（2026-10-02 老闆選定 C 彩色標籤＋條列）═════════════════════════
   考點提示：綠膠囊「考點」＋條列（每句一點）＋關鍵字綠粗體＋淡綠底圓角；
   最後一行：橘膠囊「常考」（歷屆命中≥3 次才有）＋「考過 N 次」＋題號連結。
   樣式範本：docs/整併檢驗-2026-10/考點提示-圖示選擇.html C 區、考點提示整併.html。
   來源檔 <style> 內有同一份（scripts/lib/exam-pill.js 的 CSS），直接開檔也一致。 */
.ch-body div.exam{margin-top:8px;padding:8px 12px;background:var(--hb-exam-bg,#eef6f0);border:0;border-radius:8px;font-size:16px;line-height:1.75;color:var(--rd-ink,#22262b)}
.ch-body div.exam b{color:#1f6b45}
.ch-body .exam .pill{display:inline-block;font-size:.75rem;font-weight:700;padding:1px 9px;border-radius:999px;margin-right:6px;vertical-align:1px;line-height:1.5;color:#fff;font-style:normal}
.ch-body .exam .pill.g{background:#1f6b45}
.ch-body .exam .pill.o{background:#8a4b12}
.ch-body .exam .src-note{color:#646a72;font-size:.875rem}
.ch-body .exam ul.ex-pts{margin:2px 0 0;padding-left:1.1em}
.ch-body .exam ul.ex-pts li{margin:1px 0}
.ch-body .exam .ex-tag{margin:6px 0 0;font-size:.875rem;color:#4a4f56}
.ch-body div.exam .ex-tag b{color:#22262b}
.ch-body .exam a.exam-link,.ch-body .exam span.exam-link{display:inline;min-height:0;min-width:0;padding:0 2px;font-size:inherit;color:#1f6b45;text-decoration:underline;text-underline-offset:2px}

/* ═══ 考法標籤（2026-10-03）火災學讀本「考試怎麼問・怎麼答」＋讀書卡「這張卡固化的真實考點」 ═══
   同系列：綠膠囊「考法」／「考點」＋淡綠底圓角；內文表格、題例保留原樣，關鍵字綠粗體。 */
.ch-body article.card div.k-exam{margin:14px 0 8px;border:0;border-left:0;border-radius:8px;background:var(--hb-exam-bg,#eef6f0);padding:8px 12px;line-height:1.75}
.ch-body .k-exam .pill,.ch-body .examnote .pill{display:inline-block;font-size:.75rem;font-weight:700;padding:1px 9px;border-radius:999px;margin-right:6px;vertical-align:1px;line-height:1.5;color:#fff;font-style:normal;background:#1f6b45}
.ch-body article.card .k-exam b{color:#17653a}
.ch-body article.card .k-exam h4{margin:10px 0 4px;color:#22262b}
.ch-body article.card .k-exam th{background:#dcebe1}
@media(max-width:600px){.ch-body article.card div.k-exam{padding:8px 10px}}
/* 考點膠囊後的「他者脈絡」小註：view.html 的 .src-note 是整塊註記框，在 .exam 內要還原成行內小字 */
.ch-body .exam small.src-note{display:inline;white-space:normal;margin:0;padding:0;border:0;background:none;border-radius:0}

/* ═══ 範圍切換鈕手機點擊目標 ≥44px（2026-10-03）══════════════════════════════
   讀書頁頂部「升官等範圍／全部」切換（.scope-seg button，樣式在各 view.html 內：padding 6px 14px＝約 29px 高）。
   只在手機／觸控加高，桌機維持原膠囊尺寸。 */
@media (max-width:820px),(pointer:coarse){
  html .scope-seg button{min-height:44px;padding-top:0;padding-bottom:0;display:inline-flex;align-items:center;justify-content:center}
}

/* ═══ 右側聯動欄（2026-10-03，assets/reader-side.js）══════════════════════════════
   只在 ≥1280px 且 reader-side.js 確認本章有法條卡時生效（html.rs-on）；<1280px 一條規則都不吃。
   卡片內的考點、考過題號、相關條文移到右欄顯示，卡片只留條號、原文、白話（原型的 .inline 概念）。
   配色沿用原型：綠考點膠囊 #1f6b45、橘常考膠囊 #8a4b12、藏青 #1e3a5f。 */
#rsSide{display:none}
@media (min-width:1280px){
  html.rs-on #rsSide:not([hidden]){display:block;width:300px;flex-shrink:0;position:sticky;top:64px;align-self:flex-start;margin:20px 20px 0 0;
    max-height:calc(100vh - 150px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
  html.rs-on main.content{padding-bottom:65vh}
  html.rs-on #content .ch-body .art-card .exam,
  html.rs-on #content .ch-body .art-card .xref-line{display:none}
}
@media (min-width:1440px){html.rs-on #rsSide:not([hidden]){width:340px}}
#rsSide .rs-panel{background:var(--hb-surface,#fff);border:1px solid #e3e7ee;border-radius:12px;padding:16px 18px;color:#1b2333;line-height:1.7}
#rsSide .rs-panel.rs-in{animation:rsIn .18s ease-out}
@keyframes rsIn{from{opacity:.35}to{opacity:1}}
@media (prefers-reduced-motion:reduce){#rsSide .rs-panel.rs-in{animation:none}}
#rsSide .rs-no{display:inline-block;background:#e6edf7;color:var(--hb-link,#1e3a5f);font-weight:700;font-size:14px;padding:1px 10px;border-radius:6px;margin-bottom:6px}
#rsSide .rs-t{margin:0 0 12px;font-size:18px;line-height:1.5;color:#1b2333}
#rsSide .pill{display:inline-block;font-size:12px;font-weight:700;padding:1px 9px;border-radius:999px;color:#fff;vertical-align:1px;line-height:1.5;margin-right:6px}
#rsSide .pill.g{background:#1f6b45}
#rsSide .pill.o{background:#8a4b12}
#rsSide .rs-box{background:#eef7f1;border:1px solid #cfe6d8;border-radius:10px;padding:10px 12px;margin-bottom:12px;font-size:16px;line-height:1.7;color:#22262b}
#rsSide .rs-box ul{margin:6px 0 0;padding-left:1.2em}
#rsSide .rs-box li{margin:2px 0}
#rsSide .rs-box b{color:#1f6b45}
#rsSide .rs-box a{color:#1f6b45;text-decoration:underline;text-underline-offset:2px}
#rsSide .rs-empty{margin:0 0 4px;font-size:14px;color:#5b6577}
#rsSide .rs-sec{display:flex;flex-wrap:wrap;align-items:center;gap:2px 6px;font-size:14px;font-weight:700;color:#3d4757;margin:14px 0 6px}
#rsSide .rs-sub{font-weight:400;color:#5b6577;font-size:12px;margin-left:auto}
#rsSide .rs-lk{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:40px;padding:4px 12px;border:1px solid #e3e7ee;border-radius:8px;
  margin-bottom:6px;color:var(--hb-link,#1e3a5f);text-decoration:none;font-size:14px;line-height:1.45}
#rsSide a.rs-lk:hover,#rsSide a.rs-lk:focus-visible{border-color:#1e3a5f;background:#f6f9fd}
#rsSide .rs-lk small{display:inline-block;margin-left:6px;font-size:12px;color:#5b6577}
#rsSide .rs-lk i{font-style:normal;color:#8a94a6;flex-shrink:0}
#rsSide .rs-nolink{color:#5b6577}

/* ═══ 8. 2026-10-07 版面硬傷（巡查：讀書頁／逐條頁 375・768・1280）══════════════════════
   只動樣式不動內容：觸控目標 ≥44px（≤820 寬）、對比 ≥4.5:1、可捲動的等寬表格。 */
@media (max-width:820px){
  .mark-btn{min-height:44px;font-size:14px;padding:6px 14px}
  .ch-body .paywall-hint-btn{display:inline-flex;align-items:center;min-height:44px}
  .ch-body .toolbar a,.ch-body .backlink{display:inline-flex;align-items:center;min-height:44px}
  .ch-body a.art-link{display:flex;align-items:center;min-height:44px}
  .ch-body input#search,.ch-body #search{min-height:44px}
}
.ch-body .src-note,.ch-body .src-note b{color:#6b3f02}
html body .ch-body .toolbar,html body .ch-body footer{color:#5b5546}
.ch-body li>span[style*="8a8578"]{color:#6b6657!important}
.hb-scroll{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
.hb-scroll:focus-visible{outline:2px solid #1e3a5f;outline-offset:2px}
/* ══ 2026-10-11 UX 修正 ══ */
/* #15 讀書卡法條收合（details.chip summary 自帶 outline:none）鍵盤焦點要看得到 */
.ch-body details summary:focus-visible{outline:2px solid #1e3a5f!important;outline-offset:2px}
:focus-visible{outline-style:solid!important;outline-width:2px!important}
/* #10 字級下限 12px：卡片內 small、佐升正條號連結 */
.ch-body small{font-size:max(12px,.8333em)}
.ch-body a.law-cite{font-size:max(12px,1em)}
/* #11 對比：一般四等讀書卡提醒框粗體 #b35c1e（4.09:1）加深 */
.ch-body .risk-flag b{color:#8a4513}
.ch-body span.art{font-size:max(12px,1em)}

/* ═══ 10. 2026-10-25 讀書頁版面整理（試做：只在 html.tidy-on 時生效，旗標由 reader-side.js 的 TIDY_PRODUCTS 決定）═══
   ① 欄寬：原本 §1 把所有文字型容器鎖 620px（桌機右側大片空白）→ 試做產品改成整章 900px 上限，卡片／小標／模板吃滿該寬。
   ② 標題重複：view.html 已在上方印一次「① 章名」大標，正文又自帶 .chapter-head（徽章＋h2）→ 隱藏正文那一份（DOM 仍在，錨點／搜尋不受影響）。
   ③ 「用途」說明列：reader-side.js 會把它收進 <details class="rd-use">，文字與連結一字不少。
   手機（≤760px）不動，維持原行寬。 */
@media (min-width:761px){
  html.tidy-on .ch-body[class*="src-"] section.chapter{max-width:900px}
  html.tidy-on .ch-body[class*="src-"] .card,
  html.tidy-on .ch-body[class*="src-"] h3.sec,
  html.tidy-on .ch-body[class*="src-"] .notice,
  html.tidy-on .ch-body[class*="src-"] .qa,
  html.tidy-on .ch-body[class*="src-"] .case-box{max-width:none}
}
html.tidy-on .ch-body[class*="src-"] .chapter-head{display:none}
html.tidy-on .ch-body[class*="src-"] details.rd-use{max-width:900px;margin:0 0 14px;border:1px solid var(--bd,#dfe4ec);border-radius:10px;background:#fbf9f5;font-size:15px;line-height:1.75;color:var(--muted,#5b5546)}
html.tidy-on .ch-body[class*="src-"] details.rd-use>summary{cursor:pointer;padding:8px 14px;font-weight:600;color:var(--assist,#1e3a5f);list-style:none}
html.tidy-on .ch-body[class*="src-"] details.rd-use>summary::-webkit-details-marker{display:none}
html.tidy-on .ch-body[class*="src-"] details.rd-use>summary::before{content:"▸ ";display:inline-block}
html.tidy-on .ch-body[class*="src-"] details.rd-use[open]>summary::before{content:"▾ "}
html.tidy-on .ch-body[class*="src-"] details.rd-use>.toolbar{border:0;background:none;margin:0;padding:0 14px 10px;font-size:inherit}

/* ═══ 11. 2026-10-31 桌機欄寬放寬（使用者：版面右側大片空白，不要一直出現）═══
   §1 把文字型容器鎖在 620px（約 33–36 字／行），1200px 以上的螢幕右側空掉一半。
   桌機（≥761px）改成 900px 上限（FS_ASSIST 試做時已驗證可讀），表格／圖解維持原樣；手機不動。 */
@media (min-width:761px){
  .ch-body .art-card,.ch-body article.card,.ch-body .secmap,.ch-body .chmap,.ch-body .intro-box,.ch-body .note,
  .ch-body .section-title,.ch-body .section-head,.ch-body .chapter-head,.ch-body .law-grp,.ch-body .grp,
  .ch-body .book-body>p,.ch-body .book-body>ul,.ch-body .book-body>ol,.ch-body .book-body>h2,.ch-body .book-body>h3,
  .ch-body .card,.ch-body h3.sec,.ch-body .notice,.ch-body .repealed-banner,.ch-body .tip-skip,.ch-body .qa,.ch-body .case-box,
  .ch-body .compare,.ch-body .compare-wrap{max-width:900px}
}

/* ═══ 12. 2026-10-31 桌機隱藏章節底部「上一章／下一章」連結（使用者：右下方的下一章連結多餘）═══
   左側已有完整章節清單；側欄收合的寬度（≤900px，手機／平板）仍保留，才有辦法換章。 */
@media (min-width:901px){
  .prevnext{display:none}
}

/* ═══ 13. 原理區分塊（2026-10-31）：k-why 內每個 <p> 是一個獨立要點（①②③…），原本只靠 <br> 逐句換行、各點黏在一起。
   每點做成一塊：左側色條＋淺底，開頭粗體當小標獨立成行；「原理」字樣當區塊標籤。 */
.ch-body article.card .k-why>b:first-child{display:inline-block;margin:6px 0 2px;padding:1px 12px;border-radius:999px;background:var(--rd-navy);color:#fff;font-size:.8rem;letter-spacing:.12em}
.ch-body article.card .k-why>p{margin:10px 0;padding:10px 14px 10px 16px;border-left:4px solid var(--rd-line);border-radius:0 10px 10px 0;background:rgba(30,58,95,.045)}
.ch-body article.card .k-why>p.kh>b:first-child{display:block;margin:0 0 4px;padding-bottom:4px;border-bottom:1px dashed var(--rd-line);color:var(--rd-navy)}
.ch-body article.card .k-why>p.kh{border-left-color:var(--rd-navy)}

/* ═══ 14. 卡片內嵌 SVG 圖的線條色（2026-10-31）：教材圖用 style="stroke:var(--acc)" 畫曲線、箭頭與標籤，
   讀書頁原本沒定義 --acc，線條變成無色（溫度—時間曲線整條消失）。補上，深色模式用淺藍。 */
:root{--acc:#1e3a5f}
html[data-theme="dark"]{--acc:#7fb2dd}