/* ---------------------------------------------------------------
   Shared base, lifted verbatim from the tokens and shell rules in
   index.html's inline stylesheet on 20 Sep 2026. The supporting
   pages need these because they do not carry the inline block:
   without :root the CSS variables are undefined and anything using
   var(--ink) renders invisible.
   If the inline stylesheet changes, re-extract this section.
   --------------------------------------------------------------- */
@font-face{font-family:LF;src:url(ll152_lf_400.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:LF;src:url(ll152_lf_600.woff2) format('woff2');font-weight:600;font-display:swap}
:root{--paper:#FCFCFA; --ink:#17212B; --muted:#5C6773; --rule:#DDE2E7; --flag:#8A5200; --flagbg:#FBF1DF; --flagrule:#E3C68A; --overdue:#9C2117; --open:#1B5E4B; --focus:#2C6BB8;}
html,body{margin:0}
body{background:var(--paper); color:var(--ink); font-family:LF,'Franklin Gothic',Arial,sans-serif; font-weight:400; font-size:16px; line-height:1.5; -webkit-font-smoothing:antialiased;}
.wrap{max-width:920px;margin:0 auto;padding:40px 24px 72px}
h1{font-size:29px;line-height:1.15;font-weight:600;margin:0 0 6px;letter-spacing:-.012em}
.sub{color:var(--muted);margin:0 0 32px;max-width:56ch}
textarea:focus,button:focus-visible,select:focus-visible{outline:2px solid var(--focus);outline-offset:1px}
.ctawrap{position:relative; overflow:hidden; isolation:isolate; border-radius:10px; padding:1.5px; background:#1B3A57; margin-top:32px;}
.ctacard{position:relative; z-index:1; border-radius:8.5px; background:linear-gradient(135deg,#0E2C47 0%,#111C28 62%); padding:22px 24px; color:#C4D8EC;}
.ctacard h2{font-size:15px;margin:0 0 10px;color:#fff}
.ctacard p{margin:0 0 12px;max-width:64ch;font-size:14.5px;color:#C4D8EC}
.ctacard b{color:#fff}
.ctacard ul{margin:0 0 18px;padding-left:18px;max-width:64ch;list-style:none}
.ctacard li{font-size:14px;margin:0 0 11px;line-height:1.5;position:relative}
.ctacard li:before{content:'';position:absolute;left:-18px;top:.62em;width:7px;height:1px; background:#3B9EFF;opacity:.75}
.bookwrap{position:relative;display:inline-block;padding:2px;border-radius:8px; background:#1F4B78;overflow:hidden;isolation:isolate}
.book{position:relative; z-index:1; display:inline-flex; align-items:center; gap:.5rem; min-height:44px; background:linear-gradient(135deg,#8CC9FF 0%,#4F97E6 100%); color:#04182E; font-weight:700; font-size:.95rem; padding:.78rem 1.3rem; border-radius:6px; text-decoration:none; box-shadow:0 1px 2px rgba(0,0,0,.24), 0 6px 18px rgba(120,180,255,.22); transition:transform .15s ease, box-shadow .2s ease, filter .2s ease;}
.book:hover{filter:brightness(1.06);transform:translateY(-1px);color:#04182E; box-shadow:0 2px 5px rgba(0,0,0,.26), 0 10px 26px rgba(120,180,255,.22)}
.book .arr{transition:transform .15s ease}
.book:hover .arr{transform:translateX(4px)}
.sitefoot{border-top:1px solid var(--rule);margin-top:30px;padding-top:16px; color:var(--muted);font-size:12.5px;line-height:1.6;max-width:66ch}
.sitefoot b{color:var(--ink)}
.sitefoot a{color:var(--focus)}
.sitefoot p{margin:0 0 8px}
.sitefoot p:last-child{margin-bottom:0}
@media (max-width:640px){.wrap{padding:26px 16px 56px}h1{font-size:24px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none !important;animation:none !important}}

/* ---- added for the supporting content pages, Sep 2026 ---- */
.topbar{border-bottom:1px solid var(--rule);background:var(--paper)}
.topbar .bar{max-width:920px;margin:0 auto;padding:11px 24px;display:flex;
  align-items:center;justify-content:space-between;gap:16px}
.brand{font-weight:600;font-size:15px;color:var(--ink);text-decoration:none;
  letter-spacing:-.01em;white-space:nowrap}
.brand span{color:var(--muted);font-weight:400}
.topnav{display:flex;gap:18px;flex-wrap:wrap;justify-content:flex-end}
.topnav a{font-size:13.5px;color:var(--muted);text-decoration:none}
.topnav a:hover,.topnav a:focus-visible{color:var(--ink);text-decoration:underline}
.topnav a[aria-current=page]{color:var(--ink);font-weight:600}
@media (max-width:640px){
  .topbar .bar{padding:10px 16px;flex-direction:column;align-items:flex-start;gap:7px}
  .topnav{justify-content:flex-start;gap:14px}
  .topnav a{font-size:13px}
}

.crumb{font-size:12.5px;color:var(--muted);margin:0 0 18px}
.crumb a{color:var(--muted)}
.crumb a:hover{color:var(--ink)}
.crumb .sep{opacity:.5;padding:0 5px}

.prose{max-width:68ch}
.prose h2{font-size:19px;font-weight:600;margin:34px 0 9px;letter-spacing:-.008em;
  line-height:1.25}
.prose h3{font-size:15.5px;font-weight:600;margin:24px 0 6px}
.prose p{margin:0 0 13px}
.prose ul,.prose ol{margin:0 0 15px;padding-left:20px}
.prose li{margin:0 0 7px}
.prose a{color:var(--focus)}
.prose strong,.prose b{font-weight:600}
.lede{font-size:17.5px;line-height:1.5;color:var(--ink);margin:0 0 20px;max-width:64ch}
.lede b{font-weight:600}

.cite{font-size:12.5px;color:var(--muted)}
.cite code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px}

table.dat{width:100%;border-collapse:collapse;font-size:14px;margin:6px 0 18px}
table.dat caption{text-align:left;font-size:12.5px;color:var(--muted);
  padding:0 0 7px;caption-side:top}
table.dat th,table.dat td{text-align:left;padding:8px 11px 8px 0;
  border-bottom:1px solid var(--rule);vertical-align:top}
table.dat th{font-weight:600;font-size:12.5px;text-transform:uppercase;
  letter-spacing:.045em;color:var(--muted);border-bottom:1px solid var(--ink)}
table.dat td.r,table.dat th.r{text-align:right;padding-right:0}
table.dat tr.now td{background:var(--flagbg)}
table.dat tr.now td:first-child{box-shadow:inset 3px 0 0 var(--flag)}
@media (max-width:640px){
  table.dat{font-size:13px}
  table.dat th,table.dat td{padding:7px 8px 7px 0}
}

.callout{border-left:3px solid var(--flag);background:var(--flagbg);
  padding:13px 16px;margin:18px 0;font-size:14.5px;border-radius:0 4px 4px 0}
.callout p{margin:0 0 9px}
.callout p:last-child{margin:0}
.callout b{color:var(--flag)}

.toolcard{border:1px solid var(--rule);border-radius:8px;padding:17px 19px;
  margin:22px 0 28px;background:#fff}
.toolcard h2{margin:0 0 6px;font-size:16px}
.toolcard p{margin:0 0 13px;font-size:14.5px;color:var(--muted);max-width:60ch}
.toolcard .golink{display:inline-flex;align-items:center;gap:.45rem;min-height:42px;
  padding:.6rem 1.1rem;border-radius:6px;background:var(--ink);color:#fff;
  font-weight:600;font-size:14.5px;text-decoration:none}
.toolcard .golink:hover{background:#0d1620}
.toolcard .golink .arr{transition:transform .15s ease}
.toolcard .golink:hover .arr{transform:translateX(3px)}

.faq{margin:30px 0 0}
.faq h3{font-size:15.5px;font-weight:600;margin:20px 0 5px}
.faq p{margin:0 0 11px;max-width:66ch}

.guides{margin:38px 0 0;border-top:1px solid var(--rule);padding-top:22px}
.guides h2{font-size:13px;text-transform:uppercase;letter-spacing:.06em;
  color:var(--muted);font-weight:600;margin:0 0 14px}
.gcards{display:grid;grid-template-columns:repeat(3,1fr);gap:11px}
@media (max-width:860px){.gcards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.gcards{grid-template-columns:1fr}}
.gcard{display:block;border:1px solid var(--rule);border-radius:7px;padding:13px 15px;
  text-decoration:none;color:var(--ink);background:#fff}
.gcard:hover{border-color:var(--ink)}
.gcard b{display:block;font-size:14.5px;font-weight:600;margin:0 0 3px}
.gcard span{display:block;font-size:13px;color:var(--muted);line-height:1.45}

.sources{margin:34px 0 0;border-top:1px solid var(--rule);padding-top:18px;
  font-size:13px;color:var(--muted)}
.sources h2{font-size:13px;text-transform:uppercase;letter-spacing:.06em;
  color:var(--muted);font-weight:600;margin:0 0 10px}
.sources ol{margin:0;padding-left:19px}
.sources li{margin:0 0 6px;line-height:1.5}
.sources a{color:var(--focus);overflow-wrap:anywhere}
.byline{margin:16px 0 0;font-size:12.5px;color:var(--muted);line-height:1.6}
.byline b{color:var(--ink)}

.footmap{border-top:1px solid var(--rule);margin-top:34px;padding-top:20px;
  display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media (max-width:640px){.footmap{grid-template-columns:1fr;gap:16px}}
.footmap h2{font-size:12px;text-transform:uppercase;letter-spacing:.06em;
  color:var(--muted);font-weight:600;margin:0 0 9px}
.footmap ul{list-style:none;margin:0;padding:0}
.footmap li{margin:0 0 6px}
.footmap a{font-size:13.5px;color:var(--ink);text-decoration:none}
.footmap a:hover{text-decoration:underline}