/* The House Job — v2 design. Clinical reference for house officers. */
@font-face{font-family:"THJ Serif";src:url(fonts/serif.woff2) format("woff2");font-weight:200 900;font-display:swap}
@font-face{font-family:"THJ Sans";src:url(fonts/sans.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"THJ Sans";src:url(fonts/sans-italic.woff2) format("woff2");font-weight:100 900;font-style:italic;font-display:swap}

:root{
  --ink:#17212B; --ink2:#3E4C59; --mute:#66737F; --paper:#FFFFFF; --panel:#F2F5F7; --line:#DCE3E8; --line2:#C5D0D8;
  --g:#0E6B5C; --g2:#0A4E43; --gt:#E6F2EF;
  --red:#B42318; --redt:#FBEDEB; --amb:#8A5300; --ambt:#FDF3E1; --blue:#1F4F86; --bluet:#EAF1F8;
  --serif:"THJ Serif",Georgia,"Times New Roman",serif; --sans:"THJ Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --r:6px; --w:1120px; --measure:44rem;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --ink:#E7EDF2; --ink2:#C2CDD6; --mute:#93A1AD; --paper:#11181E; --panel:#18222A; --line:#26323C; --line2:#33424E;
  --g:#4FB8A2; --g2:#7FD3C1; --gt:#15302B; --red:#F08B80; --redt:#33191A; --amb:#E7B45A; --ambt:#2E2412; --blue:#8DB6E6; --bluet:#16263A}}
:root[data-theme="dark"]{
  --ink:#E7EDF2; --ink2:#C2CDD6; --mute:#93A1AD; --paper:#11181E; --panel:#18222A; --line:#26323C; --line2:#33424E;
  --g:#4FB8A2; --g2:#7FD3C1; --gt:#15302B; --red:#F08B80; --redt:#33191A; --amb:#E7B45A; --ambt:#2E2412; --blue:#8DB6E6; --bluet:#16263A}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.65 var(--sans)}
a{color:var(--g)}
a:hover{color:var(--g2)}
:focus-visible{outline:3px solid var(--g);outline-offset:2px;border-radius:3px}
img,svg{max-width:100%}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.2;color:var(--ink)}
h1{font-size:clamp(1.9rem,4.6vw,2.6rem);margin:.3em 0 .35em;letter-spacing:-.01em}
h2{font-size:1.55rem;margin:2.2rem 0 .7rem}
h3{font-size:1.2rem;margin:1.6rem 0 .5rem}
p{margin:.7em 0}
ul,ol{padding-left:1.25em;margin:.6em 0}
li{margin:.3em 0}
b,strong{font-weight:650}
.wrap{max-width:var(--w);margin:0 auto;padding:0 16px}
.muted{color:var(--mute)}
.small{font-size:.88rem}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:var(--paper);padding:8px;z-index:9}
hr{border:0;border-top:1px solid var(--line);margin:2rem 0}

/* header */
.top{border-bottom:1px solid var(--line);background:var(--paper);position:sticky;top:0;z-index:5}
.topin{display:flex;align-items:center;gap:14px;min-height:62px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.brand img{width:34px;height:34px;display:block}
.brand b{font-family:var(--serif);font-size:1.25rem;font-weight:600;white-space:nowrap}
.mainnav{display:flex;gap:2px;margin-left:auto;align-items:center}
.mainnav a{color:var(--ink2);text-decoration:none;padding:8px 10px;border-radius:var(--r);font-size:.95rem;font-weight:550;white-space:nowrap}
.mainnav a:hover,.mainnav a[aria-current]{color:var(--g2);background:var(--gt)}
.mainnav a.nre{background:var(--g);color:#fff;margin-left:6px}
.mainnav a.nre:hover{background:var(--g2);color:#fff}
.iconbtn{border:1px solid var(--line);background:var(--paper);color:var(--ink2);width:38px;height:38px;border-radius:var(--r);display:inline-grid;place-items:center;cursor:pointer;text-decoration:none}
.iconbtn svg{width:18px;height:18px}
@media (max-width:860px){
  .topin{flex-wrap:wrap;gap:8px;padding-top:8px}
  .mainnav{order:3;width:100%;margin:0 -16px;padding:0 10px 6px;overflow-x:auto;scrollbar-width:none}
  .mainnav::-webkit-scrollbar{display:none}
  .tools{margin-left:auto}
}
.tools{display:flex;gap:6px}

/* breadcrumbs, meta */
.crumbs{font-size:.88rem;color:var(--mute);margin:20px 0 0}
.crumbs a{color:var(--mute);text-decoration:none}.crumbs a:hover{color:var(--g)}
.lede{font-size:1.13rem;color:var(--ink2);max-width:var(--measure);margin-top:0}
.meta{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:.88rem;color:var(--mute);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:10px 0;margin:18px 0 22px}
.meta a{color:var(--mute)}

/* article layout */
.art{display:grid;grid-template-columns:minmax(0,1fr);gap:0 48px}
.art .main{min-width:0;max-width:var(--measure)}
.art .side{display:none}
@media (min-width:1000px){
  .art{grid-template-columns:220px minmax(0,1fr)}
  .art .side{display:block;grid-row:1/span 3}
  .art .side nav{position:sticky;top:84px;font-size:.9rem;border-left:2px solid var(--line);padding-left:14px;margin-top:26px}
  .art .side a{display:block;color:var(--ink2);text-decoration:none;padding:4px 0;line-height:1.35}
  .art .side a:hover{color:var(--g)}
  .art .side .lbl{font-weight:650;color:var(--ink);margin-bottom:6px}
  .tocm{display:none}
}
.tocm{border:1px solid var(--line);border-radius:var(--r);margin:0 0 20px;background:var(--panel)}
.tocm summary{padding:10px 14px;cursor:pointer;font-weight:600}
.tocm nav{padding:0 14px 12px;columns:2;column-gap:20px;font-size:.92rem}
.tocm a{display:block;padding:3px 0;color:var(--ink2);text-decoration:none;break-inside:avoid}
@media (max-width:480px){.tocm nav{columns:1}}

/* quick card: the clinical card */
.quick{border:1px solid var(--line2);border-radius:var(--r);margin:0 0 10px;display:grid;grid-template-columns:1fr 1fr;background:var(--paper)}
.qc{padding:14px 16px 12px;border-top:4px solid var(--c)}
.qc:nth-child(odd){border-right:1px solid var(--line)}
.qc:nth-child(n+3){border-top-width:4px;box-shadow:inset 0 1px 0 var(--line)}
.qc h3{font-family:var(--sans);font-size:.98rem;font-weight:700;margin:0 0 6px;color:var(--c)}
.qc ul{margin:0;padding-left:1.1em;font-size:.95rem;line-height:1.5}
.qc li{margin:.32em 0}
.qc.do{--c:var(--g)}.qc.dose{--c:var(--blue)}.qc.call{--c:var(--red)}.qc.miss{--c:var(--amb)}
@media (max-width:640px){.quick{grid-template-columns:1fr}.qc:nth-child(odd){border-right:0}.qc+.qc{box-shadow:inset 0 1px 0 var(--line)}}
.dnote{font-size:.84rem;color:var(--mute);margin:0 0 26px}

/* body blocks */
.blk{scroll-margin-top:80px}
.tip,.warn{border-left:4px solid var(--c);background:var(--bg);padding:12px 16px;margin:1.2em 0;border-radius:0 var(--r) var(--r) 0}
.tip{--c:var(--g);--bg:var(--gt)}.warn{--c:var(--red);--bg:var(--redt)}
.tip b.lab,.warn b.lab{display:block;font-size:.88rem;color:var(--c);margin-bottom:2px}
.tip p,.warn p{margin:0}

/* tables */
.tblw{overflow-x:auto;margin:1em 0;border:1px solid var(--line);border-radius:var(--r)}
table{border-collapse:collapse;width:100%;font-size:.93rem;line-height:1.45}
th,td{text-align:left;vertical-align:top;padding:9px 12px;border-bottom:1px solid var(--line)}
th{background:var(--panel);font-weight:650;color:var(--ink)}
tr:last-child td{border-bottom:0}
td:first-child{font-weight:600}
@media (max-width:600px){
  .tblw{border:0;overflow:visible}
  .tblw table,.tblw tbody,.tblw tr,.tblw td{display:block;width:100%}
  .tblw thead{display:none}
  .tblw tr{border:1px solid var(--line);border-radius:var(--r);margin:0 0 10px;padding:4px 0}
  .tblw td{border:0;padding:4px 12px}
  .tblw td:first-child{font-size:1rem;color:var(--ink);padding-top:8px}
  .tblw td:not(:first-child)::before{content:attr(data-l);display:block;font-size:.78rem;font-weight:650;color:var(--mute)}
}
.secblock a{text-decoration:none}.secblock a:hover{text-decoration:underline}

/* prescription slips */
.rx{border:1px solid var(--line2);border-radius:var(--r);margin:1.1em 0;overflow:hidden}
.rx .rxh{display:flex;align-items:baseline;gap:10px;padding:8px 14px;background:var(--bluet);border-bottom:1px solid var(--line)}
.rx .rxh i{font-family:var(--serif);font-size:1.45rem;font-weight:600;color:var(--blue);font-style:italic;line-height:1}
.rx .rxh span{font-size:.88rem;color:var(--ink2);font-weight:600}
.rxl{padding:10px 14px;border-bottom:1px dashed var(--line2)}
.rxl:last-child{border-bottom:0}
.rxl .dn{font-weight:700}
.rxl .dd{display:block;color:var(--ink)}
.rxl .dx{display:block;font-size:.88rem;color:var(--mute)}
.rxl .src{display:block;margin-top:2px;font-size:.82rem;color:var(--blue);text-decoration:none}
.rxl .src:hover{text-decoration:underline}

/* FAQ */
.faq details{border-bottom:1px solid var(--line);padding:4px 0}
.faq summary{cursor:pointer;font-weight:600;padding:8px 0;list-style:none;position:relative;padding-right:28px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:6px;font-size:1.2rem;color:var(--g)}
.faq details[open] summary::after{content:"–"}
.faq details p{margin:0 0 10px;color:var(--ink2)}

/* sources */
.refs ol{font-size:.92rem;color:var(--ink2)}
.refs li{margin:.35em 0}

/* test yourself */
.testy{border:1px solid var(--line2);border-radius:var(--r);padding:4px 18px 18px;margin:2.4rem 0 1.4rem}
.testy h2{margin-top:.8rem}
.tq{border-top:1px solid var(--line);padding:14px 0 6px}
.tq:first-of-type{border-top:0}
.stem{font-weight:550;margin:0 0 10px}
.stem .n{display:inline-block;min-width:1.6em;color:var(--mute);font-weight:600}
.opts{display:grid;gap:6px}
.qo{display:flex;gap:10px;text-align:left;font:inherit;font-size:.95rem;background:var(--paper);color:var(--ink);border:1px solid var(--line2);border-radius:var(--r);padding:9px 12px;cursor:pointer}
.qo:hover:not(:disabled){border-color:var(--g)}
.qo .l{font-weight:700;color:var(--mute)}
.qo.right{border-color:var(--g);background:var(--gt)}.qo.wrong{border-color:var(--red);background:var(--redt)}
.ans{font-size:.93rem;background:var(--panel);border-radius:var(--r);padding:8px 14px;margin-top:10px}
.cta{margin-top:14px}
.btn{display:inline-block;font:600 .95rem/1.2 var(--sans);text-decoration:none;padding:11px 16px;border-radius:var(--r);border:1px solid var(--line2);color:var(--ink);background:var(--paper);cursor:pointer}
.btn.pri{background:var(--g);border-color:var(--g);color:#fff}
.btn.pri:hover{background:var(--g2);color:#fff}

.artfoot{display:flex;flex-wrap:wrap;gap:10px 20px;justify-content:space-between;font-size:.9rem;border-top:1px solid var(--line);padding-top:14px;margin-top:20px}
.artfoot a{color:var(--mute)}
.wa{color:var(--g)!important;font-weight:600}
.related{margin:26px 0 0}
.related h2{font-size:1.2rem}
.related ul{list-style:none;padding:0;margin:0}
.related li{border-top:1px solid var(--line);padding:9px 0;margin:0}
.related a{font-weight:600;text-decoration:none}
.pn{display:flex;justify-content:space-between;gap:12px;margin:26px 0 40px;font-size:.93rem}
.pn a{text-decoration:none;font-weight:600}

/* lists of pages */
.plist{list-style:none;padding:0;margin:10px 0 30px;max-width:52rem}
.plist li{border-top:1px solid var(--line);margin:0}
.plist li:last-child{border-bottom:1px solid var(--line)}
.plist a{display:block;padding:13px 0;text-decoration:none;color:var(--ink)}
.plist a b{color:var(--g);font-weight:650;display:block;font-size:1.04rem}
.plist a span{display:block;color:var(--ink2);font-size:.93rem;margin-top:2px}
.plist a:hover b{text-decoration:underline}
.cols{display:grid;gap:8px 40px}
@media (min-width:780px){.cols{grid-template-columns:1fr 1fr}}
.secblock h2{font-size:1.25rem;margin:1.6rem 0 .2rem}
.secblock h2 a{text-decoration:none;color:var(--ink)}
.secblock h2 a:hover{color:var(--g)}
.secblock p{margin:0 0 .4rem;color:var(--ink2);font-size:.94rem}
.secblock ul{list-style:none;padding:0;margin:0 0 10px;font-size:.95rem}
.secblock li{margin:.2em 0}

/* search */
.search{position:relative;max-width:40rem;margin:18px 0 26px}
.search input{width:100%;font:inherit;font-size:1.02rem;padding:13px 14px;border:1px solid var(--line2);border-radius:var(--r);background:var(--paper);color:var(--ink)}
.search input:focus{outline:3px solid var(--gt);border-color:var(--g)}
.cres{display:grid}
.cres a{display:flex;justify-content:space-between;gap:12px;padding:10px 4px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}
.cres a small{color:var(--mute);white-space:nowrap}
.cres a b{font-weight:600}

/* home */
.hero{padding:34px 0 8px;max-width:46rem}
.hero h1{font-size:clamp(2.1rem,6vw,3.3rem);margin:0 0 10px}
.hero p{font-size:1.15rem;color:var(--ink2);margin:0}
.entry{display:grid;gap:14px;margin:22px 0 10px}
@media (min-width:780px){.entry{grid-template-columns:1fr 1fr}}
.entry a{display:block;border:1px solid var(--line2);border-radius:var(--r);padding:18px 20px;text-decoration:none;color:var(--ink)}
.entry a:hover{border-color:var(--g)}
.entry a b{font-family:var(--serif);font-size:1.35rem;font-weight:600;display:block;color:var(--ink)}
.entry a span{display:block;color:var(--ink2);margin-top:4px;font-size:.96rem}
.entry a em{display:block;font-style:normal;color:var(--g);font-weight:650;margin-top:10px;font-size:.95rem}
.strip{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 20px}
.strip a{border:1px solid var(--line);border-radius:999px;padding:6px 12px;font-size:.92rem;text-decoration:none;color:var(--ink2);background:var(--panel)}
.strip a:hover{border-color:var(--g);color:var(--g2)}
.install{display:none;align-items:center;gap:14px;border:1px solid var(--line);background:var(--panel);border-radius:var(--r);padding:12px 16px;margin:18px 0;max-width:46rem}
.install.show{display:flex}
.install p{margin:0;flex:1;font-size:.95rem}
.offl{font-size:.88rem;color:var(--mute)}
.offl b{color:var(--g)}

/* prose pages */
.prose{max-width:var(--measure)}
.prose h2{font-size:1.35rem}

/* drug page */
.dtable td:first-child{width:34%}
.brands{font-size:.95rem;color:var(--ink2)}

/* calculators */
.calc{border:1px solid var(--line2);border-radius:var(--r);padding:16px 18px;margin:16px 0 24px;max-width:var(--measure);background:var(--paper)}
.calc label{display:block;font-weight:600;margin:12px 0 4px;font-size:.95rem}
.calc input,.calc select{font:inherit;width:100%;max-width:22rem;padding:9px 10px;border:1px solid var(--line2);border-radius:var(--r);background:var(--paper);color:var(--ink)}
.calc .chk{display:flex;gap:10px;align-items:flex-start;font-weight:400;margin:8px 0}
.calc .chk input{width:auto;margin-top:5px}
.calc .out{margin-top:16px;padding:12px 14px;background:var(--gt);border-radius:var(--r);font-size:1.02rem}
.calc .out b{font-size:1.25rem}

/* footer */
footer.site{border-top:1px solid var(--line);margin-top:40px;padding:26px 0 40px;background:var(--panel);font-size:.9rem;color:var(--ink2)}
.fgrid{display:grid;gap:18px}
@media (min-width:780px){.fgrid{grid-template-columns:1.4fr 1fr 1fr 1fr}}
.fgrid h3{font-family:var(--sans);font-size:.92rem;margin:0 0 6px}
.fgrid ul{list-style:none;padding:0;margin:0}
.fgrid li{margin:.25em 0}
.fgrid a{color:var(--ink2);text-decoration:none}.fgrid a:hover{color:var(--g)}
.fbrand{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-size:1.15rem;font-weight:600;color:var(--ink)}
.fbrand img{width:30px;height:30px}
.disc{font-size:.84rem;color:var(--mute);margin-top:20px;max-width:56rem}

/* templates page */
.tpls{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;margin:18px 0;max-width:52rem}
.tpl{border:1px solid var(--line2);border-radius:var(--r);padding:16px 18px;min-width:0}
.tpl h2{font-size:1.25rem;margin:0 0 4px}
.tpl .acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.sheet{display:none}
@media print{
  @page{size:A4;margin:10mm}
  body{background:#fff;color:#000;font-size:10pt}
  .top,.site,.noprint,.crumbs,.tpls,.lede,h1.pg,.skip{display:none!important}
  .sheet.printing{display:block!important}
}
.sheet{font-family:Arial,Helvetica,sans-serif;color:#000;background:#fff}
.sheet h2{font-size:14pt;margin:0 0 2mm;border-bottom:2px solid #000;padding-bottom:1mm;display:flex;justify-content:space-between}
.sheet h2 small{font-size:8pt;font-weight:400}
.sheet .row{display:flex;gap:4mm;margin:1.5mm 0}
.sheet .f{flex:1;border-bottom:1px solid #555;min-height:6.5mm;font-size:8.5pt;padding-top:1mm;color:#333}
.sheet .box{border:1px solid #555;border-radius:2px;padding:1.2mm 2mm;margin:1.6mm 0;font-size:8.5pt;color:#222}
.sheet .box b{display:block;font-size:9pt;color:#000}
.sheet .lines{background:repeating-linear-gradient(transparent 0,transparent 6.2mm,#bbb 6.2mm,#bbb 6.5mm);}
.sheet .grid2{display:grid;grid-template-columns:1fr 1fr;gap:3mm}
.sheet .grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:3mm}
.sheet .ck{font-size:8.5pt;color:#222}.sheet .ck span{display:inline-block;margin-right:3mm}
.sheet .ck span:before{content:"☐ "}
.sheet .foot{font-size:7pt;color:#555;margin-top:2mm;display:flex;justify-content:space-between}
.preview{border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:14px;max-height:420px;overflow:auto;margin-top:10px}
.preview .sheet{display:block}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
html{scroll-behavior:smooth}

/* =================================================================== v3: app shell, colour, dashboard */
@font-face{font-family:"THJ Hand";src:url(fonts/hand.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"THJ Hand";src:url(fonts/hand-bold.woff2) format("woff2");font-weight:700;font-display:swap}
:root{--bg2:#F4F7F6;--side:#FFFFFF;--pk:#FBE3E7;--pkt:#97283F;--pe:#FCE7D4;--pet:#87470F;--shadow:0 1px 2px rgba(16,40,34,.05);--hand:"THJ Hand","Segoe Print","Bradley Hand",cursive;--note:#FFF3B0;--notei:#4A3B00}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg2:#0D1316;--side:#11181D;--pk:#3A1A22;--pkt:#F2A7B6;--pe:#3A2614;--pet:#F2C08F;--note:#3A3416;--notei:#F3E3A0}}
:root[data-theme="dark"]{--bg2:#0D1316;--side:#11181D;--pk:#3A1A22;--pkt:#F2A7B6;--pe:#3A2614;--pet:#F2C08F;--note:#3A3416;--notei:#F3E3A0}
body{background:var(--bg2)}

/* shell */
.app{display:block}
.appmain{min-width:0}
.dside{position:fixed;left:0;top:0;bottom:0;width:272px;z-index:60;background:var(--side);border-right:1px solid var(--line);overflow-y:auto;padding:18px 0 24px;transform:translateX(-100%);transition:transform .2s ease;scrollbar-width:thin}
.navopen .dside{transform:none}
.scrim{display:none}
.navopen .scrim{display:block;position:fixed;inset:0;background:rgba(10,20,18,.45);z-index:55}
@media (min-width:1080px){
  .app{display:grid;grid-template-columns:256px minmax(0,1fr)}
  .dside{position:sticky;height:100vh;transform:none;width:auto}
  .menubtn,.top .brand{display:none!important}
  .navopen .scrim{display:none}
}
.dbrand{padding:0 20px 16px;border-bottom:1px solid var(--line);margin-bottom:8px}
.dlogo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.dlogo b{font-family:var(--serif);font-size:1.3rem;font-weight:600}
.dby{display:inline-block;margin:4px 0 0 46px;font-size:.78rem;font-weight:650;color:var(--g);text-decoration:none;background:var(--gt);border-radius:999px;padding:2px 9px}
.dside nav a{display:flex;align-items:center;gap:12px;padding:8px 20px;color:var(--ink);text-decoration:none;font-size:.95rem;border-left:3px solid transparent}
.dside nav a svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;color:var(--ink2);flex:none}
.dside nav a span{flex:1}
.dside nav a:hover{background:var(--panel)}
.dside nav a.on{background:var(--gt);border-left-color:var(--g);font-weight:650}
.dside nav a.on svg{color:var(--g)}
.dgrp{font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mute);padding:16px 20px 6px}
.dgrp em{font-style:normal;text-transform:none;letter-spacing:0;color:var(--g);font-weight:650}
.bdg{font-style:normal;font-size:.7rem;font-weight:700;border-radius:999px;padding:2px 8px}
.bdg.nre{background:#DDF3EA;color:#0B6B4F}.bdg.soon{background:var(--panel);color:var(--mute)}
.dfoot{padding:18px 20px 0;font-size:.8rem;color:var(--mute)}.dfoot a{color:var(--mute)}
.top{position:sticky;top:0;z-index:20;background:var(--paper);border-bottom:1px solid var(--line)}
.topin{display:flex;align-items:center;gap:10px;min-height:60px;padding:0 16px;max-width:none;flex-wrap:nowrap}
.top .brand{gap:9px}.top .brand span{display:flex;flex-direction:column;line-height:1.05}
.top .brand b{font-size:1.15rem}.top .brand small{font-size:.72rem;color:var(--g);font-weight:650}
.tsearch{flex:1;max-width:560px;margin:0;position:relative}
.tsearch input{padding:9px 12px;font-size:.95rem;border-radius:8px;background:var(--bg2)}
.tsearch .cres{position:absolute;left:0;right:0;top:100%;background:var(--paper);border:1px solid var(--line);border-radius:8px;box-shadow:0 12px 30px -10px rgba(0,0,0,.25);max-height:60vh;overflow:auto;padding:0 10px}
.tsearch .cres:empty{display:none}
.tools{margin-left:auto}
.tsico{display:none}
@media (max-width:1079px){.tsearch{display:none}.tsico{display:inline-grid}}
.dashpage .tsearch{visibility:hidden}
footer.site{margin-top:40px}

/* colour accents everywhere */
.art{--ac:var(--g)}
.seclab{display:inline-block;font-weight:650;color:var(--ac,var(--g));background:color-mix(in srgb,var(--ac,var(--g)) 12%,var(--paper));border-radius:999px;padding:1px 10px;text-decoration:none}
.art .main h2{position:relative;padding-left:14px}
.art .main h2::before{content:"";position:absolute;left:0;top:.2em;bottom:.2em;width:4px;border-radius:2px;background:var(--ac)}
.art .main th{background:color-mix(in srgb,var(--ac) 13%,var(--paper));color:var(--ink);border-bottom:2px solid color-mix(in srgb,var(--ac) 45%,var(--paper))}
.art .main tr:nth-child(even) td{background:color-mix(in srgb,var(--ac) 3%,var(--paper))}
.art .main .tblw{border-color:color-mix(in srgb,var(--ac) 25%,var(--line))}
.art .side nav{border-left-color:color-mix(in srgb,var(--ac) 35%,var(--line))}
a.al{color:var(--blue);text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--blue) 35%,transparent);text-decoration-thickness:1px;text-underline-offset:3px}
a.al:hover{text-decoration-color:var(--blue);text-decoration-thickness:2px}
h1.ach{position:relative;padding-left:16px}h1.ach::before{content:"";position:absolute;left:0;top:.15em;bottom:.15em;width:5px;border-radius:3px;background:var(--ac)}
.gcards{list-style:none;padding:0;display:grid;gap:10px}
@media (min-width:640px){.gcards{grid-template-columns:1fr 1fr}}
.plist.gcards li{margin:0}
.plist.gcards a,.gcard{display:block;height:100%;background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--ac);border-radius:10px;padding:12px 14px;text-decoration:none;color:var(--ink);transition:transform .12s,box-shadow .12s}
.plist.gcards a:hover,.gcard:hover{transform:translateY(-2px);box-shadow:0 8px 20px -12px color-mix(in srgb,var(--ac) 60%,transparent)}
.plist.gcards a b,.gcard b{display:block;font-weight:650;font-size:1rem;margin-bottom:2px}
.plist.gcards a span,.gcard span{display:block;font-size:.87rem;color:var(--ink2);line-height:1.45}
.seccards{display:grid;gap:16px;margin-top:20px}
@media (min-width:760px){.seccards{grid-template-columns:1fr 1fr}}
.seccard{background:var(--paper);border:1px solid var(--line);border-top:4px solid var(--ac);border-radius:10px;padding:16px 18px}
.seccard h2{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin:0 0 4px;font-size:1.25rem}
.seccard h2 a{color:var(--ink);text-decoration:none}.seccard h2 a:hover{color:var(--ac)}
.seccard h2 small{font-family:var(--sans);font-size:.78rem;font-weight:700;color:var(--ac);background:color-mix(in srgb,var(--ac) 12%,var(--paper));border-radius:999px;padding:2px 9px;white-space:nowrap}
.seccard p{margin:0 0 8px;color:var(--ink2);font-size:.92rem}
.seccard ul{margin:0;padding-left:18px;columns:2;column-gap:20px;font-size:.92rem}
@media (max-width:480px){.seccard ul{columns:1}}
.seccard li{break-inside:avoid;margin:2px 0}.seccard li::marker{color:var(--ac)}
.seccard li a{color:var(--ink2);text-decoration:none}.seccard li a:hover{color:var(--ac);text-decoration:underline}

/* handwritten senior's tips */
.tip.note,.sticky{position:relative;background:var(--note);color:var(--notei);border:0;border-radius:3px 3px 12px 3px;padding:16px 18px 14px;margin:1.5em 6px;transform:rotate(-.6deg);box-shadow:0 1px 1px rgba(0,0,0,.06),0 10px 18px -12px rgba(80,60,0,.45);font-family:var(--hand);font-size:1.18rem;line-height:1.45}
.tip.note::before,.sticky::before{content:"";position:absolute;top:-9px;left:50%;width:84px;height:20px;margin-left:-42px;background:rgba(255,255,255,.55);border:1px solid rgba(0,0,0,.05);transform:rotate(-2deg)}
.tip.note b.lab,.sticky>b{display:block;font-family:var(--hand);font-weight:700;font-size:1.05rem;color:#B5651D;margin-bottom:2px}
.tip.note p{margin:0}
.tip.note a{color:inherit}

/* dashboard */
.dmain{padding:10px 16px 30px;max-width:1240px;margin:0 auto}
@media (min-width:1080px){.dmain{padding:14px 28px 40px}}
.welcome{padding:22px 0 18px}
.hello{margin:0 0 4px;font-family:var(--hand);font-size:1.3rem;color:#B5651D}
.welcome h1{font-size:clamp(1.9rem,4vw,2.8rem);line-height:1.1;margin:0 0 10px;letter-spacing:-.01em}
.welcome .sub{margin:0;color:var(--ink2);font-size:1.02rem;max-width:44rem}
.search.big{max-width:720px;margin:18px 0 0}
.search.big input{padding:15px 16px;font-size:1.05rem;border-radius:10px;box-shadow:0 6px 20px -14px rgba(14,60,50,.5);border-color:var(--line2)}
.dcols{display:flex;flex-direction:column;gap:18px}
.dcol{display:contents}
.o1{order:1}.o2{order:2}.o3{order:3}.o4{order:4}.o5{order:5}.o6{order:6}.o7{order:7}.o8{order:8}.o9{order:9}
@media (min-width:980px){
  .dcols{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(300px,1fr);align-items:start;gap:20px}
  .dcol{display:flex;flex-direction:column;gap:18px}
}
.card{background:var(--paper);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);min-width:0}
.card .hd{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:13px 18px;border-bottom:1px solid var(--line);font-size:.78rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink2)}
.card .hd a,.card .hd .muted,.linkbtn{font-size:.85rem;font-weight:600;letter-spacing:0;text-transform:none}
.card .hd a{color:var(--g)}
.linkbtn{background:none;border:0;color:var(--mute);cursor:pointer;font-family:inherit;text-decoration:underline}
.card .bd{padding:16px 18px}
.rots{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.rots button{font:inherit;font-size:.9rem;font-weight:600;padding:7px 13px;border-radius:999px;border:1px solid var(--line2);background:var(--paper);color:var(--ink2);cursor:pointer}
.rots button:hover{border-color:var(--ac);color:var(--ac)}
.rots button[aria-selected="true"]{background:var(--ac);border-color:var(--ac);color:#fff}
.calls{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media (min-width:600px){.calls{grid-template-columns:repeat(3,1fr)}}
.call{display:block;border-radius:10px;padding:11px 13px;text-decoration:none;background:color-mix(in srgb,var(--ac) 10%,var(--paper));border:1px solid color-mix(in srgb,var(--ac) 22%,var(--paper));transition:transform .12s}
.call:hover{transform:translateY(-2px)}
.call b{display:block;color:var(--ac);font-weight:700;font-size:1rem}
.call span{display:block;font-size:.84rem;color:var(--ink2)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips .c{border-radius:999px;padding:6px 12px;font-size:.88rem;font-weight:650;text-decoration:none}
.c.pk{background:var(--pk);color:var(--pkt)}.c.pe{background:var(--pe);color:var(--pet)}.c.gr{background:var(--gt);color:var(--g2)}.c.bl{background:var(--bluet);color:var(--blue)}
.lab{display:block;font-size:.72rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--mute);margin:0 0 8px}
.chips+.lab{margin-top:16px}
.bd.rows{padding:4px 18px 8px;display:grid}
.hrow{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink);font-size:.96rem}
.hrow:last-child{border-bottom:0}.hrow:hover span{color:var(--g)}
.hrow small{color:var(--mute);font-size:.8rem;white-space:nowrap}
/* product shelf */
.shelf{display:flex;flex-direction:column;gap:10px}
.shelfh{display:flex;justify-content:space-between;align-items:baseline;padding:0 2px}
.shelfh b{font-family:var(--serif);font-size:1.2rem;font-weight:600}
.shelfh a{font-size:.82rem;font-weight:700;color:var(--g);text-decoration:none;background:var(--gt);border-radius:999px;padding:2px 10px}
.prod{display:block;position:relative;border-radius:12px;padding:16px 18px;text-decoration:none;color:var(--ink);background:var(--paper);border:1px solid var(--line);overflow:hidden}
.prod::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:var(--pc)}
.prod.nre{--pc:#0E8A6A;background:linear-gradient(135deg,#0B6B55 0%,#0E8A6A 55%,#18A57E 100%);color:#fff;border:0;box-shadow:0 14px 30px -18px rgba(11,107,85,.8)}
.prod.fcps{--pc:#2F5BD3}.prod.fy{--pc:#E5664B}
.prodtop{display:flex;justify-content:space-between;align-items:center;gap:8px}
.pname{font-family:var(--serif);font-size:1.3rem;font-weight:600}
.pbadge{font-size:.72rem;font-weight:700;border-radius:999px;padding:3px 9px;background:rgba(255,255,255,.2);color:#fff}
.pbadge.soon{background:color-mix(in srgb,var(--pc) 12%,var(--paper));color:var(--pc)}
.prod p{margin:6px 0 0;font-size:.9rem;line-height:1.5;color:var(--ink2)}
.prod.nre p{color:rgba(255,255,255,.9)}
.pstats{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 0}
.pstats span{font-size:.78rem;font-weight:650;background:rgba(255,255,255,.16);border-radius:999px;padding:3px 9px}
.prod .bar{height:6px;border-radius:99px;background:rgba(255,255,255,.22);margin:12px 0;overflow:hidden}
.prod .bar i{display:block;height:100%;width:0;background:#FFD66B;border-radius:99px}
.pgo{display:inline-block;background:#fff;color:#0B6B55;font-weight:700;font-size:.92rem;border-radius:8px;padding:9px 14px}
.prod.nre:hover .pgo{background:#FFD66B}
.prod.fcps:hover,.prod.fy:hover{border-color:var(--pc)}
.pnote{margin:2px 2px 0;font-size:.84rem;color:var(--mute)}
/* question of the day */
.qs{margin:0 0 12px;font-size:.98rem;line-height:1.5}
.qo{display:grid;gap:8px}
.qo button{display:flex;gap:10px;align-items:flex-start;text-align:left;font:inherit;font-size:.93rem;padding:9px 12px;border:1px solid var(--line2);border-radius:8px;background:var(--paper);color:var(--ink);cursor:pointer}
.qo button span{flex:none;width:22px;height:22px;border-radius:50%;background:var(--panel);display:grid;place-items:center;font-size:.76rem;font-weight:700}
.qo button:hover:not(:disabled){border-color:var(--g)}
.qo button.ok{border-color:var(--g);background:var(--gt)}.qo button.ok span{background:var(--g);color:#fff}
.qo button.no{border-color:var(--red);background:var(--redt)}.qo button.no span{background:var(--red);color:#fff}
.qx{margin-top:12px;font-size:.9rem;color:var(--ink2);line-height:1.55}
.qx b.g{color:var(--g)}.qx b.r{color:var(--red)}
.qa{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;margin-top:12px}
.qa .wa{font-size:.86rem;font-weight:600;color:var(--g)}
.btn.soft{background:var(--gt);border-color:transparent;color:var(--g2);white-space:nowrap}
.btn.soft:hover{background:var(--g);color:#fff}
/* sticky tip on the dashboard */
.sticky{margin:8px 4px 4px;transform:rotate(.8deg)}
.sticky p{margin:0 0 10px}
.tipf{display:flex;justify-content:space-between;gap:10px;align-items:center;font-family:var(--sans);font-size:.82rem}
.tipf a{color:#8A4B12;font-weight:650}
.tipf button{font:inherit;font-weight:650;background:rgba(255,255,255,.6);border:1px solid rgba(0,0,0,.08);border-radius:999px;padding:4px 10px;cursor:pointer;color:var(--notei)}
.dashpage .install{max-width:none;background:var(--paper);margin-top:18px}
@media (max-width:560px){.card .hd{padding:12px 14px}.card .bd{padding:14px}}
@media (prefers-reduced-motion:reduce){.gcard,.call,.plist.gcards a{transition:none}}
.waico{width:17px;height:17px;vertical-align:-3px;margin-right:6px;flex:none}
a.wa{display:inline-flex;align-items:center;font-weight:600;color:#128C4A;text-decoration:none;border:1px solid #BFE9CF;background:#EFFBF3;border-radius:999px;padding:3px 11px 3px 9px;font-size:.88rem}
a.wa:hover{background:#DDF6E6}
:root[data-theme="dark"] a.wa{background:#12301F;border-color:#1F5235;color:#7BE0A4}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) a.wa{background:#12301F;border-color:#1F5235;color:#7BE0A4}}
.authbtns{display:flex;gap:8px;align-items:center;margin-right:4px}
.abtn{display:inline-flex;align-items:center;gap:8px;font:600 .9rem var(--sans);padding:8px 13px;border-radius:9px;border:1px solid var(--line2);background:var(--paper);color:var(--ink);text-decoration:none;white-space:nowrap}
.abtn:hover{border-color:var(--g)}
.abtn.p{background:var(--g);border-color:var(--g);color:#fff}.abtn.p:hover{background:var(--g2)}
.abtn.g{background:#fff;color:#1F1F1F}
.abtn.g span{display:none}.abtn.g{padding:8px 10px}
@media (max-width:640px){.abtn.g,.abtn.p{display:none}.abtn{padding:7px 11px;font-size:.86rem}}
.abtn.me{background:var(--gt);color:var(--g2);border-color:transparent}
/* home option D */
.hd2{padding-top:26px}
.split{display:grid;gap:30px;align-items:center}
@media (min-width:1000px){.split{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}}
.scopy h1{font-size:clamp(2rem,4vw,2.9rem);line-height:1.08;margin:2px 0 12px;letter-spacing:-.01em}
.scopy .sub{color:var(--ink2);font-size:1.06rem;margin:0;max-width:36rem}
.collage{position:relative;height:330px}
@media (max-width:999px){.collage{display:none}}
.cc{position:absolute;display:block;background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:14px 16px;font-size:.88rem;color:var(--ink);text-decoration:none;box-shadow:0 22px 40px -26px rgba(0,0,0,.55);transition:transform .25s ease,box-shadow .25s ease}
.cc:hover{z-index:5;box-shadow:0 26px 46px -24px rgba(0,0,0,.6)}
.cc ul{margin:6px 0 0;padding-left:16px;line-height:1.6}.cc p{margin:6px 0 0}
.cc b.g{color:#0E6B5C}.cc b.bl{color:#2F6FD6}.cc b.lb{font-size:.72rem;letter-spacing:.07em;text-transform:uppercase;color:var(--ink2)}
.cc small{display:block;color:#2F6FD6;font-size:.78rem;margin-top:4px}
.cc .ans{display:block;margin-top:8px;border:1px solid var(--g);background:var(--gt);border-radius:8px;padding:6px 10px}
.c1{left:4%;top:4px;width:62%;border-top:4px solid #0E6B5C;transform:rotate(-3deg)}.c1:hover{transform:rotate(-1deg) translateY(-4px)}
.c2{right:0;top:36px;width:44%;border-top:4px solid #2F6FD6;transform:rotate(2.5deg)}.c2:hover{transform:rotate(1deg) translateY(-4px)}
.c2 p{font-size:1.05rem}
.c3{left:14%;top:168px;width:62%;transform:rotate(1deg)}.c3:hover{transform:rotate(0) translateY(-4px)}
.c4{right:3%;top:212px;width:36%;background:var(--note);border:0;color:var(--notei);font-family:var(--hand);font-size:1.12rem;line-height:1.35;transform:rotate(-2deg)}.c4:hover{transform:rotate(-1deg) translateY(-4px)}
.apps{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin:30px 0 20px}
@media (min-width:720px){.apps{grid-template-columns:repeat(4,1fr);gap:16px}}
.ap{display:block;background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:20px 14px 18px;text-align:center;text-decoration:none;color:var(--ink);box-shadow:0 10px 26px -22px rgba(0,0,0,.5);transition:transform .15s ease,box-shadow .15s ease}
.ap:hover{transform:translateY(-3px);box-shadow:0 18px 30px -22px rgba(0,0,0,.55)}
.ap .sq{width:60px;height:60px;border-radius:17px;margin:0 auto 10px;display:grid;place-items:center;box-shadow:0 10px 18px -10px var(--sh)}
.ap .sq svg{width:28px;height:28px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ap b{display:block;font-size:1rem}.ap .ds{display:block;font-size:.84rem;color:var(--mute);margin-top:2px}
.ban{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px;border-radius:18px;padding:22px 26px;color:#fff;text-decoration:none;background:linear-gradient(110deg,#0A5C4A,#0E8A6A 60%,#2FB3C9);box-shadow:0 18px 36px -24px rgba(11,107,85,.8)}
.ban>div{flex:1;min-width:240px}
.ban b{font-family:var(--serif);font-size:1.45rem;font-weight:600}.ban b small{font-family:var(--sans);font-size:.8rem;font-weight:700;background:rgba(255,255,255,.18);border-radius:999px;padding:2px 9px;margin-left:6px;vertical-align:3px}
.ban p{margin:6px 0 0;opacity:.92}.ban .bstats{font-weight:650;opacity:1}
.bgo{background:#FFD66B;color:#3D2E00;font-weight:700;border-radius:10px;padding:11px 18px}
.ban:hover .bgo{background:#FFE08F}
.comingsoon{margin:12px 2px 0;color:var(--mute);font-size:.9rem}
.dashpage .install{margin-top:20px}
@media (prefers-reduced-motion:reduce){.cc,.ap{transition:none}}
@media (max-width:420px){.top .brand b{font-size:1rem}.top .brand img{width:28px;height:28px}.topin{gap:6px;padding:0 10px}.tools{gap:4px}.tsico{display:none}}
/* v4: no permanent sidebar; centred, symmetrical layout with top navigation */
@media (min-width:1080px){
  .app{display:block}
  .dside{position:fixed;height:auto;transform:translateX(-100%);width:272px}
  .navopen .dside{transform:none}
  .navopen .scrim{display:block}
  .top .brand{display:flex!important}
  .menubtn{display:none!important}
}
.topin{max-width:1240px;margin:0 auto;padding:0 24px}
.tnav{display:none;gap:2px;align-items:center;margin-left:22px}
.tnav a{color:var(--ink2);text-decoration:none;padding:8px 11px;border-radius:8px;font-weight:550;font-size:.94rem;white-space:nowrap}
.tnav a:hover,.tnav a[aria-current]{background:var(--gt);color:var(--g2)}
.tnav a.tnre{color:var(--g);font-weight:700}
@media (min-width:1080px){.tnav{display:flex}.tsearch{display:none}.tsico{display:inline-grid}}
@media (min-width:1080px) and (max-width:1279px){.tnav a{padding:8px 8px;font-size:.9rem}}
.dmain{max-width:1180px;margin:0 auto}
.hd2 .ban{margin-top:26px}
.hd2 .apps{margin-top:22px}
.hd2 .comingsoon{text-align:center}
.split{padding-top:6px}
.abtn svg{flex:none;max-width:none;width:17px;height:17px}
.top .brand{flex:none}.tnav{margin-left:26px}
.topin{min-width:0}.tools{flex:none}

.ban.fcps{background:linear-gradient(110deg,#1B3A8F,#2F5BD3 60%,#5B8DEF);box-shadow:0 18px 36px -24px rgba(36,72,184,.8)}.hd2 .ban.fcps{margin-top:14px}
/* home: exam cards in the hero (replaces the collage and the full-width banners) */
.xcards{display:grid;gap:14px}
.xc{display:flex;flex-direction:column;gap:8px;border-radius:18px;padding:20px 22px;color:#fff;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}
.xc.nre{background:linear-gradient(115deg,#0A5C4A,#0E8A6A 60%,#2FB3C9);box-shadow:0 18px 36px -24px rgba(11,107,85,.8)}
.xc.fcps{background:linear-gradient(115deg,#1B3A8F,#2F5BD3 60%,#5B8DEF);box-shadow:0 18px 36px -24px rgba(36,72,184,.8)}
.xc:hover,.xc:focus-visible,.xc:hover *,.ban:hover,.ban:hover *{color:#fff}
.xc:hover{transform:translateY(-2px)}
.xc:hover .bgo,.ban:hover .bgo{color:#3D2E00}
.xt{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.xt b{font-family:var(--serif);font-size:1.4rem;font-weight:600}
.xt small{font-size:.76rem;font-weight:700;background:rgba(255,255,255,.18);border-radius:999px;padding:2px 9px}
.xd{opacity:.94;line-height:1.45}
.xs{display:flex;flex-wrap:wrap;gap:6px}.xs i{font-style:normal;font-size:.8rem;font-weight:650;background:rgba(255,255,255,.16);border-radius:999px;padding:3px 10px}
.xf{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:4px}
.xp{font-weight:650;font-size:.9rem}
.xc .bgo{padding:9px 16px}
@media (max-width:999px){.xcards{margin-top:6px}}
@media (prefers-reduced-motion:reduce){.xc{transition:none}.xc:hover{transform:none}}

/* ---- v3 guide diagrams (::: blocks) ---- */
:root{--pur:#5B3E96;--purt:#F1ECF9;--gry:#4A5865;--gryt:#F2F5F7}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--pur:#B9A2EC;--purt:#241B36;--gry:#AAB6C1;--gryt:#1B252D}}
:root[data-theme="dark"]{--pur:#B9A2EC;--purt:#241B36;--gry:#AAB6C1;--gryt:#1B252D}
.c-red{--c:var(--red);--t:var(--redt)}.c-amber{--c:var(--amb);--t:var(--ambt)}.c-green{--c:var(--g);--t:var(--gt)}
.c-blue{--c:var(--blue);--t:var(--bluet)}.c-purple{--c:var(--pur);--t:var(--purt)}.c-grey{--c:var(--gry);--t:var(--gryt)}
figure.vflow,figure.vtree,figure.vtime,figure.vlet{margin:1.4em 0;padding:14px 16px 16px;border:1px solid var(--line2);border-radius:10px;background:var(--paper)}
figure figcaption{font:700 .8rem/1.3 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--mute);margin:0 0 12px}
.vcase{border:1px solid var(--line2);border-left:5px solid var(--blue);background:var(--bluet);border-radius:0 10px 10px 0;padding:12px 16px;margin:1.2em 0}
.vcase .lab{display:block;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--blue)}
.vcase p{margin:.35em 0}
.vbox{border:1px solid var(--c);border-radius:10px;margin:1.2em 0;overflow:hidden;background:var(--paper)}
.vbh{background:var(--c);color:var(--paper);font-weight:700;font-size:.95rem;padding:7px 14px}
.vbb{padding:6px 16px 8px;background:var(--t)}
.vbb>ul,.vbb>ol{padding-left:1.15em}
/* flow: numbered steps joined by a rail */
.vflow ol{list-style:none;margin:0;padding:0;counter-reset:st}
.vflow li{position:relative;counter-increment:st;margin:0;padding:0 0 14px 46px}
.vflow li:last-child{padding-bottom:0}
.vflow li::before{content:counter(st);position:absolute;left:0;top:0;width:30px;height:30px;border-radius:50%;background:var(--c);color:var(--paper);font:700 .95rem/30px var(--sans);text-align:center}
.vflow li:not(:last-child)::after{content:"";position:absolute;left:14px;top:32px;bottom:2px;width:2px;background:var(--line2)}
.vflow li b{display:block;line-height:1.35;padding-top:4px}
.vflow li span{display:block;color:var(--ink2);font-size:.95rem;line-height:1.5}
/* tree: question node, then coloured outcome boxes */
.vq{position:relative;margin:0 auto;max-width:34rem;text-align:center;font-weight:650;border:2px solid var(--ink2);border-radius:999px;padding:7px 18px;background:var(--panel)}
.vq+.vbr{margin-top:22px}
.vbr+.vq{margin-top:26px}
.vq::after,.vb.cont::after{content:"";position:absolute;left:50%;bottom:-20px;width:2px;height:16px;background:var(--line2)}
.vq::before{content:"";position:absolute;left:calc(50% - 5px);bottom:-22px;border:5px solid transparent;border-top-color:var(--line2);border-bottom:0}
.vbr{display:grid;gap:10px;grid-template-columns:repeat(var(--n),minmax(0,1fr))}
.vbr.n1{--n:1}.vbr.n2{--n:2}.vbr.n3{--n:3}.vbr.n4{--n:4}
.vb{position:relative;border:1px solid var(--c);border-top:5px solid var(--c);background:var(--t);border-radius:8px;padding:9px 12px;font-size:.93rem;line-height:1.45}
.vb b{display:block;color:var(--c);font-size:.98rem;margin-bottom:2px}
.vb p{margin:0}.vb ul{margin:2px 0 0;padding-left:1.05em}.vb li{margin:.15em 0}
.vb.cont::after{bottom:-24px;height:20px}
@media (max-width:640px){.vbr{grid-template-columns:1fr}.vb.cont::after{display:none}}
/* timeline */
.vtime ol{list-style:none;display:flex;margin:0;padding:22px 0 0;position:relative}
.vtime ol::before{content:"";position:absolute;left:8px;right:8px;top:28px;height:3px;background:var(--line2);border-radius:2px}
.vtime li{flex:1;position:relative;margin:0;padding:20px 6px 0;text-align:center}
.vtime li::before{content:"";position:absolute;left:50%;top:0;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:var(--c);box-shadow:0 0 0 3px var(--paper)}
.vtime .tt{display:block;font-weight:700;color:var(--c);font-variant-numeric:tabular-nums}
.vtime .tl{display:block;font-size:.88rem;line-height:1.4;color:var(--ink2)}
@media (max-width:560px){.vtime ol{flex-direction:column;padding:0 0 0 26px}.vtime ol::before{left:8px;right:auto;top:6px;bottom:6px;width:3px;height:auto}
 .vtime li{text-align:left;padding:0 0 12px}.vtime li::before{left:-25px;top:4px;margin:0}}
/* letters (FAST etc.) */
.vlet ul{list-style:none;margin:0;padding:0;display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
.vlet li{margin:0;border:1px solid var(--c);background:var(--t);border-radius:10px;padding:10px 12px;text-align:center}
.vlet .ll{display:block;width:44px;height:44px;margin:0 auto 6px;border-radius:50%;background:var(--c);color:var(--paper);font:700 1.4rem/44px var(--serif)}
.vlet b{display:block;color:var(--c)}
.vlet li span:last-child{display:block;font-size:.88rem;line-height:1.4;color:var(--ink2)}
/* self-check */
.vchk{border:1px solid var(--line2);border-radius:10px;overflow:hidden;margin:1.2em 0}
.vchk .vbh{background:var(--g)}
.vchk details{border-top:1px solid var(--line)}
.vchk .vbh+details{border-top:0}
.vchk summary{cursor:pointer;padding:10px 14px;font-weight:600;list-style:none;display:flex;gap:10px}
.vchk summary::-webkit-details-marker{display:none}
.vchk summary .n{flex:none;width:24px;height:24px;border-radius:50%;background:var(--gt);color:var(--g);font:700 .85rem/24px var(--sans);text-align:center}
.vchk summary::after{content:"Show answer";margin-left:auto;flex:none;font-size:.8rem;font-weight:600;color:var(--g)}
.vchk details[open] summary::after{content:"Hide"}
.vchk details>div{padding:0 14px 10px 48px;color:var(--ink2)}
.vchk details>div p{margin:.3em 0}
@media print{figure.vflow,figure.vtree,.vbox,.vchk{break-inside:avoid}.vchk details>div{display:block}}
/* v3 top block */
.vquick{margin:0 0 1.2rem}
figure.vflow.vtop{border-color:var(--g);border-width:2px;margin-top:.6em}
figure.vflow.vtop figcaption{color:var(--g)}
.vstrips{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0}
.vstrip{border:1px solid var(--c);border-left:6px solid var(--c);background:var(--t);border-radius:8px;padding:9px 14px}
.vstrip>b{display:block;color:var(--c);font-size:.95rem;margin-bottom:2px}
.vstrip ul{margin:0;padding-left:1.05em;font-size:.93rem;line-height:1.45}.vstrip li{margin:.18em 0}
.vdose table{width:100%}.vdose th{background:var(--blue);color:var(--paper);text-align:left}
.vdose td:first-child{font-weight:650;color:var(--blue);width:34%}
@media (max-width:640px){.vstrips{grid-template-columns:1fr}}
.art .vdose table thead th,.vdose table thead th{background:var(--blue);color:#fff;border-color:var(--blue)}
.vdoseh{background:var(--blue);color:#fff;font-weight:700;font-size:.95rem;padding:7px 14px;border-radius:8px 8px 0 0;margin-top:10px}.vdoseh+.vdose{margin-top:0}.vdoseh+.vdose table{border-top-left-radius:0;border-top-right-radius:0}

/* ---- wider reading layout (Oct 2026) ---- */
:root{--w:1360px;--measure:58rem}
@media (min-width:1100px){
  .art{grid-template-columns:230px minmax(0,1fr);gap:0 56px}
  .art .main{max-width:60rem}
  .art .main h2{margin-top:1.9rem}
  /* long step lists and checklists flow into two columns */
  figure.vflow.vtop ol,figure.vflow ol:has(>li:nth-child(6)){columns:2;column-gap:36px}
  figure.vflow ol:has(>li:nth-child(6)) li{break-inside:avoid;padding-bottom:16px}
  figure.vflow ol:has(>li:nth-child(6)) li::after,figure.vflow.vtop li::after{display:none}
  .vbb>ul:has(>li:nth-child(6)),.vstrip ul:has(>li:nth-child(7)),.art .main>section>ul:has(>li:nth-child(7)){columns:2;column-gap:32px}
  .vbb>ul li,.vstrip li,.art .main>section>ul li{break-inside:avoid}
  .vchk{display:grid;grid-template-columns:1fr 1fr}
  .vchk .vbh{grid-column:1/-1}
  .vchk details{border-top:1px solid var(--line)}
  .vchk details:nth-of-type(even){border-left:1px solid var(--line)}
  .faq{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
}
@media (min-width:1500px){.art .main{max-width:64rem}}

/* ---- clinical guides index (v3) ---- */
.gidx .ghero{background:linear-gradient(180deg,var(--gt),var(--paper));border-bottom:1px solid var(--line);padding:4px 0 26px;margin-bottom:8px}
.gidx .ghero h1{margin-bottom:.2em}
.gidx .ghero .lede{max-width:40rem}
.gidx .search{max-width:40rem}
.gchips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.gchips a{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:999px;border:1px solid color-mix(in srgb,var(--ac) 35%,var(--line));background:var(--paper);color:var(--ink);text-decoration:none;font-size:.9rem;font-weight:600}
.gchips a svg{color:var(--ac)}
.gchips a:hover{border-color:var(--ac);background:color-mix(in srgb,var(--ac) 8%,var(--paper))}
.ghead{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 16px;margin:30px 0 14px}
.ghead h2{margin:0;font-size:1.5rem}
.ghead p{margin:0;color:var(--mute)}
.gfeat ul{list-style:none;margin:0;padding:0;display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.gfeat li{margin:0}
.gfeat li a{position:relative;display:flex;flex-direction:column;height:100%;padding:16px 18px 14px;border:1px solid var(--line2);border-top:5px solid var(--ac);border-radius:12px;background:var(--paper);color:var(--ink);text-decoration:none;transition:transform .12s,box-shadow .12s}
.gfeat li a:hover{transform:translateY(-2px);box-shadow:0 10px 24px -14px rgba(0,0,0,.35)}
.gsec{display:inline-flex;align-items:center;gap:6px;font-size:.78rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ac)}
.gfeat b{display:block;font-family:var(--serif);font-size:1.25rem;font-weight:600;line-height:1.2;margin:8px 0 6px}
.gfeat .gs{color:var(--ink2);font-size:.92rem;line-height:1.45;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;flex:1}
.gfeat .gmore{margin-top:10px;font-size:.86rem;font-weight:650;color:var(--ac)}
.gmorev3{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:16px}
.gmorev3 span{font-size:.85rem;font-weight:650;color:var(--mute);margin-right:4px}
.gmorev3 a{font-size:.88rem;padding:5px 11px;border-radius:999px;background:color-mix(in srgb,var(--ac) 9%,var(--paper));color:var(--ink);text-decoration:none;border:1px solid color-mix(in srgb,var(--ac) 22%,var(--line))}
.gmorev3 a:hover{border-color:var(--ac)}
.gtiles{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(290px,1fr))}
.gtile{border:1px solid var(--line2);border-radius:12px;padding:16px 18px;background:var(--paper);display:flex;flex-direction:column}
.gti{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;color:var(--ac);background:color-mix(in srgb,var(--ac) 12%,var(--paper));margin-bottom:10px}
.gtile h3{margin:0 0 4px;font-size:1.15rem}
.gtile h3 a{color:var(--ink);text-decoration:none}
.gtile h3 a:hover{color:var(--ac)}
.gtile>p{margin:0 0 8px;color:var(--mute);font-size:.9rem;line-height:1.45}
.gtile ul{list-style:none;margin:0 0 10px;padding:0;flex:1}
.gtile li{margin:0;border-top:1px solid var(--line)}
.gtile li a{display:block;padding:6px 0;color:var(--ink);text-decoration:none;font-size:.94rem}
.gtile li a:hover{color:var(--ac)}
.gall{font-size:.88rem;font-weight:650;color:var(--ac);text-decoration:none}
.gall:hover{text-decoration:underline}
.gtpl{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin:30px 0 10px;padding:18px 22px;border-radius:12px;background:var(--panel);border:1px solid var(--line)}
.gtpl h2{margin:0 0 2px;font-size:1.2rem}.gtpl p{margin:0;color:var(--mute)}
/* header fit + featured card fixes */
.topin{max-width:1400px}
@media (min-width:1080px){.tnav{flex:1 1 auto;min-width:0;overflow:hidden}}
@media (min-width:1080px) and (max-width:1499px){.tnav a{padding:8px 8px;font-size:.92rem}.tnav{margin-left:14px}}
.gfeat .gs{flex:none}
.gfeat .gmore{margin-top:auto;padding-top:10px}
@media (min-width:1100px){.gfeat ul{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:640px){
  .gchips{flex-wrap:nowrap;overflow-x:auto;margin:14px -16px 0;padding:0 16px 4px;scrollbar-width:none}
  .gchips::-webkit-scrollbar{display:none}
  .gchips a{flex:none}
  .gfeat ul{grid-template-columns:1fr 1fr;gap:10px}
  .gfeat li a{padding:12px 12px 10px}
  .gfeat b{font-size:1.02rem;margin:6px 0 2px}
  .gfeat .gs,.gfeat .gmore{display:none}
  .gsec{font-size:.68rem}
  .gtile ul li:nth-child(n+4){display:none}
}
/* exam-bank block at the end of guides */
.bank{margin:2.6rem 0 1.6rem}
.bank>h2{margin-bottom:.2rem}
.bk{border:1px solid var(--line2);border-radius:10px;padding:0 18px 16px;margin-top:14px;background:var(--paper);border-top:4px solid var(--bc)}
.bk-nre{--bc:var(--g);--bt:var(--gt)}.bk-fcps{--bc:var(--pur);--bt:var(--purt)}
.bkh{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:0 -18px 4px;padding:10px 18px;background:var(--bt);border-radius:6px 6px 0 0}
.bkh b{color:var(--bc);font-size:1.02rem}.bkh span{color:var(--mute);font-size:.88rem}
.btn.fc{background:var(--pur);border-color:var(--pur);color:#fff}.btn.fc:hover{filter:brightness(.92);color:#fff}
@media (min-width:1100px){.bank{display:block}}
/* ===== FCPS-first home ===== */
.fhome{background:var(--panel)}
.fh{max-width:var(--w);margin:0 auto;padding:40px 20px 30px}
.fh h1,.fh h2{font-family:var(--sans);letter-spacing:-.025em}
.fh-hero{display:grid;gap:36px;align-items:start}
@media (min-width:980px){.fh-hero{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:48px;padding-top:12px}}
.fh-kicker{margin:0 0 10px;font-weight:650;font-size:.95rem;color:var(--g)}
.fh-copy h1{font-size:clamp(2rem,4.2vw,3.05rem);line-height:1.06;font-weight:750;margin:0 0 16px;max-width:15ch}
.fh-sub{font-size:1.12rem;line-height:1.6;color:var(--ink2);margin:0 0 24px;max-width:36rem}
.fh-cta{display:grid;grid-template-columns:1fr;gap:10px;max-width:34rem}
@media (min-width:560px){.fh-cta{grid-template-columns:1fr 1fr}}
.fh-btn{display:flex;flex-direction:column;gap:2px;padding:14px 18px;border-radius:12px;background:var(--g);color:#fff;text-decoration:none;transition:background .15s}
.fh-btn+.fh-btn{background:var(--paper);color:var(--ink);border:1px solid var(--line2)}
.fh-btn b{font-size:1.05rem}
.fh-btn span{font-size:.88rem;opacity:.85}
.fh-btn:hover{background:var(--g2);color:#fff}
.fh-btn+.fh-btn:hover{background:var(--paper);border-color:var(--g);color:var(--ink)}
:root[data-theme="dark"] .fh-btn:first-child{color:#071512}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .fh-btn:first-child{color:#071512}}
.fh-prog{margin:12px 0 0;font-size:.95rem;color:var(--ink2)}
.fh-prog a{font-weight:650;color:var(--g)}
.fh-proof{list-style:none;padding:0;margin:30px 0 0;display:grid;gap:14px;max-width:36rem}
.fh-proof li{display:grid;grid-template-columns:auto 1fr;column-gap:12px;align-items:baseline}
.fh-proof li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--g);grid-row:1/3;margin-top:8px}
.fh-proof b{font-size:1rem}
.fh-proof span{grid-column:2;color:var(--mute);font-size:.94rem}
/* the one bold element: a live question */
.fh-try{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:22px 22px 18px;box-shadow:0 1px 2px rgba(17,32,26,.04),0 18px 40px -28px rgba(17,32,26,.35)}
.fh-tryh{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:0 0 12px;font-weight:700;font-size:.95rem;color:var(--g)}
.fh-tryh span{font-weight:500;color:var(--mute)}
.fh-stem{font-size:1.04rem;line-height:1.6;margin:0 0 14px}
.fh-opts{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.fh-opts button{width:100%;display:flex;align-items:center;gap:12px;text-align:left;padding:11px 14px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink);font:inherit;font-size:.98rem;cursor:pointer}
.fh-opts button:hover:not(:disabled){border-color:var(--g)}
.fh-opts button:disabled{cursor:default}
.fh-opts i{flex:none;font-style:normal;width:24px;height:24px;border-radius:6px;display:grid;place-items:center;background:var(--panel);font-size:.78rem;font-weight:700;color:var(--ink2)}
.fh-opts li.ok button{border-color:#1E8A4C;background:#E7F4EC}
.fh-opts li.bad button{border-color:var(--red);background:var(--redt)}
:root[data-theme="dark"] .fh-opts li.ok button{background:#14301F;border-color:#5BCB85}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .fh-opts li.ok button{background:#14301F;border-color:#5BCB85}}
.fh-why{margin:4px 2px 2px 50px;font-size:.88rem;color:var(--mute)}
.fh-exp{margin-top:14px;padding-top:14px;border-top:1px solid var(--line);font-size:.95rem;line-height:1.6}
.fh-exp p{margin:0 0 10px}
.fh-exp a{font-weight:650;color:var(--g)}
.fh-sec{margin-top:64px}
.fh-sec h2{font-size:clamp(1.4rem,2.6vw,1.8rem);font-weight:700;margin:0 0 8px}
.fh-lede{color:var(--ink2);margin:0 0 18px}
.fh-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;margin-top:16px}
.fh-grid a{padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--ink);text-decoration:none;font-weight:600}
.fh-grid a:hover,.fh-cards a:hover{border-color:var(--g)}
.fh-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;margin-top:16px}
.fh-cards a{display:flex;flex-direction:column;gap:4px;padding:18px;border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--ink);text-decoration:none}
.fh-cards b{font-size:1.02rem}.fh-cards span{color:var(--mute);font-size:.93rem}
.fh-two{display:grid;gap:14px;margin-top:16px}
@media (min-width:900px){.fh-two{grid-template-columns:1fr 1.4fr}}
.fh-nre,.fh-ward{display:flex;flex-direction:column;gap:8px;padding:22px;border:1px solid var(--line);border-radius:14px;background:var(--paper);color:var(--ink);text-decoration:none}
.fh-nre b,.fh-ward b{font-size:1.15rem}
.fh-nre span,.fh-ward > span{color:var(--ink2)}
.fh-nre em{font-style:normal}
.fh-nre i{font-style:normal;margin-top:auto;font-weight:650;color:var(--g)}
.fh-nre:hover{border-color:var(--g)}
.fh-ward .search{margin:6px 0 4px}
.fh-links{display:flex;flex-wrap:wrap;gap:8px}
.fh-links a{padding:7px 12px;border:1px solid var(--line);border-radius:10px;color:var(--ink);text-decoration:none;font-size:.93rem;font-weight:550}
.fh-links a:hover{border-color:var(--g)}
.fhome .comingsoon{margin:40px 0 0;color:var(--mute);font-size:.92rem;text-align:left}
@media (max-width:600px){.fh{padding:24px 16px 24px}.fh-sec{margin-top:44px}.fh-try{padding:18px 16px}}

/* ===== sample questions on /mcqs pages, styled like the app ===== */
button.qo{display:flex;align-items:center;gap:12px;width:100%;padding:11px 14px;border-radius:10px;line-height:1.4;transition:border-color .12s,background .12s}
button.qo .l{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--panel);color:var(--ink2);font-size:.8rem;font-weight:700}
button.qo.right .l{background:var(--g);color:#fff}button.qo.wrong .l{background:var(--red);color:#fff}
.mqs{max-width:760px}
.mq{border:1px solid var(--line2);border-radius:14px;background:var(--paper);padding:18px 20px 16px;margin:16px 0}
.mq.tq{border-top:1px solid var(--line2)}
.mq-meta{display:flex;align-items:center;gap:10px;margin:0 0 8px;font-size:.82rem}
.mq-n{font-weight:700;color:var(--mute)}
.mq-d{font-weight:700;border-radius:999px;padding:2px 9px}.mq-dE{background:#E2F4EC;color:#16664A}.mq-dM{background:#FFF3D6;color:#7A5200}.mq-dH{background:#FBE8E7;color:#A12A22}
.mq .stem{font-size:1.02rem;line-height:1.55;font-weight:550;margin:0 0 12px}
.mq .opts{gap:8px}
.mq .ans{background:none;padding:0;margin-top:16px;border-top:1px solid var(--line);padding-top:14px;font-size:.95rem;line-height:1.6}
.mq-ans{font-weight:700;color:var(--g);margin:0 0 6px}
.mq-note{border:1px solid var(--line2);background:var(--panel);border-radius:12px;padding:12px 16px;margin:14px 0}
.mq-nt{font-weight:700;margin:0 0 6px}.mq-note ul{margin:0;padding-left:18px}.mq-note li{margin:3px 0}
.mq-note mark{background:#FFF0B3;color:inherit;border-radius:3px;padding:0 3px}
.mq-tip{margin:10px 0 0;font-size:.92rem}.mq-tip b{display:inline-block;font-size:.72rem;letter-spacing:.04em;background:var(--g);color:#fff;border-radius:999px;padding:2px 8px;margin-right:8px}
.mq-trap{background:var(--redt);border-left:4px solid var(--red);border-radius:0 10px 10px 0;padding:9px 12px;margin:12px 0}
.mq-trap b{margin-right:6px}
.mq-wh{font-weight:700;margin:14px 0 4px}.mq-why{margin:0;padding-left:18px}.mq-why li{margin:4px 0}
.mq-mid{margin:20px 0}
@media (max-width:600px){.mq{padding:14px 14px 12px;border-radius:12px}button.qo{padding:10px 12px}}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .mq-dE{background:#16301F;color:#BFEBD0}:root:not([data-theme="light"]) .mq-dM{background:#352710;color:#F2D49B}:root:not([data-theme="light"]) .mq-dH{background:#3A1D1A;color:#F5C2BC}:root:not([data-theme="light"]) .mq-note mark{background:#6B5B12;color:#FFF6D6}}
:root[data-theme="dark"] .mq-dE{background:#16301F;color:#BFEBD0}:root[data-theme="dark"] .mq-dM{background:#352710;color:#F2D49B}:root[data-theme="dark"] .mq-dH{background:#3A1D1A;color:#F5C2BC}:root[data-theme="dark"] .mq-note mark{background:#6B5B12;color:#FFF6D6}

/* ===== how we write questions ===== */
.hw .lede{max-width:44rem}
.hw-nums{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:24px 0 8px}
.hw-nums p{margin:0;padding:16px 18px;border:1px solid var(--line2);border-radius:14px;background:var(--paper)}
.hw-nums b{display:block;font-size:1.7rem;letter-spacing:-.02em;line-height:1.1;color:var(--g)}
.hw-nums span{display:block;margin-top:6px;font-size:.9rem;color:var(--ink2);line-height:1.4}
.hw-steps{list-style:none;counter-reset:hw;margin:28px 0;padding:0}
.hw-steps>li{counter-increment:hw;position:relative;padding:0 0 8px 56px;margin:0 0 18px}
.hw-steps>li::before{content:counter(hw);position:absolute;left:0;top:2px;width:38px;height:38px;border-radius:50%;background:var(--g);color:#fff;display:grid;place-items:center;font-weight:700}
.hw-steps>li:not(:last-child)::after{content:"";position:absolute;left:18px;top:46px;bottom:-14px;width:2px;background:var(--line2)}
.hw-steps h2{margin:6px 0 8px;font-size:1.2rem}
.hw-t{border-collapse:collapse;width:100%;max-width:640px;font-size:.95rem}
.hw-t th,.hw-t td{border-bottom:1px solid var(--line);padding:9px 10px;text-align:left}
.hw-t td{font-variant-numeric:tabular-nums}
.hw-cta{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 8px}
@media (max-width:600px){.hw-steps>li{padding-left:48px}.hw-steps>li::before{width:34px;height:34px}.hw-steps>li:not(:last-child)::after{left:16px}}

.mq-layout{display:block}
@media (min-width:1100px){.mq-layout{display:grid;grid-template-columns:minmax(0,760px) 300px;gap:40px;align-items:start}.mq-side{position:sticky;top:84px;margin-top:2.6rem}}
.mq-side{border:1px solid var(--line2);border-radius:14px;background:var(--paper);padding:18px 20px;margin:20px 0}
.mq-sk{margin:0;font-size:.82rem;font-weight:700;color:var(--g)}
.mq-sn{margin:4px 0 2px;font-size:1.15rem;font-weight:700;line-height:1.3}
.mq-sl{margin:0 0 12px;color:var(--ink2);font-size:.92rem}
.mq-side ul{margin:0 0 16px;padding-left:18px;font-size:.93rem}.mq-side li{margin:4px 0}
.mq-side .btn{display:block;text-align:center}
.mq-how{display:block;text-align:center;margin-top:10px;font-size:.9rem}
.hw .hw-steps,.hw>p,.hw>ul{max-width:46rem}
@media (min-width:1080px) and (max-width:1499px){.tnav{margin-left:14px}.tnav a{padding:8px 8px;font-size:.9rem}}
@media (min-width:1080px) and (max-width:1399px){.tnav a[href="/calculators/"],.tnav a[href="/articles/"]{display:none}}
@media (min-width:1080px) and (max-width:1179px){.tnav a[href="/drugs/"]{display:none}}
/* ===== home: why band and daily question ===== */
.fh-band{margin:56px 0 0;display:grid;gap:28px}
@media (min-width:980px){.fh-band{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:start}}
.fh-flow h2{font-size:clamp(1.6rem,3vw,2.2rem);letter-spacing:-.02em;margin:0 0 18px}
.fh-steps{list-style:none;margin:0;padding:0;display:grid;gap:0;counter-reset:none}
.fh-steps li{display:grid;grid-template-columns:150px 1fr;gap:16px;align-items:baseline;padding:14px 0;border-top:1px solid var(--line2)}
.fh-steps li:last-child{border-bottom:1px solid var(--line2)}
.fh-steps b{font-size:1.9rem;letter-spacing:-.03em;color:var(--g);line-height:1}
.fh-steps span{color:var(--ink2);line-height:1.45}
.fh-how{display:inline-block;margin-top:14px;font-weight:650;color:var(--g)}
.fh-why4{display:grid;grid-template-columns:1fr;gap:12px}
@media (min-width:640px){.fh-why4{grid-template-columns:1fr 1fr}}
.fh-w{border:1px solid var(--line2);border-radius:14px;background:var(--paper);padding:18px 20px}
.fh-w h3{margin:0 0 8px;font-size:1.05rem;line-height:1.3;letter-spacing:-.01em}
.fh-w p{margin:0;color:var(--ink2);font-size:.95rem;line-height:1.55}
.fh-w a{display:inline-block;margin-top:10px;font-weight:650;color:var(--g)}
.fh-streak{font-weight:650;color:var(--g)}
@media (max-width:600px){.fh-steps li{grid-template-columns:110px 1fr}.fh-steps b{font-size:1.5rem}}
.tb-drug{border:1px solid var(--line2);border-left:4px solid var(--g);border-radius:0 12px 12px 0;background:var(--paper);padding:12px 16px;margin:24px 0}
.tb-drug h2{font-size:1rem;margin:0 0 4px}.tb-drug p{margin:0}
.fcta{display:block;margin:16px 0 22px;padding:12px 16px;border:1px solid var(--line2);border-left:4px solid var(--g);border-radius:0 12px 12px 0;background:var(--paper);font-size:.95rem;line-height:1.5}
.fcta-b{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.fcta-b a{padding:5px 12px;border-radius:999px;background:var(--gt);color:var(--g);font-weight:650;text-decoration:none;font-size:.88rem}.fcta-b a:hover{background:var(--g);color:#fff}.fcta-b .fcta-t{background:transparent;border:1px solid var(--line2);color:var(--ink2)}
/* ===== textbook ===== */

/* ===== textbook ===== */
.tb-home .lede{max-width:46rem}
.tb-bar{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;justify-content:space-between;margin:24px 0 8px;position:sticky;top:60px;z-index:5;background:var(--bg);padding:10px 0;border-bottom:1px solid var(--line)}
.tb-views,.tb-filter{display:flex;flex-wrap:wrap;gap:6px}
.tb-views button,.tb-filter button{font:inherit;font-size:.9rem;font-weight:600;border:1px solid var(--line2);background:var(--paper);color:var(--ink2);border-radius:999px;padding:7px 14px;cursor:pointer}
.tb-views button[aria-selected="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.tb-filter button[aria-pressed="true"]{background:var(--gt);color:var(--g);border-color:var(--g)}
.tb-subj,.tb-paper{margin:28px 0}
.tb-p2block>h2 a{color:var(--g)}.tb-status{scroll-margin-top:150px}
.tb-subj>h2,.tb-paper>h2{margin:0 0 10px}
.tb-sec{border:1px solid var(--line2);border-radius:12px;background:var(--paper);margin:8px 0}
.tb-sec>summary{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;padding:13px 16px;cursor:pointer;list-style:none}
.tb-sec>summary::-webkit-details-marker{display:none}
.tb-sec>summary span{color:var(--mute);font-size:.88rem}.tb-sec>summary em{margin-left:auto;font-style:normal;color:var(--mute);font-size:.86rem}
.tb-sec ul{list-style:none;margin:0;padding:2px 10px 12px;display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:2px 10px;border-top:1px solid var(--line)}
.tb-sec li{margin:0;line-height:1.4}
.tb-sec li a{display:flex;align-items:center;gap:8px;padding:9px 10px;border-radius:8px;color:var(--ink);text-decoration:none;font-size:.95rem}
.tb-sec li a::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--line2);transition:background .15s}
.tb-sec li a:hover,.tb-sec li a:focus-visible{background:var(--gt);color:var(--g)}
.tb-sec li a:hover::before,.tb-sec li a:focus-visible::before{background:var(--g)}
.tb-sec li a .tb-tag{margin-left:auto}
.tb-sec>summary .tb-p2l{font-size:.74rem;font-weight:700;border-radius:999px;padding:2px 9px;color:var(--ink2)}
.tb-status{margin:10px 0 4px;color:var(--ink2);font-size:.92rem}
.tb-swap{animation:tbSwap .55s cubic-bezier(.2,.7,.2,1)}
@keyframes tbSwap{0%{opacity:0;transform:translateY(16px)}100%{opacity:1;transform:none}}
.tb-sec.tb-new{animation:tbNew 1.6s ease-out}
@keyframes tbNew{0%{box-shadow:0 0 0 3px var(--g);border-color:var(--g)}100%{box-shadow:0 0 0 0 transparent}}
.tb-spec{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:12px 0 4px;padding:12px 16px;border-radius:12px;background:var(--gt);border:1px solid var(--g)}
.tb-spec b{color:var(--g)}.tb-spec span{flex:1 1 300px;color:var(--ink2);font-size:.92rem}.tb-spec a{font-weight:650;color:var(--g);white-space:nowrap}
.tb-spec[hidden]{display:none}
.tb-home{--sp:var(--g)}
.tb-home[data-spec=surg]{--sp:#16664A}.tb-home[data-spec=med]{--sp:#1F45A8}.tb-home[data-spec=gyn]{--sp:#9A2457}.tb-home[data-spec=rad]{--sp:#5A3AA6}
:root[data-theme=dark] .tb-home[data-spec=surg]{--sp:#5CC79B}:root[data-theme=dark] .tb-home[data-spec=med]{--sp:#8FA9F0}:root[data-theme=dark] .tb-home[data-spec=gyn]{--sp:#EE8DB5}:root[data-theme=dark] .tb-home[data-spec=rad]{--sp:#B9A2F0}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .tb-home[data-spec=surg]{--sp:#5CC79B}:root:not([data-theme=light]) .tb-home[data-spec=med]{--sp:#8FA9F0}:root:not([data-theme=light]) .tb-home[data-spec=gyn]{--sp:#EE8DB5}:root:not([data-theme=light]) .tb-home[data-spec=rad]{--sp:#B9A2F0}}
.tb-home .tb-subj>h2 a,.tb-home .tb-paper>h2,.tb-home .tb-p2block>h2 a{color:var(--sp);transition:color .3s}
.tb-home .tb-sec{border-left:4px solid var(--sp);transition:border-color .3s}
.tb-home .tb-sec li a:hover,.tb-home .tb-sec li a:focus-visible{background:color-mix(in srgb,var(--sp) 12%,var(--paper));color:var(--sp)}
.tb-home .tb-sec li a:hover::before{background:var(--sp)}
.tb-home .tb-filter button[aria-pressed="true"]{background:color-mix(in srgb,var(--sp) 14%,var(--paper));color:var(--sp);border-color:var(--sp)}
.tb-home .tb-spec{background:color-mix(in srgb,var(--sp) 12%,var(--paper));border-color:var(--sp)}.tb-home .tb-spec b,.tb-home .tb-spec a{color:var(--sp)}
.tb-out{opacity:0;transform:translateY(10px);transition:opacity .17s ease-in,transform .17s ease-in}
@media (prefers-reduced-motion:reduce){.tb-swap,.tb-sec.tb-new{animation:none}.tb-out{transition:none}}
.tb-soon{color:var(--mute)}.tb-soon i{font-size:.82rem;margin-left:6px}
.tb-tag{display:inline-block;font-size:.72rem;font-weight:700;border-radius:999px;padding:2px 8px;margin-left:8px;vertical-align:1px;background:var(--panel);color:var(--ink2)}
.tb-b-all{background:var(--gt);color:var(--g)}.tb-b-surg{background:#E2F4EC;color:#16664A}.tb-b-med{background:#E3EAFB;color:#1F45A8}.tb-b-gyn{background:#FBE6EF;color:#9A2457}.tb-b-rad{background:#EFE8FB;color:#5A3AA6}
.tb-page .tb-art{max-width:760px;min-width:0}
.tb-grid{display:block}
@media (min-width:1100px){.tb-grid{display:grid;grid-template-columns:minmax(0,760px) 290px;gap:48px;align-items:start}.tb-side{position:sticky;top:84px;margin-top:64px}}
@media (max-width:1099px){.tb-side{display:none}}
.tb-card{border:1px solid var(--line2);border-radius:14px;background:var(--paper);padding:16px 18px;margin:0 0 14px}
.tb-ck{margin:0 0 8px;font-size:.82rem;font-weight:700;color:var(--g)}
.tb-card ul{list-style:none;margin:0;padding:0}.tb-card li{margin:6px 0;font-size:.92rem;line-height:1.35}.tb-card li a{color:var(--ink2);text-decoration:none}.tb-card li a:hover{color:var(--g)}
.tb-pn2{margin:0;font-size:1.1rem;font-weight:700}.tb-ps{margin:4px 0 12px;font-size:.9rem;color:var(--ink2)}
.tb-pc .btn{display:block;text-align:center}.tb-all{display:block;text-align:center;margin-top:10px;font-size:.9rem}
.tb-tags{margin:14px 0 0}.tb-tags .tb-tag{margin:0 6px 0 0}
.tb-art h1{margin:10px 0 12px}
.tb-sum{font-size:1.12rem;line-height:1.6;color:var(--ink2);margin:0 0 10px}
.tb-w{display:inline-block;background:#FBF1DC;color:#7A4A00;font-weight:650;font-size:.9rem;border-radius:999px;padding:5px 12px;margin:4px 0 8px}
.tb-body{font-size:1.04rem;line-height:1.7}
.tb-body h2{margin:30px 0 10px;font-size:1.3rem}.tb-body h3{margin:20px 0 6px;font-size:1.08rem}
.tb-body li{margin:5px 0}.tb-body mark{background:#FFF0B3;color:inherit;border-radius:3px;padding:0 3px}
.tb-tw{overflow-x:auto;margin:14px 0}
.tb-t{border-collapse:collapse;width:100%;font-size:.95rem}
.tb-t th,.tb-t td{border:1px solid var(--line2);padding:8px 10px;text-align:left;vertical-align:top;hyphens:manual;word-break:normal;overflow-wrap:break-word}
.tb-t th{background:var(--panel)}
.tb-tip{background:var(--gt);border-radius:10px;padding:10px 14px}.tb-tip b{font-size:.74rem;background:var(--g);color:#fff;border-radius:999px;padding:2px 8px;margin-right:8px}
.tb-trap{background:var(--redt);border-left:4px solid var(--red);border-radius:0 10px 10px 0;padding:10px 14px}.tb-trap b{margin-right:6px}
.tb-qs{margin-top:44px;border-top:1px solid var(--line);padding-top:8px}
.tb-qlede{color:var(--ink2)}
.tb-cta{margin:18px 0}
.tb-where ul,.tb-rel ul{padding-left:20px}.tb-where li,.tb-rel li{margin:6px 0}
.tb-pn{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:36px 0 10px}
.tb-pn a{display:block;border:1px solid var(--line2);border-radius:12px;padding:12px 16px;text-decoration:none;color:var(--ink);background:var(--paper);font-weight:600;line-height:1.35}
.tb-pn a small{display:block;color:var(--mute);font-weight:500;margin-bottom:2px}.tb-pn .tb-next{text-align:right}
@media (max-width:640px){
  .tb-bar{top:56px}
  .tb-body{font-size:1rem}
  .tb-tw{overflow:visible}
  .tb-t3,.tb-t3 tbody,.tb-t3 tr,.tb-t3 td{display:block;width:auto}
  .tb-t3 thead{display:none}
  .tb-t3 tr{border:1px solid var(--line2);border-radius:10px;margin:0 0 10px;padding:8px 12px;background:var(--paper)}
  .tb-t3 td{border:0;padding:3px 0}
  .tb-t3 td:first-child{font-weight:700;border-bottom:1px solid var(--line);padding-bottom:5px;margin-bottom:4px}
  .tb-t3 td:not(:first-child)::before{content:attr(data-l) ": ";font-weight:650;color:var(--mute)}
  .tb-pn{grid-template-columns:1fr}.tb-pn .tb-next{text-align:left}
}
.tb-sub{font-size:.82rem;font-weight:700;color:var(--g);margin-right:10px}
.tb-full{margin:-4px 0 12px;color:var(--mute);font-size:.98rem}
.tb-hlinks{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 6px}.tb-hlinks a{border:1px solid var(--line2);background:var(--paper);border-radius:999px;padding:6px 13px;font-size:.9rem;font-weight:600;text-decoration:none;color:var(--ink2)}.tb-hlinks a:hover{border-color:var(--g);color:var(--g)}
.tb-hub .lede{max-width:46rem}.tb-hsec{margin:26px 0}.tb-hsec h2{font-size:1.15rem;margin:0 0 8px}
.tb-hl{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:8px}
.tb-hl li{position:relative;border:1px solid var(--line2);background:var(--paper);border-radius:10px;padding:11px 14px;transition:border-color .15s}.tb-hl li:hover{border-color:var(--g)}.tb-hl a{font-weight:650;color:var(--ink);text-decoration:none}.tb-hl a::after{content:"";position:absolute;inset:0}.tb-hl li:hover a{color:var(--g)}.tb-hl span{display:block;color:var(--mute);font-size:.84rem;margin-top:2px;line-height:1.35}
.tb-rank{list-style:none;margin:20px 0;padding:0;max-width:820px}
.tb-rank li{display:grid;grid-template-columns:40px 1fr auto;gap:12px;align-items:center;border-bottom:1px solid var(--line);padding:11px 0}
.tb-rk{font-weight:800;color:var(--mute);text-align:right}.tb-rank a{font-weight:650}.tb-rank small{display:block;color:var(--mute)}
.tb-rank em{font-style:normal;font-size:.78rem;font-weight:700;border-radius:999px;padding:3px 9px}.tb-t1{background:#FBF1DC;color:#7A4A00}.tb-t2{background:var(--panel);color:var(--ink2)}
.tb-hnote{max-width:46rem;color:var(--ink2);font-size:.93rem}
@media (max-width:600px){.tb-rank li{grid-template-columns:30px 1fr}.tb-rank em{grid-column:2;justify-self:start}}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .tb-w{background:#33270F;color:#F0C878}:root:not([data-theme="light"]) .tb-body mark{background:#6B5B12;color:#FFF6D6}}
:root[data-theme="dark"] .tb-w{background:#33270F;color:#F0C878}:root[data-theme="dark"] .tb-body mark{background:#6B5B12;color:#FFF6D6}
