/* sierra2.xyz — one stylesheet for the whole site.
   Paper, ink and an examiner's red pen: white pages, blue-black text,
   red for marks and annotations, highlighter yellow for "learn this". */

/* ---------- Fonts (self-hosted, subset) ---------- */
@font-face{font-family:"Schola";src:url("/assets/fonts/schola-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Schola";src:url("/assets/fonts/schola-400i.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Schola";src:url("/assets/fonts/schola-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Schola";src:url("/assets/fonts/schola-700i.woff2") format("woff2");font-weight:700;font-style:italic;font-display:swap}
@font-face{font-family:"Heros Cn";src:url("/assets/fonts/heroscn-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Heros Cn";src:url("/assets/fonts/heroscn-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Sierra Symbols";src:url("/assets/fonts/sym-serif.woff2") format("woff2");font-display:swap}
@font-face{font-family:"Sierra Symbols";src:url("/assets/fonts/sym-serif-extra.woff2") format("woff2");unicode-range:U+221B,U+2070-209F,U+2150-215F,U+03D5,U+2190-21FF,U+22A5;font-display:swap}
@font-face{font-family:"Sierra Symbols Sans";src:url("/assets/fonts/sym-sans.woff2") format("woff2");font-display:swap}

/* ---------- Tokens ---------- */
:root{
  --paper:#FFFFFF;
  --shade:#F4F5F7;
  --ink:#1B2333;
  --ink-2:#4F596C;
  --ink-3:#687184;
  --rule:#DCE0E6;
  --rule-2:#BFC6D0;
  --red:#BC2B2B;
  --red-wash:#FBEDEC;
  --blue:#23469B;
  --blue-wash:#EDF1F9;
  --hi:#FFEA78;
  --hi-ink:#1B2333;
  --ok:#2C7A4B;
  --serif:"Schola","Sierra Symbols","Sierra Symbols Sans","Century Schoolbook","Georgia",serif;
  --sans:"Heros Cn","Sierra Symbols Sans","Helvetica Neue","Arial Narrow",Arial,sans-serif;
  --measure:42rem;
  /* categorical inks for the 6-mark timelines */
  --c1:#23469B; --c2:#BC2B2B; --c3:#A86A12; --c4:#2C7A4B; --c5:#6A3FA0; --c6:#6B7385;
  /* names used by the guides' markup */
  --field:var(--c1); --warn:var(--c2);
  --t-emi:var(--c1); --t-acc:var(--c5); --t-nuc:var(--c3); --t-part:var(--c4); --t-circ:var(--c6); --t-cap:var(--c2);
  --t-kt:var(--c1); --t-res:var(--c2); --t-fus:var(--c3); --t-th:var(--c4); --t-evo:var(--c5); --t-oth:var(--c6);
  --t-par:var(--c1); --t-ineq:var(--c2); --t-disc:var(--c3); --t-fac:var(--c4); --t-irr:var(--c5);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root{
    --paper:#12161D; --shade:#191E27; --ink:#E6E8ED; --ink-2:#A9B0BD; --ink-3:#8E96A5;
    --rule:#2A303B; --rule-2:#3D4553;
    --red:#FF8B80; --red-wash:#36201F; --blue:#9DB4FF; --blue-wash:#1B243A;
    --hi:#5C4F12; --hi-ink:#FFF3C4; --ok:#6CCF95;
    --c1:#9DB4FF; --c2:#FF8B80; --c3:#E2B05A; --c4:#6CCF95; --c5:#C3A2F2; --c6:#A3ABB8;
    color-scheme:dark;
  }
}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:4.5rem}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);font-size:1.0625rem;line-height:1.62;font-kerning:normal;text-rendering:optimizeLegibility;padding-bottom:env(safe-area-inset-bottom,0px)}
@media (min-width:64rem){body{font-size:1.125rem}}
img,svg{max-width:100%}
a{color:var(--blue);text-decoration-thickness:1px;text-underline-offset:.16em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--red);outline-offset:2px}
strong,b{font-weight:700}
sup,sub{line-height:0;font-size:.72em}
sup{vertical-align:.5em}
sub{vertical-align:-.25em}
mark{background:var(--hi);color:var(--hi-ink);padding:0 .15em}
hr{border:0;border-top:1px solid var(--rule);margin:2rem 0}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:var(--paper);padding:.5rem .75rem;font-family:var(--sans);z-index:100}
.skip:focus{left:.5rem}

/* ---------- Site header ---------- */
.site-header{position:relative;z-index:40;background:var(--paper);border-bottom:1px solid var(--rule);padding-top:env(safe-area-inset-top,0px)}
@media (min-width:64rem){.site-header{position:sticky;top:0}}
.site-header .site-bar{display:flex;align-items:center;gap:.75rem 1.25rem;max-width:76rem;margin:0 auto;padding:.55rem 1.1rem;min-height:3.25rem}
.wordmark{font-family:var(--serif);font-weight:700;font-size:1.2rem;color:var(--ink);text-decoration:none;letter-spacing:-.01em;line-height:1}
.wordmark span{color:var(--red)}
.crumb{font-family:var(--sans);font-size:1rem;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.crumb b{color:var(--ink)}
.switch{margin-left:auto;display:flex;gap:1.1rem;font-family:var(--sans);font-size:1rem;white-space:nowrap}
.switch a{color:var(--ink-2);text-decoration:none;padding:.35rem 0;border-bottom:2px solid transparent}
.switch a:hover{color:var(--ink)}
.switch a[aria-current="page"]{color:var(--ink);font-weight:700;border-bottom-color:var(--red)}
.toc-m{display:none}
@media (max-width:63.99rem){
  .site-header .site-bar{flex-wrap:wrap;padding:.5rem 1rem;gap:.35rem .9rem}
  .crumb{order:2;flex:1 1 100%;font-size:.95rem}
  .switch{order:1;gap:.9rem;font-size:.95rem}
  .doc .toc{display:none}
  html{scroll-padding-top:3.4rem}
  .toc-m{display:block;position:sticky;top:0;z-index:35;background:var(--paper);border-bottom:1px solid var(--rule);padding-top:env(safe-area-inset-top,0px)}
  .toc-m>summary{list-style:none;cursor:pointer;font-family:var(--sans);font-size:.98rem;padding:.55rem 1rem;display:flex;justify-content:space-between;color:var(--ink)}
  .toc-m>summary::-webkit-details-marker{display:none}
  .toc-m>summary::after{content:"Show";color:var(--blue)}
  .toc-m[open]>summary::after{content:"Hide"}
  .toc-m nav{max-height:min(70vh,32rem);overflow-y:auto;border-top:1px solid var(--rule);padding:.4rem 1rem 1rem;background:var(--paper)}
}
@media (max-width:30rem){.switch{font-size:.92rem;gap:.75rem}}

/* ---------- Footer ---------- */
.site-footer{border-top:1px solid var(--rule);margin-top:4rem;padding:1.5rem 0 2.5rem;font-family:var(--sans);font-size:.95rem;color:var(--ink-2)}
.site-footer .in{max-width:76rem;margin:0 auto;padding:0 1.1rem;display:flex;flex-wrap:wrap;gap:.5rem 2rem;justify-content:space-between}
.site-footer p{margin:0;max-width:44rem}
.site-footer a{color:var(--ink-2)}

/* ---------- Home ---------- */
.home{max-width:76rem;margin:0 auto;padding:2.6rem 1.1rem 0}
.home>*{max-width:58rem}
.home h1{font-weight:700;font-size:clamp(2.1rem,6.4vw,3.6rem);line-height:1.04;letter-spacing:-.018em;margin:0 0 1.1rem;max-width:15ch}
.home .intro{max-width:36rem;font-size:1.12rem;margin:0 0 .6rem;color:var(--ink)}
.home .aside{max-width:36rem;margin:0;color:var(--ink-2);font-size:1rem}
.sitting{margin:3rem 0 0;padding:0;list-style:none}
.exam-day{border-top:2px solid var(--ink);padding:.7rem 0 .4rem;margin:0}
.exam-day+.exam-day{margin-top:2.2rem}
.exam-day-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin:0 0 .3rem}
.exam-day-head h2{font-family:var(--sans);font-weight:700;font-size:1.15rem;margin:0;letter-spacing:.005em}
.countdown{font-family:var(--sans);font-size:1rem;color:var(--red);white-space:nowrap}
.countdown.past{color:var(--ink-3)}
.paper{display:grid;grid-template-columns:7.2rem minmax(0,1fr) auto;column-gap:1.4rem;align-items:baseline;padding:1rem 0 1.15rem;border-top:1px solid var(--rule)}
.exam-day-head+.paper{border-top:0}
.paper .code{margin:0;font-family:var(--sans);font-weight:700;font-size:2.05rem;line-height:1;letter-spacing:.01em;color:var(--ink)}
.paper .title{margin:0;font-size:1.22rem;font-weight:700;line-height:1.3}
.paper .when{margin:.15rem 0 .55rem;font-family:var(--sans);font-size:1rem;color:var(--ink-2)}
.paper .marks{margin:0;font-family:var(--serif);font-weight:700;font-size:1.15rem;color:var(--red);white-space:nowrap}
.paper .docs{display:flex;flex-wrap:wrap;gap:.35rem 1.6rem;margin:0;padding:0;list-style:none;font-size:1.08rem}
.paper .docs a{font-weight:700}
.paper .docs span{display:block;font-family:var(--sans);font-size:.95rem;color:var(--ink-2);font-weight:400}
@media (max-width:40rem){
  .paper{grid-template-columns:minmax(0,1fr) auto;row-gap:.25rem}
  .paper .code{font-size:1.75rem;grid-column:1}
  .paper .marks{grid-column:2;grid-row:1}
  .paper .body{grid-column:1/-1}
}
.home .notes{margin:3.2rem 0 0;padding-top:1rem;border-top:1px solid var(--rule);display:grid;gap:1.2rem 2.5rem;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr))}
.home .notes h2{font-family:var(--sans);font-size:1.05rem;margin:0 0 .3rem}
.home .notes p{margin:0;font-size:1rem;color:var(--ink-2)}

/* ---------- Document layout ---------- */
.doc{max-width:76rem;margin:0 auto;padding:0 1.1rem;display:grid;grid-template-columns:minmax(0,1fr)}
@media (min-width:64rem){
  .doc{grid-template-columns:14.5rem minmax(0,1fr);column-gap:3.2rem}
}
.doc .toc{position:sticky;top:4.2rem;align-self:start;max-height:calc(100vh - 5rem);overflow-y:auto;padding:2.4rem 0 2rem;font-family:var(--sans)}
.toc-title{font-family:var(--sans);font-size:.95rem;color:var(--ink-3);margin:0 0 .5rem}
.toc ol,.toc-m ol{list-style:none;margin:0;padding:0;font-family:var(--sans)}
.toc li,.toc-m li{margin:0}
.toc a,.toc-m a{display:block;padding:.28rem 0 .28rem .7rem;border-left:2px solid var(--rule);color:var(--ink-2);text-decoration:none;font-size:1rem;line-height:1.3}
.toc a:hover,.toc-m a:hover{color:var(--ink);border-left-color:var(--rule-2)}
.toc a.on{color:var(--ink);border-left-color:var(--red);font-weight:700}
.content{min-width:0;padding:1.8rem 0 0;max-width:var(--measure)}
@media (min-width:64rem){.content{padding-top:2.4rem}}
.content.wide{max-width:52rem}
.content.analysis :is(p,li,h1,h2,h3,blockquote){max-width:44rem}
.content.analysis .tbl :is(p,li),.content.analysis .figure :is(p){max-width:none}

/* ---------- Typography in documents ---------- */
.content h1{font-weight:700;font-size:clamp(2rem,5.4vw,3rem);line-height:1.06;letter-spacing:-.015em;margin:0 0 1rem}
.content.analysis h1{font-size:clamp(1.65rem,4.2vw,2.35rem);line-height:1.12;max-width:30ch}
.content h2{font-weight:700;font-size:clamp(1.45rem,3.6vw,1.8rem);line-height:1.18;letter-spacing:-.008em;margin:0 0 .6rem}
.content h3{font-family:var(--sans);font-weight:700;font-size:1.12rem;line-height:1.3;margin:1.6rem 0 .45rem;letter-spacing:.005em}
.content h4{font-family:var(--sans);font-weight:700;font-size:1.02rem;margin:1.1rem 0 .3rem}
:where(.content) p{margin:.6rem 0}
:where(.content) :is(ul,ol){margin:.55rem 0;padding-left:1.35rem}
:where(.content) li{margin:.32rem 0}
:where(.content) li::marker{color:var(--ink-3)}
.content section{margin-top:3.4rem;padding-top:1.15rem;border-top:1px solid var(--ink)}
.content section.hero-section,.content header+section{margin-top:2.6rem}
.content>h2,.content .md>h2{margin-top:3.2rem;padding-top:1.1rem;border-top:1px solid var(--ink)}
.content .md>h2:first-child{margin-top:1rem}
.lede{font-size:1.16rem;line-height:1.55;max-width:38rem;color:var(--ink)}
.src{display:none}
.meta-line{font-family:var(--sans);font-size:1rem;color:var(--ink-2);margin:.2rem 0 1.2rem}
.hint,.key,.note,.drill,.qfsum,.prog{color:var(--ink-2)}
.hint{font-size:.98rem}
.f,.eq{font-family:var(--serif);white-space:nowrap}
.f i,.eq i{font-style:italic}
.f.w,.fbox .f{white-space:normal}
.eq{display:block;overflow-x:auto;padding:.2rem 0}
.dm{display:block;overflow-x:auto;padding:.2rem 0}
svg.m{fill:currentColor;overflow:visible}
.swatch{background:var(--hi);color:var(--hi-ink);padding:0 .25em}

/* inline maths helpers from the P4 guide */
.fr{display:inline-flex;flex-direction:column;vertical-align:middle;text-align:center;line-height:1.15;margin:0 .12em;font-size:.9em}
.fr>span{padding:0 .18em}
.fr>span:first-child{border-bottom:1px solid currentColor}
.cv{display:inline-flex;flex-direction:column;vertical-align:middle;text-align:center;line-height:1.15;padding:.05em .4em;margin:0 .12em;border-left:1.5px solid currentColor;border-right:1.5px solid currentColor;border-radius:.55em;font-size:.88em}
.lim{display:inline-flex;flex-direction:column;vertical-align:middle;font-size:.66em;line-height:1.1;margin:0 .12em 0 .02em;text-align:left}
.lim sup,.lim sub{line-height:1.1;vertical-align:baseline;position:static;font-size:1em}
.ov{display:inline-block;position:relative;padding-top:.28em;line-height:1}
.ov::before{content:"";position:absolute;left:.05em;right:.28em;top:.1em;border-top:1.2px solid currentColor}
.ov::after{content:"";position:absolute;right:0;top:-.07em;border-top:.17em solid transparent;border-bottom:.17em solid transparent;border-left:.32em solid currentColor}

/* ---------- Guide hero ---------- */
header.hero,.content>header{margin:0 0 1rem}
header.hero h1{margin-top:0}

/* bar chart: where the marks come from */
.graph,.chart{margin:2.2rem 0 .6rem;padding:1.1rem 0 .4rem;border-top:1px solid var(--ink);border-bottom:1px solid var(--rule)}
.panel{background:none}
.graph h2,.chart h2{font-family:var(--sans);font-size:1.12rem;margin:0 0 .8rem;padding:0;border:0}
.row{display:grid;grid-template-columns:minmax(7.5rem,36%) minmax(0,1fr) 2.8em;align-items:center;gap:.7rem;margin:.32rem 0}
.row .lab{font-family:var(--sans);font-size:.98rem;line-height:1.2}
.row .lab a{color:var(--ink);text-decoration:none}
.row .lab a:hover{text-decoration:underline}
.row .num{font-family:var(--sans);font-weight:700;text-align:right;font-size:1rem;font-variant-numeric:tabular-nums}
.plot{position:relative;height:1rem}
.plot::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,var(--rule) 0 1px,transparent 1px 20%);opacity:.8}
.bar{position:absolute;left:0;top:.2rem;height:.6rem;background:var(--blue);width:calc(var(--a) / 25 * 100%)}
.err{position:absolute;top:.47rem;height:1px;background:var(--ink-2);left:calc(var(--lo) / 25 * 100%);width:calc((var(--hi) - var(--lo)) / 25 * 100%)}
.err::before,.err::after{content:"";position:absolute;top:-.25rem;width:1px;height:.55rem;background:var(--ink-2)}
.err::before{left:0}.err::after{right:0}
.scale20 .bar{width:calc(var(--a) / 20 * 100%)}
.scale20 .err{left:calc(var(--lo) / 20 * 100%);width:calc((var(--hi) - var(--lo)) / 20 * 100%)}
.axis{display:grid;grid-template-columns:minmax(7.5rem,36%) minmax(0,1fr) 2.8em;gap:.7rem;font-family:var(--sans);font-size:.85rem;color:var(--ink-3);margin-top:.3rem}
.axis .ticks{display:flex;justify-content:space-between}
.key{font-family:var(--sans);font-size:.95rem;line-height:1.45;margin:.7rem 0 .2rem}
.key b{display:inline-block;width:1.1rem;height:.55rem;background:var(--blue);vertical-align:middle;margin-right:.3rem}
.key s{display:inline-block;width:1.1rem;height:1px;background:var(--ink-2);vertical-align:middle;margin:0 .3rem 0 .8rem;text-decoration:none}
@media (max-width:30rem){.row,.axis{grid-template-columns:6.4rem minmax(0,1fr) 2.4em;gap:.5rem}.row .lab{font-size:.9rem}}

/* exam facts */
.facts{margin:1.2rem 0 1rem;border-top:1px solid var(--rule)}
.facts>div{display:grid;grid-template-columns:8.5rem minmax(0,1fr);gap:1rem;align-items:baseline;padding:.5rem 0;border-bottom:1px solid var(--rule)}
.facts b{font-family:var(--sans);font-size:1.22rem;line-height:1.2}
.facts span{font-size:1rem;color:var(--ink-2)}
@media (max-width:30rem){.facts>div{grid-template-columns:6.6rem minmax(0,1fr);gap:.7rem}.facts b{font-size:1.08rem}}

/* ---------- Plans and checklists ---------- */
.plan{list-style:none;margin:.6rem 0 1rem;padding:0;border-top:1px solid var(--rule)}
.content .plan>li{margin:0;display:grid;grid-template-columns:1.6rem minmax(0,1fr);gap:.7rem;align-items:start;padding:.7rem 0;border-bottom:1px solid var(--rule)}
.plan label{display:contents;cursor:pointer}
.plan input[type=checkbox]{width:1.15rem;height:1.15rem;margin:.3rem 0 0;accent-color:var(--red);cursor:pointer}
.plan .t{font-weight:700;display:block}
.plan .d{display:block;color:var(--ink-2);font-size:.98rem}
.plan .time{font-family:var(--sans);font-weight:700;color:var(--red);margin-right:.45rem}
.plan input:checked+span,.plan input:checked~span{color:var(--ink-3)}
.plan input:checked+span .t,.plan input:checked~span .t{text-decoration:line-through;text-decoration-color:var(--red);text-decoration-thickness:2px}
.content p.day{font-family:var(--sans);font-weight:700;font-size:1.1rem;margin:1.6rem 0 .3rem}
.prog{display:block;margin-top:.45rem;font-family:var(--sans);font-size:.98rem;font-weight:700;color:var(--red)}

/* ---------- Predictions ---------- */
.strip{display:grid;grid-template-columns:repeat(auto-fill,minmax(5.9rem,1fr));margin:.8rem 0 .5rem;padding:0 1px 1px 0}
.strip>div{background:var(--paper);padding:.45rem .55rem .5rem;font-family:var(--sans);font-size:.92rem;line-height:1.22;border:1px solid var(--rule);border-top:4px solid var(--c,var(--rule-2));margin:0 -1px -1px 0}
.strip>div b{display:block;font-size:.88rem;color:var(--ink-2);font-weight:700;margin-bottom:.1rem}
.strip>div.gap{border-top-style:dashed;background:var(--red-wash)}
p.legend,.legend{display:flex;flex-wrap:wrap;gap:.3rem 1.1rem;font-family:var(--sans);font-size:.95rem;color:var(--ink-2);margin:.4rem 0 1rem}
.legend>span::before{content:"";display:inline-block;width:.8rem;height:.8rem;background:var(--c);margin-right:.4rem;vertical-align:-.08rem}
ol.pred{list-style:none;padding:0;margin:.8rem 0;counter-reset:p}
.content ol.pred>li{counter-increment:p;position:relative;margin:0;padding:.8rem 0 .85rem 2.6rem;border-top:1px solid var(--rule)}
ol.pred>li::before{content:counter(p);position:absolute;left:0;top:.72rem;font-family:var(--sans);font-weight:700;font-size:1.35rem;line-height:1.1;color:var(--ink)}
.tag{display:block;font-family:var(--sans);font-weight:700;font-size:.98rem;margin:0 0 .1rem;color:var(--ink-2)}
.tag.top{color:var(--red)}
.tag.hi{color:var(--blue)}
.tag.mid{color:var(--ink)}
.tag.lo{color:var(--ink-3)}
.tier{margin:1.1rem 0;padding:.1rem 0 .1rem 1rem;border-left:5px solid var(--red)}
.tier.t2{border-left-width:3px}
.tier.t3{border-left:2px dashed var(--red)}
.tier.t4{border-left:2px dotted var(--ink-3)}
.tier h3{margin:.2rem 0 .3rem}

/* ---------- Heatmaps: marks per topic in every paper ---------- */
.tbl,.scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:.9rem 0;border:1px solid var(--rule)}
:where(.content) table{border-collapse:collapse;width:100%;font-family:var(--sans);font-size:.98rem;line-height:1.35;background:var(--paper)}
:where(.content) :is(th,td){border-bottom:1px solid var(--rule);padding:.42rem .6rem;text-align:left;vertical-align:top}
:where(.content) thead th{font-weight:700;border-bottom:1px solid var(--ink);vertical-align:bottom}
:where(.content) tbody tr:last-child>*{border-bottom:0}
table.g{min-width:39rem;font-size:.9rem;font-variant-numeric:tabular-nums}
table.g th,table.g td{padding:.32rem .2rem;text-align:center;border-bottom:1px solid var(--paper);border-right:1px solid var(--paper)}
table.g thead th{font-size:.82rem;line-height:1.1;color:var(--ink-2);font-weight:400;border-bottom:1px solid var(--ink);padding:.4rem .15rem}
table.g thead th.o{color:var(--ink);font-weight:700}
table.g tbody th,table.g thead th:first-child{position:sticky;left:0;z-index:1;text-align:left;background:var(--paper);white-space:nowrap;padding:.32rem .55rem .32rem .45rem;font-weight:400;border-right:1px solid var(--rule)}
table.g thead th:first-child{color:var(--ink-2)}
table.g th a{color:var(--ink);text-decoration:none}
table.g th a:hover{text-decoration:underline}
table.g td.l0{color:var(--ink-3)}
table.g td.l1{background:color-mix(in srgb,var(--blue) 10%,var(--paper))}
table.g td.l2{background:color-mix(in srgb,var(--blue) 24%,var(--paper))}
table.g td.l3{background:color-mix(in srgb,var(--blue) 44%,var(--paper))}
table.g td.l4{background:color-mix(in srgb,var(--blue) 72%,var(--paper));color:var(--paper);font-weight:700}
@media (prefers-color-scheme:dark){table.g td.l4{color:#0E1219}}
table.g .now{box-shadow:inset 2px 0 0 var(--red),inset -2px 0 0 var(--red)}
table.g thead th.now{color:var(--red);font-weight:700;box-shadow:inset 2px 0 0 var(--red),inset -2px 0 0 var(--red),inset 0 2px 0 var(--red)}
table.g tbody tr:last-child .now{box-shadow:inset 2px 0 0 var(--red),inset -2px 0 0 var(--red),inset 0 -2px 0 var(--red)}
table.g td.avg,table.g th.avg{font-weight:700;border-left:1px solid var(--ink);background:var(--paper)}
table.g tr.grp th{position:static;background:var(--shade);font-weight:700;text-align:left;padding:.3rem .5rem;border-right:0}
.heatnote{font-family:var(--sans);font-size:.95rem;color:var(--ink-2);margin:.4rem 0 0}

/* U2: presence grid built by script */
table.heat{border-collapse:separate;border-spacing:0;min-width:41rem;font-size:.9rem}
.heat caption{caption-side:bottom;text-align:left;padding:.6rem .7rem;color:var(--ink-2);font-size:.92rem}
.heat th,.heat td{padding:0;text-align:center;height:1.85rem;border-bottom:1px solid var(--rule)}
.heat thead th{font-size:.76rem;line-height:1.1;color:var(--ink-2);padding:.45rem 0;font-weight:400;width:1.45rem;min-width:1.45rem;border-bottom:1px solid var(--ink)}
.heat th.tp{position:sticky;left:0;z-index:2;background:var(--paper);text-align:left;padding:.3rem .6rem;font-weight:400;white-space:normal;line-height:1.22;min-width:10.5rem;max-width:10.5rem;border-right:1px solid var(--rule)}
.heat thead th.tp{font-weight:700}
.heat th.tp a{color:var(--ink);text-decoration:none}
.heat th.tp a:hover{text-decoration:underline}
.heat tr.grp th{background:var(--shade);text-align:left;padding:.35rem .7rem;font-weight:700;color:var(--ink)}
.heat tr.grp th span{position:sticky;left:.7rem}
.heat td i{display:inline-block;width:.6rem;height:.6rem;border-radius:50%;border:1px solid var(--rule-2)}
.heat td.y i{background:var(--red);border-color:var(--red)}
.heat .last{background:var(--red-wash)}
.heat td.ct{font-weight:700;padding:0 .45rem;white-space:nowrap}
@media (max-width:37.5rem){.heat th.tp{min-width:8.6rem;max-width:9.4rem;white-space:normal;font-size:.84rem;line-height:1.2;padding:.3rem .5rem}}

/* doc-style dot grid (U2 analysis) */
table.dots td{text-align:center;padding:.3rem 0}
table.dots td i{display:inline-block;width:.6rem;height:.6rem;border-radius:50%;border:1px solid var(--rule-2)}
table.dots td.y i{background:var(--blue);border-color:var(--blue)}
table.dots td.y.top i{background:var(--red);border-color:var(--red)}

/* simple horizontal bar chart (U5 analysis MCQs) */
.hbars{margin:1rem 0;padding:0;list-style:none;font-family:var(--sans)}
.hbars li{display:grid;grid-template-columns:minmax(8rem,34%) minmax(0,1fr);gap:.7rem;align-items:center;margin:.3rem 0}
.hbars .v{display:flex;align-items:center;gap:.5rem;font-weight:700;font-variant-numeric:tabular-nums}
.hbars .v i{display:block;height:.75rem;background:var(--ink-3);width:var(--w)}
.hbars li.top .v i{background:var(--red)}
.inline-bar{display:inline-block;height:.6rem;width:calc(var(--v) / 13 * 6rem);background:var(--blue);margin-right:.5rem;vertical-align:.02rem}

/* ---------- Topic sections ---------- */
.topic .meta{display:flex;flex-wrap:wrap;gap:.2rem 1.1rem;margin:.1rem 0 .8rem;padding:0;font-family:var(--sans);font-size:1rem;color:var(--red)}
.topic .meta span{border:0;padding:0;background:none}
.topic .meta span.blk{color:var(--ink);font-weight:700}
.topic .meta span span{color:inherit}
.fbox{display:flex;flex-wrap:wrap;gap:.4rem;margin:.8rem 0}
.fbox>span{display:inline-block;border:1px solid var(--rule-2);padding:.2rem .55rem;max-width:100%;overflow-x:auto}
.fbox>span.memo{background:var(--hi);color:var(--hi-ink);border-color:transparent}
ul.traps{list-style:none;padding-left:0}
ul.traps>li{position:relative;padding-left:1.4rem}
ul.traps>li::before{content:"✗";position:absolute;left:0;top:0;color:var(--red);font-family:var(--sans);font-weight:700}
.drill{font-family:var(--sans);font-size:1rem;margin-top:.8rem}
.drill b{color:var(--ink)}
.callout{border-left:3px solid var(--blue);padding:.2rem 0 .2rem 1rem;margin:1rem 0}
.callout.warn,.note.box,.content .note:not(p){border-left-color:var(--red)}
.callout.mem{border-left-color:var(--hi)}
.content div.note{border-left:3px solid var(--red);padding:.2rem 0 .2rem 1rem;margin:1rem 0}
ol.chain{padding-left:1.6rem}
ol.chain>li::marker,ol.pts>li::marker{color:var(--red);font-family:var(--sans);font-weight:700}
.two{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1rem 2rem;margin:.8rem 0}
.two>div{border-top:1px solid var(--rule);padding-top:.5rem}
.two h4{margin-top:0}
.two p{margin:.25rem 0;font-size:1rem}

/* expandable answers */
.content details{margin:0;border-top:1px solid var(--rule)}
.content details:last-of-type{border-bottom:1px solid var(--rule)}
.content details>summary{list-style:none;cursor:pointer;padding:.75rem 2.2rem .75rem 0;position:relative;font-weight:700;line-height:1.35}
.content details>summary::-webkit-details-marker{display:none}
.content details>summary::after{content:"+";position:absolute;right:.15rem;top:.5rem;font-family:var(--sans);font-size:1.6rem;font-weight:700;color:var(--red);line-height:1.1}
.content details[open]>summary::after{content:"−"}
.content details>summary:hover{color:var(--blue)}
details .in{padding:0 0 1rem}
details .q{color:var(--ink-2)}
details.six .src,details.six>summary .src{display:block;font-weight:400;font-family:var(--sans);font-size:.95rem;color:var(--ink-2)}
ol.pts{padding-left:1.6rem;margin:.1rem 0 .9rem}
.tools{display:flex;gap:.6rem;flex-wrap:wrap;margin:.4rem 0 .9rem}

/* U2 topics */
details.topic>summary{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.3rem 1rem;align-items:baseline}
.topic .t{font-weight:700;font-size:1.08rem}
.topic .ct{font-family:var(--sans);color:var(--red);font-weight:700;font-size:.95rem;white-space:nowrap;margin-right:.6rem}
.spark{grid-column:1/-1;display:flex;gap:3px;margin-top:.15rem}
.spark i{width:.45rem;height:.45rem;border-radius:50%;border:1px solid var(--rule-2)}
.spark i.y{background:var(--red);border-color:var(--red)}
.topic .body{padding:0 0 1.2rem}
ul.fl{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.4rem;margin:.6rem 0 .9rem}
ul.fl>li{margin:0;padding:.18rem .55rem;border:1px solid var(--rule-2);line-height:1.45}
ul.fl>li.no{background:var(--hi);color:var(--hi-ink);border-color:transparent}
.fl.wide>li{display:block;width:100%}
.fl.wide small{font-family:var(--sans);color:var(--ink-2);font-size:.88rem;margin-left:.4rem}
.chip{border:1px solid var(--rule-2);padding:0 .3rem}
.chip.no{background:var(--hi);color:var(--hi-ink);border-color:transparent}
.lbl{font-family:var(--sans);font-weight:700;color:var(--ink);margin:1rem 0 .1rem;font-size:1.02rem}
.try{margin:.9rem 0 0;font-family:var(--sans);font-size:1rem;color:var(--ink-2)}
.try b{color:var(--ink)}
.box{border-top:1px solid var(--ink);border-bottom:1px solid var(--rule);padding:.6rem 0;margin:1rem 0}
.tick{list-style:none;padding-left:0}
.tick>li{position:relative;padding-left:1.5rem}
.tick>li::before{content:"✓";position:absolute;left:0;top:0;color:var(--red);font-family:var(--sans);font-weight:700}
.cols{display:grid;grid-template-columns:1fr;gap:.2rem 2rem}
@media (min-width:45rem){.cols{grid-template-columns:1fr 1fr}}

/* ---------- Buttons ---------- */
.content button{font-family:var(--sans);font-size:.98rem;font-weight:700;cursor:pointer;color:var(--ink);background:var(--paper);border:1px solid var(--ink);border-radius:2px;padding:.32rem .8rem}
.content button:hover{background:var(--shade)}
.content button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.content button[hidden]{display:none}

/* ---------- P3: moves ---------- */
.index{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:.2rem 2rem;margin:.8rem 0}
.index h3{margin:1rem 0 .3rem}
.index ol{margin:0;padding:0;list-style:none}
.content .index li{margin:.15rem 0;display:grid;grid-template-columns:1.9rem minmax(0,1fr)}
.index li span{font-family:var(--sans);font-weight:700;color:var(--red)}
.index a{color:var(--ink);text-decoration:none}
.index a:hover{text-decoration:underline}
.content .legend:not(p){display:grid;grid-template-columns:auto 1fr;gap:.25rem .9rem;font-size:.98rem;color:var(--ink);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:.6rem 0;margin:1rem 0}
.content .legend:not(p)>b{font-family:var(--sans);color:var(--red)}
.blockh{margin:3.4rem 0 .2rem;display:flex;justify-content:space-between;align-items:baseline;gap:.6rem;flex-wrap:wrap;border-top:1px solid var(--ink);padding-top:1.1rem}
.content .blockh h2{border:0;padding:0;margin:0}
.blockh span{font-family:var(--sans);color:var(--ink-2)}
.move{margin:1.6rem 0 0;padding:0 0 .4rem;border-top:1px solid var(--rule)}
.mh{display:grid;grid-template-columns:2.6rem minmax(0,1fr);gap:.4rem;padding:.9rem 0 .2rem}
.mh .no{font-family:var(--sans);font-weight:700;font-size:1.9rem;line-height:1;color:var(--red)}
.content .mh h3{font-family:var(--serif);font-size:1.28rem;margin:0}
.mh .seen{margin:.25rem 0 0;color:var(--ink-2);font-family:var(--sans);font-size:.98rem}
.looks{margin:.6rem 0 .9rem;padding:.2rem 0 .2rem .9rem;border-left:3px solid var(--blue);font-style:italic}
.looks span{display:block;font-family:var(--sans);font-style:normal;font-weight:700;font-size:.92rem;color:var(--blue)}
.mkhead{display:grid;grid-template-columns:minmax(0,1fr) 4.2rem;font-family:var(--sans);font-size:.9rem;color:var(--ink-2);padding:0 0 .25rem 2.2rem}
.mkhead span:last-child{border-left:2px solid var(--red);text-align:center;color:var(--red)}
.lined{list-style:none;margin:0;padding:0;counter-reset:s}
.content .lined>li{display:grid;grid-template-columns:2.2rem minmax(0,1fr) 4.2rem;margin:0;border-top:1px solid var(--rule)}
.lined>li[hidden]{display:none}
.lined>li::before{counter-increment:s;content:counter(s);font-family:var(--sans);color:var(--ink-3);font-weight:700;padding:.55rem 0 .5rem .2rem}
.lined .tx{padding:.5rem .7rem .5rem 0;overflow-x:auto;min-width:0}
.lined .mk{border-left:2px solid var(--red);color:var(--red);font-family:var(--sans);font-weight:700;font-size:.98rem;line-height:1.3;padding:.55rem .2rem;text-align:center}
.we{margin:1rem 0 .4rem;border:1px solid var(--rule-2);background:var(--paper)}
.we .q{margin:0;padding:.7rem .9rem;background:var(--shade)}
.we .q span{display:block;font-family:var(--sans);font-weight:700;font-size:.95rem;color:var(--ink-2)}
.we .lined>li:first-child{border-top-color:var(--rule-2)}
.ctl{display:flex;gap:.6rem;padding:.7rem .9rem;border-top:1px solid var(--rule);flex-wrap:wrap}
.content .ctl .next{background:var(--ink);color:var(--paper)}
.content .ctl .next:hover{background:var(--ink-2)}
.slips{list-style:none;padding:0;margin:.9rem 0 .3rem}
.content .slips>li{position:relative;padding-left:1.4rem}
.slips>li::before{content:"✗";position:absolute;left:0;color:var(--red);font-family:var(--sans);font-weight:700}
.toolkit li{margin:.55rem 0}
table.pat td:first-child{width:46%}

/* quick-fire: index cards */
.qfbar{position:sticky;top:3.3rem;z-index:5;background:var(--paper);padding:.6rem 0;border-bottom:1px solid var(--rule)}
@media (max-width:63.99rem){.qfbar{top:2.55rem}}
.filters{display:flex;gap:.4rem;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.filters::-webkit-scrollbar{display:none}
.content .filters button{padding:.25rem .65rem;font-size:.95rem;white-space:nowrap;font-weight:400}
.qfsum{margin:.4rem 0 0;font-family:var(--sans);font-size:.98rem}
.deck{display:grid;grid-template-columns:repeat(auto-fill,minmax(14.5rem,1fr));gap:.9rem;margin:1rem 0}
.qf{background:var(--paper);border:1px solid var(--rule-2);padding:0 .9rem .8rem;display:flex;flex-direction:column;gap:.45rem}
.qf[hidden]{display:none}
.qtopic{display:block;font-family:var(--sans);font-size:.88rem;color:var(--ink-2);font-weight:700;margin:0 -.9rem .35rem;padding:.55rem .9rem .3rem;border-bottom:1px solid var(--red)}
.qf[data-s="y"]{border-color:var(--ok)}
.qf[data-s="n"]{border-color:var(--red)}
.qf[data-s="y"] .qtopic::after{content:" · got it last time";color:var(--ok)}
.qf[data-s="n"] .qtopic::after{content:" · redo this";color:var(--red)}
.qq{overflow-x:auto}
.qa{border-top:1px dashed var(--rule-2);padding-top:.45rem;overflow-x:auto}
.qbtn{display:flex;gap:.4rem;flex-wrap:wrap;margin-top:auto}
.content .qbtn button{padding:.2rem .6rem;font-size:.92rem}
.content .qbtn .yes{border-color:var(--ok);color:var(--ok)}
.content .qbtn .no{border-color:var(--red);color:var(--red)}
.content .qbtn .yes[aria-pressed="true"]{background:var(--ok);color:var(--paper)}
.content .qbtn .no[aria-pressed="true"]{background:var(--red);color:var(--paper)}
.content .reset{margin-top:.5rem;font-size:.9rem;padding:.15rem .6rem;font-weight:400}
.fl:not(ul){display:flex;flex-wrap:wrap;gap:.45rem;margin:.7rem 0}
.fl:not(ul)>span{border:1px solid var(--rule-2);padding:.3rem .6rem;max-width:100%;overflow-x:auto}
.fl.learn>span{background:var(--hi);color:var(--hi-ink);border-color:transparent}

/* ---------- Analysis pages ---------- */
.content .md table{font-size:.95rem}
.content .md .tbl{border:0;border-top:1px solid var(--ink);border-bottom:1px solid var(--rule);margin:1rem 0 1.2rem}
.content .md .tbl table{min-width:36rem}
.content .md .tbl.wide table{min-width:52rem}
.content .md td{font-variant-numeric:tabular-nums}
.content .md blockquote{margin:1rem 0;padding-left:1rem;border-left:3px solid var(--rule-2);color:var(--ink-2)}
.content .md h3{margin-top:2rem}
.figure{margin:1.6rem 0 1.4rem}
.figure h3,.figure .fig-title{font-family:var(--sans);font-size:1.08rem;margin:0 0 .15rem;font-weight:700}
.figure .fig-sub{font-family:var(--sans);color:var(--ink-2);margin:0 0 .5rem;font-size:.98rem}
.figure .tbl{border:1px solid var(--rule)}
.figure figcaption{font-family:var(--sans);font-size:.92rem;color:var(--ink-3);margin-top:.35rem}
.updated{font-family:var(--sans);color:var(--ink-2);font-size:1rem;margin:0 0 1.4rem}
.doc-end{margin-top:3rem;padding-top:1rem;border-top:1px solid var(--rule);font-family:var(--sans);font-size:.98rem;color:var(--ink-2)}
.doc-end p{margin:.3rem 0}
.content footer{margin-top:3rem;padding-top:1rem;border-top:1px solid var(--rule);font-family:var(--sans);font-size:.98rem;color:var(--ink-2)}
.wrap{max-width:none;margin:0;padding:0}

/* ---------- 404 ---------- */
.lost{max-width:76rem;margin:0 auto;padding:4rem 1.1rem}
.lost>*{max-width:40rem}
.lost h1{font-size:2.4rem;margin:0 0 .8rem}

/* ---------- Print ---------- */
@media print{
  .site-header,.toc,.toc-m,.site-footer,.tools,.ctl,.qfbar,.qbtn{display:none!important}
  body{font-size:11pt;color:#000;background:#fff}
  .doc{display:block;padding:0}
  .content{max-width:none;padding:0}
  .content details{border:0}
  .content details>summary::after{display:none}
  a{color:#000;text-decoration:none}
  .content section{break-inside:auto}
  table.g td.l4{color:#fff!important}
}
