/* ═══════════════════════════════════════════════════════════════
   ABEBIT — public site (landing + FAQ). Terminal + kinetic direction.
   Real data only: every stat driven off template context, no invented
   numbers. See signals_app/services/expectancy.py for why win-rate
   framing is avoided.
   ═══════════════════════════════════════════════════════════════ */
:root{
  --bg:#050505; --panel:#0A0A0B; --panel-2:#0E0F11; --panel-3:#131417;
  --line:rgba(255,255,255,.08); --line-2:rgba(255,255,255,.16); --line-3:rgba(255,255,255,.26);
  --ink:#F2F3F4; --ink-1:#AEB3BA; --ink-2:#6F757D; --ink-3:#3E4248;
  --amber:#F0B90B; --amber-hi:#FFD23F; --amber-dim:#8A6A0E;
  --pos:#00D97E; --neg:#FF4757;
  --mono:'JetBrains Mono',ui-monospace,'SF Mono',monospace;
  --disp:'Space Grotesk',system-ui,sans-serif;
  --wrap:1240px; --pad:clamp(20px,5vw,56px);
  --e:cubic-bezier(.16,1,.3,1);
  --e2:cubic-bezier(.65,0,.35,1);
}
*{margin:0;padding:0;box-sizing:border-box}
/* Horizontal scroll is always a bug here. The marquees that legitimately
   overflow clip themselves; anything else that grows past the viewport
   would silently drag the whole page sideways on a phone.
   `clip` rather than `hidden` on purpose: `hidden` turns the root into a
   scroll container, which is exactly what breaks position:sticky on the
   nav. `clip` contains the overflow without that side effect. */
html{scroll-behavior:smooth;overflow-x:clip}
.pb{--font-body:var(--disp);background:var(--bg);color:var(--ink);font-family:var(--disp);line-height:1.6;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;text-rendering:optimizeLegibility}
.pb a{text-decoration:none;color:inherit}
.pb ::selection{background:rgba(240,185,11,.3);color:#000}
.pb img,.pb svg{display:block}
.pb-mono{font-family:var(--mono)}

/* ── faint grid + vignette, no gradient orbs ───────────────────── */
.pb-bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.pb-grid{position:absolute;inset:0;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:44px 44px;mask-image:radial-gradient(ellipse 85% 60% at 50% 0%,#000,transparent 75%)}
.pb-vig{position:absolute;inset:0;background:radial-gradient(ellipse 70% 50% at 50% -10%,rgba(240,185,11,.05),transparent 60%)}
.pb-nav,.pb-tape,main,.pb-foot{position:relative;z-index:1}

/* ── scroll progress ────────────────────────────────────────────── */
.pb-progress{position:fixed;top:0;left:0;height:2px;width:0%;z-index:80;background:var(--amber);
  box-shadow:0 0 10px rgba(240,185,11,.7);transition:width .1s linear}

/* ── reveal (gated behind .js) ─────────────────────────────────── */
.js .reveal{opacity:0;transform:translateY(16px);transition:opacity .6s var(--e) var(--d,0ms),transform .6s var(--e) var(--d,0ms)}
.js .reveal.in{opacity:1;transform:none}
.js .reveal-mask{opacity:0;clip-path:inset(0 0 100% 0);transition:opacity .1s,clip-path .8s var(--e2) var(--d,0ms)}
.js .reveal-mask.in{opacity:1;clip-path:inset(0 0 0% 0)}

/* Per-child stagger: a grid should assemble itself, not pop in as one
   block. --i is set per child in landing.js. */
.js .stagger>*{opacity:0;transform:translateY(18px);
  transition:opacity .55s var(--e),transform .55s var(--e);
  transition-delay:calc(var(--i,0) * 55ms)}
.js .stagger.in>*{opacity:1;transform:none}

/* Hero headline: lines rise out from behind a mask, one after another. */
.js .pb-hero h1 .ln{display:block;overflow:hidden}
.js .pb-hero h1 .ln>span{display:block;transform:translateY(105%);
  transition:transform .85s var(--e2);transition-delay:calc(var(--i,0) * 90ms)}
.js .pb-hero h1.in .ln>span{transform:none}

/* ── buttons ────────────────────────────────────────────────────── */
.pb-btn,.pb-btn-ghost{display:inline-flex;align-items:center;gap:9px;height:42px;padding:0 20px;
  border-radius:3px;font-family:var(--mono);font-weight:600;font-size:13.5px;cursor:pointer;white-space:nowrap;
  letter-spacing:.01em;transition:transform .18s var(--e),box-shadow .2s,background .2s,border-color .2s,color .2s}
/* Selector carries .pb on purpose. `.pb a{color:inherit}` above is (0,1,1) and
   was beating a bare `.pb-btn` at (0,1,0), so every primary button rendered
   near-white text on amber — about 1.9:1 contrast, unreadable and far under
   the 4.5:1 minimum. Two classes takes this to (0,2,0) and the dark ink wins.
   Keep .pb in the selector if this rule is ever moved or rewritten. */
.pb-btn,.pb .pb-btn{color:#0A0700;background:var(--amber);box-shadow:inset 0 1px 0 rgba(255,255,255,.3);
  position:relative;overflow:hidden}
.pb-btn:hover,.pb .pb-btn:hover{color:#0A0700;background:var(--amber-hi);transform:translateY(-2px);box-shadow:0 10px 24px -8px rgba(240,185,11,.5)}
/* a light sweeps across the primary button on hover — the one flourish
   reserved for the single action we most want people to take */
.pb-btn::after{content:'';position:absolute;top:0;bottom:0;left:-60%;width:45%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-18deg);opacity:0}
.has-fine .pb-btn:hover::after{animation:sheen .75s var(--e) forwards}
@keyframes sheen{from{left:-60%;opacity:1}to{left:130%;opacity:0}}
.pb-btn-ghost{color:var(--ink);background:transparent;border:1px solid var(--line-2)}
.pb-btn-ghost:hover{border-color:var(--amber);color:var(--amber-hi);transform:translateY(-2px)}
.pb-btn-lg{height:52px;padding:0 28px;font-size:15px}

/* ── nav ────────────────────────────────────────────────────────── */
.pb-nav{display:flex;align-items:center;justify-content:space-between;gap:34px;padding:15px var(--pad);position:sticky;top:0;z-index:40;
  transition:background .3s,border-color .3s;border-bottom:1px solid transparent;
  background:rgba(5,5,5,.7);backdrop-filter:blur(10px)}
.pb-nav.scrolled{background:rgba(5,5,5,.92);border-bottom-color:var(--line)}
.pb-logo{display:inline-flex;align-items:center;gap:10px;font-size:19px;font-weight:700}
.pb-logo b{color:var(--amber)}
.pb-links{display:flex;gap:28px;flex:1;font-family:var(--mono);font-size:13px;color:var(--ink-1)}
.pb-links a{transition:color .18s}.pb-links a:hover{color:var(--ink)}

/* ── ticker tape ────────────────────────────────────────────────── */
.pb-tape{border-bottom:1px solid var(--line);background:var(--panel);overflow:hidden;white-space:nowrap}
.pb-tape-track{display:inline-flex;animation:tape 38s linear infinite}
.pb-tape:hover .pb-tape-track{animation-play-state:paused}
.pb-tape-item{display:inline-flex;align-items:center;gap:8px;padding:9px 22px;font-family:var(--mono);font-size:12px;
  color:var(--ink-2);border-right:1px solid var(--line)}
.pb-tape-item b{color:var(--ink-1);font-weight:600}
.pb-tape-dot{width:5px;height:5px;border-radius:50%;background:var(--pos)}
@keyframes tape{to{transform:translateX(-50%)}}

/* ── section rhythm ──────────────────────────────────────────────
   One left rail down the whole page: section headings start on the
   same x as the grid they introduce, never floated to a centred
   column — a centred block holding left-aligned text reads as a
   mistake, not a choice. Vertical rhythm is deliberately uneven:
   sections that continue a thought sit closer than ones that start
   a new one (see .pb-tight below). */
main>section{max-width:var(--wrap);margin:0 auto;padding:clamp(60px,7.5vw,104px) var(--pad)}
main>section.pb-tight{padding-top:clamp(24px,3vw,44px)}
.pb-sec-head{max-width:680px;margin:0 0 clamp(32px,4vw,52px)}
.pb-sec-head h2,.pb-sec-head h1{font-size:clamp(26px,3.8vw,42px);font-weight:700;letter-spacing:-.02em;line-height:1.12}
.pb-sec-head p{margin-top:14px;color:var(--ink-1);font-size:16px}
.pb-tag{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--amber);margin-bottom:16px}
.pb-tag::before{content:'';width:7px;height:7px;background:var(--amber)}

/* ── hero ───────────────────────────────────────────────────────── */
.pb-hero{position:relative;padding-top:clamp(52px,8vw,88px)!important;padding-bottom:clamp(48px,7vw,72px)!important}
.pb-spot{position:absolute;inset:0;pointer-events:none;opacity:0;z-index:0;transition:opacity .5s;
  background:radial-gradient(560px circle at var(--mx,50%) var(--my,0%),rgba(240,185,11,.1),transparent 65%)}
.has-fine .pb-spot{opacity:1}
.pb-hero-in{position:relative;z-index:1;max-width:900px}
.pb-record{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:12px;color:var(--ink-1);
  border:1px solid var(--line-2);padding:7px 14px 7px 7px;margin-bottom:28px}
.pb-record b{display:inline-flex;align-items:center;gap:6px;color:#0A0700;background:var(--pos);
  padding:3px 8px;font-weight:700;font-size:11px}
.pb-hero h1{font-size:clamp(38px,6.4vw,80px);line-height:1.02;font-weight:700;letter-spacing:-.03em;max-width:15ch}
.pb-hero h1 .pb-h1-amber{color:var(--amber)}
/* no-JS / reduced-motion fallback: lines are just block elements */
.pb-hero h1 .ln{display:block}
.pb-hero-p{margin:24px 0 0;max-width:600px;color:var(--ink-1);font-size:clamp(15.5px,1.6vw,18px);line-height:1.65}
.pb-hero-p b{color:var(--ink);font-weight:600}
.pb-cta{display:flex;gap:12px;margin-top:32px;flex-wrap:wrap}
.pb-trust{display:flex;gap:22px;margin-top:26px;flex-wrap:wrap;font-family:var(--mono);font-size:12px;color:var(--ink-2)}
/* `a` as well as `span`: the non-custodial chip is a jump link to #custody,
   and without this it lost the flex alignment the other chips have. */
.pb-trust span,.pb-trust a{display:inline-flex;align-items:center;gap:7px}
.pb-trust a{transition:color .18s var(--e)}
.pb-trust a:hover{color:var(--ink)}
.pb-trust svg{width:13px;height:13px;color:var(--pos)}

/* ── terminal readout panel (hero visual) ──────────────────────── */
.pb-term{margin-top:clamp(40px,6vw,64px);border:1px solid var(--line-2);background:var(--panel);position:relative}
.pb-term::before{content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.03),transparent 30%)}
.pb-term-bar{display:flex;align-items:center;gap:10px;padding:10px 16px;border-bottom:1px solid var(--line);font-family:var(--mono)}
.pb-term-dots{display:flex;gap:6px}.pb-term-dots i{width:8px;height:8px;border-radius:50%;background:var(--line-3)}
.pb-term-title{font-size:11.5px;color:var(--ink-2);flex:1;text-align:center}
.pb-term-live{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;font-weight:600;color:var(--pos);letter-spacing:.08em}
.pb-term-live i{width:6px;height:6px;border-radius:50%;background:var(--pos);animation:blink 1.6s steps(2) infinite}
@keyframes blink{50%{opacity:.25}}
.pb-ticksec{color:var(--ink-3);font-weight:500}
.pb-term-grid{display:grid;grid-template-columns:1.5fr 1fr}
.pb-term-scan{padding:20px;border-right:1px solid var(--line)}
.pb-scan-head{display:flex;justify-content:space-between;font-family:var(--mono);font-size:11.5px;color:var(--ink-2);margin-bottom:14px}
.pb-scan-row{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:10px;padding:8px 0;font-family:var(--mono);font-size:12px;
  color:var(--ink-1);border-top:1px solid var(--line);align-items:center}
.pb-scan-row:first-of-type{border-top:none}
.pb-scan-row b{color:var(--ink)}
.pb-scan-row .buy{color:var(--pos)}.pb-scan-row .rej{color:var(--ink-3)}
.pb-scan-bar{height:4px;background:rgba(255,255,255,.06);position:relative}
.pb-scan-bar i{position:absolute;inset:0 auto 0 0;width:var(--w);background:var(--amber)}
.pb-term-side{padding:18px;display:flex;flex-direction:column;gap:12px}
.pb-term-stat{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--mono)}
.pb-term-stat span{font-size:11px;color:var(--ink-2)}
.pb-term-stat b{font-size:15px;color:var(--ink)}
.pb-term-stat b.pos{color:var(--pos)}

/* ── dashboard preview — a window into the actual app ────────────
   Deliberately its own visual language (rounded, gradient cards) that
   mirrors dashboard.css's --dbx tokens, not the sharp marketing-site
   look — because it's supposed to read as "a different screen inside
   the product," the same way the real dashboard looks different from
   this landing page. Numbers are illustrative except outcomes tracked. */
.pb-preview{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(32px,5vw,56px);align-items:center}
.pb-preview-copy p{margin-top:14px;color:var(--ink-1);font-size:15px;line-height:1.65;max-width:46ch}
.pb-preview-copy .pb-btn-ghost{margin-top:22px}

.pb-dbx{
  --dc:#12141B; --dc2:#0F1116; --delev:#171A22; --db:rgba(255,255,255,.07); --db2:rgba(255,255,255,.13);
  --dt0:#F2F4F7; --dt1:#A9B1BD; --dt2:#6B7280;
  --dbull:#12D18E; --dbear:#F7485F;
  --dr-md:12px; --dr-lg:15px;
  border:1px solid var(--line-2);background:#08090C;border-radius:16px;overflow:hidden;
  box-shadow:0 24px 60px -20px rgba(0,0,0,.6);
}
.pb-dbx-top{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--db);background:#0A0B0F}
.pb-dbx-top .pb-term-dots{display:flex;gap:6px}
.pb-dbx-top .pb-term-dots i{width:8px;height:8px;border-radius:50%;background:var(--line-3)}
.pb-dbx-url{flex:1;text-align:center;font-family:var(--mono);font-size:11px;color:var(--dt2)}
.pb-dbx-body{padding:14px}

/* marquee */
.pb-dbx-marquee{border:1px solid var(--db);border-radius:var(--dr-md);background:linear-gradient(180deg,var(--delev),var(--dc));
  overflow:hidden;white-space:nowrap;margin-bottom:10px}
.pb-dbx-marquee-track{display:inline-flex;animation:tape 34s linear infinite}
.pb-dbx-mq{display:inline-flex;align-items:center;gap:7px;padding:9px 16px;border-right:1px solid var(--db);
  font-family:var(--mono);font-size:11.5px}
.pb-dbx-mq b{font-family:var(--disp);font-weight:700;color:var(--dt0)}
.pb-dbx-mq span{color:var(--dt1)}
.pb-dbx-mq em{font-style:normal;font-weight:700}
.pb-dbx-mq em.up{color:var(--dbull)}.pb-dbx-mq em.dn{color:var(--dbear)}

/* market pulse */
.pb-dbx-pulse{position:relative;display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  border:1px solid var(--db);border-radius:var(--dr-md);background:linear-gradient(180deg,var(--delev),var(--dc));
  padding:10px 14px 10px 17px;margin-bottom:10px;font-family:var(--mono);font-size:11px;overflow:hidden}
.pb-dbx-pulse::before{content:'';position:absolute;inset:0 auto 0 0;width:3px;background:var(--dbull);box-shadow:0 0 12px var(--dbull)}
.pb-dbx-pulse .dot{width:8px;height:8px;border-radius:50%;background:var(--dbull);box-shadow:0 0 8px var(--dbull)}
.pb-dbx-pulse b{color:var(--dbull);font-size:12px}
.pb-dbx-pulse .num{color:var(--dt0);font-weight:700;font-size:13px}
.pb-dbx-pulse .lbl{color:var(--dt2);text-transform:uppercase;letter-spacing:.06em;font-size:9.5px;margin-right:3px}
.pb-dbx-pulse .grp{display:flex;align-items:center;gap:6px}

/* KPI row */
.pb-dbx-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:10px}
.pb-dbx-kpi{border:1px solid var(--db);border-radius:var(--dr-lg);background:linear-gradient(180deg,var(--delev),var(--dc));padding:12px}
.pb-dbx-kpi-top{display:flex;align-items:center;gap:6px;font-size:9px;color:var(--dt2);text-transform:uppercase;letter-spacing:.06em;font-weight:600;margin-bottom:10px}
.pb-dbx-kpi-ic{width:18px;height:18px;border-radius:6px;background:rgba(240,185,11,.12);border:1px solid rgba(240,185,11,.22);
  color:var(--amber);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.pb-dbx-kpi-ic svg{width:10px;height:10px}
.pb-dbx-kpi-val{font-family:var(--disp);font-size:17px;font-weight:700;color:var(--dt0);letter-spacing:-.02em}
.pb-dbx-kpi-val.pos{color:var(--dbull)}

/* main: hot signals + chart */
.pb-dbx-main{display:grid;grid-template-columns:1.3fr 1fr;gap:10px}
.pb-dbx-card{border:1px solid var(--db);border-radius:var(--dr-lg);background:linear-gradient(180deg,var(--delev),var(--dc));overflow:hidden}
.pb-dbx-card-h{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--db);
  font-family:var(--disp);font-weight:600;font-size:12.5px;color:var(--dt0)}
.pb-dbx-sigs{padding:6px}
.pb-dbx-sig{display:grid;grid-template-columns:auto auto 1fr auto;align-items:center;gap:9px;
  padding:8px 9px;border-radius:8px;border-left:2px solid var(--dbull);font-family:var(--mono)}
.pb-dbx-sig-dir{font-size:9px;font-weight:700;padding:2px 7px;border-radius:5px;background:rgba(18,209,142,.15);color:var(--dbull)}
.pb-dbx-sig-sym{font-family:var(--disp);font-weight:700;font-size:12.5px;color:var(--dt0)}
.pb-dbx-sig-tf{font-size:9.5px;color:var(--dt2)}
.pb-dbx-sig-bar{width:44px;height:4px;border-radius:3px;background:rgba(255,255,255,.08);position:relative}
.pb-dbx-sig-bar i{position:absolute;inset:0 auto 0 0;width:var(--w);border-radius:3px;background:linear-gradient(90deg,var(--amber),var(--amber-hi))}
.pb-dbx-tf-row{margin-left:auto;display:flex;gap:3px}
.pb-dbx-tf{font-family:var(--mono);font-size:9.5px;font-weight:600;color:var(--dt2);background:none;border:none;padding:3px 7px;border-radius:5px}
.pb-dbx-tf.active{background:var(--amber);color:#1A1400}
.pb-dbx-chart{padding:10px 12px;height:118px}
.pb-dbx-chart svg{width:100%;height:100%;overflow:visible}
.pb-dbx-line{stroke-dasharray:500;stroke-dashoffset:500}
.pb-preview.in .pb-dbx-line,.pb-dbx-line.drawn{animation:prevdraw 1.5s var(--e) .2s forwards}
@keyframes prevdraw{to{stroke-dashoffset:0}}

@media(max-width:1000px){
  .pb-preview{grid-template-columns:1fr}
}
@media(max-width:680px){
  .pb-dbx-kpis{grid-template-columns:1fr 1fr}
  .pb-dbx-main{grid-template-columns:1fr}
}

/* ── mechanism (pipeline) ──────────────────────────────────────── */
.pb-pipe{display:flex;align-items:stretch;gap:0;position:relative;margin-top:10px}
.pb-pipe-node{flex:1;position:relative;padding:22px 18px;border:1px solid var(--line);background:var(--panel);
  opacity:.4;transition:opacity .5s var(--e),border-color .5s}
.pb-pipe-node.lit{opacity:1;border-color:var(--line-2)}
.pb-pipe-node+.pb-pipe-node{border-left:none}
.pb-pipe-n{font-family:var(--mono);font-size:10.5px;color:var(--amber);letter-spacing:.1em}
.pb-pipe-node h4{margin-top:10px;font-size:15px;font-weight:600}
.pb-pipe-node p{margin-top:7px;font-size:12.5px;color:var(--ink-2);line-height:1.5}
.pb-pipe-arrow{display:flex;align-items:center;padding:0 2px;color:var(--ink-3);opacity:.4;transition:opacity .5s var(--e), color .5s}
.pb-pipe-arrow.lit{opacity:1;color:var(--amber)}
.pb-pipe-arrow svg{width:16px;height:16px}

/* ── ledger (real daily P&L) ────────────────────────────────────── */
.pb-ledger-top{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-end;justify-content:space-between;margin-bottom:26px}
.pb-record-card{border:1px solid rgba(240,185,11,.35);background:linear-gradient(180deg,rgba(240,185,11,.06),transparent);
  padding:18px 22px}
.pb-record-card span{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;color:var(--amber);text-transform:uppercase}
.pb-record-card b{display:block;font-family:var(--mono);font-size:32px;font-weight:700;margin-top:6px;color:var(--ink)}
.pb-record-card em{font-style:normal;font-size:12px;color:var(--ink-2)}
.pb-ledger-note{max-width:360px;font-size:13.5px;color:var(--ink-2);line-height:1.6}

/* ── our story (origin) ─────────────────────────────────────────── */
.pb-story-body{max-width:680px;margin:0;display:flex;flex-direction:column;gap:16px}
.pb-story-body p{font-size:16px;color:var(--ink-1);line-height:1.75}
.pb-story-body b{color:var(--ink);font-weight:600}
.pb-story-tags{max-width:680px;margin:26px 0 0;display:flex;gap:10px;flex-wrap:wrap}
.pb-story-tags span{font-family:var(--mono);font-size:11.5px;color:var(--ink-1);border:1px solid var(--line-2);
  padding:7px 13px;display:inline-flex;align-items:center;gap:7px}
.pb-story-tags span::before{content:'';width:6px;height:6px;background:var(--amber);flex-shrink:0}
.pb-ledger-note b{color:var(--ink)}
.pb-tape-2{border:1px solid var(--line);overflow:hidden;white-space:nowrap;background:var(--panel)}
.pb-tape-2-track{display:inline-flex;animation:tape 46s linear infinite}
.pb-tape-2:hover .pb-tape-2-track{animation-play-state:paused}
.pb-day{display:inline-flex;flex-direction:column;gap:6px;width:104px;padding:14px 12px;border-right:1px solid var(--line);font-family:var(--mono)}
.pb-day span{font-size:10px;color:var(--ink-3)}
.pb-day b{font-size:15px}
.pb-day.pos b{color:var(--pos)}.pb-day.neg b{color:var(--neg)}
.pb-legend{display:flex;gap:20px;margin-top:16px;font-family:var(--mono);font-size:11.5px;color:var(--ink-2)}
.pb-legend span{display:inline-flex;align-items:center;gap:7px}
.pb-legend i{width:8px;height:8px}
.pb-legend .pos-i{background:var(--pos)}.pb-legend .neg-i{background:var(--neg)}

/* ── honesty (compact, supports the ledger's proof) ─────────────── */
/* Three cards since 2026-08-22 — the daily P&L strip that used to sit above
   them was removed (it summed percentages across signals, see landing.html),
   and the reporting-method cards now carry this section on their own. Matches
   .pb-cust-grid's three-up so the two evidence blocks read as one language. */
.pb-honesty{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.pb-hcard{background:var(--panel);padding:28px 26px}
.pb-hcard h3{font-size:17px;font-weight:600;margin-bottom:10px}
.pb-hcard p{font-size:14px;color:var(--ink-1);line-height:1.62}
.pb-hcard b{color:var(--ink)}.pb-hcard .sh{color:#B79CFF;font-family:var(--mono);font-size:.86em}

/* ── non-custodial (objection handling, sits just before the price) ──
   Same bordered-grid language as .pb-honesty and .pb-feat-grid so it reads
   as part of the evidence, not as a bolted-on legal notice. The icon wells
   are green rather than amber on purpose: amber is this page's "look here"
   accent, and these three cards are meant to relieve tension, not raise it. */
.pb-cust-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:var(--line);border:1px solid var(--line)}
.pb-cust-c{background:var(--panel);padding:28px 26px;transition:background .2s}
.pb-cust-c:hover{background:var(--panel-3)}
.pb-cust-ic{display:flex;align-items:center;justify-content:center;width:34px;height:34px;
  margin-bottom:16px;color:var(--pos);
  background:rgba(0,217,126,.08);border:1px solid rgba(0,217,126,.32)}
.pb-cust-ic svg{width:17px;height:17px}
.pb-cust-c h3{font-size:16.5px;font-weight:600;letter-spacing:-.01em;margin-bottom:9px}
.pb-cust-c p{font-size:13.5px;color:var(--ink-1);line-height:1.62}
.pb-cust-note{display:flex;gap:14px;align-items:flex-start;margin-top:20px;
  padding:18px 22px;background:var(--panel-2);border:1px solid var(--line)}
.pb-cust-note svg{width:17px;height:17px;color:var(--amber);flex-shrink:0;margin-top:3px}
.pb-cust-note p{font-size:13.5px;color:var(--ink-1);line-height:1.65}
.pb-cust-note b{color:var(--ink)}
.pb-cust-note a{color:var(--amber)}
.pb-cust-note a:hover{color:var(--amber-hi)}

/* ── features (data-card grid) ──────────────────────────────────── */
.pb-feat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.pb-f{background:var(--panel);padding:26px 24px;grid-column:span 2;transition:background .2s}
.pb-f:hover{background:var(--panel-3)}
.pb-f-lg{grid-row:span 2}
.pb-f-wide{grid-column:span 4}
.pb-f-n{font-family:var(--mono);font-size:11px;color:var(--amber);letter-spacing:.08em}
.pb-f h3{margin-top:12px;font-size:18px;font-weight:600}
.pb-f p{margin-top:9px;font-size:13.5px;color:var(--ink-1);line-height:1.62}
.pb-f-viz{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.pb-f-viz span{font-family:var(--mono);font-size:10.5px;color:var(--ink-1);border:1px solid var(--line-2);padding:6px 11px}
.pb-f-viz span.out{color:#0A0700;background:var(--amber);border-color:transparent;font-weight:700}

/* ── comprehensive feature tour (every menu item, grouped) ──────── */
.pb-tour{margin-top:clamp(48px,6vw,72px)}
.pb-cat{margin-top:40px}
.pb-cat:first-child{margin-top:0}
.pb-cat-head{display:flex;align-items:baseline;gap:12px;margin-bottom:16px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.pb-cat-head b{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--amber)}
.pb-cat-head span{font-size:13px;color:var(--ink-2)}
.pb-cat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.pb-c{background:var(--panel);padding:18px;transition:background .2s}
.pb-c:hover{background:var(--panel-3)}
.pb-c-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.pb-c h4{font-size:14.5px;font-weight:600}
.pb-c-plan{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.06em;padding:2px 7px;border:1px solid var(--line-2);color:var(--ink-2)}
.pb-c-plan.pro{color:var(--amber);border-color:rgba(240,185,11,.35)}
.pb-c-plan.elite{color:#0A0700;background:var(--amber);border-color:transparent}
.pb-c p{margin-top:8px;font-size:12.5px;color:var(--ink-2);line-height:1.55}

/* ── learn-as-you-go strip ──────────────────────────────────────── */
.pb-learn{margin-top:clamp(48px,6vw,72px);display:flex;align-items:center;gap:22px;flex-wrap:wrap;justify-content:space-between;
  border:1px solid var(--line);padding:22px 26px;background:var(--panel)}
.pb-learn-txt{max-width:560px}
.pb-learn-txt b{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--amber);margin-bottom:6px}
.pb-learn-txt p{font-size:14px;color:var(--ink-1);line-height:1.6}
.pb-learn-cta{display:flex;gap:10px;flex-wrap:wrap}

/* ── pricing ────────────────────────────────────────────────────── */
.pb-price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.pb-price{background:var(--panel);padding:28px 24px;display:flex;flex-direction:column}
.pb-price-best{background:var(--panel-3);position:relative}
.pb-price-ribbon{position:absolute;top:0;right:0;font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.08em;
  color:#0A0700;background:var(--amber);padding:5px 12px}
.pb-price-name{font-family:var(--mono);font-size:12px;color:var(--ink-2);text-transform:uppercase;letter-spacing:.08em}
.pb-price-amt{font-family:var(--mono);font-size:38px;font-weight:700;margin-top:12px}
.pb-price-amt small{font-size:14px;color:var(--ink-2);font-weight:500}
.pb-price-note{font-family:var(--mono);font-size:11.5px;color:var(--pos);margin-top:6px}
.pb-price ul{list-style:none;margin:22px 0 24px;display:flex;flex-direction:column;gap:11px;flex:1}
.pb-price li{position:relative;padding-left:22px;font-size:13.5px;color:var(--ink-1)}
.pb-price li::before{content:'+';position:absolute;left:0;color:var(--amber);font-family:var(--mono);font-weight:700}
.pb-price-cta{display:flex;align-items:center;justify-content:center;height:46px;border:1px solid var(--line-2);
  font-family:var(--mono);font-size:13.5px;font-weight:600;transition:.18s}
.pb-price-cta:hover{border-color:var(--amber);color:var(--amber-hi)}
/* Same (0,1,1) vs (0,1,0) trap as .pb-btn — `.pb a{color:inherit}` was making
   the Elite call-to-action near-white on amber. Two classes to outrank it. */
.pb-price-cta-gold,.pb .pb-price-cta-gold{color:#0A0700;background:var(--amber);border-color:transparent}
.pb-price-cta-gold:hover,.pb .pb-price-cta-gold:hover{color:#0A0700;filter:brightness(1.08)}
.pb-price-compare{display:block;text-align:center;margin-top:26px;font-family:var(--mono);font-size:13px;color:var(--amber)}
.pb-price-compare:hover{text-decoration:underline}

/* ── pricing page: duration toggle ─────────────────────────────── */
.pb-dur-row{display:flex;justify-content:center;margin-bottom:32px}
.pb-dur{display:inline-flex;gap:1px;background:var(--line);border:1px solid var(--line);max-width:100%;overflow-x:auto}
.pb-dur-btn{display:inline-flex;align-items:center;gap:6px;height:42px;padding:0 18px;background:var(--panel);
  border:none;color:var(--ink-1);font-family:var(--mono);font-size:12.5px;font-weight:600;cursor:pointer;
  white-space:nowrap;transition:background .18s,color .18s;flex-shrink:0}
.pb-dur-btn i{font-style:normal;color:var(--pos);font-size:10.5px;font-weight:700}
.pb-dur-btn:hover{color:var(--ink)}
.pb-dur-btn.active{background:var(--amber);color:#0A0700}
.pb-dur-btn.active i{color:#0A0700}

/* toggleable multi-month price display inside .pb-price-amt */
.pb-price-amt[data-matrix] span{display:none;flex-direction:column;gap:3px;align-items:flex-start}
.pb-price-amt[data-matrix] span.active{display:flex}
.pb-price-amt s{font-size:14px;color:var(--ink-2);text-decoration:line-through;font-family:var(--mono);font-weight:500}
.pb-price-amt s+b{margin-top:1px}
.pb-price-amt-em{font-style:normal;font-size:10.5px;font-weight:700;color:var(--pos);background:rgba(0,217,126,.12);
  padding:3px 9px;margin-top:4px;width:fit-content}

/* ── pricing page: full comparison table ──────────────────────── */
.pb-compare{margin-top:clamp(48px,6vw,72px)}
.pb-compare-h{text-align:center;font-size:clamp(22px,3vw,28px);font-weight:700;margin:0 0 24px;letter-spacing:-.01em}
.pb-table-scroll{overflow-x:auto;border:1px solid var(--line)}
.pb-table{width:100%;border-collapse:collapse;font-size:12.5px;min-width:560px}
.pb-table th,.pb-table td{padding:12px 16px;text-align:center;border-bottom:1px solid var(--line);font-family:var(--mono)}
.pb-table thead th{background:var(--panel-2);color:var(--ink);font-weight:700;font-size:10.5px;
  text-transform:uppercase;letter-spacing:.06em}
.pb-table tbody th{text-align:left;font-weight:500;color:var(--ink-1);font-family:var(--disp);font-size:13.5px}
.pb-table tbody th[scope=row]{color:var(--ink)}
.pb-table td{color:var(--ink-1)}
.pb-table td.yes{color:var(--pos);font-weight:700}
.pb-table tbody tr:nth-child(even){background:rgba(255,255,255,.015)}
.pb-table tbody tr:last-child th,.pb-table tbody tr:last-child td{border-bottom:none}

/* ── contact ────────────────────────────────────────────────────── */
.pb-contact-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.pb-contact-card{background:var(--panel);padding:26px}
.pb-contact-card b{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--amber)}
.pb-contact-card p{margin-top:8px;font-size:13.5px;color:var(--ink-2);line-height:1.6}
.pb-contact-card a.mail{display:inline-block;margin-top:14px;font-family:var(--mono);font-size:15px;color:var(--ink);border-bottom:1px solid var(--line-2);padding-bottom:2px;transition:color .18s,border-color .18s}
.pb-contact-card a.mail:hover{color:var(--amber);border-color:var(--amber)}
.pb-contact-foot{margin-top:18px;font-size:13px;color:var(--ink-2)}
.pb-contact-foot a{color:var(--amber)}

/* ── final CTA ──────────────────────────────────────────────────── */
.pb-final{text-align:center;border:1px solid var(--line-2);padding:clamp(44px,6vw,76px) var(--pad)}
.pb-final h2{font-size:clamp(26px,4vw,42px);font-weight:700;letter-spacing:-.02em}
.pb-final p{margin-top:12px;color:var(--ink-1);font-size:15.5px}
.pb-final .pb-cta{justify-content:center;margin-top:26px}

/* ── footer ─────────────────────────────────────────────────────── */
.pb-foot{border-top:1px solid var(--line);padding:36px var(--pad) 48px;max-width:var(--wrap);margin-inline:auto}
.pb-foot-top{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:20px}
/* wrap: eight links in one non-wrapping row overflowed the viewport on
   phones and gave the whole page a horizontal scrollbar */
.pb-foot-links{display:flex;flex-wrap:wrap;gap:14px 22px;font-family:var(--mono);font-size:12.5px;color:var(--ink-2)}
.pb-foot-links a:hover{color:var(--amber)}
.pb-social{display:flex;gap:14px;align-items:center}
.pb-social a{display:inline-flex;color:var(--ink-2);transition:color .18s}
.pb-social a:hover{color:var(--amber)}
.pb-social svg{width:18px;height:18px}
.pb-disclaimer{font-size:12px;color:var(--ink-2);line-height:1.6;max-width:720px}
/* Ownership notice sits under the risk disclaimer and is deliberately quieter
   than it — the risk warning is the one a reader must not miss. */
.pb-copyright{margin-top:10px;font-size:11.5px;color:var(--ink-3);line-height:1.65;max-width:720px}

/* ── legal pages (shares this stylesheet + nav/footer) ───────────── */
.lg-wrap{max-width:var(--wrap);margin:0 auto;padding:clamp(56px,8vw,96px) var(--pad) clamp(80px,10vw,120px)}

/* ── FAQ page (shares this stylesheet + nav/footer) ─────────────── */
.fq-main{max-width:760px;margin:0 auto;padding:clamp(56px,8vw,96px) var(--pad) clamp(80px,10vw,120px)}
.fq-main h1{font-size:clamp(28px,4vw,40px);font-weight:700;letter-spacing:-.02em}
.fq-list{margin-top:32px;display:flex;flex-direction:column}
.fq-item{border-top:1px solid var(--line);padding:22px 0}
.fq-item:last-child{border-bottom:1px solid var(--line)}
.fq-item h3{font-size:16.5px;font-weight:600;display:flex;gap:12px}
.fq-item h3 i{font-family:var(--mono);color:var(--amber);font-style:normal}
.fq-item p{margin-top:10px;color:var(--ink-1);font-size:14.5px;line-height:1.65;padding-left:26px}
.fq-cta{margin-top:36px;font-family:var(--mono);font-size:14px;color:var(--amber)}

/* ── a11y focus ─────────────────────────────────────────────────── */
.pb a:focus-visible,.pb button:focus-visible{outline:2px solid var(--amber);outline-offset:3px}

/* ── responsive ─────────────────────────────────────────────────── */
@media(max-width:1000px){
  .pb-honesty{grid-template-columns:1fr}
  .pb-feat-grid{grid-template-columns:repeat(2,1fr)}
  .pb-f,.pb-f-lg,.pb-f-wide{grid-column:span 1;grid-row:auto}
  .pb-pipe{flex-direction:column}
  .pb-pipe-node+.pb-pipe-node{border-left:1px solid var(--line);border-top:none}
  .pb-pipe-arrow{display:none}
  .pb-cat-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .pb-cat-grid{grid-template-columns:1fr}
  .pb-learn{flex-direction:column;align-items:flex-start}
}
@media(max-width:820px){
  .pb-links{display:none}
  .pb-term-grid{grid-template-columns:1fr}
  .pb-term-scan{border-right:none;border-bottom:1px solid var(--line)}
  /* Three text columns stay readable down to ~820px; below that they get
     narrower than the copy needs, so stack rather than squeeze. */
  .pb-cust-grid{grid-template-columns:1fr}
  .pb-cust-note{padding:16px 18px}
}
@media(max-width:680px){
  .pb-price-grid{grid-template-columns:1fr}
  .pb-feat-grid{grid-template-columns:1fr}
  .pb-contact-grid{grid-template-columns:1fr}
  .pb-cta{flex-direction:column}.pb-cta .pb-btn-lg{width:100%;justify-content:center}
  /* Log in stays visible here on purpose — hiding it left returning users on
     a phone with no way back into their account short of typing /login/
     themselves. Shrunk rather than removed so Start free still leads. */
  .pb-auth{display:flex;gap:8px}
  .pb-auth .pb-btn-ghost{height:38px;padding:0 12px;font-size:13px}
  .pb-auth .pb-btn{height:38px;padding:0 16px;font-size:13px}
  .pb-foot-top{flex-direction:column;align-items:flex-start;gap:14px}
  .pb-scan-row{grid-template-columns:1.6fr 1fr 1fr}
  .pb-scan-row span:nth-child(3){display:none}
  .pb-ledger-top{flex-direction:column;align-items:flex-start}
  /* On a phone the page is read one column at a time, so the desktop
     air between sections reads as dead space — tighten the whole
     rhythm and the longest body copy. */
  main>section{padding-top:clamp(48px,11vw,68px);padding-bottom:clamp(48px,11vw,68px)}
  main>section.pb-tight{padding-top:clamp(20px,5vw,32px)}
  .pb-sec-head{margin-bottom:26px}
  .pb-hero-p,.pb-story-body p{font-size:15.5px;line-height:1.62}
  .pb-story-body{gap:13px}
  .pb-cat{margin-top:28px}
  .pb-tour{margin-top:36px}
  .pb-learn{margin-top:32px;padding:18px 20px}
}
@media(max-width:420px){
  .pb-hero h1{font-size:32px}
  .pb-hero-p{font-size:15px}
}
@media(max-width:340px){
  /* Logo + Log in + Start free no longer fit one row below ~340px —
     wrap instead of letting Start free clip off the edge of the screen. */
  .pb-nav{flex-wrap:wrap;row-gap:10px}
  .pb-auth{flex-basis:100%;justify-content:flex-end}
}

/* ── reduced motion ─────────────────────────────────────────────── */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .pb-tape-track,.pb-tape-2-track,.pb-term-live i{animation:none}
  .reveal,.reveal-mask,.stagger>*{opacity:1!important;transform:none!important;clip-path:none!important;transition:none}
  .pb-h1-lines .ln>span{transform:none!important;transition:none}
  .pb-spot{display:none}
  .pb-progress{transition:none}
  .pb-btn::after{display:none}
  .pb-term{transform:none!important}
  *:hover{transform:none!important}
}