/* Chemistry I (Nov 2026) changes carried into Chemistry II: practice-final band, season banner, nav badge,
   practice-final (exam) view with modes and score report, chapter-end nudge, purchase view, practice hub. */
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.nav .nav-badge{display:inline-block;margin-left:.4rem;padding:.05rem .45rem;border-radius:999px;font-size:.68rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;line-height:1.5;vertical-align:.12em;color:var(--red);background:var(--red-soft);border:1px solid color-mix(in srgb,var(--red) 35%,transparent)}
.book-line .bl-course{white-space:nowrap}
.f-hero .book-line{margin-top:0}
.f-hero .f-h1{margin-top:.8rem}
.f-hero .pro-badge{margin-top:1.1rem}
/* season banner */
.season{background:var(--red-soft);border-bottom:1px solid color-mix(in srgb,var(--red) 30%,transparent)}
.season-in{display:flex;align-items:center;gap:.5rem 1rem;min-height:44px}
.season-t{margin:0;font-size:.98rem;flex:1;min-width:0;line-height:1.4}
.season-t b{color:var(--red)}
.season-go{font-weight:700;color:var(--navy);white-space:nowrap;min-height:44px;display:inline-flex;align-items:center;gap:.3rem;text-decoration:none}
.season-x{border:0;background:none;font-size:1.5rem;line-height:1;cursor:pointer;color:var(--muted);min-width:44px;min-height:44px;margin-right:-.6rem}
body[data-view="final"] .season,body[data-view="unlock"] .season{display:none}
/* homepage practice-final band */
.pf-band{padding-block:clamp(.25rem,1.5vw,1rem) clamp(2rem,4vw,3rem)}
.pf-card{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(1.25rem,4vw,3rem);align-items:center;background:var(--surface);border:1px solid var(--line);border-left:6px solid var(--red);border-radius:22px;padding:clamp(1.25rem,3.5vw,2.25rem);box-shadow:var(--shadow)}
.pf-k{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:var(--red);margin:0}
.pf-h{font-size:clamp(1.5rem,3.4vw,2.2rem);font-weight:600;margin:.45rem 0 .7rem;max-width:30rem}
.pf-what{color:var(--muted);max-width:34rem;line-height:1.55}
.pf-facts{list-style:none;margin:.8rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.45rem}
.pf-facts li{border:1px solid var(--line);background:var(--paper);border-radius:999px;padding:.3rem .8rem;font-size:.92rem;font-weight:600;color:var(--navy)}
.pf-ctas{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.2rem}
.pf-fine{font-size:.92rem;color:var(--muted);margin-top:.75rem}
.pf-note{font-size:.82rem;color:var(--muted);margin-top:.35rem}
.pf-demo{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:1.1rem 1.2rem;display:grid;gap:.55rem}
.pf-ex{justify-self:start;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:var(--gold);background:var(--gold-soft);border:1px solid color-mix(in srgb,var(--gold) 40%,transparent);border-radius:999px;padding:.1rem .6rem}
.pf-dk{font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:var(--muted)}
.pf-dscore{font-family:var(--display);font-size:1.15rem;color:var(--muted);line-height:1}
.pf-dscore b{font-size:2.3rem;color:var(--navy);font-weight:600}
.pf-drows{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.pf-drows li{display:grid;grid-template-columns:7.6rem minmax(0,1fr);align-items:center;gap:.6rem;font-size:.92rem;line-height:1.3}
.pf-drows i{display:block;height:9px;border-radius:999px;background:linear-gradient(90deg,var(--green) var(--w),var(--line) var(--w))}
.pf-drows i.mid{background:linear-gradient(90deg,var(--gold) var(--w),var(--line) var(--w))}
.pf-drows i.low{background:linear-gradient(90deg,var(--red) var(--w),var(--line) var(--w))}
.pf-dnext{font-size:.92rem;color:var(--muted)}
.pf-dnext b{color:var(--navy)}
.pf-dnote{font-size:.8rem;color:var(--muted);font-style:italic}
@media (max-width:820px){.pf-card{grid-template-columns:minmax(0,1fr)}.pf-demo{max-width:26rem}}
@media (max-width:520px){.pf-ctas .btn{width:100%}.pf-demo{display:none}.pf-card{border-radius:18px}}
.f-tier-final{border:2px solid var(--red)}
.f-tier-final .f-tag{color:var(--red)}
.f-alt{font-weight:700;color:var(--navy);display:inline-flex;align-items:center;min-height:44px}
.f-tiers.two{grid-template-columns:repeat(2,minmax(0,1fr));max-width:56rem}
@media (max-width:900px){.f-tiers.two{grid-template-columns:minmax(0,1fr)}}
.f-qa p.faq-note{font-size:.85rem;margin-top:-.4rem}
/* chapter-end nudge */
.pf-nudge{border:1px solid var(--line);border-left:5px solid var(--red);border-radius:16px;background:var(--surface);padding:1.1rem 1.25rem;display:grid;gap:.5rem}
.pf-nudge h3{font-size:var(--s1)}
.pf-link{font-weight:700;color:var(--navy);display:inline-flex;align-items:center;min-height:44px}
/* purchase view */
.ucard{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:clamp(1.25rem,3vw,2rem);display:grid;gap:.9rem}
.plan{background:var(--surface);border:2px solid var(--navy);border-radius:var(--r);padding:1.4rem;display:grid;gap:.55rem;align-content:start;max-width:34rem}
.plan .price{font-family:var(--display);font-size:2rem;font-weight:600;color:var(--navy);line-height:1.1}
.plan-list{margin:0;padding-left:1.2rem;display:grid;gap:.25rem;color:var(--muted)}
.answer-row{display:flex;gap:.6rem;flex-wrap:wrap}
.answer-row input{flex:1 1 12rem;min-width:0;min-height:52px;border-radius:12px;border:2px solid var(--line);background:var(--paper);color:var(--ink);padding:.5rem .9rem;font:inherit}
.buy-note{font-weight:700;color:var(--red);min-height:1.5em}
/* exam view */
.exam-wrap{max-width:52rem;padding-block:2rem 3rem;display:grid;gap:1rem}
.exam-h{font-size:var(--s3);font-weight:600}
.exam-lede{font-size:1.12rem;font-weight:600;color:var(--navy);line-height:1.45;max-width:40rem}
.exam-facts{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;list-style:none;padding:0;margin:0;color:var(--navy)}
.exam-modes{border:0;padding:0;margin:.25rem 0 0;min-width:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.exam-modes legend{font-family:var(--display);font-weight:600;font-size:var(--s1);padding:0;margin-bottom:.55rem}
.exam-mode{position:relative;display:grid;gap:.2rem;align-content:start;min-height:44px;padding:.85rem 1rem .9rem 2.85rem;border:2px solid var(--line);border-radius:14px;background:var(--surface);cursor:pointer;transition:border-color .15s,background .15s}
.exam-mode input{position:absolute;left:1rem;top:1.05rem;width:1.15rem;height:1.15rem;margin:0;accent-color:var(--navy)}
.exam-mode b{font-family:var(--display);font-weight:600;font-size:1.08rem;color:var(--ink)}
.exam-mode span{color:var(--muted);font-size:.93rem;line-height:1.45}
.exam-mode:has(input:checked){border-color:var(--navy);background:var(--navy-soft)}
.exam-mode:has(input:focus-visible){outline:3px solid var(--navy);outline-offset:2px}
@media (max-width:560px){.exam-modes{grid-template-columns:minmax(0,1fr)}}
.exam-start{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}
.exam-buy{border-left:4px solid var(--gold);background:var(--gold-soft);padding:.8rem 1rem;border-radius:0 12px 12px 0;display:grid;gap:.6rem}
.exam-note{font-size:.85rem;color:var(--muted)}
.exam-bar{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem;justify-content:space-between}
.exam-modetag{font-size:.8rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.exam-clock{font-weight:700;color:var(--navy);font-variant-numeric:tabular-nums}
.exam-clock.low{color:var(--red)}
.exam-q{display:grid;gap:1rem}
.exam-q .eq-topic{font-size:.8rem;color:var(--muted);letter-spacing:.08em;text-transform:uppercase;font-weight:700}
.exam-q h3{font-family:var(--body);font-size:var(--s1);line-height:1.5;font-weight:600;letter-spacing:0}
.opts{display:grid;gap:.65rem;list-style:none;padding:0;margin:0}
.opt{width:100%;text-align:left;display:flex;gap:.85rem;align-items:center;min-height:56px;padding:.7rem 1rem;border-radius:12px;border:2px solid var(--line);background:var(--surface);cursor:pointer;color:var(--ink);transition:border-color .15s,background .15s}
.opt .key{flex:none;width:2rem;height:2rem;border-radius:50%;display:grid;place-items:center;background:var(--slate-soft);font-weight:700;font-size:.95rem}
.opt:hover:not([disabled]){border-color:var(--blue)}
.opt.picked{border-color:var(--navy);background:var(--navy-soft)}
.opt.picked .key{background:var(--navy);color:var(--on-accent)}
.opt.right{border-color:var(--green);background:var(--green-soft)}
.opt.right .key{background:var(--green);color:var(--on-accent)}
.opt.wrong{border-color:var(--red);background:var(--red-soft)}
.opt.wrong .key{background:var(--red);color:var(--on-accent)}
.opt[disabled]{cursor:default;opacity:1}
.exam-nav{display:flex;justify-content:space-between;gap:.5rem;flex-wrap:wrap}
#exam-flag.on{background:var(--gold-soft);border-color:var(--gold);color:var(--gold)}
.exam-grid-wrap summary{cursor:pointer;font-weight:700;color:var(--navy);min-height:44px;display:flex;align-items:center}
.exam-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(2.6rem,1fr));gap:.35rem;margin-top:.6rem}
.exam-grid button{border:1px solid var(--line);background:var(--surface);border-radius:8px;min-height:40px;font:inherit;font-size:.9rem;cursor:pointer;color:var(--ink)}
.exam-grid button.done{background:var(--navy-soft);border-color:var(--navy)}
.exam-grid button.flag{box-shadow:inset 0 -3px 0 var(--gold)}
.exam-grid button.cur{outline:2px solid var(--navy)}
.exam-submit{display:flex;justify-content:center}
.exam-ref{position:fixed;inset:0;z-index:40;background:rgba(30,40,40,.45);display:grid;place-items:center;padding:12px}
.exam-ref-box{background:var(--surface);border-radius:16px;max-width:min(78rem,100%);max-height:100%;overflow:auto;padding:1rem;display:grid;gap:.75rem;color:var(--ink)}
.exam-ref-head{display:flex;justify-content:space-between;align-items:center;font-family:var(--display);font-size:1.2rem;color:var(--navy)}
.exam-ref-head button{border:0;background:none;font-size:1.6rem;cursor:pointer;color:var(--muted);min-width:44px;min-height:44px}
.exam-ptbox{overflow-x:auto}
.exam-pt{width:100%;min-width:640px;height:auto;display:block;border-radius:8px}
.exam-consts{columns:2 18rem;margin:0;padding-left:1.1rem;line-height:1.8}
.exam-score{font-family:var(--display);font-size:var(--s4);color:var(--navy);line-height:1}
.exam-sub{font-size:var(--s1);margin-top:.35rem}
.exam-chs{list-style:none;padding:0;margin:0;display:grid;gap:.6rem}
.exam-chs li{display:grid;gap:.3rem}
.exam-chs .row{display:flex;justify-content:space-between;gap:1rem;font-weight:600}
.exam-chs .row span:last-child{white-space:nowrap}
.exam-tps .row{font-weight:500}
.barbg{height:10px;border-radius:999px;background:var(--line);overflow:hidden}
.barbg .bar{height:100%;background:var(--green)}
.barbg .bar.mid{background:var(--gold)}
.barbg .bar.low{background:var(--red)}
.et-n{font-variant-numeric:tabular-nums;color:var(--muted);font-weight:700}
.exam-tpwrap summary{cursor:pointer;min-height:44px;display:flex;align-items:center;gap:.4rem;font-family:var(--display);font-weight:600;color:var(--ink);list-style:none}
.exam-tpwrap summary::-webkit-details-marker{display:none}
.exam-todo{border:1px solid var(--line);border-left:5px solid var(--gold);border-radius:14px;background:var(--gold-soft);padding:1rem 1.1rem;display:grid;gap:.4rem}
.exam-todo.good{border-left-color:var(--green);background:var(--green-soft)}
.exam-todo h3{font-size:var(--s1)}
.exam-todo ol{margin:0;padding-left:1.3rem;display:grid;gap:.4rem}
.xref{color:var(--navy);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.exam-offer{border:2px solid var(--red);border-radius:16px;padding:1.1rem 1.2rem;display:grid;gap:.45rem;background:var(--surface)}
.exam-offer .eyebrow{color:var(--red)}
.exam-offer h3{font-size:var(--s2)}
.exam-review{list-style:none;padding:0;margin:0;display:grid;gap:.75rem}
.exam-review li{border:1px solid var(--line);border-radius:12px;padding:.8rem 1rem;background:var(--surface);display:grid;gap:.35rem;line-height:1.55}
.exam-review .ok{color:var(--green);font-weight:700}
.exam-review .no{color:var(--red);font-weight:700}
/* practice hub */
.hub-head{display:grid;gap:.4rem}
.hub-head .eyebrow{color:var(--navy)}
.hub-why{font-family:var(--display);font-size:var(--s1);line-height:1.4;max-width:34rem}
.hub-meta{display:flex;flex-wrap:wrap;gap:.25rem 1.1rem;font-size:.95rem;color:var(--muted)}
.hub-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.6rem}
.hub-tab{position:relative;display:grid;align-content:start;gap:.15rem;text-align:left;min-height:7rem;padding:.85rem .9rem .9rem;border:2px solid var(--line);border-radius:var(--r);background:var(--surface);color:var(--ink);cursor:pointer;transition:border-color .15s,background .15s;text-decoration:none}
.hub-tab:hover{border-color:var(--c)}
.hub-tab[aria-pressed="true"]{border-color:var(--c);background:var(--cs);box-shadow:inset 0 -4px 0 var(--c)}
.ht-ic{width:2rem;height:2rem;border-radius:50%;display:grid;place-items:center;background:var(--cs);color:var(--c);font-weight:800;font-size:1.05rem;margin-bottom:.3rem;border:1.5px solid color-mix(in srgb,var(--c) 45%,transparent)}
.hub-tab[aria-pressed="true"] .ht-ic{background:var(--c);color:var(--on-accent)}
.hub-tab b{font-family:var(--display);font-size:1.08rem;line-height:1.2;font-weight:600}
.ht-sub{font-size:.88rem;color:var(--muted);line-height:1.35}
.ht-badge{position:absolute;top:.65rem;right:.65rem;min-width:1.7rem;height:1.7rem;padding:0 .45rem;border-radius:999px;background:var(--red);color:var(--on-accent);font-size:.85rem;font-weight:800;display:grid;place-items:center}
.hub-card{display:grid;gap:1rem}
.hub-card h3{font-size:var(--s2)}
.hub-steps{margin:0;padding:0;list-style:none;display:grid;gap:.5rem;counter-reset:hs}
.hub-steps li{counter-increment:hs;display:flex;gap:.7rem;align-items:baseline;line-height:1.45}
.hub-steps li::before{content:counter(hs);flex:none;width:1.6rem;height:1.6rem;border-radius:50%;display:grid;place-items:center;background:var(--purple);color:var(--on-accent);font-size:.85rem;font-weight:800}
.done-mark{width:3.2rem;height:3.2rem;border-radius:50%;display:grid;place-items:center;background:var(--green);color:var(--on-accent);font-size:1.6rem;font-weight:800}
.hub-score{font-family:var(--display);font-size:var(--s1);margin:0}
.hq-role{font-size:.9rem;color:var(--muted)}
.route-pick{display:grid;gap:.5rem}
.route-pick .choice{min-height:52px}
.miss-list{list-style:none;margin:0;padding:0;display:grid;border-top:1px solid var(--line)}
.miss-list li{display:flex;gap:.75rem;align-items:center;padding:.55rem 0;border-bottom:1px solid var(--line)}
.miss-list .ml-t{flex:1;min-width:0;line-height:1.35}
.miss-list .ml-t small{display:block;color:var(--muted);font-size:.85rem}
.ml-due{flex:none;min-width:5.4rem;padding:.15rem .55rem;border-radius:999px;font-size:.8rem;font-weight:700;text-align:center;background:var(--slate-soft);color:var(--slate)}
.ml-due.now{background:var(--red-soft);color:var(--red)}
.ml-x{flex:none;min-width:44px;min-height:44px;border:0;border-radius:10px;background:transparent;color:var(--muted);font-size:.9rem;cursor:pointer;text-decoration:underline}
@media (max-width:820px){.hub-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.hub-tab{min-height:6rem}}
@media (max-width:520px){.hub-tab{min-height:5.6rem;padding:.7rem .75rem .75rem}.hub-tab b{font-size:1rem}.ht-sub{font-size:.82rem}}
@media (prefers-reduced-motion:reduce){.hub-tab{transition:none}}

/* exam feedback, confirm and hub route feedback: one line per part */
.exam-fb,#exam-confirm,.hq-fb{display:grid;gap:.45rem}
.exam-fb>span,#exam-confirm>span{display:block}
.exam-fb .exam-start{margin-top:.35rem}
.exam-fb:focus{outline:none}
/* keep the topic finder out of the way during the exam */
body[data-view="final"] #guide{display:none}

/* practice hub cards */
.hub-panel{margin-top:1.4rem}
.hub-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:1.4rem 1.5rem;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.hub-card>*{margin:0}
.hub-card .panel{margin:0;border:0;box-shadow:none;padding:0;background:none}
.hub-lead{margin:0 0 .9rem;color:var(--muted);max-width:46rem}
.hub-lead b{color:var(--ink)}
.hq-top{display:flex;flex-wrap:wrap;gap:.35rem 1rem;align-items:baseline}
.hq-eb{margin:0}
.hq-q h3{font-family:var(--body);font-size:1.2rem;font-weight:600;line-height:1.45;margin:0}
.hq-ask{font-weight:600;display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.hq-ask .st{font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--purple);background:var(--purple-soft);border-radius:999px;padding:.2rem .6rem}
.hq-done-route{color:var(--muted)}
.hq-done-route b{color:var(--ink)}
.nextrow{display:flex;flex-wrap:wrap;gap:.6rem 1rem;align-items:center;justify-content:space-between}
.nextrow:has(.btn:only-child){justify-content:flex-start}
.hub-done{justify-items:start}
.hub-steps{margin:0;padding-left:1.3rem;display:grid;gap:.3rem}
.hub-chapter .page-head{margin-bottom:1rem}
.hub-chapter .page-head h2{font-size:var(--s2)}
/* exam extras */
.exam-intro h1.exam-h{font-size:var(--s3)}
.exam-check{display:flex;gap:1rem;align-items:center;flex-wrap:wrap;margin-top:1rem}
.exam-report{display:grid;gap:1rem}
.exam-report>*{margin:0}
.plans{margin-top:.6rem}
.unlock{display:grid;gap:1.2rem}
.unlock .ucard{display:grid;gap:.7rem}
.unlock .ucard>*{margin:0}
.buy-note{font-size:.92rem}
.btn[disabled],.answer-row input[disabled]{opacity:.5;cursor:not-allowed}
.hub-card .panel h3{font-size:1.2rem;line-height:1.45}
