/* The Tract — Clinical Guides. One stylesheet for the web page and the printed PDF.
   Web: sits inside site.css (tokens, fonts). Print: A4, white page, ink text, copper accents. */

.g{--g-ink:var(--ink,#1B2636);--g-cu:var(--copper,#B66C4E);--g-cu2:#9A5638;--g-mute:var(--muted,#46515D);--g-line:var(--line,#D9D1C1);
   --g-flag:#A4472B;--g-flag-bg:#F8ECE6;--g-pearl-bg:#EDF0F4;--g-note-bg:#F4F1EA;--g-head:#1B2636;
   font-family:"Newsreader","Noto Naskh Arabic",Georgia,serif;color:var(--g-ink);font-size:18px;line-height:1.6;font-variant-numeric:oldstyle-nums proportional-nums}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .g{--g-flag-bg:#2D1E19;--g-pearl-bg:#1A222D;--g-note-bg:#1A1F27;--g-head:#ECE6DA;--g-flag:#E08B6C}}
:root[data-theme="dark"] .g{--g-flag-bg:#2D1E19;--g-pearl-bg:#1A222D;--g-note-bg:#1A1F27;--g-head:#ECE6DA;--g-flag:#E08B6C}

.g h2{font-family:"Newsreader",Georgia,serif;font-weight:500;font-size:clamp(30px,4vw,42px);line-height:1.08;letter-spacing:-.01em;margin:64px 0 6px;color:var(--g-head)}
.g h2 .pn{display:block;font-family:"Source Sans 3",system-ui,sans-serif;font-size:15px;font-weight:600;color:var(--g-cu);letter-spacing:.01em;margin-bottom:8px}
.g .part-sub{font-family:"Source Sans 3",system-ui,sans-serif;font-size:15px;color:var(--g-mute);margin:0 0 26px;padding-bottom:16px;border-bottom:2px solid var(--g-ink)}
.g h3{font-family:"Newsreader",Georgia,serif;font-weight:600;font-size:24px;line-height:1.2;margin:40px 0 10px;color:var(--g-head)}
.g h3 .sn{font-family:"Source Sans 3",system-ui,sans-serif;font-weight:700;color:var(--g-cu);font-size:.72em;margin-right:10px;font-variant-numeric:lining-nums}
.g h4{font-family:"Source Sans 3",system-ui,sans-serif;font-weight:700;font-size:16.5px;margin:24px 0 6px;color:var(--g-head)}
.g p{margin:0 0 12px}
.g ul,.g ol{margin:0 0 14px;padding-left:22px}
.g li{margin:0 0 6px}
.g li::marker{color:var(--g-cu)}
.g strong,.g b{font-weight:600}
.g a{color:var(--g-cu2)}
.g sub,.g sup{font-size:.7em;line-height:0}

/* tables */
.g .tw{overflow-x:auto;margin:18px 0 20px;-webkit-overflow-scrolling:touch}
.g table{width:100%;border-collapse:collapse;font-family:"Source Sans 3",system-ui,sans-serif;font-size:15px;line-height:1.42;font-variant-numeric:lining-nums tabular-nums}
.g th{text-align:left;font-weight:700;font-size:13.5px;color:var(--g-head);padding:8px 10px 7px;border-bottom:1.6px solid var(--g-ink);vertical-align:bottom}
.g td{padding:8px 10px;border-bottom:1px solid var(--g-line);vertical-align:top}
.g td:first-child{font-weight:600;color:var(--g-head)}
.g table.plain td:first-child{font-weight:400;color:inherit}
.g td.k{font-weight:700;color:var(--g-cu2);width:2.2em;text-align:center}
.g .cap{font-family:"Source Sans 3",system-ui,sans-serif;font-size:13.5px;color:var(--g-mute);margin:-10px 0 18px;line-height:1.45}
.g .cap b{color:var(--g-head)}
.g .yes{color:#2F6B4F;font-weight:700}.g .no{color:var(--g-flag);font-weight:700}

/* callouts */
.g .co{margin:20px 0;padding:14px 18px 6px;border-left:4px solid var(--g-ink);background:var(--g-pearl-bg);border-radius:0 6px 6px 0;font-size:16.5px;line-height:1.55;break-inside:avoid}
.g .co>.t{display:block;font-family:"Source Sans 3",system-ui,sans-serif;font-weight:700;font-size:14.5px;margin-bottom:6px;color:var(--g-head)}
.g .co ul{padding-left:18px}
.g .co.flag{border-color:var(--g-flag);background:var(--g-flag-bg)}
.g .co.flag>.t{color:var(--g-flag)}
.g .co.flag>.t::before{content:"";display:inline-block;width:9px;height:9px;background:var(--g-flag);transform:rotate(45deg);margin-right:9px;vertical-align:1px}
.g .co.note{border-color:var(--g-line);background:var(--g-note-bg)}
.g .co.pearl>.t::before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--g-cu);margin-right:9px;vertical-align:1px}

/* figures */
.g figure{margin:22px 0 22px;break-inside:avoid}
.g figure svg{display:block;width:100%;height:auto;font-family:"Source Sans 3",system-ui,sans-serif}
.g figcaption{font-family:"Source Sans 3",system-ui,sans-serif;font-size:13.5px;color:var(--g-mute);margin-top:8px;line-height:1.45}
.g figcaption b{color:var(--g-head)}
.g svg .ink{fill:var(--g-ink)}.g svg .sk{stroke:var(--g-ink)}
.g svg text{fill:var(--g-head)}
.g svg .cu{fill:var(--g-cu)}.g svg .skcu{stroke:var(--g-cu)}
.g svg .mu{fill:var(--g-mute)}
.g svg .pp{fill:var(--g-note-bg)}.g svg .pb{fill:var(--g-pearl-bg)}.g svg .pf{fill:var(--g-flag-bg)}

/* self-assessment */
.g .q{margin:20px 0;padding:16px 18px;border:1px solid var(--g-line);border-radius:8px;break-inside:avoid}
.g .q .qh{font-family:"Source Sans 3",system-ui,sans-serif;font-weight:700;font-size:14px;color:var(--g-cu2);margin-bottom:6px}
.g .q ol{list-style:upper-alpha;font-family:"Source Sans 3",system-ui,sans-serif;font-size:15.5px;margin:8px 0 10px}
.g .q .a{font-size:16px;border-top:1px dashed var(--g-line);padding-top:10px;margin-top:6px}
.g .q .a b:first-child{font-family:"Source Sans 3",system-ui,sans-serif;color:#2F6B4F}
.g details.q summary{cursor:pointer;font-family:"Source Sans 3",system-ui,sans-serif;font-weight:600;color:var(--g-cu2)}

/* references */
.g ol.refs{font-family:"Source Sans 3",system-ui,sans-serif;font-size:14.5px;line-height:1.45;padding-left:26px}
.g ol.refs li{margin-bottom:5px}
.g .refs-h{font-family:"Source Sans 3",system-ui,sans-serif;font-weight:700;font-size:15px;margin:18px 0 6px}
.g dl.abbr{display:grid;grid-template-columns:max-content 1fr;gap:3px 16px;font-family:"Source Sans 3",system-ui,sans-serif;font-size:14.5px}
.g dl.abbr dt{font-weight:700}.g dl.abbr dd{margin:0}
.g .lead{font-size:20px;line-height:1.55}
.g .twocol{columns:2;column-gap:34px}
@media (max-width:700px){.g{font-size:17px}.g .twocol{columns:1}.g table{font-size:14px}.g h3{font-size:21px}}

/* web-only wrapper */
.guide-wrap{max-width:780px;margin:0 auto}
.guide-toc{font-family:"Source Sans 3",system-ui,sans-serif;font-size:15.5px;columns:2;column-gap:30px;margin:0;padding:0;list-style:none}
.guide-toc li{break-inside:avoid;margin:0 0 7px}
.guide-toc a{color:var(--ink);text-decoration:none}.guide-toc a:hover{color:var(--copper)}
.guide-toc .p{font-weight:700;margin-top:10px}
@media (max-width:640px){.guide-toc{columns:1}}

/* ---------------- print ---------------- */
@media print{
  @page{size:A4;margin:21mm 18mm 19mm 18mm;
    @top-left{content:var(--rh,"The Tract · Clinical Guides");font:600 7.6pt "Source Sans 3",sans-serif;color:#7A8490;vertical-align:bottom;padding-bottom:4mm}
    @top-right{content:"thetract.org";font:600 7.6pt "Source Sans 3",sans-serif;color:#B66C4E;vertical-align:bottom;padding-bottom:4mm}
    @bottom-center{content:counter(page);font:600 8pt "Source Sans 3",sans-serif;color:#46515D;padding-top:4mm;vertical-align:top}}
  @page cover{margin:0;@top-left{content:none}@top-right{content:none}@bottom-center{content:none}}
  @page front{@top-left{content:none}@top-right{content:none}@bottom-center{content:none}}
  html,body{background:#fff!important}
  .g{font-size:10.2pt;line-height:1.5;--g-head:#1B2636;orphans:3;widows:3}
  .g h2{font-size:23pt;margin:26pt 0 4pt;padding-top:12pt;border-top:3pt solid #1B2636;break-after:avoid}
  .g h2{break-inside:avoid}
  .g h2+.part-sub{break-after:avoid;break-before:avoid}
  .g h2 .pn{font-size:9pt;margin-bottom:5pt}
  .g .part-sub{font-size:9pt;margin-bottom:14pt;padding-bottom:9pt;border-bottom-width:1.4pt}
  .g h3{font-size:14pt;margin:16pt 0 5pt;break-after:avoid}
  .g h4{font-size:10pt;margin:11pt 0 3pt;break-after:avoid}
  .g p{margin:0 0 6.5pt}
  .g ul,.g ol{margin-bottom:7pt;padding-left:15pt}.g li{margin-bottom:3pt}
  .g .tw{overflow:visible;margin:9pt 0 11pt}
  .g table{font-size:8.5pt;line-height:1.36}
  .g th{font-size:7.9pt;padding:4pt 5pt 3.5pt}
  .g td{padding:4pt 5pt}
  .g tr{break-inside:avoid}
  .g thead{display:table-header-group}
  .g .cap{font-size:8pt;margin:-7pt 0 10pt}
  .g .co{font-size:9.5pt;padding:8pt 11pt 3pt;margin:10pt 0;border-left-width:2.6pt}
  .g .co>.t{font-size:8.6pt;margin-bottom:3pt}
  .g figure{margin:10pt 0 12pt}
  .g figcaption{font-size:8pt;margin-top:4pt}
  .g .q{padding:8pt 11pt;margin:9pt 0}.g .q .qh{font-size:8.3pt}.g .q ol{font-size:9pt;margin:4pt 0 6pt}.g .q .a{font-size:9.3pt;padding-top:6pt}
  .g ol.refs{font-size:8.2pt;padding-left:16pt}.g ol.refs li{margin-bottom:2.2pt}
  .g .refs-h{font-size:9pt;margin:10pt 0 3pt}
  .g dl.abbr{font-size:8.4pt;gap:1.5pt 10pt}
  .g .lead{font-size:11.2pt}
  .g a{color:inherit;text-decoration:none}
  .g details.q>summary{display:none}
  .noprint{display:none!important}
  .landscape-ok{break-inside:avoid}
}

/* web hero for a guide */
.guide-hero .gh-grid{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:44px;align-items:center}
.guide-hero .gh-cover img{display:block;width:100%;height:auto;border-radius:4px;box-shadow:0 18px 40px -18px rgba(27,38,54,.55)}
.guide-hero .gh-meta{margin-top:14px}
.gh-h{font-family:"Newsreader",Georgia,serif;font-weight:500;font-size:28px;margin:0 0 14px}
@media (max-width:760px){.guide-hero .gh-grid{grid-template-columns:1fr}.guide-hero .gh-cover{max-width:200px;order:-1}}

.g [lang=ar]{font-family:"Noto Naskh Arabic",serif;font-size:1.05em;unicode-bidi:isolate}
.g h2,.g h3,.g h4{scroll-margin-top:84px}
/* figures keep their printed colours in dark mode: draw them on a paper card */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .g figure svg{background:#F4F0E7;border-radius:8px;padding:10px;--g-head:#1B2636;--g-ink:#1B2636;--g-mute:#46515D;--g-note-bg:#ECE6DA;--g-pearl-bg:#E3E8EE;--g-flag-bg:#F5E2D9}}
:root[data-theme="dark"] .g figure svg{background:#F4F0E7;border-radius:8px;padding:10px;--g-head:#1B2636;--g-ink:#1B2636;--g-mute:#46515D;--g-note-bg:#ECE6DA;--g-pearl-bg:#E3E8EE;--g-flag-bg:#F5E2D9}