/* Talk With Web Traffic: "signal grid" design system (v1.2.0, 2026-10-10, see DESIGN.md).
   Type: Hanken Grotesk (light display, text) and Geist Mono (figures, log lines, labels), self-hosted, SIL OFL.
   Palette: graphite ink + one signal blue on white and cool grey; square corners everywhere; yellow/green/red only as log status colours. */
@font-face{font-family:"Hanken Grotesk";src:url(/assets/fonts/hanken-grotesk-var-latin.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Geist Mono";src:url(/assets/fonts/geist-mono-var-latin.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
:root{
--paper:#ffffff;--wash:#f2f4f8;--card:#ffffff;--rule:#e0e0e0;--rule2:#c6c6c6;
--ink:#161616;--ink2:#525252;--night:#161616;--night2:#262626;--night-rule:#393939;--on-night:#c6c6c6;
--sig:#0050e6;--sig-dark:#0039a6;--sig-soft:#e5edff;--apricot:#78a9ff;--pink:#a8a8a8;--amber:#f1c21b;--green:#42be65;--red:#ff8389;
--ok:#1e6a4c;--ok-soft:#e6f4ee;--warn:#8a4b00;--err:#b42318;--err-soft:#fdeeec;
--sans:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
--mono:"Geist Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
--r:0;--r-sm:0}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.6 var(--sans);font-feature-settings:"ss01"}
a{color:var(--sig);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--sig-dark);text-decoration-thickness:2px}
h1,h2,h3{line-height:1.15;letter-spacing:-.012em;font-weight:400;color:var(--ink)}
h1{font-weight:300}h3{font-weight:620}
h1{font-size:clamp(2rem,4.6vw,3rem);margin:.15em 0 .35em}
h2{font-size:clamp(1.35rem,2.4vw,1.75rem);margin:1.8em 0 .55em}
h3{font-size:1.15rem}
strong{font-weight:700}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px}
.narrow{max-width:780px}
.pad{padding-top:40px;padding-bottom:64px}
.pad-lg{padding-top:72px;padding-bottom:24px}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;background:#fff;color:var(--ink);padding:10px 14px;z-index:20;border-radius:var(--r-sm)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:3px solid var(--sig);outline-offset:2px}
.foot :focus-visible,.console :focus-visible,.mast :focus-visible{outline-color:#fff;outline-offset:-3px}

/* masthead: a graphite bar, wordmark then flat nav on the left, a square signal-blue action flush right; the preview runs as a mono strip under it */
.mast{background:var(--night);position:sticky;top:0;z-index:10}
.mast-in{display:flex;align-items:stretch;gap:0;min-height:56px;padding-right:0}
.brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font-weight:600;font-size:1.02rem;letter-spacing:-.005em;white-space:nowrap;padding-right:24px;margin-right:8px;border-right:1px solid var(--night-rule)}
.brand:hover{color:#fff}
.mark{width:28px;height:28px;flex:none}
.nav{display:flex;gap:0;flex:1;justify-content:flex-start}
.nav a{display:flex;align-items:center;color:var(--on-night);text-decoration:none;font-size:.94rem;font-weight:450;padding:0 16px;border-bottom:3px solid transparent;border-top:3px solid transparent}
.nav a:hover{background:var(--night2);color:#fff;border-bottom-color:var(--apricot)}
.nav-nb::before{content:"";display:inline-block;width:7px;height:7px;background:var(--amber);margin-right:8px}
.mast-cta{display:flex;align-items:center;gap:28px;background:var(--sig);color:#fff;text-decoration:none;font-weight:500;font-size:.95rem;padding:0 20px;white-space:nowrap}
.mast-cta::after{content:"\2192"}
.mast-cta:hover{background:var(--sig-dark);color:#fff}
.statusline{background:var(--wash);border-bottom:1px solid var(--rule);font:450 .8rem/1.5 var(--mono);color:var(--ink2);padding:8px 0;letter-spacing:-.01em}
.statusline strong{color:var(--ink);font-weight:600}
.statusline a{font-weight:600}
.dot{display:inline-block;width:8px;height:8px;background:var(--amber);margin-right:8px;outline:1px solid #8a6d00;vertical-align:1px}
.st-k{text-transform:uppercase;letter-spacing:.08em;color:var(--ink);font-weight:650;margin-right:6px}

/* shared type pieces */
.eyebrow,.kicker{font:600 .78rem/1.3 var(--mono);text-transform:uppercase;letter-spacing:.12em;color:var(--sig);margin:0 0 10px}
.lede{font-size:1.2rem;line-height:1.55;color:var(--ink2);max-width:62ch}
.small{font-size:.9rem;color:var(--ink2)}
.meta{color:var(--ink2);font-size:.95rem;overflow-wrap:anywhere}
.sec-head{max-width:760px;margin-bottom:28px}
.sec-head h2{margin:0;font-size:clamp(1.6rem,3.2vw,2.35rem)}
.more-link{font-weight:600}
.page-head{margin-bottom:28px}
.page-head-c{border-bottom:1px solid var(--rule);padding-bottom:20px}
.pad>h1:first-child,.narrow>h1:first-child,.page-head h1{font-size:clamp(2.1rem,4.2vw,3.1rem)}

/* buttons: square, IBM-style; the main one carries its arrow at the far right */
.cta{display:flex;flex-wrap:wrap;gap:12px;margin:30px 0 18px;align-items:stretch}
.btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--ink);background:var(--card);color:var(--ink);padding:12px 18px;border-radius:0;font:500 1rem/1.25 var(--sans);text-decoration:none;cursor:pointer}
.btn:hover{background:var(--ink);color:#fff}
.btn-main{background:var(--sig);border-color:var(--sig);color:#fff;justify-content:space-between;min-width:200px;gap:40px;padding:14px 18px}
.btn-main::after{content:"\2192";font-weight:400}
.btn-main:hover{background:var(--sig-dark);border-color:var(--sig-dark);color:#fff}
.btn-alt{border-color:var(--sig);color:var(--sig);justify-content:space-between;min-width:200px;gap:40px;padding:14px 18px}
.btn-alt::after{content:"\2192"}
.btn-alt:hover{background:var(--sig-soft);color:var(--sig-dark);border-color:var(--sig-dark)}
.btn-ghost{border-color:transparent;background:transparent;text-decoration:underline}
.btn-danger{background:var(--err);border-color:var(--err);color:#fff}.btn-danger:hover{color:#fff;background:#8f1b12}
.btn:disabled{opacity:.6;cursor:progress}
.linkish{background:none;border:0;padding:0;font:inherit;color:var(--sig);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.danger,.btn-ghost.danger{color:var(--err)}

/* home hero: left-aligned light headline on a 5/7 column split, the sample console beside it */
.hero{border-bottom:1px solid var(--rule);background:var(--paper)}
.hero-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:start;padding-top:64px;padding-bottom:72px}
.hero-txt{padding:8px 0}
.kicker{margin:0 0 22px;font:500 .8rem/1.4 var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--ink2)}
.kicker span{color:var(--sig);padding:0 4px}
.hero h1{font-size:clamp(2.5rem,4.4vw,4.1rem);line-height:1.06;letter-spacing:-.025em;font-weight:300;margin:0 0 24px}
.h1-b{font-weight:600;color:var(--ink);box-shadow:inset 0 -.14em 0 var(--sig)}
.hero .lede{margin:0;max-width:46ch;font-size:1.12rem;color:var(--ink2)}
.hero-facts{margin:26px 0 0;border-top:1px solid var(--ink)}
.hero-facts div{display:grid;grid-template-columns:9.5rem 1fr;gap:12px;padding:10px 0;border-bottom:1px solid var(--rule)}
.hero-facts dt{font:500 .74rem/1.9 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--ink2)}
.hero-facts dd{margin:0;font-size:.95rem}
.free{background:var(--sig-soft);color:var(--sig-dark);padding:1px 5px;font-weight:600;white-space:nowrap;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.hero-con{min-width:0;padding-top:6px}

/* the console: the log above, the answers below; graphite, square, status colours only */
.console{background:var(--night);color:var(--on-night);overflow:hidden;border-top:4px solid var(--sig)}
.con-bar{display:flex;align-items:center;gap:14px;padding:11px 20px;border-bottom:1px solid var(--night-rule);font:500 .78rem var(--mono);flex-wrap:wrap;background:var(--night2)}
.con-file{color:var(--on-night)}
.con-flag{margin-left:auto;color:var(--night);background:var(--green);padding:2px 9px;font-weight:600}
.con-log{padding:18px 20px 16px;border-bottom:1px solid var(--night-rule);min-width:0;background:#0f0f10}
.con-ans{padding:18px 20px 20px;min-width:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 20px}
.con-ans .con-h,.con-more{grid-column:1/-1}
.con-h{font:600 .7rem var(--mono);text-transform:uppercase;letter-spacing:.12em;color:var(--pink);margin:0 0 12px}
.con-cols{display:block;text-transform:none;letter-spacing:0;font-weight:400;color:#8d8d8d;margin-top:4px}
.ll{font:400 .76rem/1.5 var(--mono);margin:0 0 7px;color:#a8a8a8;overflow-wrap:anywhere}
.ll-ip{color:var(--on-night)}.ll-r{color:#fff}.ll-f{color:#a8a8a8}.ll-u{color:#8d8d8d}
.ll-s{font-weight:650;padding:0 4px}
.ll-s2{color:var(--green)}.ll-s4{color:var(--amber)}.ll-s5{color:var(--night);background:var(--red)}
.ll-more{color:#8d8d8d;font-style:italic;margin-top:10px}
.qa{padding:0 0 0 14px;margin:0;border-left:1px solid var(--night-rule)}
.qa-q{font:600 .76rem/1.4 var(--mono);color:var(--apricot);margin:0 0 6px;display:flex;gap:8px}
.qa-n{color:#8d8d8d}
.qa-a{margin:0;color:#fff;font-size:.92rem;line-height:1.45}
.con-more{margin:16px 0 0}.con-more a{color:var(--apricot);font-weight:500}.con-more a:hover{color:#fff}

/* nine questions: numbered index on a hairline grid */
.band{background:var(--wash);padding:72px 0 80px;border-bottom:1px solid var(--rule)}
.nine{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--rule2);border-left:1px solid var(--rule2)}
.nine li{border-right:1px solid var(--rule2);border-bottom:1px solid var(--rule2);padding:22px 22px 30px;font-weight:450;font-size:1.08rem;line-height:1.35;background:var(--paper)}
.nine-n{display:block;font:500 .8rem var(--mono);color:var(--sig);margin-bottom:12px}

/* split: privacy text + what stays / what leaves */
.split{display:grid;grid-template-columns:1fr 1.1fr;gap:56px;align-items:center}
.split-txt h2{margin:0 0 14px;font-size:clamp(1.6rem,3.2vw,2.35rem)}
.split-txt p{color:var(--ink2);max-width:52ch}
.flow{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:center}
.flow-col{border:1px solid var(--rule);border-radius:var(--r);padding:20px;background:var(--card)}
.flow-out{background:var(--night);border-color:var(--night);color:var(--on-night)}
.flow-out .flow-h{color:var(--apricot)}
.flow-arrow{color:var(--sig)}
.flow-h{font:600 .74rem var(--mono);text-transform:uppercase;letter-spacing:.12em;margin:0 0 10px;color:var(--sig)}
.flow ul{margin:0;padding:0;list-style:none}
.flow li{padding:6px 0;border-top:1px solid var(--rule);font-size:.97rem}
.flow-out li{border-top-color:var(--night-rule);color:#fff}
.flow-arrow svg{width:48px;height:24px;display:block}

/* plans */
.plans{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:18px 0}
.plans-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.plan{background:var(--card);border:1px solid var(--rule);border-radius:var(--r);padding:28px 26px 24px;position:relative}
.plan h2,.plan h3{margin:0 0 14px;font-size:1.05rem;font-weight:680;letter-spacing:-.01em}
.plan-plus{border-color:var(--ink)}
.plan-plus::before{content:"";position:absolute;left:-1px;right:-1px;top:-1px;height:4px;background:var(--sig);border-radius:0}
.amount{font:300 3rem/1 var(--sans);letter-spacing:-.02em;margin:0 0 6px;font-variant-numeric:tabular-nums}
.amount span{font:400 .95rem var(--sans);letter-spacing:0;color:var(--ink2)}
.alt{margin:0 0 8px;color:var(--ink2)}
.plan ul{padding:0;margin:16px 0 0;list-style:none;border-top:1px solid var(--rule)}
.plan li{padding:9px 0 9px 26px;border-bottom:1px solid var(--rule);position:relative;font-size:.97rem}
.plan li::before{content:"";position:absolute;left:2px;top:15px;width:12px;height:7px;border-left:2px solid var(--sig);border-bottom:2px solid var(--sig);transform:rotate(-45deg)}
.free-box{display:inline-block;background:var(--sig-soft);color:var(--sig-dark);border-radius:0;padding:5px 12px;font:600 .82rem var(--mono);margin:16px 0 0}
p.free-box{display:block;width:fit-content}
.price-line{border:1px solid var(--rule);background:var(--card);border-radius:var(--r-sm);padding:10px 14px;margin:18px 0;font-size:.95rem}
.tag{display:inline-block;font:600 .7rem var(--mono);text-transform:uppercase;letter-spacing:.1em;background:var(--night);color:#fff;padding:3px 8px;border-radius:0;vertical-align:1px}
.how-h{margin-top:56px}
.how{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px;counter-reset:how}
.how li{border-top:1px solid var(--rule2);padding:16px 0 18px 44px;position:relative;counter-increment:how}
.how li::before{content:counter(how,decimal-leading-zero);position:absolute;left:0;top:17px;font:500 .8rem var(--mono);color:var(--sig)}

/* what it will not do */
.wont{padding-bottom:88px}
.wont-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.wont-list li{border-top:1px solid var(--ink);padding:14px 0 4px;color:var(--ink2)}

/* notes, forms */
.note{border-radius:var(--r-sm);padding:12px 16px;margin:14px 0;border:1px solid var(--rule);background:var(--card)}
.note p{margin:.2em 0}.note ul{margin:.3em 0}
.note-err{border-color:#efb7b0;color:var(--err);background:var(--err-soft)}
.note-ok{border-color:#a9d6c2;color:var(--ok);background:var(--ok-soft)}
.note-main{border:0;border-left:4px solid var(--sig);background:var(--sig-soft);color:var(--ink)}
fieldset{border:1px solid var(--rule);border-radius:var(--r);padding:20px 22px 22px;margin:0 0 18px;background:var(--card);min-width:0}
legend{font:600 .76rem var(--mono);text-transform:uppercase;letter-spacing:.12em;color:var(--sig);padding:0 8px}
label{display:block;font-size:.95rem;font-weight:640;margin-top:6px}
input,select,textarea{display:block;width:100%;margin-top:6px;font:16px var(--sans);padding:11px 13px;border:1.5px solid var(--rule2);border-radius:0;background:#fff;color:var(--ink);min-width:0}
input:hover,textarea:hover{border-color:var(--ink2)}
input:focus,select:focus,textarea:focus{outline:3px solid var(--sig-soft);border-color:var(--sig)}
input[type=file]{padding:10px;background:var(--wash);border-style:dashed}
.hint{display:block;font-weight:400;font-size:.82rem;color:var(--ink2);margin-top:2px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px 16px}
.span2{grid-column:1/-1}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0 8px;align-items:center}
.toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}
.inline{display:inline}
.check{display:flex;gap:10px;align-items:flex-start;font-weight:450;margin:10px 0!important}
.check input{width:auto;margin-top:5px;flex:none}
.checks{margin-top:8px}
.ok{color:var(--ok)}
.pill{font:600 .72rem var(--mono);background:var(--sig-soft);color:var(--sig-dark);padding:2px 8px;border-radius:0;vertical-align:middle}
.pill-dim{background:var(--wash);color:var(--ink2)}
.plain{padding-left:1.15em}
.plain li{margin:.35em 0}
.prose p,.prose li{max-width:68ch}
.status{font:500 .92rem var(--mono);min-height:1.5em}
.status-bad{color:var(--err)}
.code{background:var(--night);color:#e0e0e0;padding:16px 18px;border-radius:var(--r-sm);overflow-x:auto;font:13px/1.6 var(--mono);white-space:pre}
code{font-family:var(--mono);font-size:.86em;background:var(--wash);border:1px solid var(--rule);padding:1px 5px;border-radius:0;overflow-wrap:anywhere}
.guide h2{padding-top:18px;border-top:1px solid var(--rule)}
.guide .plain{list-style:none;padding:0}
.guide .plain li{padding:10px 0 10px 18px;border-left:2px solid var(--rule2);margin:8px 0}

/* report: header, stat strip, contents, answers as a two-column Q / A ledger */
.report{max-width:1080px}
.rep-head{max-width:820px}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:28px 0 20px;border:1px solid var(--rule);border-radius:var(--r);background:var(--card);overflow:hidden}
.stat{padding:20px 22px;border-right:1px solid var(--rule)}
.stat:last-child{border-right:0}
.stat .num{display:block;font:600 2rem/1.1 var(--mono);letter-spacing:-.04em;color:var(--ink);text-align:left!important}
.stat:first-child .num{color:var(--sig)}
.stat .lbl{font-size:.88rem;color:var(--ink2)}
.rep-toc{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 36px}
.rep-toc a{font-size:.85rem;text-decoration:none;color:var(--ink);border:1px solid var(--rule);border-radius:0;padding:5px 12px;background:var(--card)}
.rep-toc a:hover{border-color:var(--sig);color:var(--sig)}
.rep-toc span{font-family:var(--mono);color:var(--sig);margin-right:6px}
.answer{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:12px 40px;padding:28px 0;border-top:1px solid var(--rule2);scroll-margin-top:110px}
.ans-q{margin:0;font-size:1.3rem;line-height:1.25}
.ans-n{display:block;font:500 .8rem var(--mono);color:var(--sig);margin-bottom:8px;letter-spacing:0}
.answer-warn .ans-n,.answer-warn .ans-n{color:var(--err)}
.answer-warn .ans-q::after{content:"Needs a look";display:inline-block;margin-left:10px;font:600 .66rem var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--err);background:var(--err-soft);border-radius:0;padding:3px 8px;vertical-align:4px}
.answer-note .ans-n{color:var(--warn)}
.answer-ok .ans-n{color:var(--ok)}
.ans-a{min-width:0}
.a-main{font-size:1.12rem;margin:0 0 .6em;line-height:1.55}
.tbl{border-collapse:collapse;width:100%;margin:10px 0;font-size:.93rem;background:var(--card)}
.tbl th,.tbl td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--rule);vertical-align:top}
.tbl th{font:600 .72rem var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--ink2);border-bottom:1.5px solid var(--ink)}
.tbl tbody tr:hover{background:var(--wash)}
.tbl .r{text-align:right;font-family:var(--mono);white-space:nowrap;font-variant-numeric:tabular-nums}
.tbl .path{font-family:var(--mono);font-size:.85rem;overflow-wrap:anywhere;word-break:break-all}
.tbl-wide{min-width:520px}
.num{text-align:right!important;font-variant-numeric:tabular-nums}
.scroll{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
.cmp{overflow-x:auto;max-width:100%}
.chart{margin:12px 0}
.chart svg{width:100%;height:auto;max-width:640px;display:block}
.savebox{background:var(--night);color:var(--on-night);border-radius:0;padding:30px 32px;margin:40px 0 8px}
.savebox h2{margin-top:0;color:#fff}
.savebox p{color:var(--on-night)}
.savebox label{color:#fff}
.savebox input{background:var(--night2);border-color:var(--night-rule);color:#fff}
.savebox input::placeholder{color:#a8a8a8}
.savebox input:focus{outline-color:rgba(120,169,255,.4);border-color:var(--apricot)}
.savebox .btn-main{background:var(--apricot);border-color:var(--apricot);color:var(--night)}
.savebox .btn-main:hover{background:#fff;border-color:#fff}
.savebox .small{color:var(--on-night)}
.savebox a{color:var(--apricot)}.savebox a:hover{color:#fff}
.savebox :focus-visible{outline-color:var(--apricot)}
.savebox .price-line{background:var(--night2);border-color:var(--night-rule);color:var(--on-night)}
.savebox .price-line strong{color:#fff}
.savebox .tag{background:var(--apricot);color:var(--night)}
.savebox .free{background:rgba(120,169,255,.18);color:var(--apricot)}

/* notebook */
.linkbox,.keybox{background:var(--wash);border:1px solid var(--rule);border-radius:var(--r);padding:16px 18px;margin:16px 0}
.linkrow,.keyrow{display:flex;gap:8px;margin-top:8px}
.linkrow input,.keyrow input{margin:0;font-family:var(--mono);font-size:.88rem}
.jhead{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.jlist{width:100%;border-collapse:collapse;background:var(--card);margin:8px 0}
.jlist th,.jlist td{padding:8px 10px;border-bottom:1px solid var(--rule);text-align:left}
.notebook-tools{margin-top:22px;font-size:.92rem;color:var(--ink2)}
.danger-line{margin:0}
.doc{background:#fff;border:1px solid var(--rule);border-radius:var(--r-sm);padding:36px 40px;max-width:820px;margin:8px 0 24px}
.doc-title{margin:18px 0 4px}
.doc-t{width:100%;border-collapse:collapse;margin:12px 0}
.doc-t th,.doc-t td{text-align:left;padding:6px 8px;border-bottom:1px solid var(--rule);vertical-align:top}
.doc-notes h3{font-size:.95rem;margin:16px 0 4px}.doc-notes p{margin:0}
.doc-made{margin-top:24px;font-size:.8rem;color:var(--ink2);text-align:center}

/* footer: night, oversized wordmark, three columns */
.foot{background:var(--night);color:var(--on-night);margin-top:72px;padding:64px 0 36px;border-top:4px solid var(--sig)}
.foot a{color:#fff;text-decoration:none}
.foot a:hover{color:var(--apricot);text-decoration:underline}
.foot-top{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;padding-bottom:40px;border-bottom:1px solid var(--night-rule)}
.foot-mark{font-weight:300;font-size:clamp(2.2rem,5vw,3.6rem);line-height:1.02;letter-spacing:-.03em;color:#fff;margin:0}
.foot-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.foot-cols a{display:block;padding:5px 0;font-size:.95rem}
.foot-h{font:600 .72rem var(--mono);text-transform:uppercase;letter-spacing:.14em;color:var(--pink);margin:0 0 10px}
.fine{font-size:.88rem;max-width:80ch;margin:28px 0 8px}
.powered{font:500 .82rem var(--mono);margin:0}
.powered a{color:var(--apricot)}

/* responsive */
@media (max-width:1040px){


.hero-grid{grid-template-columns:1fr;gap:40px;padding-top:48px;padding-bottom:56px}
.split{grid-template-columns:1fr;gap:32px}
.plans-3{grid-template-columns:1fr 1fr}
}
@media (max-width:1040px){.mast{position:static}.mast-in{flex-wrap:wrap;padding-right:24px}.brand{border-right:0;flex:1;min-height:56px}.mast-cta{padding:12px 16px;margin:8px 0}.nav{display:flex;order:3;flex-basis:100%;justify-content:flex-start;flex-wrap:wrap;margin:0 -12px;border-top:1px solid var(--night-rule)}.nav a{white-space:nowrap;padding:10px 12px}}
@media (max-width:760px){
body{font-size:16px}
.wrap{padding:0 18px}
.hero-grid{padding-top:36px;padding-bottom:44px}
.hero .lede{font-size:1.06rem}
.hero-facts div{grid-template-columns:1fr;gap:2px}
.con-ans{grid-template-columns:1fr}
.qa{padding:0 0 14px;margin:0 0 14px;border-left:0;border-bottom:1px solid var(--night-rule)}
.qa:last-of-type{border-bottom:0;margin-bottom:0}
.btn-main,.btn-alt{flex:1 1 100%}
.nine{grid-template-columns:1fr 1fr}
.nine li{padding:16px 14px 18px;font-size:.98rem}
.flow{grid-template-columns:1fr}
.flow-arrow{justify-self:center;transform:rotate(90deg)}
.plans,.plans-3{grid-template-columns:1fr}
.how{grid-template-columns:1fr}
.wont-list{grid-template-columns:1fr}
.stats{grid-template-columns:1fr 1fr}
.stat{border-bottom:1px solid var(--rule);padding:14px 16px}
.stat:nth-child(2n){border-right:0}
.stat .num{font-size:1.45rem}
.answer{grid-template-columns:1fr;gap:10px;padding:22px 0}
.ans-q{font-size:1.15rem}
.foot-top{grid-template-columns:1fr}
.foot-cols{grid-template-columns:1fr 1fr}
.savebox{padding:22px 18px}
.pad-lg{padding-top:52px}
.band{padding:48px 0 52px}
.grid2,.grid3{grid-template-columns:1fr}
.doc{padding:20px 16px}
.jlist td:nth-child(3),.jlist th:nth-child(3){display:none}
.tbl{font-size:.85rem}.tbl th,.tbl td{padding:6px 5px}.tbl .r{font-size:.8rem}
.cmp .tbl-wide{min-width:0}.cmp .tbl-wide th:nth-child(4),.cmp .tbl-wide td:nth-child(4),.cmp .tbl-wide th:nth-child(7),.cmp .tbl-wide td:nth-child(7){display:none}
.mast-cta{padding:8px 12px;font-size:.88rem;margin:10px 0}.mast-cta::after{display:none}.brand{padding-right:10px;margin-right:0;gap:8px}
.con-flag{margin-left:0}
.mast-in{padding-right:18px}
}
@media (max-width:420px){.brand-t{font-size:1rem}.nine{grid-template-columns:1fr}.foot-cols{grid-template-columns:1fr 1fr}}
@media (prefers-reduced-motion:no-preference){.btn,.nav a,.mast-cta,.rep-toc a{transition:background-color .15s,border-color .15s,color .15s}}
@media print{
.mast,.foot,.statusline,.noprint,.toolbar,.skip,.savebox,.actions{display:none!important}
body{background:#fff;font-size:12pt}
.wrap{max-width:none;padding:0}
.pad{padding:0}
.answer{break-inside:avoid;grid-template-columns:1fr 2fr}
.stats{border-color:#999}
.doc{border:0;box-shadow:none;padding:0;max-width:none;margin:0}
a{text-decoration:none;color:#000}
}
[hidden]{display:none!important}
/* ---------- v1.3.0: AdEngine banner (adengine.us) ----------
   One labelled slot between </main> and the footer, on the public pages only (home, guide, pricing, about, sample report: the
   controllers opt in). The label and the reserved height are on the <ins>, so when tag.js (or ae-size.js) hides a slot it cannot
   fill, the label and the space go with it, and the wrapper collapses too. 110px = 16px label + 4px gap + 90px banner; 270px on
   phones (300x250). Every ad page ends with its own bottom padding and the footer keeps its 72px top margin, so the slot needs
   no margin of its own. vertical-align:top on the link keeps the line box at the banner's height. display stays in this file
   and is never !important: tag.js hides a slot with style.display. */
.ae-slot{padding:0 24px}
.ae-slot:has(> ins.adengine[style*="none"]){display:none}
.ae-slot ins.adengine{display:block;max-width:728px;min-height:110px;margin:0 auto;text-align:center;text-decoration:none}
.ae-slot ins.adengine::before{content:"Advertisement";display:block;margin-bottom:4px;font:500 11px/16px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink2)}
.ae-slot ins.adengine a{display:inline-block;vertical-align:top}
@media (max-width:767px){.ae-slot{padding:0 18px}.ae-slot ins.adengine{max-width:300px;min-height:270px}}
/* at 760px and below the site's own .wrap{padding:0 18px} drops the sections' bottom padding, so the slot brings its own space */
@media (max-width:760px){.ae-slot ins.adengine{margin-top:40px}}
@media print{.ae-slot{display:none}}