/* Self-hosted fonts (SIL Open Font License; see /fonts/LICENSES.txt) */
@font-face{font-family:"Bitter";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/bitter-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Bitter";font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/bitter-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Bitter";font-style:normal;font-weight:800;font-display:swap;src:url(/fonts/bitter-latin-800-normal.woff2) format("woff2")}
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/source-sans-3-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/source-sans-3-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/source-sans-3-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Source Sans 3";font-style:italic;font-weight:400;font-display:swap;src:url(/fonts/source-sans-3-latin-400-italic.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/ibm-plex-mono-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/ibm-plex-mono-latin-500-normal.woff2) format("woff2")}
:root{color-scheme:light}
html{-webkit-text-size-adjust:100%}
img{max-width:100%}
[hidden]{display:none!important}
/* Layout: a case-file site. Sticky docket bar, one section shown at a time, narrow reading column with wide tool panels. */
:root{
  --paper:#F2F4F6; --sheet:#FFFFFF; --ink:#15233A; --ink-2:#4A5568; --rule:#D5DBE3;
  --flag:#B8391A; --flag-wash:#FBEAE4; --go:#1D6B5F; --go-wash:#E2F1EE; --hl:#FFE9A8;
  --f-display:"Bitter",Georgia,"Times New Roman",serif;
  --f-body:"Source Sans 3","Segoe UI",system-ui,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --s1:.875rem; --s2:1rem; --s3:1.125rem; --s4:1.4rem; --s5:1.9rem; --s6:2.6rem;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --paper:#0F1622; --sheet:#172131; --ink:#E6EAF0; --ink-2:#A3AEBD; --rule:#2B384B;
  --flag:#F0805F; --flag-wash:#3A1F18; --go:#5CC3B0; --go-wash:#15302C; --hl:#5A4A12; color-scheme:dark}}
:root[data-theme="dark"]{
  --paper:#0F1622; --sheet:#172131; --ink:#E6EAF0; --ink-2:#A3AEBD; --rule:#2B384B;
  --flag:#F0805F; --flag-wash:#3A1F18; --go:#5CC3B0; --go-wash:#15302C; --hl:#5A4A12; color-scheme:dark}

*{box-sizing:border-box}
body{background:var(--paper);color:var(--ink);font-family:var(--f-body);font-size:var(--s3);line-height:1.6;margin:0}
a{color:var(--go);text-underline-offset:2px}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--flag);outline-offset:2px}
h1,h2,h3{font-family:var(--f-display);line-height:1.2;text-wrap:balance;margin:0}
h1{font-size:var(--s6);font-weight:800}
h2{font-size:var(--s5);font-weight:700}
h3{font-size:var(--s4);font-weight:700}
p{margin:0}
.wrap{max-width:1080px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.read{max-width:68ch}
.stack{display:flex;flex-direction:column;gap:1rem}
.stack-lg{display:flex;flex-direction:column;gap:2.25rem}
.label{font-family:var(--f-mono);font-size:var(--s1);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.muted{color:var(--ink-2)}
.small{font-size:var(--s1)}

/* Docket bar */
header.bar{position:sticky;top:env(safe-area-inset-top,0px);z-index:10;background:var(--ink);color:var(--paper)}
header.bar .wrap{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;padding-block:.6rem}
.brand{font-family:var(--f-display);font-weight:800;font-size:1.25rem;color:inherit;text-decoration:none;display:flex;align-items:center;gap:.5rem}
.brand .stamp{font-family:var(--f-mono);font-size:.7rem;font-weight:500;border:1.5px solid var(--flag);color:var(--flag);padding:.05rem .35rem;transform:rotate(-4deg);letter-spacing:.08em}
nav.tabs{display:flex;gap:.25rem;flex-wrap:wrap;margin-left:auto}
nav.tabs a{color:var(--paper);opacity:.78;text-decoration:none;font-size:var(--s1);font-weight:600;padding:.35rem .6rem;border-radius:3px}
nav.tabs a:hover{opacity:1}
nav.tabs a[aria-current="page"]{opacity:1;background:var(--flag);color:#fff}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) header.bar{background:#0A0F18;color:var(--ink)} :root:not([data-theme="light"]) nav.tabs a{color:var(--ink)}}
:root[data-theme="dark"] header.bar{background:#0A0F18;color:var(--ink)}
:root[data-theme="dark"] nav.tabs a{color:var(--ink)}

main{padding-block:2.5rem 4rem}
section.page{display:flex;flex-direction:column;gap:2.25rem}

/* Hero */
.hero{display:grid;grid-template-columns:1.3fr 1fr;gap:2.5rem;align-items:start}
.hero > *{min-width:0}
.hero .strike{text-decoration:line-through;text-decoration-color:var(--flag);text-decoration-thickness:4px}
.hero p.lede{font-size:1.25rem;color:var(--ink-2);margin-top:1rem;max-width:52ch}
.ledger{background:var(--sheet);border:1px solid var(--rule);font-family:var(--f-mono);font-size:var(--s1);font-variant-numeric:tabular-nums}
.ledger .lh{display:flex;justify-content:space-between;padding:.6rem .9rem;border-bottom:1px solid var(--rule)}
.ledger table{width:100%;border-collapse:collapse}
.ledger td{padding:.45rem .9rem;border-bottom:1px dashed var(--rule)}
.ledger td.r{text-align:right}
.ledger tr.bad td{background:var(--flag-wash);color:var(--flag)}
.ledger .lf{padding:.7rem .9rem;font-family:var(--f-body);font-size:var(--s1);color:var(--ink-2)}
.doors{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.door{display:flex;flex-direction:column;gap:.5rem;padding:1.25rem;background:var(--sheet);border:1px solid var(--rule);text-decoration:none;color:var(--ink)}
.door:hover{border-color:var(--ink)}
.door h2{font-size:1.2rem}
.door .go{margin-top:auto;font-weight:700;color:var(--go)}
.door.urgent{border-top:4px solid var(--flag)}
.flags{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.75rem 1.5rem}
.flags li{list-style:none;padding-left:1.4rem;position:relative}
.flags li::before{content:"";position:absolute;left:0;top:.55em;width:.7rem;height:.7rem;background:var(--flag);clip-path:polygon(0 0,100% 50%,0 100%)}
ul.plain{margin:0;padding-left:1.2rem;display:flex;flex-direction:column;gap:.35rem}

/* Steps */
ol.steps{list-style:none;margin:0;padding:0;counter-reset:s;display:flex;flex-direction:column;gap:0}
ol.steps > li{counter-increment:s;display:grid;grid-template-columns:3.2rem 1fr;gap:1rem;padding-block:1.25rem;border-top:1px solid var(--rule)}
ol.steps > li::before{content:counter(s,decimal-leading-zero);font-family:var(--f-mono);font-size:1.4rem;color:var(--flag);font-weight:500}
ol.steps > li > div{min-width:0;display:flex;flex-direction:column;gap:.4rem}
.dont{background:var(--flag-wash);border-left:4px solid var(--flag);padding:1.25rem 1.4rem}
.dont h3{color:var(--flag)}
.note{background:var(--go-wash);border-left:4px solid var(--go);padding:1rem 1.25rem}
.panel{background:var(--sheet);border:1px solid var(--rule);padding:1.5rem}
.panel > h3 + p{margin-top:.4rem}
.two{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.two > *{min-width:0}

/* Forms & tools */
label.f{display:flex;flex-direction:column;gap:.3rem;font-weight:600;font-size:var(--s2)}
input[type=text],input[type=email],input[type=number],input[type=date],select,textarea{font:inherit;font-size:var(--s2);color:var(--ink);background:var(--paper);border:1px solid var(--rule);border-radius:3px;padding:.55rem .65rem;width:100%}
textarea{min-height:7rem;resize:vertical}
.btn{font:inherit;font-weight:700;font-size:var(--s2);border:0;border-radius:3px;padding:.6rem 1.1rem;cursor:pointer;background:var(--ink);color:var(--paper)}
.btn.alt{background:transparent;color:var(--ink);border:1px solid var(--rule)}
.btn.flag{background:var(--flag);color:#fff}
.row{display:flex;gap:.75rem;flex-wrap:wrap;align-items:center}
.calc{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.result{font-family:var(--f-mono);font-variant-numeric:tabular-nums;padding:1rem;border:1px dashed var(--rule);margin-top:1rem}
.result strong{font-family:var(--f-display);font-size:1.3rem;display:block}
.q{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem}
.q legend{font-weight:700;margin-bottom:.4rem;font-size:var(--s3)}
.opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.5rem}
.opt{display:flex;gap:.55rem;align-items:flex-start;padding:.6rem .75rem;border:1px solid var(--rule);border-radius:3px;background:var(--paper);cursor:pointer;font-size:var(--s2);line-height:1.35}
.opt:has(input:checked){border-color:var(--go);background:var(--go-wash)}
.opt input{margin-top:.2rem;accent-color:var(--go)}
.recs{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem}
.rec{border:1px solid var(--rule);background:var(--paper);padding:1rem 1.1rem;display:flex;flex-direction:column;gap:.4rem}
.rec .why{font-size:var(--s1);color:var(--ink-2)}
.rec.primary{border-color:var(--go);border-width:2px}
.agency{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1rem}
.agency article{background:var(--sheet);border:1px solid var(--rule);padding:1.25rem;display:flex;flex-direction:column;gap:.5rem}
.agency .tag{align-self:flex-start;font-family:var(--f-mono);font-size:.78rem;border:1px solid var(--rule);padding:.05rem .4rem}
.check li{list-style:none;padding:0}
.check{padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:.4rem 1.5rem}
.check label{display:flex;gap:.55rem;align-items:flex-start;font-size:var(--s2);line-height:1.4;cursor:pointer}
.check input{margin-top:.25rem;accent-color:var(--go)}
.check input:checked + span{color:var(--ink-2);text-decoration:line-through}
.progress{height:6px;background:var(--rule);margin-top:.75rem}
.progress > i{display:block;height:100%;background:var(--go);width:0;transition:width .2s}
.scroll{overflow-x:auto}
table.grid{width:100%;border-collapse:collapse;font-size:var(--s2)}
table.grid th{text-align:left;font-family:var(--f-mono);font-size:.78rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-2);padding:.5rem;border-bottom:2px solid var(--ink)}
table.grid td{padding:.4rem .5rem;border-bottom:1px solid var(--rule);vertical-align:top}
table.grid td input{padding:.35rem .45rem}
table.tl{min-width:640px}
.states{min-width:560px}
.states td:first-child{font-weight:700;white-space:nowrap}

/* History */
.dur{padding-right:4.5rem;display:grid;grid-template-columns:9rem 1fr;gap:.45rem 1rem;align-items:center;font-size:var(--s2)}
.dur .track{height:1.15rem;background:var(--rule);position:relative}
.dur .fill{position:absolute;inset:0 auto 0 0;background:var(--ink)}
.dur .fill.ext{background:repeating-linear-gradient(90deg,var(--ink) 0 6px,transparent 6px 10px);opacity:.55}
.dur .v{font-family:var(--f-mono);font-size:.8rem;position:absolute;left:calc(100% + .4rem);top:50%;transform:translateY(-50%);white-space:nowrap;color:var(--ink-2)}
.dur .fill.lbl .v{left:calc(100% + .4rem)}
.axis{display:flex;justify-content:space-between;font-family:var(--f-mono);font-size:.75rem;color:var(--ink-2);grid-column:2}
.case{background:var(--sheet);border:1px solid var(--rule);display:grid;grid-template-columns:15rem 1fr}
.case > *{min-width:0}
.case aside{border-right:1px solid var(--rule);padding:1.4rem;display:flex;flex-direction:column;gap:.9rem;font-size:var(--s2)}
.case aside dl{margin:0;display:flex;flex-direction:column;gap:.7rem}
.case aside dt{font-family:var(--f-mono);font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2)}
.case aside dd{margin:0;font-weight:600;font-variant-numeric:tabular-nums}
.case .body{padding:1.4rem 1.6rem;display:flex;flex-direction:column;gap:.85rem}
.case .body h3{font-family:var(--f-body);font-size:var(--s2);text-transform:uppercase;letter-spacing:.06em;margin:.4rem 0 0;color:var(--flag)}
.lesson{border-top:1px solid var(--rule);padding-top:.8rem;font-size:var(--s2)}

/* Tactics */
.pitch{font-family:var(--f-body);background:var(--paper);border:1px solid var(--rule);padding:1.25rem 1.4rem;line-height:1.75;font-size:var(--s3)}
.pitch mark{background:var(--hl);color:inherit;padding:.05rem .15rem}
.pitch sup{font-family:var(--f-mono);font-size:.7rem;color:var(--flag);font-weight:500;margin-left:.1rem}
.example-tag{font-family:var(--f-mono);font-size:.75rem;color:var(--ink-2)}
.tactics{display:flex;flex-direction:column;gap:1.25rem}
.tactic{background:var(--sheet);border:1px solid var(--rule);padding:1.4rem 1.6rem;display:flex;flex-direction:column;gap:.9rem}
.tactic header{display:flex;gap:.8rem;align-items:baseline;flex-wrap:wrap}
.tactic header .n{font-family:var(--f-mono);color:var(--flag);font-weight:500}
.tactic .cols{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.tactic .cols > div{min-width:0;font-size:var(--s2);display:flex;flex-direction:column;gap:.3rem}
.tactic .cols h3{font-family:var(--f-mono);font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2);margin:0}
.quote{border-left:3px solid var(--flag);padding-left:1rem;font-style:italic}
.keylist{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.5rem 1.5rem;font-size:var(--s2)}
.keylist div{display:flex;gap:.5rem}
.keylist b{font-family:var(--f-mono);color:var(--flag);font-weight:500}

.status{padding:.8rem 1rem;border-radius:3px;font-size:var(--s2)}
.status.ok{background:var(--go-wash);color:var(--ink)}
.status.err{background:var(--flag-wash);color:var(--ink)}
footer{border-top:1px solid var(--rule);padding-block:2rem 3rem;font-size:var(--s1);color:var(--ink-2)}
footer .wrap{display:flex;flex-direction:column;gap:.6rem}

@media (max-width:820px){
  .hero,.two,.calc{grid-template-columns:1fr}
  .doors{grid-template-columns:1fr}
  .case{grid-template-columns:1fr}
  .case aside{border-right:0;border-bottom:1px solid var(--rule)}
  .tactic .cols{grid-template-columns:1fr}
  .dur{grid-template-columns:6.5rem 1fr}
  h1{font-size:2rem}
  nav.tabs{margin-left:0}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
.case-name,.tactic-name,h2.h3{font-size:var(--s4)}
.case{scroll-margin-top:5rem}
footer nav{display:flex;flex-wrap:wrap;gap:.4rem 1.25rem;margin-bottom:.4rem}
footer nav a{color:var(--ink-2);font-weight:600}
.notfound{display:flex;flex-direction:column;gap:1.25rem;padding-block:2rem}
.notfound ul{margin:0;padding-left:1.2rem;display:flex;flex-direction:column;gap:.35rem}

/* Home hero: keyword h1 as eyebrow, display line as tagline */
h1.label{font-weight:500;font-size:var(--s1);line-height:1.4}
.display{font-family:var(--f-display);font-size:var(--s6);font-weight:800;line-height:1.15;text-wrap:balance;margin:0}
/* Comparison table */
table.compare{min-width:640px}
table.compare th[scope=row]{font-family:var(--f-body);font-size:var(--s2);font-weight:700;text-transform:none;letter-spacing:0;color:var(--ink);border-bottom:1px solid var(--rule);width:12rem}
table.compare td{padding:.6rem .5rem}
/* Q&A */
.faq .qa{border-top:1px solid var(--rule);padding-top:1rem;display:flex;flex-direction:column;gap:.4rem}
.faq .qa h3{font-size:1.2rem}
/* Related links */
.related{display:flex;flex-direction:column;gap:.9rem}
.related-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem}
.related-list a{display:flex;flex-direction:column;gap:.25rem;height:100%;padding:1rem 1.1rem;background:var(--sheet);border:1px solid var(--rule);text-decoration:none;color:var(--ink)}
.related-list a:hover{border-color:var(--ink)}
.related-list strong{color:var(--go)}
.related-list span{font-size:var(--s2);color:var(--ink-2)}
/* Sources and review date */
.sources{border-top:2px solid var(--ink);padding-top:1rem;display:flex;flex-direction:column;gap:.6rem}
.sources ul,.case-src ul{margin:0;padding-left:1.2rem;display:flex;flex-direction:column;gap:.35rem;font-size:var(--s2)}
.case-src{font-size:var(--s2)}
.case-src summary{cursor:pointer;font-weight:600;color:var(--ink-2)}
.case-src ul{margin-top:.5rem}
.reviewed{font-family:var(--f-mono);font-size:.8rem;color:var(--ink-2);margin:0}
@media (max-width:820px){.display{font-size:2rem}}
.ts-box{min-height:65px}