.dl .q:where(:not(.v16-root *)){display:grid;gap:16px;padding:20px 18px;border-radius:var(--r-card);background:var(--card);box-shadow:var(--card-shadow)}
@media (min-width:760px){.dl .q:where(:not(.v16-root *)){padding:26px 28px}}
.dl .qwrap.now .q:where(:not(.v16-root *)){box-shadow:0 0 0 1.5px var(--fg) inset,0 24px 48px -36px rgba(13,27,42,.4)}
.dl .q-top:where(:not(.v16-root *)){display:flex;align-items:center;justify-content:space-between;margin:-6px -8px -8px 0}
.dl .q-n:where(:not(.v16-root *)){font-size:var(--t-meta);font-weight:var(--w-ui);color:var(--fg3)}
.dl .save[aria-pressed="true"]:where(:not(.v16-root *)){color:var(--fg)}
.dl .save[aria-pressed="true"] .i:where(:not(.v16-root *)){fill:var(--fg)}
.dl .q-text:where(:not(.v16-root *)){font-size:clamp(1.0625rem,1.5vw,1.1875rem);font-weight:var(--w-ui);line-height:1.5;letter-spacing:-.01em;text-wrap:pretty}
.dl .opts:where(:not(.v16-root *)){display:grid;gap:10px}
.dl .opt:where(:not(.v16-root *)){display:flex;align-items:center;gap:12px;width:100%;min-height:56px;padding:9px 14px 9px 10px;text-align:left;border-radius:var(--r-ctl);background:#fbf9f3;
  box-shadow:0 0 0 1px var(--line) inset;font-size:var(--t-body);line-height:1.35;transition:box-shadow .2s,background-color .2s,transform var(--quick) var(--ease),opacity .2s}
.dl .opt .k:where(:not(.v16-root *)){flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--ground);font-size:var(--t-small);font-weight:var(--w-head);color:var(--fg2);
  transition:background-color .2s,color .2s}
.dl .opt .t:where(:not(.v16-root *)){flex:1 1 auto;min-width:0}
.dl .opt .m:where(:not(.v16-root *)){flex:none;display:none;font-size:22px}
.dl .opt:not(:disabled):active:where(:not(.v16-root *)){transform:scale(.985)}
@media (hover:hover) and (pointer:fine){.dl .q:not(.done) .opt:hover:where(:not(.v16-root *)){box-shadow:0 0 0 1px var(--fg3) inset}}
.dl .opt[aria-pressed="true"]:where(:not(.v16-root *)){box-shadow:0 0 0 1.5px var(--fg) inset}
.dl .opt:disabled:where(:not(.v16-root *)){cursor:default}
.dl .q.done .opt:not(.is-ok):not(.is-no):where(:not(.v16-root *)){color:var(--fg3)}
.dl .q.done .opt-r:not(.is-ok):not(.is-no) .r:where(:not(.v16-root *)){box-shadow:0 0 0 2px var(--line2) inset}
.dl .opt.is-ok:where(:not(.v16-root *)){background:var(--ok-fill);box-shadow:0 0 0 1.5px var(--ok-line) inset}
.dl .opt.is-ok .k:where(:not(.v16-root *)){background:var(--ok);color:#fff}
.dl .opt.is-ok .m-ok:where(:not(.v16-root *)){display:block;color:var(--ok)}
.dl .opt.is-no:where(:not(.v16-root *)){background:var(--no-fill);box-shadow:0 0 0 1.5px var(--no-line) inset}
.dl .opt.is-no .k:where(:not(.v16-root *)){background:var(--no);color:#fff}
.dl .opt.is-no .m-no:where(:not(.v16-root *)){display:block;color:var(--no)}
@media (prefers-reduced-motion:no-preference){.dl .opt.now.is-ok .m-ok:where(:not(.v16-root *)),.dl .opt.now.is-no .m-no:where(:not(.v16-root *)){animation:pop .2s var(--ease)}@keyframes pop{from{transform:scale(.85)}}}
/* a chapter's options are round, as Google Forms draws a choice (sketch A, founder 14 Oct 2026: "A"): a ring that takes a tick
   or a cross when marked; the row keeps the tint, the ring carries the mark. The exam room keeps its lettered keys */
.dl .opt-r:where(:not(.v16-root *)){gap:14px;min-height:54px;padding:12px 16px 12px 14px;background:transparent;align-items:flex-start}
.dl .opt-r .r:where(:not(.v16-root *)){position:relative;flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;box-shadow:0 0 0 2px var(--fg3) inset;
  transition:background-color .2s,box-shadow .2s}
.dl .opt-r .r svg:where(:not(.v16-root *)){position:absolute;width:20px;height:20px;fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;opacity:0}
@media (hover:hover) and (pointer:fine){.dl .q:not(.done) .opt-r:hover:where(:not(.v16-root *)){background:var(--sunk);box-shadow:0 0 0 1px var(--line2) inset}.dl .q:not(.done) .opt-r:hover .r:where(:not(.v16-root *)){box-shadow:0 0 0 2px var(--fg2) inset}}
.dl .opt-r.is-ok:where(:not(.v16-root *)),.dl .opt-r.is-no:where(:not(.v16-root *)){font-weight:var(--w-ui)}
.dl .opt-r.is-ok:where(:not(.v16-root *)){color:var(--ok)}.dl .opt-r.is-no:where(:not(.v16-root *)){color:var(--no)}
.dl .opt-r.is-ok .r:where(:not(.v16-root *)){background:var(--ok);box-shadow:none}
.dl .opt-r.is-no .r:where(:not(.v16-root *)){background:var(--no);box-shadow:none}
.dl .opt-r.is-ok .r-ok:where(:not(.v16-root *)),.dl .opt-r.is-no .r-no:where(:not(.v16-root *)){opacity:1}
@media (prefers-reduced-motion:no-preference){.dl .opt-r.now.is-ok .r:where(:not(.v16-root *)),.dl .opt-r.now.is-no .r:where(:not(.v16-root *)){animation:pop .2s var(--ease)}}
/* Show answers: an unanswered card prints its answer (live: "Answer: (a) ...") */
.dl .rev-line:where(:not(.v16-root *)){display:none;font-size:var(--t-small);color:var(--fg2)}
.dl .rev-line b:where(:not(.v16-root *)){color:var(--fg);font-weight:var(--w-head)}
.dl .v-acts:where(:not(.v16-root *)){display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.dl .verdict:where(:not(.v16-root *)){display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
.dl .verdict p:where(:not(.v16-root *)){font-weight:var(--w-head);letter-spacing:-.01em}
.dl .verdict p.ok:where(:not(.v16-root *)){color:var(--ok)}.dl .verdict p.no:where(:not(.v16-root *)){color:var(--no)}
.dl .rows.card:where(:not(.v16-root *)){padding:4px 16px}
.dl .subj-chips:where(:not(.v16-root *)){display:flex;gap:8px;overflow-x:auto;margin-inline:calc(var(--pad) * -1);margin-block:-4px -2px;padding:6px var(--pad);scrollbar-width:none}
.dl .subj-chips:where(:not(.v16-root *))::-webkit-scrollbar{display:none}
.dl .subj-chips button:where(:not(.v16-root *)){flex:none;min-height:44px;padding:0 14px;border-radius:999px;font-size:var(--t-small);font-weight:var(--w-ui);color:var(--fg2);box-shadow:0 0 0 1px var(--line2) inset;
  transition:background-color .15s,color .15s,transform var(--quick) var(--ease)}
.dl .subj-chips button[aria-pressed="true"]:where(:not(.v16-root *)){background:var(--fg);color:var(--cream);box-shadow:none}
/* Review's subject chips: each carries its count; a hidden row leaves no line behind it */
.dl .rv-chips:where(:not(.v16-root *)){margin-top:14px;margin-bottom:10px}
.dl .rv-chips .n:where(:not(.v16-root *)){margin-left:8px;font-weight:400;font-variant-numeric:tabular-nums;color:var(--fg3)}
.dl .rv-chips button[aria-pressed="true"] .n:where(:not(.v16-root *)){color:inherit;opacity:.72}
.dl .facts:where(:not(.v16-root *)){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-radius:var(--r-inner);background:var(--sunk)}
.dl .facts div:where(:not(.v16-root *)){display:grid;gap:2px;padding:14px 12px;text-align:center}
.dl .facts div + div:where(:not(.v16-root *)){box-shadow:-1px 0 0 var(--line)}
.dl .facts dt:where(:not(.v16-root *)){font-size:var(--t-meta);color:var(--fg2)}
.dl .facts dd:where(:not(.v16-root *)){font-size:var(--t-h2);font-weight:var(--w-head);letter-spacing:-.02em}
@media (prefers-reduced-motion:reduce) and (max-width:999px){
  .dl :is(.xmap,.mk-pane,.rtr-pane,.cd-pane):where(:not(.v16-root *)){transform:none!important;opacity:0;transition:opacity .2s,visibility 0s .2s!important}
  .dl :is(.xmap,.mk-pane,.rtr-pane,.cd-pane).on:where(:not(.v16-root *)){opacity:1;transition:opacity .2s!important}
}
/* ============ Exams: sketch A, two tabs (founder, 14 Oct 2026: "A for exams") ============ */
.dl .ex-head:where(:not(.v16-root *)){display:flex;align-items:last baseline;justify-content:space-between;gap:12px}
.dl .more:where(:not(.v16-root *)){display:inline-flex;align-items:center;gap:2px;min-height:44px;padding:0 4px;font-size:var(--t-small);font-weight:var(--w-ui);color:var(--fg2);transition:color .15s}
.dl .more .i:where(:not(.v16-root *)){font-size:17px}
@media (hover:hover) and (pointer:fine){.dl .more:hover:where(:not(.v16-root *)){color:var(--fg)}}
/* the segmented control: two tabs in a sunk track, the chosen one a raised card */
.dl .exseg:where(:not(.v16-root *)){display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-top:6px;padding:4px;border-radius:999px;background:var(--sunk);box-shadow:0 0 0 1px var(--line) inset}
.dl .exseg button:where(:not(.v16-root *)){min-height:44px;border-radius:999px;font-size:var(--t-small);font-weight:var(--w-ui);color:var(--fg2);transition:background-color .2s,color .2s,box-shadow .2s,transform var(--quick) var(--ease)}
.dl .exseg button[aria-selected="true"]:where(:not(.v16-root *)){background:var(--card);color:var(--fg);box-shadow:0 0 0 1px var(--line),0 2px 6px -2px rgba(13,27,42,.18)}
@media (min-width:760px){.dl .exseg:where(:not(.v16-root *)){display:inline-grid;grid-template-columns:auto auto}.dl .exseg button:where(:not(.v16-root *)){padding:0 24px}}
.dl .ex-pane:where(:not(.v16-root *)){margin-top:var(--gap)}
/* Mock tests: the subjects (sat first, lowest score first) and the chosen paper */
.dl .mk-split:where(:not(.v16-root *)){display:grid;gap:var(--gap);padding-bottom:84px}
.dl .mk-list:where(:not(.v16-root *)){display:grid;padding:4px 10px}
.dl .mrow:where(:not(.v16-root *)){display:flex;align-items:center;gap:14px;width:100%;min-height:72px;padding:10px 8px;border-radius:14px;text-align:left;transition:background-color .15s,box-shadow .15s}
/* a hairline between rows, drawn on the item so a chosen row's rounded ring never bends it */
.dl .mk-list > li:where(:not(.v16-root *)){position:relative}
.dl .mk-list > li + li:where(:not(.v16-root *))::before{content:"";position:absolute;left:8px;right:8px;top:0;height:1px;background:var(--line)}
.dl .mrow .copy:where(:not(.v16-root *)){flex:1 1 auto;min-width:0;display:grid;gap:2px}
.dl .mrow .copy b:where(:not(.v16-root *)){font-size:var(--t-small);font-weight:var(--w-head)}
.dl .mrow .copy span:where(:not(.v16-root *)){font-size:var(--t-meta);color:var(--fg3)}
.dl .mrow .fresh:where(:not(.v16-root *)){flex:none;font-size:var(--t-meta);color:var(--fg3)}
.dl .mrow[aria-pressed="true"]:where(:not(.v16-root *)){background:var(--sunk);box-shadow:0 0 0 1.5px var(--fg) inset}
@media (hover:hover) and (pointer:fine){.dl .mrow:not([aria-pressed="true"]):hover:where(:not(.v16-root *)){background:rgba(13,27,42,.03)}}
/* the last score: its figure over a short bar, the pass mark an ink tick across it; a gap to the pass mark is ink, never red */
.dl .mscore:where(:not(.v16-root *)){flex:none;display:grid;justify-items:end;gap:5px;width:72px}
.dl .mscore .num:where(:not(.v16-root *)){font-size:var(--t-small);font-weight:var(--w-head)}
.dl .mbar:where(:not(.v16-root *)){position:relative;display:block;width:100%;height:6px;border-radius:999px;background:rgba(13,27,42,.08)}
.dl .mbar i:where(:not(.v16-root *)){position:absolute;inset:0;border-radius:inherit;background:var(--fg);transform-origin:0 50%;transform:scaleX(var(--p))}
.dl .mbar b:where(:not(.v16-root *)){position:absolute;top:-4px;left:calc(var(--pm) * 100%);width:2px;height:14px;margin-left:-1px;border-radius:2px;background:var(--fg)}
/* the chosen paper: beside the list on a laptop, a sheet from the pinned bar on a phone */
.dl .mk-pane:where(:not(.v16-root *)){display:grid;gap:16px}
.dl .mk-pane .grab:where(:not(.v16-root *)){justify-self:center;width:40px;height:5px;border-radius:999px;background:var(--line2)}
.dl .mk-ph:where(:not(.v16-root *)){display:flex;align-items:center;gap:16px}
.dl .mk-ph .win:where(:not(.v16-root *)){width:64px}
.dl .mk-ph-copy:where(:not(.v16-root *)){display:grid;gap:6px;justify-items:start}
.dl .mk-ph h2:where(:not(.v16-root *)){font-size:var(--t-h2);font-weight:var(--w-head);letter-spacing:-.02em}
.dl .mk-pane .facts dd small:where(:not(.v16-root *)){font-size:var(--t-meta);font-weight:var(--w-ui);color:var(--fg2)}
.dl .mk-line:where(:not(.v16-root *)){font-size:var(--t-meta);line-height:1.5;color:var(--fg2);text-wrap:pretty}
.dl .mk-topics:where(:not(.v16-root *)){display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:var(--t-meta);color:var(--fg2)}
.dl .mk-pin:where(:not(.v16-root *)){position:fixed;left:max(12px,env(safe-area-inset-left,0px));right:max(12px,env(safe-area-inset-right,0px));bottom:calc(84px + env(safe-area-inset-bottom,0px));z-index:35;
  display:flex;align-items:center;gap:10px;padding:8px 8px 8px 10px;border-radius:22px;background:var(--card);box-shadow:0 0 0 1px var(--line),0 18px 36px -18px rgba(13,27,42,.45)}
.dl .mk-pin-info:where(:not(.v16-root *)){flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:10px;min-height:48px;text-align:left}
.dl .mk-pin-info .win.xs:where(:not(.v16-root *)){width:34px;padding:3px}
.dl .mk-pin-info .copy:where(:not(.v16-root *)){display:grid;gap:1px;min-width:0}
.dl .mk-pin-info b:where(:not(.v16-root *)){font-size:var(--t-small);font-weight:var(--w-head);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dl .mk-pin-info span span:where(:not(.v16-root *)){font-size:var(--t-meta);color:var(--fg2)}
@media (max-width:999px){
  .dl .mk-pane:where(:not(.v16-root *)){position:fixed;left:0;right:0;bottom:0;z-index:80;max-height:86vh;max-height:86dvh;overflow-y:auto;
    padding:10px max(20px,env(safe-area-inset-right,0px)) calc(20px + env(safe-area-inset-bottom,0px)) max(20px,env(safe-area-inset-left,0px));
    border-radius:28px 28px 0 0;background:var(--card);box-shadow:0 -20px 50px -20px rgba(7,24,45,.4);transform:translateY(104%);visibility:hidden;
    transition:transform .2s var(--ease),visibility 0s .2s}
  .dl .mk-pane.on:where(:not(.v16-root *)){transform:none;visibility:visible;transition:transform .32s var(--ease)}
}
@media (min-width:1000px){
  .dl .mk-split:where(:not(.v16-root *)){grid-template-columns:minmax(0,1fr) minmax(320px,400px);align-items:start;column-gap:28px;padding-bottom:0}
  .dl .mk-pane:where(:not(.v16-root *)){position:sticky;top:24px;padding:22px;border-radius:var(--r-card);background:var(--card);box-shadow:var(--card-shadow)}
  .dl .mk-pane .grab:where(:not(.v16-root *)),.dl .mk-pin:where(:not(.v16-root *)){display:none}
}
/* Past papers: one card per year, the newest open; a year opens to its sittings, newest month first, one row per subject paper */
.dl .pp:where(:not(.v16-root *)){display:grid;gap:var(--gap);max-width:760px}
.dl .pp .rv-chips:where(:not(.v16-root *)){margin-top:-4px;margin-bottom:-2px}
.dl .yr:where(:not(.v16-root *)){padding:4px 16px}
.dl .yr-h:where(:not(.v16-root *)){display:flex;align-items:center;gap:10px;width:100%;min-height:60px;text-align:left}
.dl .yr-h b:where(:not(.v16-root *)){font-size:var(--t-h3);font-weight:var(--w-head);letter-spacing:-.01em}
.dl .yr-h span:where(:not(.v16-root *)){flex:1 1 auto;font-size:var(--t-meta);color:var(--fg2)}
.dl .yr-h .i:where(:not(.v16-root *)){font-size:20px;color:var(--fg3);transition:transform .25s var(--ease)}
.dl .yr-h[aria-expanded="true"] .i:where(:not(.v16-root *)){transform:rotate(180deg)}
.dl .yr-b:where(:not(.v16-root *)){display:grid;gap:4px;padding-bottom:10px}
.dl .sit .mo:where(:not(.v16-root *)){padding:10px 0 2px;font-size:var(--t-meta);font-weight:var(--w-ui);color:var(--fg3)}
.dl .sit .row:where(:not(.v16-root *)){min-height:56px}
.dl .sit .row > .i:where(:not(.v16-root *)){font-size:18px;color:var(--fg3)}
.dl .sit li[hidden]:where(:not(.v16-root *)),.dl .sit[hidden]:where(:not(.v16-root *)),.dl .yr[hidden]:where(:not(.v16-root *)){display:none}
.dl .res-pct:where(:not(.v16-root *)){font-size:clamp(3rem,7vw,3.75rem);font-weight:var(--w-head);letter-spacing:-.045em;line-height:1}
/* Review with nothing to fix: one empty state and the way to fill it */
.dl .rv-empty:where(:not(.v16-root *)){display:grid;justify-items:center;gap:10px;margin-top:22px;padding:34px 22px 28px;text-align:center}
.dl .rv-empty-ic:where(:not(.v16-root *)){display:grid;place-items:center;width:56px;height:56px;border-radius:18px;background:var(--cream-deep);font-size:24px;color:var(--fg)}
.dl .rv-empty h2:where(:not(.v16-root *)){font-size:var(--t-h2);font-weight:var(--w-head);letter-spacing:-.02em}
.dl .rv-empty p:where(:not(.v16-root *)){max-width:30ch;font-size:var(--t-small);color:var(--fg2)}
.dl .rv-empty .btn:where(:not(.v16-root *)){margin-top:6px}
/* a free student's Exams: Pro beside what it locks, and today's lock in place of Start */
.dl .pro-tag:where(:not(.v16-root *)){display:inline-flex;align-items:center;height:18px;margin-left:6px;padding:0 6px;border-radius:999px;background:var(--cream-deep);color:var(--fg2);
  font-size:var(--t-tiny);font-weight:var(--w-head);letter-spacing:.04em;text-transform:uppercase}
.dl .mk-lock:where(:not(.v16-root *)){display:grid;gap:8px;padding:14px;border-radius:var(--r-inner);background:var(--cream);box-shadow:0 0 0 1px var(--line) inset}
.dl .mk-lock p:where(:not(.v16-root *)){font-size:var(--t-small);color:var(--fg2)}
.dl .mk-lock b:where(:not(.v16-root *)){color:var(--fg);font-weight:var(--w-head)}
.dl .mk-lock .btn:where(:not(.v16-root *)){margin-top:4px}
.dl .pp-foot:where(:not(.v16-root *)){margin-top:14px;font-size:var(--t-meta);color:var(--fg2)}
/* Attempt history is for a student who may sit a paper, as today's lobby shows it (its tab script owns its hidden) */
.dl .lk-ic:where(:not(.v16-root *)){display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:var(--card);color:var(--fg);font-size:18px;
  box-shadow:var(--card-shadow-sm)}
.dl .q-text:where(:not(.v16-root *)){white-space:pre-line}
.dl .q .opt-r[aria-pressed="true"]:where(:not(.v16-root *)){background:var(--card);box-shadow:0 0 0 1.5px var(--fg) inset}
.dl .q .opt-r[aria-pressed="true"] .r:where(:not(.v16-root *)){box-shadow:0 0 0 2px var(--fg) inset}
.dl .q .opt-r[aria-pressed="true"] .r:where(:not(.v16-root *))::after{content:"";width:12px;height:12px;border-radius:50%;background:var(--fg)}
.dl .pk:where(:not(.v16-root *)){display:grid;gap:var(--gap);padding-bottom:28px}
.dl .pk .head:where(:not(.v16-root *)){padding-bottom:6px}
.dl .pk .more:where(:not(.v16-root *)){margin-left:-4px}
.dl .pk .rev-line:where(:not(.v16-root *)){display:block}
.dl .pk .verdict p.no:where(:not(.v16-root *)){color:var(--no)}
/* the lock where the locked thing would be (founder pick C, 14 Oct 2026): its line, what Pro opens, and See Pro */
.dl .pk-lock:where(:not(.v16-root *)){display:flex;align-items:center;flex-wrap:wrap;gap:12px;padding:14px 14px 14px 12px;border-radius:var(--r-inner);background:var(--sunk);box-shadow:0 0 0 1px var(--line) inset}
.dl .pk-lock .grow:where(:not(.v16-root *)){flex:1 1 170px;min-width:0;display:grid;gap:2px}
.dl .pk-lock b:where(:not(.v16-root *)){font-size:var(--t-small);font-weight:var(--w-head)}
.dl .pk-lock .grow span:where(:not(.v16-root *)){font-size:var(--t-meta);color:var(--fg2);text-wrap:pretty}
.dl .pk-pad:where(:not(.v16-root *)){height:96px}
@media (min-width:1000px){.dl .pk-pad:where(:not(.v16-root *)){display:none}}
/* ---------- a past paper, D: one question at a time, untimed, as the exam room moves ---------- */
.dl .pa-head:where(:not(.v16-root *)){display:grid;gap:14px;padding-block:20px 6px}
.dl .pa-copy:where(:not(.v16-root *)){display:grid;gap:6px}
.dl .pa-copy h1:where(:not(.v16-root *)){font-size:var(--t-title);font-weight:var(--w-head);letter-spacing:-.015em;line-height:1.1}
.dl .pa-len:where(:not(.v16-root *)){font-size:var(--t-small);color:var(--fg2)}
.dl .pa-take:where(:not(.v16-root *)){display:grid;gap:8px}
.dl .pa-take .btn:where(:not(.v16-root *)){width:100%}
@media (min-width:1000px){.dl .pa-head:where(:not(.v16-root *)){grid-template-columns:minmax(0,1fr) auto;align-items:end}.dl .pa-take .btn:where(:not(.v16-root *)){width:auto}.dl .pa-head .pk-lock:where(:not(.v16-root *)){max-width:420px}}
.dl .pa-show:where(:not(.v16-root *)){min-height:44px;margin:-8px -4px -8px 0;padding:0 4px;font-size:var(--t-small);font-weight:var(--w-ui);color:var(--fg2);text-decoration:underline;text-decoration-color:var(--line2);text-underline-offset:3px}
/* the question numbers, as a test app's palette draws them */
.dl .pa-grid:where(:not(.v16-root *)){display:grid;grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:8px}
.dl .pa-grid button:where(:not(.v16-root *)){height:44px;border-radius:12px;font-size:var(--t-small);font-weight:var(--w-ui);color:var(--fg2);font-variant-numeric:tabular-nums;box-shadow:0 0 0 1px var(--line2) inset}
.dl .pa-grid .ok:where(:not(.v16-root *)){background:var(--ok-fill);color:var(--ok);box-shadow:0 0 0 1.5px var(--ok-line) inset}
.dl .pa-grid .no:where(:not(.v16-root *)){background:var(--no-fill);color:var(--no);box-shadow:0 0 0 1.5px var(--no-line) inset}
.dl .pa-grid .cur:where(:not(.v16-root *)){color:var(--fg);box-shadow:0 0 0 2px var(--fg) inset}
.dl .pa-legend:where(:not(.v16-root *)){display:flex;flex-wrap:wrap;gap:6px 16px;font-size:var(--t-meta);color:var(--fg2)}
.dl .pa-legend span:where(:not(.v16-root *)){display:inline-flex;align-items:center;gap:6px}
.dl .pa-legend i:where(:not(.v16-root *)){width:12px;height:12px;border-radius:4px;box-shadow:0 0 0 1px var(--line2) inset}
.dl .pa-legend i.ok:where(:not(.v16-root *)){background:var(--ok-fill);box-shadow:0 0 0 1.5px var(--ok-line) inset}
.dl .pa-legend i.no:where(:not(.v16-root *)){background:var(--no-fill);box-shadow:0 0 0 1.5px var(--no-line) inset}
.dl .pa-rail:where(:not(.v16-root *)){display:none}
.dl .pa-rail .grab:where(:not(.v16-root *)){display:none}
@media (min-width:1000px){
  .dl .pa-rail:where(:not(.v16-root *)){position:sticky;top:24px;display:grid;gap:14px;padding:22px}
  .dl .pa-rail h2:where(:not(.v16-root *)){font-size:var(--t-h3);font-weight:var(--w-head)}
}
.dl .pa-one:where(:not(.v16-root *)){display:grid;gap:12px}
.dl .pa-step:where(:not(.v16-root *)){display:flex;align-items:center;gap:12px;font-size:var(--t-meta);font-weight:var(--w-ui);color:var(--fg2)}
.dl .pa-step .rail:where(:not(.v16-root *)){flex:1 1 auto}
.dl .pa-step .rail i:where(:not(.v16-root *)){display:block;height:100%;width:calc(var(--p) * 100%);border-radius:inherit;background:var(--fg)}
.dl .pa-move:where(:not(.v16-root *)){position:fixed;left:0;right:0;bottom:calc(72px + env(safe-area-inset-bottom,0px));z-index:35;display:flex;align-items:center;gap:10px;padding:10px max(16px,env(safe-area-inset-left,0px));
  background:var(--bg);box-shadow:0 -1px 0 var(--line)}
.dl .pa-move .btn:where(:not(.v16-root *)){flex:1 1 0}
.dl .pa-move .iconbtn:where(:not(.v16-root *)){flex:none;box-shadow:0 0 0 1px var(--line2) inset}
.dl .pa-move .pa-num:where(:not(.v16-root *)){flex:1.2 1 0}
@media (min-width:1000px){.dl .pa-move .pa-num:where(:not(.v16-root *)){display:none}}
@media (min-width:1000px){
  .dl .pa-move:where(:not(.v16-root *)){position:static;padding:0;background:none;box-shadow:none}
  .dl .pa-move .btn:where(:not(.v16-root *)){flex:0 0 auto}
  .dl .pa-move .pa-num:where(:not(.v16-root *)){margin-right:auto}
  .dl .pa-desk:where(:not(.v16-root *)){display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start}
}
/* added: on a phone Questions opens the squares as a sheet, as the exam room's list rises (the round drew the button, not the sheet) */
@media (max-width:999px){
  .dl .pa-rail:where(:not(.v16-root *)){position:fixed;left:0;right:0;bottom:0;z-index:80;display:grid;gap:14px;max-height:78vh;max-height:78dvh;overflow-y:auto;overscroll-behavior:contain;
    padding:10px max(16px,env(safe-area-inset-right,0px)) calc(18px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));
    border-radius:28px 28px 0 0;background:var(--card);box-shadow:0 -20px 50px -20px rgba(7,24,45,.4);transform:translateY(104%);visibility:hidden;
    transition:transform .2s var(--ease),visibility 0s .2s}
  .dl .pa-rail.on:where(:not(.v16-root *)){transform:none;visibility:visible;transition:transform .32s var(--ease)}
  .dl .pa-rail .grab:where(:not(.v16-root *)){display:block;justify-self:center;width:40px;height:5px;border-radius:999px;background:var(--line2)}
  .dl .pa-rail h2:where(:not(.v16-root *)){font-size:var(--t-h2);font-weight:var(--w-head);letter-spacing:-.015em}
}
@media (prefers-reduced-motion:reduce) and (max-width:999px){
  .dl .pa-rail:where(:not(.v16-root *)){transform:none!important;opacity:0;transition:opacity .2s,visibility 0s .2s!important}
  .dl .pa-rail.on:where(:not(.v16-root *)){opacity:1;transition:opacity .2s!important}
}
/* ---------- Attempt history, D: a card for each subject, as a health app lays out its highlights ---------- */
.dl .hi-links:where(:not(.v16-root *)){display:flex;flex-wrap:wrap;gap:0 18px;margin:-4px 0 0 -4px}
.dl .hi-sum:where(:not(.v16-root *)){display:grid;gap:14px;padding:20px}
@media (min-width:760px){.dl .hi-sum:where(:not(.v16-root *)){padding:24px}}
.dl .hi-top:where(:not(.v16-root *)){display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
.dl .hi-top .eyebrow:where(:not(.v16-root *)){font-size:var(--t-small)}
.dl .hi-big:where(:not(.v16-root *)){display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px}
.dl .hi-big .res-pct:where(:not(.v16-root *)){font-size:clamp(2.75rem,6vw,3.5rem)}
.dl .hi-big p:not(.res-pct):where(:not(.v16-root *)){font-size:var(--t-small);color:var(--fg2);text-wrap:pretty}
.dl .hi-facts:where(:not(.v16-root *)){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-radius:var(--r-inner);background:var(--sunk)}
.dl .hi-facts div:where(:not(.v16-root *)){display:grid;gap:2px;padding:10px 12px}
.dl .hi-facts div + div:where(:not(.v16-root *)){box-shadow:-1px 0 0 var(--line)}
.dl .hi-facts dt:where(:not(.v16-root *)){font-size:var(--t-meta);color:var(--fg2)}
.dl .hi-facts dd:where(:not(.v16-root *)){font-size:var(--t-h3);font-weight:var(--w-head);font-variant-numeric:tabular-nums}
/* the scores oldest to newest: HTML labels, so the words stay their size at any width */
.dl .hi-chart:where(:not(.v16-root *)){position:relative;height:178px;font-size:var(--t-meta);color:var(--fg3)}
.dl .hi-chart.sm:where(:not(.v16-root *)){height:120px}
.dl .hi-plot:where(:not(.v16-root *)){position:absolute;left:60px;right:10px;top:10px;bottom:28px}
.dl .hi-plot svg:where(:not(.v16-root *)){position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.dl .hi-plot .gl:where(:not(.v16-root *)){stroke:rgba(13,27,42,.08);stroke-width:1;vector-effect:non-scaling-stroke}
.dl .hi-plot .pl:where(:not(.v16-root *)){stroke:var(--fg);stroke-width:1.25;stroke-dasharray:5 5;opacity:.55;vector-effect:non-scaling-stroke}
.dl .hi-plot .ln:where(:not(.v16-root *)){fill:none;stroke:var(--fg);stroke-width:2.25;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.dl .hi-plot .dot:where(:not(.v16-root *)){position:absolute;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:var(--card);box-shadow:0 0 0 2px var(--fg) inset}
.dl .hi-plot .dot.last:where(:not(.v16-root *)){width:14px;height:14px;margin:-7px 0 0 -7px;background:var(--fg);box-shadow:0 0 0 3px var(--card)}
.dl .hi-plot .dot.ok:where(:not(.v16-root *)){box-shadow:0 0 0 2px var(--ok) inset}
.dl .hi-plot .dot.last.ok:where(:not(.v16-root *)){background:var(--ok);box-shadow:0 0 0 3px var(--card)}
.dl .hi-y:where(:not(.v16-root *)){position:absolute;left:0;width:52px;text-align:right;white-space:nowrap;transform:translateY(-50%);font-variant-numeric:tabular-nums}
.dl .hi-y.pass:where(:not(.v16-root *)){color:var(--fg);font-weight:var(--w-ui)}
.dl .hi-x:where(:not(.v16-root *)){position:absolute;bottom:0;font-variant-numeric:tabular-nums}
.dl .hi-rows .row:where(:not(.v16-root *)){min-height:64px}
.dl .hi-rows .copy b:where(:not(.v16-root *)){font-size:var(--t-small);font-weight:var(--w-head)}
.dl .hi-rows .mscore .num:where(:not(.v16-root *)){font-size:var(--t-small);font-weight:var(--w-head)}
.dl .hi-rows .mscore.ok .num:where(:not(.v16-root *)){color:var(--ok)}
@media (min-width:1000px){.dl .hi-two:where(:not(.v16-root *)){display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:var(--gap);align-items:start}}
.dl .hi-cards:where(:not(.v16-root *)){display:grid;gap:var(--gap)}
@media (min-width:1000px){.dl .hi-cards:where(:not(.v16-root *)){grid-template-columns:repeat(2,minmax(0,1fr))}}
.dl .hi-card:where(:not(.v16-root *)){display:grid;gap:12px;padding:18px 18px 20px}
.dl .hi-card .top:where(:not(.v16-root *)){display:flex;align-items:center;gap:12px}
.dl .hi-card .top .tx:where(:not(.v16-root *)){flex:1 1 auto;min-width:0;display:grid;gap:1px}
.dl .hi-card .top b:where(:not(.v16-root *)){font-size:var(--t-small);font-weight:var(--w-head)}
.dl .hi-card .top small:where(:not(.v16-root *)){font-size:var(--t-meta);color:var(--fg2)}
.dl .hi-card .top > .i:where(:not(.v16-root *)){flex:none;font-size:18px;color:var(--fg3)}
.dl .hi-card .fig:where(:not(.v16-root *)){display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.dl .hi-card .fig strong:where(:not(.v16-root *)){font-size:var(--t-title);font-weight:var(--w-head);letter-spacing:-.03em;line-height:1}
.dl .hi-card .foot:where(:not(.v16-root *)){font-size:var(--t-meta);color:var(--fg2);text-wrap:pretty}
/* added: the topic picker in the chosen paper's card */
.dl .mk-pick:where(:not(.v16-root *)){display:grid;gap:4px}
.dl .mk-pick .eyebrow:where(:not(.v16-root *)){padding-top:10px}
.dl .mk-pick .row:where(:not(.v16-root *)){width:100%;text-align:left}
.dl .mk-pick .row[aria-pressed="false"] .tick:where(:not(.v16-root *)){background:none;box-shadow:0 0 0 1.5px var(--line2) inset}
.dl .mk-pick .row[aria-pressed="false"] .tick svg:where(:not(.v16-root *)){visibility:hidden}
.dl .mk-pick-acts:where(:not(.v16-root *)){display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.dl .mk-pick-acts .btn-act:where(:not(.v16-root *)){flex:1 1 200px}
/* added: a question's table scrolls inside its card */
.dl .q .qtable:where(:not(.v16-root *)){max-width:100%;overflow-x:auto}
.dl .q .qtable :is(th,td):where(:not(.v16-root *)){padding:6px 10px;text-align:left;box-shadow:0 1px 0 var(--line)}
/* added: focus and anything brought into view stop clear of a bar pinned over the tabs (rule 37) */
@media (max-width:999px){
  html:has(.dl .mk-split:not([hidden]) .mk-pin){scroll-padding-bottom:calc(148px + env(safe-area-inset-bottom,0px))}
  html:has(.dl .pa-move){scroll-padding-bottom:calc(142px + env(safe-area-inset-bottom,0px))}
}