/* ══════════════════════════════════════════════════════════════
   notes 共用「基礎層」（Mate-2 2026-08-29 從 19 篇內嵌 <style> 抽出來）

   出身＝每篇內嵌 7.5–9.5KB CSS、改一次樣式要改 19 個檔。
   只抽「19 篇一字不差都有」的 51 條；各篇自己的差異原封不動留在原地
   （全部統一要逐條判斷 158 條差異是刻意還是漂移，那個沒必要也有風險）。
   `:root` 刻意不抽——那是各篇的主題色變數。

   🔴 這支要排在各篇內嵌 <style> 的「前面」，跟 notes-type.css 分工不同：
      這支＝基礎層（可以被各篇內嵌覆蓋）
      notes-type.css＝覆蓋層（08-27 建、刻意排在內嵌之後、用來壓過各篇）
      **不要把基礎規則塞進覆蓋層**——4號 08-29 施工前審查擋下來的：
      混層之後，下次有人在某篇內嵌加同選擇器的規則、預期它會生效，
      結果被覆蓋層蓋回去。而且 notes-type.css 是 index 也載入的共用檔，
      塞進去會連帶改到 index（實測：40 張截圖比對只有 index 那 2 張畫素變了）。

   🔑 搬移的判準＝「選擇器＋內容整塊一字不差」才算共同（不是只比選擇器），
      所以 body／h1 那種各篇有兩種寫法的，一個字不同就留原地、不會被壓掉。
   ══════════════════════════════════════════════════════════════ */


* { margin:0; padding:0; box-sizing:border-box; }
a { color:var(--accent); text-decoration:none; }
.wrap { max-width:720px; margin:0 auto; padding:48px 22px 90px; }
.back { font-size:14px; color:var(--text-2); display:inline-flex; gap:7px; margin-bottom:34px; }
.eyebrow { font-size:13px; letter-spacing:0.12em; color:var(--text-meta); text-transform:uppercase; }
h1 { font-family:'Noto Serif TC',serif; font-size:clamp(26px,5vw,34px); font-weight:900; line-height:1.3; letter-spacing:-0.01em; margin:12px 0 10px; }
.meta-line { color:var(--text-meta); font-size:14px; margin-bottom:14px; }
.bio { font-size:14px; color:var(--text-2); margin:0 0 36px; padding-bottom:26px; border-bottom:1px solid var(--line); line-height:1.75; }
.bio .who { color:var(--text); font-weight:600; }
p { font-size:17px; margin-bottom:20px; color:var(--text); line-height:1.9; }
p.sub { color:var(--text-2); }
ul,ol { margin:8px 0 26px 2px; padding-left:22px; }
li { font-size:17px; margin-bottom:14px; line-height:1.8; }
strong { color:var(--text); font-weight:600; }
.answer { font-size:18px; color:var(--text); background:var(--surface); border:1px solid var(--line); border-left:3px solid var(--accent); border-radius:12px; padding:22px 24px; margin:0 0 34px; line-height:1.8; }
.answer .tag { display:block; font-size:12px; letter-spacing:0.1em; color:var(--text-meta); text-transform:uppercase; margin-bottom:14px; }
.answer p:last-child { margin-bottom:0; }
.answer .a-caveat { font-size:15px; color:var(--text-2); margin-top:2px; }
.num { color:var(--warm); font-weight:600; white-space:nowrap; }
.lead { font-size:19px; color:var(--text); margin:6px 0 22px; line-height:1.85; }
.keyline { font-size:18.5px; color:var(--text); font-weight:600; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:18px 0; margin:32px 0; line-height:1.6; }
hr { border:0; border-top:1px solid var(--line); margin:44px 0; }
.cta { display:inline-flex; align-items:center; gap:9px; margin-top:8px; padding:14px 22px; border:1px solid var(--accent); border-radius:10px; color:var(--accent); font-weight:600; font-size:16px; }
.foot { margin-top:50px; padding-top:24px; border-top:1px solid var(--line); color:var(--text-meta); font-size:14px; }
.bigquote .q .hi { color:var(--accent); }
.bigquote .subq { margin-top:12px; font-size:15px; color:var(--text-2); }
.more .tag { display:block; font-size:12px; letter-spacing:0.1em; color:var(--text-meta); text-transform:uppercase; margin-bottom:12px; }
.more p { font-size:15.5px; margin-bottom:12px; line-height:1.75; color:var(--text-2); }
.more p:last-child { margin-bottom:0; }
.more a { font-weight:600; }
.faq .faq-title { font-size:13px; letter-spacing:0.1em; color:var(--text-meta); text-transform:uppercase; margin-bottom:6px; }
.faq details { border-bottom:1px solid var(--line); }
.faq details:first-of-type { border-top:1px solid var(--line); }
.faq summary { font-size:16.5px; font-weight:600; color:var(--text); padding:18px 0; cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:baseline; gap:14px; line-height:1.5; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:"＋"; color:var(--accent); flex:none; font-weight:400; }
.faq details[open] summary::after { content:"－"; }
.faq details[open] summary { padding-bottom:6px; }
::selection { background:var(--accent); color:var(--sel-text); }
.eyebrow::before { content:"● "; color:var(--red); }
h1,h2,h3 { scroll-margin-top:64px; }
.progress-top { position:fixed; top:0; left:0; height:2px; width:0; background:var(--red); z-index:99; }
.theme-btn { position:fixed; top:14px; right:14px; z-index:98; width:40px; height:40px; border-radius:50%; border:1px solid var(--line); background:var(--surface); cursor:pointer; display:flex; align-items:center; justify-content:center; padding:0; }
.theme-btn svg { width:18px; height:18px; fill:none; stroke:var(--text-2); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.theme-btn .ic-moon { display:none; }


body, .theme-btn { transition:background-color .35s ease, color .35s ease, border-color .35s ease; }
.progress-top { display:none; }
.nb { white-space:nowrap }
