:root {
  --yellow: #cbbbe3;
  --yellow-soft: #f1edf7;
  --coral: #f0907a;
  --coral-dark: #b85e70;
  --ink: #443952;
  --ink-soft: #655a70;
  --muted: #81768d;
  --paper: #ffffff;
  --canvas: #ffffff;
  --line: #e7e0ef;
  --green: #8cc9aa;
  --blue: #d9cff0;
  --shadow: 0 18px 46px rgba(34, 36, 40, .09);
  /* 字級四級制｜2026-07-03 定案 */
  --fs-base: 18.5px;
  --fs-xs: 14.5px;
  --fs-m: 22px;
  --fs-l: 30px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--canvas); font-family: "Noto Sans TC", "PingFang TC", sans-serif; font-size: var(--fs-base); font-weight: 500; line-height: 1.75; }
a { color: inherit; text-decoration: none; }
/* 中文換行規則：標題配平、內文避孤字；line-breaks.js 再把斷點限制在詞界。 */
h1, h2, h3 { overflow-wrap: break-word; line-break: strict; text-wrap: balance; }
p, li, summary, dt, dd { overflow-wrap: break-word; line-break: strict; text-wrap: pretty; }
html.zh-word-break h1, html.zh-word-break h2, html.zh-word-break h3,
html.zh-word-break p, html.zh-word-break li, html.zh-word-break summary,
html.zh-word-break dt, html.zh-word-break dd { word-break: keep-all; }
.nb, .no-break { white-space: nowrap; }
.clause { display: inline-block; }
h1.title-lines { text-wrap: auto; }   /* JSON titleDisplay 指定斷行時關掉 balance，否則瀏覽器會為了等長把指定行再拆 */
.issue-hero.has-illustration h1.title-lines { max-width: none; padding-right: 292px; }   /* 指定斷行標題用到插圖（right 42＋寬 250）前的全部寬度，不再被 610−125 限制在 485px */   /* 標題／金句子句成塊，只在標點換行；過長時句內折行（比照台灣前進主站 .nb） */
/* 方案 C（2026-08-18）：主標明體大、次標黑體小灰；兩層各自成行 */
h1.title-two { text-wrap: auto; letter-spacing: 0; line-height: 1.15; }
h1.title-two .t-main { display: block; font-family: "Noto Serif TC", "Noto Sans TC", "PingFang TC", serif; font-weight: 900; font-size: clamp(38px, 5vw, 60px); letter-spacing: .02em; }
h1.title-two .t-sub { display: block; margin-top: .35em; font-family: "Noto Sans TC", "PingFang TC", sans-serif; font-weight: 700; font-size: clamp(22px, 2.6vw, 32px); letter-spacing: -.02em; line-height: 1.35; color: var(--ink-soft); }
.issue-hero.has-illustration h1.title-two { max-width: none; padding-right: 292px; }

.reader-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 88px;
  padding: 0 max(20px, calc((100vw - 1080px) / 2));
  background: #ffffff;
  border-bottom: 3px solid var(--yellow);
}
.reader-brand { display: flex; gap: 12px; align-items: center; }
.reader-brand > span { display: grid; width: 44px; height: 35px; place-items: center; color: var(--ink); background: var(--yellow); border-radius: 18px 5px 18px 5px; font-weight: 900; transform: skewX(-8deg); }
.reader-brand div { display: grid; }
.reader-brand b { color: var(--ink); font-size: var(--fs-base); font-weight: 800; letter-spacing: .08em; }
.reader-brand small { color: var(--muted); font-size: var(--fs-xs); font-weight: 800; letter-spacing: .2em; }
.reader-actions { display: flex; gap: 12px; align-items: center; }
.view-switch { display: flex; padding: 3px; background: var(--yellow-soft); border-radius: 3px; }
.view-switch a { padding: 9px 12px; color: var(--ink-soft); font-size: var(--fs-xs); font-weight: 800; white-space: nowrap; }
.view-switch a.active { color: var(--ink); background: #fff; box-shadow: 0 2px 8px rgba(34, 36, 40, .08); }
.view-switch-back { padding: 9px 12px; color: var(--ink-soft); font-size: var(--fs-xs); font-weight: 800; white-space: nowrap; }   /* 郵件預覽頁（內部校對用）回單頁連結 */

.email-preview-page { min-height: 100vh; background: #ffffff; }
.email-preview-shell { width: min(1120px, calc(100% - 40px)); padding: 46px 0 70px; }
.email-preview-intro { display: flex; gap: 30px; align-items: flex-end; justify-content: space-between; margin-bottom: 24px; }
.email-preview-intro p { margin: 0 0 7px; color: var(--coral-dark); font-size: var(--fs-xs); font-weight: 900; letter-spacing: .15em; }
.email-preview-intro h1 { margin: 0; color: var(--ink); font-size: 34px; letter-spacing: -.05em; }
.email-preview-intro > span { padding: 8px 11px; color: var(--ink-soft); background: #fff; border: 1px solid var(--line); font-size: var(--fs-xs); font-weight: 700; }
.email-preview-shell iframe { display: block; width: 100%; height: 1580px; background: #ffffff; border: 0; box-shadow: var(--shadow); }

main { width: min(960px, calc(100% - 40px)); margin: auto; }
.issue-hero {
  position: relative;
  padding: 48px 56px 42px;   /* 2026-08-19 全頁緊湊化（使用者：一分鐘滑完）：hero 與各區段上下留白約減半 */
  margin: 28px 0 36px;
  overflow: hidden;
  background: var(--paper);
  border-top: 9px solid var(--yellow);
  box-shadow: var(--shadow);
}
.issue-hero::before { position: absolute; top: -150px; right: -130px; width: 360px; height: 360px; content: ""; background: var(--yellow); border-radius: 50%; }
.issue-hero::after { position: absolute; right: 27px; bottom: 30px; width: 75px; height: 75px; content: ""; border: 18px solid var(--coral); border-radius: 50%; opacity: .8; }
.issue-hero > * { position: relative; z-index: 1; }
.issue-illustration { position: absolute; top: 38px; right: 42px; z-index: 0; display: grid; width: 250px; height: 250px; place-items: center; margin: 0; overflow: hidden; background: #d9caed; border: 6px solid #fff; border-radius: 38% 62% 46% 54% / 48% 42% 58% 52%; box-shadow: 0 14px 0 rgba(74, 53, 112, .12); transform: rotate(2deg); }
.issue-illustration span { display: none; }
.issue-illustration img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: cover; }
.issue-hero.has-illustration h1, .issue-hero.has-illustration .issue-dek { max-width: 610px; padding-right: 125px; }
.issue-meta { display: flex; gap: 8px; align-items: center; color: var(--muted); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .06em; }
.issue-meta span, .issue-meta time { padding: 6px 9px; background: #f0f0ed; }
.issue-label { margin: 22px 0 10px; color: var(--coral-dark); font-size: var(--fs-xs); font-weight: 800; letter-spacing: .14em; }
.issue-label::before { display: inline-block; width: 31px; height: 3px; margin: 0 10px 3px 0; content: ""; background: currentColor; }
.issue-hero h1 { max-width: 760px; margin: 0; color: var(--ink); font-size: clamp(41px, 6vw, 68px); font-weight: 900; letter-spacing: -.065em; line-height: 1.16; }
.issue-dek { max-width: 740px; margin: 14px 0; color: var(--ink-soft); font-size: var(--fs-base); line-height: 1.9; }
.quick-answer { padding: 20px 24px; margin-top: 20px; background: var(--yellow-soft); border-left: 7px solid var(--yellow); }
.quick-answer small { color: var(--ink-soft); font-size: var(--fs-xs); font-weight: 800; letter-spacing: .1em; }
.quick-answer p { margin: 7px 0 0; color: var(--ink); font-size: var(--fs-base); font-weight: 700; line-height: 1.8; }
.issue-update { margin: 12px 2px 0; color: var(--muted); font-size: var(--fs-xs); }

.issue-section { padding: 36px 0; border-bottom: 1px solid var(--line); }
.issue-section > header { margin-bottom: 18px; }
.issue-section > header p, .section-kicker, .source-section > div > p { margin: 0 0 10px; color: var(--coral-dark); font-size: var(--fs-xs); font-weight: 800; letter-spacing: .13em; }
.issue-section > header p::before, .section-kicker::before, .source-section > div > p::before { display: inline-block; width: 27px; height: 3px; margin: 0 9px 3px 0; content: ""; background: currentColor; }
.issue-section h2, .source-section h2, .reader-cta h2 { margin: 0; color: var(--ink); font-size: var(--fs-l); font-weight: 900; letter-spacing: -.05em; }
.benefit-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.benefit-grid article { padding: 22px; background: var(--paper); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.benefit-grid article:nth-child(1) { border-top: 6px solid var(--yellow); }
.benefit-grid article:nth-child(2) { border-top: 6px solid var(--green); }
.benefit-grid article:nth-child(3) { border-top: 6px solid var(--coral); }
.benefit-grid small { color: var(--muted); font-size: var(--fs-xs); font-weight: 800; }
.benefit-grid strong { display: block; margin: 11px 0; color: var(--ink); font-size: var(--fs-m); font-weight: 900; }
.benefit-grid p { margin: 0; color: var(--ink-soft); font-size: var(--fs-xs); line-height: 1.75; }
.calculator-intro { max-width: 760px; margin: -6px 0 20px; color: var(--ink-soft); font-size: var(--fs-base); font-weight: 500; line-height: 1.75; }
.overtime-calculator, .electricity-calculator { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr); gap: 24px; align-items: start; }
.calculator-fields, .calculator-result-panel { padding: 34px; background: var(--paper); border: 1px solid var(--line); box-shadow: 0 12px 30px rgba(34, 36, 40, .06); }
.calculator-fields { border-top: 7px solid var(--yellow); }
.calculator-choice { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 0; margin: 0 0 26px; border: 0; }
.calculator-choice legend { grid-column: 1 / -1; margin-bottom: 9px; color: var(--ink); font-size: var(--fs-base); font-weight: 800; }
.calculator-choice label { cursor: pointer; }
.calculator-choice input { position: absolute; opacity: 0; pointer-events: none; }
.calculator-choice span { display: grid; min-height: 50px; place-items: center; color: var(--ink-soft); background: var(--canvas); border: 2px solid transparent; font-size: var(--fs-base); font-weight: 800; }
.calculator-choice input:checked + span { color: var(--ink); background: var(--yellow-soft); border-color: var(--yellow); }
.calculator-choice input:focus-visible + span { outline: 3px solid var(--coral); outline-offset: 2px; }
.calculator-input-grid { display: grid; gap: 23px; }
.calculator-input-grid > label { display: grid; gap: 8px; color: var(--ink); font-size: var(--fs-base); font-weight: 800; }
.calculator-input-grid input, .calculator-input-grid select { width: 100%; min-height: 52px; padding: 0 14px; color: var(--ink); background: #fff; border: 1px solid #cfc7d8; border-radius: 0; font: inherit; font-weight: 700; outline: 0; }
.calculator-input-grid input:focus, .calculator-input-grid select:focus { border-color: var(--coral); box-shadow: 0 0 0 3px rgba(240, 144, 122, .2); }
.calculator-input-grid small { color: var(--muted); font-size: var(--fs-xs); font-weight: 500; line-height: 1.6; }
.meter-reading-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.meter-reading-grid[hidden] { display: none; }
.meter-reading-grid > label { display: grid; gap: 8px; color: var(--ink); font-size: var(--fs-base); font-weight: 800; }
.input-with-unit, .time-inputs > span { display: grid; grid-template-columns: 1fr auto; align-items: center; background: #fff; border: 1px solid #cfc7d8; }
.input-with-unit:focus-within, .time-inputs > span:focus-within { border-color: var(--coral); box-shadow: 0 0 0 3px rgba(240, 144, 122, .2); }
.input-with-unit input, .time-inputs input, .time-inputs select { border: 0; box-shadow: none; }
.input-with-unit input:focus, .time-inputs input:focus, .time-inputs select:focus { box-shadow: none; }
.input-with-unit b, .time-inputs b { padding: 0 14px; color: var(--muted); font-size: var(--fs-xs); white-space: nowrap; }
.time-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.calculator-result-panel { position: sticky; top: 24px; color: #fff; background: var(--ink); border: 0; border-top: 7px solid var(--yellow); }
.result-kicker { margin: 0 0 8px; color: var(--yellow); font-size: var(--fs-xs); font-weight: 800; letter-spacing: .08em; }
.calculator-result-panel > strong { display: block; color: #fff; font-size: var(--fs-l); font-weight: 900; letter-spacing: -.04em; line-height: 1.2; }
.calculator-result-panel > p:not(.result-kicker):not(.copy-status) { margin: 14px 0 24px; color: #ddd7e5; font-size: var(--fs-base); font-weight: 500; line-height: 1.75; }
.calculator-result-panel dl { padding: 18px 0; margin: 0; border-top: 1px solid rgba(255, 255, 255, .18); border-bottom: 1px solid rgba(255, 255, 255, .18); }
.calculator-result-panel dl div { display: grid; grid-template-columns: 1fr auto; gap: 16px; padding: 8px 0; }
.calculator-result-panel dt { color: #d7d0df; font-size: var(--fs-xs); line-height: 1.6; }
.calculator-result-panel dt small { display: block; color: #a99fb2; font-size: var(--fs-xs); font-weight: 500; }
.calculator-result-panel dd { margin: 0; color: #fff; font-size: var(--fs-xs); font-weight: 800; text-align: right; }
.shortfall-result { display: grid; gap: 6px; padding: 20px 0; }
.shortfall-result span { color: #d7d0df; font-size: var(--fs-xs); }
.shortfall-result b { color: var(--yellow); font-size: var(--fs-m); }
.calculator-result-panel button { width: 100%; min-height: 52px; color: var(--ink); background: var(--yellow); border: 0; cursor: pointer; font: inherit; font-size: var(--fs-base); font-weight: 800; }
.calculator-result-panel button:hover { background: #e5dcf1; }
.copy-status { min-height: 24px; margin: 9px 0 0; color: #d7d0df; font-size: var(--fs-xs); text-align: center; }
.electricity-comparison { display: grid; gap: 2px; padding: 18px 0; margin: 5px 0 4px; border-top: 1px solid rgba(255, 255, 255, .18); }
.electricity-comparison span { color: #d7d0df; font-size: var(--fs-xs); }
.electricity-comparison b { color: #fff; font-size: var(--fs-m); }
.electricity-comparison strong { color: var(--yellow); font-size: var(--fs-base); }
.electricity-result dl { max-height: 330px; overflow: auto; }
.electricity-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; padding: 18px 0; }
.electricity-metrics div { display: grid; gap: 2px; }
.electricity-metrics span { color: #d7d0df; font-size: var(--fs-xs); }
.electricity-metrics b { color: #fff; font-size: var(--fs-base); }
.calculator-notes { padding: 27px 30px; margin-top: 20px; background: var(--yellow-soft); border-left: 7px solid var(--yellow); }
.calculator-notes strong { color: var(--ink); font-size: var(--fs-m); }
.calculator-notes ul { padding-left: 22px; margin: 13px 0 0; }
.calculator-notes li { padding: 5px 0; color: var(--ink-soft); font-size: var(--fs-base); font-weight: 500; line-height: 1.75; }
.split-section { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.split-section > div, .split-section > aside { padding: 38px; background: var(--paper); border-top: 7px solid var(--green); box-shadow: 0 12px 30px rgba(34, 36, 40, .06); }
.split-section > aside { border-top-color: var(--coral); }
.split-section h2 { font-size: var(--fs-l); }
.check-list, .caution-list { padding: 0; margin: 25px 0 0; list-style: none; }
.check-list li, .caution-list li { position: relative; padding: 14px 0 14px 26px; border-bottom: 1px solid var(--line); font-size: var(--fs-xs); font-weight: 600; line-height: 1.7; }
.check-list li::before, .caution-list li::before { position: absolute; top: 21px; left: 2px; width: 10px; height: 4px; content: ""; background: #6c9c67; }
.caution-list li::before { background: var(--coral-dark); }
.document-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; padding: 0; list-style: none; }
.document-list li { position: relative; padding: 20px 20px 20px 49px; background: var(--paper); border: 1px solid var(--line); font-size: var(--fs-xs); font-weight: 700; }
.document-list li::before { position: absolute; top: 19px; left: 20px; width: 16px; height: 20px; content: ""; background: var(--yellow); border: 2px solid var(--ink); }
.steps-section ol { padding: 0; margin: 0; list-style: none; }
.steps-section li { display: grid; grid-template-columns: 70px 1fr; gap: 24px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.steps-section li > b { display: grid; width: 52px; height: 52px; place-items: center; color: var(--ink); background: var(--yellow); font-size: var(--fs-xs); }
.steps-section h3 { margin: 0 0 8px; color: var(--ink); font-size: var(--fs-base); }
.steps-section li p { margin: 0; color: var(--ink-soft); font-size: var(--fs-xs); line-height: 1.85; }
.faq-section details { padding: 15px 20px; background: var(--paper); border-bottom: 1px solid var(--line); }
.faq-section details:first-child { border-top: 6px solid var(--yellow); }
.faq-section summary { color: var(--ink); cursor: pointer; font-weight: 800; }
.faq-section details p { margin: 14px 0 0; color: var(--ink-soft); font-size: var(--fs-xs); line-height: 1.85; }
.source-section { display: grid; grid-template-columns: .8fr 1.2fr; gap: 36px; padding: 38px 40px; margin: 36px 0; color: #fff; background: var(--ink); border-top: 9px solid var(--yellow); }
.source-section > div > p { color: var(--yellow); }
.source-section h2 { color: #fff; font-size: var(--fs-l); }
.source-section > div > span { display: block; margin-top: 15px; color: #cacbd0; font-size: var(--fs-xs); line-height: 1.8; }
.source-section ul { padding: 0; margin: 0; list-style: none; }
.source-section li { display: flex; gap: 15px; align-items: center; justify-content: space-between; padding: 15px 0; border-bottom: 1px solid rgba(255, 255, 255, .16); }
.source-section li div { display: grid; gap: 3px; }
.source-section strong { font-size: var(--fs-xs); }
.source-section small { color: #b6b8bd; font-size: var(--fs-xs); }
.source-section li a { padding: 8px 11px; color: var(--ink); background: var(--yellow); font-size: var(--fs-xs); font-weight: 800; white-space: nowrap; }
.reader-cta { position: relative; display: flex; gap: 30px; align-items: center; justify-content: space-between; padding: 34px 40px; margin-bottom: 40px; overflow: hidden; color: var(--ink); background: #ffffff; border: 1px solid var(--line); border-top: 8px solid var(--yellow); }
.reader-cta small, .reader-cta h2 { color: var(--ink); }
.reader-cta::before { position: absolute; top: -85px; right: -55px; width: 230px; height: 230px; content: ""; border: 45px solid rgba(255, 255, 255, .35); border-radius: 50%; }
.reader-cta > * { position: relative; z-index: 1; }
.reader-cta small { color: var(--ink-soft); font-weight: 800; }
.reader-cta h2 { max-width: 590px; margin-top: 7px; font-size: var(--fs-l); }
.reader-cta a { padding: 13px 17px; color: #fff; background: var(--coral); font-size: var(--fs-xs); font-weight: 800; white-space: nowrap; }

/* ── 2026-08-19 單頁版（不再分專題網頁／郵件版本）新增區塊 ── */
#conclusion, #eligibility, #benefits, #steps, #prepare, #faq, #sources { scroll-margin-top: 96px; }   /* 從首頁卡片跳進來時不被 sticky header 蓋住 */
.audience-section .check-list { max-width: 820px; margin-top: 0; }
.prep-section { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: start; }
.prep-card { padding: 24px; border: 1px solid var(--line); box-shadow: 0 12px 30px rgba(34, 36, 40, .06); }
.prep-card h2 { margin: 0 0 4px; font-size: var(--fs-m); font-weight: 900; letter-spacing: -.04em; }
.prep-card > p { margin: 0 0 18px; color: var(--muted); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .06em; }
.prep-card ul { display: grid; gap: 12px; padding: 0; margin: 0; list-style: none; }
.prep-card li { position: relative; padding-left: 22px; color: var(--ink-soft); font-size: var(--fs-base); font-weight: 500; line-height: 1.75; }
.prep-card li::before { position: absolute; top: 12px; left: 0; width: 9px; height: 9px; content: ""; border-radius: 50%; }
.prep-card--docs { background: var(--paper); border-top: 7px solid var(--yellow); }
.prep-card--docs li::before { background: #ba7d4a; }
.prep-card--cautions { background: #f8e5e9; border-top: 7px solid var(--coral); }
.prep-card--cautions li::before { background: #b85e70; }
.reader-cta.unified-cta { display: grid; grid-template-columns: 1fr; gap: 18px; }   /* 2026-08-19 右側改迷你訂閱表單後變寬，改為上文下列 */
.reader-cta.unified-cta .cta-actions { display: grid; gap: 12px; justify-items: start; }
/* 2026-08-20 訂閱是唯一主行動；站外品牌入口降為下一行文字連結，避免紫色方塊與訂閱鈕搶焦點。 */
.reader-cta.unified-cta .cta-brand { display: inline-flex; gap: 7px; align-items: center; width: auto; min-height: 0; padding: 4px 0; text-align: left; color: #654994; background: transparent; border: 0; border-bottom: 1px solid rgba(101, 73, 148, .28); border-radius: 0; font-size: var(--fs-xs); font-weight: 800; white-space: nowrap; transition: color .2s, border-color .2s, transform .2s; }
.reader-cta.unified-cta .cta-brand img { display: block; flex: 0 0 auto; width: 21px; height: auto; filter: none; }
.reader-cta.unified-cta .cta-brand:hover { color: #4a3570; background: transparent; border-color: currentColor; transform: translateX(3px); }
.reader-cta.unified-cta .cta-brand:focus-visible { outline: 3px solid rgba(101, 73, 148, .25); outline-offset: 4px; }
body > footer { display: flex; gap: 20px; align-items: center; justify-content: space-between; width: min(960px, calc(100% - 40px)); padding: 26px 0 40px; margin: auto; border-top: 1px solid var(--line); color: var(--muted); font-size: var(--fs-xs); }
body > footer .reader-brand { text-decoration: none; font-size: var(--fs-base); }   /* 頁尾品牌沿用頂端 .reader-brand（好標＋生活剛好／每天前進一點點） */
body > footer .footer-note { text-align: right; }

@media (min-width: 761px) and (max-width: 1000px) {
  /* 平板橫寬：插圖仍絕對定位在右，250px 會被大標第一行壓到（768 實測撞上）；縮成 180px 靠右上，大標欄寬（485px）維持不變 */
  .issue-illustration { top: 44px; right: 20px; width: 170px; height: 170px; }
  .issue-hero.has-illustration h1.title-lines, .issue-hero.has-illustration h1.title-two { padding-right: 220px; }   /* 指定斷行／兩層標題在此區間只需讓出 170＋20＋緩衝 */
  .issue-hero h1.title-lines { font-size: clamp(41px, 5.5vw, 68px); }   /* 指定斷行標題在此區間略縮，九字一行才進得去 */
}

@media (max-width: 760px) {
  .reader-header { padding-inline: 16px; }
  .reader-brand small { display: none; }
  .reader-actions { gap: 7px; }
  .view-switch a { padding: 8px 9px; font-size: var(--fs-xs); }
  .email-preview-shell { width: calc(100% - 20px); padding-top: 28px; }
  .email-preview-intro { align-items: flex-start; flex-direction: column; gap: 12px; }
  .email-preview-shell iframe { height: 1700px; }
  .issue-hero { padding: 32px 22px 28px; margin-top: 16px; }
  .issue-hero::before { top: -230px; right: -220px; }
  .issue-hero::after { display: none; }
  .issue-illustration { position: relative; top: auto; right: auto; width: 190px; height: 190px; margin: -12px auto 20px; }
  .issue-hero.has-illustration h1, .issue-hero.has-illustration .issue-dek { max-width: none; padding-right: 0; }
  .issue-hero.has-illustration h1.title-lines, .issue-hero.has-illustration h1.title-two { padding-right: 0; }
  h1.title-two .t-main { font-size: 34px; }
  h1.title-two .t-sub { font-size: 20px; }
  .issue-hero h1.title-lines { font-size: 36px; }   /* 指定斷行標題手機縮到 36px（仍 ≥34 主標家族），八字一行才進得去 */
  .issue-hero h1 { font-size: 41px; }
  .issue-meta { align-items: flex-start; flex-wrap: wrap; }
  .benefit-grid, .split-section, .source-section { grid-template-columns: 1fr; }
  .document-list { grid-template-columns: 1fr; }
  .issue-section { padding: 30px 0; }
  .split-section > div, .split-section > aside { padding: 30px 24px; }
  .source-section { gap: 24px; padding: 30px 22px; }
  .reader-cta { align-items: flex-start; flex-direction: column; padding: 28px 22px; }
  .reader-cta a { width: 100%; text-align: center; }
  .prep-section { grid-template-columns: 1fr; }
  .prep-card { padding: 20px 18px; }
  .reader-cta.unified-cta .cta-actions { width: 100%; }
  body > footer { align-items: flex-start; flex-direction: column; }
  body > footer .reader-brand small { display: block; }
  body > footer .footer-note { text-align: left; }
  .overtime-calculator, .electricity-calculator { grid-template-columns: 1fr; }
  .calculator-fields, .calculator-result-panel { padding: 26px 20px; }
  .calculator-result-panel { position: static; }
  .time-inputs { grid-template-columns: 1fr; }
  .meter-reading-grid { grid-template-columns: 1fr; }
  .calculator-result-panel > strong { font-size: var(--fs-l); }
}

/*
  全站字級只使用 l / m / base / xs 四級。
  xs 只限圖說、日期、標籤與輔助文字；主視覺標題為規範例外，固定 34px 以上。
  手機版不得覆寫 --fs-base，確保所有裝置的內文皆為 18.5px。
*/
.reader-brand small,
.view-switch a,
.email-preview-intro p,
.email-preview-intro > span,
.issue-meta,
.issue-label,
.quick-answer small,
.issue-update,
.issue-section > header p,
.section-kicker,
.source-section > div > p,
.benefit-grid small,
.steps-section li > b,
.source-section small,
.source-section li a,
body > footer { font-size: var(--fs-xs); }

.reader-brand b,
.issue-dek,
.quick-answer p,
.benefit-grid p,
.check-list li,
.caution-list li,
.document-list li,
.steps-section li p,
.faq-section summary,
.faq-section details p,
.source-section > div > span,
.source-section strong,
.reader-cta a { font-size: var(--fs-base); }

.benefit-grid strong,
.steps-section h3 { font-size: var(--fs-m); }

.issue-section h2,
.source-section h2,
.reader-cta h2,
.split-section h2 { font-size: var(--fs-l); }

.issue-dek,
.quick-answer p,
.benefit-grid p,
.check-list li,
.caution-list li,
.steps-section li p,
.faq-section details p,
.source-section > div > span { font-weight: 500; line-height: 1.75; }

.email-preview-intro h1 { font-size: 34px; }
.issue-hero h1 { font-size: clamp(41px, 6vw, 68px); }

@media (max-width: 760px) {
  .view-switch a { font-size: var(--fs-xs); }
  .issue-hero h1 { font-size: 41px; }
}

@media (max-width: 380px) {
  .issue-hero h1.title-lines { font-size: 34px; }   /* 小手機再降到主標家族下限 34px，指定行才不會被拆 */
}

/* ── 2026-08-21 郵件式網頁版：一條窄版閱讀流，保留完整資訊但降低「長專題／手冊」感。 ── */
body.issue-digest-page { background: #f3eff6; }
.issue-digest-page .reader-header {
  position: sticky;
  top: 0;
  z-index: 20;
  min-height: 72px;
  padding-inline: max(20px, calc((100vw - 760px) / 2));
  border-bottom: 1px solid rgba(68, 57, 82, .1);
  backdrop-filter: blur(12px);
}
.issue-digest-page main {
  width: min(720px, calc(100% - 32px));
  margin: 30px auto 54px;
  overflow: hidden;
  background: #fffdf4;
  border: 6px solid #fff;
  border-radius: 30px;
  box-shadow: 0 10px 0 #d8cae8, 0 20px 50px rgba(68, 57, 82, .08);
}
.issue-digest-page .issue-hero {
  padding: 34px 34px 26px;
  margin: 0;
  overflow: visible;
  text-align: center;
  background: transparent;
  border-top: 8px solid var(--yellow);
  box-shadow: none;
}
.issue-digest-page .issue-hero::before,
.issue-digest-page .issue-hero::after { display: none; }
.issue-digest-page .issue-illustration {
  position: relative;
  top: auto;
  right: auto;
  display: block;
  width: min(180px, 48%);
  height: auto;
  margin: 0 auto 24px;
  overflow: visible;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  transform: none;
}
.issue-digest-page .issue-illustration img { display: block; width: 100%; height: auto; object-fit: contain; }
.issue-digest-page .issue-meta { justify-content: center; }
.issue-digest-page .issue-meta span { padding: 6px 11px; color: var(--ink); background: #eee8f5; border-radius: 999px; }
.issue-digest-page .issue-label { margin: 14px 0 10px; }
.issue-digest-page .issue-label::before { display: none; }
.issue-digest-page .issue-hero.has-illustration h1,
.issue-digest-page .issue-hero.has-illustration .issue-dek {
  max-width: 610px;
  padding-right: 0;
}
.issue-digest-page .issue-hero h1 {
  max-width: 610px;
  margin: 0 auto 14px;
  color: var(--ink);
  font-family: "Noto Sans TC", "PingFang TC", sans-serif;
  font-size: clamp(34px, 5.4vw, 40px);
  font-weight: 900;
  line-height: 1.38;
  letter-spacing: -.045em;
}
.issue-digest-page .issue-dek { margin: 0 auto; font-size: var(--fs-base); line-height: 1.78; text-align: left; }
.issue-digest-page .quick-answer {
  padding: 22px;
  margin: 22px -10px 0;
  text-align: left;
  background: #fff;
  border: 0;
  border-radius: 20px;
  box-shadow: 0 5px 0 #e3dbea;
}
.issue-digest-page .quick-answer small { color: var(--coral-dark); }
.issue-digest-page .quick-answer p { margin-top: 7px; font-size: var(--fs-base); font-weight: 700; line-height: 1.75; }
.issue-digest-page .issue-update { margin: 15px 0 0; font-size: var(--fs-xs); text-align: center; }

.issue-digest-page .issue-section {
  padding: 24px 30px;
  border-top: 1px solid rgba(68, 57, 82, .09);
  border-bottom: 0;
}
.issue-digest-page .issue-section > header { margin-bottom: 15px; }
.issue-digest-page .issue-section > header p { margin-bottom: 6px; color: #9b87b8; font-size: var(--fs-xs); letter-spacing: .09em; }
.issue-digest-page .issue-section > header p::before { display: none; }
.issue-digest-page .issue-section h2 { font-size: var(--fs-m); line-height: 1.45; letter-spacing: -.035em; }
.issue-digest-page .check-list { display: grid; gap: 4px; max-width: none; margin: 0; }
.issue-digest-page .check-list li {
  padding: 7px 0 7px 24px;
  border-bottom: 0;
  color: var(--ink-soft);
  font-size: var(--fs-base);
  font-weight: 500;
  line-height: 1.72;
}
.issue-digest-page .check-list li::before { top: 18px; left: 3px; width: 8px; height: 8px; background: var(--yellow); border-radius: 50%; }

.issue-digest-page .benefit-grid { display: grid; grid-template-columns: 1fr; gap: 10px; border: 0; }
.issue-digest-page .benefit-grid article,
.issue-digest-page .benefit-grid article:nth-child(n) {
  padding: 16px 18px;
  background: #fff;
  border: 0;
  border-radius: 16px;
}
.issue-digest-page .benefit-grid small { color: #9b87b8; }
.issue-digest-page .benefit-grid strong { margin: 3px 0 4px; font-size: var(--fs-m); line-height: 1.45; }
.issue-digest-page .benefit-grid p { font-size: var(--fs-xs); line-height: 1.7; }

.issue-digest-page .overtime-calculator,
.issue-digest-page .electricity-calculator { grid-template-columns: 1fr; gap: 12px; }
.issue-digest-page .calculator-fields,
.issue-digest-page .calculator-result-panel { padding: 24px; border-radius: 16px; box-shadow: none; }
.issue-digest-page .calculator-result-panel { position: static; }
.issue-digest-page .calculator-notes { padding: 20px; margin-top: 12px; border-left-width: 5px; border-radius: 14px; }

.issue-digest-page .steps-section ol { display: grid; gap: 2px; }
.issue-digest-page .steps-section li { grid-template-columns: 42px 1fr; gap: 10px; padding: 10px 0; border-bottom: 0; }
.issue-digest-page .steps-section li > b {
  width: 34px;
  height: 34px;
  margin-top: 2px;
  background: var(--yellow);
  border: 3px solid #fff;
  border-radius: 50%;
  font-size: 12px;
}
.issue-digest-page .steps-section h3 { margin: 0 0 3px; font-size: var(--fs-base); line-height: 1.6; }
.issue-digest-page .steps-section li p { font-size: var(--fs-base); line-height: 1.72; }

.issue-digest-page .prep-section { grid-template-columns: 1fr; gap: 12px; padding: 12px 24px 24px; }
.issue-digest-page .prep-card { padding: 20px; border: 3px solid #fff; border-radius: 18px; box-shadow: none; }
.issue-digest-page .prep-card--docs { background: #fff; }
.issue-digest-page .prep-card--cautions { background: #f8e5e9; }
.issue-digest-page .prep-card h2 { margin-bottom: 8px; color: #9b87b8; font-size: var(--fs-base); }
.issue-digest-page .prep-card--cautions h2 { color: #a14f63; }
.issue-digest-page .prep-card > p { display: none; }
.issue-digest-page .prep-card ul { gap: 0; }
.issue-digest-page .prep-card li { padding: 4px 0 4px 22px; font-size: var(--fs-base); line-height: 1.72; }
.issue-digest-page .prep-card li::before { top: 16px; width: 8px; height: 8px; }

.issue-digest-page .faq-section,
.issue-digest-page .source-section {
  display: block;
  padding: 0;
  margin: 0 24px 12px;
  color: var(--ink);
  background: #fff;
  border: 0;
  border-radius: 16px;
}
.issue-digest-page .faq-section > summary,
.issue-digest-page .source-section > summary {
  padding: 17px 19px;
  cursor: pointer;
  list-style: none;
}
.issue-digest-page .faq-section > summary::-webkit-details-marker,
.issue-digest-page .source-section > summary::-webkit-details-marker { display: none; }
.issue-digest-page .faq-section > summary::after,
.issue-digest-page .source-section > summary::after { float: right; content: "+"; color: #9b87b8; font-size: 22px; line-height: 1; }
.issue-digest-page .faq-section[open] > summary::after,
.issue-digest-page .source-section[open] > summary::after { content: "−"; }
.issue-digest-page .faq-section > summary small,
.issue-digest-page .source-section > summary small { display: block; margin-bottom: 2px; color: #9b87b8; font-size: var(--fs-xs); font-weight: 900; letter-spacing: .06em; }
.issue-digest-page .faq-section > summary strong,
.issue-digest-page .source-section > summary strong { font-size: var(--fs-base); font-weight: 900; }
.issue-digest-page .faq-list,
.issue-digest-page .source-content { padding: 0 19px 19px; }
.issue-digest-page .faq-item { padding: 13px 0; background: transparent; border-top: 1px solid var(--line); border-bottom: 0; }
.issue-digest-page .faq-item:first-child { border-top: 1px solid var(--line); }
.issue-digest-page .faq-item summary { font-size: var(--fs-base); line-height: 1.6; }
.issue-digest-page .faq-item p { margin-top: 9px; font-size: var(--fs-base); line-height: 1.72; }
.issue-digest-page .source-content > p { margin: 0 0 12px; color: var(--ink-soft); font-size: var(--fs-xs); line-height: 1.7; }
.issue-digest-page .source-section ul { padding: 0; margin: 0; }
.issue-digest-page .source-section li { align-items: flex-start; padding: 12px 0; border-top: 1px solid var(--line); border-bottom: 0; }
.issue-digest-page .source-section strong { color: var(--ink); font-size: var(--fs-xs); }
.issue-digest-page .source-section small { color: var(--muted); font-size: var(--fs-xs); }
.issue-digest-page .source-section li a { padding: 0; color: #654994; background: transparent; font-size: var(--fs-xs); text-decoration: underline; text-underline-offset: 3px; }

.issue-digest-page .reader-cta {
  padding: 28px 30px 30px;
  margin: 12px 0 0;
  text-align: center;
  background: #eef3e8;
  border: 0;
  border-radius: 0;
}
.issue-digest-page .reader-cta::before { display: none; }
.issue-digest-page .reader-cta h2 { margin-top: 6px; font-size: var(--fs-m); }
.issue-digest-page .reader-cta.unified-cta .cta-actions { justify-items: center; }
.issue-digest-page > footer { width: min(720px, calc(100% - 32px)); border-top: 0; }

.topic-switch-button {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  min-height: 42px;
  padding: 0 14px;
  color: #654994;
  background: var(--yellow-soft);
  border: 0;
  border-radius: 999px;
  font: inherit;
  font-size: var(--fs-xs);
  font-weight: 900;
  cursor: pointer;
}
.topic-switch-button b { font-size: 18px; line-height: 1; }
.topic-switch-button:hover { background: #e5dcf1; }
.topic-switch-button:focus-visible { outline: 3px solid rgba(101, 73, 148, .25); outline-offset: 3px; }
.topic-switch-dialog {
  position: fixed;
  top: 82px;
  right: max(20px, calc((100vw - 760px) / 2));
  bottom: auto;
  left: auto;
  width: min(430px, calc(100% - 32px));
  max-height: calc(100vh - 100px);
  padding: 0;
  margin: 0;
  overflow: auto;
  color: var(--ink);
  background: transparent;
  border: 0;
}
.topic-switch-dialog::backdrop { background: rgba(41, 29, 54, .28); backdrop-filter: blur(2px); }
.topic-switch-panel { overflow: hidden; background: #fff; border: 1px solid var(--line); border-radius: 20px; box-shadow: 0 22px 60px rgba(41, 29, 54, .22); }
.topic-switch-panel > header { display: flex; align-items: center; justify-content: space-between; padding: 20px 20px 14px; }
.topic-switch-panel > header small { color: #9b87b8; font-size: var(--fs-xs); font-weight: 900; letter-spacing: .08em; }
.topic-switch-panel > header h2 { margin: 2px 0 0; font-size: var(--fs-m); line-height: 1.35; }
.topic-switch-panel > header button {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  color: var(--ink);
  background: var(--yellow-soft);
  border: 0;
  border-radius: 50%;
  font: inherit;
  font-size: 24px;
  cursor: pointer;
}
.topic-switch-panel nav { display: grid; padding: 0 10px; }
.topic-menu-item { position: relative; display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; padding: 13px 12px; border-top: 1px solid var(--line); }
.topic-menu-item small { grid-column: 1; color: #9b87b8; font-size: var(--fs-xs); font-weight: 900; }
.topic-menu-item strong { grid-column: 1; font-size: var(--fs-base); line-height: 1.55; }
.topic-menu-item > span { grid-column: 2; grid-row: 1 / span 2; align-self: center; color: #654994; font-weight: 900; }
.topic-menu-item:hover { background: var(--yellow-soft); }
.topic-menu-item.is-current { background: #fffdf4; }
.topic-menu-item.is-current small { color: var(--coral-dark); }
.topic-menu-all { display: flex; align-items: center; justify-content: space-between; padding: 14px 20px 17px; color: #654994; background: var(--yellow-soft); font-size: var(--fs-xs); font-weight: 900; }

.issue-digest-page .next-topic {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 3px 18px;
  align-items: center;
  padding: 19px 21px;
  margin: 12px 24px 0;
  color: var(--ink);
  background: var(--yellow-soft);
  border-radius: 16px;
}
.issue-digest-page .next-topic small { grid-column: 1; color: #9b87b8; font-size: var(--fs-xs); font-weight: 900; }
.issue-digest-page .next-topic strong { grid-column: 1; font-size: var(--fs-base); line-height: 1.55; }
.issue-digest-page .next-topic > span { grid-column: 2; grid-row: 1 / span 2; color: #654994; font-size: 24px; font-weight: 900; transition: transform .2s; }
.issue-digest-page .next-topic:hover > span { transform: translateX(4px); }

@media (max-width: 600px) {
  .issue-digest-page .reader-header { min-height: 64px; padding-inline: 16px; }
  .issue-digest-page .reader-actions .nl-mini { display: none; }
  .topic-switch-button { min-height: 40px; padding-inline: 12px; }
  .topic-switch-dialog {
    top: auto;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    max-height: min(80vh, 680px);
  }
  .topic-switch-panel { border-width: 1px 0 0; border-radius: 22px 22px 0 0; }
  .issue-digest-page main { width: 100%; margin: 0; border: 0; border-radius: 0; box-shadow: none; }
  .issue-digest-page .issue-hero { padding: 28px 20px 22px; border-top-width: 7px; }
  .issue-digest-page .issue-illustration { width: 150px; margin-bottom: 20px; }
  .issue-digest-page .issue-hero h1 { font-size: 31px; }
  .issue-digest-page .quick-answer { margin-inline: -4px; }
  .issue-digest-page .issue-section { padding: 22px 20px; }
  .issue-digest-page .prep-section { padding: 12px 16px 20px; }
  .issue-digest-page .faq-section,
  .issue-digest-page .source-section { margin-inline: 16px; }
  .issue-digest-page .next-topic { margin-inline: 16px; }
  .issue-digest-page .reader-cta { align-items: center; padding-inline: 20px; }
  .issue-digest-page .reader-cta a { width: auto; text-align: left; }
  .issue-digest-page > footer { width: calc(100% - 32px); }
}