/* ═══════════════════════════════════════════════════════════════
   theme.css — 全站共用的層次 token ＋ 靜態頁（文章／分類／FAQ／術語庫）版型
   首頁（homepage-v2.css）、Podcast 頁（podcast-v2.css）也吃這裡的 token，
   改一處全站一致。
   原則（沿用 design_handoff V1+）：發光只用在邊框、陰影、裝飾；標題與內文一律高對比純色。
   ═══════════════════════════════════════════════════════════════ */
:root{
  /* 表面 4 階：頁底 → 區塊帶 → 卡片 → 浮層/hover */
  --s0:#07090f;--s1:#0d111c;--s2:#131927;--s3:#1a2133;
  /* 頂緣打光：讓卡片有「被光照到」的邊，而不是只靠外框分辨 */
  --lift:inset 0 1px 0 rgba(255,255,255,.045);
  /* 陰影 3 級 */
  --e1:0 1px 2px rgba(0,0,0,.4);
  --e2:0 8px 24px -8px rgba(0,0,0,.55);
  --e3:0 20px 50px -12px rgba(0,0,0,.65),0 0 0 1px rgba(98,168,255,.18);
  /* 邊框 3 級：分隔線 / 卡片 / 焦點與 hover */
  --line-1:rgba(151,170,218,.08);--line-2:rgba(151,170,218,.14);--line-3:rgba(98,168,255,.4);
  /* 色彩：1 主（藍）＋ 1 輔（青），紫只用在漸層與分類標籤 */
  --accent:#62a8ff;--accent-2:#55e6d8;--accent-3:#a78bfa;
  --grad:linear-gradient(120deg,#70b7ff 0%,#55e6d8 46%,#b08cff 100%);
  --grad-btn:linear-gradient(135deg,#5ca7ff,#7b6cff);
  /* 文字 4 階 */
  --tx-1:#f4f7ff;--tx-2:#c5cde0;--tx-3:#a7b0c7;--tx-meta:#8b95ad;
  /* 字級與字重：重（800/750）· 中（700）· 輕（600）拉開節奏 */
  --fs-h1:clamp(40px,4.4vw,60px);--fs-h2:clamp(28px,3.2vw,36px);--fs-h3-lg:24px;--fs-h3:17px;
  --fs-body:16px;--fs-meta:12px;
  --font:"Noto Sans TC","Inter","PingFang TC","Microsoft JhengHei",sans-serif;
  /* 區塊節奏：大區塊 / 次區塊 */
  --sec-lg:112px;--sec-md:72px;
  --r-lg:22px;--r-md:16px;--r-sm:12px;
  --max:1200px;
}
@media(max-width:540px){:root{--sec-lg:64px;--sec-md:48px;--r-lg:16px}}

/* ═══ 靜態頁（build-static 產生：body.st）═══ */
body.st{margin:0;background:var(--s0);color:var(--tx-2);font:400 var(--fs-body)/1.85 var(--font);-webkit-font-smoothing:antialiased}
body.st::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at 80% 0%,rgba(57,138,255,.11),transparent 38%),radial-gradient(circle at 10% 30%,rgba(129,91,246,.06),transparent 30%)}
.st a{color:inherit}
.st-shell{width:min(var(--max),calc(100% - 48px));margin-inline:auto}
.st-narrow{width:min(760px,calc(100% - 40px));margin-inline:auto}

/* 站台導覽列 */
.st-nav{position:sticky;top:0;z-index:50;background:rgba(7,9,15,.78);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--line-1)}
.st-nav .st-shell{height:64px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.st-logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--tx-1);font-weight:750;font-size:17px;letter-spacing:.02em}
.st-logo img{width:32px;height:32px;border-radius:8px}
.st-links{display:flex;gap:22px;align-items:center}
.st-links a{color:var(--tx-3);text-decoration:none;font-size:14px}
.st-links a:hover,.st-links a[aria-current]{color:var(--tx-1)}
.st-links .st-cta{padding:8px 14px;border-radius:10px;background:var(--grad-btn);color:#fff}
@media(max-width:760px){.st-links a:not(.st-cta):not(.st-keep){display:none}}

/* 麵包屑 */
.st-crumb{margin:28px 0 0;font-size:13px;color:var(--tx-meta)}
.st-crumb a{color:var(--tx-3);text-decoration:none}
.st-crumb a:hover{color:var(--tx-1)}

/* ── 文章頁 ── */
.st-post{padding-bottom:var(--sec-md)}
.st-post .badge{display:inline-flex;align-items:center;gap:6px;margin:26px 0 14px;padding:5px 11px;border-radius:999px;background:rgba(85,230,216,.09);color:var(--accent-2);font-size:12px;font-weight:700;letter-spacing:.04em}
.st-post h1{margin:0 0 14px;color:var(--tx-1);font:800 clamp(28px,3.4vw,40px)/1.3 var(--font);letter-spacing:-.03em;text-wrap:balance}
.st-post .byline{color:var(--tx-meta);font-size:13px;font-weight:500;letter-spacing:.02em}
.st-post .byline a{color:var(--tx-2);text-decoration:none}
.st-post .byline a:hover{color:var(--accent)}
.st-post .cover{display:block;width:100%;height:auto;margin:28px 0 8px;border-radius:var(--r-md);border:1px solid var(--line-2);box-shadow:var(--e2);background:var(--s2)}
.st-post .excerpt{margin:22px 0 0;padding:18px 22px;border-left:3px solid var(--accent);border-radius:0 var(--r-sm) var(--r-sm) 0;background:var(--s1);color:var(--tx-2);font-size:17px;line-height:1.8}
.st-post .excerpt p{margin:0}
.st-post .toc{margin:28px 0;padding:20px 24px;border:1px solid var(--line-2);border-radius:var(--r-md);background:var(--s1);box-shadow:var(--lift)}
.st-post .toc-h{margin-bottom:10px;color:var(--tx-1);font-weight:700;font-size:15px}
.st-post .toc ul{margin:0;padding:0;list-style:none}
.st-post .toc li{margin:6px 0}
.st-post .toc li a{color:var(--tx-3);text-decoration:none;font-size:14.5px;line-height:1.55}
.st-post .toc li a:hover{color:var(--tx-1)}
.st-post .toc-l3{padding-left:18px}
.st-post .toc-l3 a{font-size:13.5px!important}
.st-post .post-body{margin-top:28px;color:var(--tx-2);font-size:17px;line-height:1.95}
.st-post .post-body :is(h2,h3){scroll-margin-top:80px;color:var(--tx-1);letter-spacing:-.015em}
.st-post .post-body h2{margin:2em 0 .7em;padding-top:1.2em;border-top:1px solid var(--line-1);font-size:24px;font-weight:750;line-height:1.45}
.st-post .post-body h3{margin:1.6em 0 .5em;font-size:19px;font-weight:700}
.st-post .post-body p{margin:0 0 1.15em}
.st-post .post-body ul,.st-post .post-body ol{margin:0 0 1.15em 1.4em;padding:0}
.st-post .post-body li{margin:.45em 0}
.st-post .post-body a{color:var(--accent);text-underline-offset:3px}
.st-post .post-body strong{color:var(--tx-1)}
.st-post .post-body blockquote{margin:1.4em 0;padding:14px 20px;border-left:3px solid var(--accent-2);border-radius:0 var(--r-sm) var(--r-sm) 0;background:var(--s1);color:var(--tx-3)}
.st-post .post-body img{max-width:100%;border-radius:var(--r-sm)}
.st-post .post-body hr{border:0;border-top:1px solid var(--line-2);margin:2em 0}
.st-post .post-body table{width:100%;border-collapse:collapse;margin:1.4em 0;font-size:15px}
.st-post .post-body :is(th,td){padding:10px 12px;border-bottom:1px solid var(--line-2);text-align:left}
.st-post .post-body th{color:var(--tx-1);background:var(--s1)}
.st-post .post-body code{padding:2px 6px;border-radius:6px;background:var(--s2);font-size:.9em}
.st-post .post-body pre{padding:16px;border-radius:var(--r-sm);background:var(--s1);border:1px solid var(--line-2);overflow:auto}
.st-post .post-body pre code{padding:0;background:none}
.st-post .post-nav{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:44px 0 10px}
.st-post .post-nav .pn{display:block;padding:16px 18px;border:1px solid var(--line-2);border-radius:var(--r-md);background:var(--s2);box-shadow:var(--e1),var(--lift);text-decoration:none;transition:transform .2s,border-color .2s,box-shadow .2s}
.st-post .post-nav .pn:hover{transform:translateY(-3px);border-color:var(--line-3);box-shadow:var(--e3)}
.st-post .post-nav .pn span{display:block;margin-bottom:6px;color:var(--tx-meta);font-size:12px;font-weight:600;letter-spacing:.04em}
.st-post .post-nav .pn b{display:block;color:var(--tx-1);font-size:15px;font-weight:600;line-height:1.5}
.st-post .post-nav .pn-r{text-align:right}
.st-post .nl-box{margin:32px 0 10px;padding:26px 28px;border:1px solid transparent;border-radius:var(--r-lg);background:linear-gradient(var(--s2),var(--s2)) padding-box,linear-gradient(135deg,rgba(98,168,255,.5),rgba(167,139,250,.2) 60%,transparent) border-box;box-shadow:var(--e2)}
.st-post .nl-t{color:var(--tx-1);font-weight:750;font-size:18px}
.st-post .nl-d{margin:6px 0 14px;color:var(--tx-3);font-size:14px}
.st-post .nl-f{display:flex;gap:10px;flex-wrap:wrap;position:relative}
.st-post .nl-f input[type=email]{flex:1;min-width:190px;height:46px;padding:0 14px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--s0);color:var(--tx-1);font:inherit;font-size:15px}
.st-post .nl-f input[type=email]:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(98,168,255,.12)}
.st-post .nl-f button{height:46px;padding:0 20px;border:0;border-radius:var(--r-sm);background:var(--grad-btn);color:#fff;font:700 15px var(--font);cursor:pointer}
.st-post .nl-msg{min-height:1em;margin-top:8px;color:var(--tx-meta);font-size:13px}
.st-post .cta{display:inline-block;margin-top:22px;color:var(--tx-3);text-decoration:none;font-size:14px}
.st-post .cta:hover{color:var(--tx-1)}
@media(max-width:540px){.st-post .post-nav{grid-template-columns:1fr}.st-post .post-nav .pn-r{text-align:left}.st-post .post-body{font-size:16px}}

/* ── 分類頁 ── */
.st-cat-hero{position:relative;margin:26px 0 36px;padding:40px 36px;border:1px solid var(--line-2);border-radius:var(--r-lg);background:var(--s1);box-shadow:var(--lift);overflow:hidden}
.st-cat-hero::before{content:"";position:absolute;inset:auto -10% -60% auto;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,var(--cat,#62a8ff),transparent 65%);opacity:.18;pointer-events:none}
.st-cat-hero h1{position:relative;margin:0 0 10px;color:var(--tx-1);font:800 clamp(30px,3.6vw,44px)/1.2 var(--font);letter-spacing:-.03em}
.st-cat-hero p{position:relative;margin:0;color:var(--tx-3);font-size:16px}
.st-cat-hero .count{color:var(--cat,#62a8ff);font-weight:750}
.st-cat-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.st-cat-list .ci{display:grid;grid-template-columns:132px 1fr;gap:18px;align-items:center;padding:12px;border:1px solid var(--line-1);border-radius:var(--r-md);background:transparent;transition:background .2s,border-color .2s,transform .2s,box-shadow .2s}
.st-cat-list .ci:hover{background:var(--s2);border-color:var(--line-3);box-shadow:var(--e2);transform:translateY(-2px)}
.st-cat-list .ci-img{display:block;aspect-ratio:3/2;border-radius:var(--r-sm);overflow:hidden;background:var(--s2)}
.st-cat-list .ci-img img{width:100%;height:100%;object-fit:cover;display:block}
.st-cat-list .ci-t{color:var(--tx-1);font-size:17px;font-weight:600;line-height:1.5;text-decoration:none}
.st-cat-list .ci-t:hover{color:var(--accent)}
.st-cat-list .ci-meta{margin:4px 0 4px;color:var(--tx-meta);font-size:12px;font-weight:500;letter-spacing:.03em}
.st-cat-list .ci-exc{margin:0;color:var(--tx-3);font-size:14px;line-height:1.65;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.st-catnav{display:flex;flex-wrap:wrap;gap:10px;margin:40px 0 0}
.st-catnav a{padding:8px 14px;border:1px solid var(--line-2);border-radius:999px;background:var(--s1);color:var(--tx-2);text-decoration:none;font-size:14px}
.st-catnav a:hover{border-color:var(--line-3);color:var(--tx-1)}
@media(max-width:540px){.st-cat-hero{padding:28px 22px}.st-cat-list .ci{grid-template-columns:96px 1fr;gap:12px;padding:10px}.st-cat-list .ci-exc{display:none}}

/* 頁尾 */
.st-foot{margin-top:var(--sec-md);padding:40px 0 32px;border-top:1px solid var(--line-1);background:var(--s1);color:var(--tx-meta);font-size:13px}
.st-foot .st-shell{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px 32px}
.st-foot nav{display:flex;flex-wrap:wrap;gap:8px 20px}
.st-foot a{color:var(--tx-3);text-decoration:none}
.st-foot a:hover{color:var(--tx-1)}

/* FAQ／術語庫沿用自己的元件樣式，這裡只中和它們的舊版全域規則 */
body.st{padding:0}
.st .st-nav nav,.st .st-crumb{margin-bottom:0}
.st .st-links{font-size:14px;color:inherit}
.st .st-crumb{margin:28px 0 20px}
.st .wrap .hero{border-color:var(--line-2);background:var(--s1);border-radius:var(--r-lg);box-shadow:var(--lift)}
.st .wrap .hero h1{color:var(--tx-1);font-weight:800;letter-spacing:-.02em}
.st-post .st-main-note{margin:22px 0 0;padding:12px 16px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--s1);color:var(--tx-3);font-size:14px}
.st-post .st-main-note a{color:var(--accent);text-decoration:none;font-weight:600}