/* After-quiz card (Oct 30 2026) */
.qb{margin:22px 0 6px;padding:20px 22px 18px;border-radius:18px;color:var(--text,#eaf3ff);background:linear-gradient(180deg,rgba(18,36,76,.96),rgba(8,16,36,.98));border:1px solid rgba(110,170,255,.5);box-shadow:0 18px 50px rgba(0,0,0,.45),0 0 34px rgba(47,125,255,.22);animation:qbIn .45s ease-out both;transition:opacity .5s}
.qb.qb-fade{opacity:0}
@keyframes qbIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.qb-eyebrow{font:700 11.5px/1 var(--font-ui,system-ui);letter-spacing:.14em;text-transform:uppercase;color:#46c8ff;margin-bottom:8px}
.qb-head h3{margin:0 0 14px;font:800 19px/1.3 var(--font-disp,var(--font-ui,system-ui))}
.qb-head h3 b,.qb-count b{color:#8fe9ff;font-variant-numeric:tabular-nums}
.qb.qb-open .qb-head h3{color:#aef5c9}
.qb-picks{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.qb-pick{display:flex;flex-direction:column;gap:6px;text-align:left;padding:16px 18px;border-radius:14px;cursor:pointer;color:inherit;background:rgba(14,28,60,.8);border:1px solid rgba(110,170,255,.45);font:inherit;transition:all .2s}
.qb-pick b{font:800 16px/1.2 var(--font-disp,var(--font-ui,system-ui));color:#fff}
.qb-pick span{font-size:13.5px;line-height:1.45;color:var(--mut,#a9bcdb)}
.qb-pick:hover{border-color:#8fe9ff;box-shadow:0 0 0 2px rgba(143,233,255,.5),0 0 26px rgba(70,220,255,.45);transform:translateY(-1px)}
.qb-pick.qb-used{opacity:.6}.qb-pick.qb-used b::after{content:"  ✓";color:#2ad17e}
.qb-link{margin-top:12px;background:none;border:0;padding:4px 0;cursor:pointer;color:#46c8ff;font:700 13.5px/1.3 var(--font-ui,system-ui);text-decoration:underline;display:inline-block;margin-right:18px}
.qb-q{padding:14px 0;border-top:1px solid rgba(110,150,230,.2)}
.qb-q:first-child{border-top:0;padding-top:4px}
.qb-scn{margin:0 0 6px;font-size:14px;line-height:1.5;color:var(--mut,#a9bcdb);font-style:italic}
.qb-qt{margin:0 0 8px;font-weight:700;font-size:15.5px;line-height:1.45;display:flex;gap:10px}
.qb-qt span{flex:none;width:24px;height:24px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:12.5px;background:rgba(47,125,255,.3);color:#cfe3ff}
.qb-right{margin:0 0 4px;color:#7ff0b4;font-weight:700;font-size:14.5px}
.qb-exp{margin:0 0 6px;font-size:14px;line-height:1.55;color:#d5e4fb}
.qb-why{background:none;border:1px solid rgba(110,170,255,.45);border-radius:999px;padding:5px 12px;cursor:pointer;color:#cfe3ff;font:700 12.5px/1 var(--font-ui,system-ui);margin-top:4px}
.qb-why:hover{border-color:#8fe9ff;color:#fff}
.qb-wrong{margin:10px 0 0;padding:0 0 0 18px;font-size:13.5px;line-height:1.55;color:#c5d6f0}
.qb-wrong li{margin:0 0 6px}.qb-wrong b{color:#ff9fae;margin-right:4px}
.qb-done{margin-top:14px;min-height:42px;padding:0 22px;border-radius:12px;cursor:pointer;font:800 14.5px/1 var(--font-disp,var(--font-ui,system-ui));color:#fff;background:linear-gradient(180deg,#2f7dff,#1455e8 60%,#0e3fb8);border:1px solid rgba(120,200,255,.7);box-shadow:0 0 18px rgba(60,150,255,.45)}
.qb-tag{display:inline-block;margin-bottom:8px;padding:3px 10px;border-radius:999px;font:700 11px/1.4 var(--font-ui,system-ui);letter-spacing:.06em;color:#ffcf6a;background:rgba(255,191,64,.15);border:1px solid rgba(255,191,64,.4)}
.qb-opts{display:grid;gap:8px;margin:6px 0 10px}
.qb-opt{text-align:left;padding:11px 14px;border-radius:12px;cursor:pointer;color:inherit;font:600 14.5px/1.35 var(--font-ui,system-ui);background:rgba(14,28,60,.8);border:1px solid rgba(110,170,255,.4)}
.qb-opt:hover:not(:disabled){border-color:#8fe9ff}
.qb-opt.ok{border-color:rgba(70,230,150,.9);background:rgba(42,209,126,.18);color:#bff7d8}
.qb-opt.no{border-color:rgba(255,107,124,.8);background:rgba(255,90,120,.12)}
.qb-break{text-align:center}
.qb-stage{position:relative;height:170px;border-radius:14px;overflow:hidden;background:radial-gradient(420px 170px at 50% 55%,rgba(47,125,255,.22),rgba(5,11,24,.0) 70%)}
.qb-stage canvas{display:block;width:100%!important;height:100%!important}
.qb-stage.qb-static{background:radial-gradient(240px 120px at 50% 55%,rgba(70,200,255,.35),rgba(5,11,24,0) 70%)}
.qb-cue{position:absolute;left:0;right:0;bottom:10px;font:700 13px/1 var(--font-ui,system-ui);letter-spacing:.12em;text-transform:uppercase;color:#8fe9ff}
.qb-break h4{margin:12px 0 6px;font:800 19px/1.3 var(--font-disp,var(--font-ui,system-ui))}
.qb-break p{margin:0 0 6px;font-size:14.5px;line-height:1.55;color:#d5e4fb}
.qb-count{margin-top:8px!important;font:700 15px/1.3 var(--font-ui,system-ui)!important}
@media (prefers-reduced-motion:reduce){.qb{animation:none}}
@media (max-width:560px){.qb{padding:16px}.qb-stage{height:140px}}
/* Activities (Oct 30 2026): flash cards, sort it, extra reading */
.qb-flash{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.qb-fc{position:relative;min-height:118px;padding:14px;border-radius:14px;cursor:pointer;text-align:left;color:inherit;font:inherit;background:rgba(14,28,60,.85);border:1px solid rgba(110,170,255,.45);transition:all .25s}
.qb-fc:hover{border-color:#8fe9ff;box-shadow:0 0 18px rgba(70,220,255,.35)}
.qb-fc-front,.qb-fc-back{display:flex;flex-direction:column;gap:8px;font-size:14.5px;line-height:1.45;transition:opacity .25s}
.qb-fc-front span{font-weight:700;color:#fff}
.qb-fc-front i{font-style:normal;font-size:12px;color:#7dd8ff;margin-top:auto}
.qb-fc-front img{max-width:100%;max-height:90px;object-fit:contain;align-self:center}
.qb-fc-back{position:absolute;inset:14px;opacity:0;color:#bff7d8}
.qb-fc.on{border-color:rgba(70,230,150,.8);background:rgba(16,48,40,.75)}
.qb-fc.on .qb-fc-front{opacity:0}.qb-fc.on .qb-fc-back{opacity:1}
.qb-sort{display:grid;grid-template-columns:1fr;gap:6px;padding:10px 0;border-top:1px solid rgba(110,150,230,.2)}
.qb-sort-t{font-weight:700;font-size:14.5px}
.qb-sort-b{display:flex;flex-wrap:wrap;gap:6px}
.qb-bin{padding:7px 12px;border-radius:10px;cursor:pointer;color:inherit;font:600 13.5px/1.2 var(--font-ui,system-ui);background:rgba(14,28,60,.8);border:1px solid rgba(110,170,255,.4)}
.qb-bin.ok{border-color:rgba(70,230,150,.9);background:rgba(42,209,126,.18);color:#bff7d8}
.qb-bin.no{border-color:rgba(255,107,124,.8);background:rgba(255,90,120,.12)}
.qb-sort-f{font-size:13.5px;color:#d5e4fb;line-height:1.45}
.qb-x h4{margin:6px 0 6px;font:800 17px/1.3 var(--font-disp,var(--font-ui,system-ui))}
.qb-x p{margin:0 0 10px;font-size:15px;line-height:1.6;color:#e2ecfb}
.qb-xnav{display:flex;align-items:center;justify-content:space-between;gap:10px}.qb-xnav .qb-done{margin-top:0}
.qb-xnote{margin:8px 0 0!important;font-size:13px!important;color:#ffcf6a!important}
