/* 知識報 文章頁（/qa/zhishibao/*）。色票、字體、日夜（html[data-theme]）沿用 style.css／qa.css。 */
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.zb-wrap{--zb-hi:#b8326a;--zb-flash:#f7d6e4;--zb-card:#fbf3fa;--zb-edge:#e4cfe6;--zb-qbg:#fdf0f5;--zb-qline:#e8749a;--zb-mbg:#fff6e3;--zb-medge:#d9b98a;
  width:100%;max-width:752px;margin:0 auto;padding:8px 16px 72px;flex:1;box-sizing:border-box;overflow-wrap:anywhere}
[data-theme="night"] .zb-wrap{--zb-hi:#ff8fb8;--zb-flash:#4a2a40;--zb-card:#2a1f36;--zb-edge:#4a3a5c;--zb-qbg:#2b1d2c;--zb-mbg:#2e2618;--zb-medge:#7a6440}
.zb-back-top{margin:6px 0 18px;font-size:14px}
.zb-back-top a,.zb-back a{color:var(--pink);text-decoration:none;font-weight:700}
.zb-back-top a:hover,.zb-back a:hover{text-decoration:underline}
.zb-head h1{margin:0 0 10px;font:900 clamp(26px,5.4vw,36px)/1.35 var(--serif);letter-spacing:.02em}
.zb-sub{margin:0 0 14px;font:500 18px/1.6 var(--sans);color:var(--ink)}
.zb-meta{margin:0;font:700 14px/1.7 var(--sans);color:var(--zb-hi)}
.zb-src{margin:2px 0 0;font:400 14px/1.7 var(--sans);color:var(--muted)}
.zb-note{margin:18px 0 0}
.zb-head{padding-bottom:18px;border-bottom:2px dashed var(--zb-edge)}
.zb-body{margin-top:24px;font:400 16px/1.8 var(--sans);color:var(--ink)}
.zb-body h2{margin:34px 0 10px;font:900 24px/1.5 var(--serif);letter-spacing:.02em}
.zb-body h3{margin:26px 0 8px;font:900 19px/1.6 var(--serif)}
.zb-body p{margin:0 0 14px}
.zb-body ul,.zb-body ol{margin:0 0 14px;padding-left:1.5em}
.zb-body li{margin:2px 0}
.zb-body hr{border:0;border-top:2px dashed var(--zb-edge);margin:30px 0}
.zb-body a{color:var(--pink)}
.zb-body strong{color:var(--zb-hi);font-weight:900}
.zb-body a.zb-ref{text-decoration:none;border-bottom:1.5px dotted var(--zb-hi);padding:4px 0}
.zb-body a.zb-ref:hover{background:var(--zb-flash)}
.zb-body code{font:500 .9em/1.6 ui-monospace,Menlo,Consolas,monospace;padding:1px 5px;border-radius:5px;background:var(--zb-card);border:1px solid var(--zb-edge)}
/* 延伸閱讀小卡 */
.zb-refs{margin:14px 0 18px;padding:10px 14px;background:var(--zb-card);border:1.5px solid var(--zb-edge);border-radius:12px;font-size:15px;line-height:1.7}
.zb-refs .zb-refs-t{margin:0 0 4px;font-weight:900;color:var(--zb-hi)}
.zb-refs ul{list-style:none;margin:0;padding:0}
.zb-refs li{margin:4px 0;padding:2px 6px;border-radius:6px;scroll-margin-top:90px}
.zb-refs li.zb-flash{animation:zbflash 1s ease-out}
@keyframes zbflash{0%,70%{background:var(--zb-flash)}100%{background:transparent}}
/* 表格 */
.zb-table{margin:14px 0 18px;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.zb-table table{border-collapse:collapse;min-width:560px;width:100%;font-size:15px;line-height:1.7}
.zb-table th,.zb-table td{border:1px solid var(--zb-edge);padding:8px 10px;text-align:left;vertical-align:top}
.zb-table th{background:var(--zb-card);white-space:nowrap}
[data-theme="night"] .zb-table th,[data-theme="night"] .zb-table td{border-color:var(--zb-edge)}
/* 引用框 */
.zb-body blockquote,.zb-note{margin:14px 0 18px;padding:10px 16px;background:var(--zb-qbg);border-left:4px solid var(--zb-qline);border-radius:0 10px 10px 0}
.zb-note{font-size:15px;line-height:1.75;color:var(--ink)}
.zb-note strong{color:var(--zb-hi)}
.zb-body blockquote p:last-child,.zb-note p:last-child{margin-bottom:0}
/* 作者經驗框（標籤用 ::before，不進 textContent） */
.zb-mine{position:relative;margin:44px 0 24px;padding:30px 16px 6px;background:var(--zb-mbg);border:1.5px dashed var(--zb-medge);border-radius:14px}
.zb-mine::before{content:"作者經驗，不是官方範例";position:absolute;left:14px;top:-13px;padding:2px 10px;background:#ffcf6b;color:#2a1e33;font:900 13px/1.7 var(--sans);border-radius:6px;letter-spacing:.04em}
.zb-mine>h2{margin-top:0}
.zb-mine blockquote{background:transparent;border-left-color:var(--zb-medge)}
/* 上下期 */
.zb-nav{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:40px 0 16px}
.zb-nav:has(.zb-card:only-child){grid-template-columns:1fr}
.zb-card{display:block;padding:12px 14px;background:var(--zb-card);border:1.5px solid var(--zb-edge);border-radius:12px;color:var(--ink);text-decoration:none;font:700 15px/1.6 var(--sans)}
.zb-card.next{text-align:right;grid-column:2}
.zb-nav:has(.zb-card:only-child) .zb-card.next{grid-column:1}
.zb-card:hover{border-color:var(--zb-qline)}
.zb-back{margin:0;text-align:center}
@media (max-width:420px){.qa-top .crumbs{gap:.45em}}
@media (max-width:620px){
  .zb-nav{grid-template-columns:1fr}.zb-card.next{grid-column:1}
  .zb-body h2{font-size:21px}
}
