/* 《下針之前・所以然》共用樣式（2026-10-16）：所有頁面只從這裡拿，不要在頁面裡另抄一份 */
:root{--bg:#f7f8f5;--card:#fff;--ink:#333a31;--soft:#5f6759;--accent:#7c8a73;--accent-d:#5a6a52;--line:#dde3d8;--hl:#eaeee6;
 --warn:#9e4437;--warnbg:#fbf0ed;--gold:#8a6436;--goldbg:#f6ece2;--coral:#d96a4e;--coralbg:#fbeee9;
 --g1:#3f7a8c;--g2:#5a8a4a;--g3:#b7793a;--g4:#8c4f6e}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"PingFang TC","Noto Sans TC","Microsoft JhengHei",sans-serif;font-size:17px;line-height:1.85}
.wrap{max-width:760px;margin:0 auto;padding:28px 16px 60px}
h1{font-size:24px;line-height:1.4;margin:0 0 6px}
p.sub{color:var(--soft);font-size:15px;margin:0 0 20px}   /* 只給頁首副標；.g.sub（次落點徽章）不可吃到 */
h2{font-size:19px;color:var(--accent-d);margin:34px 0 12px;padding-left:11px;border-left:4px solid var(--accent)}
h3{font-size:17px;color:var(--accent-d);margin:24px 0 8px}
p{margin:0 0 14px}strong{color:var(--accent-d)}
ul,ol{padding-left:22px;margin:0 0 14px}li{margin:6px 0}
a{color:var(--accent-d)}
img{max-width:100%;height:auto}
table{border-collapse:collapse;width:100%;margin:0 0 16px;font-size:15px;line-height:1.65;display:block;overflow-x:auto}
th,td{border:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}
thead:not(:has(th:not(:empty))){display:none}
th{background:var(--hl);color:var(--accent-d);font-weight:700;white-space:nowrap}
blockquote{margin:0 0 16px;padding:12px 16px;background:var(--hl);border-radius:10px;border-left:4px solid var(--accent)}
blockquote p:last-child{margin-bottom:0}
pre{background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 14px;overflow-x:auto;font-size:14px;line-height:1.6}
code{font-family:"SFMono-Regular",Menlo,monospace}
hr{border:none;border-top:1px solid var(--line);margin:24px 0}
.lead{background:var(--hl);border-radius:12px;padding:16px 18px;margin:0 0 20px;font-size:16.5px}
.head{background:var(--accent-d);color:#fff;border-radius:14px;padding:19px 20px;margin:0 0 22px}
.head .k{font-size:12.5px;letter-spacing:.11em;opacity:.78;margin-bottom:8px}
.head .big{font-size:20px;font-weight:700;line-height:1.5;margin:0 0 9px}
.head p{margin:0;font-size:15.5px;opacity:.93;line-height:1.72}
.warn{background:var(--warnbg);border:1px solid #eccfc8;border-left:4px solid var(--warn);border-radius:10px;padding:14px 16px;margin:0 0 18px;font-size:15.5px}
.tip{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:10px;padding:14px 16px;margin:0 0 18px;font-size:15.5px}

/* 格子徽章 */
.g{display:inline-block;font-size:12.5px;font-weight:700;border-radius:999px;padding:2px 9px;color:#fff;white-space:nowrap}
.g.g1{background:var(--g1)}.g.g2{background:var(--g2)}.g.g3{background:var(--g3)}.g.g4{background:var(--g4)}.g.g0{background:#888}
.g.sub{opacity:.55}
.tag{display:inline-block;font-size:12px;border:1px solid var(--line);border-radius:999px;padding:1px 8px;color:var(--soft);background:#fff;white-space:nowrap}

/* 篩選 */
.chips{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 12px}
.chip{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:7px 13px;font-size:14.5px;font-family:inherit;color:var(--ink);cursor:pointer;min-height:40px}
.chip:hover{border-color:var(--accent)}
.chip[aria-pressed="true"]{background:var(--accent-d);border-color:var(--accent-d);color:#fff;font-weight:600}
.flabel{font-size:12.5px;color:var(--soft);letter-spacing:.08em;margin:6px 0 6px}
.count{font-size:14px;color:var(--soft);margin:4px 0 14px}

/* 肌肉卡 */
details.mc{background:var(--card);border:1px solid var(--line);border-radius:14px;margin:0 0 12px;overflow:hidden}
details.mc>summary{list-style:none;cursor:pointer;padding:14px 16px;display:flex;flex-direction:column;gap:6px}
details.mc>summary::-webkit-details-marker{display:none}
details.mc>summary .nm{font-size:19px;font-weight:700;line-height:1.4}
details.mc>summary .nm .en{font-size:14px;font-weight:400;color:var(--soft);margin-left:6px}
details.mc>summary .one{font-size:15px;color:var(--soft);line-height:1.6}
details.mc>summary .meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
details.mc[open]>summary{border-bottom:1px solid var(--line);background:var(--hl)}
.mcb{padding:6px 16px 16px}
.mcb h3{border-top:1px solid var(--line);padding-top:16px}
.mcb .fig{margin:12px 0 4px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.mcb .fig img{display:block;width:100%}

/* 共筆 */
.co{border-top:1px solid var(--line);margin:18px -16px -16px;padding:15px 16px 17px;background:var(--bg)}
.co .ch2{font-size:12.5px;letter-spacing:.09em;color:var(--accent-d);font-weight:700;margin-bottom:9px}
.note-item{background:var(--card);border:1px solid var(--line);border-radius:11px;padding:12px 14px;margin:0 0 9px;font-size:15px;line-height:1.7}
.note-item .who{font-size:13.5px;color:var(--accent-d);font-weight:700;margin-bottom:4px}
.note-item .who span{color:var(--soft);font-weight:400;font-size:12.5px;margin-left:5px}
.note-item .kd{font-size:11.5px;border-radius:999px;padding:1px 8px;margin-left:6px;font-weight:700}
.kd.diff{background:var(--goldbg);color:var(--gold)}.kd.insight{background:var(--hl);color:var(--accent-d)}
.reply{margin:9px 0 0;padding:10px 12px;background:var(--hl);border-radius:9px;font-size:14.5px;line-height:1.68}
.cobtn{border:1px dashed var(--accent);background:none;color:var(--accent-d);border-radius:10px;padding:10px 15px;font-size:15px;font-family:inherit;cursor:pointer;width:100%;font-weight:600;min-height:44px}
.coform{display:none;background:var(--card);border:1px solid var(--line);border-radius:11px;padding:14px}
.coform.show{display:block}
.coform .kinds{display:flex;gap:8px;margin:0 0 10px;flex-wrap:wrap}
.coform textarea{width:100%;min-height:92px;border:1px solid var(--line);border-radius:9px;padding:11px;font-family:inherit;font-size:15.5px;line-height:1.7;resize:vertical;color:var(--ink);background:var(--bg)}
.corow{display:flex;gap:10px;align-items:center;margin:10px 0 0;flex-wrap:wrap}
.corow label{font-size:14px;color:var(--soft);display:flex;align-items:center;gap:6px;cursor:pointer}
.corow .send{background:var(--accent-d);color:#fff;border:none;border-radius:9px;padding:9px 17px;font-size:15px;font-weight:600;font-family:inherit;cursor:pointer;min-height:40px}
.corow .send:disabled{background:var(--line);color:var(--soft);cursor:not-allowed}
.corow .cancel{background:none;border:none;color:var(--soft);font-size:14px;text-decoration:underline;cursor:pointer;font-family:inherit}
.meta-auto{font-size:12.5px;color:var(--soft);margin:8px 0 0;line-height:1.6}
.sent{background:var(--hl);border-radius:10px;padding:13px 15px;font-size:15px;line-height:1.7;margin-top:9px}

@media print{.chips,.flabel,.co,#ysyNav{display:none!important}details.mc{break-inside:avoid}}

/* 一閘四格總圖（build/partials/一閘四格圖.html，總論與示範頁共用） */
.fw{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;margin:0 0 22px}
.fw-gate{background:var(--accent-d);color:#fff;border-radius:12px;padding:12px 14px;text-align:center}
.fw-gate .k{font-size:12px;letter-spacing:.12em;opacity:.8}
.fw-gate .q{font-size:19px;font-weight:700;line-height:1.5}
.fw-exits{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0 12px}
.fw-exit{text-wrap:pretty;line-break:strict;border:1px solid var(--line);border-radius:10px;padding:9px 10px;font-size:13.5px;line-height:1.55;background:var(--bg)}
.fw-exit b{display:block;font-size:14.5px;color:var(--accent-d)}
.fw-exit.go{border-color:var(--accent);background:var(--hl)}
.fw-grid{display:grid;grid-template-columns:2.2em 1fr 1fr;gap:6px}
.fw-h{font-size:14px;font-weight:700;color:var(--accent-d);text-align:center;line-height:1.35;align-self:end}
.fw-h small{display:block;font-weight:400;font-size:11.5px;color:var(--soft)}
.fw-r{display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--accent-d);font-size:15px}
.fw-c{border-radius:10px;padding:10px 11px;color:#fff;line-height:1.5}
.fw-c b{display:block;font-size:17px}.fw-c i{display:block;font-style:normal;font-size:13px;opacity:.92}
.fw-c span{display:block;font-size:13px;margin-top:5px;background:rgba(255,255,255,.16);border-radius:7px;padding:4px 7px}
.g1c{background:var(--g1)}.g2c{background:var(--g2)}.g3c{background:var(--g3)}.g4c{background:var(--g4)}
.fw-foot{font-size:13.5px;color:var(--soft);margin-top:12px;line-height:1.7;text-align:center;text-wrap:balance;line-break:strict}
@media (max-width:520px){.fw-exits{grid-template-columns:1fr}.fw-gate .q{font-size:17px}}

/* ===== 2026-10-16 版面美化：色塊＋圖示（build/enhance.mjs 產生的結構） ===== */
:root{--t-ana:#f4f6f2;--t-acu:#eef5ec;--t-grid:#eef3f6;--t-gate:#fbf5ea;--t-tool:#f2f2f6;--t-face:#f5f0f6;
 --t-type:#f3f6f4;--t-myth:#fdf6f2;--t-refer:#edf3f8;--t-risk:#fbf0ed;--t-age:#f6f4ef}
h2{border-left:none;padding-left:0;display:flex;align-items:center;gap:10px}
h2::before{content:"";width:6px;height:22px;border-radius:3px;background:var(--accent);flex:0 0 auto}

/* 段落色塊 */
.call{display:flex;gap:11px;align-items:flex-start;border-radius:12px;padding:12px 14px;margin:0 0 14px;line-height:1.75;font-size:16px}
.call .ci{flex:0 0 auto;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:15px;background:#fff}
.call .cb{flex:1;min-width:0}
.call.star{background:var(--goldbg);border:1px solid #ecdcc4}
.call.key{background:var(--hl);border:1px solid #d9e1d3}
.call.new{background:#eef4fb;border:1px solid #d3e2f2}
.call.caution{background:#fff8ec;border:1px solid #f0dfbd}
.call.red{background:var(--warnbg);border:1px solid #eccfc8}
.call.so{background:#fff;border:1px dashed var(--line);font-size:15.5px}
.call.so .ci{background:var(--hl);color:var(--accent-d);font-weight:700}

/* 誤解 → 正解 */
li.myth{list-style:none;margin:0 0 10px -22px;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:#fff}
li.myth .mw{display:block;padding:9px 13px;background:#fbefec;color:#7d3a2f;font-size:15px}
li.myth .mw::before{content:"常見說法　";font-size:12px;font-weight:700;letter-spacing:.06em;color:var(--warn)}
li.myth .mr{display:block;padding:10px 13px;font-size:15.5px;line-height:1.75}
li.myth .mr::before{content:"✓ 我的看法　";font-size:12px;font-weight:700;letter-spacing:.06em;color:var(--accent-d)}

/* 表格 */
table{border:1px solid var(--line);border-radius:12px;background:#fff}
th,td{border:none;border-bottom:1px solid var(--line)}
tr:last-child td{border-bottom:none}
tbody tr:nth-child(even) td{background:#fafbf9}
td:first-child{font-weight:600;color:var(--accent-d);word-break:keep-all}

/* 肌肉卡清單 */
details.mc{border-radius:16px;box-shadow:0 1px 0 rgba(0,0,0,.02);transition:box-shadow .15s}
details.mc:hover{box-shadow:0 4px 14px rgba(70,80,60,.08)}
details.mc>summary{flex-direction:row;align-items:center;gap:13px;padding:12px 14px}
details.mc>summary .thumb{flex:0 0 92px;width:92px;height:62px;object-fit:cover;object-position:left center;border-radius:10px;background:var(--hl);border:1px solid var(--line)}
details.mc>summary .sm{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
details.mc>summary .mid{display:inline-block;font-size:11.5px;font-weight:700;color:var(--accent-d);background:var(--hl);border-radius:6px;padding:1px 6px;margin-right:7px;vertical-align:2px;letter-spacing:.04em}
details.mc>summary .chev{flex:0 0 auto;font-size:26px;color:var(--soft);transition:transform .15s}
details.mc[open]>summary .chev{transform:rotate(90deg)}
details.mc[open]>summary{border-bottom:1px solid var(--line);background:linear-gradient(180deg,var(--hl),#fff)}
.mcb{padding:10px 14px 16px}
.mcb .fig{margin:6px 0 14px}

/* 卡片內的段落區塊 */
.sec{border-radius:14px;padding:4px 14px 6px;margin:0 0 12px;border:1px solid transparent}
.sec>h3,.sec>summary{display:flex;align-items:center;gap:9px;margin:10px 0 8px;padding:0;border:none;font-size:16.5px;color:var(--accent-d)}
.sec .si{width:30px;height:30px;border-radius:9px;background:#fff;display:flex;align-items:center;justify-content:center;font-size:16px;flex:0 0 auto;box-shadow:0 1px 2px rgba(0,0,0,.05)}
.sec .sb>:last-child{margin-bottom:8px}
.sec table{font-size:14.5px}
.sec-ana{background:var(--t-ana)}.sec-acu{background:var(--t-acu)}.sec-grid{background:var(--t-grid);border-color:#d9e6ee}
.sec-gate{background:var(--t-gate);border-color:#efe2c8}.sec-tool{background:var(--t-tool)}.sec-face{background:var(--t-face)}
.sec-type{background:var(--t-type)}.sec-myth{background:var(--t-myth)}.sec-refer{background:var(--t-refer)}
.sec-risk{background:var(--t-risk);border-color:#eccfc8}.sec-age{background:var(--t-age)}.sec-gen{background:#fafbf9}
.sec-gate ol>li::marker{color:var(--gold);font-weight:700}
details.sec-ev{background:#fafbf9;border:1px dashed var(--line)}
details.sec-ev>summary{cursor:pointer;list-style:none}
details.sec-ev>summary::-webkit-details-marker{display:none}
details.sec-ev .more{margin-left:auto;font-size:12.5px;color:var(--soft);font-weight:400}
details.sec-ev[open] .more{display:none}
.mcb>blockquote,.sec blockquote{background:#fff;border-left:4px solid var(--accent)}
@media (max-width:520px){
 details.mc>summary .thumb{flex-basis:70px;width:70px;height:52px}
 .sec{padding:2px 11px 4px}
 li.myth{margin-left:-18px}
}

/* 表格撐滿寬度、窄螢幕可左右捲（enhance 會包一層 .tw） */
.tw{overflow-x:auto;margin:0 0 14px;border:1px solid var(--line);border-radius:12px;background:#fff}
.tw>table{display:table;width:100%;margin:0;border:none;border-radius:0}
/* 示範頁地圖 */
.mapgrid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:0 0 18px}
.mapt{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 12px;font-size:14px;line-height:1.6}
.mapt b{font-size:15.5px}.mapt .en{color:var(--soft);font-size:12.5px;margin-left:5px}
.mapt .ln{color:var(--soft);font-size:13px;margin-top:3px}
.mapt .lk{font-size:12.5px;color:var(--soft);margin-top:5px;opacity:.85}
.mapt.open{border-color:var(--g4);box-shadow:0 0 0 2px rgba(140,79,110,.12)}
@media (max-width:520px){.mapgrid{grid-template-columns:1fr}}

/* 閘門題：一題一塊 */
.sec-gate ol{list-style:none;padding:0;margin:4px 0 10px;counter-reset:gq}
.sec-gate ol>li{counter-increment:gq;position:relative;background:#fff;border:1px solid #efe2c8;border-radius:12px;padding:11px 14px 11px 46px;margin:0 0 9px}
.sec-gate ol>li::before{content:counter(gq);position:absolute;left:13px;top:12px;width:23px;height:23px;border-radius:50%;background:var(--gold);color:#fff;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center}
.sec-gate .gq{font-weight:700;color:var(--ink);line-height:1.6}
.sec-gate .ga{margin-top:6px;padding-top:6px;border-top:1px dashed #efe2c8;font-size:15.5px;line-height:1.75;color:var(--ink)}

/* 示範頁：步驟說明與提示 */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 14px}
.steps>div{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 12px;font-size:14.5px;line-height:1.6}
.steps b{display:inline-flex;width:22px;height:22px;border-radius:50%;background:var(--accent-d);color:#fff;font-size:12.5px;align-items:center;justify-content:center;margin-right:6px}
.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);background:var(--ink);color:#fff;border-radius:10px;padding:10px 16px;font-size:14.5px;z-index:10001;max-width:90vw;box-shadow:0 6px 18px rgba(0,0,0,.18)}
@media (max-width:520px){.steps{grid-template-columns:1fr}}

/* 閘門判讀器：三種出口一眼分得出來 */
.exitbar{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:4px 0 10px}
.exitbar .eb{text-align:center;font-size:13px;border-radius:999px;padding:6px 4px;background:#eceee9;color:#9aa096;font-weight:600}
.exitbar .eb.on.e1{background:#2f6f86;color:#fff}.exitbar .eb.on.e2{background:#9a7a4f;color:#fff}.exitbar .eb.on.e3{background:var(--accent-d);color:#fff}
.verdict{border-radius:16px;padding:16px 18px;margin:0 0 12px;color:#fff}
.verdict .vk{font-size:13px;letter-spacing:.06em;opacity:.9}
.verdict .vt{font-size:20px;font-weight:800;line-height:1.45;margin:4px 0 6px}
.verdict .vs{font-size:15px;opacity:.95}
.verdict .vs .g{background:rgba(255,255,255,.25)}
.verdict.v1{background:linear-gradient(135deg,#2f6f86,#4c8ea3)}
.verdict.v2{background:linear-gradient(135deg,#8a6d45,#a98b62)}
.verdict.v3{background:var(--accent-d)}
.verdict.g1v{background:linear-gradient(135deg,var(--g1),#5c95a6)}.verdict.g2v{background:linear-gradient(135deg,var(--g2),#77a566)}
.verdict.g3v{background:linear-gradient(135deg,var(--g3),#cc9459)}.verdict.g4v{background:linear-gradient(135deg,var(--g4),#a86e8c)}
.rbody{display:grid;gap:9px;margin:0 0 12px}
.rsec{background:#fff;border:1px solid var(--line);border-radius:12px;padding:11px 14px;font-size:15.5px;line-height:1.75}
.rsec .rh{font-size:13px;font-weight:700;color:var(--accent-d);letter-spacing:.04em;margin-bottom:4px}
.rsec ul{margin:0;padding-left:20px}
.rsec.rnote{background:var(--hl)}
.rsec.rflag{background:#fff8ec;border-color:#f0dfbd}

/* 表情區塊配圖（右半邊＝收縮時的表情） */
.facecrop{float:right;width:170px;margin:2px 0 10px 14px}
.facecrop .fc{width:170px;aspect-ratio:3/4;overflow:hidden;border-radius:12px;border:1px solid var(--line);background:#fff}
.facecrop .fc img{width:200%;max-width:none;height:100%;object-fit:cover;object-position:right center;display:block;transform:translateX(-50%)}
.facecrop figcaption{font-size:12.5px;color:var(--soft);text-align:center;margin-top:4px}
.sec-face .sb::after{content:"";display:block;clear:both}
@media (max-width:560px){.facecrop{float:none;margin:4px auto 12px;width:200px}.facecrop .fc{width:200px}}
/* 示範頁浮水印與出處列 */
#demoWm{position:fixed;inset:0;pointer-events:none;z-index:9998;overflow:hidden}
#demoWm i{position:absolute;font-style:normal;white-space:nowrap;font-size:13px;letter-spacing:.04em;color:#5a6a52;opacity:.08;transform:rotate(-24deg)}
#demoBar{position:fixed;left:0;right:0;bottom:0;z-index:9999;background:rgba(90,106,82,.95);color:#fff;font-size:13px;padding:7px 14px;text-align:center;font-family:"PingFang TC","Noto Sans TC",sans-serif}
body:has(#demoBar){padding-bottom:48px}

/* ===== 2026-10-24 進階版：跟入門版同一套（圖鑑、學習進度、底部切換列），外觀升一級 =====
   圖鑑格子、階段、進度條、切換列的基本樣式在 shared/progress.css（兩版共用）；這裡只放進階版自己的 */
:root{--gold2:#c9a24a;--goldl:#e8cf8a;--night:#2f3b2b}
.top.adv{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 16px;padding-top:calc(10px + env(safe-area-inset-top));background:linear-gradient(135deg,var(--night),#4a5a43);box-shadow:0 2px 12px rgba(30,40,25,.2)}
.top.adv .brand{color:#fff;font-weight:700;text-decoration:none;font-size:16px;display:flex;align-items:center;gap:8px;white-space:nowrap}
.top.adv .brand small{font-size:11.5px;font-weight:800;letter-spacing:.1em;color:var(--night);background:linear-gradient(135deg,var(--goldl),var(--gold2));border-radius:999px;padding:2px 9px}
.top.adv .lvl{color:var(--goldl);font-size:12.5px;text-decoration:none;border:1px solid rgba(232,207,138,.55);border-radius:999px;padding:4px 10px;white-space:nowrap}
.tabbar.adv a.on{color:var(--night);box-shadow:inset 0 3px 0 var(--gold2)}
.tabbar.adv{z-index:9990}
/* 浮水印列（note.js）讓到切換列上方 */
body:has(.tabbar) #ysyBar{bottom:calc(57px + env(safe-area-inset-bottom))}
body:has(.tabbar){padding-bottom:calc(104px + env(safe-area-inset-bottom))!important}
.btn{display:inline-block;border:none;background:var(--accent-d);color:#fff;border-radius:12px;padding:12px 18px;font:inherit;font-size:16px;font-weight:700;text-decoration:none;text-align:center}
.small{font-size:14px;color:var(--soft);margin:10px 0 0}

/* 首頁：我的學習進度（基礎／進階兩段） */
.prog.adv{border:1px solid #e6dcc3;background:linear-gradient(180deg,#fffdf7,#fff)}
.prog.adv h2{margin:0 0 12px}
.halves{display:grid;gap:8px;margin:0 0 12px}
.hv{display:grid;grid-template-columns:7.2em 1fr;align-items:center;gap:10px}
.hl{font-weight:700;color:var(--accent-d);font-size:15px;line-height:1.3}.hl small{display:block;font-weight:400;font-size:11.5px;color:var(--soft)}
.hv.adv .hl{color:var(--gold)}
.hb{height:10px;border-radius:5px;background:var(--hl);overflow:hidden}
.hb i{display:block;height:100%;width:0;border-radius:5px;background:var(--accent);transition:width .6s}
.hv.adv .hb i{background:linear-gradient(90deg,var(--goldl),var(--gold2))}
.pc.two{grid-template-columns:repeat(2,1fr);margin-top:8px}
.pc a.gold{background:#fbf6e8;border-color:#eadfbf}.pc a.gold b{color:var(--gold)}

/* 圖鑑 */
.dexsum{font-size:14.5px;color:var(--soft);margin:0 0 10px}.dexsum b{color:var(--ink)}
details.filt{margin:0 0 12px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px 12px}
details.filt>summary{cursor:pointer;font-size:14.5px;color:var(--accent-d);font-weight:600}
#dexView .dx{background:linear-gradient(180deg,#fff,#fcfbf7)}
.count{text-align:center}

/* 卡片頁（圖鑑的下一層） */
.homelink{display:inline-block;margin:0 0 10px;font-size:15px;text-decoration:none;color:var(--accent-d);font-weight:700}
#cardView details.mc{border-top:4px solid var(--dc)}
#cardView details.mc>summary{cursor:default}
#cardView details.mc>summary .chev{display:none}
.dir{display:inline-block;font-size:12px;border-radius:999px;padding:1px 9px;color:#fff;background:var(--dc);white-space:nowrap}
.cardnav{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;margin:14px 0 6px}
.cardnav a{border:1px solid var(--line);background:#fff;border-radius:10px;padding:10px 12px;text-decoration:none;font-size:14.5px;min-height:44px;display:flex;align-items:center}
.cardnav a:last-child{justify-content:flex-end;text-align:right}
.cardnav a.mid{justify-content:center}
.pause{display:block;text-align:center;margin:10px 0 0;font-size:14.5px;color:var(--soft)}

/* 卡片最後：我的學習進度＋自己的筆記 */
.pa{border-top:1px solid #eadfbf;margin:18px -14px 0;padding:16px 14px;background:linear-gradient(180deg,#fbf7ea,#fff)}
.pah{display:flex;align-items:center;gap:12px;margin:0 0 12px}
.pah b{display:block;font-size:17px}.pah span{font-size:13px;color:var(--gold);font-weight:700;letter-spacing:.06em}
.stg{display:flex;list-style:none;padding:0;margin:0 0 14px;gap:4px}
.stg li{flex:1;text-align:center;font-size:12.5px;color:var(--soft);padding-top:10px;position:relative;margin:0}
.stg li::before{content:"";position:absolute;top:0;left:0;right:0;height:6px;border-radius:3px;background:var(--line)}
.stg li.on{color:var(--ink);font-weight:700}
.stg li.on::before{background:var(--dc)}
.stg li.adv.on::before{background:var(--gold2)}
.stg li.gap{margin-left:10px}
.pacts{display:flex;gap:8px;flex-wrap:wrap}
.pa button{flex:1;min-width:110px;border:1px solid var(--line);background:#fff;border-radius:10px;padding:10px 8px;font-size:15px;font-family:inherit;color:var(--ink);cursor:pointer;min-height:44px}
.pa button.on{background:var(--accent-d);color:#fff;border-color:var(--accent-d)}
.pa button:disabled{cursor:default;opacity:.65}
.pa button.on:disabled{opacity:1}
.pj{margin:12px 0 0;background:#fff;border:1px dashed var(--gold2);border-radius:12px;padding:10px 12px}
.pjh{font-weight:700;color:var(--gold);font-size:15px}.pjt{margin:4px 0 0;font-size:14.5px;color:var(--soft)}
.pmaster{display:block;width:100%;margin-top:10px}
.pa .pmaster.on{background:linear-gradient(135deg,var(--goldl),var(--gold2));border-color:var(--gold2);color:var(--night);font-weight:700}
.mynote{margin-top:14px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px}
.mnh{font-weight:700;color:var(--accent-d);font-size:15px;margin:0 0 6px}.mnh span{font-weight:400;font-size:12.5px;color:var(--soft);margin-left:8px}
.mynote textarea{width:100%;border:1px solid var(--line);border-radius:9px;padding:10px;font-family:inherit;font-size:15.5px;line-height:1.7;background:var(--bg);color:var(--ink)}
.mynote{margin:0 0 16px}
.mynote .mnsave{margin-top:8px;background:var(--accent-d);color:#fff;border:none;border-radius:9px;padding:9px 17px;font-size:15px;font-weight:600;font-family:inherit;cursor:pointer;min-height:40px}
.mnok{font-size:13.5px;color:var(--accent-d);margin-left:10px}
@media print{.top.adv,.tabbar,.pa,.cardnav,.pause,.homelink{display:none!important}}
.co .ch2 span{font-weight:400;letter-spacing:0;color:var(--soft);margin-left:8px}
/* 判斷關卡（題目正本：11_判斷關卡_*.md） */
.jq{margin-top:10px}
.jqs{margin:0 0 6px;font-size:15.5px;line-height:1.75;background:var(--bg);border-radius:10px;padding:10px 12px}
.jqk{margin:0 0 8px;font-weight:700;font-size:15px}
.jqo{display:grid;gap:7px}
.pa .jqo button{text-align:left;min-width:0;border:1.5px solid var(--line);border-radius:11px;padding:10px 12px;font-size:15px;line-height:1.55}
.pa .jqo button b{color:var(--gold);margin-right:4px}
.pa .jqo button.right{border-color:#4f7a45;background:#eef4ea;opacity:1}
.pa .jqo button.wrong{border-color:var(--warn);background:var(--warnbg);opacity:1}
.jqe{margin-top:10px;border-top:1px dashed #eadfbf;padding-top:8px;font-size:15px;line-height:1.75}
.jqe p{margin:0 0 8px}.jqr{font-weight:700;color:var(--gold)}
.pa .jqa{width:auto;flex:none}
/* 目錄頁：我的筆記本（各頁筆記一覽） */
.nb{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px}
.nbi{display:block;text-decoration:none;color:var(--ink);border-top:1px dashed var(--line);padding:8px 0;font-size:14.5px;line-height:1.6}
.nbi:first-of-type{border-top:0}.nbi b{display:block;color:var(--accent-d);font-size:14px}.nbi span{color:var(--soft)}
.nbe{margin:0;font-size:14px;color:var(--soft)}
