/* ============================================================================
   V2 POLISH LAYER (30 Aug) - the finish pass the owner asked for: "fonts,
   colours, widgets... the menu screams novice". Loaded AFTER style.css on
   every v2 page, so it owns the header/nav/drawer look and the shared
   component finish. Numbers wear the mono; words do not.
   ========================================================================== */

:root{
  --ground:#0F0E0C;          /* warm near-black, not flat #000 */
  --panel:#17150F;
  --panel-2:#1D1A12;
  --ink:#FFFFFF;
  --ink-dim:#A59E8C;
  --gold:#D9B64C;
  --gold-hi:#F0DFA6;         /* big numerals + hero accent */
  --line:rgba(217,182,76,.12);
  --line-gold:rgba(217,182,76,.34);
  --win:#57C785;
  --loss:#E15B5B;
}

/* ── HEADER / NAV: composed, not novice ─────────────────────────────────── */
body .site-header{
  background:linear-gradient(180deg,#131109 0%,#0F0E0C 100%);
  border-bottom:1px solid var(--line-gold);
  box-shadow:0 1px 0 rgba(0,0,0,.6);
}
body .site-header .nav-inner,
body .site-header nav{max-width:1160px;margin:0 auto}
body .nav-link{
  font-family:'DM Sans',sans-serif;
  font-size:.85rem;font-weight:600;letter-spacing:.02em;
  color:var(--ink);opacity:.85;padding:10px 13px;
  border-bottom:2px solid transparent;transition:opacity .15s,border-color .15s;
}
body .nav-link:hover{opacity:1;border-bottom-color:var(--line-gold);color:var(--gold-hi)}
body .nav-link.active{opacity:1;border-bottom-color:var(--gold);color:var(--gold)}
body .nav-leagues-caret{opacity:.5;font-size:.7em}
body .nav-link-member{
  border:1px solid var(--gold);color:var(--gold)!important;font-weight:700!important;
  padding:8px 14px!important;margin-left:6px;border-bottom-width:1px!important;
}
body .nav-link-member:hover{background:var(--gold);color:#141005!important}
body .nav-leagues-menu{
  background:var(--panel-2);border:1px solid var(--line-gold);
  box-shadow:0 18px 40px -18px rgba(0,0,0,.85);border-radius:0;
}
body .nav-leagues-menu a{font-family:'DM Sans',sans-serif;font-size:.84rem;color:var(--ink)}
body .nav-leagues-menu a:hover{color:var(--gold);background:rgba(217,182,76,.06)}
body .nav-leagues-head{
  font-family:'DM Sans',sans-serif;font-size:.66rem;font-weight:700;
  letter-spacing:.12em;color:var(--ink-dim);
}
/* drawer (mobile menu) matches the world */
body .nav-drawer,body .drawer,body .site-nav-drawer{background:var(--ground)}
body .drawer-eyebrow{color:var(--gold);font-family:'DM Sans',sans-serif;font-weight:700;letter-spacing:.16em}
body .nav-search input{
  background:var(--panel);border:1px solid var(--line-gold);color:var(--ink);
}

/* ── MEMBER BAR: quieter, finer ─────────────────────────────────────────── */
.fbbm-bar{
  background:#131109!important;
  border-bottom:1px solid var(--line)!important;padding:8px 14px!important;
}
.fbbm-bar a,.fbbm-bar button{border-color:var(--line-gold)!important}

/* ── SHARED V2 COMPONENT FINISH ─────────────────────────────────────────── */
/* section headers: words in DM Sans; the mono ticker look retired */
.v2sec b,.sec b{
  font-family:'DM Sans',sans-serif!important;font-size:.78rem!important;
  font-weight:700!important;letter-spacing:.14em!important;color:var(--gold)!important;
}
.v2lock,.lock{
  font-family:'DM Sans',sans-serif!important;font-weight:700!important;
  font-size:.6rem!important;letter-spacing:.1em!important;border-radius:2px;
}
/* cards get depth: layered panel + inner top rule */
.v2model,.model,.slip{
  background:linear-gradient(180deg,var(--panel-2) 0%,var(--panel) 100%)!important;
  border:1px solid var(--line-gold)!important;
  box-shadow:0 14px 34px -22px rgba(0,0,0,.9);
}
.v2model-k,.model-k{font-family:'DM Sans',sans-serif!important;font-weight:700!important;letter-spacing:.14em!important}
.v2big b,.big b{color:var(--gold-hi)!important}
.tot b{color:var(--gold-hi)!important}
/* buttons: one language */
.v2btn,.btn,.jbtn{
  border-radius:2px;letter-spacing:.02em;
  box-shadow:0 10px 24px -14px rgba(217,182,76,.55);
  transition:transform .12s,box-shadow .12s;
}
.v2btn:hover,.btn:hover,.jbtn:hover{transform:translateY(-1px);box-shadow:0 14px 30px -14px rgba(217,182,76,.7)}

/* ── HOMEPAGE-SPECIFIC POLISH ───────────────────────────────────────────── */
.v2wrap h1 .hx{font-style:italic;color:var(--gold-hi)}
.trust{
  border:0!important;padding:0!important;gap:10px!important;
}
.trust>div{
  flex:1;background:var(--panel);
  border:1px solid var(--line);
  padding:12px 14px;
}
.trust>div b{color:var(--gold-hi)!important;font-size:1.6rem!important}
.trust>div span{font-family:'DM Sans',sans-serif!important;font-weight:600;letter-spacing:.1em}
.doors a{
  background:var(--panel)!important;
  border:1px solid var(--line)!important;
  transition:border-color .15s;
}
.doors a:hover{border-color:var(--line-gold)!important}
.v2leagues a{border-radius:2px;background:var(--panel)}
.v2search input{border-radius:2px 0 0 2px}
.v2search button{border-radius:0 2px 2px 0}

/* ── THE HERO ROTATOR (the slideshow, reborn) ───────────────────────────── */
.v2slider{position:relative;margin-top:18px;overflow:hidden;border:1px solid var(--line-gold);
  background:linear-gradient(180deg,var(--panel-2),var(--panel));
  box-shadow:0 18px 40px -24px rgba(0,0,0,.9)}
.v2slide{display:none;padding:18px 16px 14px}
.v2slide.on{display:block;animation:v2fade .45s ease}
@keyframes v2fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.v2slide .sk{font-family:'DM Sans',sans-serif;font-size:.66rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.v2slide .sh{font-family:'Fraunces',Georgia,serif;font-size:1.45rem;margin:6px 0 4px;color:var(--ink)}
.v2slide .sm{font-size:.84rem;color:var(--ink-dim)}
.v2slide .sm b{color:var(--ink)}
.v2slide .sn{display:flex;align-items:baseline;gap:14px;margin-top:10px}
.v2slide .sn b{font-family:'Fraunces',Georgia,serif;font-size:1.9rem;color:var(--gold-hi)}
.v2slide .sn i{font-style:normal;font-family:'JetBrains Mono',monospace;font-size:.9rem;color:var(--ink)}
.v2slide a.sgo{display:inline-block;margin-top:12px;color:var(--gold);text-decoration:none;
  font-weight:600;font-size:.84rem;border-bottom:1px solid var(--line-gold)}
.v2dots{display:flex;gap:7px;padding:0 16px 14px}
.v2dots button{width:22px;height:3px;border:0;background:var(--line-gold);cursor:pointer;padding:0}
.v2dots button.on{background:var(--gold)}


/* ── HERO v3: the product on stage ──────────────────────────────────────── */
.hero{display:grid;gap:26px;margin-top:8px}
.hero-k{font-family:'DM Sans',sans-serif;font-size:.68rem;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.hero-copy h1{font-family:'Fraunces',Georgia,serif;font-weight:600;
  font-size:2.35rem;line-height:1.12;margin:8px 0 10px;color:var(--ink);text-wrap:balance}
.hero-copy .lede{font-size:.95rem;color:var(--ink-dim);max-width:34em}
.hero-copy .lede b{color:var(--gold-hi);font-weight:600}
.hero-cta{display:flex;align-items:center;gap:14px;margin:16px 0 6px;flex-wrap:wrap}
.hero-ghost{color:var(--ink);text-decoration:none;font-weight:600;font-size:.88rem;
  border:1px solid var(--line-gold);padding:12px 18px;border-radius:2px;transition:border-color .15s,color .15s}
.hero-ghost:hover{border-color:var(--gold);color:var(--gold-hi)}
.hero-copy .v2search{max-width:430px}
.hero-stage{position:relative;min-height:280px;padding:10px 6px 16px}
.stage-card{border:1px solid var(--line-gold);
  background:linear-gradient(165deg,#201c11 0%,var(--panel) 68%);
  box-shadow:0 24px 50px -22px rgba(0,0,0,.95),0 2px 0 rgba(217,182,76,.14) inset;
  padding:16px 16px 14px;display:flex;flex-direction:column;gap:6px}
.stage-b{position:absolute;top:0;right:0;left:34px;transform:rotate(1.6deg);opacity:.92}
.stage-a{position:relative;margin-top:56px;max-width:92%;transform:rotate(-1.2deg)}
.sc-k{font-family:'DM Sans',sans-serif;font-size:.62rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.sc-k-desk{color:#7FB2E5}
.sc-h{font-family:'Fraunces',Georgia,serif;font-size:1.5rem;color:var(--ink);line-height:1.15}
.sc-h-sm{font-size:1.05rem;line-height:1.35}
.sc-m{font-family:'JetBrains Mono',monospace;font-size:.66rem;color:var(--ink-dim)}
.sc-n{display:flex;align-items:baseline;gap:12px;margin-top:2px}
.sc-n b{font-family:'Fraunces',Georgia,serif;font-size:1.7rem;color:var(--gold-hi)}
.sc-n i{font-style:normal;font-family:'JetBrains Mono',monospace;font-size:.85rem;color:var(--ink)}
.sc-leg{font-weight:700;font-size:.9rem;margin-top:6px;border-top:1px solid var(--line);padding-top:10px}
.sc-pat{font-size:.8rem;color:var(--ink-dim)}
.sc-src{font-family:'JetBrains Mono',monospace;font-size:.56rem;color:var(--ink-dim);letter-spacing:.04em}
.sc-go{margin-top:8px;color:var(--gold);text-decoration:none;font-weight:600;font-size:.8rem}
.sc-go:hover{color:var(--gold-hi)}
@media (min-width:1020px){
  .hero{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:center;column-gap:60px}
  .hero-copy h1{font-size:3.1rem}
  .hero-stage{min-height:340px}
}


/* ── HERO: TODAY'S BUILD, centred luxury (the owner's card as the door) ── */
.hero-c{display:block;text-align:center;max-width:640px;margin:10px auto 0}
.hero-c h1{font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:2.5rem;
  line-height:1.1;margin:10px 0 10px;color:var(--ink)}
.hero-c .lede{margin:0 auto;max-width:32em}
.hero-c .hero-cta{justify-content:center;margin-top:18px}
.hero-c .v2search{max-width:430px;margin:16px auto 0}
/* centred section headers, site-luxury */
.v2wrap .v2sec{justify-content:center;gap:10px;margin:34px 0 12px;position:relative}
.v2wrap .v2sec::before,.v2wrap .v2sec::after{content:"";flex:1;height:1px;background:var(--line);max-width:80px}
.v2wrap .v2sec b{font-size:.72rem!important}

.build-card{margin:26px auto 4px;max-width:520px;text-align:left;
  background:#111009;border:1px solid var(--line-gold);
  box-shadow:0 30px 60px -30px rgba(0,0,0,.95);padding:18px 18px 12px}
.bc-top{display:flex;justify-content:space-between;align-items:flex-start}
.bc-eyebrow{font-family:'JetBrains Mono',monospace;font-size:.56rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink-dim)}
.bc-mark{font-family:'Fraunces',Georgia,serif;font-size:.85rem;color:var(--gold);
  border:1px solid var(--line-gold);padding:4px 8px;letter-spacing:.06em}
.bc-title{display:block;font-family:'Fraunces',Georgia,serif;font-size:1.7rem;color:var(--ink);margin-top:2px}
.bc-title em{font-style:italic;color:var(--gold)}
.bc-body{display:flex;gap:18px;margin-top:14px;align-items:flex-start}
.bc-left{flex:0 0 auto;display:flex;flex-direction:column;gap:2px}
.bc-stake{font-family:'JetBrains Mono',monospace;font-size:.56rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-dim);order:-1}
.bc-ret{font-family:'Fraunces',Georgia,serif;font-size:2.6rem;line-height:1;color:var(--gold-hi)}
.bc-sub{font-family:'JetBrains Mono',monospace;font-size:.62rem;color:var(--ink-dim);margin-top:4px}
.bc-legs{flex:1;min-width:0;border-left:1px solid var(--line);padding-left:16px;
  display:flex;flex-direction:column;gap:9px}
.bc-leg{display:flex;align-items:center;gap:8px}
.bc-pct{font-family:'JetBrains Mono',monospace;font-size:.62rem;color:var(--gold);
  border:1px solid var(--line-gold);padding:1px 4px;flex:none}
.bc-sel{flex:1;min-width:0;font-size:.74rem;color:var(--ink);white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.bc-odds{font-family:'JetBrains Mono',monospace;font-size:.72rem;color:var(--ink)}
.bc-foot{display:block;margin-top:14px;padding-top:10px;border-top:1px solid var(--line);
  font-family:'JetBrains Mono',monospace;font-size:.54rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-dim);text-align:center}
@media (max-width:520px){
  .bc-body{flex-direction:column;gap:12px}
  .bc-legs{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:12px}
  .hero-c h1{font-size:2.1rem}
}
@media (min-width:1020px){.hero-c h1{font-size:3rem}}


/* hero CTAs: own names, no style.css bleed (the old .hero-cta was a gold slab) */
.hcta{display:flex;align-items:center;justify-content:center;gap:14px;margin:20px 0 4px;flex-wrap:wrap;background:none}
.hcta-main{display:inline-block;background:var(--gold);color:#141005;font-weight:700;
  font-size:.92rem;padding:13px 24px;text-decoration:none;border-radius:2px;
  box-shadow:0 10px 24px -14px rgba(217,182,76,.55)}
.hcta-main:hover{background:var(--gold-hi);color:#141005}
.hcta-ghost{display:inline-block;color:var(--ink);text-decoration:none;font-weight:600;
  font-size:.88rem;border:1px solid var(--line-gold);padding:12px 18px;border-radius:2px;background:none}
.hcta-ghost:hover{border-color:var(--gold);color:var(--gold-hi)}


/* v2.2: style picker, hero receipts */
.tier-tabs{display:flex;justify-content:center;gap:0;margin:22px auto 0;max-width:520px;border:1px solid var(--line-gold)}
.tier-tabs button{flex:1;background:none;border:0;color:var(--ink-dim);font-family:'DM Sans',sans-serif;
  font-weight:700;font-size:.78rem;letter-spacing:.06em;padding:11px 0;cursor:pointer}
.tier-tabs button.on{background:var(--gold);color:#141005}
.tier-tabs + .build-card, .tier-tabs ~ .build-card{margin-top:10px}
.hero-receipts{max-width:520px;margin:14px auto 0;border:1px solid var(--line);background:var(--panel)}
.hr-row{display:flex;align-items:center;gap:10px;padding:9px 12px;border-bottom:1px solid var(--line)}
.hr-row:last-child{border-bottom:0}
.hr-chip{font-family:'JetBrains Mono',monospace;font-size:.56rem;font-weight:700;letter-spacing:.08em;
  padding:2px 7px;flex:none}
.hr-chip.w{background:rgba(87,199,133,.15);color:var(--win);border:1px solid rgba(87,199,133,.4)}
.hr-chip.l{background:rgba(225,91,91,.12);color:var(--loss);border:1px solid rgba(225,91,91,.4)}
.hr-t{font-size:.76rem;color:var(--ink-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left}


/* phones: the join pill goes compact so chip/pill/chat can never collide */
.jb-s{display:none}
@media (max-width:520px){
  .jb-l{display:none}
  .jb-s{display:inline}
  .joinbar,.v2joinbar{padding:10px 14px!important;max-width:150px!important}
  .joinbar em,.v2joinbar em{display:none!important}
}


/* ── THE RESTRAINT PASS: quiet homepage ─────────────────────────────────── */
/* section headers: small caps ink, no gold, no rules, no chips */
.quiet .v2sec{justify-content:center;margin:40px 0 10px}
.quiet .v2sec::before,.quiet .v2sec::after{display:none}
.quiet .v2sec b{color:var(--ink-dim)!important;font-size:.68rem!important;letter-spacing:.22em!important}
/* the one gold moment is the Build card; everything else calms down */
.quiet .qline{margin:14px auto 0;text-align:center;font-size:.8rem;color:var(--ink-dim)}
.quiet .qline b{color:var(--ink);font-weight:600}
.quiet .qline a{color:var(--ink-dim);text-decoration:underline;text-underline-offset:3px}
.quiet .qline a:hover{color:var(--gold)}
.quiet .qreceipts{margin:16px auto 0;text-align:center;font-size:.74rem;color:var(--ink-dim);max-width:34em}
.quiet .qreceipts i{font-style:normal;font-weight:700;font-size:.64rem;margin-right:4px}
.quiet .qreceipts i.w{color:var(--win)}
.quiet .qreceipts i.l{color:var(--loss)}
.quiet .qreceipts .qs{margin:0 7px;opacity:.5}
.quiet .qlinks{margin:12px 0 0;text-align:center;font-size:.82rem}
.quiet .qlinks a{color:var(--ink-dim);text-decoration:none;border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:1px}
.quiet .qlinks a:hover{color:var(--ink);border-color:var(--ink)}
.quiet .qlinks .qs{margin:0 10px;opacity:.4}
/* doors: typographic list, hairline separators, no panels */
.quiet .qdoors a{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;column-gap:12px;align-items:baseline;padding:15px 2px;border-bottom:1px solid rgba(255,255,255,.08);text-decoration:none;color:var(--ink)}
.quiet .qdoors b{grid-column:1;grid-row:1}
.quiet .qdoors span{grid-column:1;grid-row:2;margin-top:2px}
.quiet .qdoors em{grid-column:2;grid-row:1 / span 2;align-self:center}
.quiet .qdoors a:first-child{border-top:1px solid rgba(255,255,255,.08)}
.quiet .qdoors b{font-family:'Fraunces',Georgia,serif;font-size:1.12rem;font-weight:600}
.quiet .qdoors span{color:var(--ink-dim);font-size:.8rem}
.quiet .qdoors em{margin-left:auto;font-style:normal;color:var(--ink-dim);transition:transform .15s,color .15s}
.quiet .qdoors a:hover em{color:var(--gold)}
/* search: quiet inline, no gold slab */
.quiet .v2search input{background:none;border:0;border-bottom:1px solid rgba(255,255,255,.2);padding:10px 2px}
.quiet .v2search input:focus{outline:none;border-bottom-color:var(--gold)}
.quiet .v2search button{background:none;color:var(--ink-dim);border:0;border-bottom:1px solid rgba(255,255,255,.2);font-weight:600}
.quiet .v2search button:hover{color:var(--gold)}
/* tier tabs: quiet underline tabs, not a gold block */
.quiet .tier-tabs{border:0;gap:6px;max-width:none;justify-content:center}
.quiet .tier-tabs button{flex:0 0 auto;color:var(--ink-dim);border:1px solid transparent;border-radius:999px;padding:7px 14px;letter-spacing:.1em;text-transform:uppercase;font-size:.66rem}
.quiet .tier-tabs button.on{background:none;color:var(--ivory);border-color:var(--gold)}
/* leagues: plain text links */
.quiet .v2leagues{justify-content:center}
.quiet .v2leagues a{background:none;border:0;color:var(--ink-dim);font-family:'DM Sans',sans-serif;font-size:.78rem;padding:4px 8px}
.quiet .v2leagues a:hover{color:var(--gold)}
/* the membership block keeps its border (it IS a locked thing) but loses shine */
.quiet .v2join{box-shadow:none}
/* rotator + old slider retire on the quiet home (the Build card is the hero) */
.quiet .v2slider{display:none}


/* == TYPE SOLIDITY (31 Aug, owner: "some text looks thin like the e's") ==
   Bodoni's variable optical axis picks hairline cuts at display sizes; pin a
   text-ish optical size so thin strokes hold on dark screens, and carry more
   weight everywhere the serif appears. */
.v2wrap h1,.hero-copy h1,.bc-title,.bc-ret,.v2model-sel,.v2big b,.v2vs b,
.quiet .qdoors b,.sc-h,.sc-n b{
  font-optical-sizing:none;font-variation-settings:"opsz" 28,"SOFT" 30,"WONK" 0;font-weight:700;
}
.v2wrap .hx{font-weight:700}
.v2wrap .lede{font-weight:500;color:#B3AC9B}
.quiet .qreceipts{font-size:.78rem;font-weight:500}
.quiet .qline{font-size:.82rem}

/* == THE TWO LANES: build it for me / I'll pick myself =================== */
.mode-switch{display:flex;gap:10px;justify-content:center;margin:22px 0 4px}
.mode-switch button{
  flex:0 1 220px;background:none;border:1px solid rgba(255,255,255,.16);
  padding:12px 14px;cursor:pointer;text-align:center;transition:border-color .15s;
}
.mode-switch button b{display:block;font-family:'DM Sans',sans-serif;font-weight:600;font-size:.9rem;color:var(--ink-dim)}
.mode-switch button span{display:block;margin-top:3px;font-size:.66rem;color:var(--ink-dim);opacity:.7}
.mode-switch button.on{border-color:var(--line-gold)}
.mode-switch button.on b{color:var(--gold-hi)}
.mode-switch button.on span{opacity:1}
.mode-switch button:hover{border-color:var(--line-gold)}
.quiet .pick-rows a{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;column-gap:12px;align-items:baseline;padding:13px 2px;border-bottom:1px solid rgba(255,255,255,.08);text-decoration:none;color:var(--ink)}
.quiet .pick-rows a:first-child{border-top:1px solid rgba(255,255,255,.08)}
.quiet .pick-rows b{grid-column:1;grid-row:1;font-family:'DM Sans',sans-serif;font-size:.92rem;font-weight:600}
.quiet .pick-rows span{grid-column:1;grid-row:2;margin-top:2px;color:var(--ink-dim);font-size:.78rem}
.quiet .pick-rows em{grid-column:2;grid-row:1 / span 2;align-self:center;font-style:normal;font-family:'JetBrains Mono',monospace;color:var(--gold);font-size:.9rem}

/* == THE DRAWER, REBUILT (31 Aug): one material, serif doors, hairline
   rules, a single gold bar at the foot. ================================== */
@media (max-width: 768px){
  body .main-nav{background:var(--ground);border-left:1px solid var(--line-gold)}
  body .drawer-head{
    background:var(--ground);border-bottom:1px solid var(--line-gold);
    padding:18px 20px;
  }
  body .drawer-head-title{
    font-family:'Fraunces',Georgia,serif;font-optical-sizing:none;
    font-variation-settings:"opsz" 28,"SOFT" 30,"WONK" 0;font-weight:700;font-size:1.05rem;
    letter-spacing:.06em;color:var(--ink);text-transform:none;
  }
  body .drawer-close{color:var(--ink-dim);font-size:1.05rem;padding:4px 8px;border:0;background:none}
  body .drawer-scroll{padding:6px 20px 18px}
  body .nav-search--drawer{margin:12px 0 6px}
  body .nav-search--drawer .nav-search-input{
    background:none;border:0;border-bottom:1px solid rgba(255,255,255,.18);
    border-radius:0;color:var(--ink);font-size:.92rem;padding:10px 2px;width:100%;
  }
  body .nav-search--drawer .nav-search-input:focus{outline:none;border-bottom-color:var(--gold)}
  body .drawer-social{display:flex;gap:16px;margin:10px 0 4px;border:0;background:none;padding:0}
  body .drawer-social a{
    background:none;border:0;padding:2px 0;color:var(--ink-dim);
    font-family:'DM Sans',sans-serif;font-size:.74rem;text-decoration:none;
  }
  body .drawer-social a:hover{color:var(--gold)}
  body .drawer-eyebrow{
    display:block;margin:22px 0 4px;color:var(--ink-dim);
    font-size:.6rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  }
  body .main-nav .nav-primary,body .main-nav .nav-secondary{display:block;border:0;background:none}
  body .main-nav .nav-link,body .main-nav .nav-leagues-toggle{
    display:flex;align-items:center;justify-content:space-between;width:100%;
    font-family:'Fraunces',Georgia,serif;font-optical-sizing:none;
    font-variation-settings:"opsz" 28,"SOFT" 30,"WONK" 0;font-weight:600;font-size:1.28rem;
    letter-spacing:.01em;color:var(--ink);opacity:1;background:none;
    padding:13px 2px;border:0;border-bottom:1px solid rgba(255,255,255,.08);
    text-transform:none;text-align:left;
  }
  body .main-nav .nav-link.active{color:var(--gold)}
  body .main-nav .nav-link-member{
    color:var(--gold)!important;border:0!important;
    border-bottom:1px solid rgba(255,255,255,.08)!important;
    margin:0;padding:13px 2px!important;background:none!important;
  }
  body .main-nav .nav-link-member:hover{background:none!important;color:var(--gold-hi)!important}
  body .nav-leagues-caret{opacity:.45;font-size:.6em}
  body .main-nav .nav-leagues-menu{
    position:static;background:none;border:0;box-shadow:none;padding:2px 0 10px;
  }
  body .main-nav .nav-leagues-menu a{
    font-family:'DM Sans',sans-serif;font-size:.9rem;color:var(--ink-dim);
    padding:8px 2px;border:0;
  }
  body .main-nav .nav-leagues-menu a:hover{color:var(--gold);background:none}
  body .main-nav .nav-leagues-head{
    color:var(--ink-dim);opacity:.75;font-size:.6rem;letter-spacing:.2em;
    text-transform:uppercase;margin-top:8px;
  }
  body .drawer-cta{
    background:var(--ground);border-top:1px solid var(--line-gold);
    padding:14px 20px;gap:10px;
  }
  body .drawer-cta-founders{
    flex:1;background:var(--gold);color:#141005;border:0;border-radius:0;
    font-family:'DM Sans',sans-serif;font-weight:700;font-size:.88rem;
    text-align:center;padding:13px 10px;text-decoration:none;
  }
  body .drawer-cta-build{
    flex:1;background:none;color:var(--ink);border:1px solid rgba(255,255,255,.22);
    border-radius:0;font-family:'DM Sans',sans-serif;font-weight:600;font-size:.88rem;
    text-align:center;padding:13px 10px;text-decoration:none;
  }
}

/* drawer round 2: alignment + the search loses its box */
@media (max-width: 768px){
  body .main-nav .nav-primary,body .main-nav .nav-secondary{padding:0;margin:0}
  body .main-nav .nav-link-member{font-size:1.28rem!important;font-family:'Fraunces',Georgia,serif!important;font-optical-sizing:none;font-variation-settings:"opsz" 28,"SOFT" 30,"WONK" 0;font-weight:600!important}
  body .nav-search--drawer{background:none!important;border:0!important;padding:0!important}
  body .drawer-eyebrow{text-align:left}
  body .drawer-social{justify-content:flex-start}
}
/* the trust line never breaks mid-phrase */
.quiet .qline a,.quiet .qline b{white-space:nowrap}

/* round 3: outgun the legacy specificity */
/* pick rows: quiet list, never the boxed doors, never the hero's centring */
.quiet .hero .pick-rows a{
  border:0!important;border-bottom:1px solid rgba(255,255,255,.08)!important;
  background:none!important;margin:0!important;padding:13px 2px!important;
  text-align:left;display:grid!important;
}
.quiet .hero .pick-rows a:first-child{border-top:1px solid rgba(255,255,255,.08)!important}
.quiet .hero .pick-rows b{font-family:'DM Sans',sans-serif!important;font-size:.92rem!important;color:var(--ink)!important}
.quiet .hero .pick-rows em{color:var(--gold)!important}
/* drawer doors: the serif wins everywhere, same inset for every row */
@media (max-width: 768px){
  body .site-header .main-nav .nav-link,
  body .site-header .main-nav .nav-leagues-toggle{
    font-family:'Fraunces',Georgia,serif!important;
    font-optical-sizing:none;font-variation-settings:"opsz" 28,"SOFT" 30,"WONK" 0;
    font-weight:600!important;font-size:1.28rem!important;
    padding:13px 2px!important;margin:0!important;
    color:var(--ink)!important;letter-spacing:.01em!important;
    text-transform:none!important;
  }
  body .site-header .main-nav .nav-link.active,
  body .site-header .main-nav .nav-link-member{color:var(--gold)!important}
}


/* == V3: the shop floor ================================================== */
.quiet .qticker{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 14px;margin:2px 0 16px;font-size:.72rem;color:var(--ink-dim)}
.quiet .qticker-k{font-weight:700;letter-spacing:.18em;text-transform:uppercase;font-size:.6rem;align-self:center;color:var(--ink-dim);opacity:.8}
.quiet .qticker i{font-style:normal;font-weight:700;font-size:.62rem;margin-right:4px}
.quiet .qticker i.w{color:var(--win)}
.quiet .qticker i.l{color:var(--loss)}
.deskprev{margin:4px 14px 12px;border:1px solid var(--line);padding:12px 14px}
.deskprev-k{font-family:'DM Sans',sans-serif;font-size:.6rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.deskprev-h{margin:6px 0 4px;font-size:.88rem;color:var(--ink);font-weight:600}
.deskprev-blur{font-size:.82rem;color:var(--ink);filter:blur(5px);user-select:none;pointer-events:none}
.deskprev-lock{display:block;margin-top:8px;font-size:.7rem;color:var(--ink-dim)}
#lane-pick .byob-section{background:none;border:0;padding:0;margin:6px 0 0}
#lane-pick .byob-header h2,#lane-pick .byob-header-badge{display:none}
#lane-pick .byob-subtitle{font-size:.76rem;color:var(--ink-dim)}


/* == D polish round (1 Sep): rail fade, quiet chat, drawer fit ========== */
/* the previews rail hints its overflow instead of clipping dead */
.pvs{-webkit-mask-image:linear-gradient(90deg,#000 0,#000 88%,transparent);
     mask-image:linear-gradient(90deg,#000 0,#000 88%,transparent)}
/* the chat bubble joins the quiet brand: hairline, not a gold slab */
body .cw-fab{background:#121212!important;border:1px solid rgba(213,176,84,.4)!important;
  border-radius:0!important;box-shadow:none!important}
body .cw-fab svg{stroke:#D5B054!important}
body .cw-fab:hover{transform:none!important;box-shadow:none!important;border-color:#D5B054!important}
/* drawer join bar: one line always */
@media (max-width:768px){
  body .drawer-cta-founders{font-size:.8rem;white-space:nowrap;padding:13px 6px}
  body .drawer-cta-build{font-size:.8rem;white-space:nowrap;padding:13px 6px}
}


/* == site-wide hero pass (1 Sep) ========================================= */
/* the hub's ALWAYS FREE gold chips become quiet small caps */
body .sec .lock.open{background:none!important;border:0!important;color:var(--ddim,#A8A8A8)!important;
  font-size:.6rem!important;letter-spacing:.18em!important;padding:0!important}

/* == spring motion, user actions only (kinetics-inspired) ================ */
@media (prefers-reduced-motion: no-preference){
  /* the slip chip pops with weight when a leg lands */
  @keyframes fbbpop{0%{transform:scale(1)}35%{transform:scale(1.12)}65%{transform:scale(.97)}100%{transform:scale(1)}}
  #fbb-slip-chip.fbb-pop{animation:fbbpop .38s cubic-bezier(.34,1.56,.64,1)}
  /* the receipt springs in on a tier switch */
  @keyframes fbbspring{0%{opacity:.4;transform:translateY(7px) scale(.985)}100%{opacity:1;transform:none}}
  .rcpt.fbb-in{animation:fbbspring .32s cubic-bezier(.22,1.4,.36,1)}
  /* the return figure settles when the stake changes */
  .dret.fbb-pop{animation:fbbpop .34s cubic-bezier(.34,1.56,.64,1)}
}


/* == THE SOFTENING PASS (1 Sep, owner: no yellow slabs, no hard squares) == */
/* new hero grammar: left, like the previews header the owner likes */
.dhero{text-align:left!important;padding:30px 0 24px!important}
.crest-row{display:flex!important;align-items:center;gap:9px}
.hero-crest{flex:0 0 auto;border-radius:3px}
.dhero h1{font-size:1.55rem!important;margin-top:14px!important;text-wrap:balance}
.hstat{display:flex;align-items:center;gap:16px;margin-top:16px}
.hpct{font-weight:800;font-size:2.7rem;line-height:1;
  background:linear-gradient(160deg,#F2E3AE 20%,#D5B054 55%,#9B7B2E 90%);-webkit-background-clip:text;background-clip:text;color:transparent}
.hstat-t{font-size:.82rem;color:var(--ddim);line-height:1.45}
.hstat-t b{color:var(--ivory)}
.dhero .huge{display:none}
.dhero .what{margin-left:0!important;max-width:32em}
.dhero p{text-align:left}
/* soft geometry everywhere the D surfaces draw a box */
.whisper{border-radius:9px;flex-wrap:wrap;max-width:100%}
.whisper .k2{white-space:nowrap}
.drow .dadd{border-radius:50%!important}
.stakes button{border-radius:8px}
.rcpt{border-radius:12px;outline-offset:6px}
.rcpt .tear{display:none}
.pv{border-radius:10px}
.ddoors{border-radius:12px;overflow:hidden}
.dcall{border-radius:0}
.deskprev{border-radius:10px}
/* the ONE gold cta: soft radius, deep foil, letterspaced - not a slab */
.dcta,.join,.v2btn{border-radius:9px!important;
  background:linear-gradient(170deg,#E3C368,#C79F3E)!important;
  letter-spacing:.02em}
/* member bar: outlined states, no solid slab */
.fbbm-bar a,.fbbm-bar button,.fbbm-bar span{border-radius:7px!important}
.fbbm-bar [style*="background"]{background:transparent !important;color:#E3C368!important}
/* the SLIP: ON active chip - outline + tint, not solid gold */
body .fbbm-bar .on,body .fbbm-bar [data-on="true"]{background:transparent !important;color:#E3C368!important;border:1px solid rgba(213,176,84,.5)!important}
/* chat fab + drawer ctas soften */
body .cw-fab{border-radius:10px!important}
@media (max-width:768px){
  body .drawer-cta-founders,body .drawer-cta-build{border-radius:8px}
  body .drawer-cta-founders{background:linear-gradient(170deg,#E3C368,#C79F3E)}
  /* FBB Pro's new home at the top of the drawer */
  body .site-header .main-nav .nav-link-pro-top{
    color:var(--gold)!important;display:flex;justify-content:space-between;align-items:baseline;
    margin-top:14px!important;border:1px solid rgba(213,176,84,.35)!important;border-radius:10px;
    padding:13px 14px!important;
  }
  body .site-header .main-nav .nav-link-pro-top .pro-sub{
    font-family:'DM Sans',sans-serif;font-size:.66rem;letter-spacing:.14em;
    text-transform:uppercase;color:var(--ddim,#A8A8A8);
  }
}
/* byob + search buttons pick up the radius too */
#lane-pick .byob-section button,#dboard-full button{border-radius:8px}
.srch button{border-radius:0}

/* == landdding pass (1 Sep): product enters the first viewport ========== */
@media (max-width:1099px){
  .dhero{padding:20px 0 16px!important}
  .dhero h1{font-size:1.42rem!important;margin-top:10px!important}
  .hstat{margin-top:12px}
  .hpct{font-size:2.3rem}
  .dhero .what{margin-top:10px!important;font-size:.82rem!important}
  .whisper{margin-top:12px;padding:7px 13px}
  .bhead{margin-top:20px!important}
}


/* == THE COMPACT PASS (1 Sep evening) ==================================== */
/* the Pro strip: a proper card, three fixed zones, wraps clean */
.prostrip{display:grid;grid-template-columns:auto 1fr auto;align-items:center;column-gap:12px;
  margin-top:12px;padding:11px 14px;border:1px solid rgba(213,176,84,.35);border-radius:10px;
  text-decoration:none;color:var(--ddim);font-size:.78rem;text-align:left}
.prostrip .ps-k{font-size:.6rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--dgold);white-space:nowrap}
.prostrip .ps-t{line-height:1.4}
.prostrip .ps-t b{color:var(--ivory)}
.prostrip .ps-p{font-family:'JetBrains Mono',monospace;font-size:.68rem;color:var(--dgold);white-space:nowrap}
.prostrip:hover{border-color:var(--dgold)}
/* board rows: guaranteed one-line sub */
.drow .s{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* widget finish rides site-wide: every panel wears the same soft geometry */
body .v2model,body .model,body .sc,body .v2join,body .deskprev,
body .byob-pick-card,body .fb-empty,body .season-gap-band,
body .doors a,body .jlist,body .jbox,body .memb{border-radius:12px}
body .byob-slip{border-radius:12px}
body .nav-leagues-menu{border-radius:10px}
body .v2search input,body .byob-league-select{border-radius:8px}
body .v2search button,body button.v2btn{border-radius:8px}


/* == THE MARK PASS (1 Sep late) ========================================== */
/* the gradient retires: one flat, confident gold */
.dcta,.join,.v2btn{background:#D5B054!important}
@media (max-width:768px){ body .drawer-cta-founders{background:#D5B054} }
/* the tease: first leg in the clear, the second melts into the blur */
.ddesk .leg-open{margin:14px auto 0;max-width:26em;font-size:.9rem;color:var(--ivory);line-height:1.5}
.ddesk .blur{margin-top:8px;
  -webkit-mask-image:linear-gradient(180deg,#000 0,transparent 92%);
  mask-image:linear-gradient(180deg,#000 0,transparent 92%)}
/* the lock row: a symbol, not a label */
.lockrow{display:inline-flex;align-items:center;gap:8px;margin-top:12px;position:relative;
  font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ddim)}
.lockrow .lockglyph{flex:0 0 auto}
.lockrow .fbb-i{width:16px;height:16px;border-radius:50%;border:1px solid rgba(152,145,127,.5);
  background:none;color:#A8A8A8;font-size:.56rem;padding:0;line-height:1;cursor:pointer;font-style:italic}
.lockrow .fbb-tip{display:none;position:absolute;left:0;right:0;top:100%;margin-top:6px;z-index:70;
  background:#17150F;border:1px solid rgba(213,176,84,.4);border-radius:9px;padding:10px 12px;
  font-size:.74rem;letter-spacing:0;text-transform:none;color:var(--ivory);line-height:1.45;text-align:left}
.lockrow .fbb-tip.on{display:block}
/* drawer: tighter, quieter search */
@media (max-width:768px){
  body .nav-search--drawer .nav-search-input{border:0!important;border-bottom:1px solid rgba(255,255,255,.18)!important;border-radius:0!important;background:none!important}
  body .main-nav .nav-link,body .main-nav .nav-leagues-toggle{padding:11px 2px!important;font-size:1.2rem!important}
  body .drawer-eyebrow{margin:16px 0 2px}
  body .drawer-social{margin:8px 0 2px}
}


/* == THE UNIFICATION (2 Sep): the homepage theme IS the site theme ======= */
/* Every v2 page declares the same token names in its inline styles; this
   double-:root outranks them all, so one palette rules the whole site. */
:root:root{
  --ground:#0A0A0A;--panel:#121212;--panel-2:#17150F;
  --ink:#FFFFFF;--ink-dim:#A8A8A8;
  --gold:#D5B054;--gold-hi:#F2E3AE;
  --line:rgba(255,255,255,.12);--line-gold:rgba(213,176,84,.4);
}
body{background:#0A0A0A}
/* the home board-row grammar available to every page */
.drow-any{display:grid;grid-template-columns:1fr auto;column-gap:12px;align-items:center;
  padding:11px 0;border-bottom:1px solid var(--line)}
/* previews: the tag chip retires; a sly lock sits in the meta line */
.pvrow .dtag{display:inline;margin:0 0 0 7px;border:0;padding:0;
  font-family:'JetBrains Mono',monospace;font-size:.56rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
/* the bar: mark rides the FBB Pro chip */
.fbbm-bar .fbbm-pro{display:inline-flex;align-items:center;gap:7px}
.fbbm-bar .fbbm-pro .fbbm-mark{width:15px;height:15px;font-size:.52rem}
/* how-it-works: three quiet steps */
.hiw{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);
  border-radius:12px;overflow:hidden;margin:34px 0 0}
.hiw div{background:var(--ground);padding:14px 12px}
.hiw b{font-family:'Fraunces',Georgia,serif;font-optical-sizing:none;font-variation-settings:"opsz" 28,"SOFT" 30,"WONK" 0;
  font-weight:700;font-size:1rem;display:block;color:var(--ink)}
.hiw span{color:var(--ink-dim);font-size:.72rem;line-height:1.4;display:block;margin-top:3px}
@media (max-width:520px){.hiw{grid-template-columns:1fr}}
/* newsletter: one line, underline input, flat gold button */
.nlrow{display:flex;gap:10px;align-items:flex-end;margin:30px 0 0}
.nlrow .nl-t{flex:1}
.nlrow .nl-t b{display:block;font-family:'Fraunces',Georgia,serif;font-optical-sizing:none;font-variation-settings:"opsz" 28,"SOFT" 30,"WONK" 0;font-weight:700;font-size:1.05rem;color:var(--ink)}
.nlrow .nl-t span{color:var(--ink-dim);font-size:.74rem}
.nlrow input{flex:1.2;background:none;border:0;border-bottom:1px solid var(--line);color:var(--ink);
  font-family:'DM Sans',sans-serif;font-size:.88rem;padding:9px 2px;min-width:0}
.nlrow input:focus{outline:none;border-bottom-color:var(--gold)}
.nlrow button{background:#D5B054;color:#151105;border:0;border-radius:8px;font-weight:700;
  font-size:.82rem;padding:11px 16px;cursor:pointer;font-family:'DM Sans',sans-serif;white-space:nowrap}
@media (max-width:520px){.nlrow{flex-wrap:wrap}.nlrow .nl-t{flex:1 1 100%}}


/* == THE FINISH SWEEP (2 Sep): the last quarter ========================== */
/* selection, tap, scroll - the invisible finishes people feel */
::selection{background:rgba(213,176,84,.32);color:#FFFFFF}
html{-webkit-tap-highlight-color:transparent;scrollbar-color:#2a261c #0A0A0A}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-thumb{background:#2a261c;border-radius:5px}
*::-webkit-scrollbar-track{background:#0A0A0A}
/* every number column sits still */
.mono,.drow .o,.dleg b,.rcpt .rsub,.stakes button,.tick span,.drecord b,
.dcall .nums b,.pv em i{font-variant-numeric:tabular-nums}
/* one focus language site-wide */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
textarea:focus-visible,[tabindex]:focus-visible{
  outline:2px solid #D5B054;outline-offset:2px;border-radius:2px}
/* buttons press back */
@media (prefers-reduced-motion: no-preference){
  .dcta:active,.join:active,.v2btn:active,.stakes button:active,
  .drow .dadd:active,.mk:active,.nlrow button:active{transform:scale(.97)}
}
/* the serif carries slightly tighter tracking at display sizes (Fraunces
   is wider-bodied than the Didone it replaces) */
.dhero h1,.bhead h2,.rcpt h2,.dcall .sel{letter-spacing:-.015em}
h1.serif,.serif{letter-spacing:-.01em}
/* italic gold lines keep their slant personality in Fraunces */
.dhero h1 em,.rcpt h2 em{font-style:italic}


/* == start-free card (2 Sep: the capture was 'crap' - now it's furniture) == */
.startcard{margin:34px 0 0;border:1px solid var(--line-gold);border-radius:12px;
  background:var(--panel);padding:18px 16px;text-align:center}
.startcard .dk{color:var(--gold)}
.startcard .sc-line{color:var(--ivory);font-size:.95rem;margin-top:8px;
  font-family:'Fraunces',Georgia,serif;font-optical-sizing:none;font-variation-settings:"opsz" 28;font-weight:600}
.startcard .sc-row{display:flex;gap:10px;margin-top:14px}
.startcard input{flex:1;background:var(--ground);border:1px solid var(--line);border-radius:9px;
  color:var(--ivory);font-family:'DM Sans',sans-serif;font-size:16px;padding:12px 14px;min-width:0}
.startcard input:focus{outline:none;border-color:var(--gold)}
.startcard input::placeholder{color:var(--ink-dim)}
.startcard button{background:#D5B054;color:#151105;border:0;border-radius:9px;font-weight:700;
  font-size:.84rem;padding:12px 16px;cursor:pointer;font-family:'DM Sans',sans-serif;white-space:nowrap}
.startcard .sc-fine{display:block;margin-top:10px;font-size:.7rem;color:var(--ink-dim)}
@media (max-width:440px){.startcard .sc-row{flex-direction:column}}


/* == SECTION IDENTITY (2 Sep: 'you can't tell features apart') =========== */
.sect{margin:40px 0 12px;text-align:left}
.sect .sl,.startcard .sl{display:block;font-size:.58rem;font-weight:700;letter-spacing:.22em;
  text-transform:uppercase;color:var(--dgold,#D5B054)}
.sect h2{font-family:'Fraunces',Georgia,serif;font-optical-sizing:none;
  font-variation-settings:"opsz" 28;font-weight:800;font-size:1.45rem;color:var(--ivory);margin-top:3px}
.sect .ss{color:var(--ddim);font-size:.8rem;margin-top:2px}
.sect .ss b{color:var(--ivory)}
.sect .ss a{color:var(--dgold,#D5B054);text-decoration:none;border-bottom:1px solid var(--dlngold)}
/* the record band: its own material - tinted full strip, not another list */
.recband{background:linear-gradient(180deg,rgba(213,176,84,.08),rgba(213,176,84,.02));
  border:1px solid var(--dlngold)!important;border-radius:12px;padding:14px 16px!important;margin-top:6px!important}
/* the desk panel gets the quote material */
.deskpanel{border:1px solid var(--dln);border-radius:12px;background:var(--dpanel);
  padding:20px 16px;margin-top:6px!important}
/* start-free stands apart: the gold-washed card */
.startcard{background:linear-gradient(180deg,rgba(213,176,84,.1),rgba(213,176,84,.03))!important;
  border-color:var(--dlngold)!important}
/* previews rail cards get a touch more presence vs rows */
.pv{background:var(--dpanel)}


/* == GOLD IS DRAWN, NEVER POURED (2 Sep) ================================= */
/* one button voice: gold line + gold letter on dark; tint only on press */
.dcta,.join,.v2btn,.jbtn,
.startcard button,.jsoon button,
body .drawer-cta-founders,
.tier .jbtn{
  background:transparent !important;
  border:1.5px solid #D5B054!important;
  color:#E3C368!important;
  font-weight:700;
}
.dcta:hover,.join:hover,.v2btn:hover,.jbtn:hover,
.startcard button:hover,.jsoon button:hover{
  background:rgba(213,176,84,.16)!important;
}
/* the slip-on state joins the drawn language */
.fbbm-bar .fbbm-on{
  background:transparent !important;color:#E3C368!important;
  border:1px solid rgba(213,176,84,.55)!important;font-weight:700;
}
/* badges: drawn, not poured */
.t-badge{background:#0A0A0A!important;border:1px solid #D5B054;color:#E3C368!important}
/* search GO and friends on the legacy pages */
body .v2search button{background:transparent !important;border:1px solid #D5B054!important;color:#E3C368!important}
/* member bar mark keeps its filled check (a mark, not a button) */

/* == THE SLIM HEADER (the logo read massive) ============================= */
body .site-header-inner{padding-top:8px!important;padding-bottom:8px!important}
body .site-logo .fbb-mark{width:34px!important;height:34px!important}
body .site-logo{gap:9px!important}
body .site-logo-word{font-size:.78rem!important;letter-spacing:.16em!important}
.fbbm-bar{padding:7px 12px!important}
/* hero: the slimmer rhythm, everywhere */
.dhero{padding:18px 0 16px!important}
.dhero .crest-row svg{width:18px;height:18px}
@media (min-width:1100px){.dhero{padding:34px 0 26px!important}}


/* == THE CANVAS BUILD (2 Sep night) ====================================== */
/* the snazzy wordmark */
body .site-logo-word{display:inline!important;font-size:.8rem!important;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
body .site-logo-word .wm-a{color:rgba(213,176,84,.7)}
body .site-logo-word .wm-b{color:#FFFFFF}
body .site-logo .fbb-mark{width:22px!important;height:22px!important}
/* hero: centred, lean */
.dhero{text-align:center!important}
.dhero .crest-row{justify-content:center}
.dhero .hstat{justify-content:center}
.dhero .hstat-t{text-align:left}
/* section headers centred site-home */
.sect{text-align:center}
.sect .ss a{border-bottom:0}
/* desktop: receipt column left, board right (source order receipt-first) */
/* the homepage sets its own columns; a 430px left half here made them 430/538, which reads as
   off-balance under a hero that centres on the page (9 Sep, owner: "its not centred etc visually") */
/* ONE proof card - the zone is a single object */
.proofcard{margin-top:6px;border:1px solid var(--dlngold);border-radius:12px;
  background:linear-gradient(180deg,rgba(213,176,84,.08),rgba(213,176,84,.02));
  padding:16px 14px;text-align:center}
.pc-stats{display:flex;justify-content:center;gap:34px}
.pc-stats b{display:block;font-weight:800;font-size:1.5rem;color:var(--ivory)}
.pc-stats span{font-family:'JetBrains Mono',monospace;font-size:.56rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ddim)}
.pc-line{margin-top:12px;padding-top:12px;border-top:1px solid var(--dln);
  font-size:.84rem;color:var(--ddim)}
.pc-line b{color:var(--dgoldhi);font-weight:700}
.pc-audit{display:inline-block;margin-top:12px;font-size:.72rem;color:var(--dgold);text-decoration:none;
  border-bottom:1px solid var(--dlngold)}
/* THE PRO BAND */
.proband{margin:34px -18px 0;padding:24px 18px 26px;
  border-top:1px solid rgba(213,176,84,.5);border-bottom:1px solid rgba(213,176,84,.5);text-align:center}
.pb-name{font-style:italic;font-weight:800;font-size:1.9rem;color:var(--dgold)}
.pb-h{font-weight:800;font-size:1.3rem;margin-top:2px;color:var(--ivory)}
.pb-s{color:var(--ddim);font-size:.84rem;margin-top:2px}
.pb-s b{color:var(--ivory)}
.pb-card{margin-top:12px;border:1.5px solid rgba(213,176,84,.6);border-radius:12px;background:var(--dpanel);
  padding:18px 16px;box-shadow:0 0 0 5px rgba(213,176,84,.06)}
.pb-q{font-style:italic;font-weight:700;font-size:1.05rem;line-height:1.45;color:var(--ivory)}
.pb-open{margin-top:10px;color:var(--ivory);font-size:.86rem}
.pb-blur{margin-top:6px;color:var(--ddim);font-size:.84rem;filter:blur(4px);user-select:none;pointer-events:none;
  -webkit-mask-image:linear-gradient(180deg,#000 0,transparent 95%);mask-image:linear-gradient(180deg,#000 0,transparent 95%)}
.pb-lock{display:inline-flex;align-items:center;gap:7px;margin-top:8px;font-size:.62rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--ddim)}
.pb-tiers{display:flex;gap:10px;margin-top:14px}
.pb-tier{flex:1;border:1px solid var(--dln);border-radius:10px;padding:10px}
.pb-tier.best{border-color:var(--dgold)}
.pb-tier span{display:block;font-family:'JetBrains Mono',monospace;font-size:.56rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ddim)}
.pb-tier.best span{color:var(--dgold)}
.pb-tier b{font-weight:800;font-size:1.25rem;color:var(--dgoldhi)}
.proband .dcta{margin-top:14px}
.pb-fine{display:block;margin-top:8px;font-size:.7rem;color:var(--ddim)}
@media (min-width:1100px){.proband{margin:48px -32px 0;padding:30px 32px}
  .pb-card{max-width:560px;margin-left:auto;margin-right:auto}}
/* the regrouped drawer */
@media (max-width:768px){
  body .dw-acct{display:flex;align-items:center;gap:12px;margin-top:14px;border:1px solid rgba(213,176,84,.35);
    border-radius:12px;padding:13px 14px;text-decoration:none;color:var(--ivory)}
  body .dw-acct .fbbm-mark{flex:0 0 auto;width:22px;height:22px;border-radius:50%;border:1px solid rgba(213,176,84,.5);
    display:inline-flex;align-items:center;justify-content:center;font-size:.6rem;font-weight:700;color:#A8A8A8}
  body .dw-acct .fbbm-mark.on{background:transparent;border-color:#D5B054;color:#E6C860}
  body .dw-acct-t{flex:1;min-width:0}
  body .dw-acct-t b{display:block;font-size:.9rem;font-weight:600}
  body .dw-acct-t span{display:block;font-size:.68rem;color:var(--ddim)}
  body .dw-acct-cta{font-style:normal;font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.08em;
    color:#D5B054;border:1px solid rgba(213,176,84,.45);border-radius:7px;padding:7px 11px;white-space:nowrap}
  body .main-nav .nav-link{display:flex!important;justify-content:space-between;align-items:baseline}
  body .main-nav .nav-link .dw-sub{display:inline-block;font-style:normal;font-family:'JetBrains Mono',monospace;font-size:.56rem;
    letter-spacing:.1em;text-transform:uppercase;color:var(--ddim)}
  body .dw-pro{display:flex;align-items:center;gap:12px;margin-top:16px;border:1px solid rgba(213,176,84,.45);
    border-radius:12px;padding:14px;background:transparent;text-decoration:none}
  body .dw-pro .dw-pro-t{flex:1}
  body .dw-pro b{display:block;font-family:'Fraunces',Georgia,serif;font-style:italic;font-weight:700;
    font-size:1.25rem;color:#D5B054}
  body .dw-pro .dw-pro-t span{display:block;font-size:.68rem;color:var(--ddim)}
  body .dw-pro em{font-style:normal;font-family:'JetBrains Mono',monospace;font-size:.62rem;color:#D5B054}
  body .dw-foot{display:block;margin-top:18px;border-top:1px solid rgba(255,255,255,.1);padding-top:14px;
    display:flex;flex-direction:column;gap:12px}
  body .dw-k{display:block;margin:14px 0 6px;font-family:'JetBrains Mono',monospace;font-size:.56rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-dim)}
  body .dw-leagues{display:flex;flex-wrap:wrap;gap:5px 14px}
  body .dw-leagues a{font-size:.76rem;color:var(--ddim);text-decoration:none;border:0;background:none;padding:0}
  body .dw-social{display:flex;gap:16px}
  body .dw-social a{font-size:.68rem;color:var(--ddim);text-decoration:none;background:none;border:0;padding:0}
}


/* == THE PROOF SLIDER (3 Sep, grown 4 Sep): the original slideshow reborn
   as the proof STAGE. One number at a time, set huge in Fraunces; the
   caption rides under it in mono. Gold stays drawn - the only fill on the
   card is the active dot. ============================================== */
.proofslider{position:relative;min-height:220px;padding:34px 18px 22px;
  display:flex;flex-direction:column;justify-content:center}
.ps-slide{display:none;animation:psin .5s cubic-bezier(.22,.9,.3,1)}
.ps-slide.on{display:block}
@keyframes psin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.ps-big{display:block;font-family:'Fraunces',Georgia,serif;font-optical-sizing:none;
  font-variation-settings:"opsz" 60,"SOFT" 30,"WONK" 0;font-weight:800;
  font-size:clamp(3rem,9vw,4.2rem);color:var(--dgoldhi);line-height:1.02;
  letter-spacing:-.01em}
.ps-cap{margin-top:12px;font-family:'JetBrains Mono',monospace;font-size:.68rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ddim)}
.ps-cap b{font-weight:700;color:var(--dgoldhi)}
.proofslider .pc-stats{gap:12vw;justify-content:center}
.proofslider .pc-stats b{font-family:'Fraunces',Georgia,serif;font-optical-sizing:none;
  font-variation-settings:"opsz" 60,"SOFT" 30,"WONK" 0;font-weight:800;
  font-size:clamp(2.1rem,6.4vw,3rem);line-height:1.05;color:var(--dgoldhi)}
.proofslider .pc-stats span{margin-top:6px;display:block;font-size:.6rem}
.ps-dots{display:flex;justify-content:center;gap:10px;margin-top:20px}
.ps-dots button{appearance:none;-webkit-appearance:none;width:26px;height:4px;border-radius:2px!important;
  border:0;background:rgba(213,176,84,.22);padding:0;cursor:pointer;transition:background .25s}
.ps-dots button.on{background:#D5B054}
.pc-audit{margin-top:16px}
@media (prefers-reduced-motion:reduce){.ps-slide{animation:none}}
@media (max-width:480px){.proofslider{min-height:190px;padding:26px 12px 18px}}


/* == ONE LINK VOICE (3 Sep: 'we need to know it's clickable') =========== */
.lnk,.sect .ss a,.pc-audit,.dghost{color:var(--dgold)!important;text-decoration:none;
  border-bottom:1px solid var(--dlngold);padding-bottom:1px}
.lnk:hover,.sect .ss a:hover,.pc-audit:hover,.dghost:hover{color:var(--dgoldhi)!important;
  border-bottom-color:var(--dgold)}


/* == NO SQUARE WIDGETS (4 Sep, owner): every + mark is a circle, every
   button and field is rounded. Gold stays drawn. ========================= */
.fbb-add,.leg .fbb-add,.pv3-leg .fbb-add{border-radius:50%!important;width:22px!important;height:22px!important;
  display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(213,176,84,.5);
  line-height:1;font-size:.85rem}
body[data-slipmode="off"] .fbb-add{display:none!important}
button,.btn,.jbtn,.dcta,.addcall,.tr-btn-primary,.tr-btn-secondary,.tool-cta-btn,.footer-cta-btn,
.vb-lock-cta,.da-lockcta a,.pvfilter button,.cw-chip,.cw-suggestion,#fbb-cookie-accept,#fbb-cookie-decline{
  border-radius:12px!important}
input[type=search],input[type=text],input[type=email],select,textarea{border-radius:10px!important}
.lock,.dtag,.pro,.g-tag,.jwin-mark{border-radius:6px!important}

/* ROUNDED LAW, exceptions to rebrand.css's global square (4 Sep): circles are circles, pills are pills, doors 12px */
.fbbm-switch i,.fbbm-switch i::after,.prorow .k2::before,.fbbm-mark{border-radius:50%!important}
.fbbm-join,.fbbm-live,.quiet .tier-tabs button,.pvrow .kick .verdict{border-radius:999px!important}
.hdoor,.dcta,.prorow,.pb-tier,.pb-card,.fbb-tip{border-radius:12px!important}
.pvrow .call{max-width:150px;white-space:normal;line-height:1.35}
@media (max-width:480px){.pvrow .call{max-width:118px;font-size:.56rem}}

/* pair cards on a phone (5 Sep): the sides get the room, the number column narrows */
@media (max-width:480px){
  .pvrow .mid,.pcard .mid,.pairs .mid{max-width:106px!important}
  .pvrow .side b,.pcard .side b,.pairs .side b{font-size:.86rem!important;overflow-wrap:normal!important}
  form:has(#pvq){flex-wrap:wrap}
  form:has(#pvq) input[type="search"]{flex:1 1 100%}
}

/* ═══ GLASS HEADER (5 Sep, owner: "cool liquid glass", logo left, one Pro door) ═══ */
body .site-header{position:sticky;background:rgba(11,10,8,.58)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  border-bottom:1px solid rgba(213,176,84,.32)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)!important;padding:8px 16px!important}
/* the blur lives on a pseudo-element: a backdrop-filter on the header itself would become the
   containing block for the fixed drawer inside it (the closed drawer then widens the page) */
body .site-header::before{content:'';position:absolute;inset:0;z-index:-1;backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);pointer-events:none}
body .site-logo-word{display:inline!important;font-family:'Fraunces',Georgia,serif!important;font-size:1.05rem!important;font-weight:650!important;letter-spacing:.005em!important;text-transform:none!important}
body .site-logo-word .wm-a{color:#E6C860!important;font-style:normal}
body .site-logo-word .wm-b{color:#FFFFFF!important}
body .site-logo .fbb-mark{width:20px!important;height:20px!important}
.nav-pro{display:inline-flex;align-items:center;gap:12px;margin-left:8px}
.nav-signin{font-family:'DM Sans',sans-serif;font-size:.8rem;color:#A8A8A8;text-decoration:none;white-space:nowrap}
.nav-signin:hover{color:#FFFFFF}
.nav-viewas{background:none;border:0;padding:0;font-family:'DM Sans',sans-serif;font-size:.74rem;color:#A8A8A8;text-decoration:underline;cursor:pointer;white-space:nowrap}
.fbbm-join{display:inline-flex;align-items:center;height:34px;padding:0 14px;border:1px solid rgba(213,176,84,.6);border-radius:999px!important;
  background:rgba(255,255,255,.04);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#FFFFFF;font-family:'DM Sans',sans-serif;font-weight:600;font-size:.8rem;
  text-decoration:none!important;white-space:nowrap;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.fbbm-join:hover{border-color:#F2E3AE;color:#F2E3AE}
.fbbm-live{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 12px;border:1px solid rgba(213,176,84,.5);border-radius:999px!important;color:#E6C860;font-family:'DM Sans',sans-serif;font-weight:600;font-size:.8rem;white-space:nowrap}
.fbbm-mark{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%!important;border:1px solid rgba(213,176,84,.45);color:#A8A8A8;font-size:.6rem;font-weight:700;font-style:normal}
.fbbm-mark.on{background:transparent;border-color:#D5B054;color:#E6C860}
@media (max-width:900px){
  body .site-header .site-logo{justify-self:start!important;order:2}
  body .site-header .nav-actions{display:flex!important;order:3;align-items:center;gap:0}
  body .site-header .nav-actions .nav-search,body .site-header .nav-actions .nav-cta{display:none!important}
  .nav-signin,.nav-viewas{display:none}
  .nav-pro{margin-left:0}
  .fbbm-join{height:32px;padding:0 12px;font-size:.78rem}
  .fbbm-live{height:32px;padding:0 10px}
}
/* the Pro cluster inherits an old bar rule elsewhere: it is a plain span in the header */
.site-header .fbbm-bar.nav-pro{background:none!important;border:0!important;padding:0!important;position:static!important;box-shadow:none!important}
.site-header .fbbm-bar .fbbm-live{border-radius:999px!important}
.site-header .fbbm-bar .fbbm-join{border-radius:999px!important}
.site-header .fbbm-bar .fbbm-mark.on{background:transparent!important;border-color:#D5B054!important;color:#E6C860!important;border-radius:50%!important}

/* ═══ THE FRAME (5 Sep): drawer and footer in the grammar ═══ */
body .main-nav .nav-link .dw-sub{font-family:'DM Sans',sans-serif!important;font-size:.76rem!important;letter-spacing:0!important;text-transform:none!important;color:#A8A8A8!important}
body .main-nav .drawer-eyebrow,body .dw-k{font-family:'DM Sans',sans-serif!important;font-size:.82rem!important;font-weight:600!important;letter-spacing:0!important;text-transform:none!important;color:#FFFFFF!important}
body .dw-acct{border-radius:12px!important;border-color:rgba(213,176,84,.4)!important}
body .dw-acct-cta{font-family:'DM Sans',sans-serif!important;font-size:.8rem!important;font-weight:600!important;letter-spacing:0!important;text-transform:none!important;color:#E3C368!important;
  border:1.5px solid #D5B054!important;border-radius:999px!important;padding:7px 14px!important;background:none!important}
body .dw-pro{border-radius:12px!important;border-color:rgba(213,176,84,.4)!important;background:none!important}
body .dw-pro b{font-style:normal!important;color:#E6C860!important}
body .dw-pro em{font-family:'DM Sans',sans-serif!important;font-size:.8rem!important;font-weight:600!important;color:#E3C368!important;border:1.5px solid #D5B054!important;border-radius:999px!important;padding:7px 14px!important}
body .dw-leagues a,body .dw-more a{font-size:.9rem;color:#D6D6D6}
body .drawer-head-title{font-family:'Fraunces',Georgia,serif;font-weight:650}
footer .footer-brand-word{font-family:'Fraunces',Georgia,serif;font-size:1.05rem;font-weight:650;letter-spacing:.005em;text-transform:none;color:#FFFFFF}
footer .footer-col-title{text-transform:none!important;letter-spacing:0!important;font-size:.9rem!important;color:#FFFFFF!important;margin-bottom:8px!important}
footer .footer-col a{font-size:.86rem!important;color:#A8A8A8!important;padding:4px 0!important}
footer .footer-col a:hover{color:#F2E3AE!important}
footer .footer-desc{color:#A8A8A8!important;font-size:.86rem!important}
footer .footer-cta{border-top:1px solid rgba(213,176,84,.32)}
footer .footer-cta-input{border:1px solid rgba(213,176,84,.4)!important;border-radius:12px!important;background:#121212!important;color:#FFFFFF!important;height:44px}
footer .footer-data-source,footer .footer-links,footer .footer-links a{color:#A8A8A8!important}
/* older templates keep the header inside a padded container: tighten the header on phones so the Pro door never clips */
@media (max-width:480px){
  body .site-header{padding:8px 12px!important}
  body .site-header-inner{gap:6px!important}
  body .site-logo{gap:6px!important}
  body .site-logo-word{font-size:.92rem!important}
  body .site-logo .fbb-mark{width:18px!important;height:18px!important}
  .site-header .fbbm-join{height:30px;padding:0 10px;font-size:.74rem}
  .site-header .fbbm-live{height:30px;padding:0 9px;font-size:.74rem}
}

/* no gold rule under headlines anywhere (rebrand.css drew a 3px h1::after) */
h1::after{content:none!important;display:none!important}

/* drawer-only rows never widen the desktop header */
@media (min-width:901px){.site-header .nav-link.dw-only{display:none!important}}

/* desktop header: links never wrap; on narrower desktops two secondary rows stay in the drawer */
@media (min-width:901px){
  .site-header .nav-link{white-space:nowrap}
  .site-header .main-nav{gap:14px!important}
}
/* THE EXTRA HEADER LINKS NEVER FIT (9 Sep). They revealed above 1400px, and at 1440 the
   secondary group jumped from 88px to 325px and ran into the Build a Bet pill. Widening does
   not help: the header's groups are laid out in a fixed container, so the collision is the
   same 12px at 1920 as at 1440. Measured at 1920, 1600, 1560 and 1440 before and after.
   The model's picks and How it works are both in the drawer and the footer, so hiding them in
   the desktop header costs one duplicate route and buys back a header that never overlaps. */
@media (min-width:901px){.site-header .nav-link.md-hide{display:none!important}}

/* ═══ FOOTER CONTAINER (5 Sep, owner: "looks weird on desktop"): the grid ran edge to
   edge with the brand jammed on the left gutter. Same 1056px column as the pages. ═══ */
footer .footer-grid{max-width:1080px!important;margin:0 auto!important;padding:0 12px 28px!important;grid-template-columns:1.5fr 1fr 1fr 1fr 1fr!important;gap:36px!important;box-sizing:border-box}
footer .footer-bottom{max-width:1080px;margin:0 auto;padding-left:12px;padding-right:12px;box-sizing:border-box}
footer .footer-desc{max-width:34ch}
@media (max-width:1024px){footer .footer-grid{grid-template-columns:1fr 1fr!important;gap:24px!important}}
@media (max-width:560px){footer .footer-grid{grid-template-columns:1fr!important}}

/* ═══ THE MEMBERS DOOR (5 Sep): locked pill for visitors, a menu for members ═══ */
body .nav-pro .nav-members{display:inline-flex;align-items:center;gap:7px;padding:6px 12px!important;border:1px solid rgba(213,176,84,.45)!important;border-radius:999px!important;color:#FFFFFF!important;font-family:'DM Sans',sans-serif;font-size:.8rem;font-weight:600;text-decoration:none;background:transparent!important}
body .nav-pro .nav-members:hover{border-color:#D5B054!important;color:#F2E3AE!important}
body .nav-pro .nav-members .hlk{width:14px;height:14px;border:1px solid #D5B054;border-radius:50%!important;position:relative;display:inline-block;box-sizing:border-box}
body .nav-pro .nav-members .hlk::after{content:'';position:absolute;left:50%;top:50%;width:4px;height:4px;margin:-2px 0 0 -2px;border-radius:50%!important;background:#D5B054}
body .nav-pro .nav-mem{position:relative;display:inline-block}
body .nav-pro .nav-mem summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border:1px solid rgba(213,176,84,.5);border-radius:999px!important;color:#E3C368;font-family:'DM Sans',sans-serif;font-size:.8rem;font-weight:600;user-select:none}
body .nav-pro .nav-mem summary::-webkit-details-marker{display:none}
body .nav-pro .nav-mem[open] summary{border-color:#D5B054;color:#F2E3AE}
body .nav-pro .nav-mem .menu{position:absolute;right:0;top:calc(100% + 8px);min-width:230px;padding:6px;background:#121212;border:1px solid rgba(213,176,84,.4);border-radius:12px!important;box-shadow:0 12px 30px rgba(0,0,0,.5);z-index:80}
body .nav-pro .nav-mem .menu a,body .nav-pro .nav-mem .menu button{display:block;width:100%;text-align:left;padding:9px 10px;margin:0;color:#FFFFFF!important;font-family:'DM Sans',sans-serif;font-size:.88rem;font-weight:500;text-decoration:none;background:none!important;border:0!important;border-radius:8px!important;cursor:pointer}
body .nav-pro .nav-mem .menu a:hover,body .nav-pro .nav-mem .menu button:hover{background:rgba(255,255,255,.05)!important;color:#F2E3AE!important}
body .nav-pro .nav-mem .menu button{color:#A8A8A8!important;border-top:1px solid rgba(255,255,255,.07)!important;margin-top:4px;border-radius:0!important}
@media (max-width:480px){body .nav-pro .nav-members{padding:5px 9px!important;font-size:.74rem}body .nav-pro .nav-signin{display:none}}

/* ═══ 9 Sep: the Pro menu a VISITOR sees. Same shell as the member menu, but every row names
   something they do not have yet and every row is a door to /pro. Two lines per row, because
   "Fantasy picks" alone does not tell anyone why they would want it. ═══ */
body .nav-pro .nav-mem-locked summary{color:#FFFFFF;border-color:rgba(213,176,84,.45);white-space:nowrap}  /* nowrap: as a <summary> the offer text wrapped to three lines and the pill grew tall enough
     to shove itself into How it works and Build a Bet. It never wrapped as an <a>. */
body .nav-pro .nav-mem-locked summary .hlk{width:14px;height:14px;border:1px solid #D5B054;border-radius:50%!important;position:relative;display:inline-block;box-sizing:border-box;padding:0}
body .nav-pro .nav-mem-locked summary .hlk::after{content:'';position:absolute;left:50%;top:50%;width:4px;height:4px;margin:-2px 0 0 -2px;border-radius:50%!important;background:#D5B054}
body .nav-pro .nav-mem-locked[open] summary{border-color:#D5B054;color:#F2E3AE}
body .nav-pro .nav-mem-locked .menu{min-width:266px}
body .nav-pro .nav-mem-locked .menu .menu-head{display:block;padding:6px 10px 8px;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:#A8A8A8;font-family:'DM Sans',sans-serif}
body .nav-pro .nav-mem-locked .menu a{padding:8px 10px}
body .nav-pro .nav-mem-locked .menu a b{display:block;font-size:.88rem;font-weight:600;color:#FFFFFF}
body .nav-pro .nav-mem-locked .menu a i{display:block;font-style:normal;font-size:.78rem;line-height:1.35;color:#A8A8A8;margin-top:1px}
body .nav-pro .nav-mem-locked .menu a:hover b{color:#F2E3AE}
body .nav-pro .nav-mem-locked .menu a.menu-cta{margin-top:5px;border-top:1px solid rgba(255,255,255,.07)!important;border-radius:0!important;
  color:#E6C860!important;font-size:.83rem;font-weight:600;padding-top:11px}
/* THE PILL STAYS SMALL (9 Sep, owner: "the pro drop down looks weird now looks too big, needs
   to stay small and elegant with the dropdown"). The offer was carried in the pill AND at the
   foot of the menu, and in the pill it is the widest thing in the header, so it wrapped to two
   lines and turned a chip into a blob. It only ever needed to be in one of those two places,
   and the menu is the one where somebody is actually reading. The pill is now Pro and a chevron. */
body .nav-pro .nav-mem-locked summary .nav-offer{display:none}

/* ═══ 5 Sep: the fixed Feedback tab was in the way (owner). The footer link stays. ═══ */
#fbb-feedback-tab{display:none!important}
/* phone header: the Members door is the way in; the Join pill only clipped */
@media (max-width:480px){body .nav-pro .fbbm-join{display:none!important}}

/* 5 Sep: the drawer-only Members block must never render in the desktop bar (it overflowed the header) */
@media (min-width:901px){body .main-nav .dw-members{display:none!important}}
/* 6 Sep: the drawer's Pro-today rows keep their sub-line clear of the lock circle */
body .main-nav .dw-pt{padding-right:38px!important}
body .main-nav .dw-pt .dw-sub{margin-right:0!important;padding-right:0!important;text-align:right}
body .main-nav .dw-pt .dw-lk{right:6px}

/* ═══ THE PRO MARK (6 Sep): one word, one mark, beside the account ═══ */
body .nav-pro .nav-members .nav-offer{margin-left:8px;padding-left:8px;border-left:1px solid rgba(213,176,84,.35);color:#A8A8A8;font-weight:500}
@media (max-width:900px){body .nav-pro .nav-members .nav-offer{display:none}}
body .dw-acct.off{border-color:rgba(213,176,84,.4)!important}
body .dw-acct .dw-acct-lk{width:22px;height:22px;flex:0 0 22px;border:1px solid #D5B054;border-radius:50%!important;position:relative;display:inline-block;box-sizing:border-box}
body .dw-acct .dw-acct-lk::after{content:'';position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%!important;background:#D5B054}
body .dw-signin{display:block;margin:-6px 0 14px;font-size:.8rem;color:#A8A8A8;text-decoration:underline;text-underline-offset:3px}

/* ═══ 6 Sep: the pictures ═══ */
@media (min-width:901px){body .main-nav .dw-signin{display:none!important}}
body .nav-pro .nav-members{white-space:nowrap}
body .main-nav .dw-pt .dw-lk{position:static!important;flex:0 0 16px;margin-left:10px;top:auto;margin-top:0}
body .main-nav .dw-pt{padding-right:0!important}
body .main-nav .dw-pt .dw-sub{max-width:60%}
/* socials that pop: drawn gold pills */
body .dw-social{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
body .dw-social a,body .footer-social a{display:inline-flex;align-items:center;gap:7px;padding:8px 14px!important;border:1.5px solid #D5B054!important;border-radius:999px!important;color:#F2E3AE!important;font-family:'DM Sans',sans-serif;font-size:.86rem!important;font-weight:600;text-decoration:none;background:transparent!important}
body .dw-social a:hover,body .footer-social a:hover{color:#FFFFFF!important;border-color:#F2E3AE!important}
body .footer-social{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0 0}
body .footer-social a b{font-family:'Fraunces',Georgia,serif;font-weight:700}
/* the hub's date chips */
.dchips{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 12px}
.dchips button{font-family:'DM Sans',sans-serif;font-size:.8rem;font-weight:600;color:#A8A8A8;background:transparent;border:1px solid rgba(255,255,255,.14);border-radius:999px!important;padding:6px 12px;cursor:pointer}
.dchips button.on{color:#F2E3AE;border-color:#D5B054}
.dhide{display:none!important}
/* 6 Sep: the drawer lock keeps its dot (relative, not static) and the sign-in line breathes */
body .main-nav .dw-pt .dw-lk{position:relative!important;left:auto;top:auto}
body .main-nav .dw-signin{margin:10px 0 16px!important}
/* 6 Sep: the board's acca door is drawn gold, never a white fill */
body .bacca .hbuild{background:transparent!important;border:1.5px solid #D5B054!important;color:#E3C368!important;border-radius:12px!important;font-family:'DM Sans',sans-serif;font-weight:600;padding:11px 14px}
body .bacca .hbuild:hover{color:#F2E3AE!important;border-color:#F2E3AE!important}

/* ═══ THE BURGER'S PRO PANEL (6 Sep) ═══ */
body .main-nav .dw-propanel{display:block;margin:14px 0 6px;padding:14px 14px 10px;background:rgba(255,255,255,.04);-webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%);border:1px solid rgba(213,176,84,.45);border-radius:12px!important}
body .main-nav .dw-propanel.on{border-color:#D5B054}
body .main-nav .dwp-head{display:flex;align-items:center;gap:12px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.08)}
body .main-nav .dwp-head .fbbm-mark{width:26px;height:26px;flex:0 0 26px;font-size:.8rem}
body .main-nav .dwp-lk{width:26px;height:26px;flex:0 0 26px;border:1px solid #D5B054;border-radius:50%!important;position:relative;display:inline-block;box-sizing:border-box}
body .main-nav .dwp-lk::after{content:'';position:absolute;left:50%;top:50%;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%!important;background:#D5B054}
body .main-nav .dwp-t{flex:1 1 auto;min-width:0}
body .main-nav .dwp-t b{display:block;font-family:'Fraunces',Georgia,serif;font-size:1.15rem;font-weight:650;color:#FFFFFF;line-height:1.15}
body .main-nav .dwp-t span{display:block;font-size:.8rem;color:#A8A8A8;margin-top:2px;overflow-wrap:anywhere}
body .main-nav .dwp-cta{flex:0 0 auto;padding:8px 14px;border:1.5px solid #D5B054;border-radius:999px!important;color:#E3C368;font-family:'DM Sans',sans-serif;font-size:.84rem;font-weight:600;text-decoration:none;white-space:nowrap}
body .main-nav .dwp-rows{display:block}
body .main-nav .dwp-row{display:grid;grid-template-columns:minmax(0,1fr) 16px;column-gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.07);text-decoration:none}
body .main-nav .dwp-row:last-child{border-bottom:0}
body .main-nav .dwp-row b{display:block;font-family:'DM Sans',sans-serif;font-size:.98rem;font-weight:600;color:#FFFFFF}
body .main-nav .dwp-row > span{display:block;font-size:.8rem;color:#A8A8A8;margin-top:1px}
body .main-nav .dwp-row > span i{font-style:normal;color:#E6C860;font-weight:600}
body .main-nav .dwp-row .hlk{grid-column:2;grid-row:1 / span 2;width:16px;height:16px;border:1px solid #D5B054;border-radius:50%!important;position:relative;display:inline-block;box-sizing:border-box}
body .main-nav .dwp-row .hlk::after{content:'';position:absolute;left:50%;top:50%;width:5px;height:5px;margin:-2.5px 0 0 -2.5px;border-radius:50%!important;background:#D5B054}
body .main-nav .dwp-row:not(:has(.hlk)){grid-template-columns:minmax(0,1fr)}
body .main-nav .dwp-foot{display:block;padding:10px 0 2px;font-size:.78rem;color:#A8A8A8;text-decoration:underline;text-underline-offset:3px}
@media (min-width:901px){body .main-nav .dw-propanel{display:none!important}}
/* the search reads as a search */
body .nav-search--drawer{position:relative;margin:14px 0 8px!important}
body .dw-search-k{position:absolute;left:14px;top:50%;transform:translateY(-50%);font-family:'DM Sans',sans-serif;font-size:.8rem;font-weight:600;color:#E3C368;pointer-events:none}
body .nav-search--drawer .nav-search-input{border:1.5px solid rgba(213,176,84,.6)!important;border-radius:12px!important;padding:13px 14px 13px 78px!important;font-size:1rem!important;color:#FFFFFF!important;background:#121212!important}
body .nav-search--drawer .nav-search-input::placeholder{color:#A8A8A8}
body .nav-search--drawer .nav-search-input:focus{border-color:#D5B054!important;outline:none}

/* ═══ THE DRAWER IS A MENU (6 Sep, owner: "needs to actually look like a menu") ═══
   Drawer only (the desktop bar keeps its rows): plain DM Sans labels, the
   sub-line underneath, a drawn chevron on every row, hairline dividers, leagues
   and more in two columns. */
@media (max-width:900px){
  body .main-nav .drawer-scroll{padding:0 16px 24px}
  body .main-nav .drawer-eyebrow,body .main-nav .dw-k{display:block!important;margin:24px 0 2px!important;padding:0!important;font-family:'DM Sans',sans-serif!important;font-size:.76rem!important;font-weight:600!important;letter-spacing:.04em!important;text-transform:none!important;color:#E6C860!important}
  body .main-nav .nav-primary,body .main-nav .nav-secondary{display:block!important;padding:0!important;margin:0!important;border:0!important;background:none!important}
  body .main-nav .nav-primary .nav-link,body .main-nav .nav-secondary .nav-link{display:grid!important;grid-template-columns:minmax(0,1fr) 12px;column-gap:12px;align-items:center;padding:13px 0!important;margin:0!important;border:0!important;border-bottom:1px solid rgba(255,255,255,.08)!important;border-radius:0!important;background:none!important;text-decoration:none!important;position:relative}
  body .main-nav .nav-primary .nav-link > span,body .main-nav .nav-secondary .nav-link > span{display:block!important;font-family:'DM Sans',sans-serif!important;font-size:1.02rem!important;font-weight:600!important;line-height:1.3!important;color:#FFFFFF!important;letter-spacing:0!important;text-transform:none!important}
  body .main-nav .nav-primary .nav-link .dw-sub,body .main-nav .nav-secondary .nav-link .dw-sub{grid-column:1;display:block!important;margin:2px 0 0!important;text-align:left!important;font-family:'DM Sans',sans-serif!important;font-size:.8rem!important;font-style:normal!important;color:#A8A8A8!important;max-width:none!important;letter-spacing:0!important}
  body .main-nav .nav-primary .nav-link::after,body .main-nav .nav-secondary .nav-link::after{content:'';grid-column:2;grid-row:1 / span 2;width:8px;height:8px;border-right:1.5px solid #D5B054;border-bottom:1.5px solid #D5B054;transform:rotate(-45deg);justify-self:end;margin-right:4px}
  body .main-nav .dw-leagues{display:grid!important;grid-template-columns:1fr 1fr;column-gap:18px;row-gap:0!important;margin:0!important;padding:0!important}
  body .main-nav .dw-leagues a{display:flex!important;align-items:center;justify-content:space-between;gap:8px;padding:11px 0!important;margin:0!important;border:0!important;border-bottom:1px solid rgba(255,255,255,.07)!important;border-radius:0!important;background:none!important;font-family:'DM Sans',sans-serif!important;font-size:.92rem!important;font-weight:500;color:#FFFFFF!important;text-decoration:none!important;letter-spacing:0!important}
  body .main-nav .dw-leagues a::after{content:'';width:7px;height:7px;flex:0 0 7px;border-right:1.5px solid rgba(213,176,84,.85);border-bottom:1.5px solid rgba(213,176,84,.85);transform:rotate(-45deg)}
  body .main-nav .dw-foot{padding:0!important;margin:0!important;border:0!important}
  body .main-nav .dw-social{margin:14px 0 0!important}
  body .main-nav .dw-social a::after{content:none!important}
}

/* ═══ 6 Sep: the menu groups are cards; socials at the top; the preview bar ═══ */
@media (max-width:900px){
  body .main-nav .dw-follow-k{margin-top:16px!important}
  body .main-nav .dw-social-top{margin:6px 0 4px!important}
  body .main-nav .nav-primary,body .main-nav .nav-secondary,body .main-nav .dw-leagues{padding:2px 14px!important;background:#121212!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:12px!important}
  body .main-nav .nav-primary .nav-link:last-child,body .main-nav .nav-secondary .nav-link:last-child{border-bottom:0!important}
  body .main-nav .dw-leagues{padding:2px 14px!important}
  body .main-nav .dwp-view{width:100%;text-align:left;background:none!important;border:0!important;border-top:1px solid rgba(255,255,255,.07)!important;cursor:pointer;font-family:'DM Sans',sans-serif;padding:10px 0!important;border-radius:0!important}
  body .main-nav .dwp-view b{color:#E6C860!important}
}
body .fbb-previewbar{display:flex;align-items:center;justify-content:center;gap:12px;padding:8px 14px;background:#121212;border-bottom:1px solid rgba(213,176,84,.45);color:#F2E3AE;font-family:'DM Sans',sans-serif;font-size:.84rem;font-weight:500}
body .fbb-previewbar button{padding:5px 12px;border:1.5px solid #D5B054;border-radius:999px!important;background:transparent;color:#E3C368;font-family:'DM Sans',sans-serif;font-size:.8rem;font-weight:600;cursor:pointer}
/* 6 Sep: a little more luxury in the drawer: gold hairlines, a rule under each heading, calmer chevrons */
@media (max-width:900px){
  body .main-nav .drawer-scroll{background:#0B0A08}
  body .main-nav .nav-primary,body .main-nav .nav-secondary,body .main-nav .dw-leagues{border-color:rgba(213,176,84,.28)!important;background:#100F0C!important}
  body .main-nav .drawer-eyebrow,body .main-nav .dw-k{display:flex!important;align-items:center;gap:10px;font-family:'Fraunces',Georgia,serif!important;font-size:.92rem!important;font-weight:650!important;letter-spacing:0!important;color:#F2E3AE!important}
  body .main-nav .drawer-eyebrow::after,body .main-nav .dw-k::after{content:'';flex:1 1 auto;height:1px;background:rgba(213,176,84,.35)}
  body .main-nav .nav-primary .nav-link::after,body .main-nav .nav-secondary .nav-link::after,body .main-nav .dw-leagues a::after{opacity:.75}
  body .main-nav .dw-propanel{box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
}
/* 6 Sep: the drawer's Follow pills never render in the desktop bar */
@media (min-width:901px){body .main-nav .dw-follow-k,body .main-nav .dw-social-top{display:none!important}}

/* THE FOOTER ON PHONES (7 Sep, owner: "the X and telegram isnt centred along with the text"): the pills sit centred under the centred text. */
@media (max-width:1024px){body .footer-social{justify-content:center}footer .footer-desc{margin-left:auto;margin-right:auto}}

/* THE PRO PILL IS A MENU (7 Sep, owner: "a typical user wouldn't know"): a drawn chevron that turns when open. */
body .nav-pro .nav-mem summary::after{content:'';width:7px;height:7px;border-right:1.5px solid #D5B054;border-bottom:1.5px solid #D5B054;transform:rotate(45deg);margin:-3px 0 0 2px;transition:transform .15s}
body .nav-pro .nav-mem[open] summary::after{transform:rotate(225deg);margin-top:3px}

/* THE (i) (7 Sep, owner: "a little (i) next to it"): a drawn circle that opens one sentence on tap. */
body .ib{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;margin:0 0 2px 4px;padding:0;border:1px solid #D5B054;border-radius:50%!important;background:transparent;color:#E6C860;font:600 .62rem/1 'DM Sans',sans-serif;cursor:pointer;vertical-align:middle;position:relative}
body .ib:hover,body .ib.on{border-color:#F2E3AE;color:#F2E3AE}
body .ib-bubble{position:absolute;z-index:60;max-width:280px;padding:10px 12px;background:#121212;border:1px solid rgba(213,176,84,.6);border-radius:12px!important;color:#FFFFFF;font:400 .84rem/1.5 'DM Sans',sans-serif;box-shadow:0 8px 24px rgba(0,0,0,.5);text-align:left;letter-spacing:0}

/* THE GATED MARK READS "PRO" (8 Sep, owner: "theres no Pro sign next to things just a symbol").
   The drawn circle becomes a pill: a gold dot and the word. The nav keeps the plain dot, and where
   a Pro word already sits beside the mark the pill drops back to the dot, never printing it twice. */
body .hlk:not(.main-nav *):not(.nav-pro *){width:auto!important;height:22px!important;min-width:0!important;flex:none!important;display:inline-flex!important;align-items:center;gap:5px;padding:0 8px!important;border-radius:999px!important;border:1px solid rgba(213,176,84,.75)!important;background:rgba(213,176,84,.08);font:700 12px/1 'DM Sans',system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#EBCB72;white-space:nowrap;vertical-align:middle;justify-self:end}
body .hlk:not(.main-nav *):not(.nav-pro *)::before{content:'';position:static;width:5px;height:5px;margin:0;border-radius:50%!important;background:#D5B054}
body .hlk:not(.main-nav *):not(.nav-pro *)::after{content:'Pro';position:static!important;left:auto;top:auto;width:auto!important;height:auto!important;margin:0!important;border-radius:0!important;background:none!important}

/* THE NAV RAN OFF THE PAGE (9 Sep, owner: "same bet builder needs adjusting its cut off"). Measured
   in a browser at 1024px: .nav-actions ended at 1101, so the sign-in link, the Pro chip and the
   "seven days for one pound" line hung 77px past the right edge on EVERY page, and the body carried a
   horizontal scrollbar because of it. The cluster could not shrink and the offer line only hid below
   900px, which is narrower than the width it actually broke at. It shrinks now, and the offer line
   steps out at the width it stops fitting rather than an arbitrary one. */
body .site-header .nav-actions{min-width:0;flex-shrink:1}
body .site-header .nav-links{min-width:0;flex-shrink:1}
body .nav-pro .nav-members{max-width:100%;overflow:hidden}
@media (max-width:1180px){body .nav-pro .nav-members .nav-offer{display:none}}
html,body{overflow-x:hidden}

/* ══ TWO CAUSES, TWENTY SYMPTOMS (9 Sep, from the measured QA sweep) ═══════════════════════════════

   ONE. NOTHING RESERVED A BOTTOM GUTTER. Three fixed widgets live on the bottom edge of every page,
   the slip chip, the cookie bar and the chat button, and body padding-bottom computed to 0px in 20 of
   20 page/viewport/member combinations measured. So they painted over live copy: a team name 100%
   covered on /saturday-acca so the fixture read "Bet slip 0 v Puebla"; "Brighton" reading "nton" on
   /last-man-standing, on 45 of 186 scroll stops; "Liverpool" reading "pool" on /fantasy. Worst of
   all, at maximum scroll where there is no scroll left to escape it, the chip sat permanently over
   "Please gamble responsibly. 18+ only" and the BeGambleAware, GAMSTOP and GamCare links on ten
   pages. That is a compliance line, not decoration.
   The right pattern already existed, once, in match-preview.html: pad the body, lift the widgets. It
   belongs here, where every page gets it, rather than in one template out of thirty.

   TWO. THE OLD BRAND'S TYPE TOKEN SURVIVED. style.css:21 still declares --font-heading as Outfit and
   applies it to h1..h6, and neither rebrand.css nor v2.css ever redefined it. So every h1 on the site
   is Fraunces, because each page sets that by hand, and not one h2 is: 61 headings across 10 routes.
   On the homepage, /pro and both sheet routes it is worse than the wrong face, because those pages do
   not even request Outfit, so their headings fall through to Arial. One token, redefined once. ══ */

:root{
  --font-heading: 'Fraunces', Georgia, serif;
}

body{
  padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px));
}
body #fbb-slip-chip{ bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important; }
body .cw-fab, body #cw-fab{ bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important; }