/* custom.css——只放 theme.css（舊站生產 CSS，位元組相同不重編譯）缺的東西。
   規則：能用 theme.css 既有 utility 就用；這裡的每一條都是 check.mjs §7-7 掃出的缺項或行為層規則。 */

/* ── 三類切換（08-11 Dean 裁決互斥制：關鍵知識/選擇題/申論題只看一類，不疊加）：
   顯隱純 CSS，HTML 永遠全量輸出（收費不擋路）；儲存鍵 llm.view（舊 llm.depth 累計語意作廢） ── */
body[data-depth="1"] [data-layer="2"],
body[data-depth="1"] [data-layer="3"],
body[data-depth="2"] [data-layer="1"],
body[data-depth="2"] [data-layer="3"],
body[data-depth="3"] [data-layer="1"],
body[data-depth="3"] [data-layer="2"] { display: none; }

/* ── 卡片鐵則：<a> 包標題＋::after 鋪滿整卡（禁舊站 absolute span 蓋層） ── */
.card-link::after { content: ""; position: absolute; inset: 0; }

/* ── wip 提示膠囊出現態（site.js 切 class） ── */
#wip-toast.toast-show {
  opacity: 1;
  --tw-translate-y: 0px;
  translate: var(--tw-translate-x) var(--tw-translate-y);
  pointer-events: auto;
}

/* ── 遮答案（研讀模式預設不遮）：答案列＋解析模糊、命中選項高亮中和 ── */
.masked .qz-ans, .masked .qz-why { filter: blur(5px); user-select: none; cursor: pointer; }
.masked .qz-hit { border-color: var(--color-zinc-100, #f4f4f5); background: #fff; cursor: pointer; }
html.dark .masked .qz-hit { border-color: rgb(63 63 70 / 0.4); background: #27272a; } /* 深色遮答案：正解卡不露白（zinc-700/40＋zinc-800） */
.masked .qz-hit .hitmark { visibility: hidden; }

/* ── theme.css 缺項補齊（Tailwind 同義實作；check §7-7 掃出的全部缺項） ── */
.leading-\[1\.35\] { line-height: 1.35; }
.whitespace-pre-line { white-space: pre-line; }
.align-top { vertical-align: top; }
.leading-6 { line-height: 1.5rem; }
.leading-7 { line-height: 1.75rem; }
.leading-\[28px\] { line-height: 28px; }
.text-\[13px\] { font-size: 13px; }
.text-\[15px\] { font-size: 15px; }
.list-decimal { list-style-type: decimal; }
.list-disc { list-style-type: disc; }
.mt-24 { margin-top: 6rem; }
.my-6 { margin-top: 1.5rem; margin-bottom: 1.5rem; }
.my-10 { margin-top: 2.5rem; margin-bottom: 2.5rem; }
.pl-5 { padding-left: 1.25rem; }
.rounded-r-xl { border-top-right-radius: 0.75rem; border-bottom-right-radius: 0.75rem; }
.border-dashed { border-style: dashed; }
.border-amber-400 { border-color: #fbbf24; }
.border-red-400 { border-color: #f87171; }
.bg-red-50\/40 { background-color: rgb(254 242 242 / 0.4); }
.bg-teal-300 { background-color: #5eead4; }
.space-y-5 > :not(:last-child) { margin-bottom: 1.25rem; }
.space-y-6 > :not(:last-child) { margin-bottom: 1.5rem; }
.bg-zinc-50\/90 { background-color: rgb(250 250 250 / 0.9); }
.ring-teal-100 { --tw-ring-color: #ccfbf1; }
.hover\:text-zinc-500:hover { color: #71717a; }
.first\:mt-0:first-child { margin-top: 0; }
.first\:mt-1:first-child { margin-top: 0.25rem; }
.first\:mt-3:first-child { margin-top: 0.75rem; }
.first\:pt-0:first-child { padding-top: 0; }
.first\:border-t-0:first-child { border-top-width: 0; }
.translate-y-2 { --tw-translate-y: 0.5rem; translate: var(--tw-translate-x) var(--tw-translate-y); }
@media (min-width: 640px) {
  .sm\:mt-24 { margin-top: 6rem; }
  .sm\:p-6 { padding: 1.5rem; }
}
/* ── 首頁側欄摺疊（<details>＝零 JS 復刻舊站手風琴；chevron 展開轉 90°） ── */
summary { cursor: pointer; list-style: none; }
summary::-webkit-details-marker { display: none; }
details[open] > summary [data-chev] { transform: rotate(90deg); }

/* ── 痛點卡：尊重 prefers-reduced-motion（關平滑捲動與卡片動效） ── */
@media (prefers-reduced-motion: reduce) {
  .scroll-smooth { scroll-behavior: auto !important; }
  .snap-x .transition, .snap-x .duration-500 { transition: none !important; }
}

/* ── 三欄閱讀版面（08-10 左樹＋右欄）：theme.css 缺項補齊 ── */
.max-h-\[calc\(100vh-5rem\)\] { max-height: calc(100vh - 5rem); }
.pl-2\.5 { padding-left: 0.625rem; }
.rounded-r-md { border-top-right-radius: 0.375rem; border-bottom-right-radius: 0.375rem; }
.bg-zinc-400 { background-color: #a1a1aa; }
.bg-red-400 { background-color: #f87171; }
.my-8 { margin-top: 2rem; margin-bottom: 2rem; }
.w-48 { width: 12rem; } /* 考點頁右欄（08-11 容器收斂 1056px 後保主文 560px） */

/* 錨點跳轉（右欄目錄/章內跳點/條文附錄）不被 sticky 厚度列壓住 */
section[data-kind], .scroll-anchor { scroll-margin-top: 4.5rem; }

/* ── 懸浮樹（考點頁）：<lg 抽屜卡＋就地展開、lg+ 40px 圓鈕＋浮動面板（beta 返回鈕同位） ── */
.treepop-btn { display: flex; width: 100%; cursor: pointer; }
@media (max-width: 1023.98px) {
  .treepop-btn { align-items: center; border-radius: .5rem; border: 1px solid #f4f4f5; background: #fff;
    padding: .625rem .75rem; font-size: .875rem; font-weight: 500; color: #3f3f46; }
  html.dark .treepop-btn { border-color: rgb(63 63 70/.4); background: rgb(39 39 42/.5); color: #d4d4d8; }
  .treepop-panel { margin-top: .5rem; max-height: 60vh; overflow-y: auto; border-radius: .5rem;
    border: 1px solid #f4f4f5; background: #fff; padding: .5rem .75rem 1rem; }
  html.dark .treepop-panel { border-color: rgb(63 63 70/.4); background: rgb(39 39 42/.5); }
  /* 樹列觸控加墊：treeHtml 桌機列高 30px，行動內補到 ≥40px */
  .treepop-panel a, .treepop-panel summary { padding-top: .625rem; padding-bottom: .625rem; }
}
@media (min-width: 1024px) {
  .treepop-btn { position: absolute; top: 0; left: -4rem; height: 2.5rem; width: 2.5rem;
    align-items: center; justify-content: center; border-radius: 9999px; background: #fff;
    box-shadow: 0 4px 6px -1px rgb(0 0 0/.1), 0 2px 4px -2px rgb(0 0 0/.1), 0 0 0 1px rgb(24 24 27/.05); }
  html.dark .treepop-btn { background: #27272a; box-shadow: none; border: 1px solid rgb(63 63 70/.5); }
  html.dark .treepop-btn:hover { border-color: #3f3f46; }
  details[open] > .treepop-btn { box-shadow: 0 4px 6px -1px rgb(0 0 0/.1), 0 2px 4px -2px rgb(0 0 0/.1), 0 0 0 1px rgb(20 184 166/.4); }
  .treepop-panel { position: absolute; top: 3rem; left: -4rem; z-index: 50; width: 20rem;
    max-height: min(70vh, 34rem); overflow-y: auto; overscroll-behavior: contain; border-radius: 1rem;
    background: #fff; padding: 1rem 1.25rem 1.25rem;
    box-shadow: 0 10px 15px -3px rgb(0 0 0/.1), 0 4px 6px -4px rgb(0 0 0/.1), 0 0 0 1px rgb(24 24 27/.05); }
  html.dark .treepop-panel { background: #18181b; box-shadow: 0 0 0 1px rgb(255 255 255/.1); }
}
@media (min-width: 1280px) {
  .treepop-btn { top: 0; left: -6rem; }   /* 錨點改主欄後 top:0＝麵包屑頂線（beta 對齊） */
  .treepop-panel { top: 2.75rem; left: -6rem; }
}

/* ── 條文浮窗（lawPop）：桌機錨定卡、<640px 底部卡；backdrop＝觸控形態限定顯示（JS 控 hidden） ── */
.lawpop { position: fixed; z-index: 50; width: min(26rem, calc(100vw - 2rem)); max-height: 60vh; overflow-y: auto;
  overscroll-behavior: contain; border-radius: 1rem; background: #fff; padding: 1rem 1.25rem 1.25rem;
  box-shadow: 0 10px 15px -3px rgb(0 0 0/.1), 0 4px 6px -4px rgb(0 0 0/.1), 0 0 0 1px rgb(24 24 27/.05); }
html.dark .lawpop { background: #18181b; box-shadow: 0 0 0 1px rgb(255 255 255/.1); }
@media (prefers-reduced-motion: no-preference) { .lawpop { transition: opacity .15s; } }
.lawpop-backdrop { position: fixed; inset: 0; z-index: 40; background: rgb(24 24 27/.2); }
html.dark .lawpop-backdrop { background: rgb(0 0 0/.5); }
@media (max-width: 639.98px) {
  .lawpop { left: 0 !important; right: 0; bottom: 0; top: auto !important; width: 100%; max-height: 70vh;
    border-radius: 1rem 1rem 0 0; padding-bottom: max(1.25rem, env(safe-area-inset-bottom)); }
}
.lawpop-x { position: absolute; right: .5rem; top: .5rem; display: flex; height: 2.5rem; width: 2.5rem;
  align-items: center; justify-content: center; border-radius: 9999px; color: #a1a1aa; }
.lawpop-x:hover { background: #f4f4f5; color: #52525b; }
html.dark .lawpop-x { color: #71717a; }
html.dark .lawpop-x:hover { background: #27272a; color: #d4d4d8; }
@media (prefers-reduced-motion: no-preference) { .lawpop-x { transition: color .15s, background-color .15s; } }

/* ── 右欄捲動高亮（site.js 掛單類；亮暗一次寫死——JS 動態塞亮色 utility 無法配 dark:，第 11 閘精神） ── */
[data-spy] .spy-on { border-color: #14b8a6; color: #0d9488; font-weight: 500; }
html.dark [data-spy] .spy-on { border-color: #2dd4bf; color: #2dd4bf; }

/* ── 考點頁 beta 化缺項（08-11 §7-7 實掃）：三類切換列/浮窗模板/條文卡分隔線 ── */
html.dark .dark\:bg-zinc-900\/90 { background-color: rgb(24 24 27/.9); }
html.dark .dark\:bg-zinc-900\/50 { background-color: rgb(24 24 27/.5); }
html.dark .dark\:hover\:text-zinc-100:hover { color: #f4f4f5; }
.pr-10 { padding-right: 2.5rem; }
.border-zinc-200\/70 { border-color: rgb(228 228 231/.7); }

/* 標記用 class（樣式在別處掛，只為選取器存在） */
.qz { display: block; }
.depthbar { display: block; }
/* 三類切換（08-11 二修：beta 快速跳轉式文字列——teal 連結感、active 加粗） */
.seg-link { color: #71717a; font-weight: 500; padding: 2px 2px; transition: color .15s; cursor: pointer; }
.seg-link:hover { color: #0d9488; }
html.dark .seg-link { color: #a1a1aa; }
html.dark .seg-link:hover { color: #2dd4bf; }
.seg-link.seg-on { color: #0d9488; font-weight: 600; }
html.dark .seg-link.seg-on { color: #2dd4bf; }
@media (min-width: 768px) { .md\:-ml-6 { margin-left: -1.5rem; } } /* 篇區塊左線外移，內容對齊 H1 */

/* ── /articles/ 知識庫文章列表（08-11 皮先行）：theme.css 缺項＋分類 tab ── */
.w-2\/3 { width: 66.666667%; }   /* 骨架卡文字條 */
.w-4\/5 { width: 80%; }
/* 分類 tab：盒型逐項照抄 /exams/ B 面板 .exb-sub（exams-b.mjs——字 12px＋上下 4px＋邊 1px＝同高），
   亮暗兩態同源；0 篇期為非互動 span，文章上線改 <a> 樣式不動 */
.art-tab { display: inline-flex; align-items: center; border: 1px solid #e4e4e7; border-radius: 9999px;
  padding: 4px 12px; font-size: 12px; color: #52525b; white-space: nowrap; }
.art-tab i { font-style: normal; font-size: 11px; color: #a1a1aa; margin-left: 5px; }
.art-tab[aria-current="page"] { background: #f0fdfa; border-color: #99f6e4; color: #0f766e; font-weight: 600; }
html.dark .art-tab { border-color: rgb(63 63 70 / 0.6); color: #a1a1aa; }
html.dark .art-tab i { color: #71717a; }
html.dark .art-tab[aria-current="page"] { background: rgb(45 212 191 / 0.1); border-color: rgb(45 212 191 / 0.35); color: #5eead4; }
