/* vbdr.net — one stylesheet, five pages.
 *
 * Two type families and nothing else: no CDN, no framework, no analytics. The
 * webfonts are served from this origin (fonts/) because the-catch page tells a
 * reader this site "loads no fonts or scripts from anyone else", and a claim on
 * a page about honesty is the last one that should be quietly untrue.
 *
 * The design is a paper stock ruled like ledger stock, with dark bands at the
 * head and foot. Blue is the reader's: what they approve, own or can read. Red
 * is what they are never invoiced for. Those two meanings are load-bearing —
 * the legend in the hero names them, so do not use either colour decoratively.
 */

/* ============ self-hosted type ============================================ */
/* Newsreader ships one variable file covering 200..600 with an optical-size
   axis, which is why the 68px hero and the 15px caption can share a face. */
@font-face{
  font-family:"Newsreader";
  src:url("fonts/newsreader.woff2") format("woff2");
  font-weight:200 600;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Courier Prime";
  src:url("fonts/courierprime-400.woff2") format("woff2");
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:"Courier Prime";
  src:url("fonts/courierprime-700.woff2") format("woff2");
  font-weight:700;font-style:normal;font-display:swap;
}

:root{
  --band:#12161D; --band-2:#1B212B; --on-band:#EAE7E0; --on-band-2:#939CAA;
  --paper:#FBF9F5; --card:#FFF; --card-2:#F1EEE8;
  --ink:#0D1015; --ink-2:#4A525F; --ink-3:#8A929F;
  --you:#2547C9; --you-lt:#6E8AF0; --you-tint:#E9EDFB;
  --strike:#C0392B; --strike-lt:#E3796A; --strike-tint:#FBEEEA;
  --rule:rgba(13,16,21,.14); --rule-soft:rgba(13,16,21,.07);
  --serif:"Newsreader",Georgia,serif; --type:"Courier Prime","Courier New",monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);font-size:18px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit}
strong{font-weight:500}
em{font-style:italic}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
/* A <use> of a symbol has no intrinsic size, so the default here is what keeps
   a one-off icon from filling its line. Every list and panel that wants a
   different size sets one further down. */
.ic{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex:none}
.you{color:var(--you)}
.skip{position:absolute;left:-9999px;top:0;z-index:20}
.skip:focus{left:0;background:var(--on-band);color:var(--band);font-family:var(--type);font-size:13px;padding:11px 16px}

/* ============ dark bands, ruled like ledger stock ========================= */
.dark{background:var(--band);color:var(--on-band);
  background-image:repeating-linear-gradient(to bottom,rgba(234,231,224,.045) 0 1px,transparent 1px 34px)}
.inner{max-width:1200px;margin:0 auto;padding:0 32px}

.nav{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;padding:18px 0;border-bottom:1px solid rgba(234,231,224,.12)}
.nav .mark{font-size:25px;font-weight:500;letter-spacing:-.025em;text-decoration:none}
.nav ul{display:flex;gap:22px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.nav ul a{font-family:var(--type);font-size:12px;color:var(--on-band-2);text-decoration:none}
.nav ul a:hover{color:var(--on-band)}
.nav ul a[aria-current="page"]{color:var(--on-band);border-bottom:1px solid var(--you-lt);padding-bottom:2px}
.nav .go{display:inline-flex;align-items:center;gap:7px;font-family:var(--type);font-size:12px;text-decoration:none;border:1px solid rgba(234,231,224,.4);border-radius:2px;padding:8px 13px}
.nav .go:hover{background:var(--on-band);color:var(--band)}

/* ============ hero ======================================================== */
.hero{display:grid;grid-template-columns:minmax(0,.92fr) minmax(340px,1.08fr);gap:64px;padding:64px 0 72px;align-items:center}
/* Inner pages have no ledger figure beside the headline, so they run one wide
   column instead of pretending to a second one. */
.hero.solo{grid-template-columns:minmax(0,1fr);gap:0;padding:56px 0 60px;max-width:44em}
.eyebrow{font-family:var(--type);font-size:12px;color:var(--on-band-2);margin:0 0 20px;letter-spacing:.05em}
h1{font-weight:300;font-size:clamp(40px,5.6vw,68px);line-height:.98;letter-spacing:-.04em;margin:0 0 8px;text-wrap:balance}
h1 .zero{display:block;color:var(--on-band-2);font-weight:200}
.hero .lede{font-size:19.5px;color:var(--on-band-2);max-width:29em;margin:26px 0 28px}
.hero .lede b,.hero .lede strong{color:var(--on-band);font-weight:400}
.hero.solo .lede{margin-bottom:0}
.cta{display:inline-flex;align-items:center;gap:9px;font-family:var(--type);font-size:13px;text-decoration:none;padding:14px 20px;background:var(--paper);color:var(--ink);border-radius:2px}
.cta:hover{background:#fff}
.legend{display:flex;gap:20px;flex-wrap:wrap;margin-top:34px;padding-top:22px;border-top:1px solid rgba(234,231,224,.12)}
.legend span{display:inline-flex;align-items:center;gap:8px;font-family:var(--type);font-size:11.5px;color:var(--on-band-2)}
.legend i{width:10px;height:10px;border-radius:2px}
.tk-you{background:var(--you-lt)}.tk-strike{background:var(--strike-lt)}

/* the live ledger */
.ledger{background:var(--card);border-radius:3px;padding:22px 24px 18px;color:var(--ink);box-shadow:0 18px 50px rgba(0,0,0,.3)}
.ledger .cap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-family:var(--type);font-size:10.5px;color:var(--ink-3);letter-spacing:.04em;padding-bottom:13px;border-bottom:1px solid var(--rule)}
.lrow{display:grid;grid-template-columns:16px minmax(0,1fr) auto;gap:11px;align-items:center;padding:9px 0;border-bottom:1px solid var(--rule-soft);font-size:15px;color:var(--ink-3)}
.lrow .dot{width:11px;height:11px;border-radius:50%;border:1.5px solid var(--ink-3)}
.lrow .amt{font-family:var(--type);font-size:11.5px;white-space:nowrap}
.lrow.count{color:var(--ink)}
.lrow.count .dot{background:var(--ink);border-color:var(--ink)}
.lrow.count .amt{color:var(--ink);font-size:12.5px}
.lrow.free{color:var(--strike)}
.lrow.free .dot{border-color:var(--strike);background:var(--strike-tint)}
.lrow.free .amt s{opacity:.55}
.ltot{display:flex;justify-content:space-between;align-items:baseline;gap:14px;flex-wrap:wrap;padding-top:15px;margin-top:6px;border-top:1px solid var(--rule)}
.ltot .k{font-family:var(--type);font-size:11px;color:var(--ink-3)}
.ltot .v{font-size:34px;letter-spacing:-.03em}
@media (prefers-reduced-motion:no-preference){
  .lrow,.ltot{opacity:0;animation:fin .5s ease-out forwards}
  @keyframes fin{to{opacity:1}}
}

/* ============ facts strip =================================================
   A <ul class="badges"> of bare <li>, because scripts/make_og.py reads these
   straight out of index.html to build the link-preview card. Modifier classes
   go on the inner .val, never on the <li>: the generator matches `<li>` with
   no attributes and fails loudly rather than shipping a stale card. */
.facts{max-width:1200px;margin:0 auto;padding:0 32px;transform:translateY(-24px)}
.badges{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule);border-radius:3px;overflow:hidden;list-style:none;margin:0;padding:0}
.badges li{background:var(--card);padding:15px 18px}
.badges .k{display:block;font-family:var(--type);font-size:10.5px;color:var(--ink-3);margin:0 0 8px;letter-spacing:.04em}
.badges .val{display:block;font-size:23px;letter-spacing:-.025em;line-height:1.05}
.badges .val.blue{color:var(--you)} .badges .val.red{color:var(--strike)}

/* ============ shell ======================================================= */
.shell{max-width:1200px;margin:0 auto;padding:0 32px;display:grid;grid-template-columns:176px minmax(0,1fr);gap:64px;align-items:start}
.rail{position:sticky;top:16px;padding:18px 0 40px}
.rail .head{font-family:var(--type);font-size:10.5px;color:var(--ink-3);letter-spacing:.06em;padding-bottom:9px;border-bottom:1px solid var(--rule);margin-bottom:6px}
.rail ol{list-style:none;margin:0;padding:0;counter-reset:r}
.rail li{counter-increment:r}
.rail a{display:grid;grid-template-columns:20px 1fr;gap:10px;font-family:var(--type);font-size:11.5px;color:var(--ink-3);text-decoration:none;padding:7px 0;line-height:1.35}
.rail a::before{content:counter(r,decimal-leading-zero)}
.rail a:hover,.rail a.on{color:var(--ink)}
.rail a.on::before{color:var(--you)}
.rail .apply{margin-top:18px;display:inline-flex;align-items:center;gap:8px;font-family:var(--type);font-size:12px;text-decoration:none;padding:10px 14px;background:var(--ink);color:var(--paper);border-radius:2px}
.topbar{display:none}

main{padding:16px 0 0;min-width:0}
section{padding:56px 0;border-top:1px solid var(--rule)}
/* Scoped to main: the apply band is also a <section>, and a sibling selector
   would strip its top padding along with the rule it never had. */
main>section:first-of-type{border-top:none;padding-top:30px}
.shead{display:flex;align-items:baseline;gap:12px;margin-bottom:8px}
.shead .n{font-family:var(--type);font-size:10.5px;color:var(--ink-3)}
.shead .t{font-family:var(--type);font-size:10.5px;color:var(--ink-3);letter-spacing:.06em}
h2{font-weight:300;font-size:clamp(30px,4vw,44px);line-height:1.06;letter-spacing:-.032em;margin:0 0 22px;max-width:16em}
h3{font-weight:500;font-size:17.5px;margin:0 0 4px}
/* A paragraph carries its own bottom margin; a list or a panel doesn't, so a
   heading that follows one needs the gap put back. */
ul+h3,.panel+h3{margin-top:26px}
p{margin:0 0 15px;max-width:33em}
p:last-child{margin-bottom:0}
.lede{font-size:19.5px;color:var(--ink-2);max-width:31em}
.note{font-size:16.5px;color:var(--ink-2)}
figure{margin:0}
figcaption{font-family:var(--type);font-size:10.5px;color:var(--ink-3);margin-top:11px;letter-spacing:.04em}
.more{display:inline-flex;align-items:center;gap:7px;font-family:var(--type);font-size:12px;color:var(--you);margin-top:22px;text-decoration:none}
.more:hover{text-decoration:underline}
.panel{background:var(--card);border:1px solid var(--rule);border-radius:3px;padding:20px 22px}
main a:not(.more):not(.cta):not(.apply){color:var(--you);text-underline-offset:.16em}

/* ============ cap calculator ============================================== */
.calc{padding:26px 28px}
.calc .row{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule);border-radius:3px;overflow:hidden;margin-top:22px}
.calc .cell{background:var(--card);padding:15px 16px}
.calc .cell .k{font-family:var(--type);font-size:10.5px;color:var(--ink-3);margin:0 0 7px;letter-spacing:.04em}
.calc .cell .v{font-size:27px;letter-spacing:-.028em;margin:0;line-height:1.05}
.calc .cell.blue .v{color:var(--you)} .calc .cell.red .v{color:var(--strike)}
.slabel{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.slabel .n{font-size:19px}
.slabel .n b{font-size:32px;font-weight:400;letter-spacing:-.03em}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:22px;background:transparent;cursor:pointer}
input[type=range]::-webkit-slider-runnable-track{height:3px;background:var(--rule);border-radius:2px}
input[type=range]::-moz-range-track{height:3px;background:var(--rule);border-radius:2px}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:19px;height:19px;border-radius:50%;background:var(--you);margin-top:-8px;border:none}
input[type=range]::-moz-range-thumb{width:19px;height:19px;border-radius:50%;background:var(--you);border:none}

/* ============ the gap ===================================================== */
.gapfig{padding:24px 26px}
.cap{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-family:var(--type);font-size:10.5px;color:var(--ink-3);padding-bottom:15px;border-bottom:1px solid var(--rule-soft);letter-spacing:.04em}
.brow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;padding:17px 0;border-bottom:1px solid var(--rule-soft)}
.brow:last-child{border-bottom:none;padding-bottom:2px}
.brow .who{font-size:16.5px;margin:0 0 10px}
.dots{display:flex;gap:8px;flex-wrap:wrap}
.dot16{width:16px;height:16px;border-radius:50%;border:1.5px solid var(--ink-3);flex:none}
.dot16.on{background:var(--ink);border-color:var(--ink)}
.dot16.freed{border-color:var(--strike);background:var(--strike-tint);position:relative}
.dot16.freed::after{content:"";position:absolute;left:-2px;top:7px;width:19px;height:1.5px;background:var(--strike);transform:rotate(-45deg)}
.count{font-family:var(--type);font-size:11px;color:var(--ink-3);text-align:right;white-space:nowrap;margin:0}
.count b{display:block;font-family:var(--serif);font-size:34px;font-weight:300;color:var(--ink);letter-spacing:-.03em;line-height:1}

/* ============ lists ======================================================= */
.tests{margin:0;padding:0;list-style:none}
.tests li{display:grid;grid-template-columns:20px 1fr;gap:13px;padding:12px 0;border-bottom:1px solid var(--rule-soft);max-width:36em}
.tests li:last-child{border-bottom:none}
.tests svg{width:17px;height:17px;color:var(--you);margin-top:6px}
.gates{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:16px;margin-top:26px}
.gate{border:1px solid var(--rule);border-radius:3px;padding:20px 22px;background:var(--card)}
.gate.no{background:var(--strike-tint);border-color:rgba(192,57,43,.3);border-style:dashed}
.gate .h{display:flex;align-items:center;gap:8px;font-family:var(--type);font-size:10.5px;color:var(--ink-3);margin:0 0 10px;letter-spacing:.04em}
.gate .h svg{width:15px;height:15px;color:currentColor}
.gate .v{font-size:38px;letter-spacing:-.035em;margin:0 0 8px;line-height:1;font-weight:300}
.gate.no .v,.gate.no .h{color:var(--strike)}
.gate p{font-size:15.5px;color:var(--ink-2);margin:0}
.gate ul{margin:10px 0 0;padding:0;list-style:none;font-size:15px;color:var(--ink-2)}
.gate ul li{display:grid;grid-template-columns:14px 1fr;gap:9px;margin-bottom:6px}
.gate ul svg{width:12px;height:12px;color:var(--strike);margin-top:6px}

.steps{list-style:none;margin:28px 0 0;padding:0;counter-reset:s}
.steps li{counter-increment:s;display:grid;grid-template-columns:28px minmax(0,1fr);gap:15px;padding:15px 0;border-bottom:1px solid var(--rule-soft);max-width:37em}
.steps li:last-child{border-bottom:none}
.steps li::before{content:counter(s,decimal-leading-zero);font-family:var(--type);font-size:10.5px;color:var(--you);padding-top:6px}

.plain{list-style:none;margin:0;padding:0}
.plain li{padding:12px 0;border-bottom:1px solid var(--rule-soft);font-size:16.5px;max-width:36em}
.plain li:last-child{border-bottom:none}
.iconlist{list-style:none;margin:0;padding:0}
.iconlist li{display:grid;grid-template-columns:20px 1fr;gap:13px;padding:12px 0;border-bottom:1px solid var(--rule-soft);font-size:16.5px}
.iconlist li:last-child{border-bottom:none}
.iconlist svg{width:18px;height:18px;color:var(--ink-3);margin-top:6px}
.duo{display:grid;grid-template-columns:repeat(auto-fit,minmax(276px,1fr));gap:18px}
.duo .panel{padding:20px 22px}
.duo h3{font-family:var(--type);font-size:10.5px;color:var(--ink-3);font-weight:400;letter-spacing:.05em;margin-bottom:6px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(252px,1fr));gap:14px;margin-top:8px}
.cost{background:var(--card);border:1px solid var(--rule);border-left:2px solid var(--strike);border-radius:0 3px 3px 0;padding:17px 19px}
.cost h3{font-size:16.5px;margin-bottom:5px}
.cost p{font-size:15.5px;color:var(--ink-2);margin:0}
/* The catch page pairs every cost with what is done about it. The answer is
   blue because it is the reader's lever, not the writer's reassurance. */
.cost .fix{display:block;margin-top:11px;padding-top:11px;border-top:1px solid var(--rule-soft);font-size:15px;color:var(--ink-2)}
.cost .fix i{display:block;font-style:normal;font-family:var(--type);font-size:10px;letter-spacing:.06em;color:var(--you);margin-bottom:4px}

/* ============ statement of account ========================================
   The pricing page's specimen month. Same ledger stock as the hero figure,
   but every line is named, so it is a table and not a list of divs. */
.stmt{padding:22px 26px 18px}
.stmt table{width:100%;border-collapse:collapse;font-size:16px}
.stmt caption{caption-side:top;text-align:left;font-family:var(--type);font-size:10.5px;color:var(--ink-3);letter-spacing:.04em;line-height:1.5;padding-bottom:14px;border-bottom:1px solid var(--rule);margin-bottom:4px}
.stmt th,.stmt td{padding:13px 0;border-bottom:1px solid var(--rule-soft);vertical-align:top;text-align:left}
.stmt thead th{font-family:var(--type);font-weight:400;font-size:10.5px;letter-spacing:.04em;color:var(--ink-3);padding-top:14px}
.stmt .amt{text-align:right;font-family:var(--type);font-size:12.5px;white-space:nowrap;padding-left:18px}
.stmt .why{display:block;margin-top:5px;font-size:14.5px;line-height:1.45;color:var(--ink-3);max-width:38em}
.stmt tfoot td{border-bottom:none;border-top:1px solid var(--rule);padding-top:16px}
.stmt tfoot .amt{font-family:var(--serif);font-size:30px;letter-spacing:-.03em}
.tag{display:inline-block;font-family:var(--type);font-size:9.5px;letter-spacing:.06em;padding:2px 6px;border:1px solid currentColor;border-radius:2px;margin-left:6px;white-space:nowrap;vertical-align:2px}
.tag.v{color:var(--strike)} .tag.f{color:var(--you)}

/* ============ key/value block ============================================= */
.kv{margin:0;display:grid;grid-template-columns:minmax(0,1fr);gap:0}
.kv dt{font-family:var(--type);font-size:10.5px;letter-spacing:.05em;color:var(--ink-3);padding-top:14px}
.kv dd{margin:2px 0 0;padding-bottom:14px;border-bottom:1px solid var(--rule-soft);font-size:16.5px;color:var(--ink-2)}
.kv dd:last-of-type{border-bottom:none;padding-bottom:2px}

.qa details{border-bottom:1px solid var(--rule-soft)}
.qa summary{cursor:pointer;list-style:none;padding:15px 0;font-weight:500;display:flex;justify-content:space-between;gap:16px;align-items:center}
.qa summary::-webkit-details-marker{display:none}
.qa summary svg{width:15px;height:15px;color:var(--ink-3);transition:transform .2s}
.qa details[open] summary svg{transform:rotate(45deg)}
.qa p{padding:0 0 17px;color:var(--ink-2)}

.fit{padding:22px 26px}
.fit .opt{display:grid;grid-template-columns:18px 1fr;gap:13px;align-items:start;padding:13px 0;border-bottom:1px solid var(--rule-soft);cursor:pointer;font-size:16.5px}
.fit .opt:last-of-type{border-bottom:none}
.fit input{margin:6px 0 0;accent-color:var(--you);width:16px;height:16px}
.verdict{margin-top:16px;padding:16px 18px;border-radius:3px;background:var(--card-2);font-size:16.5px;color:var(--ink-2);display:grid;grid-template-columns:19px 1fr;gap:13px;align-items:start}
.verdict svg{width:17px;height:17px;color:var(--ink-3);margin-top:5px}
.verdict b{font-weight:500;color:var(--ink);display:block;margin-bottom:2px}
.verdict.ok{background:var(--you-tint)} .verdict.ok b,.verdict.ok svg{color:var(--you)}

/* ============ apply ======================================================= */
.applyband{margin-top:56px}
.applyband .inner{padding-top:60px;padding-bottom:60px}
.applyband h2{color:#fff;margin-bottom:14px}
.applyband .lede{color:var(--on-band-2)}
.applyband a{color:var(--on-band)}
.form{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px;max-width:34em}
.form label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
input[type=url]{flex:1 1 240px;min-width:0;font-family:var(--type);font-size:15px;padding:14px;background:var(--band-2);color:#fff;border:1px solid rgba(234,231,224,.26);border-radius:2px}
input[type=url]::placeholder{color:var(--on-band-2)}
input:focus-visible,button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--you-lt);outline-offset:2px}
button{display:inline-flex;align-items:center;gap:8px;font-family:var(--type);font-size:14px;padding:14px 22px;cursor:pointer;background:var(--paper);color:var(--ink);border:none;border-radius:2px}
button:hover{background:#fff}
.applyband .note{color:var(--on-band-2)}

/* ============ footer ====================================================== */
footer .inner{padding:26px 32px 56px;border-top:1px solid rgba(234,231,224,.12)}
footer p{font-size:13.5px;color:var(--on-band-2);max-width:48em;margin-bottom:11px;line-height:1.6}
footer a{color:var(--on-band)}
.foot-links{display:flex;flex-wrap:wrap;gap:0 22px;font-family:var(--type);font-size:11.5px;margin-bottom:16px}
.foot-links a{text-decoration:none;color:var(--on-band-2)}
.foot-links a:hover{color:var(--on-band)}
.nonclaim{padding-top:14px;border-top:1px solid rgba(234,231,224,.12)}
.nonclaim b{display:block;font-family:var(--type);font-size:10.5px;letter-spacing:.05em;color:var(--on-band);font-weight:400;margin-bottom:5px}

@media (max-width:920px){
  body{font-size:17px}
  .inner,.facts,.shell{padding-left:20px;padding-right:20px}
  .hero{grid-template-columns:1fr;gap:34px;padding:38px 0 46px}
  .hero.solo{padding:34px 0 42px}
  .facts{transform:none;padding-top:26px}
  .shell{grid-template-columns:1fr;gap:0}
  .rail{position:static;padding:0}
  .rail ol,.rail .apply,.rail .head{display:none}
  .topbar{display:flex;position:sticky;top:0;z-index:9;justify-content:space-between;align-items:center;gap:12px;
    background:rgba(251,249,245,.95);backdrop-filter:blur(8px);border-bottom:1px solid var(--rule);margin:0 -20px;padding:10px 20px}
  .topbar .now{font-family:var(--type);font-size:11.5px;color:var(--ink-3)}
  .topbar a{font-family:var(--type);font-size:11.5px;text-decoration:none;background:var(--ink);color:var(--paper);border-radius:2px;padding:7px 12px}
  section{padding:38px 0}
  .brow{grid-template-columns:1fr;gap:10px}
  .count{text-align:left}
  .count b{display:inline;font-size:24px;margin-right:8px}
  .ledger,.calc,.fit,.gapfig,.stmt{padding:18px}
  .stmt table{font-size:15px}
  .stmt .amt{padding-left:12px}
}

@media print{
  body{background:#fff;color:#000;font-size:10.5pt}
  .dark{background:#fff;color:#000;background-image:none}
  .dark h1,.dark h2,.applyband h2{color:#000}
  .eyebrow,.hero .lede,.applyband .lede,footer p,.nav ul a{color:#000}
  .ledger{box-shadow:none;border:1px solid #000}
  .rail,.topbar,.form,.cta,.nav .go,.fit input{display:none}
  .shell{grid-template-columns:1fr;gap:0}
  .facts{transform:none}
  section{page-break-inside:avoid}
  a{color:#000}
}