/* =========================================================
 * 命理交叉分析系統 — 宣紙淺色主題
 * 底色淡紫（#F1EEF7）×古金×深墨；調色盤已通過 CVD 與對比驗證（light mode）
 * ========================================================= */
:root {
  --bg: #F1EEF7;
  --surface: #FBFAFD;
  --surface-2: #EFECF5;
  --surface-3: #E2DEEC;
  --ink: #26222E;
  --ink-strong: #3A3547;
  --ink-2: rgba(38, 34, 48, .84);
  --ink-3: rgba(38, 34, 48, .58);
  --line: rgba(38, 34, 48, .14);
  --gold: #8F6A1E;
  --gold-deep: #B58325;
  --c-bazi: #B58325;
  --c-west: #3E8FC7;
  --c-ziwei: #D45A73;
  --c-vedic: #2E9B82;
  --c-hd: #7D6BE0;
  --c-misc: #C56A3F;
  --good: #3E9B6E;
  --mid: #B58325;
  --low: #C4506A;
  --radius: 14px;
  --radius-lg: 22px;
  --navy: #1e2540;
  --navy-2: #303b63;
  --glow: rgba(214, 181, 95, .26);
  --font-display: "Noto Serif TC", "Songti TC", "PMingLiU", serif;
  --font-body: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 76px; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

body {
  margin: 0;
  background:
    radial-gradient(920px 500px at 92% -80px, rgba(105, 95, 160, .13), transparent 62%),
    radial-gradient(760px 430px at 6% 8%, rgba(181, 131, 37, .09), transparent 64%),
    radial-gradient(1100px 700px at 50% 112%, rgba(181, 131, 37, .06), transparent 63%),
    var(--bg);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.7;
}
/* 頂端紫色髮絲線（卷首感） */
body::before {
  content: ""; position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 60;
  background: linear-gradient(90deg, transparent, #7D6BE0 30%, #B3A3F2 50%, #7D6BE0 70%, transparent);
  opacity: .8; pointer-events: none;
}
::selection { background: rgba(181, 131, 37, .25); }
/* 細金捲軸（webkit） */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(143, 106, 30, .28); border-radius: 999px; border: 2.5px solid var(--bg); }
::-webkit-scrollbar-thumb:hover { background: rgba(143, 106, 30, .48); }

/* 宣紙紋（星幕 canvas 改為淡墨點） */
.starfield { position: fixed; inset: 0; pointer-events: none; z-index: 0; opacity: .28; }
main, header.site, nav.toc { position: relative; z-index: 1; }

/* ---------- 頂部橫幅（執筆繪星卷） ---------- */
.hero {
  position: relative; width: 100%; isolation: isolate;
  height: clamp(250px, 36vw, 490px); overflow: hidden;
  background: linear-gradient(180deg, #171d33 55%, var(--bg));
}
.hero img { width: 100%; height: 100%; object-fit: cover; object-position: center 42%; display: block; transform: scale(1.012); }
.hero::after {
  content: ""; position: absolute; inset: -1px 0;
  background:
    linear-gradient(90deg, rgba(13, 18, 35, .12), transparent 36%, transparent 66%, rgba(13, 18, 35, .14)),
    linear-gradient(180deg, rgba(17, 22, 42, .12), transparent 27%, rgba(241, 238, 247, .98) 96%);
  pointer-events: none;
}
.hero::before {
  content: ""; position: absolute; z-index: 1; left: 50%; bottom: 15%; width: min(64vw, 820px); height: 1px;
  transform: translateX(-50%); opacity: .75;
  background: linear-gradient(90deg, transparent, rgba(239, 210, 132, .85), transparent);
  box-shadow: 0 0 20px 5px rgba(214, 181, 95, .14);
}

/* ---------- 頁首（標題疊在橫幅的漸融區上） ---------- */
header.site {
  text-align: center; padding: 0 16px 12px;
  margin-top: clamp(-112px, -9.5vw, -54px);
  position: relative;
}
header.site h1, header.site p { position: relative; z-index: 1; }
@keyframes spin-rev { to { transform: rotate(-360deg); } }
header.site h1 {
  font-family: var(--font-display);
  font-size: clamp(30px, 5vw, 44px);
  margin: 0 0 6px;
  letter-spacing: .12em;
  color: var(--ink); text-shadow: 0 2px 20px rgba(250, 248, 255, .85);
  background: linear-gradient(120deg, #25233a 10%, #9b7020 50%, #373352 90%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
header.site p.sub { color: var(--ink-2); margin: 0 auto; max-width: 640px; font-size: 15px; line-height: 1.8; }
header.site .ver {
  color: var(--gold); font-size: 12.5px; letter-spacing: .24em; margin-top: 14px;
  display: flex; align-items: center; justify-content: center; gap: 14px;
}
header.site .ver::before, header.site .ver::after {
  content: ""; width: clamp(28px, 8vw, 72px); height: 1px;
  background: linear-gradient(90deg, transparent, rgba(181, 131, 37, .65));
}
header.site .ver::after { background: linear-gradient(90deg, rgba(181, 131, 37, .65), transparent); }

/* ---------- 導覽 ---------- */
nav.toc {
  position: sticky; top: 0; z-index: 50;
  display: flex; gap: 2px; justify-content: flex-start; flex-wrap: nowrap;
  overflow-x: auto; -webkit-overflow-scrolling: touch;
  padding: 10px 14px; margin-top: 26px;
  background: rgba(241, 238, 247, .9); backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
  scrollbar-width: none;
}
nav.toc::-webkit-scrollbar { display: none; }
nav.toc a {
  color: var(--ink-2); text-decoration: none; font-size: 13.5px;
  padding: 7px 12px; border-radius: 999px; white-space: nowrap;
  transition: color .2s, background .2s; cursor: pointer;
}
nav.toc a:hover, nav.toc a:focus-visible { color: var(--gold); background: rgba(143, 106, 30, .1); }
nav.toc a:focus-visible { outline: 2px solid var(--gold); outline-offset: 1px; }

main { max-width: 1060px; margin: 0 auto; padding: 20px 18px 90px; }

/* ---------- 卡片與章節 ---------- */
section.panel, details.panel {
  background: linear-gradient(145deg, rgba(255,255,255,.98), var(--surface) 54%, rgba(247,244,252,.98));
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 28px 28px 24px;
  margin: 28px 0;
  box-shadow: 0 9px 28px rgba(42, 36, 64, .075), 0 1px 2px rgba(42, 36, 64, .04);
  position: relative;
}
/* 內細金框（宣紙裱框感） */
section.panel::before, details.panel::before {
  content: ""; position: absolute; inset: 7px; border-radius: 15px;
  border: 1px solid rgba(181, 131, 37, .16); pointer-events: none;
}
/* 章節角落星芒（玄學紋樣） */
section.panel::after, details.panel::after {
  content: "✦"; position: absolute; bottom: 12px; right: 18px;
  color: var(--gold-deep); opacity: .22; font-size: 14px; pointer-events: none;
}
/* 表格與量化數字用等寬數字（分析感） */
table, .chip, .sens, .ynum { font-variant-numeric: tabular-nums; }
section.panel > h2, details.panel > summary > h2 {
  font-family: var(--font-display);
  font-size: 23px; letter-spacing: .1em; margin: 0 0 10px;
  color: var(--ink-strong); font-weight: 700;
  display: flex; align-items: center; gap: 12px;
  position: relative; padding-bottom: 13px;
}
section.panel > h2::after, details.panel > summary > h2::after {
  content: ""; position: absolute; left: 0; bottom: 0;
  width: 132px; height: 2px;
  background:
    radial-gradient(circle at 126px 1px, #8B7BE0 2.5px, transparent 3px),
    linear-gradient(90deg, #6B5BC8, rgba(125, 107, 224, .3) 88%, transparent 96%);
}
section.panel > h2 .no, details.panel > summary > h2 .no {
  font-size: 12px; letter-spacing: .1em; font-family: var(--font-display);
  color: #F2EFE8; background: radial-gradient(circle at 30% 25%, #55505F, #3A3547 72%, #2C2836);
  padding: 5px 8px; border-radius: 5px; line-height: 1.3;
  box-shadow: inset 0 0 0 1.5px rgba(242, 239, 232, .22), 0 1px 5px rgba(38, 34, 48, .35);
  writing-mode: horizontal-tb; white-space: nowrap;
}
/* 報告章節進場（水墨浮現） */
#report > * { animation: rise .55s cubic-bezier(.2, .7, .3, 1) both; }
#report > *:nth-child(2) { animation-delay: .05s; }
#report > *:nth-child(3) { animation-delay: .1s; }
#report > *:nth-child(4) { animation-delay: .15s; }
#report > *:nth-child(5) { animation-delay: .2s; }
#report > *:nth-child(n+6) { animation-delay: .25s; }
@keyframes rise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
section.panel > p.desc, details.panel > summary > p.desc { color: var(--ink-3); font-size: 13.5px; margin: 2px 0 16px; }
h3 { font-size: 16.5px; margin: 22px 0 10px; color: var(--ink); letter-spacing: .05em; }
h3 .chip { margin-left: 6px; }

/* 首次排盤流程：以精密儀式感說明系統如何工作，而不增加閱讀負擔 */
#input-panel {
  overflow: hidden;
  background:
    radial-gradient(520px 260px at 102% -12%, rgba(99, 84, 177, .115), transparent 68%),
    radial-gradient(380px 190px at -4% 104%, rgba(181, 131, 37, .09), transparent 68%),
    linear-gradient(145deg, rgba(255,255,255,.985), var(--surface) 54%, rgba(247,244,252,.985));
}
#input-panel > * { position: relative; z-index: 1; }
.form-journey {
  display: flex; align-items: center; gap: 10px; margin: 19px 0 21px; padding: 11px 13px;
  color: var(--ink-2); font-size: 12px; letter-spacing: .035em;
  background: rgba(255,255,255,.58); border: 1px solid rgba(143,106,30,.18); border-radius: 12px;
}
.form-journey span { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; }
.form-journey b {
  display: inline-grid; place-items: center; width: 23px; height: 23px; border-radius: 50%;
  color: #f8f4e9; font: 600 10px/1 var(--font-body); letter-spacing: .04em;
  background: linear-gradient(135deg, var(--navy-2), #554795); box-shadow: 0 1px 4px rgba(48,59,99,.3);
}
.form-journey i { flex: 1 1 22px; min-width: 14px; height: 1px; background: linear-gradient(90deg, rgba(125,107,224,.35), rgba(181,131,37,.32)); }

/* ---------- 表單 ---------- */
.form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(150px, 100%), 1fr)); gap: 14px 16px; }
.field { min-width: 0; }
.field label { display: block; font-size: 13px; color: var(--ink-2); margin: 0 0 7px 2px; letter-spacing: .07em; font-weight: 500; }
/* iOS 日期輸入有內建最小寬度，會撐破格線——強制收斂 */
.field input[type=date] {
  min-width: 0; max-width: 100%;
  -webkit-appearance: none; appearance: none;
}
.field input, .field select {
  width: 100%; min-height: 47px; padding: 11px 13px; font-size: 15.5px;
  background: rgba(255,255,255,.92); color: var(--ink);
  border: 1px solid rgba(38,34,48,.18); border-radius: 11px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 1px 2px rgba(42,36,64,.025);
  transition: border-color .2s, box-shadow .2s, background .2s;
}
.field input:hover, .field select:hover { border-color: rgba(143,106,30,.42); }
.field input:focus, .field select:focus { outline: none; background: #fff; border-color: var(--gold-deep); box-shadow: 0 0 0 3px rgba(181,131,37,.15); }
.time-precision {
  display: flex; flex-wrap: wrap; align-items: center; gap: 9px 18px; margin: 17px 0 0; padding: 0;
  border: 0; color: var(--ink-2); font-size: 13.5px;
}
.time-precision legend { width: 100%; padding: 0; margin-bottom: 2px; font-size: 13px; letter-spacing: .07em; font-weight: 500; }
.time-precision label, .analytics-toggle {
  display: inline-flex; align-items: center; gap: 7px; min-height: 38px; cursor: pointer;
}
.time-precision input, .analytics-toggle input { width: 17px; height: 17px; margin: 0; accent-color: #6B5BC8; cursor: pointer; }
.time-range-panel {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-top: 12px; padding: 15px 16px;
  border: 1px dashed rgba(125,107,224,.48); border-radius: 13px;
  background: linear-gradient(110deg, rgba(125,107,224,.09), rgba(181,131,37,.055));
}
.time-range-panel strong { color: var(--ink-strong); font-size: 14px; letter-spacing: .05em; }
.time-range-panel p { margin: 3px 0 0; max-width: 580px; color: var(--ink-2); font-size: 12.5px; line-height: 1.7; }
.time-range-panel .form-note { color: var(--ink-3); }
.time-range-inputs { display: flex; align-items: flex-end; gap: 8px; flex: 0 0 auto; }
.time-range-inputs label { display: grid; gap: 5px; color: var(--ink-2); font-size: 12px; letter-spacing: .04em; }
.time-range-inputs input {
  min-height: 43px; min-width: 0; padding: 8px 10px; color: var(--ink); font: inherit;
  border: 1px solid rgba(38,34,48,.18); border-radius: 9px; background: rgba(255,255,255,.92);
  -webkit-appearance: none; appearance: none; text-align: left;
}
.time-range-inputs input:focus { outline: none; border-color: var(--gold-deep); box-shadow: 0 0 0 3px rgba(181,131,37,.15); }
.time-range-inputs > span { padding-bottom: 11px; color: var(--ink-3); }
.opts { display: flex; flex-wrap: wrap; gap: 14px 22px; margin-top: 14px; color: var(--ink-2); font-size: 14px; }
.opts label { display: flex; align-items: center; gap: 7px; cursor: pointer; min-height: 44px; padding: 0 3px; }
.opts input[type=checkbox], .opts input[type=radio] { width: 17px; height: 17px; accent-color: #6B5BC8; cursor: pointer; }
.actions { display: flex; gap: 12px; margin-top: 18px; flex-wrap: wrap; align-items: center; }
button.primary {
  font-family: var(--font-display); letter-spacing: .2em; font-size: 16.5px;
  padding: 13px 34px; min-height: 50px; border: none; border-radius: 999px; cursor: pointer;
  color: #F4F1FA;
  background:
    radial-gradient(circle at 30% 20%, rgba(179, 163, 242, .5), transparent 55%),
    linear-gradient(125deg, #5A4BA8, #3C3364 62%, #2E2850);
  box-shadow: 0 5px 18px rgba(68, 55, 119, .38), inset 0 0 0 1px rgba(217, 206, 255, .38);
  transition: filter .2s, box-shadow .2s, transform .15s;
}
button.primary:hover { filter: brightness(1.12); transform: translateY(-1px); box-shadow: 0 8px 26px rgba(81, 65, 143, .46), inset 0 0 0 1px rgba(221, 213, 255, .58); }
button.primary:disabled { filter: grayscale(.6) opacity(.6); cursor: wait; }
button.ghost {
  font-size: 13.5px; padding: 9px 16px; min-height: 44px; cursor: pointer;
  background: rgba(255,255,255,.56); color: var(--ink-2);
  border: 1px solid var(--line); border-radius: 999px;
  transition: color .2s, border-color .2s, background .2s, box-shadow .2s;
}
button.ghost:hover { color: var(--gold); background: #fff; border-color: var(--gold-deep); box-shadow: 0 3px 10px rgba(42,36,64,.06); }
button:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.form-note { color: var(--ink-3); font-size: 12.5px; margin-top: 12px; }

/* ---------- 徽章與標記 ---------- */
.chip {
  display: inline-block; font-size: 12px; padding: 2px 10px; border-radius: 999px;
  border: 1px solid var(--line); color: var(--ink-2); vertical-align: middle;
  background: #fff;
}
.chip.sys-bazi { color: #7a5710; border-color: rgba(181, 131, 37, .45); background: rgba(181, 131, 37, .1); }
.chip.sys-west { color: #23608c; border-color: rgba(62, 143, 199, .45); background: rgba(62, 143, 199, .1); }
.chip.sys-ziwei { color: #9c3350; border-color: rgba(212, 90, 115, .45); background: rgba(212, 90, 115, .1); }
.chip.sys-vedic { color: #1c6c59; border-color: rgba(46, 155, 130, .45); background: rgba(46, 155, 130, .1); }
.chip.sys-hd { color: #52439e; border-color: rgba(125, 107, 224, .45); background: rgba(125, 107, 224, .1); }
.chip.sys-misc { color: #8c4520; border-color: rgba(197, 106, 63, .45); background: rgba(197, 106, 63, .1); }
.stars { color: var(--gold-deep); letter-spacing: .1em; }
.warn-chip { color: #93314a; background: rgba(196, 80, 106, .1); border-color: rgba(196, 80, 106, .4); }
.ok-chip { color: #226348; background: rgba(62, 155, 110, .12); border-color: rgba(62, 155, 110, .4); }

/* ---------- 表格 ---------- */
.tbl-wrap { overflow-x: auto; margin: 8px 0; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
table { border-collapse: collapse; width: 100%; font-size: 14px; min-width: 560px; }
th, td { text-align: left; padding: 10px 12px; border-bottom: 1px solid rgba(42, 36, 64, .09); vertical-align: top; }
thead th {
  color: var(--gold); font-weight: 600; font-size: 12.5px; letter-spacing: .12em; white-space: nowrap;
  background: linear-gradient(180deg, rgba(181, 131, 37, .09), rgba(181, 131, 37, .04));
  border-bottom: 1.5px solid rgba(181, 131, 37, .35);
}
tbody th { color: var(--ink-3); font-weight: 500; font-size: 12.5px; letter-spacing: .1em; white-space: nowrap; }
tbody tr { transition: background .15s; }
tbody tr:hover { background: rgba(181, 131, 37, .045); }
tbody tr:last-child td { border-bottom: none; }
td strong { color: var(--gold); font-weight: 700; }

/* ---------- 排盤總表 tabs ---------- */
.tabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 16px; }
.tabs button {
  font-size: 14px; padding: 9px 18px; min-height: 44px; cursor: pointer;
  background: #fff; color: var(--ink-2);
  border: 1px solid var(--line); border-radius: 999px;
  transition: color .2s, border-color .2s, box-shadow .2s, background .2s;
}
.tabs button:hover { color: var(--gold); border-color: rgba(181, 131, 37, .55); }
.tabs button.active {
  color: #fff; background: linear-gradient(120deg, #a1781f, #8F6A1E); border-color: transparent; font-weight: 600;
  box-shadow: 0 2px 10px rgba(143, 106, 30, .35);
}
.tab-pane { display: none; }
.tab-pane.active { display: block; }

/* ---------- 圖表 ---------- */
.chart-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 20px; align-items: start; }
figure.chart {
  margin: 0; background: linear-gradient(180deg, #fff, #FAF9FD);
  border: 1px solid var(--line); border-radius: 12px; padding: 16px;
  box-shadow: 0 1px 8px rgba(42, 36, 64, .04);
}
figure.chart figcaption {
  font-size: 14px; color: var(--ink-2); text-align: center; margin-bottom: 8px; letter-spacing: .1em;
  display: flex; align-items: center; justify-content: center; gap: 10px;
}
figure.chart figcaption::before, figure.chart figcaption::after {
  content: ""; width: 26px; height: 1px; background: rgba(181, 131, 37, .4);
}
figure.chart svg {
  width: 100%; height: auto; display: block;
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none;
}
.tl-span { cursor: pointer; transition: fill-opacity .15s; }
.tl-span:hover { fill-opacity: 1; }
.tl-detail {
  margin: 10px 2px 0; padding: 10px 14px; border-radius: 10px; min-height: 44px;
  background: rgba(181, 131, 37, .07); border: 1px dashed rgba(181, 131, 37, .4);
  font-size: 13.5px; color: var(--ink-2); line-height: 1.75;
}
.chart-note { font-size: 12.5px; color: var(--ink-3); margin: 8px 2px 0; line-height: 1.6; }
.lg { display: inline-block; width: 12px; height: 12px; border-radius: 3px; vertical-align: -1px; margin-right: 3px; }

.meters { display: flex; flex-direction: column; gap: 8px; margin: 10px 0; }
.meter-row { display: grid; grid-template-columns: 88px 1fr 48px; gap: 10px; align-items: center; font-size: 14px; }
.meter-label { color: var(--ink-2); text-align: right; }
.meter-track { height: 12px; background: rgba(42, 36, 64, .08); border-radius: 999px; overflow: hidden; }
.meter-fill { display: block; height: 100%; border-radius: 999px; }
.meter-val { color: var(--ink-2); font-variant-numeric: tabular-nums; }

.sbars { display: flex; flex-direction: column; gap: 10px; }
.sbar-group { display: grid; grid-template-columns: 64px 1fr; gap: 10px; align-items: center; }
.sbar-label { font-size: 14px; color: var(--ink-2); text-align: right; }
.sbar-tracks { display: flex; flex-direction: column; gap: 3px; }
.sbar-track { position: relative; height: 16px; background: rgba(42, 36, 64, .07); border-radius: 4px; }
.sbar-track.sbar-b, .sbar-fill.sbar-b { height: 8px; }
.sbar-zero { position: absolute; top: -2px; bottom: -2px; width: 1.5px; background: rgba(42, 36, 64, .4); }
.sbar-fill { position: absolute; top: 2px; height: 12px; border-radius: 3px; }
.sbar-fill.sbar-b { top: 2px; height: 5px; }
.sbar-num { position: absolute; right: 6px; font-size: 11px; color: var(--ink-3); line-height: 16px; }

.mini-radars { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 8px; }
.mini-radar { margin: 0; flex: 0 0 172px; background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 8px 4px 10px; }
.mini-radar.current { border-color: var(--gold-deep); box-shadow: 0 0 12px rgba(181, 131, 37, .3); }
.mini-radar figcaption { text-align: center; font-size: 11.5px; color: var(--ink-2); }
.mini-radar svg { width: 100%; height: auto; }

.freq-bars { display: flex; gap: 8px; align-items: flex-end; max-width: 420px; }
.freq-col { flex: 1; text-align: center; }
.freq-bar-wrap { height: 90px; display: flex; align-items: flex-end; }
.freq-bar { width: 100%; border-radius: 4px 4px 0 0; min-height: 2px; }
.freq-num { display: block; font-size: 13px; color: var(--ink-2); margin-top: 5px; }
.freq-num.is-main { color: var(--c-misc); font-weight: 700; }
.freq-count { font-size: 11px; color: var(--ink-3); }

/* ---------- 匯流卡 ---------- */
.probe { border: 1px solid var(--line); border-radius: 12px; padding: 16px 18px; margin: 12px 0; background: #fff; transition: border-color .2s, box-shadow .2s; }
.probe:hover { border-color: rgba(181, 131, 37, .45); box-shadow: 0 3px 14px rgba(42, 36, 64, .07); }
.probe > summary:hover { color: var(--gold); }
.probe[open] { border-color: rgba(181, 131, 37, .4); }
.probe summary { cursor: pointer; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 15.5px; min-height: 30px; list-style: none; }
.probe summary::-webkit-details-marker { display: none; }
.probe summary::after { content: "▾"; margin-left: auto; color: var(--ink-3); transition: transform .2s; }
.probe[open] summary::after { transform: rotate(180deg); }
.probe .axis { color: var(--ink-3); font-size: 13px; }
.probe ul { margin: 12px 0 4px; padding-left: 20px; color: var(--ink-2); font-size: 14px; }
.probe li { margin: 5px 0; }
.probe .miss { color: var(--ink-3); font-size: 12.5px; margin-top: 8px; }

/* 頭條／總結 */
.headline-card {
  border: 1px solid rgba(143, 106, 30, .35); border-radius: 12px;
  background: linear-gradient(140deg, rgba(181, 131, 37, .08), rgba(125, 107, 224, .06));
  padding: 20px 22px; margin: 14px 0;
}
.headline-card h3 { margin: 0 0 8px; color: var(--gold); font-family: var(--font-display); letter-spacing: .08em; }
.id-line { font-size: 14.5px; color: var(--ink-2); margin: 4px 0; }

.summary-block { margin: 18px 0; padding-top: 16px; border-top: 1px dashed rgba(181, 131, 37, .28); }
.summary-block:first-of-type { border-top: none; padding-top: 0; }
.summary-block h4 { margin: 0 0 8px; font-size: 15.5px; color: var(--gold); letter-spacing: .06em; display: flex; align-items: center; gap: 8px; }
.summary-block h4::before { content: "✦"; font-size: 11px; opacity: .75; }
.summary-block p, .summary-block li { font-size: 14.5px; color: var(--ink-2); }
.summary-block ul { margin: 4px 0; padding-left: 20px; }
.summary-block li { margin: 6px 0; }

/* 矛盾卡 */
.contra { border-left: 3px solid var(--low); padding: 12px 16px; margin: 12px 0; background: #fff; border-radius: 0 10px 10px 0; border-top: 1px solid var(--line); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.contra.coexist { border-left-color: var(--c-hd); }
.contra.pseudo { border-left-color: var(--ink-3); }
.contra .t { font-size: 13px; color: var(--ink-3); letter-spacing: .06em; }
.contra .w { margin: 4px 0; font-size: 14.5px; }
.contra .v { color: var(--ink-2); font-size: 13.5px; }

/* L0-L3 */
.layer { margin: 14px 0; }
.layer h4 { margin: 0 0 8px; font-size: 14.5px; color: var(--gold); letter-spacing: .08em; }
.layer h4 small { color: var(--ink-3); font-weight: 400; letter-spacing: .02em; }
.layer ul { margin: 0; padding-left: 20px; font-size: 14px; color: var(--ink-2); }
.layer li { margin: 4px 0; }

/* 假說 */
.hypo { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: start; padding: 13px 14px; margin: 9px 0; border: 1px solid var(--line); border-radius: 10px; background: #fff; font-size: 14.5px; }
.hypo .claim { font-weight: 600; }
.hypo .example { color: var(--ink-2); font-size: 13.5px; margin-top: 4px; }
.hypo .src { color: var(--ink-3); font-size: 12px; margin-top: 5px; }
.hypo .btns { display: flex; gap: 6px; }
.hypo button { width: 44px; height: 44px; border-radius: 9px; border: 1px solid var(--line); background: #fff; color: var(--ink-3); cursor: pointer; font-size: 17px; transition: all .2s; }
.hypo button.on-yes { background: rgba(62, 155, 110, .18); color: #226348; border-color: var(--good); }
.hypo button.on-no { background: rgba(196, 80, 106, .15); color: #93314a; border-color: var(--low); }
.hypo-score { font-size: 14px; color: var(--ink-2); margin-top: 10px; }

/* 對策 */
.strategy { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; padding: 12px 14px; margin: 9px 0; border: 1px solid var(--line); border-radius: 10px; background: #fff; font-size: 14.5px; align-items: baseline; }
.strategy .d { color: var(--gold); white-space: nowrap; font-size: 14px; }

/* 匯出 / AI 解讀 */
textarea.export {
  width: 100%; min-height: 200px; font-size: 12.5px; line-height: 1.6;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  background: #fff; color: var(--ink-2);
  border: 1px solid var(--line); border-radius: 10px; padding: 14px;
  resize: vertical;
}
.ai-key-row { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin: 10px 0; }
.ai-key-row input {
  flex: 1; min-width: 240px; padding: 11px 12px; font-size: 14px;
  background: #fff; color: var(--ink);
  border: 1px solid var(--line); border-radius: 9px;
  font-family: ui-monospace, Menlo, monospace;
}
.ai-key-row input:focus { outline: none; border-color: var(--gold-deep); }
.ai-result {
  border: 1px solid var(--line); border-radius: 12px; background: #fff;
  padding: 20px 22px; margin-top: 14px; font-size: 15px; line-height: 1.8;
  overflow-wrap: break-word;
}
.ai-result h1, .ai-result h2 { font-family: var(--font-display); color: var(--gold); font-size: 20px; letter-spacing: .06em; margin: 20px 0 8px; }
.ai-result h3 { font-size: 17px; margin: 16px 0 6px; }
.ai-result h4 { font-size: 15.5px; margin: 14px 0 4px; color: var(--ink); }
.ai-result p { margin: 8px 0; }
.ai-result ul, .ai-result ol { padding-left: 22px; margin: 6px 0; }
.ai-result li { margin: 4px 0; }
.ai-result hr { border: none; border-top: 1px solid var(--line); margin: 16px 0; }
.ai-result code { background: var(--surface-2); border-radius: 4px; padding: 1px 5px; font-size: .9em; }
.ai-result .md-table { font-family: ui-monospace, Menlo, monospace; font-size: 12.5px; white-space: pre; overflow-x: auto; background: var(--surface-2); border-radius: 8px; padding: 10px 12px; margin: 8px 0; }
.ai-status { font-size: 13.5px; color: var(--ink-3); margin-top: 8px; }

/* 紫微命盤格 */
.zw-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; max-width: 720px; margin: 12px auto; }
.zw-cell { border: 1px solid var(--line); border-radius: 8px; background: #fff; min-height: 118px; padding: 8px 9px; font-size: 12px; position: relative; }
.zw-cell.zw-center { grid-column: 2 / 4; grid-row: 2 / 4; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; background: transparent; border-style: dashed; font-size: 13.5px; color: var(--ink-2); text-align: center; }
.zw-cell .gz { position: absolute; right: 8px; bottom: 6px; color: var(--ink-3); font-size: 11px; }
.zw-cell .pname { color: var(--gold); font-size: 12.5px; letter-spacing: .1em; }
.zw-cell .pname .shen { color: #9c3350; }
.zw-cell .majors { font-size: 13.5px; margin: 3px 0 2px; font-weight: 600; }
.zw-cell .majors .hua { color: #8F6A1E; font-size: 11px; }
.zw-cell .sub { color: var(--ink-2); line-height: 1.5; }
.zw-cell .sub .bad { color: #b23a55; }

/* 時間敏感度 */
.sens { display: flex; gap: 10px; flex-wrap: wrap; margin: 10px 0; }

/* 儲存的檔案 */
.profiles { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.profiles .ghost { min-height: 38px; padding-block: 6px; }

/* 個資設定：預設收合，資訊透明但不干擾排盤主流程 */
.privacy-settings { margin-top: 17px; padding: 0; border: 1px solid rgba(38,34,48,.13); border-radius: 12px; background: rgba(255,255,255,.5); }
.privacy-settings > summary {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; padding: 10px 14px;
  list-style: none; cursor: pointer; color: var(--ink-2); font-size: 13.5px;
}
.privacy-settings > summary::-webkit-details-marker { display: none; }
.privacy-settings > summary::after { content: "▾"; order: 3; color: var(--ink-3); transition: transform .2s; }
.privacy-settings[open] > summary::after { transform: rotate(180deg); }
.privacy-settings > summary small { margin-left: auto; color: var(--gold); font-size: 11.5px; letter-spacing: .04em; }
.privacy-content { padding: 0 14px 14px; border-top: 1px solid rgba(38,34,48,.09); }
.privacy-content > p:not(.form-note) { margin: 12px 0; color: var(--ink-2); font-size: 13px; line-height: 1.75; }
.privacy-actions { display: flex; align-items: center; gap: 10px 16px; flex-wrap: wrap; }
.privacy-actions .ghost { min-height: 40px; padding-block: 7px; }
.analytics-toggle { font-size: 13px; color: var(--ink-2); }
.privacy-content .form-note { margin: 10px 0 0; }

/* 出生時間區間結果 */
.time-confidence {
  border-color: rgba(107,91,200,.42) !important;
  background: linear-gradient(145deg, rgba(250,249,255,.99), rgba(244,241,252,.99)) !important;
}
.time-confidence .desc { max-width: 760px; }
.uncertainty-overview { display: grid; grid-template-columns: auto 1fr; gap: 10px 16px; align-items: center; margin: 16px 0; padding: 14px 16px; border-radius: 12px; background: rgba(107,91,200,.075); }
.uncertainty-seal { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; color: #f7f4ff; background: linear-gradient(135deg, var(--navy-2), #6857ba); font-family: var(--font-display); font-size: 13px; letter-spacing: .08em; box-shadow: 0 3px 12px rgba(80,67,145,.24); }
.uncertainty-overview p { margin: 0; color: var(--ink-2); font-size: 14px; line-height: 1.75; }
.uncertainty-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.uncertainty-list { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: #fff; }
.uncertainty-list h3 { margin: 0; padding: 11px 14px; font-family: var(--font-body); font-size: 13.5px; color: var(--ink-strong); background: rgba(42,36,64,.035); }
.uncertainty-list.stable h3 { color: #226348; background: rgba(62,155,110,.09); }
.uncertainty-list.variable h3 { color: #7a5710; background: rgba(181,131,37,.1); }
.uncertainty-list ul { margin: 0; padding: 8px 14px 11px 31px; color: var(--ink-2); font-size: 13.5px; }
.uncertainty-list li { margin: 6px 0; line-height: 1.65; }
.uncertainty-list .range-values { color: var(--ink-3); font-size: 12.5px; }

/* 分享確認對話框 */
.privacy-dialog { width: min(540px, calc(100vw - 32px)); padding: 0; color: var(--ink); border: 1px solid rgba(143,106,30,.36); border-radius: 20px; background: linear-gradient(145deg, #fff, #f7f4fc); box-shadow: 0 22px 70px rgba(22,18,42,.35); }
.privacy-dialog::backdrop { background: rgba(20,18,37,.54); backdrop-filter: blur(3px); }
.privacy-dialog form { padding: 25px; }
.privacy-dialog .dialog-kicker { margin: 0 0 4px; color: var(--gold); font-size: 11.5px; font-weight: 700; letter-spacing: .16em; }
.privacy-dialog h2 { margin: 0 0 10px; font-family: var(--font-display); font-size: 23px; letter-spacing: .06em; }
.privacy-dialog p:not(.dialog-kicker):not(.form-note) { color: var(--ink-2); font-size: 14px; line-height: 1.8; }
.privacy-dialog code { padding: 1px 5px; border-radius: 4px; color: var(--gold); background: rgba(181,131,37,.1); }
.dialog-actions { display: flex; align-items: stretch; gap: 10px; margin-top: 18px; }
.dialog-actions button { flex: 1 1 0; min-height: 50px; }
.privacy-dialog .primary { padding-inline: 16px; font-size: 14px; letter-spacing: .1em; }
.dialog-close { display: block; margin: 13px auto 0; padding: 5px 12px; border: 0; color: var(--ink-3); background: transparent; cursor: pointer; font: inherit; }
.dialog-close:hover { color: var(--gold); }

/* 認識論 */
.epistemic { border: 1px dashed var(--line); border-radius: 12px; padding: 18px 20px; color: var(--ink-2); font-size: 14px; background: #fff; }

footer { text-align: center; color: var(--ink-3); font-size: 12.5px; padding: 36px 16px 44px; position: relative; }
footer::before {
  content: "✦"; display: block; color: var(--gold-deep); opacity: .5; font-size: 13px; margin-bottom: 12px;
}
.hidden { display: none !important; }

/* 載入（小羅盤） */
.loading-veil { display: flex; align-items: center; gap: 14px; color: var(--ink-2); font-size: 15px; padding: 22px 4px; }
.loading-veil .orb {
  position: relative; width: 26px; height: 26px; border-radius: 50%;
  border: 2.5px solid rgba(143, 106, 30, .22); border-top-color: var(--gold);
  animation: spin 1.1s linear infinite;
}
.loading-veil .orb::after {
  content: ""; position: absolute; inset: 4px; border-radius: 50%;
  border: 1px dashed rgba(143, 106, 30, .5);
  animation: spin-rev 2.6s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ---------- 行動手冊 ---------- */
.guide {
  border: 1px solid rgba(181, 131, 37, .35); border-left: 3px solid var(--gold-deep); border-radius: 0 10px 10px 0;
  background: linear-gradient(120deg, rgba(181, 131, 37, .09), rgba(255, 255, 255, .45));
  padding: 14px 18px; font-size: 14px; color: var(--ink-2); margin: 6px 0 18px; line-height: 1.85;
}
.amanual { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 14px; }
.acard {
  background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 16px 18px;
  transition: border-color .2s, box-shadow .2s, transform .2s;
}
.acard:hover { border-color: rgba(181, 131, 37, .5); box-shadow: 0 4px 16px rgba(42, 36, 64, .08); transform: translateY(-2px); }
.acard h4 { margin: 0 0 10px; font-family: var(--font-display); font-size: 16.5px; color: var(--ink); letter-spacing: .04em; }
.fld { font-size: 13.5px; color: var(--ink-2); margin: 8px 0; line-height: 1.7; }
.fld ol, .fld ul, .piece ol, .piece ul { margin: 4px 0 0; padding-left: 20px; }
.fld-tag {
  display: inline-block; font-size: 11.5px; letter-spacing: .08em; margin-right: 7px;
  padding: 1px 8px; border-radius: 4px; vertical-align: 1px; white-space: nowrap;
  color: #52439e; background: rgba(125, 107, 224, .1); border: 1px solid rgba(125, 107, 224, .3);
}
.fld-tag.warn { color: #93314a; background: rgba(196, 80, 106, .09); border-color: rgba(196, 80, 106, .35); }
.fld-tag.go { color: #226348; background: rgba(62, 155, 110, .1); border-color: rgba(62, 155, 110, .35); }
.src-note { font-size: 11.5px; color: var(--ink-3); margin-top: 10px; }
.pieces { display: flex; flex-direction: column; gap: 8px; }
.piece {
  background: #fff; border: 1px solid var(--line); border-radius: 10px;
  padding: 12px 15px; font-size: 14px; color: var(--ink-2); line-height: 1.75;
}
.ycal { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 14px; }
.ycard {
  background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 16px 18px;
  border-top: 3px solid var(--mid); font-size: 13.5px; color: var(--ink-2);
}
.ycard.good { border-top-color: var(--good); }
.ycard.low { border-top-color: var(--low); }
.yhead { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; flex-wrap: wrap; }
.ynum { font-family: var(--font-display); font-size: 24px; color: var(--ink); letter-spacing: .04em; }
.ydo ul, .ydont ul { margin: 2px 0 8px; padding-left: 20px; }
.ydo li, .ydont li { margin: 3px 0; }
.yextra { font-size: 12.5px; color: var(--ink-3); border-top: 1px dashed var(--line); padding-top: 8px; margin-top: 4px; line-height: 1.7; }
.dcard summary { font-size: 15px; }
.dcard ol { margin: 10px 0 4px; padding-left: 22px; font-size: 14px; color: var(--ink-2); }
.dcard li { margin: 6px 0; line-height: 1.75; }

/* 收合式章節（專業內容預設收起） */
details.panel > summary { cursor: pointer; list-style: none; }
details.panel > summary::-webkit-details-marker { display: none; }
details.panel > summary h2 { margin-bottom: 0; }
details.panel > summary .desc { margin-bottom: 2px; }
.fold-hint {
  margin-left: auto; font-size: 12px; font-family: var(--font-body);
  color: var(--ink-3); border: 1px solid var(--line); border-radius: 999px;
  padding: 3px 12px; letter-spacing: .1em; transition: all .2s; white-space: nowrap;
}
details.panel > summary:hover .fold-hint { color: var(--gold); border-color: var(--gold-deep); }
details.panel[open] .fold-hint { display: none; }
details.panel[open] > summary h2 { margin-bottom: 10px; }
details.panel[open] > summary .desc { margin-bottom: 16px; }

/* 系統白話導讀 */
.sys-brief {
  border-left: 3px solid var(--gold-deep); border-radius: 0 10px 10px 0;
  background: linear-gradient(120deg, rgba(181, 131, 37, .07), rgba(255, 255, 255, .5));
  padding: 12px 16px; font-size: 14px; color: var(--ink-2); line-height: 1.85; margin: 4px 0 18px;
}

/* 深入解讀（排盤總表各分頁底部） */
.deep-dive {
  border: 1px solid var(--line); border-left: 3px solid var(--gold-deep); border-radius: 0 12px 12px 0;
  background: linear-gradient(120deg, rgba(181, 131, 37, .05), rgba(255, 255, 255, .6));
  padding: 14px 18px; margin: 20px 0 8px;
}
.deep-dive > summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 15px; min-height: 28px; color: var(--gold); }
.deep-dive > summary::-webkit-details-marker { display: none; }
.deep-dive > summary::after { content: "▾"; margin-left: auto; color: var(--ink-3); transition: transform .2s; }
.deep-dive[open] > summary::after { transform: rotate(180deg); }
.deep-dive[open] > summary { margin-bottom: 6px; }
.deep-dive h4 { margin: 16px 0 6px; font-size: 14.5px; color: var(--ink); }
.deep-dive ul { margin: 8px 0 6px; padding-left: 20px; font-size: 14px; color: var(--ink-2); }
.deep-dive li { margin: 8px 0; line-height: 1.85; }

/* 量化總覽的「再深一層」 */
.deep-insight {
  margin: 10px 0 6px; padding: 10px 14px; border-radius: 10px;
  background: rgba(42, 36, 64, .04); font-size: 13.5px; line-height: 1.85; color: var(--ink-2); text-align: left;
}
.deep-insight ul { margin: 6px 0 2px; padding-left: 18px; }
.deep-insight li { margin: 5px 0; }

/* 總結核心條目補充行、頭條「所以呢」、弱訊號卡 */
.core-extra { color: var(--ink-3); line-height: 1.8; }
.warn-text { color: #A0522D; }
.headline-sowhat { margin: 10px 0 2px; font-size: 13.5px; line-height: 1.85; color: var(--ink-2); border-top: 1px dashed var(--line); padding-top: 8px; }
.weak-probe summary { font-size: 14px; }

/* 三年走勢的訊號子清單 */
.next3 > li { margin: 12px 0; }
.signal-list { margin: 6px 0 2px; padding-left: 18px; font-size: 13px; color: var(--ink-2); list-style: none; }
.signal-list li { margin: 4px 0; line-height: 1.75; }
.signal-list li::before { content: "▸ "; color: var(--gold-deep); }
.sig-raw { color: var(--gold); font-weight: 600; }

/* 敏感度檢查（輸入面板內） */
.sens-inline-box { margin-top: 14px; padding: 12px 14px; border: 1px dashed var(--line); border-radius: 10px; font-size: 14px; }
.sens-inline-box .sens { margin-top: 8px; }
.sens-inline-box .form-note { display: inline; margin-left: 6px; }
/* 檢查通過的四項膠囊：紫色（比底色微深） */
.sens .chip.ok-chip {
  color: #55489E;
  background: #E9E4F4;
  border-color: rgba(107, 91, 200, .45);
}

/* 參考系統解讀清單 */
.ref-ul { margin: 8px 0 6px; padding-left: 18px; font-size: 13.5px; color: var(--ink-2); }
.ref-ul li { margin: 5px 0; line-height: 1.8; }

/* 決策卡結論 */
.dverdict { margin: 8px 0 2px; padding: 8px 12px; border-radius: 8px; background: rgba(181, 131, 37, .08); font-size: 14px; font-weight: 600; color: var(--gold); line-height: 1.75; }

/* 其他參考章節的子章 */
.sub-chapter { border: 1px solid var(--line); border-radius: 12px; padding: 14px 18px; margin: 14px 0; background: #fff; }
.sub-chapter > summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; min-height: 30px; }
.sub-chapter > summary::-webkit-details-marker { display: none; }
.sub-chapter > summary h3 { margin: 0; font-size: 16.5px; }
.sub-chapter > summary .axis { color: var(--ink-3); font-size: 13px; }
.sub-chapter[open] > summary { margin-bottom: 8px; }
.sub-chapter[open] > summary .fold-hint { display: none; }

/* 流年紅綠燈訊號逐項解釋 */
.sig-item { margin: 4px 0; line-height: 1.65; }
.sig-item small { color: var(--ink-3); }
.god-note { color: var(--ink-3); }

/* 八字分頁逐條解讀 */
.bazi-read { margin: 10px 0; padding-left: 18px; font-size: 14px; color: var(--ink-2); }
.bazi-read li { margin: 9px 0; line-height: 1.85; }
.bazi-read small { color: var(--ink-3); }

/* 出廠規格清單 */
.spec-list { margin: 8px 0 2px; padding-left: 18px; }
.spec-list li { margin: 12px 0; line-height: 1.9; }
.spec-list li > strong { color: var(--gold); }
.spec-list small { color: var(--ink-3); }

/* 短中長期布局 */
.horizon { display: flex; gap: 12px; align-items: flex-start; margin: 12px 0; }
.hz-tag {
  flex: 0 0 auto; font-family: var(--font-display); font-size: 12.5px; letter-spacing: .08em;
  color: var(--gold); border: 1px solid rgba(181, 131, 37, .4); border-radius: 8px;
  padding: 4px 10px; margin-top: 2px; white-space: nowrap; background: rgba(181, 131, 37, .06);
}
.horizon ul { margin: 0; padding-left: 18px; flex: 1; }
.horizon li { margin: 5px 0; line-height: 1.8; }
@media (max-width: 560px) { .horizon { flex-direction: column; gap: 6px; } }

/* AI 深度提問 */
.ai-actions { display: flex; align-items: center; gap: 12px; margin: 10px 0; flex-wrap: wrap; }
#ai-prompt-text {
  width: 100%; font-size: 12px; line-height: 1.6; color: var(--ink-2);
  background: #fff; border: 1px solid var(--line); border-radius: 10px;
  padding: 12px 14px; resize: vertical; font-family: ui-monospace, "SF Mono", Menlo, monospace;
}
#ai-prompt-text:focus { outline: none; border-color: var(--gold-deep); }

/* 名詞小抄 */
.term-note {
  border: 1px dashed rgba(181, 131, 37, .45); border-radius: 10px;
  padding: 10px 14px; margin: 4px 0 14px; font-size: 13px; color: var(--ink-2); line-height: 1.9;
}
.term-note span { display: block; }

/* 時分輸入 */
.time-pair { display: flex; align-items: center; gap: 6px; }
.time-pair input { flex: 1; min-width: 0; }
.time-colon { color: var(--ink-3); }

/* 白話說明列 */
.probe-plain {
  font-size: 13.5px; color: var(--ink-2); line-height: 1.75;
  background: rgba(181, 131, 37, .06); border-left: 3px solid rgba(181, 131, 37, .4);
  border-radius: 0 8px 8px 0; padding: 8px 12px; margin: 8px 0 12px;
}
.spotlight { padding-left: 20px; font-size: 14px; color: var(--ink-2); }
.spotlight li { margin: 5px 0; }

/* 主力／參考分組 */
.tab-group-label { font-size: 12.5px; color: var(--ink-3); letter-spacing: .1em; margin: 4px 0 8px; }
.ref-block {
  margin-top: 24px; border: 1px dashed rgba(42, 36, 64, .3); border-radius: 12px;
  padding: 14px 18px; background: var(--surface-2);
}
.ref-block > summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 15.5px; min-height: 30px; }
.ref-block > summary::-webkit-details-marker { display: none; }
.ref-block[open] > summary { margin-bottom: 6px; }
.ref-block[open] .fold-hint { display: none; }
.ref-tag {
  font-size: 11.5px; letter-spacing: .08em; padding: 2px 10px; border-radius: 999px;
  color: var(--ink-3); border: 1px solid var(--line); background: #fff;
}

/* 最突出特質卡 */
.acard-top { border-color: rgba(181, 131, 37, .55); box-shadow: 0 4px 18px rgba(181, 131, 37, .14); position: relative; }
.top-badge {
  display: inline-block; font-size: 11.5px; letter-spacing: .12em; margin-bottom: 8px;
  color: #F2EFE8; background: linear-gradient(120deg, #4A4553, #35303F);
  padding: 3px 10px; border-radius: 999px;
}

/* ---------- 響應式 ---------- */
@media (max-width: 720px) {
  main { padding: 14px 12px 68px; }
  section.panel, details.panel { padding: 20px 15px 18px; border-radius: 18px; }
  section.panel::before, details.panel::before { inset: 6px; border-radius: 12px; }
  header.site { margin-top: -62px; }
  header.site h1 { font-size: 31px; letter-spacing: .09em; }
  header.site .ver { gap: 9px; letter-spacing: .16em; font-size: 11.5px; }
  .form-journey { gap: 7px; padding: 10px; font-size: 11.5px; overflow-x: auto; }
  .form-journey i { min-width: 10px; }
  .time-range-panel { align-items: stretch; flex-direction: column; gap: 11px; }
  .time-range-inputs { width: 100%; flex-direction: column; align-items: stretch; gap: 12px; }
  .time-range-inputs > span { display: none; }
  .time-range-inputs label { flex: 1 1 auto; width: 100%; }
  .time-range-inputs input { width: 100%; }
  .privacy-settings > summary { align-items: flex-start; flex-wrap: wrap; }
  .privacy-settings > summary small { width: calc(100% - 20px); margin-left: 0; }
  .uncertainty-grid { grid-template-columns: 1fr; }
  .actions { gap: 9px; }
  button.primary { width: 100%; justify-content: center; }
  button.ghost { flex: 1 1 auto; }
  .zw-grid { font-size: 11px; }
  .zw-cell { min-height: 96px; }
  .meter-row { grid-template-columns: 64px 1fr 42px; }
  table { min-width: 480px; }
}

@media (max-width: 430px) {
  .hero { height: 250px; }
  header.site p.sub { max-width: 340px; font-size: 14px; }
  .form-journey { margin-block: 16px 18px; }
  .form-journey span { gap: 5px; }
  .form-journey b { width: 20px; height: 20px; font-size: 9px; }
  .time-precision { gap: 4px 12px; }
  .time-precision label { font-size: 12.5px; }
  .privacy-actions { align-items: stretch; }
  .privacy-actions .ghost { width: 100%; }
  .dialog-actions { flex-direction: column-reverse; }
  .privacy-dialog form { padding: 20px 17px; }
}

/* ---------- 列印 ---------- */
@media print {
  nav.toc, .actions, .starfield, #input-panel .form-grid, #input-panel .opts, .hypo .btns, .ai-key-row { display: none !important; }
  section.panel, details.panel { break-inside: avoid; border-color: #ccc; box-shadow: none; }
  body { background: #fff; }
}

/* ===== 深入問答導流(LINE CTA) ===== */
.cta-services { display: flex; flex-direction: column; gap: 10px; margin: 18px 0; }
.cta-item { display: flex; align-items: center; gap: 12px; background: rgba(107,91,200,.06); border: 1px solid rgba(107,91,200,.18); border-radius: 12px; padding: 12px 14px; }
.cta-ic { font-size: 26px; flex-shrink: 0; }
.cta-body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.cta-body strong { color: var(--ink-strong, #3A3547); font-size: 15.5px; }
.cta-desc { font-size: 13px; color: #6b6580; }
.cta-price { flex-shrink: 0; font-weight: 700; color: #55489E; font-size: 14px; background: rgba(201,164,76,.15); border: 1px solid rgba(201,164,76,.4); padding: 4px 10px; border-radius: 999px; }
.cta-btn-wrap { text-align: center; margin-top: 22px; }
.cta-line-btn { display: inline-block; background: #06C755; color: #fff; font-size: 18px; font-weight: 700; letter-spacing: 1px; padding: 15px 38px; border-radius: 14px; text-decoration: none; box-shadow: 0 6px 18px rgba(6,199,85,.35); }
.cta-line-btn:active { transform: translateY(1px); }