/* Pen Pusher — the policy pages.
   Same tokens, same self-hosted fonts and the same warm paper as the app.
   Zero requests to any origin but our own: no Google Fonts, no CDN, no script.

   Fonts are self-hosted exactly as public/index.html does it, latin and
   latin-ext cuts only. Three families here: Caveat for the display hand,
   Instrument Sans for reading, IBM Plex Mono for labels. */
@font-face{font-family:'Caveat';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/caveat-400700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Caveat';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/caveat-400700-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-mono-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-mono-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-mono-500-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-mono-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/ibm-plex-mono-600-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/ibm-plex-mono-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/instrument-sans-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/instrument-sans-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/instrument-sans-500-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/instrument-sans-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/instrument-sans-600-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/instrument-sans-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/instrument-sans-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/instrument-sans-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

/* ---------- tokens: copied verbatim from public/index.html so the policy
     pages and the app are the same room. Light is the base; both themes are
     defined at token level. ---------- */
:root{
  --desk:#EFEAE0; --desk-deep:#E3DCCD;
  --panel:#FAF7F1; --panel-2:#F3EFE6; --panel-3:#EAE4D7;
  --line:#DED6C7; --line-soft:#E8E1D4;
  --text:#1B1A17; --muted:#6B655B; --faint:#948D80;
  --ink:#1F3A6E; --ink-tint:rgba(31,58,110,.10); --ink-edge:rgba(31,58,110,.34);
  --on-ink:#FAF7F1;
  --red:#A8443E; --red-tint:rgba(168,68,62,.10); --red-edge:rgba(168,68,62,.40);
  --shadow:0 1px 2px rgba(60,50,35,.08), 0 14px 34px -10px rgba(60,50,35,.24);
  --sheet-shadow:0 2px 4px rgba(60,50,35,.14), 0 26px 50px -18px rgba(60,50,35,.38);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --desk:#15130F; --desk-deep:#0E0D0A;
    --panel:#201E1B; --panel-2:#1A1917; --panel-3:#2A2723;
    --line:#332F2A; --line-soft:#2A2723;
    --text:#F0EBE1; --muted:#A29A8C; --faint:#7C7568;
    --ink:#8FAFE0; --ink-tint:rgba(143,175,224,.14); --ink-edge:rgba(143,175,224,.42);
    --on-ink:#161513;
    --red:#D98A83; --red-tint:rgba(217,138,131,.13); --red-edge:rgba(217,138,131,.45);
    --shadow:0 1px 2px rgba(0,0,0,.5), 0 14px 34px -10px rgba(0,0,0,.6);
    --sheet-shadow:0 2px 6px rgba(0,0,0,.55), 0 30px 60px -18px rgba(0,0,0,.8);
  }
}
:root[data-theme="dark"]{
  --desk:#15130F; --desk-deep:#0E0D0A;
  --panel:#201E1B; --panel-2:#1A1917; --panel-3:#2A2723;
  --line:#332F2A; --line-soft:#2A2723;
  --text:#F0EBE1; --muted:#A29A8C; --faint:#7C7568;
  --ink:#8FAFE0; --ink-tint:rgba(143,175,224,.14); --ink-edge:rgba(143,175,224,.42);
  --on-ink:#161513;
  --red:#D98A83; --red-tint:rgba(217,138,131,.13); --red-edge:rgba(217,138,131,.45);
  --shadow:0 1px 2px rgba(0,0,0,.5), 0 14px 34px -10px rgba(0,0,0,.6);
  --sheet-shadow:0 2px 6px rgba(0,0,0,.55), 0 30px 60px -18px rgba(0,0,0,.8);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth; scroll-padding-top:86px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0; color:var(--text);
  background:var(--desk);
  background-image:radial-gradient(120% 70% at 50% -10%, var(--desk) 0%, var(--desk-deep) 100%);
  background-attachment:fixed;
  font-family:"Instrument Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:15px; line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
:focus-visible{outline:2px solid var(--ink); outline-offset:2px; border-radius:3px}

.skip{
  position:absolute; left:-9999px; top:8px; z-index:60;
  background:var(--ink); color:var(--on-ink); padding:8px 14px; border-radius:6px;
  font-size:13px; text-decoration:none;
}
.skip:focus{left:12px}

/* ---------- top bar: the app's own topbar, trimmed to links ---------- */
.bar{
  display:flex; align-items:center; gap:18px; flex-wrap:wrap;
  padding:11px 20px; background:var(--panel); border-bottom:1px solid var(--line);
  position:sticky; top:0; z-index:20;
}
.mark{display:flex; align-items:baseline; gap:10px; margin-right:auto; text-decoration:none}
.mark b{
  font-family:"Caveat",ui-rounded,cursive; font-weight:600; font-size:30px;
  line-height:1; color:var(--ink); letter-spacing:.01em;
}
.mark span{
  font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:10.5px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--faint); padding-bottom:2px;
}
.barnav{display:flex; align-items:center; gap:4px; flex-wrap:wrap}
.barnav a{
  padding:6px 10px; border-radius:6px; text-decoration:none; color:var(--muted);
  font-size:13.5px; transition:background .13s ease, color .13s ease;
}
.barnav a:hover{background:var(--panel-2); color:var(--text)}
.barnav a[aria-current="page"]{color:var(--text); font-weight:600; background:var(--panel-2)}
.barnav a.cta{
  background:var(--ink); border:1px solid var(--ink); color:var(--on-ink);
  font-weight:500; margin-left:6px;
}
.barnav a.cta:hover{background:var(--ink); color:var(--on-ink); filter:brightness(1.08)}

/* ---------- page frame ---------- */
.wrap{
  max-width:1120px; margin:0 auto; padding:38px 20px 86px;
  display:grid; grid-template-columns:214px minmax(0,1fr); gap:44px; align-items:start;
}

/* ---------- on this page ---------- */
.toc{
  position:sticky; top:84px; font-size:13px;
  background:var(--panel); border:1px solid var(--line); border-radius:10px;
  padding:14px 16px; box-shadow:var(--shadow);
}
.toc > summary{
  list-style:none; cursor:pointer;
  font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:10px;
  letter-spacing:.15em; text-transform:uppercase; color:var(--muted);
  display:flex; align-items:center; gap:8px;
}
.toc > summary::-webkit-details-marker{display:none}
.toc > summary .chev{
  width:7px; height:7px; flex:none; margin-left:auto;
  border-right:1.6px solid var(--faint); border-bottom:1.6px solid var(--faint);
  transform:rotate(-45deg); transition:transform .18s ease;
}
.toc[open] > summary .chev{transform:rotate(45deg)}
.toc ol{list-style:none; margin:12px 0 0; padding:0 0 0 1px; counter-reset:t}
.toc li{margin:0}
.toc a{
  display:flex; gap:9px; padding:4px 0; text-decoration:none; color:var(--muted);
  line-height:1.4; font-size:12.8px;
}
.toc a::before{
  counter-increment:t; content:counter(t);
  font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:10.5px; color:var(--faint);
  flex:none; min-width:14px; text-align:right; padding-top:1px;
}
.toc a:hover{color:var(--ink)}
.toc a:hover::before{color:var(--ink)}
@media (prefers-reduced-motion:reduce){.toc > summary .chev{transition:none}}
/* The list runs to sixteen entries. On a phone that is a wall of links above the
   title, so the <details> ships closed and the desktop rail forces it open —
   no script. A browser without ::details-content just shows it closed and
   clickable, which is the same control one tap away, not a broken one. */
@media (min-width:1001px){
  .toc::details-content{content-visibility:visible; block-size:auto}
  .toc > summary{cursor:default}
  .toc > summary .chev{display:none}
}

/* ---------- the sheet ---------- */
.sheet{
  position:relative; background:var(--panel); border:1px solid var(--line);
  border-radius:3px; box-shadow:var(--sheet-shadow);
  padding:52px 58px 46px 76px; max-width:760px;
}
/* the printed margin rule, same red the app reserves for it */
.sheet::before{
  content:""; position:absolute; top:0; bottom:0; left:46px; width:1px;
  background:linear-gradient(to bottom, transparent 0, var(--red) 46px,
             var(--red) calc(100% - 46px), transparent 100%);
  opacity:.3; pointer-events:none;
}

.eyebrow{
  display:flex; align-items:center; gap:8px; margin:0 0 16px;
  font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:10px;
  letter-spacing:.18em; text-transform:uppercase; color:var(--faint);
}
.eyebrow::before{content:""; width:5px; height:5px; border-radius:50%; background:var(--red)}

h1{
  font-family:"Caveat",ui-rounded,cursive; font-weight:700;
  font-size:clamp(42px,7.4vw,62px); line-height:.98; letter-spacing:.005em;
  color:var(--ink); margin:0 0 14px;
}
.updated{
  margin:0 0 22px; font-family:"IBM Plex Mono",ui-monospace,monospace;
  font-size:11px; letter-spacing:.07em; color:var(--faint);
}

/* ---------- the draft warning, on every page ---------- */
.draft{
  display:flex; gap:14px; align-items:flex-start; margin:0 0 30px;
  border:1px dashed var(--red-edge); background:var(--red-tint);
  border-radius:9px; padding:14px 16px;
}
.draft .tag{
  flex:none; font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:9.5px;
  letter-spacing:.16em; text-transform:uppercase; color:var(--on-ink);
  background:var(--red); border-radius:4px; padding:4px 7px; margin-top:1px;
}
.draft div{font-size:13.5px; line-height:1.6; color:var(--text)}
.draft b{font-weight:600}
.draft p{margin:0}
.draft p + p{margin-top:7px; color:var(--muted)}

/* ---------- body ---------- */
.sheet p.lede{
  font-size:17.5px; line-height:1.68; margin:0 0 15px;
  color:var(--text);
}
.sheet p{
  font-size:16px; line-height:1.72; margin:0 0 15px;
  color:var(--text); color:color-mix(in srgb, var(--text) 84%, var(--panel));
}
.sheet p:last-child{margin-bottom:0}
.sheet strong{font-weight:600; color:var(--text)}
.sheet em{font-style:italic}

.sec{border-top:1px solid var(--line-soft); margin-top:36px; padding-top:32px}
.sec:first-of-type{border-top:none}

h2{
  display:flex; gap:13px; align-items:baseline;
  margin:0 0 16px; font-size:23px; line-height:1.25; font-weight:600;
  letter-spacing:-.012em; color:var(--text);
}
h2 .n{
  flex:none; font-family:"IBM Plex Mono",ui-monospace,monospace;
  font-size:12.5px; font-weight:500; color:var(--red); letter-spacing:.04em;
  position:relative; top:-1px;
}
h3{
  margin:26px 0 11px; font-family:"IBM Plex Mono",ui-monospace,monospace;
  font-size:10.5px; letter-spacing:.15em; text-transform:uppercase;
  font-weight:500; color:var(--muted);
}
h4{margin:20px 0 8px; font-size:15px; font-weight:600; color:var(--text)}

/* arrow bullets: a pen stroke, not a dot */
.sheet ul{list-style:none; padding:0; margin:16px 0 18px; display:flex; flex-direction:column; gap:11px}
.sheet ul li{position:relative; padding-left:25px; font-size:15.5px; line-height:1.66;
  color:var(--text); color:color-mix(in srgb, var(--text) 84%, var(--panel));}
.sheet ul li::before{
  content:"\2192"; position:absolute; left:0; top:0; color:var(--red);
  font-size:14px; line-height:1.72;
}
.sheet ol{margin:16px 0 18px; padding-left:22px; display:flex; flex-direction:column; gap:11px}
.sheet ol li{font-size:15.5px; line-height:1.66;
  color:var(--text); color:color-mix(in srgb, var(--text) 84%, var(--panel));}
.sheet ol li::marker{color:var(--red); font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:12.5px}
.sheet li p{font-size:inherit; margin:8px 0 0}

/* key-points card: the "short version" at the head of a long document */
.key{
  background:var(--panel-2); border:1px solid var(--line); border-radius:11px;
  padding:22px 24px 24px; margin:0 0 4px;
}
.key h3{margin-top:0}
.key ul{margin-bottom:0}

/* a quiet aside inside a section */
.note{
  border-left:2px solid var(--ink-edge); background:var(--panel-2);
  padding:13px 16px; border-radius:0 8px 8px 0; margin:18px 0;
}
.note p{margin:0; font-size:14.5px; color:var(--muted)}
.note p + p{margin-top:8px}

a{color:var(--ink); text-decoration:underline; text-underline-offset:2px;
  text-decoration-thickness:1px; text-decoration-color:var(--ink-edge)}
a:hover{text-decoration-color:var(--ink)}

code{
  font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:.84em;
  background:var(--panel-3); padding:1px 4px; border-radius:3px; color:var(--muted);
}

/* ---------- THE PLACEHOLDERS. Loud on purpose. ---------- */
mark.ph{
  display:inline; background:var(--red-tint); color:var(--red);
  border:1px dashed var(--red-edge); border-radius:4px;
  padding:1px 6px; margin:0 1px;
  font-family:"IBM Plex Mono",ui-monospace,monospace;
  font-size:.82em; font-weight:500; line-height:1.3;
  text-decoration:none;
}
.phcount{
  display:block;
  font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:12px;
  line-height:1.5; letter-spacing:.01em; color:var(--red);
}
.draft p.phcount{color:var(--red)}
.phcount b{font-weight:600}

/* ---------- tables ---------- */
.sheet table{width:100%; border-collapse:collapse; margin:18px 0; font-size:15px}
.sheet th{
  text-align:left; padding:0 16px 9px 0; vertical-align:bottom;
  font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:10px;
  letter-spacing:.15em; text-transform:uppercase; font-weight:500; color:var(--faint);
  border-bottom:1px solid var(--line);
}
.sheet td{
  padding:11px 16px 11px 0; border-bottom:1px solid var(--line-soft);
  vertical-align:top; line-height:1.6;
  color:var(--text); color:color-mix(in srgb, var(--text) 84%, var(--panel));
}
.sheet td:last-child, .sheet th:last-child{padding-right:0}
.sheet tr:last-child td{border-bottom:none}

/* the postal block on the contact page */
.addr{
  font-style:normal; display:flex; flex-direction:column; gap:7px;
  background:var(--panel-2); border:1px solid var(--line); border-radius:11px;
  padding:20px 22px; margin:18px 0; font-size:15.5px; line-height:1.6;
}

/* ---------- editor-only material, flagged to be deleted ---------- */
.editorial{
  margin-top:44px; border:1px dashed var(--red-edge); background:var(--red-tint);
  border-radius:11px; padding:24px 26px;
}
.editorial > h2{margin-top:0}
.editorial .warn{
  font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:10.5px;
  letter-spacing:.12em; text-transform:uppercase; color:var(--red); margin:0 0 14px;
}
.editorial ul li::before{content:"\25A1"; font-size:12px}
.editorial ul li.done::before{content:"\2611"}
.editorial ul li.done{text-decoration:line-through; color:var(--faint)}
.editorial ul{gap:8px}
.editorial ul li{font-size:14.5px}

/* ---------- cross-links ---------- */
/* `.sheet ul` beats a bare `.cards`, so these have to be scoped the same way
   or the grid silently reverts to a bulleted column. */
.sheet ul.cards{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(196px,1fr)); gap:12px;
  margin:18px 0 0; padding:0; list-style:none;
}
.sheet ul.cards > li{padding:0; font-size:inherit; line-height:inherit}
.sheet ul.cards > li::before{content:none}
.card{
  display:flex; flex-direction:column; gap:7px; height:100%;
  background:var(--panel-2); border:1px solid var(--line); border-radius:11px;
  padding:18px 19px 17px; text-decoration:none; color:inherit;
  transition:border-color .13s ease, background .13s ease, transform .07s ease;
}
.card:hover{border-color:var(--ink-edge); background:var(--panel-3)}
.card:active{transform:translateY(1px)}
.card b{font-size:16px; font-weight:600; color:var(--text); letter-spacing:-.01em}
.card span{font-size:13.5px; line-height:1.55; color:var(--muted); flex:1}
.card i{
  font-style:normal; font-family:"IBM Plex Mono",ui-monospace,monospace;
  font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--red);
}

.docfoot{border-top:1px solid var(--line-soft); margin-top:44px; padding-top:30px}
.docfoot h2{font-size:19px; margin-bottom:4px}
.backapp{
  display:inline-flex; align-items:center; gap:8px; margin-top:22px;
  padding:9px 15px; border:1px solid var(--line); background:var(--panel-2);
  border-radius:7px; text-decoration:none; color:var(--text);
  font-size:13.5px; font-weight:500;
}
.backapp:hover{border-color:var(--ink-edge); background:var(--panel-3)}
.backapp .ar{color:var(--red)}

/* ---------- hub page ---------- */
.wrap.solo{grid-template-columns:minmax(0,1fr); max-width:840px}
.wrap.solo .sheet{max-width:none}
.sheet ul.hubcards{grid-template-columns:repeat(auto-fit,minmax(232px,1fr)); gap:14px; margin-top:26px}
.hubcards .card{padding:22px 22px 20px; gap:9px}
.hubcards .card b{font-size:18px}

/* ---------- responsive ---------- */
@media (max-width:1000px){
  .wrap{grid-template-columns:minmax(0,1fr); gap:20px; max-width:800px}
  .toc{position:static; max-width:760px}
  .sheet{max-width:none}
}
@media (max-width:620px){
  .bar{padding:10px 14px; gap:10px}
  .mark b{font-size:26px}
  .mark span{display:none}
  .barnav{gap:2px}
  .barnav a{padding:5px 8px; font-size:12.5px}
  .barnav a.cta{margin-left:2px}
  .wrap{padding:22px 14px 60px}
  .sheet{padding:30px 20px 34px 40px; border-radius:2px}
  .sheet::before{left:20px}
  .lede{font-size:16.5px}
  .sheet p, .sheet ul li, .sheet ol li{font-size:15px}
  h2{font-size:20px; gap:10px}
  .key{padding:18px 18px 20px}
  .editorial{padding:18px 18px 20px}
  .sheet table{font-size:14px}
  .draft{flex-direction:column; gap:10px}
}

/* ---------- print: a policy gets printed ---------- */
@media print{
  .bar, .toc, .skip, .cards, .backapp, .docfoot{display:none !important}
  body{background:#fff; color:#000}
  .wrap{display:block; padding:0; max-width:none}
  .sheet{box-shadow:none; border:none; max-width:none; padding:0}
  .sheet::before{display:none}
  a{color:#000; text-decoration:underline}
  mark.ph{background:none; border:1px solid #000; color:#000}
}