:root{
  --bg:#0b1220;
  --panel:#111a2b;
  --panel-2:#0e1626;
  --line:#1e2b42;
  --line-hi:#31456a;

  --ink:#e8eef7;
  --ink-dim:#8fa3c0;
  --ink-faint:#61799c;

  --in:#2fd07f;      --in-dim:#123527;   --in-line:#1d5c3f;
  --out:#43536e;
  --warn:#ffb020;    --warn-dim:#33260a; --warn-line:#5c4413;
  --hot:#ff6a3d;
  --accent:#38bdf8;  --accent-dim:#0b2b3d; --accent-line:#1c5a7a;
  --amz:#ff9900;     --amz-line:#3c3320;

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

  --r:8px;
  --r-lg:12px;
  --wrap:1120px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);
  font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased;
}
a{color:inherit}
img{max-width:100%;height:auto}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}
.wrap-narrow{max-width:760px;margin:0 auto;padding:0 20px}
section{padding:30px 0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

.statusbar{
  position:sticky;top:0;z-index:50;background:rgba(11,18,32,.93);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--line);
}
.statusbar .wrap{display:flex;align-items:center;gap:16px;min-height:52px}
.brand{display:flex;align-items:center;gap:9px;font-weight:400;letter-spacing:-.01em;text-decoration:none;font-size:16px}
.brand .wm{font-weight:700;color:#00bcd4}
.brand .mark{color:var(--ink)}
.brand svg{display:block;flex:none}
.pulse{
  width:7px;height:7px;border-radius:50%;background:var(--in);flex:none;
  box-shadow:0 0 0 0 rgba(47,208,127,.6);animation:pulse 2.4s infinite;
}
@keyframes pulse{70%{box-shadow:0 0 0 7px rgba(47,208,127,0)}100%{box-shadow:0 0 0 0 rgba(47,208,127,0)}}
.sb-meta{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12px;color:var(--ink-dim)}
.sb-spacer{flex:1}
.sb-nav{display:flex;gap:14px;font-size:13px;color:var(--ink-dim)}
.sb-nav a{text-decoration:none}
.sb-nav a:hover{color:var(--ink)}

.btn{
  display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);
  background:var(--panel);color:var(--ink);padding:7px 13px;border-radius:7px;
  font-size:13px;font-weight:550;cursor:pointer;text-decoration:none;font-family:inherit;
}
.btn:hover{border-color:var(--line-hi)}
.btn-primary{background:var(--accent);border-color:var(--accent);color:#04131d;font-weight:650}
.btn-primary:hover{background:#5bcbfa;border-color:#5bcbfa}

.counter{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.counter .n{font-family:var(--mono);font-size:64px;line-height:1;font-weight:600;letter-spacing:-.03em}
.counter .n.zero{color:var(--out)}
.counter .n.some{color:var(--in)}
.counter .lbl{font-size:19px;color:var(--ink-dim)}
.counter .lbl b{color:var(--ink);font-weight:600}
.subline{
  margin-top:10px;font-family:var(--mono);font-size:12.5px;color:var(--ink-faint);
  display:flex;gap:14px;flex-wrap:wrap;
}
.subline span{display:inline-flex;align-items:center;gap:6px}
.dot{width:6px;height:6px;border-radius:50%;background:var(--out);flex:none}
.dot.in{background:var(--in)}
.dot.warn{background:var(--warn)}

.filters{display:flex;gap:7px;flex-wrap:wrap;padding:4px 0 16px;border-bottom:1px solid var(--line)}
.chip{
  border:1px solid var(--line);background:transparent;color:var(--ink-dim);
  padding:5px 11px;border-radius:99px;font-size:12.5px;cursor:pointer;font-family:var(--mono);
}
.chip:hover{color:var(--ink);border-color:var(--line-hi)}
.chip[aria-pressed="true"]{background:var(--accent-dim);border-color:var(--accent-line);color:#9ddcf7}

.grid{display:grid;gap:14px}
.g2{grid-template-columns:1fr 1fr}
.g3{grid-template-columns:repeat(3,1fr)}
.panel{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--panel);overflow:hidden}
.panel-h{
  padding:14px 18px;border-bottom:1px solid var(--line);display:flex;
  align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
}
.panel-h h3{margin:0;font-size:14px;font-weight:600;letter-spacing:-.005em}
.panel-h .tag{font-family:var(--mono);font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-faint)}
.panel-b{padding:16px 18px}
.sec-h{margin:0 0 6px;font-size:22px;letter-spacing:-.02em}
.sec-p{margin:0 0 18px;color:var(--ink-dim);font-size:14px;max-width:70ch}
.fine{font-size:11.5px;color:var(--ink-faint)}

.rows{display:flex;flex-direction:column}
.row{
  display:grid;grid-template-columns:1fr auto auto auto;gap:14px;align-items:center;
  padding:13px 0;border-bottom:1px solid var(--line);
}
.row:last-child{border-bottom:0}
.row .nm b{display:block;font-size:14px;font-weight:550}
.row .nm small{color:var(--ink-faint);font-family:var(--mono);font-size:11.5px}
.row .btu{font-family:var(--mono);font-size:12px;color:var(--ink-dim);white-space:nowrap}
.row .px{font-family:var(--mono);font-size:15px;font-weight:600;white-space:nowrap}
.row .go{font-size:12.5px;color:var(--accent);white-space:nowrap;text-decoration:none}
.badge{
  font-family:var(--mono);font-size:11px;padding:3px 7px;border-radius:5px;white-space:nowrap;
  border:1px solid var(--line);color:var(--ink-dim);
}
.badge.in{background:var(--in-dim);color:var(--in);border-color:var(--in-line)}
.badge.scarce{background:var(--warn-dim);color:var(--warn);border-color:var(--warn-line)}
.badge.out{background:transparent;color:var(--out)}

.empty{margin:22px 0 0;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:var(--panel)}
.empty-top{padding:22px 22px 18px;border-bottom:1px solid var(--line)}
.empty-top h2{margin:0 0 6px;font-size:19px;letter-spacing:-.01em}
.empty-top p{margin:0;color:var(--ink-dim);font-size:14px;max-width:62ch}

.prow{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}
.prow:last-child{border-bottom:0}
.prow .nm{flex:1;min-width:0}
.prow .nm b{display:block;font-size:13.5px;font-weight:550;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prow .nm small{color:var(--ink-faint);font-family:var(--mono);font-size:11.5px}
.prow .px{font-family:var(--mono);font-size:13.5px;text-align:right}
.prow .px s{color:var(--ink-faint);font-size:11.5px;display:block}
.delta{font-family:var(--mono);font-size:11.5px;padding:3px 7px;border-radius:5px;white-space:nowrap}
.delta.up{background:var(--warn-dim);color:var(--warn);border:1px solid var(--warn-line)}
.delta.down{background:var(--in-dim);color:var(--in);border:1px solid var(--in-line)}

.cov{display:grid;grid-template-columns:repeat(auto-fill,minmax(158px,1fr));gap:8px}
.cov a,.cov div{
  border:1px solid var(--line);border-radius:var(--r);padding:9px 11px;background:var(--panel-2);
  font-size:12.5px;display:flex;align-items:center;justify-content:space-between;gap:8px;
  text-decoration:none;
}
.cov a:hover{border-color:var(--line-hi)}
.cov b{font-weight:550}
.cov .st{font-family:var(--mono);font-size:10.5px;color:var(--ink-faint)}
.cov .new{color:var(--accent);border-color:var(--accent-line)}

.amz{border-color:var(--amz-line);background:#15130e}
.amz .panel-h{border-bottom-color:var(--amz-line)}
.amz-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(216px,1fr));gap:10px}
/* Flex column so the price button bottom-aligns across cards whose titles wrap
   to different heights — otherwise the row looks broken. */
.amz-card{
  display:flex;flex-direction:column;text-decoration:none;border:1px solid var(--line);
  border-radius:10px;padding:14px;background:var(--panel-2);
  transition:border-color .12s,transform .12s;
}
.amz-card:hover{border-color:var(--amz);transform:translateY(-1px)}
.amz-btu{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;color:var(--amz);text-transform:uppercase;margin-bottom:6px}
.amz-card b{display:block;font-size:14px;font-weight:600;margin-bottom:4px}
.amz-card small{display:block;color:var(--ink-faint);font-size:12px;line-height:1.45}

/* Lead-time warning. The whole point of this section is that none of it arrives
   in time to be useful, so it sits above the grid and is not styled as fine print. */
.amz-warn{
  margin:0 0 14px;padding:12px 14px;border:1px solid var(--amz-line);border-radius:10px;
  background:rgba(255,153,0,.06);font-size:13.5px;line-height:1.5;color:var(--ink);
}
.amz-warn b{color:var(--amz)}

/* Delivery date, deliberately as prominent as the price. */
.amz-eta{
  margin:8px 0 6px;padding:7px 9px;border-radius:8px;background:rgba(255,153,0,.09);
  border:1px solid var(--amz-line);font-size:13px;font-weight:600;color:var(--ink);line-height:1.35;
}
.amz-eta-l{
  display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--amz);font-weight:400;margin-bottom:2px;
}

.amz-none{margin:0;color:var(--ink-faint);font-size:14px}

/* Social proof beside the hero form. Hidden until /api/pulse answers. */
.proof{display:flex;align-items:center;gap:8px;margin:10px 0 0;font-size:13.5px;color:var(--ink-dim)}
.proof b{color:var(--ink)}
.proof-dot{width:7px;height:7px;border-radius:50%;background:var(--in);flex:none}

/* Board search + in-stock filter. */
.board-tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 14px}
.board-tools input[type=search]{
  flex:1;min-width:200px;padding:9px 12px;border:1px solid var(--line);border-radius:9px;
  background:var(--panel-2);color:var(--ink);font-size:14px;font-family:inherit;
}
.board-tools input[type=search]:focus{outline:none;border-color:var(--accent)}
.board-toggle{display:flex;align-items:center;gap:7px;font-size:13.5px;color:var(--ink-dim);white-space:nowrap;cursor:pointer}

/* Sold-out and pre-order cards must not read as buyable. */
.st-card-out{opacity:.72}
.st-card-out:hover{opacity:1}
.st-go.st-sold{color:var(--ink-faint);border-color:var(--line)}
.st-go.st-pre{color:#b7a8ff;border-color:#3a3560}

/* Per-card watch button — the thing the redesign lost. */
.st-foot{display:flex;gap:8px;align-items:center;margin-top:10px;padding-top:10px;border-top:1px solid #1f3b52}
.st-watch{
  flex:1;padding:7px 10px;border:1px solid #2a4a63;border-radius:8px;background:transparent;
  color:#7f9bb0;font:600 12.5px/1 inherit;cursor:pointer;font-family:inherit;
}
.st-watch:hover{border-color:#3ddc97;color:#3ddc97}
.st-watch.on{background:#123a2c;border-color:#3ddc97;color:#3ddc97}

/* Selected models, shown at the signup form. */
.chips{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 12px}
.chip{
  display:inline-flex;align-items:center;gap:6px;padding:5px 8px 5px 10px;border-radius:99px;
  border:1px solid #3ddc97;background:#123a2c;color:#3ddc97;font-size:12.5px;
}
.chip button{background:none;border:0;color:inherit;font-size:15px;line-height:1;cursor:pointer;padding:0}

/* Hero. Carries the only h1 and puts a signup form above the fold — the design
   originally buried its single form below the stock board, the pre-order panel
   and the whole Amazon section, on a page whose job is email capture. */
.hero-v3{padding:34px 0 8px}
.hero-v3 h1{
  margin:0 0 10px;font-size:clamp(28px,4.4vw,44px);line-height:1.08;
  letter-spacing:-.025em;font-weight:700;max-width:19ch;
}
.hero-v3 h1 em{font-style:normal;color:var(--accent)}
.hero-lede{margin:0 0 18px;max-width:60ch;font-size:15.5px;line-height:1.6;color:var(--ink-faint)}
.hero-form{max-width:520px}
@media(max-width:700px){.hero-v3{padding:22px 0 4px}}

/* Programmatic-SEO hub links. Deliberately low-key: they exist for crawlers and
   for people who arrived searching a specific brand, not as a primary CTA. */
.hub-links{margin-top:18px;padding-top:14px;border-top:1px solid var(--line);font-size:13px;line-height:1.9}
.hub-links p{margin:0 0 4px;color:var(--ink-faint)}
.hub-links strong{color:var(--ink);font-weight:600;margin-right:4px}
.hub-links a{color:var(--ink-faint);text-decoration:none;border-bottom:1px solid transparent}
.hub-links a:hover{color:var(--accent);border-bottom-color:var(--accent)}

/* Installer lead capture band. */
.band-wrap{margin:8px 0 28px}
.band{
  display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;
  padding:22px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--panel);
}
.band h2{margin:0 0 4px;font-size:19px;letter-spacing:-.015em}
.band p{margin:0;font-size:14px;color:var(--ink-faint)}

/* Fills the gap left by an odd number of listings. Dashed so it reads as
   "more over there", not as another verified unit with a delivery date. */
.amz-browse{border-style:dashed;background:transparent}
.amz-browse:hover{background:var(--panel-2)}

/* BTU sizing guide. Neutral panel styling on purpose — it is advice, not an
   offer, so it must not look like another buyable card. */
.btu-guide{
  margin:0 0 16px;padding:14px;border:1px solid var(--line);border-radius:10px;
  background:var(--panel-2);
}
.btu-guide-h{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-faint);margin-bottom:10px;
}
.btu-rows{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px}
.btu-row{
  display:flex;flex-direction:column;gap:2px;padding:9px 11px;border:1px solid var(--line);
  border-radius:8px;background:var(--panel);
}
.btu-row b{font-size:13px;font-weight:600;color:var(--ink)}
.btu-row span{font-size:12.5px;color:var(--ink-faint);line-height:1.4}
.btu-note{margin:10px 0 0;font-size:12.5px;line-height:1.5;color:var(--ink-faint)}

/* Pre-order. Deliberately its own colour — NOT the green of the in-stock board
   (which means "buyable today") and not the amber of Amazon marketplace. A
   pre-order is a third thing and must not be mistaken for either. */
.pre-warn{
  margin:0 0 14px;padding:12px 14px;border:1px solid #3a3560;border-radius:10px;
  background:rgba(140,120,255,.07);font-size:13.5px;line-height:1.5;color:var(--ink);
}
.pre-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(228px,1fr));gap:10px}
.pre-card{
  display:flex;flex-direction:column;text-decoration:none;border:1px solid #2c2950;
  border-radius:10px;padding:14px;background:var(--panel-2);color:inherit;
  transition:border-color .12s,transform .12s;
}
.pre-card:hover{border-color:#8c78ff;transform:translateY(-1px)}
.pre-card b{display:block;font-size:14px;font-weight:600;margin-bottom:4px}
.pre-tag{
  align-self:flex-start;font-family:var(--mono);font-size:9.5px;letter-spacing:.09em;
  text-transform:uppercase;color:#b7a8ff;border:1px solid #3a3560;border-radius:99px;
  padding:3px 8px;margin-bottom:8px;
}
.pre-eta{
  margin:8px 0 6px;padding:7px 9px;border-radius:8px;background:rgba(140,120,255,.09);
  border:1px solid #3a3560;font-size:13px;font-weight:600;color:var(--ink);line-height:1.35;
}
.pre-eta .amz-eta-l{color:#b7a8ff}
.pre-btn{
  margin-top:auto;text-align:center;padding:9px 12px;border:1px solid #3a3560;
  border-radius:9px;font-weight:600;font-size:13.5px;color:#b7a8ff;
}
.pre-card:hover .pre-btn{background:#241f45;border-color:#8c78ff}

.signup{border:1px solid var(--line);border-radius:var(--r-lg);padding:22px;background:var(--panel)}
.signup h3{margin:0 0 6px;font-size:18px;letter-spacing:-.01em}
.signup p{margin:0 0 14px;color:var(--ink-dim);font-size:13.5px;max-width:58ch}
.form{display:flex;gap:8px;flex-wrap:wrap}
.form input{
  flex:1;min-width:220px;background:#0a1322;border:1px solid var(--line);color:var(--ink);
  padding:11px 13px;border-radius:var(--r);font-size:14px;font-family:inherit;
}
.form input:focus{outline:none;border-color:var(--accent)}

.article{padding:34px 0 10px}
.article .kicker{font-family:var(--mono);font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}
.article h1{font-size:34px;line-height:1.18;letter-spacing:-.025em;margin:0 0 14px;max-width:20ch}
.article .standfirst{font-size:17px;color:var(--ink-dim);margin:0 0 18px;max-width:60ch;line-height:1.6}
.byline{
  display:flex;gap:14px;flex-wrap:wrap;font-family:var(--mono);font-size:11.5px;
  color:var(--ink-faint);padding-bottom:20px;border-bottom:1px solid var(--line);
}
.prose{font-size:16.5px;line-height:1.75;max-width:68ch}
.prose h2{font-size:21px;letter-spacing:-.015em;margin:34px 0 10px}
.prose h3{font-size:17px;margin:26px 0 8px}
.prose p{margin:0 0 16px;color:#d6e0ee}
.prose ul,.prose ol{margin:0 0 16px;padding-left:20px;color:#d6e0ee}
.prose li{margin-bottom:7px}
.prose strong{color:var(--ink);font-weight:600}
.prose a{color:var(--accent)}
.prose table{width:100%;border-collapse:collapse;margin:0 0 20px;font-size:14px}
.prose th{
  text-align:left;font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-faint);padding:8px 10px;border-bottom:1px solid var(--line);font-weight:500;
}
.prose td{padding:9px 10px;border-bottom:1px solid var(--line)}
.prose blockquote{
  margin:0 0 20px;padding:14px 18px;background:var(--panel);border:1px solid var(--line);
  border-radius:var(--r);color:var(--ink-dim);font-size:14.5px;
}

.inline-stat{
  display:flex;align-items:baseline;gap:12px;margin:0 0 20px;padding:14px 18px;
  background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--accent);
  border-radius:0;
}
.inline-stat .n{font-family:var(--mono);font-size:28px;font-weight:600;line-height:1}
.inline-stat .t{font-size:13.5px;color:var(--ink-dim)}


@media(max-width:900px){
  .g2,.g3{grid-template-columns:1fr}
}
@media(max-width:680px){
  .counter .n{font-size:44px}
  .counter .lbl{font-size:16px}
  .sb-meta,.sb-nav{display:none}
  .article h1{font-size:26px}
  .article .standfirst{font-size:15.5px}
  .prose{font-size:16px}
  .row{grid-template-columns:1fr auto;row-gap:6px}
  .row .btu{grid-column:1;font-size:11.5px}
  .row .go{grid-column:2;text-align:right}
  .panel-b,.empty-top{padding-left:14px;padding-right:14px}
}


.amz-cta{
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  text-decoration:none;background:var(--amz);color:#221a05;border-radius:10px;
  padding:16px 18px;margin-bottom:18px;transition:filter .12s,transform .12s;
}
.amz-cta:hover{filter:brightness(1.07);transform:translateY(-1px)}
.amz-cta b{display:block;font-size:16px;font-weight:700;letter-spacing:-.01em}
.amz-cta small{display:block;font-size:12.5px;opacity:.78;margin-top:2px}
.amz-cta-go{font-weight:700;font-size:14px;white-space:nowrap}
.amz-sep{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;
  color:var(--ink-faint);margin:0 0 10px;
}
.amz-btn{
  display:block;margin-top:12px;text-align:center;background:transparent;color:var(--amz);
  border:1px solid var(--amz-line);border-radius:7px;padding:7px 10px;font-size:12.5px;font-weight:600;
}
.amz-card:hover .amz-btn{background:var(--amz);color:#221a05;border-color:var(--amz)}

footer{border-top:1px solid var(--line);margin-top:24px;padding:22px 0 44px}
.foot-nav{display:flex;flex-wrap:wrap;gap:8px 20px;margin-bottom:14px}
.foot-nav a{color:var(--ink-dim);text-decoration:none;font-size:13px}
.foot-nav a:hover{color:var(--ink)}
.foot-note{margin:0;color:var(--ink-faint);font-size:12px;max-width:70ch;line-height:1.6}