:root { --bg:#F6FAFB; --surface:#fff; --ink:#0E1B2A; --ink-2:#43556A; --ink-3:#6A7B8E; --line:#DAE4EA; --cyan:#3AD5F8; --cyan-ink:#08759A; --tint:#E6F7FC; --yellow:#FFC93C; --good:#14774A; --good-bg:#E3F4EC; --amber:#8A5A00; --amber-bg:#FFF1D2; --bad:#A8322F; --bad-bg:#FBE7E6; --font:"Montserrat","Segoe UI",system-ui,sans-serif; }
* { box-sizing:border-box; }
html { height:100%; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:var(--font); font-size:16px; line-height:1.55; -webkit-font-smoothing:antialiased; }
a { color:var(--cyan-ink); }
h1,h2,h3 { margin:0; line-height:1.2; font-weight:700; }
h1 { font-size:clamp(24px,5vw,34px); letter-spacing:-.01em; }
h2 { font-size:20px; } h3 { font-size:16px; }
p { margin:0; }
.muted { color:var(--ink-3); font-size:14px; }
/* ---- site chrome, copied from megalecture.com's native header (ml-chrome.css) ---- */
.ml-header { --hink:#0E0E0E; --hcyan:#35C8EA; --hcyan-tint:#E6F7FC; --hcyan-text:#0B6A85; --hyellow:#FFD12E; --hborder:#E6E4DC; --hborder-strong:#D2CFC4; position:sticky; top:env(safe-area-inset-top,0px); z-index:100; background:#fff; border-top:3px solid var(--hcyan); border-bottom:1px solid var(--hborder); }
.ml-header__in { max-width:1240px; margin:0 auto; padding:10px 20px; display:flex; align-items:center; gap:12px; }
.ml-logo { display:inline-flex; line-height:0; } .ml-logo img { width:128px; height:auto; }
.ml-nav { display:flex; align-items:center; gap:2px; margin-left:20px; }
.ml-nav__link { display:inline-flex; align-items:center; padding:10px 11px; border-radius:8px; font-size:14px; font-weight:700; color:#2b2b2b; text-decoration:none; line-height:1.2; }
.ml-nav__link:hover, .ml-nav__link:focus-visible { color:#08313D; background:var(--hcyan-tint); }
.ml-nav__link.on { color:var(--hcyan-text); background:var(--hcyan-tint); }
.ml-acts { margin-left:auto; display:flex; align-items:center; gap:8px; }
.ml-iconbtn { display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; border-radius:50%; color:#0E0E0E; background:none; border:0; padding:0; cursor:pointer; font:inherit; }
.ml-iconbtn:hover { color:var(--hcyan-text); }
.ml-iconbtn--wa { color:#128C7E; border:1px solid var(--hborder-strong); }
.ml-iconbtn--wa:hover { color:#fff; background:#25D366; border-color:#25D366; }
.ml-acct.in { background:#0E0E0E; color:#fff; font-weight:700; font-size:14px; }
.ml-acct.in:hover { background:var(--hcyan-text); color:#fff; }
.ml-btn { display:inline-flex; align-items:center; justify-content:center; padding:10px 18px; border-radius:8px; border:1px solid transparent; font-family:var(--font); font-weight:700; font-size:14px; line-height:1.2; text-decoration:none; cursor:pointer; }
.ml-btn--primary { background:#FFD12E; color:#0E0E0E; } .ml-btn--primary:hover { background:#f2c300; color:#0E0E0E; }
.ml-btn--ghost { background:#fff; color:#0E0E0E; border-color:#D2CFC4; } .ml-btn--ghost:hover { border-color:#0E0E0E; }
.ml-btn--full { width:100%; padding:12px 18px; font-size:15px; }
.ml-nowrap { white-space:nowrap; }
.ml-burger { display:none; align-items:center; justify-content:center; width:40px; height:40px; color:#0E0E0E; background:none; border:0; padding:0; cursor:pointer; border-radius:8px; }
.ml-burger:hover { color:var(--hcyan-text); background:var(--hcyan-tint); }
@media (max-width:1024px) { .ml-nav, .ml-hide-mobile { display:none; } .ml-burger { display:inline-flex; } }
@media (max-width:767px) { .ml-header__in { padding:8px 12px; } .ml-logo img { width:110px; } }
/* test mode: only the progress bar in the header */
.testbar { display:flex; gap:14px; align-items:center; font-size:14px; color:var(--ink-2); margin-left:auto; }
.testbar[hidden] { display:none; }
.testbar .timer { font-variant-numeric:tabular-nums; font-weight:700; color:var(--ink); font-family:ui-monospace,Menlo,monospace; }
.testbar .timer.low { color:var(--bad); }
.testbar .exit { font:inherit; font-weight:700; background:none; border:1px solid #D2CFC4; border-radius:8px; padding:7px 12px; cursor:pointer; color:#0E0E0E; }
body.test-mode .ml-nav, body.test-mode .ml-acts { display:none; }
body.test-mode .ml-logo { pointer-events:none; }
/* drawer */
.ml-drawer { position:fixed; inset:0; z-index:10000; font-family:var(--font); }
.ml-drawer[hidden] { display:none; }
.ml-drawer__overlay { position:absolute; inset:0; background:rgba(14,14,14,.6); opacity:0; transition:opacity .2s; }
.ml-drawer__panel { position:absolute; top:0; right:0; bottom:0; width:340px; max-width:88vw; overflow-y:auto; -webkit-overflow-scrolling:touch; background:#fff; padding:16px 20px 32px; display:flex; flex-direction:column; gap:22px; transform:translateX(100%); transition:transform .22s ease; box-shadow:-8px 0 30px rgba(0,0,0,.15); }
.ml-drawer.is-open .ml-drawer__overlay { opacity:1; } .ml-drawer.is-open .ml-drawer__panel { transform:none; }
html.ml-drawer-open { overflow:hidden; }
.ml-drawer__top { display:flex; align-items:center; justify-content:space-between; } .ml-drawer__top img { width:118px; height:auto; }
.ml-drawer__close { display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; color:#0B6A85; background:none; border:0; border-radius:8px; cursor:pointer; padding:0; }
.ml-drawer__close:hover { background:#E6F7FC; }
.ml-drawer__ctas { display:flex; flex-direction:column; gap:10px; }
.ml-drawer__group { display:flex; flex-direction:column; gap:8px; }
.ml-drawer__group h4 { margin:0 0 2px; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:#6A7B8E; font-weight:700; }
.ml-drawer__group a { color:#0E0E0E; font-weight:700; font-size:15px; text-decoration:none; padding:6px 0; }
.ml-drawer__group a:hover { color:#0B6A85; }
@media (prefers-reduced-motion:reduce) { .ml-drawer__panel, .ml-drawer__overlay { transition:none; } }
.pilot-tag { display:inline-block; background:#FFF1D2; color:#8A5A00; font-size:11px; font-weight:700; padding:1px 7px; border-radius:99px; vertical-align:1px; }
.sheet { border:1.5px dashed var(--cyan-ink); background:var(--tint); border-radius:12px; padding:16px 18px; display:flex; flex-direction:column; gap:10px; }
.sheet h3 { font-size:17px; }
.sheet .social { display:flex; flex-direction:column; gap:8px; }
.sheet .btn.social-btn { background:var(--surface); color:var(--ink); border:1.5px solid var(--line); justify-content:flex-start; gap:12px; }
.sheet .btn.social-btn svg { width:20px; height:20px; flex:0 0 20px; }
.sheet .or { font-size:13px; color:var(--ink-3); }
.sheet .notnow { background:none; border:0; color:var(--ink-3); font:inherit; font-size:13.5px; cursor:pointer; text-decoration:underline; padding:0; align-self:flex-start; }
/* hero, like the site's dark band */
.hero { background:#0E0E0E; color:#fff; border-radius:10px; padding:26px 22px; display:flex; flex-direction:column; gap:10px; }
.hero .eyebrow { color:#35C8EA; font-weight:700; }
.hero h1 { color:#fff; } .hero p { color:#d9d9d9; }
.hero .btn.ghost { background:transparent; color:#fff; border:1px solid rgba(255,255,255,.45); }
/* footer, like the site's */
.foot { background:#FAF9F6; border-top:1px solid rgba(0,0,0,.09); margin-top:32px; font-family:var(--font); font-size:13.5px; color:#3D3B37; }
.foot__in { max-width:1240px; margin:0 auto; padding:36px 20px 24px; display:flex; flex-wrap:wrap; gap:24px 24px; }
.foot__col { flex:1 1 160px; display:flex; flex-direction:column; gap:8px; min-width:0; }
.foot__col--brand { flex:1.6 1 240px; } .foot__col--contact { flex:1.4 1 220px; }
.foot__logo img { width:140px; height:auto; display:block; }
.foot__blurb { max-width:300px; margin:8px 0 12px; font-size:13.5px; line-height:1.6; color:#6B6963; }
.foot__social { list-style:none; margin:0; padding:0; display:flex; gap:8px; } .foot__social li { margin:0; }
.foot__soc { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; background:#F4F3EE; color:#0E0E0E; } .foot__soc:hover { background:#35C8EA; color:#0E0E0E; }
.foot__label { margin:0 0 6px; font-size:11px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:#0B6A85; }
.foot__links { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; } .foot__n { color:#8A877F; font-size:12px; white-space:nowrap; } .foot__links li { margin:0; font-size:13.5px; line-height:1.4; }
.foot__links a { color:#3D3B37; text-decoration:none; } .foot__links a:hover { color:#0B6A85; text-decoration:underline; text-underline-offset:3px; text-decoration-color:#35C8EA; }
.foot__wa { align-self:flex-start; margin-top:8px; display:inline-flex; align-items:center; gap:8px; }
.foot__bottom { border-top:1px solid rgba(0,0,0,.09); }
.foot__in--bottom { padding:12px 20px; align-items:center; justify-content:space-between; gap:8px 24px; } .foot__in--bottom p { margin:0; font-size:12.5px; color:#6B6963; }
@media (max-width:600px) { .foot__in { padding:28px 16px 20px; } .foot__col { flex:1 1 140px; } .foot__col--brand, .foot__col--contact { flex-basis:100%; } .foot__in--bottom { padding:14px 16px; } }
.countdown { font-size:13px; color:var(--ink-2); }
.wrap { max-width:760px; margin-inline:auto; padding:24px 16px 80px; display:flex; flex-direction:column; gap:20px; }
.card { background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:18px; display:flex; flex-direction:column; gap:10px; }
.card.link { cursor:pointer; transition:border-color .15s; } .card.link:hover { border-color:var(--cyan); }
.eyebrow { font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); font-weight:600; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; border:0; border-radius:99px; padding:12px 20px; font:inherit; font-weight:700; font-size:15px; cursor:pointer; text-decoration:none; background:var(--yellow); color:var(--ink); min-height:44px; }
.btn.secondary { background:var(--surface); color:var(--ink); border:1.5px solid var(--ink); }
.btn.quiet { background:var(--tint); color:var(--cyan-ink); }
.btn.wa { background:#25D366; color:#fff; }
.btn:disabled { opacity:.5; cursor:default; }
.btn.small { padding:8px 14px; font-size:13.5px; min-height:36px; }
.row { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:12px; }
.chips { display:flex; gap:8px; flex-wrap:wrap; }
.chip { border:1.5px solid var(--line); background:var(--surface); border-radius:99px; padding:7px 13px; font:inherit; font-size:14px; cursor:pointer; color:var(--ink-2); }
.chip[aria-pressed="true"] { background:var(--ink); color:#fff; border-color:var(--ink); }
.topics label { display:flex; gap:10px; align-items:flex-start; padding:8px 0; border-top:1px solid var(--line); font-size:15px; cursor:pointer; }
.topics label:first-child { border-top:0; }
.topics input { width:18px; height:18px; margin-top:3px; accent-color:var(--cyan-ink); }
.topics small { display:block; color:var(--ink-3); font-size:13px; }
.progress { height:8px; background:var(--line); border-radius:99px; overflow:hidden; }
.progress > i { display:block; height:100%; background:var(--cyan); border-radius:99px; transition:width .25s; }
.qhead { display:flex; justify-content:space-between; align-items:center; gap:10px; font-size:13.5px; color:var(--ink-3); }
.timer { font-variant-numeric:tabular-nums; font-weight:600; color:var(--ink-2); }
.timer.low { color:var(--bad); }
.stem { font-size:17px; line-height:1.5; }
.stem .img, .ans .img, .help-ex .img { margin-top:10px; }
.img img { display:block; max-width:100%; height:auto; margin:0 auto; background:#fff; border:1px solid var(--line); border-radius:10px; padding:6px; }
@media (min-width:640px) { .img img { max-width:520px; } }
.opts { display:flex; flex-direction:column; gap:8px; }
.opt { display:flex; gap:12px; align-items:flex-start; border:1.5px solid var(--line); border-radius:10px; padding:12px 14px; background:var(--surface); font:inherit; font-size:15.5px; text-align:left; cursor:pointer; line-height:1.45; }
.opt b { flex:0 0 26px; height:26px; border-radius:50%; background:var(--tint); color:var(--cyan-ink); display:inline-flex; align-items:center; justify-content:center; font-size:13px; }
.opt[aria-pressed="true"] { border-color:var(--ink); background:#F0F4F7; }
.opt.right { border-color:var(--good); background:var(--good-bg); }
.opt.wrong { border-color:var(--bad); background:var(--bad-bg); }
.opt.right b { background:var(--good); color:#fff; } .opt.wrong b { background:var(--bad); color:#fff; }
.nav2 { display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.flag { font-size:13.5px; color:var(--ink-3); background:none; border:0; cursor:pointer; font-family:inherit; }
.flag.on { color:var(--amber); font-weight:600; }
.big { font-size:44px; font-weight:700; line-height:1; }
.band { display:inline-block; border-radius:99px; padding:4px 12px; font-size:13px; font-weight:700; }
.band.g { background:var(--good-bg); color:var(--good); } .band.a { background:var(--amber-bg); color:var(--amber); } .band.r { background:var(--bad-bg); color:var(--bad); }
.bars { display:flex; flex-direction:column; gap:8px; }
.bar { display:grid; grid-template-columns:minmax(120px,1.4fr) 3fr auto; gap:10px; align-items:center; font-size:14px; }
.bar .track { height:10px; background:var(--line); border-radius:99px; overflow:hidden; }
.bar .track i { display:block; height:100%; border-radius:99px; }
.bar .track i.g { background:var(--good); } .bar .track i.a { background:var(--yellow); } .bar .track i.r { background:var(--bad); }
.bar .pct { font-variant-numeric:tabular-nums; color:var(--ink-2); min-width:44px; text-align:right; }
.rec { border-left:5px solid var(--line); }
.rec.r { border-left-color:var(--bad); } .rec.a { border-left-color:var(--yellow); } .rec.g { border-left-color:var(--good); }
.rec ul { margin:0; padding-left:18px; display:flex; flex-direction:column; gap:5px; font-size:14.5px; }
.rec .why { font-size:13.5px; color:var(--ink-2); }
.review { display:flex; flex-direction:column; gap:12px; }
.review .q { font-size:15px; }
.review .exp { background:var(--tint); border-radius:8px; padding:10px 12px; font-size:14px; color:var(--ink-2); }
.hist table { width:100%; border-collapse:collapse; font-size:14px; }
.hist th { text-align:left; font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3); padding:8px 6px; border-bottom:2px solid var(--ink); }
.hist td { padding:9px 6px; border-bottom:1px solid var(--line); }
.hist td.n { text-align:right; font-variant-numeric:tabular-nums; }
input[type=email], input[type=text] { font:inherit; font-size:16px; padding:11px 13px; border:1.5px solid var(--line); border-radius:8px; width:100%; max-width:360px; }
.ok { color:var(--good); font-weight:600; } .err { color:var(--bad); font-weight:600; }
.sr { position:absolute; left:-9999px; }
@media (max-width:520px) { .bar { grid-template-columns:1fr; gap:4px; } .bar .pct { text-align:left; } }
@media (prefers-reduced-motion: reduce) { .progress > i, .card.link { transition:none; } }

.heat { display:grid; grid-template-columns:repeat(13,1fr); gap:3px; margin:4px 0; }
.heat i { display:block; height:9px; border-radius:2px; background:var(--line); }
.heat i.g { background:var(--good); } .heat i.a { background:var(--yellow); } .heat i.r { background:var(--bad); }
a.bar:hover span:first-child { color:var(--cyan-ink); text-decoration:underline; }

/* Counter bar under the header: tests taken, students, average per subject. Shown on home and subject pages once the config gates open. */
.statsbar { background:#FAF9F6; border-bottom:1px solid rgba(0,0,0,.09); font-family:var(--font); font-size:13px; color:#3D3B37; }
.statsbar[hidden] { display:none; }
.statsbar__in { max-width:1240px; margin:0 auto; padding:9px 20px; display:flex; align-items:center; gap:10px 18px; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; white-space:nowrap; }
.statsbar__in::-webkit-scrollbar { display:none; }
.statsbar__lead { font-weight:700; color:#0E0E0E; display:inline-flex; align-items:center; gap:8px; flex:0 0 auto; }
.statsbar__lead i { display:inline-block; width:8px; height:8px; border-radius:50%; background:#35C8EA; box-shadow:0 0 0 3px #E6F7FC; }
.statsbar__sub { display:inline-flex; align-items:center; gap:7px; flex:0 0 auto; color:#6B6963; }
.statsbar__sub b { color:#0E0E0E; font-weight:700; }
.statsbar__bar { width:56px; height:6px; border-radius:99px; background:#E6E4DC; overflow:hidden; }
.statsbar__bar i { display:block; height:100%; border-radius:99px; background:#35C8EA; }
.statsbar__bar i.ok { background:#14774A; } .statsbar__bar i.mid { background:#C98A00; } .statsbar__bar i.low { background:#A8322F; }
@media (max-width:600px) { .statsbar__in { padding:8px 16px; gap:8px 14px; font-size:12.5px; } }

/* ---------- v7: student-friendly pass (27 Sep 2026) ---------- */
.livebar { background:#0E1B2A; color:#D9E6EF; font-family:var(--font); font-size:13px; }
.livebar[hidden] { display:none; }
.livebar__in { max-width:1240px; margin:0 auto; padding:8px 20px; display:flex; align-items:center; gap:14px; min-height:36px; }
.livebar__now { flex:0 0 auto; display:inline-flex; align-items:center; gap:7px; color:#fff; white-space:nowrap; }
.livebar__now b { font-weight:800; }
.livebar__now i { width:8px; height:8px; border-radius:50%; background:#3DDC84; box-shadow:0 0 0 0 rgba(61,220,132,.6); animation:livepulse 1.8s ease-out infinite; }
@keyframes livepulse { 0% { box-shadow:0 0 0 0 rgba(61,220,132,.55); } 100% { box-shadow:0 0 0 8px rgba(61,220,132,0); } }
.livebar__feed { position:relative; flex:1 1 auto; min-width:0; height:20px; overflow:hidden; }
.livebar__now + .livebar__feed { border-left:1px solid rgba(255,255,255,.18); padding-left:14px; }
.livebar__item { position:absolute; left:0; right:0; top:0; line-height:20px; color:#D9E6EF; text-decoration:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; opacity:0; transform:translateY(8px); transition:opacity .35s, transform .35s; pointer-events:none; }
.livebar__now + .livebar__feed .livebar__item { left:14px; }
.livebar__item.on { opacity:1; transform:none; pointer-events:auto; }
.livebar__item b { color:#35C8EA; font-weight:700; }
.livebar__item em { font-style:normal; color:#8FA3B3; margin-left:4px; }
.livebar__item:hover { color:#fff; }
@media (max-width:600px) { .livebar__in { padding:7px 16px; gap:4px 10px; font-size:12.5px; flex-wrap:wrap; } .livebar__feed { flex-basis:100%; } .livebar__now + .livebar__feed { border-left:0; padding-left:0; } .livebar__now + .livebar__feed .livebar__item { left:0; } }
@media (max-width:420px) { .livebar .tp { display:none; } }
@media (prefers-reduced-motion:reduce) { .livebar__now i { animation:none; } .livebar__item { transition:none; transform:none; } }
body.test-mode .foot, body.test-mode .statsbar, body.test-mode .livebar { display:none; }
.btn.wide { width:100%; }
.btn:disabled { opacity:.35; cursor:default; }
.chip small { font-size:12px; opacity:.7; margin-left:4px; }

/* home */
.lvl { display:flex; flex-direction:column; gap:10px; }
.lvl__h { margin:0; }
.subj { text-decoration:none; color:inherit; gap:6px; }
.subj__top { display:flex; justify-content:space-between; align-items:center; gap:10px; }
.subj__top h3 { margin:0; font-size:19px; }
.subj__go { width:32px; height:32px; border-radius:50%; background:var(--tint); color:var(--cyan-ink); display:inline-flex; align-items:center; justify-content:center; font-weight:700; flex:0 0 32px; }
.subj:hover .subj__go { background:var(--cyan); color:var(--ink); }
.subj__meta { font-size:13.5px; }

/* test */
.qdots { display:flex; flex-wrap:wrap; gap:6px; }
.qdot { width:30px; height:30px; border-radius:50%; border:1.5px solid var(--line); background:var(--surface); color:var(--ink-3); font:inherit; font-size:12.5px; font-weight:700; cursor:pointer; padding:0; }
.qdot.done { background:var(--tint); border-color:var(--cyan); color:var(--cyan-ink); }
.qdot.flag { border-color:var(--amber); box-shadow:inset 0 -3px 0 var(--amber); }
.qdot.cur { background:var(--ink); border-color:var(--ink); color:#fff; }
.qcard { gap:14px; }
.qtop { display:flex; justify-content:space-between; align-items:center; gap:10px; }
.qtop .eyebrow { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.flag { white-space:nowrap; padding:4px 0; } .flag.on { color:var(--amber); font-weight:700; }
.stem { font-size:17px; line-height:1.55; }
.opt { min-height:54px; transition:border-color .12s, background .12s; }
.opt[aria-pressed="true"] { border-color:var(--cyan-ink); background:var(--tint); }
.opt[aria-pressed="true"] b { background:var(--cyan-ink); color:#fff; }
.qhint { margin:0; font-size:13px; }
.qbar { position:sticky; bottom:0; z-index:5; display:flex; gap:10px; padding:12px 0 calc(12px + env(safe-area-inset-bottom)); background:linear-gradient(to top, var(--bg) 75%, rgba(246,250,251,0)); }
.qbar #prev { flex:0 0 64px; padding-inline:0; }
.qbar #next, .qbar #finish { flex:1 1 auto; }
.testbar .timer.hid { font-family:var(--font); font-size:12.5px; font-weight:600; color:var(--ink-3); text-decoration:underline; }

/* result */
.score { gap:8px; }
.score__row { display:flex; align-items:center; gap:14px; }
.big__of { font-size:24px; color:var(--ink-3); }
.score__head { margin:4px 0 0; font-size:21px; }
.plan { border-left:5px solid var(--line); gap:10px; }
.plan.r { border-left-color:var(--bad); } .plan.a { border-left-color:var(--yellow); } .plan.g { border-left-color:var(--good); }
.plan__h { display:flex; justify-content:space-between; align-items:baseline; gap:10px; }
.plan__h h3 { margin:0; font-size:17px; }
.plan__miss { font-size:13px; color:var(--ink-3); white-space:nowrap; }
.plan__link { display:flex; align-items:center; gap:10px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; text-decoration:none; color:var(--ink); font-size:14.5px; line-height:1.35; }
.plan__link:hover { border-color:var(--cyan); background:var(--tint); }
.plan__tag { flex:0 0 auto; font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:4px 8px; border-radius:6px; }
.plan__tag.v { background:#FDE8E8; color:#A8322F; } .plan__tag.n { background:var(--tint); color:var(--cyan-ink); } .plan__tag.p { background:var(--amber-bg); color:var(--amber); }
.plan__retake { font-size:14px; font-weight:700; text-decoration:none; }
.tutor { gap:12px; }
.tutor__row { display:flex; gap:14px; align-items:flex-start; }
.tutor__row img { border-radius:50%; flex:0 0 56px; object-fit:cover; }
.tutor__row h3 { margin:2px 0 4px; font-size:17px; }
.tutor__row .muted { margin:0; }
details.more > summary { cursor:pointer; font-weight:700; color:var(--cyan-ink); list-style:none; padding:4px 0; }
details.more > summary::-webkit-details-marker { display:none; }
details.more > summary::before { content:'+ '; } details.more[open] > summary::before { content:'– '; }
details.more[open] > summary { margin-bottom:10px; }
details.card.more > summary { color:var(--ink); }
.ans { display:flex; flex-direction:column; gap:6px; padding-top:12px; border-top:1px solid var(--line); }
.ans:first-child { border-top:0; padding-top:0; }
.ans__line { display:flex; gap:8px; align-items:flex-start; padding:8px 10px; border-radius:8px; font-size:14.5px; }
.ans__line b { flex:0 0 auto; }
.ans__line.right { background:var(--good-bg); color:var(--good); } .ans__line.right b { color:var(--good); }
.ans__line.wrong { background:var(--bad-bg); color:var(--bad); }
.ans__report { font-size:12.5px; color:var(--ink-3); }
.bar .track i.x { background:repeating-linear-gradient(45deg, #E6ECF0 0 6px, #F2F5F7 6px 12px); }

.fresh { margin:0; font-size:13.5px; color:var(--cyan-ink); background:var(--tint); border-radius:8px; padding:8px 10px; }
.fresh.low { color:var(--amber); background:var(--amber-bg); }
.seen-tag { display:inline-block; font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-3); background:#EEF2F5; border-radius:6px; padding:2px 6px; vertical-align:1px; }

/* ---------- v9: programme > subject structure (28 Sep 2026) ---------- */
.crumb { font-size:13.5px; color:var(--ink-3); } .crumb a { color:var(--ink-3); } .crumb b { color:var(--cyan-ink); }
.center { text-align:center; }
.h2 { font-size:22px; line-height:1.25; margin:0; } .h3 { font-size:18px; margin:0; }
.pick-head { display:flex; flex-direction:column; gap:6px; } .pick-head h1 { margin:0; font-size:28px; line-height:1.15; }
.tiles { display:grid; grid-template-columns:repeat(auto-fit, minmax(210px, 1fr)); gap:10px; }
.tile { position:relative; display:flex; flex-direction:column; gap:4px; padding:16px 44px 16px 16px; border:1.5px solid var(--line); border-radius:12px; background:var(--surface); text-decoration:none; color:var(--ink); min-height:84px; justify-content:center; }
.tile:hover { border-color:var(--cyan); }
.tile__name { font-weight:800; font-size:17px; } .tile__meta { font-size:13px; color:var(--ink-3); } .tile__meta b { color:var(--good); }
.tile__go { position:absolute; right:14px; top:50%; transform:translateY(-50%); width:28px; height:28px; border-radius:50%; background:var(--tint); color:var(--cyan-ink); display:grid; place-items:center; font-weight:700; }
.tile.soon .tile__name { color:var(--ink-2); } .tile.soon .tile__go { background:#EEF2F5; color:var(--ink-3); }
.chips.big .chip { padding:10px 16px; font-size:15px; font-weight:600; }
.soonlist { list-style:none; margin:4px 0 0; padding:0; display:flex; flex-direction:column; }
.soonlist li { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:9px 0; border-bottom:1px solid var(--line); font-size:14.5px; }
.soonlist li:last-child { border-bottom:0; } .soonlist small { color:var(--ink-3); margin-left:4px; } .soonlist a { font-weight:700; white-space:nowrap; text-decoration:none; }
.subj-head h1 { margin:0; font-size:28px; }
.resume { display:flex; justify-content:space-between; align-items:center; gap:10px; background:var(--tint); border-radius:10px; padding:10px 12px; font-size:14px; }
.modes { display:grid; grid-template-columns:repeat(3, 1fr); gap:8px; }
.mode { display:flex; flex-direction:column; gap:2px; align-items:flex-start; text-align:left; border:1.5px solid var(--line); border-radius:10px; background:var(--surface); padding:10px 11px; font:inherit; cursor:pointer; color:var(--ink); }
.mode b { font-size:14.5px; } .mode span { font-size:12px; color:var(--ink-3); line-height:1.35; }
.mode:hover { border-color:var(--cyan); } .mode.on { border-color:var(--ink); background:#FFF6D6; }
@media (max-width:420px) { .modes { grid-template-columns:1fr; } .mode { flex-direction:row; justify-content:space-between; align-items:center; } }
.chaplist { display:flex; flex-direction:column; }
.chap { display:grid; grid-template-columns:28px 1fr 84px 38px; gap:10px; align-items:center; padding:11px 2px; border:0; border-bottom:1px solid var(--line); background:none; font:inherit; text-align:left; cursor:pointer; color:var(--ink); }
.chap:last-child { border-bottom:0; } .chap:hover { background:var(--tint); }
.chap__n { width:24px; height:24px; border-radius:50%; background:#EEF2F5; color:var(--ink-2); font-size:12px; font-weight:700; display:grid; place-items:center; }
.chap__name { font-size:15px; font-weight:600; }
.chap__bar { height:6px; border-radius:99px; background:var(--line); overflow:hidden; display:flex; align-items:center; } .chap__bar small { font-size:11.5px; color:var(--ink-3); background:var(--surface); white-space:nowrap; }
.chap__bar i { display:block; height:100%; border-radius:99px; } .chap__bar i.g { background:var(--good); } .chap__bar i.a { background:#E0A63A; } .chap__bar i.r { background:var(--bad); }
.chap__p { font-size:13px; font-variant-numeric:tabular-nums; color:var(--ink-2); text-align:right; }
.links3 { display:flex; flex-wrap:wrap; gap:8px 18px; font-size:14px; } .links3 a { font-weight:700; text-decoration:none; }
.my-head { display:flex; justify-content:space-between; align-items:baseline; gap:10px; flex-wrap:wrap; } .my-head h1 { margin:0; font-size:28px; }
.count { font-size:13.5px; font-weight:700; color:var(--cyan-ink); background:var(--tint); border-radius:99px; padding:4px 11px; }
.next { background:var(--ink); color:#fff; border-color:var(--ink); } .next .eyebrow { color:#B4C2CE; } .next p { margin:0; color:#fff; } .next .btn { align-self:flex-start; }
.mycard { text-decoration:none; color:inherit; gap:8px; }
.mycard__top { display:flex; justify-content:space-between; align-items:flex-start; gap:10px; } .mycard h3 { margin:2px 0; font-size:19px; }
.ring { flex:0 0 52px; width:52px; height:52px; border-radius:50%; display:grid; place-items:center; font-weight:800; font-size:14px; }
.ring.g { background:var(--good-bg); color:var(--good); } .ring.a { background:var(--amber-bg); color:var(--amber); } .ring.r { background:var(--bad-bg); color:var(--bad); } .ring.x { background:#EEF2F5; color:var(--ink-3); }
.mycard__cta { font-size:14px; font-weight:700; color:var(--cyan-ink); }
.my-actions { gap:10px; flex-wrap:wrap; }
.btn:disabled { opacity:.45; cursor:default; }
.chap__bar.none { background:none; height:auto; }
/* code in questions (Computer Science): inline <code>, and <code class="pc"> for a pseudocode block with <br> line breaks */
.stem code, .opt code, .exp code, .ans code { font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:.92em; background:#EEF2F6; border-radius:4px; padding:1px 5px; }
.stem code.pc, .ans code.pc { display:block; margin:10px 0 2px; padding:10px 12px; line-height:1.55; white-space:pre-wrap; overflow-x:auto; font-size:14.5px; }
/* start page hero (full-width dark band, like the site's) and the My prep bar */
.phero { background:#0E0E0E; color:#fff; font-family:var(--font); }
.phero[hidden] { display:none; }
.phero__in { max-width:760px; margin:0 auto; padding:40px 16px 44px; display:flex; align-items:center; gap:28px; }
.phero__copy { flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:12px; }
.phero__eyebrow { font-size:12px; letter-spacing:.08em; text-transform:uppercase; font-weight:700; color:#35C8EA; }
.phero h1 { color:#fff; font-size:clamp(26px,4.6vw,36px); line-height:1.12; letter-spacing:-.015em; }
.phero p { color:#CFCFCF; font-size:15.5px; max-width:430px; }
.phero__facts { list-style:none; margin:6px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.phero__facts li { padding:6px 12px; border:1px solid rgba(255,255,255,.22); border-radius:99px; font-size:13px; color:#E6E6E6; }
.phero__facts b { color:#FFD12E; font-weight:800; }
.phero__demo { flex:0 0 268px; background:#fff; color:var(--ink); border-radius:14px; padding:16px; display:flex; flex-direction:column; gap:10px; box-shadow:0 18px 40px rgba(0,0,0,.35); transform:rotate(1.5deg); font-size:13px; }
.demo__top { display:flex; flex-direction:column; gap:4px; color:var(--ink-3); font-size:12px; }
.demo__tag { align-self:flex-start; background:var(--tint); color:var(--cyan-ink); font-weight:700; font-size:11px; letter-spacing:.06em; text-transform:uppercase; padding:3px 8px; border-radius:6px; }
.demo__score { display:flex; align-items:baseline; gap:2px; } .demo__score b { font-size:34px; line-height:1; } .demo__score span { color:var(--ink-3); font-weight:700; } .demo__score em { margin-left:auto; font-style:normal; font-weight:800; color:var(--good); }
.demo__row { display:grid; grid-template-columns:1fr 64px 34px; align-items:center; gap:8px; }
.demo__row span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .demo__row em { font-style:normal; font-weight:700; text-align:right; }
.demo__row i { height:6px; border-radius:99px; background:#E6E4DC; overflow:hidden; } .demo__row s { display:block; height:100%; border-radius:99px; text-decoration:none; }
.demo__row s.ok { background:#14774A; } .demo__row s.mid { background:#C98A00; } .demo__row s.low { background:#A8322F; }
.demo__next { border-top:1px solid var(--line); padding-top:10px; color:var(--ink-2); } .demo__next b { color:var(--cyan-ink); }
.pick-head h2 { font-size:22px; }
.mybar { display:flex; align-items:center; gap:14px; padding:14px 16px; border-radius:12px; background:var(--tint); border:1.5px solid #BDE9F5; }
.mybar__txt { flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:2px; font-size:14px; color:var(--ink-2); } .mybar__txt b { color:var(--ink); font-size:15px; }
.mybar__btn { flex:0 0 auto; }
@media (max-width:720px) { .phero__demo { display:none; } .phero__in { padding:28px 16px 30px; } }
@media (max-width:480px) { .mybar { flex-direction:column; align-items:stretch; text-align:left; } .mybar__btn { width:100%; } }
/* counter bar v2 (29 Sep): fixed totals, one subject at a time sliding in, "All subjects" panel */
.statsbar__in { overflow:visible; }
.statsbar__lead > span { white-space:nowrap; }
.statsbar__rot { flex:1 1 auto; min-width:0; display:flex; align-items:center; gap:10px; }
.statsbar__label { flex:0 0 auto; color:#6B6963; }
.statsbar__slots { position:relative; flex:1 1 auto; min-width:0; height:22px; overflow:hidden; }
.statsbar__slots .statsbar__sub { position:absolute; inset:0; display:flex; align-items:center; gap:8px; opacity:0; transform:translateY(10px); transition:opacity .4s, transform .4s; pointer-events:none; text-decoration:none; color:#3D3B37; white-space:nowrap; }
.statsbar__slots .statsbar__sub.on { opacity:1; transform:none; pointer-events:auto; }
.statsbar__name { overflow:hidden; text-overflow:ellipsis; min-width:0; }
.statsbar__sub b, .statsbar__cell b { color:#0E0E0E; font-weight:700; }
.statsbar__sub em, .statsbar__cell em { font-style:normal; color:#8A877F; font-size:12px; }
.statsbar__all { flex:0 0 auto; border:1px solid rgba(0,0,0,.14); background:#fff; border-radius:99px; padding:4px 11px; font:inherit; font-size:12.5px; font-weight:700; color:#0B6A85; cursor:pointer; white-space:nowrap; }
.statsbar__all:hover { border-color:#35C8EA; }
.statsbar__panel { border-top:1px solid rgba(0,0,0,.08); }
.statsbar__panel[hidden] { display:none; }
.statsbar__grid { max-width:1240px; margin:0 auto; padding:12px 20px 6px; display:grid; grid-template-columns:repeat(auto-fill, minmax(330px, 1fr)); gap:8px 28px; }
.statsbar__cell { display:grid; grid-template-columns:1fr 56px 38px 54px; align-items:center; gap:8px; text-decoration:none; color:#3D3B37; padding:4px 0; }
.statsbar__cell .statsbar__name { white-space:nowrap; }
.statsbar__cell b { text-align:right; }
.statsbar__few { max-width:1240px; margin:0 auto; padding:2px 20px 12px; font-size:12.5px; color:#6B6963; }
.statsbar__few a { color:#0B6A85; }
@media (max-width:600px) { .statsbar__in { flex-wrap:wrap; row-gap:6px; } .statsbar__lead { order:1; } .statsbar__all { order:2; margin-left:auto; } .statsbar__rot { order:3; flex:1 1 100%; } .statsbar__label, .sb-wide { display:none; } .statsbar__grid { padding:10px 16px 4px; grid-template-columns:1fr; } .statsbar__few { padding:2px 16px 10px; } .statsbar__slots .statsbar__bar { width:40px; } }
@media (prefers-reduced-motion:reduce) { .statsbar__slots .statsbar__sub { transition:none; transform:none; } }
/* study helper (#/ask, 29 Sep) */
.ask h1 { font-size:clamp(24px,5vw,30px); }
.ask__ctx { margin:0; padding:8px 12px; border-radius:8px; background:var(--tint); color:var(--ink-2); font-size:14px; }
.ask__lbl { font-size:13px; font-weight:700; color:var(--ink-2); margin-top:4px; }
.ask__sel, .ask__q { font:inherit; font-size:16px; width:100%; padding:11px 13px; border:1.5px solid var(--line); border-radius:10px; background:#fff; color:var(--ink); }
.ask__q { resize:vertical; min-height:84px; line-height:1.45; }
.ask__sel:focus, .ask__q:focus { outline:none; border-color:var(--cyan-ink); box-shadow:0 0 0 3px var(--tint); }
.ask__chips { display:flex; flex-wrap:wrap; gap:6px; align-items:center; font-size:13px; }
.ask__chips .chip { font-size:13px; padding:6px 11px; }
.help-topic { border-left:4px solid var(--cyan); }
.help-faq { border-left:4px solid var(--yellow); }
.help-faq p { color:var(--ink-2); }
.help-ex { border-top:1px solid var(--line); padding-top:12px; margin-top:4px; display:flex; flex-direction:column; gap:8px; }
.help-ex__q { font-size:15.5px; }
.help-ex__opts { display:grid; grid-template-columns:repeat(auto-fit, minmax(140px, 1fr)); gap:4px 14px; font-size:14px; color:var(--ink-2); }
.help-ex details { background:var(--bg); border-radius:8px; padding:8px 12px; }
.help-ex summary { cursor:pointer; font-weight:700; color:var(--cyan-ink); font-size:14px; }
.help-ex details p { margin:6px 0 0; font-size:14.5px; }
.help-ex__a { color:var(--good); }
.help-next { border:1.5px solid var(--ink); }
.help-routes { display:grid; grid-template-columns:repeat(auto-fit, minmax(230px, 1fr)); gap:10px; margin:6px 0; }
.help-route { display:flex; flex-direction:column; gap:3px; padding:14px 16px; border-radius:12px; border:1.5px solid var(--line); text-decoration:none; color:var(--ink); background:var(--surface); }
.help-route b { font-size:15.5px; } .help-route span { font-size:13.5px; color:var(--ink-3); }
.help-route:first-child { border-color:#25D366; background:#F1FBF4; }
.help-route:hover { border-color:var(--cyan-ink); }
/* My prep tidy-up (29 Sep): edit mode, in-page confirmations, undo toast */
.mycard.editing { cursor:default; }
.mycard__acts { gap:8px; }
.mycard__confirm { background:var(--amber-bg); border:1px solid #F0D9A6; border-radius:10px; padding:12px 14px; display:flex; flex-direction:column; gap:10px; }
.mycard__confirm[hidden] { display:none; }
.mycard__confirm p { margin:0; font-size:14.5px; color:var(--ink); }
.linkbtn { background:none; border:0; padding:0; font:inherit; color:var(--ink-3); text-decoration:underline; cursor:pointer; }
.linkbtn:hover { color:var(--cyan-ink); }
.fresh-line { margin:0; text-align:center; }
.toast { position:fixed; left:50%; transform:translateX(-50%); bottom:calc(16px + env(safe-area-inset-bottom, 0px)); z-index:300; display:flex; align-items:center; gap:14px; background:var(--ink); color:#fff; padding:12px 16px; border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,.25); font-size:14.5px; max-width:calc(100vw - 32px); }
.toast[hidden] { display:none; }
.toast button { background:none; border:0; color:#7FDCF2; font:inherit; font-weight:700; cursor:pointer; padding:4px; }
/* report a problem sheet (29 Sep) */
.rsheet { position:fixed; inset:0; z-index:400; display:flex; align-items:flex-end; justify-content:center; }
.rsheet__back { position:absolute; inset:0; background:rgba(14,27,42,.45); }
.rsheet__panel { position:relative; width:min(560px, 100%); max-height:92vh; overflow:auto; background:var(--surface); border-radius:16px 16px 0 0; padding:20px 18px calc(18px + env(safe-area-inset-bottom, 0px)); display:flex; flex-direction:column; gap:12px; box-shadow:0 -10px 40px rgba(0,0,0,.2); }
@media (min-width:640px) { .rsheet { align-items:center; } .rsheet__panel { border-radius:16px; } }
.rsheet__opts { display:flex; flex-direction:column; gap:6px; }
.rsheet__opt { display:flex; gap:10px; align-items:flex-start; padding:10px 12px; border:1.5px solid var(--line); border-radius:10px; cursor:pointer; font-size:15px; }
.rsheet__opt:has(input:checked) { border-color:var(--cyan-ink); background:var(--tint); }
.rsheet__opt input { margin-top:3px; accent-color:var(--cyan-ink); }
.rsheet__err { margin:0; color:var(--bad); font-size:14px; }
.rsheet__err[hidden] { display:none; }
.qreport { align-self:flex-start; font-size:13px; }
.ans__report { font-size:13px; margin-left:4px; }