/*! BG Homepage styles — scoped .bgmag (+ embedded .bgtop / .bghpb blocks). Matches the approved mockup. */
.bgmag{
  --bg:#f7f7f8; --surface:#fff; --surface-soft:#fafbff;
  --ink:#0b0b1a; --ink-mid:#3a3a4d; --ink-soft:#6b6b7c; --ink-dim:#9a9aa8;
  --line:#e5e5ec; --line-strong:#d0d0db;
  --indigo:#1a3eb5; --indigo-bright:#2952d1; --indigo-deep:#122a7d; --indigo-soft:#eef1fc;
  --gold:#b08515; --gold-soft:#fbf3df; --green:#0f7a4a; --green-soft:#e8f5ef; --pink:#b1336f; --pink-soft:#fbeaf2;
  --radius:6px;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
  color:var(--ink); line-height:1.6; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  width:100%; max-width:100%; margin:0; padding:0 14px;
}
/* One source of vertical rhythm between sections — works whether sections are
   rendered as one [bg_homepage] block or as separate per-section shortcodes. */
.bgmag > section{ margin:0 0 40px !important; }
.bgmag *{ box-sizing:border-box; }
.bgmag a{ text-decoration:none; color:inherit; }
.bgmag .serif{ font-family:'Lora',Georgia,serif; }
.bgmag .eyebrow{ display:inline-flex; align-items:center; gap:8px; font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--indigo); margin:0 0 12px; }
.bgmag .eyebrow .dot{ width:11px; height:11px; border-radius:50%; background:var(--indigo); display:inline-block; }
.bgmag .eyebrow.green{ color:var(--green); } .bgmag .eyebrow.green .dot{ background:var(--green); }
.bgmag .eyebrow.gold{ color:var(--gold); } .bgmag .eyebrow.gold .dot{ background:var(--gold); }
.bgmag .sec{ margin:46px 0; }
.bgmag .sec-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:14px; flex-wrap:wrap; }
.bgmag .sec-title{ font-family:'Lora',serif; font-size:clamp(24px,3vw,33px); font-weight:500; line-height:1.15; letter-spacing:-.01em; margin:0; }
.bgmag .sec-title em{ font-style:italic; color:var(--indigo); }
.bgmag .sec-intro{ font-size:14.5px; color:var(--ink-soft); max-width:760px; margin:0 0 22px; line-height:1.6; }
.bgmag .see-all{ font-size:12.5px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--indigo); white-space:nowrap; border-bottom:1px solid transparent; padding-bottom:2px; transition:.15s; }
.bgmag .see-all:hover{ border-bottom-color:var(--indigo); transform:translateX(2px); }
.bgmag .card{ display:block; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); transition:border-color .2s,transform .15s; }
.bgmag .card:hover{ border-color:var(--line-strong); }
.bgmag .pill{ display:inline-block; font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; padding:3px 9px; border-radius:3px; }
.bgmag .pill-i{ background:var(--indigo-soft); color:var(--indigo); } .bgmag .pill-g{ background:var(--green-soft); color:var(--green); }
.bgmag .pill-y{ background:var(--gold-soft); color:var(--gold); } .bgmag .pill-p{ background:var(--pink-soft); color:var(--pink); }
.bgmag .code{ font-family:'SFMono-Regular',Menlo,Consolas,monospace; font-size:11.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:3px 9px; border:1px dashed var(--indigo); color:var(--indigo); border-radius:3px; }
.bgmag .cta{ display:inline-flex; align-items:center; justify-content:center; gap:8px; background:var(--indigo); color:#fff; font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:13px 24px; border-radius:4px; transition:background .2s,transform .15s; }
.bgmag .cta:hover{ background:var(--indigo-bright); transform:translateY(-1px); }
.bgmag .cta-ghost{ background:transparent; color:var(--indigo); border:1px solid var(--indigo); } .bgmag .cta-ghost:hover{ background:var(--indigo-soft); }
/* HERO */
.bgmag .hero{ display:grid; grid-template-columns:1.15fr .85fr; gap:26px; align-items:stretch; margin:34px 0 10px; }
.bgmag .hero-lead h1{ font-family:'Lora',serif; font-size:clamp(34px,5vw,56px); font-weight:500; line-height:1.06; letter-spacing:-.015em; margin:8px 0 16px; }
.bgmag .hero-lead h1 em{ font-style:italic; color:var(--indigo); }
.bgmag .hero-lead p{ font-size:16px; color:var(--ink-mid); max-width:560px; margin:0 0 22px; }
.bgmag .hero-actions{ display:flex; gap:12px; flex-wrap:wrap; margin-bottom:22px; }
.bgmag .trust{ display:flex; flex-wrap:wrap; gap:10px 18px; align-items:center; font-size:12px; color:var(--ink-soft); font-weight:600; border-top:1px solid var(--line); padding-top:16px; }
.bgmag .trust b{ color:var(--ink); }
.bgmag .hero-feature{ position:relative; border-radius:8px; overflow:hidden; background:linear-gradient(155deg,var(--indigo-deep),var(--indigo) 60%,#3760d8); color:#fff; padding:26px; display:flex; flex-direction:column; justify-content:flex-end; min-height:330px; }
.bgmag .hero-feature::before{ content:""; position:absolute; inset:0; background:radial-gradient(circle at 80% 12%,rgba(255,255,255,.18),transparent 45%); }
.bgmag .hero-feature .kick{ position:relative; font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:#ffd76a; margin-bottom:10px; }
.bgmag .hero-feature h2{ position:relative; font-family:'Lora',serif; font-size:27px; font-weight:600; line-height:1.18; margin:0 0 10px; }
.bgmag .hero-feature p{ position:relative; font-size:14px; color:rgba(255,255,255,.85); margin:0 0 18px; }
.bgmag .hero-feature .fbtn{ position:relative; align-self:flex-start; background:#f5b400; color:#1a1300; font-weight:800; font-size:13px; padding:11px 20px; border-radius:8px; box-shadow:0 8px 22px -8px rgba(245,180,0,.7); }
.bgmag .hero-sub-guides{ display:grid; gap:10px; margin-top:14px; }
.bgmag .mini-guide{ display:flex; gap:12px; align-items:center; padding:12px 14px; }
.bgmag .mini-guide .mg-tag{ font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-dim); }
.bgmag .mini-guide h4{ font-family:'Lora',serif; font-size:15.5px; font-weight:600; margin:2px 0 0; line-height:1.3; }

/* LIVE ODDS */
.bgmag .odds{ background:linear-gradient(180deg,#0c1330,#141d44); border-radius:8px; padding:22px 24px; color:#eef1fa; }
.bgmag .odds .oh{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:6px; }
.bgmag .odds .oh-l .eyebrow{ color:#ffd76a; margin:0; } .bgmag .odds .oh-l .eyebrow .dot{ background:#ff4d4d; animation:pulse 1.6s infinite; }
@keyframes pulse{ 0%,100%{opacity:1} 50%{opacity:.35} }
.bgmag .odds h3{ font-family:'Lora',serif; font-size:22px; font-weight:600; margin:4px 0 0; color:#fff; }
.bgmag .odds .odds-intro{ font-size:13px; color:#aab4d8; margin:2px 0 16px; max-width:680px; }
.bgmag .odds .meet{ font-size:12px; color:#aab4d8; }
.bgmag .odds-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.bgmag .race{ background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); border-radius:6px; padding:13px 15px; }
.bgmag .race .rt{ display:flex; justify-content:space-between; align-items:baseline; gap:8px; }
.bgmag .race .off{ font-family:'Lora',serif; font-size:19px; font-weight:600; color:#fff; }
.bgmag .race .crs{ font-size:11px; color:#aab4d8; text-transform:uppercase; letter-spacing:.08em; }
.bgmag .race .rn{ font-size:12px; color:#cbd2ec; margin:5px 0 10px; line-height:1.4; min-height:34px; }
.bgmag .race .fav{ display:flex; justify-content:space-between; align-items:center; gap:8px; border-top:1px solid rgba(255,255,255,.1); padding-top:9px; }
.bgmag .race .fav .h{ font-size:13.5px; font-weight:600; color:#fff; } .bgmag .race .fav .jk{ font-size:11px; color:#aab4d8; }
.bgmag .race .price{ font-family:'Lora',serif; font-size:18px; font-weight:700; color:#ffd76a; white-space:nowrap; }
.bgmag .odds-foot{ display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin-top:14px; font-size:11.5px; color:#8e98c4; }
.bgmag .odds-foot a{ color:#ffd76a; font-weight:700; text-transform:uppercase; letter-spacing:.07em; font-size:11.5px; }

/* grids */
.bgmag .g3{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.bgmag .g4{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }

/* GUIDES (with SVG illustrations) */
.bgmag .guide{ overflow:hidden; display:flex; flex-direction:column; }
.bgmag .guide .gimg{ height:128px; display:grid; place-items:center; position:relative; color:var(--indigo); background:linear-gradient(135deg,var(--indigo-soft),#dde6fb); }
.bgmag .guide .gimg.b{ color:var(--green); background:linear-gradient(135deg,#e8f5ef,#cdeede);} .bgmag .guide .gimg.c{ color:var(--gold); background:linear-gradient(135deg,#fbf3df,#f6e6bd);} .bgmag .guide .gimg.d{ color:var(--pink); background:linear-gradient(135deg,#fbeaf2,#f6cfe0);} .bgmag .guide .gimg.e{ color:var(--indigo); background:linear-gradient(135deg,#eef1fc,#d7e0fb);}
.bgmag .guide .gimg svg{ width:56px; height:56px; }
.bgmag .guide .gimg .gp{ position:absolute; top:10px; left:10px; }
.bgmag .guide .gbody{ padding:15px 16px 18px; display:flex; flex-direction:column; flex:1; }
.bgmag .guide h3{ font-family:'Lora',serif; font-size:17.5px; font-weight:600; line-height:1.25; margin:0 0 7px; }
.bgmag .guide p{ font-size:13px; color:var(--ink-soft); margin:0 0 12px; flex:1; }
.bgmag .guide .gmeta{ font-size:11.5px; color:var(--ink-dim); font-weight:600; }

/* REVIEWS — category-row table: category label on the left, brand cards on the right */
.bgmag .revtbl{ display:flex; flex-direction:column; gap:0; border-top:1px solid var(--line); }
.bgmag .revrow{ display:grid; grid-template-columns:200px 1fr; gap:22px; padding:22px 0; border-bottom:1px solid var(--line); align-items:start; }
.bgmag .revcat{ display:flex; flex-direction:column; gap:10px; position:sticky; top:90px; }
.bgmag .revcat .pill{ align-self:flex-start; font-size:12px; }
.bgmag .revcat-all{ font-size:11.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-soft); text-decoration:none; }
.bgmag .revcat-all:hover{ color:var(--indigo); }
.bgmag .revbrands{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.bgmag .revbrand{ display:flex; flex-direction:column; gap:5px; padding:14px 15px; background:#fff; border:1px solid var(--line); border-radius:7px; text-decoration:none; transition:border-color .15s, box-shadow .15s, transform .15s; }
.bgmag .revbrand:hover{ border-color:var(--indigo); box-shadow:0 6px 18px -12px rgba(26,62,181,.5); transform:translateY(-1px); }
.bgmag .rb-head{ display:flex; justify-content:space-between; align-items:baseline; gap:8px; }
.bgmag .rb-name{ font-family:'Lora',serif; font-size:16px; font-weight:600; color:var(--ink); line-height:1.25; }
.bgmag .rb-score{ font-size:11px; font-weight:700; color:var(--indigo); background:var(--indigo-soft); border-radius:99px; padding:3px 9px; white-space:nowrap; }
.bgmag .rb-stars{ color:var(--gold); font-size:12px; letter-spacing:1px; }
.bgmag .rb-desc{ font-size:12.5px; color:var(--ink-soft); line-height:1.5; }
.bgmag .rb-link{ margin-top:auto; font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--indigo); }
.bgmag .revbrand:hover .rb-link{ text-decoration:underline; }
.bgmag .revempty{ font-size:12.5px; color:var(--ink-dim); margin:0; align-self:center; }

/* BONUSES + PROMO CODE CARDS */
.bgmag .promos{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.bgmag .promo{ padding:18px 18px 16px; display:flex; flex-direction:column; }
.bgmag .promo .ptop{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px; }
.bgmag .promo .pname{ font-family:'Lora',serif; font-size:18px; font-weight:600; }
.bgmag .promo .poffer{ font-size:14px; font-weight:700; color:var(--ink); margin:0 0 8px; line-height:1.4; }
.bgmag .promo .pterms{ font-size:11px; color:var(--ink-soft); line-height:1.5; margin:0 0 14px; flex:1; }
.bgmag .promo .pterms b{ color:var(--ink-mid); }
.bgmag .promo .pcode{ display:flex; align-items:stretch; gap:0; margin-bottom:10px; border:1px dashed var(--indigo); border-radius:6px; overflow:hidden; }
.bgmag .promo .pcode .cval{ flex:1; font-family:'SFMono-Regular',Menlo,Consolas,monospace; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--indigo); padding:10px 12px; font-size:13px; display:flex; align-items:center; }
.bgmag .promo .pcode .ccopy{ background:var(--indigo-soft); color:var(--indigo); border:none; border-left:1px dashed var(--indigo); font-family:'Inter',sans-serif; font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:0 14px; cursor:pointer; transition:.15s; white-space:nowrap; }
.bgmag .promo .pcode .ccopy:hover{ background:var(--indigo); color:#fff; }
.bgmag .promo .pcode.nocode .cval{ color:var(--ink-soft); }
.bgmag .promo .pcta{ display:flex; align-items:center; justify-content:center; gap:8px; background:var(--indigo); color:#fff; font-size:12.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; padding:12px; border-radius:6px; transition:.2s; }
.bgmag .promo .pcta:hover{ background:var(--indigo-bright); transform:translateY(-1px); }

/* FINDER (faithful preview of your existing quiz) */
.bgmag .bguk{ background:#f7f7f8; border:1px solid var(--line); border-radius:8px; padding:30px; }
.bgmag .bguk .bq{ font-family:'Lora',serif; font-size:24px; font-weight:500; margin:0 0 8px; }
.bgmag .bguk .bqh{ font-size:14px; color:var(--ink-soft); margin:0 0 20px; max-width:680px; }
.bgmag .bguk .ptrack{ height:2px; background:var(--line); position:relative; margin-bottom:10px; }
.bgmag .bguk .pfill{ position:absolute; inset:0 auto 0 0; width:16.6%; background:var(--indigo); }
.bgmag .bguk .psteps{ display:grid; grid-template-columns:repeat(6,1fr); font-size:10.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-dim); margin-bottom:24px; }
.bgmag .bguk .psteps b:first-child{ color:var(--indigo); }
.bgmag .bguk .opts{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:12px; }
.bgmag .bguk .opt{ background:#fff; border:1px solid var(--line); border-radius:6px; padding:18px 20px; cursor:pointer; transition:.15s; }
.bgmag .bguk .opt:hover{ border-color:var(--indigo); background:var(--surface-soft); }
.bgmag .bguk .opt .ol{ display:block; font-size:16px; font-weight:700; margin-bottom:3px; }
.bgmag .bguk .opt .od{ display:block; font-size:13px; color:var(--ink-soft); }
.bgmag .bguk .bnav{ display:flex; justify-content:space-between; margin-top:24px; padding-top:18px; border-top:1px solid var(--line); font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-soft); }

/* INTERVIEWS — with featured images */
.bgmag .iv{ display:flex; flex-direction:column; overflow:hidden; }
.bgmag .iv .iv-img{ height:150px; overflow:hidden; background:linear-gradient(135deg,var(--pink-soft),#f6cfe0); }
.bgmag .iv .iv-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.bgmag .iv .iv-b{ padding:14px 16px 16px; display:flex; flex-direction:column; gap:8px; flex:1; }
.bgmag .iv .iv-cat{ font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--pink); }
.bgmag .iv h3{ font-family:'Lora',serif; font-size:16px; font-weight:600; line-height:1.3; margin:0; flex:1; }
.bgmag .iv .iv-meta{ font-size:11.5px; color:var(--ink-dim); }
.bgmag .iv-more{ display:grid; place-items:center; text-align:center; min-height:150px; background:linear-gradient(135deg,var(--indigo),var(--indigo-bright)); color:#fff; }
.bgmag .iv-more span{ font-family:'Lora',serif; font-size:17px; font-weight:600; }

/* NEW SITES */
.bgmag .newgrid{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.bgmag .ncard{ background:var(--surface-soft); border:1px solid var(--line); border-radius:4px; padding:15px; }
.bgmag .ncard h4{ font-family:'Lora',serif; font-size:15px; font-weight:600; margin:6px 0 3px; }
.bgmag .ncard .ncat{ font-size:10.5px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-dim); }
.bgmag .ncard p{ font-size:12px; color:var(--ink-soft); margin:6px 0 0; }

/* AUTHORS */
.bgmag .authors{ display:grid; grid-template-columns:repeat(5,1fr); gap:14px; }
.bgmag .author{ padding:20px 16px; text-align:center; }
.bgmag .author .av{ width:64px; height:64px; border-radius:50%; margin:0 auto 12px; background:linear-gradient(135deg,var(--indigo),var(--indigo-bright)); color:#fff; display:grid; place-items:center; font-family:'Lora',serif; font-size:24px; font-weight:600; overflow:hidden; }
.bgmag .author .av img{ width:100%; height:100%; object-fit:cover; display:block; border-radius:50%; }
.bgmag .author .av.has-photo{ background:var(--surface-soft); }
.bgmag .author h4{ font-family:'Lora',serif; font-size:16px; font-weight:600; margin:0 0 2px; }
.bgmag .author .role{ font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--indigo); margin-bottom:8px; }
.bgmag .author p{ font-size:12px; color:var(--ink-soft); margin:0; line-height:1.5; }

/* ABOUT */
.bgmag .about{ background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:34px; }
.bgmag .about-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; margin-top:8px; }
.bgmag .about-grid h4{ font-family:'Lora',serif; font-size:18px; font-weight:600; margin:0 0 8px; }
.bgmag .about-grid h4 .n{ color:var(--indigo); font-style:italic; margin-right:6px; }
.bgmag .about-grid p{ font-size:13px; color:var(--ink-mid); margin:0; }
.bgmag .about-lead{ font-size:16px; color:var(--ink-mid); max-width:820px; margin:6px 0 0; } .bgmag .about-lead b{ color:var(--ink); }

/* FAQ */
.bgmag .faq details{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); margin-bottom:10px; padding:0 20px; }
.bgmag .faq details[open]{ border-color:var(--line-strong); }
.bgmag .faq summary{ list-style:none; cursor:pointer; padding:16px 0; font-family:'Lora',serif; font-size:17px; font-weight:600; display:flex; justify-content:space-between; align-items:center; gap:12px; }
.bgmag .faq summary::-webkit-details-marker{ display:none; }
.bgmag .faq summary::after{ content:"+"; font-size:22px; color:var(--indigo); font-weight:400; }
.bgmag .faq details[open] summary::after{ content:"–"; }
.bgmag .faq .ans{ padding:0 0 18px; font-size:14px; color:var(--ink-mid); line-height:1.65; } .bgmag .faq .ans a{ color:var(--indigo); text-decoration:underline; } .bgmag .faq .ans b{ color:var(--ink); }

/* HOW-TO */
.bgmag .howto{ background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:34px; }
.bgmag .howsteps{ list-style:none; counter-reset:hs; padding:0; margin:14px 0 0; display:grid; grid-template-columns:repeat(2,1fr); gap:16px 28px; }
.bgmag .howsteps li{ counter-increment:hs; position:relative; padding-left:52px; min-height:40px; }
.bgmag .howsteps li::before{ content:counter(hs); position:absolute; left:0; top:0; width:36px; height:36px; border-radius:50%; background:var(--indigo); color:#fff; font-family:'Lora',serif; font-weight:600; font-size:17px; display:grid; place-items:center; }
.bgmag .howsteps h4{ font-family:'Lora',serif; font-size:16.5px; font-weight:600; margin:2px 0 4px; }
.bgmag .howsteps p{ font-size:13px; color:var(--ink-soft); margin:0; line-height:1.55; }
/* ABOUT extras */
.bgmag .featured-in{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; margin:18px 0 2px; font-size:11px; }
.bgmag .featured-in .fi-label{ font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-dim); }
.bgmag .featured-in b{ color:var(--ink-mid); font-weight:600; }
.bgmag .founder-quote{ margin:22px 0 0; padding:18px 22px; border-left:3px solid var(--gold); background:var(--gold-soft); border-radius:0 6px 6px 0; }
.bgmag .founder-quote p{ font-family:'Lora',serif; font-style:italic; font-size:16px; color:var(--ink); margin:0 0 8px; line-height:1.5; }
.bgmag .founder-quote cite{ font-style:normal; font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--gold); }
/* About — founder story / press panel */
.bgmag .about-story{ display:grid; grid-template-columns:1.1fr .9fr; gap:26px; align-items:start; margin-top:24px; padding-top:24px; border-top:1px solid var(--line); }
.bgmag .story-title{ font-family:'Lora',serif; font-size:20px; font-weight:600; margin:0 0 10px; }
.bgmag .story-text p{ font-size:14px; color:var(--ink-mid); line-height:1.6; margin:0 0 12px; } .bgmag .story-text p b{ color:var(--ink); }
.bgmag .story-link{ display:inline-block; font-size:12px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--indigo); }
.bgmag .story-link:hover{ text-decoration:underline; }
.bgmag .story-figs{ display:grid; gap:14px; }
.bgmag .story-figs figure{ margin:0; border:1px solid var(--line); border-radius:8px; overflow:hidden; background:#fff; }
.bgmag .story-figs img{ display:block; width:100%; height:190px; object-fit:cover; object-position:center; }
.bgmag .story-figs figcaption{ font-size:11.5px; color:var(--ink-soft); line-height:1.45; padding:9px 12px; border-top:1px solid var(--line); background:var(--surface-soft); }
@media (max-width:640px){ .bgmag .howsteps{ grid-template-columns:1fr; } }
/* HOW-TO note */
.bgmag .howto-note{ margin:14px 0 4px; padding:14px 16px; background:var(--gold-soft); border-left:3px solid var(--gold); border-radius:0 6px 6px 0; font-size:13.5px; color:var(--ink-mid); line-height:1.6; }
.bgmag .howto-note b{ color:var(--ink); }
/* NEW SITES editorial */
.bgmag .nsx{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.bgmag .nsx-card{ padding:18px; display:flex; flex-direction:column; }
.bgmag .nsx-h{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px; }
.bgmag .nsx-h h4{ font-family:'Lora',serif; font-size:18px; font-weight:600; margin:0; }
.bgmag .nsx-h h4 a{ color:var(--ink); text-decoration:none; } .bgmag .nsx-h h4 a:hover{ color:var(--indigo); }
.bgmag .nsx-meta{ display:flex; flex-direction:column; gap:2px; font-size:12px; color:var(--ink-soft); margin-bottom:10px; padding-bottom:10px; border-bottom:1px solid var(--line); }
.bgmag .nsx-meta b{ color:var(--ink-mid); font-weight:700; letter-spacing:.02em; margin-right:4px; }
.bgmag .nsx-new{ list-style:none; margin:0; padding:0; display:grid; gap:6px; flex:1 1 auto; }
.bgmag .nsx-review{ display:inline-block; margin-top:12px; padding-top:12px; border-top:1px solid var(--line); width:100%; font-size:12px; font-weight:700; letter-spacing:.03em; text-transform:uppercase; color:var(--indigo); text-decoration:none; }
.bgmag .nsx-review:hover{ text-decoration:underline; }
.bgmag .nsx-new li{ position:relative; padding-left:18px; font-size:13px; color:var(--ink-mid); line-height:1.45; }
.bgmag .nsx-new li::before{ content:"+"; position:absolute; left:0; top:0; color:var(--green); font-weight:700; }
.bgmag .nsx-foot{ display:flex; gap:20px; flex-wrap:wrap; margin-top:14px; }
/* APPS — per-platform ratings, verified review, pros/cons */
.bgmag .appgrid{ display:grid; grid-template-columns:repeat(5,1fr); gap:12px; }
.bgmag .appcard{ padding:16px; display:flex; flex-direction:column; align-items:stretch; }
.bgmag .app-head{ display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.bgmag .app-logo{ width:44px; height:44px; flex:0 0 44px; border-radius:11px; overflow:hidden; border:1px solid var(--line); background:#fff; }
.bgmag .app-logo img{ width:100%; height:100%; object-fit:cover; display:block; }
.bgmag .app-head h4{ font-family:'Lora',serif; font-size:17px; font-weight:600; margin:0; line-height:1.1; }
.bgmag .app-rates{ display:flex; gap:8px; margin-bottom:10px; }
.bgmag .app-store{ flex:1; display:flex; flex-direction:column; align-items:flex-start; gap:1px; background:var(--surface-soft); border:1px solid var(--line); border-radius:6px; padding:7px 9px; }
.bgmag .app-store .asi{ display:inline-flex; }
.bgmag .app-store .asi svg{ width:14px; height:14px; color:var(--ink-mid); }
.bgmag .app-store b{ font-size:15px; font-weight:800; color:var(--indigo); line-height:1.1; }
.bgmag .app-store small{ font-size:9.5px; font-weight:600; letter-spacing:.02em; color:var(--ink-dim); text-transform:uppercase; }
.bgmag .app-review{ font-size:12.5px; color:var(--ink-soft); line-height:1.5; margin:0 0 10px; }
.bgmag .app-pros, .bgmag .app-cons{ list-style:none; margin:0 0 8px; padding:0; display:grid; gap:4px; }
.bgmag .app-pros li, .bgmag .app-cons li{ position:relative; padding-left:17px; font-size:12px; line-height:1.4; color:var(--ink-mid); }
.bgmag .app-pros li::before{ content:"✓"; position:absolute; left:0; top:0; color:var(--green); font-weight:800; }
.bgmag .app-cons li{ color:var(--ink-soft); }
.bgmag .app-cons li::before{ content:"✕"; position:absolute; left:0; top:0; color:var(--pink); font-weight:800; }
.bgmag .app-cta{ margin-top:auto; align-self:stretch; text-align:center; background:var(--indigo); color:#fff!important; font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:9px 12px; border-radius:5px; transition:background .15s,transform .15s; }
.bgmag .app-cta:hover{ background:var(--indigo-bright); transform:translateY(-1px); }
/* FREE BETS */
.bgmag .freebets-lead{ font-size:15px; color:var(--ink-mid); line-height:1.7; margin:0 0 16px; max-width:920px; }
.bgmag .freebets-lead b{ color:var(--ink); }
.bgmag .freebets-foot{ display:flex; gap:12px; flex-wrap:wrap; }
@media (max-width:960px){ .bgmag .nsx{ grid-template-columns:repeat(2,1fr); } .bgmag .appgrid{ grid-template-columns:repeat(3,1fr); }
  .bgmag .revrow{ grid-template-columns:1fr; gap:12px; } .bgmag .revcat{ flex-direction:row; align-items:center; justify-content:space-between; position:static; }
  .bgmag .revbrands{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .bgmag .nsx{ grid-template-columns:1fr; } .bgmag .appgrid{ grid-template-columns:1fr; }
  .bgmag .revbrands{ grid-template-columns:1fr; } }
.bgmag .rgfoot{ margin-top:40px; padding:18px 20px; background:var(--indigo-soft); border-left:3px solid var(--indigo); border-radius:3px; font-size:12.5px; color:var(--ink-mid); line-height:1.65; } .bgmag .rgfoot b{ color:var(--ink); }
.bgmag .blocknote{ font-size:11px; color:var(--ink-dim); text-align:center; margin:6px 0 0; }

@media (max-width:960px){
  .bgmag .hero{ grid-template-columns:1fr; } .bgmag .odds-grid{ grid-template-columns:repeat(2,1fr); }
  .bgmag .g3,.bgmag .g4,.bgmag .newgrid,.bgmag .promos{ grid-template-columns:repeat(2,1fr); }
  .bgmag .authors{ grid-template-columns:repeat(3,1fr); } .bgmag .about-grid{ grid-template-columns:repeat(2,1fr); }
  .bgmag .howsteps{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:640px){
  .bgmag{ width:100%; max-width:100%; margin:0; padding:0 14px; }
.bgmag img{ max-width:100%; }
  .bgmag > section{ margin:0 0 28px !important; }
  .bgmag .hero{ margin:8px 0 6px; gap:18px; }
  .bgmag .odds{ display:block !important; } .bgmag .odds-grid{ display:grid !important; }
  .bgmag .hero-feature{ min-height:240px; padding:22px; }
  .bgmag .sec-head{ gap:8px; } .bgmag .see-all{ font-size:11.5px; }
  .bgmag .odds{ padding:18px 16px; } .bgmag .about, .bgmag .howto{ padding:24px 20px; }
  .bgmag .odds-grid,.bgmag .g3,.bgmag .g4,.bgmag .newgrid,.bgmag .promos,.bgmag .authors,.bgmag .about-grid,.bgmag .howsteps{ grid-template-columns:1fr; }
  .bgmag .psteps{ font-size:8.5px; letter-spacing:0; }
  .bgmag .bguk{ padding:22px 18px; } .bgmag .bguk .opts{ grid-template-columns:1fr; }
  .bgmag .founder-quote p{ font-size:15px; }
  .bgmag .about-story{ grid-template-columns:1fr; gap:18px; }
  .bgmag .featured-in{ font-size:10.5px; }
}
@media (max-width:380px){
  .bgmag .psteps span:not(:first-child){ display:none; } /* keep current step label only */
  .bgmag .race .rn{ min-height:0; }
}

/* ===== Embedded Top 10 (.bgtop) and Pick (.bghpb) blocks ===== */
.bgtop-list{--bgtop-surface:#fff;--bgtop-surface-hover:#fafbff;--bgtop-ink:#0b0b1a;--bgtop-ink-mid:#3a3a4d;--bgtop-ink-soft:#6b6b7c;--bgtop-ink-dim:#9a9aa8;--bgtop-line:#e5e5ec;--bgtop-line-strong:#d0d0db;--bgtop-indigo:#1a3eb5;--bgtop-indigo-bright:#2952d1;--bgtop-indigo-soft:#eef1fc;--bgtop-gold:#b08515;--bgtop-green:#0f7a4a;--bgtop-green-soft:#e8f5ef;--bgtop-gold-soft:#fbf3df;font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI','Helvetica Neue',Arial,sans-serif;color:var(--bgtop-ink);max-width:940px;margin:0 auto;line-height:1.6;-webkit-font-smoothing:antialiased}
.bgtop-list *{box-sizing:border-box}.bgtop-list a{text-decoration:none}
.bgtop-ol{list-style:none;padding:0;margin:0 0 24px;display:grid;gap:12px}
.bgtop-item{display:grid;grid-template-columns:64px 1fr auto;grid-template-areas:"num body cta" "num terms cta";column-gap:20px;row-gap:10px;align-items:start;background:var(--bgtop-surface);border:1px solid var(--bgtop-line);border-radius:6px;padding:22px 24px;transition:border-color .2s,background .2s}
.bgtop-item:hover{border-color:var(--bgtop-line-strong);background:var(--bgtop-surface-hover)}
.bgtop-item.bgtop-best{border-color:var(--bgtop-indigo);box-shadow:0 0 0 1px var(--bgtop-indigo) inset;background:linear-gradient(180deg,var(--bgtop-indigo-soft) 0%,var(--bgtop-surface) 100%)}
.bgtop-num{grid-area:num;font-family:'Lora',Georgia,serif;font-size:52px;font-weight:500;font-style:italic;line-height:1;color:var(--bgtop-indigo);letter-spacing:-.03em;padding-top:2px}
.bgtop-item.bgtop-best .bgtop-num{font-weight:700}
.bgtop-body{grid-area:body;min-width:0}
.bgtop-row{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:4px}
.bgtop-name{font-family:'Lora',Georgia,serif;font-size:22px;font-weight:600;margin:0;letter-spacing:-.005em;color:var(--bgtop-ink);line-height:1.2}
.bgtop-name a{color:inherit;border-bottom:1px solid transparent;transition:.2s}
.bgtop-name a:hover{color:var(--bgtop-indigo);border-bottom-color:var(--bgtop-indigo)}
.bgtop-flag{display:inline-block;font-family:'Inter',sans-serif;font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:3px 9px;border-radius:3px;white-space:nowrap;background:var(--bgtop-gold-soft);color:var(--bgtop-gold);border:1px solid rgba(176,133,21,.25)}
.bgtop-flag-alt{background:var(--bgtop-indigo-soft);color:var(--bgtop-indigo);border-color:rgba(26,62,181,.2)}
.bgtop-flag-new{background:var(--bgtop-green-soft);color:var(--bgtop-green);border-color:rgba(15,122,74,.25)}
.bgtop-cat{display:block;font-family:'Inter',sans-serif;font-size:11.5px;font-weight:600;color:var(--bgtop-ink-dim);letter-spacing:.04em;text-transform:uppercase;margin-bottom:10px}
.bgtop-desc{font-family:'Inter',sans-serif;font-size:14.5px;color:var(--bgtop-ink-mid);margin:0 0 14px;line-height:1.6}
.bgtop-offer{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.bgtop-offer-text{font-family:'Inter',sans-serif;font-size:14px;font-weight:600;color:var(--bgtop-ink)}
.bgtop-code{font-family:'SFMono-Regular',Menlo,Consolas,monospace;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;border:1px dashed var(--bgtop-indigo);color:var(--bgtop-indigo);border-radius:3px;background:transparent}
.bgtop-terms{grid-area:terms;font-family:'Inter',sans-serif;font-size:11.5px;color:var(--bgtop-ink-soft);line-height:1.55;margin:0;padding-top:10px;border-top:1px dashed var(--bgtop-line)}
.bgtop-terms strong{color:var(--bgtop-ink-mid);font-weight:700}
.bgtop-list .bgtop-cta{grid-area:cta;display:inline-flex!important;align-items:center!important;justify-content:center!important;background:var(--bgtop-indigo)!important;color:#fff!important;font-family:'Inter',sans-serif!important;font-size:13px!important;font-weight:700!important;letter-spacing:.1em!important;text-transform:uppercase!important;padding:14px 26px!important;border-radius:4px!important;border:none!important;white-space:nowrap!important;min-width:140px;text-align:center!important;transition:.2s;align-self:center;text-decoration:none!important;line-height:1.2!important;height:auto!important;width:auto!important}
.bgtop-list .bgtop-cta:hover{background:var(--bgtop-indigo-bright)!important;transform:translateY(-1px)}
.bgtop-foot{font-family:'Inter',sans-serif;font-size:12px;color:var(--bgtop-ink-soft);line-height:1.6;margin:0;padding:14px 16px;background:var(--bgtop-indigo-soft);border-left:3px solid var(--bgtop-indigo);border-radius:3px}
.bgtop-foot strong{color:var(--bgtop-ink)}
@media (max-width:820px){.bgtop-item{grid-template-columns:56px 1fr auto;column-gap:16px;padding:20px}.bgtop-num{font-size:44px}.bgtop-list .bgtop-cta{padding:11px 18px!important;font-size:11.5px!important;min-width:110px}}
@media (max-width:640px){.bgtop-item{grid-template-columns:1fr;grid-template-areas:"num" "body" "cta" "terms";row-gap:12px;padding:20px}.bgtop-num{font-size:38px;padding-top:0}.bgtop-name{font-size:19px}.bgtop-list .bgtop-cta{width:100%!important;min-width:0}}



.bghpb{--bghpb-surface:#fff;--bghpb-surface-soft:#fafbff;--bghpb-ink:#0b0b1a;--bghpb-ink-mid:#3a3a4d;--bghpb-ink-soft:#6b6b7c;--bghpb-ink-dim:#9a9aa8;--bghpb-line:#e5e5ec;--bghpb-line-strong:#d0d0db;--bghpb-indigo:#1a3eb5;--bghpb-indigo-bright:#2952d1;--bghpb-indigo-soft:#eef1fc;--bghpb-gold:#b08515;--bghpb-gold-soft:#fbf3df;font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI','Helvetica Neue',Arial,sans-serif;color:var(--bghpb-ink);max-width:1180px;margin:0 auto;line-height:1.6;-webkit-font-smoothing:antialiased}
.bghpb *{box-sizing:border-box}.bghpb a{text-decoration:none}
.bghpb-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.bghpb-pick{background:var(--bghpb-surface);border:1px solid var(--bghpb-line);border-radius:6px;padding:26px 24px;position:relative;display:flex;flex-direction:column;transition:border-color .2s}
.bghpb-pick:hover{border-color:var(--bghpb-line-strong)}
.bghpb-pick-feature{background:linear-gradient(180deg,var(--bghpb-indigo-soft) 0%,var(--bghpb-surface) 60%);border-color:var(--bghpb-indigo);box-shadow:0 0 0 1px var(--bghpb-indigo) inset}
.bghpb-ribbon{display:inline-block;align-self:flex-start;font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;background:var(--bghpb-indigo-soft);color:var(--bghpb-indigo);border:1px solid rgba(26,62,181,.2);padding:4px 10px;border-radius:3px;margin-bottom:14px}
.bghpb-ribbon-feature{background:var(--bghpb-gold-soft);color:var(--bghpb-gold);border-color:rgba(176,133,21,.3)}
.bghpb-pick-title{font-family:'Lora',Georgia,serif;font-size:22px;font-weight:500;line-height:1.2;letter-spacing:-.005em;margin:0 0 10px;color:var(--bghpb-ink)}
.bghpb-pick-title em{font-style:italic;color:var(--bghpb-indigo);font-weight:500}
.bghpb-pick-intro{font-size:13.5px;color:var(--bghpb-ink-soft);margin:0 0 18px;line-height:1.55}
.bghpb-feature-name{font-family:'Lora',Georgia,serif;font-size:36px;font-weight:700;color:var(--bghpb-indigo);margin:4px 0 14px;letter-spacing:-.01em;line-height:1}
.bghpb-mini{list-style:none;padding:0;margin:0 0 16px;display:grid;gap:10px}
.bghpb-mini li{display:grid;grid-template-columns:28px 1fr;gap:12px;align-items:baseline;padding-bottom:10px;border-bottom:1px solid var(--bghpb-line)}
.bghpb-mini li:last-child{border-bottom:none;padding-bottom:0}
.bghpb-mini-rank{font-family:'Lora',Georgia,serif;font-size:22px;font-style:italic;font-weight:500;color:var(--bghpb-indigo);line-height:1}
.bghpb-mini-body{min-width:0}
.bghpb-mini-name{display:block;font-size:15px;font-weight:700;color:var(--bghpb-ink);letter-spacing:-.005em;line-height:1.3;margin-bottom:2px;border-bottom:1px solid transparent;transition:.2s}
.bghpb-mini-name:hover{color:var(--bghpb-indigo);border-bottom-color:var(--bghpb-indigo)}
.bghpb-mini-desc{display:block;font-size:13px;color:var(--bghpb-ink-soft);line-height:1.5}
.bghpb-bullets{list-style:none;padding:0;margin:0 0 16px}
.bghpb-bullets li{position:relative;padding:8px 0 8px 22px;font-size:14px;color:var(--bghpb-ink-mid);line-height:1.55;border-bottom:1px solid var(--bghpb-line)}
.bghpb-bullets li:last-child{border-bottom:none}
.bghpb-bullets li::before{content:"";position:absolute;left:0;top:16px;width:8px;height:8px;border-radius:50%;background:var(--bghpb-indigo)}
.bghpb-bullets strong{color:var(--bghpb-ink);font-weight:700}
.bghpb-pick-foot{font-size:13px;color:var(--bghpb-ink-mid);margin:auto 0 14px;padding:14px 16px;background:var(--bghpb-indigo-soft);border-left:3px solid var(--bghpb-indigo);border-radius:3px;line-height:1.55}
.bghpb-pick-foot strong{color:var(--bghpb-ink);font-weight:700}
.bghpb-see-all{display:inline-flex;align-items:center;font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--bghpb-indigo)!important;border-bottom:1px solid transparent;padding:8px 0 2px;transition:.2s;align-self:flex-start}
.bghpb-see-all:hover{border-bottom-color:var(--bghpb-indigo);transform:translateX(2px)}
.bghpb-feature-cta{display:inline-flex!important;align-items:center!important;justify-content:center!important;background:var(--bghpb-indigo)!important;color:#fff!important;font-size:13px!important;font-weight:700!important;letter-spacing:.1em!important;text-transform:uppercase!important;padding:13px 22px!important;border-radius:4px!important;border:none!important;margin-top:14px;align-self:flex-start;transition:.2s;text-decoration:none!important;line-height:1.2!important}
.bghpb-feature-cta:hover{background:var(--bghpb-indigo-bright)!important;transform:translateY(-1px)}
@media (max-width:980px){.bghpb-cols{grid-template-columns:1fr 1fr}.bghpb-pick-feature{grid-column:1/-1}}
@media (max-width:640px){.bghpb-cols{grid-template-columns:1fr;gap:14px}.bghpb-pick{padding:22px 20px}.bghpb-pick-feature{grid-column:auto}.bghpb-feature-name{font-size:32px}}

/* === Home page: hide theme breadcrumb + page title, collapse the gap === */
body.bg-home-page .bg-breadcrumbs-block,
body.bg-home-page .bg-page-header{ display:none !important; }
body.bg-home-page #content.bg-main-content{ margin-top:0 !important; padding-top:0 !important; }
body.bg-home-page #primary.bg-content-area{ margin-top:0 !important; padding-top:0 !important; }
body.bg-home-page .bg-entry__content-wrap{ margin-top:0 !important; padding-top:0 !important; }
body.bg-home-page .bg-entry__content-wrap > .entry-content{ margin-top:0 !important; padding-top:0 !important; }

/* Home page: the theme caps content at 945px via ":root .bg-sidebar-disabled" while
   .bg-container is 1320px — leaving big side gaps. Let the content fill the container
   (matching the header) with a higher-specificity override. */
body.bg-home-page.bg-sidebar-disabled{ --bg-entry-content-width:100%; }
body.bg-home-page .bg-sidebar-disabled .entry-content,
body.bg-home-page .entry-content,
body.bg-home-page .bg-entry__content-wrap,
body.bg-home-page #primary.bg-content-area{
  max-width:100% !important; width:100% !important;
  margin-left:0 !important; margin-right:0 !important;
}
/* Neutralise the theme's 32px child rhythm on our section wrappers so spacing stays single-source. */
body.bg-home-page .entry-content > .bgmag{ margin-top:0 !important; margin-bottom:0 !important; }

/* Mobile: kill any residual top padding/margin the theme adds above the content so the
   hero eyebrow sits close under the header (no large white gap). */
@media (max-width:640px){
  body.bg-home-page .bg-site-content,
  body.bg-home-page #content.bg-main-content,
  body.bg-home-page #primary.bg-content-area,
  body.bg-home-page .bg-entry__content-wrap,
  body.bg-home-page .bg-entry__content-wrap > .entry-content{ margin-top:0 !important; padding-top:0 !important; }
}

/* === Interviews → Latest News band === */
.bgmag .iv-newsband{ margin-top:28px; padding-top:24px; border-top:1px solid var(--line); }
.bgmag .iv-newsband-head{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:14px; flex-wrap:wrap; }
.bgmag .iv-newsband-title{ font-family:'Lora',serif; font-size:21px; font-weight:600; line-height:1.2; margin:0; }
.bgmag .iv-newsband-title em{ font-style:italic; color:var(--indigo); }
.bgmag .iv.iv-news .iv-img{ background:linear-gradient(135deg,var(--indigo-soft),#cfd9f6); }
.bgmag .iv.iv-news .iv-cat{ color:var(--indigo); }

/* === Mobile bottom tab bar (homepage only; rendered in footer, outside .bgmag) === */
.bg-home-tabbar{ display:none; }
/* Smooth jump + offset so the sticky header doesn't cover the section heading */
html:has(body.bg-home-page){ scroll-behavior:smooth; }
.bgmag > section[id]{ scroll-margin-top:calc(var(--bg-header-height, 64px) + 16px); }
@media (max-width:820px){
  .bg-home-tabbar{
    display:flex; position:fixed; left:0; right:0; bottom:0; z-index:9990;
    justify-content:space-around; align-items:stretch;
    background:#fff; border-top:1px solid #e5e5ec;
    box-shadow:0 -2px 14px rgba(11,11,26,.10);
    padding:6px 4px calc(6px + env(safe-area-inset-bottom, 0px));
    font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
  }
  .bg-home-tabbar a{
    flex:1 1 0; min-width:0; display:flex; flex-direction:column; align-items:center; gap:3px;
    text-decoration:none; color:#3a3a4d; font-size:10.5px; font-weight:600; line-height:1;
    padding:4px 2px; border-radius:9px; -webkit-tap-highlight-color:transparent;
  }
  .bg-home-tabbar a:active{ background:#eef1fc; }
  .bg-home-tabbar a svg{ width:22px; height:22px; stroke:#1a3eb5; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
  .bg-home-tabbar a span{ max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  /* keep the footer clear of the fixed bar */
  body.bg-home-page{ padding-bottom:62px; }
}

/* ===== Opinion & Analysis (v2.4.7) ===== */
.bgmag .see-all-group{ display:flex; gap:16px; flex-wrap:wrap; align-items:center; }
.bgmag .opin-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.bgmag .opin{ overflow:hidden; display:flex; flex-direction:column; }
.bgmag .opin .ph{ aspect-ratio:3/2; position:relative; overflow:hidden; background:linear-gradient(135deg,var(--indigo-soft),#dde6fb); }
.bgmag .opin .ph img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .25s ease; }
.bgmag .opin:hover .ph img{ transform:scale(1.03); }
.bgmag .opin .ph.fallback{ display:grid; place-items:center; }
.bgmag .opin .ph.fallback .mono{ font-family:'Lora',serif; font-style:italic; font-weight:700; font-size:30px; color:rgba(26,62,181,.22); }
.bgmag .opin .ph .tag{ position:absolute; top:10px; left:10px; font-size:10.5px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; padding:4px 11px; border-radius:999px; }
.bgmag .opin .ph .tag.op{ background:var(--gold); color:#1a1400; }
.bgmag .opin .ph .tag.an{ background:var(--indigo); color:#fff; }
.bgmag .opin .obody{ padding:15px 16px 18px; display:flex; flex-direction:column; flex:1; }
.bgmag .opin h3{ font-family:'Lora',serif; font-size:18px; font-weight:600; line-height:1.25; margin:0 0 7px; }
.bgmag .opin p{ font-size:13px; color:var(--ink-soft); margin:0 0 12px; flex:1; }
.bgmag .opin .ometa{ font-size:11.5px; color:var(--ink-dim); font-weight:600; }
@media(max-width:760px){ .bgmag .opin-grid{ grid-template-columns:1fr; } }

/* ============================================================
   DARK MODE (v2.4.8)
   Follows the theme's manual scheme toggle, which sets
   data-scheme="dark" on <html>/<body> (cookie-driven).
   We re-point the block's design tokens; most surfaces, text,
   borders and accents use these vars and flip automatically.
   ============================================================ */
[data-scheme="dark"] .bgmag,
[data-site-scheme="dark"] .bgmag{
  --bg:#0c0e1c; --surface:#161a2c; --surface-soft:#1b2036;
  --ink:#f2f3fa; --ink-mid:#cdd0e0; --ink-soft:#a7adc4; --ink-dim:#7e84a0;
  --line:#2a2f47; --line-strong:#3a4163;
  --indigo:#9aa6ff; --indigo-bright:#b4bdff; --indigo-deep:#7b8af0; --indigo-soft:#222746;
  --gold:#e9b949; --gold-soft:#2b2613;
  --green:#3ecf8e; --green-soft:#15241d; --pink:#e974ad; --pink-soft:#2a1622;
}
/* Embedded Top-10 block — has its own token set */
[data-scheme="dark"] .bgtop-list,
[data-site-scheme="dark"] .bgtop-list{
  --bgtop-surface:#161a2c; --bgtop-surface-hover:#1b2036; --bgtop-ink:#f2f3fa;
  --bgtop-ink-mid:#cdd0e0; --bgtop-ink-soft:#a7adc4; --bgtop-ink-dim:#7e84a0;
  --bgtop-line:#2a2f47; --bgtop-indigo:#9aa6ff; --bgtop-indigo-soft:#222746; --bgtop-gold:#e9b949;
}
/* Embedded homepage-bonuses block — has its own token set */
[data-scheme="dark"] .bghpb,
[data-site-scheme="dark"] .bghpb{
  --bghpb-surface:#161a2c; --bghpb-surface-soft:#1b2036; --bghpb-ink:#f2f3fa;
  --bghpb-ink-mid:#cdd0e0; --bghpb-ink-soft:#a7adc4; --bghpb-ink-dim:#7e84a0;
  --bghpb-line:#2a2f47; --bghpb-indigo:#9aa6ff; --bghpb-indigo-soft:#222746; --bghpb-gold:#e9b949;
}
/* Targeted fixes where colours were hardcoded (bypass the vars) */
[data-scheme="dark"] .bgmag .revbrand,
[data-scheme="dark"] .bgmag .bguk .opt,
[data-scheme="dark"] .bgmag .story-figs figure{ background:var(--surface); }
[data-scheme="dark"] .bgmag .bguk{ background:var(--surface-soft); }
[data-scheme="dark"] .bgmag .guide .gimg,
[data-scheme="dark"] .bgmag .guide .gimg.b,
[data-scheme="dark"] .bgmag .guide .gimg.c,
[data-scheme="dark"] .bgmag .guide .gimg.d,
[data-scheme="dark"] .bgmag .guide .gimg.e,
[data-scheme="dark"] .bgmag .opin .ph{ background:linear-gradient(135deg,#222746,#1a1f38); }
[data-scheme="dark"] .bgmag .opin .ph.fallback .mono{ color:rgba(154,166,255,.30); }
/* Mobile bottom tab-bar (rendered outside .bgmag) */
[data-scheme="dark"] .bg-home-tabbar{ background:#161a2c; border-top-color:#2a2f47; }
[data-scheme="dark"] .bg-home-tabbar a{ color:#cdd0e0; }
[data-scheme="dark"] .bg-home-tabbar a:active{ background:#222746; }
/* Keep app-logo tiles light so brand logos stay legible */
[data-scheme="dark"] .bgmag .app-logo{ background:#fff; }

/* Opinion section — "as quoted by" press strip (v2.4.9) */
.bgmag .opin-press{ margin-top:22px; padding-top:18px; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:8px; }
.bgmag .opin-press-row{ font-size:14px; line-height:1.6; color:var(--ink-mid); }
.bgmag .opin-press-lbl{ font-weight:700; color:var(--ink); margin-right:8px; }
.bgmag .opin-press-links a{ color:var(--ink-mid); text-decoration:none; border-bottom:1px solid var(--line); transition:color .2s,border-color .2s; }
.bgmag .opin-press-links a:hover{ color:var(--indigo); border-bottom-color:var(--indigo); }
.bgmag .opin-press-links a:not(:last-of-type){ margin-right:4px; }
.bgmag .opin-press-links a:not(:last-of-type)::after{ content:" ·"; color:var(--ink-dim); border:0; }
.bgmag .opin-press-more{ color:var(--ink-dim); font-style:italic; margin-left:4px; }