*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
img,svg{max-width:100%}
:root{
  --surface:#FCFCFB;
  --panel:#FFFFFF;
  --sunk:#F3F3F0;
  --line:#E2E2DC;
  --line-strong:#CBCBC3;
  --ink:#16181C;
  --ink-2:#4A4E56;
  --ink-3:#7C818A;

  --s1:#2266E8; /* Staples MC   */
  --s2:#0D8A66; /* Staples Visa */
  --s3:#C6710A; /* ODOM MC      */
  --s4:#C4457B; /* ODOM Visa    */

  --ok:#17794E;      /* confirmed — it ran        */
  --pred:#9C7A00;    /* projected — model says due */
  --miss:#C0304F;    /* was due, never sighted     */

  --live:#16181C;
  --shadow:0 1px 2px rgba(20,22,26,.06), 0 8px 24px -16px rgba(20,22,26,.22);

  --mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,Roboto,sans-serif;

  --step:14px;
  --gap:2px;
}
@media (prefers-color-scheme:dark){
  :root{
    --surface:#131416; --panel:#191B1E; --sunk:#0E0F11;
    --line:#2B2E33; --line-strong:#3D4147;
    --ink:#E6E8EA; --ink-2:#A8ADB4; --ink-3:#767C84;
    --s1:#4A8CEC; --s2:#12A57C; --s3:#C4831B; --s4:#DA5E8C;
    --ok:#2CA36F; --pred:#B08610; --miss:#E05A63;
    --live:#E6E8EA;
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 8px 24px -16px rgba(0,0,0,.8);
  }
}
:root[data-theme="dark"]{
  --surface:#131416; --panel:#191B1E; --sunk:#0E0F11;
  --line:#2B2E33; --line-strong:#3D4147;
  --ink:#E6E8EA; --ink-2:#A8ADB4; --ink-3:#767C84;
  --s1:#4A8CEC; --s2:#12A57C; --s3:#C4831B; --s4:#DA5E8C;
  --ok:#2CA36F; --pred:#B08610; --miss:#E05A63;
  --live:#E6E8EA;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 8px 24px -16px rgba(0,0,0,.8);
}
:root[data-theme="light"]{
  --surface:#FCFCFB; --panel:#FFFFFF; --sunk:#F3F3F0;
  --line:#E2E2DC; --line-strong:#CBCBC3;
  --ink:#16181C; --ink-2:#4A4E56; --ink-3:#7C818A;
  --s1:#2266E8; --s2:#0D8A66; --s3:#C6710A; --s4:#C4457B;
  --ok:#17794E; --pred:#9C7A00; --miss:#C0304F;
  --live:#16181C;
  --shadow:0 1px 2px rgba(20,22,26,.06), 0 8px 24px -16px rgba(20,22,26,.22);
}

*{box-sizing:border-box}
body{
  margin:0; background:var(--surface); color:var(--ink);
  font-family:var(--sans); font-size:17px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:1080px; margin:0 auto; padding:0 20px 96px}
h1,h2,h3{text-wrap:balance; margin:0}

/* ── masthead ─────────────────────────────────────── */
.mast{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:14px;
  padding:30px 0 22px; border-bottom:1px solid var(--line);
}
.logo{
  font-family:var(--mono); font-size:22px; font-weight:700;
  letter-spacing:-.04em; display:flex; align-items:center; gap:9px;
}
.logo .bars{display:flex; gap:2px; align-items:flex-end}
.logo .bars i{width:4px; border-radius:1px; display:block}
.logo .bars i:nth-child(1){height:15px; background:var(--s1)}
.logo .bars i:nth-child(2){height:19px; background:var(--s2)}
.logo .bars i:nth-child(3){height:11px; background:var(--s3)}
.logo .bars i:nth-child(4){height:17px; background:var(--s4)}
.logo em{font-style:normal; font-weight:400; color:var(--ink-3)}
.tagline{color:var(--ink-2); font-size:15px; max-width:52ch}
.mast .spacer{flex:1}
.stamp{
  font-family:var(--mono); font-size:11px; color:var(--ink-3);
  letter-spacing:.06em; text-transform:uppercase; white-space:nowrap;
}

/* ── generic section ──────────────────────────────── */
section{padding-top:44px}
.eyebrow{
  font-family:var(--mono); font-size:11px; font-weight:600;
  letter-spacing:.13em; text-transform:uppercase; color:var(--ink-3);
  display:flex; align-items:center; gap:9px; margin-bottom:12px;
}
.eyebrow::after{content:""; flex:1; height:1px; background:var(--line)}
h2{font-size:23px; letter-spacing:-.02em; margin-bottom:6px}
.sub{color:var(--ink-2); font-size:15.5px; max-width:66ch; margin-bottom:20px}

/* ── live panel ───────────────────────────────────── */
.live-grid{display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(340px,1fr))}
.live-card{
  --state:var(--line-strong);
  background:var(--panel); border:3px solid var(--line);
  border-radius:4px; padding:20px 24px 22px; box-shadow:var(--shadow);
  position:relative; overflow:hidden;
}

/* Status drives the whole outline — even weight on all four sides, and the
   same 3px in every state so cards never shift geometry as the week turns.
   Line style carries the meaning alongside the hue (solid ran / dotted
   projected), which is what keeps the pair readable for red-green CVD. */
.live-card.on{
  --state:var(--ok);
  border-color:var(--ok);
  background:color-mix(in oklab, var(--ok) 6%, var(--panel));
}
.live-card.unverified{
  --state:var(--pred);
  border-style:dotted; border-color:var(--pred);
  background:color-mix(in oklab, var(--pred) 7%, var(--panel));
}
.live-card.off,.live-card.dead{
  --state:var(--line-strong);
  border-color:var(--line);
  background:var(--sunk);
}
.rname{
  font-size:27px; font-weight:700; letter-spacing:-.032em; line-height:1.15;
  color:var(--ink); margin:0 0 14px; text-wrap:balance;
}
.live-card.off .rname{color:var(--ink-2)}
.offerline{
  font-family:var(--mono); font-size:15px; font-weight:600; color:var(--ink);
  margin-top:11px; letter-spacing:-.01em;
}
.live-card.off .offerline{color:var(--ink-3); font-weight:400}
.pulse.off{color:var(--ink-3)}
.pulse.off i{animation:none; background:var(--line-strong)}
.unverified-note{
  margin-top:12px; padding-top:11px; border-top:1px dashed var(--line-strong);
  font-family:var(--mono); font-size:11px; line-height:1.5; color:var(--ink-3);
}
.pulse{
  display:inline-flex; align-items:center; gap:6px; font-family:var(--mono);
  font-size:10.5px; letter-spacing:.13em; text-transform:uppercase; font-weight:600;
  color:var(--state);
}
.pulse i{width:7px; height:7px; border-radius:50%; background:currentColor; animation:beat 2s ease-in-out infinite}
@keyframes beat{0%,100%{opacity:1; transform:scale(1)}50%{opacity:.35; transform:scale(.8)}}
@media (prefers-reduced-motion:reduce){.pulse i{animation:none}}
.live-meta{
  display:flex; flex-wrap:wrap; gap:14px; margin-top:14px;
  padding-top:13px; border-top:1px solid var(--line);
  font-family:var(--mono); font-size:11.5px; color:var(--ink-3);
}
.live-meta b{display:block; color:var(--ink); font-size:15px; font-weight:600; font-variant-numeric:tabular-nums}

/* ── next up rail ─────────────────────────────────── */
.rail{display:grid; gap:10px; grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.chip{
  background:var(--panel); border:1px solid var(--line); border-radius:3px;
  padding:13px 15px; border-top:3px solid var(--pred);
}
.chip .wk{font-family:var(--mono); font-size:11px; color:var(--ink-3); letter-spacing:.05em; text-transform:uppercase}
.chip .nm{font-size:14.5px; font-weight:600; margin:5px 0 2px; letter-spacing:-.01em}
.chip .of{font-family:var(--mono); font-size:11.5px; color:var(--ink-2)}
.conf{
  margin-top:11px; display:flex; align-items:center; gap:8px;
  font-family:var(--mono); font-size:11px; color:var(--ink-3); font-variant-numeric:tabular-nums;
}
.bar{flex:1; height:3px; background:var(--sunk); border-radius:2px; overflow:hidden}
.bar span{display:block; height:100%; background:var(--pred); border-radius:2px}

/* ── sequencer ────────────────────────────────────── */
.seq-shell{
  background:var(--panel); border:1px solid var(--line); border-radius:3px;
  box-shadow:var(--shadow); overflow:hidden;
}
.yearbar{
  display:flex; align-items:center; gap:10px; padding:11px 18px;
  border-bottom:1px solid var(--line); background:var(--sunk);
}
.yrnow{
  font-family:var(--mono); font-size:14px; font-weight:700;
  letter-spacing:-.02em; font-variant-numeric:tabular-nums; min-width:48px; text-align:center;
}
button.yr{padding:5px 10px; font-size:10.5px}
button.yr[disabled]{opacity:.3; cursor:not-allowed}
.yrstat{
  margin-left:auto; font-family:var(--mono); font-size:11px; color:var(--ink-3);
  font-variant-numeric:tabular-nums; text-align:right;
}
.seq-scroll{overflow-x:auto; padding:18px 0 14px}
.seq{display:inline-block; min-width:100%; padding:0 18px}
.months{display:flex; margin-left:var(--labelw); gap:var(--gap); margin-bottom:7px}
.mo{
  font-family:var(--mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink-3); border-left:1px solid var(--line); padding-left:5px; white-space:nowrap;
}
.track{display:flex; align-items:center; gap:var(--gap); margin-bottom:var(--gap)}
.tname{
  width:var(--labelw); flex:none; padding-right:12px; display:flex; align-items:center; gap:7px;
  font-family:var(--mono); font-size:11.5px; font-weight:600; white-space:nowrap; letter-spacing:-.01em;
}
.tname i{width:8px; height:8px; flex:none; background:var(--stream)}
.tname i.sq{border-radius:0}
.tname i.ci{border-radius:50%}
.tname i.di{transform:rotate(45deg)}
.tname i.tr{clip-path:polygon(50% 0,100% 100%,0 100%)}
.tname em{
  font-style:normal; font-weight:400; color:var(--ink-3); font-size:10px;
  margin-left:auto; padding-right:2px; font-variant-numeric:tabular-nums;
}
.cell{
  width:var(--step); height:var(--step); flex:none; border-radius:1px;
  background:var(--sunk); position:relative; cursor:default;
}
.cell.ok{background:var(--ok)}
.cell.pred{background:color-mix(in oklab, var(--pred) 26%, transparent); border:1.5px dotted var(--pred)}
.cell.pred.strong{background:color-mix(in oklab, var(--pred) 52%, transparent)}
.cell.miss{background:transparent; border:1.5px solid var(--miss)}
.cell.miss::after{
  content:""; position:absolute; left:50%; top:50%; width:1.5px; height:11px;
  background:var(--miss); transform:translate(-50%,-50%) rotate(45deg);
}
.cell.extra::after{
  content:""; position:absolute; inset:0; border:2px solid var(--panel);
  border-radius:1px;
}
.cell.locked{background:var(--sunk); border:none; opacity:1}
.cell.locked::before{
  content:""; position:absolute; left:50%; top:50%; width:9px; height:1.5px;
  background:var(--line-strong); transform:translate(-50%,-50%);
}
.cell.today{outline:2px solid var(--live); outline-offset:1px; z-index:2}
.axis{display:flex; gap:var(--gap); margin-left:var(--labelw); margin-top:8px}
.tick{
  width:var(--step); flex:none; font-family:var(--mono); font-size:9px;
  color:var(--ink-3); text-align:center; font-variant-numeric:tabular-nums;
}
.legend{
  display:flex; flex-wrap:wrap; gap:18px; padding:13px 18px;
  border-top:1px solid var(--line); background:var(--sunk);
  font-family:var(--mono); font-size:11px; color:var(--ink-2);
}
.legend div{display:flex; align-items:center; gap:7px}
.key{width:15px; height:15px; border-radius:1px; flex:none}
.key.k-ok{background:var(--ok)}
.key.k-pred{background:color-mix(in oklab, var(--pred) 40%, transparent); border:1.5px dotted var(--pred)}
.key.k-miss{border:1.5px solid var(--miss)}
.key.k-lock{background:var(--sunk); border:1px solid var(--line-strong); position:relative}
.key.k-lock::before{content:""; position:absolute; left:50%; top:50%; width:8px; height:1.5px; background:var(--line-strong); transform:translate(-50%,-50%)}

/* ── gate ─────────────────────────────────────────── */
.gate{
  border:1px solid var(--line-strong); border-radius:3px; background:var(--panel);
  padding:22px 24px; margin-top:14px; display:grid; gap:14px;
  grid-template-columns:1fr auto; align-items:center;
}
.gate h3{font-size:18px; letter-spacing:-.01em; margin-bottom:4px}
.gate p{margin:0; font-size:15px; color:var(--ink-2); max-width:56ch}
.gate form{display:flex; gap:8px; flex-wrap:wrap}
input[type=email],input[type=number],select{
  font-family:var(--mono); font-size:13px; color:var(--ink);
  background:var(--surface); border:1px solid var(--line-strong);
  border-radius:2px; padding:9px 11px; min-width:0;
}
input:focus-visible,select:focus-visible,button:focus-visible{
  outline:2px solid var(--s1); outline-offset:2px;
}
button{
  font-family:var(--mono); font-size:12px; font-weight:600; letter-spacing:.04em;
  text-transform:uppercase; cursor:pointer; border-radius:2px;
  padding:10px 16px; border:1px solid var(--ink); background:var(--ink); color:var(--surface);
}
button:hover{opacity:.86}
button.ghost{background:transparent; color:var(--ink-2); border-color:var(--line-strong)}
.gate.unlocked{border-color:var(--line); background:var(--sunk)}
.note{font-family:var(--mono); font-size:12.5px; color:var(--ink-3); line-height:1.55}

/* ── calculator ───────────────────────────────────── */
.calc{display:grid; gap:16px; grid-template-columns:minmax(260px,340px) 1fr; align-items:start}
.controls{
  background:var(--panel); border:1px solid var(--line); border-radius:3px;
  padding:18px 20px; display:grid; gap:13px; box-shadow:var(--shadow);
}
.field{display:grid; gap:5px}
.field label{
  font-family:var(--mono); font-size:10.5px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--ink-3);
}
.readout{
  background:var(--panel); border:1px solid var(--line); border-radius:3px;
  padding:20px 22px; box-shadow:var(--shadow);
}
.hero-n{
  font-family:var(--mono); font-size:42px; font-weight:700; letter-spacing:-.04em;
  font-variant-numeric:tabular-nums; line-height:1.05;
}
.hero-l{font-family:var(--mono); font-size:11px; letter-spacing:.11em; text-transform:uppercase; color:var(--ink-3); margin-top:4px}
.lines{margin-top:18px; border-top:1px solid var(--line)}
.ln{
  display:flex; justify-content:space-between; gap:16px; padding:8px 0;
  border-bottom:1px solid var(--line); font-family:var(--mono); font-size:12.5px;
  font-variant-numeric:tabular-nums;
}
.ln span:first-child{color:var(--ink-2)}
.ln.total{font-weight:700; font-size:14px; border-bottom:none}
.ln.total span:first-child{color:var(--ink)}

/* ── tables ───────────────────────────────────────── */
.tbl-wrap{overflow-x:auto; border:1px solid var(--line); border-radius:3px; background:var(--panel)}
table{border-collapse:collapse; width:100%; min-width:640px; font-size:15px}
th,td{padding:11px 14px; text-align:left; border-bottom:1px solid var(--line); vertical-align:top}
th{
  font-family:var(--mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink-3); font-weight:600; background:var(--sunk); white-space:nowrap;
}
tbody tr:last-child td{border-bottom:none}
td.num{font-family:var(--mono); font-variant-numeric:tabular-nums; white-space:nowrap}
.rate{font-family:var(--mono); font-weight:700; font-size:14px}
.rate.hi{color:var(--s2)}
.tag{
  display:inline-block; font-family:var(--mono); font-size:10px; letter-spacing:.07em;
  text-transform:uppercase; padding:2px 6px; border-radius:2px;
  border:1px solid var(--line-strong); color:var(--ink-2); white-space:nowrap;
}
.tag.warn{border-color:var(--s3); color:var(--s3)}

/* ── faq ──────────────────────────────────────────── */
details{border-bottom:1px solid var(--line); padding:2px 0}
summary{
  cursor:pointer; padding:13px 0; font-weight:600; font-size:14.5px;
  list-style:none; display:flex; gap:12px; align-items:flex-start;
}
summary::-webkit-details-marker{display:none}
summary::before{
  content:"+"; font-family:var(--mono); color:var(--ink-3); font-weight:400;
  flex:none; width:12px;
}
details[open] summary::before{content:"–"}
details p{margin:0 0 14px 24px; color:var(--ink-2); font-size:14px; max-width:70ch}
details ul{margin:0 0 14px 24px; padding-left:18px; color:var(--ink-2); font-size:14px; max-width:70ch}
details li{margin-bottom:5px}

.callout{
  border-left:3px solid var(--s3); background:var(--sunk);
  padding:13px 16px; border-radius:0 3px 3px 0; font-size:13.5px; color:var(--ink-2);
  max-width:72ch;
}
.callout b{color:var(--ink)}

footer{
  margin-top:60px; padding-top:22px; border-top:1px solid var(--line);
  font-size:12.5px; color:var(--ink-3); display:grid; gap:10px;
}
footer a{color:var(--ink-2)}
a{color:var(--s1)}

.themetog{
  font-family:var(--mono); font-size:10.5px; letter-spacing:.09em; text-transform:uppercase;
  background:transparent; color:var(--ink-3); border:1px solid var(--line-strong);
  padding:6px 10px; border-radius:2px; cursor:pointer; font-weight:600;
}
.themetog:hover{color:var(--ink); border-color:var(--ink-3)}

@media (max-width:760px){
  .calc{grid-template-columns:1fr}
  .gate{grid-template-columns:1fr}
  .hero-n{font-size:34px}
}

/* ── site chrome: brand, nav, article pages ───────────── */
.brandwrap{display:flex; flex-direction:column; gap:3px}
.brandsub{
  font-family:var(--mono); font-size:10.5px; letter-spacing:.05em;
  color:var(--ink-3); text-transform:uppercase;
}
.netkeys{display:flex; gap:7px; align-items:center; flex-wrap:wrap}
.netkey{
  display:inline-flex; align-items:center; gap:6px; padding:5px 10px;
  border:1px solid var(--line-strong); border-radius:2px; background:var(--panel);
  font-family:var(--mono); font-size:10.5px; font-weight:700; letter-spacing:.04em;
  white-space:nowrap;
}
.netkey b{font-weight:700; color:var(--ink)}
.netkey span{font-weight:400; color:var(--ink-3); letter-spacing:0}
.netkey i{width:8px; height:8px; border-radius:50%; flex:none; background:var(--line-strong)}
.netkey.hot i{background:var(--ok)}
.netkey.soon i{background:var(--pred)}

nav.sitenav{
  display:flex; gap:2px; flex-wrap:wrap; border-bottom:1px solid var(--line);
  margin-bottom:4px; padding-top:14px;
}
nav.sitenav a{
  font-family:var(--mono); font-size:11.5px; font-weight:600; letter-spacing:-.01em;
  color:var(--ink-3); text-decoration:none; padding:9px 13px;
  border-bottom:2px solid transparent; margin-bottom:-1px; white-space:nowrap;
}
nav.sitenav a:hover{color:var(--ink); background:var(--sunk)}
nav.sitenav a[aria-current="page"]{color:var(--ink); border-bottom-color:var(--ink)}
nav.sitenav a .soonpill{
  font-size:8.5px; letter-spacing:.08em; color:var(--ink-3);
  border:1px solid var(--line-strong); border-radius:2px; padding:1px 4px; margin-left:5px;
}

/* article pages */
.prose{max-width:70ch}
.prose h2{margin-top:38px}
.prose h3{font-size:18px; letter-spacing:-.01em; margin:26px 0 6px}
.prose p{color:var(--ink-2); margin:0 0 16px}
.prose ul,.prose ol{color:var(--ink-2); margin:0 0 16px; padding-left:22px}
.prose li{margin-bottom:9px}
.prose strong{color:var(--ink)}
.lede{font-size:19px; line-height:1.6; color:var(--ink-2); max-width:64ch; margin-bottom:8px}
.steps{counter-reset:step; list-style:none; padding:0; margin:0 0 20px}
.steps li{
  counter-increment:step; position:relative; padding-left:42px; margin-bottom:18px;
  color:var(--ink-2);
}
.steps li::before{
  content:counter(step); position:absolute; left:0; top:1px;
  width:27px; height:27px; border-radius:50%; background:var(--sunk);
  border:1px solid var(--line-strong); color:var(--ink);
  font-family:var(--mono); font-size:12px; font-weight:700;
  display:flex; align-items:center; justify-content:center;
}
.steps li b{display:block; color:var(--ink); margin-bottom:3px; font-size:15px}
.warn{
  border-left:3px solid var(--miss); background:var(--sunk);
  padding:14px 17px; border-radius:0 3px 3px 0; margin:0 0 18px;
  font-size:15px; line-height:1.6; color:var(--ink-2); max-width:72ch;
}
.warn b{color:var(--ink)}
.stub{
  border:1px dashed var(--line-strong); border-radius:3px; padding:26px 28px;
  background:var(--sunk); max-width:72ch;
}
.stub h3{margin-top:0}

/* ── resource kit (affiliate) ─────────────────────────── */
.kit{display:grid; gap:12px; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); margin:0 0 16px}
.kititem{
  border:1px solid var(--line); border-radius:3px; background:var(--panel);
  padding:16px 18px 15px; display:flex; flex-direction:column; gap:7px;
}
.kititem .kwhat{
  font-family:var(--mono); font-size:11.5px; letter-spacing:.11em;
  text-transform:uppercase; color:var(--ink-3);
}
.kititem h4{margin:0; font-size:17px; letter-spacing:-.01em; line-height:1.3}
.kititem p{margin:0; font-size:14.5px; color:var(--ink-2); flex:1}
.kititem a.buy{
  font-family:var(--mono); font-size:11px; font-weight:700; letter-spacing:.04em;
  text-transform:uppercase; text-decoration:none; color:var(--ink);
  border:1px solid var(--line-strong); border-radius:2px;
  padding:7px 11px; text-align:center; margin-top:3px;
}
.kititem a.buy:hover{background:var(--sunk); border-color:var(--ink-3)}
.disclose{
  font-family:var(--mono); font-size:11px; line-height:1.55; color:var(--ink-3);
  border:1px solid var(--line); border-radius:3px; padding:12px 15px;
  background:var(--sunk); max-width:72ch; margin:0 0 20px;
}
footer .disclose{margin:0}

/* ── legal footer ─────────────────────────────────────── */
.legal{
  border-top:1px solid var(--line); margin-top:6px; padding-top:16px;
  display:grid; gap:11px; max-width:78ch;
}
.legal p{
  margin:0; font-size:11.5px; line-height:1.6; color:var(--ink-3);
}
.legal b{color:var(--ink-2); font-weight:600}
.legal a{color:var(--ink-2)}

/* ── sighting report form ─────────────────────────────── */
.reportform{
  background:var(--panel); border:1px solid var(--line); border-radius:4px;
  padding:24px 26px 26px; box-shadow:var(--shadow); max-width:64ch;
  display:grid; gap:20px;
}
.rf{display:grid; gap:9px}
.rf > label,.rflabel{
  font-family:var(--mono); font-size:10.5px; letter-spacing:.11em;
  text-transform:uppercase; color:var(--ink-3);
}
.rflabel em{font-style:normal; text-transform:none; letter-spacing:0; color:var(--ink-3); opacity:.8}
.seg{display:flex; flex-wrap:wrap; gap:7px}
.seg input{position:absolute; opacity:0; width:0; height:0}
.seg label{
  font-family:var(--mono); font-size:12.5px; font-weight:600; cursor:pointer;
  border:1.5px solid var(--line-strong); border-radius:3px; padding:9px 14px;
  color:var(--ink-2); background:var(--surface); user-select:none;
}
.seg label:hover{border-color:var(--ink-3); color:var(--ink)}
.seg input:checked + label{
  background:var(--ink); border-color:var(--ink); color:var(--surface);
}
.seg input:focus-visible + label{outline:2px solid var(--pred); outline-offset:2px}
.seg.states input:checked + label[data-s="live"]{background:var(--ok); border-color:var(--ok); color:#fff}
.seg.states input:checked + label[data-s="none"]{background:var(--ink-3); border-color:var(--ink-3); color:var(--surface)}
.seg.states input:checked + label[data-s="out"]{background:var(--miss); border-color:var(--miss); color:#fff}
.reportform input[type=text],.reportform textarea{
  font-family:var(--mono); font-size:13px; color:var(--ink); width:100%;
  background:var(--surface); border:1px solid var(--line-strong);
  border-radius:2px; padding:10px 12px; resize:vertical;
}
.rfrow{display:grid; gap:14px; grid-template-columns:1fr 1fr}
.rfsend{display:flex; gap:10px; flex-wrap:wrap; align-items:center}
.rfsend button{padding:12px 20px; font-size:12.5px}
.rfnote{font-family:var(--mono); font-size:10.5px; color:var(--ink-3); line-height:1.5}
.rfout{
  display:none; border:1px solid var(--ok); border-radius:3px;
  background:color-mix(in oklab, var(--ok) 7%, var(--panel)); padding:16px 18px;
}
.rfout.show{display:block}
.rfout h4{margin:0 0 8px; font-size:15px}
.rfout pre{
  margin:0 0 12px; font-family:var(--mono); font-size:11.5px; line-height:1.6;
  color:var(--ink-2); white-space:pre-wrap; word-break:break-word;
}
.bounty{
  display:grid; gap:12px; grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  margin:0 0 20px;
}
.bounty div{
  border:1px solid var(--line); border-left:3px solid var(--ok); border-radius:0 3px 3px 0;
  background:var(--sunk); padding:14px 16px;
}
.bounty h4{margin:0 0 5px; font-size:14.5px; letter-spacing:-.01em}
.bounty p{margin:0; font-size:12.5px; color:var(--ink-2); line-height:1.5}
.confirmcta{
  display:inline-block; margin-top:12px; font-family:var(--mono); font-size:11px;
  font-weight:700; letter-spacing:.04em; text-transform:uppercase; text-decoration:none;
  color:var(--ink); border:1.5px solid var(--state); border-radius:2px; padding:8px 13px;
}
.confirmcta:hover{background:var(--sunk)}

/* ── scout leaderboard ────────────────────────────────── */
.board{
  background:var(--panel); border:1px solid var(--line); border-radius:4px;
  box-shadow:var(--shadow); overflow:hidden; max-width:64ch; margin:0 0 26px;
}
.boardhead{
  display:flex; align-items:baseline; gap:10px; padding:13px 18px;
  border-bottom:1px solid var(--line); background:var(--sunk);
}
.boardhead h3{margin:0; font-size:15px; letter-spacing:-.01em}
.boardhead span{
  margin-left:auto; font-family:var(--mono); font-size:10.5px;
  letter-spacing:.09em; text-transform:uppercase; color:var(--ink-3);
}
.boardrow{
  display:flex; align-items:center; gap:12px; padding:11px 18px;
  border-bottom:1px solid var(--line); font-size:14px;
}
.boardrow:last-child{border-bottom:none}
.boardrow .pos{
  font-family:var(--mono); font-size:12px; font-weight:700; color:var(--ink-3);
  width:22px; font-variant-numeric:tabular-nums;
}
.boardrow .who{font-weight:600; letter-spacing:-.01em}
.boardrow .rank{
  font-family:var(--mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase;
  border:1px solid var(--line-strong); border-radius:2px; padding:2px 6px; color:var(--ink-3);
}
.boardrow .n{
  margin-left:auto; font-family:var(--mono); font-size:13px; font-weight:700;
  font-variant-numeric:tabular-nums;
}
.boardempty{padding:26px 18px; text-align:center}
.boardempty b{display:block; font-size:15.5px; margin-bottom:5px}
.boardempty p{margin:0; font-size:13px; color:var(--ink-2)}
.ranks{
  display:flex; flex-wrap:wrap; gap:7px; margin:0 0 26px; max-width:64ch;
}
.ranks span{
  font-family:var(--mono); font-size:10.5px; letter-spacing:.05em;
  border:1px solid var(--line); border-radius:2px; padding:5px 9px; color:var(--ink-3);
}
.ranks span b{color:var(--ink-2); font-weight:700}
.httip{
  font-family:var(--mono); font-size:11px; color:var(--ink-3); margin-top:11px;
  padding-top:10px; border-top:1px solid var(--line);
}
.httip b{color:var(--ink-2)}

/* ── referral links on the card table ─────────────────── */
a.refbtn{
  display:inline-block; margin-top:7px; font-family:var(--mono); font-size:10px;
  font-weight:700; letter-spacing:.05em; text-transform:uppercase; text-decoration:none;
  color:var(--ink); border:1px solid var(--line-strong); border-radius:2px; padding:5px 9px;
  white-space:nowrap;
}
a.refbtn:hover{background:var(--sunk); border-color:var(--ink-3)}

/* ── calculator recommendation ────────────────────────── */
.reco{margin-top:14px; font-size:13px; line-height:1.55}
.reco:empty{display:none}
.reco b{color:var(--ink)}
.reco.warn-reco{
  border-left:3px solid var(--miss); background:color-mix(in oklab, var(--miss) 7%, transparent);
  padding:11px 14px; border-radius:0 3px 3px 0; color:var(--ink-2);
}
.reco.ok-reco{
  border-left:3px solid var(--ok); background:color-mix(in oklab, var(--ok) 6%, transparent);
  padding:11px 14px; border-radius:0 3px 3px 0; color:var(--ink-2);
}

/* ── kit item illustrations ───────────────────────────
   Inline SVG rather than product photography. Amazon's Associates terms only
   permit product images served through their own APIs, so hotlinked or saved
   product shots are not an option — and a generic stock photo of a binder
   teaches the reader nothing. These are diagrams of the *technique*: what nine
   pockets of gift cards look like, what a struck-through balance looks like.
   They also cost no requests and follow the theme. */
.kitfig{
  display:block; width:100%; height:84px; margin:0 0 2px;
  border:1px solid var(--line); border-radius:3px; background:var(--sunk);
}
.kitfig svg{display:block; width:100%; height:100%}

/* Real photos, when present, replace the diagram in the same slot. Fixed aspect
   so a mixed page (some photographed, some not) still lines up. */
.kitfig img{
  display:block; width:100%; height:100%; object-fit:cover; border-radius:2px;
}
.kitfig figcaption{display:none}

.byline{
  border-left:3px solid var(--s2); padding:2px 0 2px 14px; margin:0 0 16px;
  max-width:72ch;
}
.byline p{margin:0; font-size:14.5px; line-height:1.6; color:var(--ink-2)}
.byline b{color:var(--ink)}