/* 自测中心（夜金改版 R3-B，build/gen_quiz.py 生成，不要手改）：组件与令牌来自 assets/ui.css，这里只写版式，不写死颜色 */
.qz{padding-top:36px;padding-bottom:var(--sp-10)}
/* 页脚内容块与正文同宽同中线（R4，assets/ui.css 读 --foot-w） */
:root{--foot-w:820px}
.qz-main{max-width:820px;margin:0 auto}
.qz .ui-crumbs{margin:0 0 22px}
.qz-hero h1{margin:14px 0 0;color:var(--text);font:var(--fw-display) clamp(30px,1.4vw + 22px,40px)/1.25 var(--font-display);letter-spacing:var(--ls-display);text-wrap:balance}
.qz-hero .ui-lede{margin-top:12px}
.qz-back{display:inline-flex;color:var(--sub);font-size:13.5px;text-decoration:none;transition:color var(--dur-1)}
.qz-back:hover{color:var(--text)}
.qz-back+.qz-hero h1{margin-top:12px}
.qz .ui-note{margin-top:24px}
.qz-grp{margin-top:40px}
.qz-grp-h{display:flex;align-items:baseline;gap:10px;margin:0 0 14px;color:var(--text);font:var(--fw-display) 22px/1.3 var(--font-display)}
.qz-grp-h em{color:var(--mute);font:500 13px/1 var(--font);font-style:normal;font-variant-numeric:tabular-nums}
.qz-sets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.qz-set{display:flex;flex-direction:column;min-width:0;padding:20px 22px;border:1px solid var(--line);border-radius:var(--r);background:linear-gradient(180deg,var(--card),var(--card2));box-shadow:var(--shadow);color:var(--text);text-decoration:none;transition:border-color var(--dur-2)}
.qz-set:hover{border-color:var(--accent-line)}
.qz-set-top{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--mute);font-size:12.5px}
.qz-set b{margin-top:10px;font:var(--fw-display) 18px/1.4 var(--font-display);color:var(--text)}
.qz-set p{flex:1;margin:8px 0 0;color:var(--sub);font-size:14px;line-height:1.75}
.qz-set .ui-link{margin-top:14px}
/* 进度条：顶栏下面粘住，答题时一直看得到 */
.q-bar{position:sticky;top:var(--nav-h);z-index:6;display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:24px 0 20px;padding:12px 0;border-bottom:1px solid var(--line);background:var(--bg)}
.q-bar .ui-progress{flex:1 1 160px;min-width:120px}
.q-bar .ui-progress i{width:0;transition:width var(--dur-2) var(--ease)}
.q-bar-txt{color:var(--sub);font-size:13px;font-weight:500;font-variant-numeric:tabular-nums;white-space:nowrap}
.q-bar-txt b{color:var(--text);font-weight:600}
.q-list{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.q-item{padding:22px 24px;border:1px solid var(--line);border-radius:var(--r);background:linear-gradient(180deg,var(--card),var(--card2));box-shadow:var(--shadow)}
.q-num{color:var(--mute);font-size:12.5px;font-weight:600;font-variant-numeric:tabular-nums}
.q-stem{margin:8px 0 16px;color:var(--text);font-size:16.5px;font-weight:600;line-height:1.7}
.q-opts{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.q-opt{position:relative;display:flex;align-items:flex-start;gap:12px;width:100%;padding:12px 16px;border:1px solid var(--line2);border-radius:var(--r-md);background:var(--card);color:var(--text);font:inherit;font-size:15px;line-height:1.7;text-align:left;cursor:pointer;transition:border-color var(--dur-1),background var(--dur-1)}
.q-opt:hover:not([disabled]){border-color:var(--accent-line);background:var(--accent-soft)}
.q-opt[disabled]{cursor:default}
.q-key{display:grid;place-items:center;flex:none;width:24px;height:24px;margin-top:1px;border:1px solid var(--line2);border-radius:50%;background:var(--raise);color:var(--sub);font-size:12px;font-weight:600;line-height:1}
.q-opt.is-right{border-color:var(--ok-line);background:var(--ok-soft)}
.q-opt.is-right .q-key{border-color:transparent;background:var(--ok);color:var(--bg)}
.q-opt.is-wrong{border-color:var(--err-line);background:var(--err-soft)}
.q-opt.is-wrong .q-key{border-color:transparent;background:var(--err);color:var(--bg)}
/* 不只靠颜色：答完在选项右边写「正确答案」「你选的」 */
.q-opt.is-right::after,.q-opt.is-wrong::after{flex:none;align-self:center;margin-left:auto;padding-left:8px;font-size:12.5px;font-weight:600;white-space:nowrap}
.q-opt.is-right::after{content:"正确答案";color:var(--ok)}
.q-opt.is-wrong::after{content:"你选的";color:var(--err)}
.q-why{margin:14px 0 0}
.q-why>summary{display:inline-flex;align-items:center;gap:6px;color:var(--accent);font-size:14px;font-weight:600;list-style:none;cursor:pointer}
.q-why>summary::-webkit-details-marker{display:none}
.q-why>summary .ui-ic{width:15px;height:15px;transition:transform var(--dur-2) var(--ease)}
.q-why[open]>summary .ui-ic{transform:rotate(90deg)}
.q-why-body{margin-top:12px;padding:14px 18px;border-left:3px solid var(--fill);border-radius:0 var(--r-md) var(--r-md) 0;background:var(--bg2);color:var(--prose);font-size:15px;line-height:1.85}
.q-why-body p{margin:0 0 8px}
.q-why-body p:last-child{margin:0}
.qz mark{padding:0 .15em;border-radius:3px;background:var(--accent-soft2);color:var(--text)}
.q-why-body b,.q-why-body strong{color:var(--text);font-weight:600}
.q-see{margin-top:10px;color:var(--sub);font-size:13.5px}
.q-see a{color:var(--accent);font-weight:600}
.q-result{margin-top:24px}
.q-score{color:var(--accent-big);font:var(--fw-display) 44px/1 var(--font-display);font-variant-numeric:tabular-nums}
.q-score span{color:var(--sub);font:500 16px/1 var(--font)}
.q-verdict{margin:12px 0 0;color:var(--text);font-size:15px;line-height:1.85}
.q-weak{margin-top:18px}
.q-weak h4{margin:0 0 8px;color:var(--sub);font-size:13px;font-weight:600}
.q-weak-list{display:grid;gap:8px}
.q-weak-list a{display:flex;justify-content:space-between;gap:12px;padding:12px 16px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--card);color:var(--text);font-size:14.5px;font-weight:600;text-decoration:none}
.q-weak-list a:hover{border-color:var(--accent-line);color:var(--accent)}
.q-weak-list em{flex:none;color:var(--err);font-style:normal;font-weight:600;font-variant-numeric:tabular-nums}
.qz-foot{margin:32px 0 0;padding-top:18px;border-top:1px solid var(--line);color:var(--mute);font-size:13px;line-height:1.85}
@media (max-width:720px){
  .qz{padding-top:20px}
  .qz-sets{grid-template-columns:1fr}
  .q-item{padding:18px 16px}
  .q-opt{padding:11px 12px;font-size:14.5px}
  .q-opt.is-right::after,.q-opt.is-wrong::after{font-size:12px}
  .q-score{font-size:38px}
}