/* ==========================================================================
   components.css — bettingoffice.us mid-fi design (reset 2026-04-17)
   Source of truth: /home/ubuntu/design-midfi/midfi.html

   This file replaces ALL prior design work. The previous Wave 1+2 and
   Wave R0+R1 CSS is discarded per user instruction ("Nous changeons
   complètement la carrosserie"). The mid-fi CSS below is a verbatim
   port of the <style> block from midfi.html, minus the page-picker
   chrome (.chrome, .page switchers) which is design-tool-only.

   The tokens :root { ... } block is the authoritative design system.
   base.css remains only for self-hosted @font-face declarations and
   the body reset.
   ========================================================================== */



/* Visually hidden utility (SEO H1 on home, aria labels, etc.) */
.bo-sr-only{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

:root{
  --primary:#33CC70;
  --primary-60:#70DD96;
  --primary-20:#C2F0D2;
  --primary-tint:rgba(51,204,112,0.12);
  --secondary:#1A262E;
  --secondary-dark:#0F1820;
  --secondary-60:#707A82;
  --secondary-20:#C7CCCF;
  --white:#FFFFFF;
  --paper:#F7F9FA;
  --ink:#101820;
  --danger:#d94848;
  --warn:#e8a93a;
  --sans:"Archivo","Helvetica Neue",Arial,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;
}
*{box-sizing:border-box}
html,body{
	margin:0;padding:0;
	background:var(--paper);color:var(--ink);
	font-family:var(--sans);font-weight:500;line-height:1.55;
	/* Global overflow protection — `clip` is preferred over `hidden`
	   because it preserves position:sticky on descendants. Falls back
	   gracefully to hidden in older browsers. */
	overflow-x:clip;
	max-width:100vw;
}
@supports not (overflow:clip){
	html,body{overflow-x:hidden}
}
a{color:inherit;text-decoration:none}
img,video,iframe,svg{max-width:100%;height:auto;display:block}

/* ─── Page shell ─── */
.bo-page{max-width:1440px;margin:0 auto;background:var(--white);border-left:1px solid var(--secondary-20);border-right:1px solid var(--secondary-20);border-bottom:1px solid var(--secondary-20);padding-bottom:32px}

/* ── Scoreboard strip ── */
.bo-score{background:var(--secondary);color:#fff;display:flex;overflow:hidden;border-bottom:1px solid #000;width:100%;position:sticky;top:0;z-index:30}
.bo-score-label{background:var(--primary);color:var(--secondary);font-weight:700;font-size:11px;letter-spacing:0.1em;padding:10px 14px;display:flex;align-items:center;gap:6px;flex-shrink:0}
.bo-score-label .dot{width:7px;height:7px;border-radius:50%;background:var(--secondary);animation:blink 1.4s infinite}
@keyframes blink{50%{opacity:0.3}}
.bo-score-track{display:flex;overflow:hidden;flex:1;position:relative;min-width:0}
.bo-score-track-inner{display:flex;animation:bo-marquee 90s linear infinite;will-change:transform}
.bo-score-track:hover .bo-score-track-inner{animation-play-state:paused}
@keyframes bo-marquee{
  0%{transform:translateX(0)}
  100%{transform:translateX(-50%)}
}
@media (prefers-reduced-motion:reduce){
  .bo-score-track-inner{animation:none}
  .bo-score-track{overflow-x:auto}
}
.bo-score-g{display:flex;align-items:center;gap:12px;padding:8px 16px;border-right:1px solid #2a363e;flex-shrink:0;font-size:12px}
.bo-score-g .lg{font-family:var(--mono);font-size:10px;color:var(--primary);letter-spacing:0.05em;font-weight:600}
.bo-score-g .teams{display:flex;flex-direction:column;gap:2px}
.bo-score-g .teams .r{display:flex;gap:10px;align-items:center;font-weight:600}
.bo-score-g .teams .r b{min-width:32px}
.bo-score-g .teams .r em{font-style:normal;font-weight:700;min-width:24px;text-align:right}
.bo-score-g .t{font-family:var(--mono);font-size:10px;color:var(--secondary-20);display:flex;align-items:center;gap:4px}
.bo-score-g.live .t{color:var(--primary)}
.bo-score-g.live .t::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--primary);animation:blink 1.4s infinite}

/* ── Header ── */
.bo-header{background:var(--secondary);color:#fff;position:sticky;top:62px;z-index:20;width:100%}
.bo-header-inner{display:flex;align-items:center;gap:18px;padding:12px 24px;min-height:64px;max-width:1440px;margin:0 auto;min-width:0;flex-wrap:wrap}
.bo-header-inner > *{min-width:0}
.bo-tabs{display:flex;gap:6px;flex-wrap:wrap;min-width:0}
.bo-logo{font-family:var(--sans);font-weight:700;font-style:italic;font-size:20px;letter-spacing:-0.02em;color:#fff;white-space:nowrap}
.bo-logo em{color:var(--primary);font-style:italic}
/* Header tabs — !important boost to beat Elementor's `.elementor-button`
   styles that cascade into <button> on Elementor-rendered pages (single
   pick, single sportsbook, etc). */
.bo-header .bo-tab,
button.bo-tab,
a.bo-tab{
	background:transparent !important;
	border:1.5px solid #2a363e !important;
	color:#fff !important;
	font-family:var(--sans) !important;font-weight:600 !important;font-size:13px !important;
	padding:8px 14px !important;border-radius:999px !important;
	cursor:pointer;display:flex !important;align-items:center;gap:8px;
	white-space:nowrap;text-decoration:none !important;
	box-shadow:none !important;line-height:1.4 !important;
	text-transform:none !important;letter-spacing:0 !important
}
.bo-tab{background:transparent;border:1.5px solid #2a363e;color:#fff;font-family:var(--sans);font-weight:600;font-size:13px;padding:8px 14px;border-radius:999px;cursor:pointer;display:flex;align-items:center;gap:8px;white-space:nowrap}
.bo-tab .ti{width:14px;height:14px;border-radius:50%;display:inline-block}
.bo-tab[data-icon=coin] .ti{background:#e8a93a}
.bo-tab[data-icon=stadium] .ti{background:#5a8fd9;border-radius:2px}
.bo-tab[data-icon=picks] .ti{background:#fff}
.bo-tab[data-icon=tools] .ti{background:#e77c5a;border-radius:3px;transform:rotate(45deg)}
.bo-tab[data-icon=guides] .ti{background:var(--primary);border-radius:3px}
.bo-tab.active{background:#fff;color:var(--secondary);border-color:#fff}
.bo-header .bo-tab.active,
button.bo-tab.active,
a.bo-tab.active{
	background:#fff !important;color:var(--secondary) !important;border-color:#fff !important
}
/* Sign in button + register button in header — same Elementor cascade fix. */
.bo-header .bo-header-right .btn,
.bo-header a.btn,
.bo-header button.btn{
	font-family:var(--sans) !important;font-weight:700 !important;
	border-radius:6px !important;
	white-space:nowrap;flex-shrink:0;
	padding:8px 14px !important;
	box-shadow:none !important;text-decoration:none !important;
	border:1.5px solid transparent !important
}
.bo-header .btn.btn-light,
.bo-header a.btn.btn-light{
	background:#fff !important;color:var(--secondary) !important;border-color:#fff !important
}
.bo-header .btn.btn-primary,
.bo-header a.btn.btn-primary,
.bo-header button.btn.btn-primary{
	background:var(--primary) !important;color:var(--secondary) !important;border-color:var(--primary) !important
}

/* Logo as image replaces text lockup */
.bo-logo{display:inline-flex;align-items:center;line-height:0;flex-shrink:0}
.bo-logo img{display:block;height:22px;width:auto;max-height:22px}

/* Dropdown tabs (HUB, Expert Picks) */
.bo-tab-wrap{position:relative;display:inline-flex}
.bo-tab-wrap > .bo-tab{font:inherit}
.bo-tab-chev{font-size:10px;line-height:1;opacity:0.7;margin-left:2px}
.bo-tab-wrap.open .bo-tab-chev,
.bo-tab-wrap .bo-tab:hover .bo-tab-chev{opacity:1}
.bo-dropdown{
	position:absolute;top:calc(100% + 8px);left:0;
	min-width:180px;
	background:var(--secondary);
	border:1px solid #2a363e;
	border-radius:6px;
	padding:6px;
	display:none;
	z-index:100;
	box-shadow:0 12px 32px rgba(0,0,0,0.35);
}
.bo-tab-wrap.open .bo-dropdown,
.bo-tab-wrap:focus-within .bo-dropdown{display:block}
.bo-dropdown a{
	display:block;
	padding:10px 14px;
	color:#fff;
	font-family:var(--sans);
	font-size:13px;
	font-weight:600;
	border-radius:4px;
	text-decoration:none;
	white-space:nowrap;
}
.bo-dropdown a:hover,
.bo-dropdown a:focus{background:rgba(255,255,255,0.08);color:var(--primary);outline:0}
.bo-header-right{margin-left:auto;display:flex;align-items:center;gap:10px;flex-shrink:0;flex-wrap:nowrap;min-width:0}
.bo-header-right > *{flex-shrink:0}
.bo-header-right > .bo-search{flex-shrink:1;min-width:0}
.bo-search{position:relative;display:flex;align-items:center;gap:8px;background:#2a363e;border:1.5px solid #2a363e;border-radius:4px;padding:7px 10px;color:var(--secondary-20);min-width:0;flex:1 1 240px;max-width:340px;font-size:13px;cursor:text;transition:border-color 0.15s}
.bo-search:focus-within{border-color:var(--primary)}
.bo-search .si{width:13px;height:13px;border:1.5px solid var(--secondary-20);border-radius:50%;position:relative;flex-shrink:0}
.bo-search .si::after{content:"";position:absolute;right:-4px;bottom:-4px;width:6px;height:1.5px;background:var(--secondary-20);transform:rotate(45deg)}
/* !important required to beat OceanWP / Elementor input cascades that inject
   a light background + box-shadow on <input type="search"> on pick pages. */
.bo-search__input,
.bo-header-right input.bo-search__input,
input[type="search"].bo-search__input{
	flex:1 !important;min-width:0;
	background:transparent !important;background-color:transparent !important;
	border:0 !important;outline:0 !important;
	box-shadow:none !important;
	font-family:var(--sans) !important;font-size:13px !important;font-weight:500 !important;
	color:#fff !important;padding:0 !important;margin:0 !important;
	height:auto !important;line-height:1.4 !important;
	-webkit-appearance:none;appearance:none
}
.bo-search__input:focus,
.bo-header-right input.bo-search__input:focus,
input[type="search"].bo-search__input:focus{
	background:transparent !important;background-color:transparent !important;
	box-shadow:none !important;outline:0 !important
}
.bo-search__input::selection{background:rgba(51,204,112,0.35);color:#fff}
.bo-search__input::placeholder{color:var(--secondary-20)}
.bo-search__input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;width:12px;height:12px;background:linear-gradient(45deg,transparent 0 5px,var(--secondary-20) 5px 7px,transparent 7px 100%),linear-gradient(-45deg,transparent 0 5px,var(--secondary-20) 5px 7px,transparent 7px 100%);cursor:pointer;margin-left:4px}
.bo-filter{font-family:var(--mono);font-size:10px;color:#fff;background:#1a262e;padding:3px 7px;border-radius:2px;letter-spacing:0.05em;flex-shrink:0}

/* Results dropdown */
.bo-search__results{
	position:absolute;top:calc(100% + 8px);left:0;right:0;
	background:var(--secondary-dark);
	border:1px solid #2a363e;
	border-radius:8px;
	max-height:480px;
	overflow:auto;
	z-index:200;
	box-shadow:0 14px 40px rgba(0,0,0,0.4);
	padding:6px;
}
.bo-search__section{
	font-family:var(--mono);
	font-size:10px;
	color:var(--secondary-20);
	letter-spacing:0.1em;
	text-transform:uppercase;
	padding:10px 12px 6px;
}
.bo-search__item{
	display:grid;
	grid-template-columns:58px 1fr auto;
	gap:12px;
	align-items:center;
	padding:10px 12px;
	border-radius:6px;
	color:#fff;
	font-family:var(--sans);
	text-decoration:none;
	cursor:pointer;
}
.bo-search__item:hover,
.bo-search__item.focused{background:rgba(255,255,255,0.08);outline:0}
.bo-search__item-type{
	font-family:var(--mono);
	font-size:10px;
	letter-spacing:0.08em;
	text-transform:uppercase;
	background:rgba(51,204,112,0.15);
	color:var(--primary);
	padding:4px 8px;
	border-radius:3px;
	text-align:center;
	font-weight:700;
}
.bo-search__item-title{
	font-size:13px;
	font-weight:600;
	line-height:1.3;
	color:#fff;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.bo-search__item-date{
	font-family:var(--mono);
	font-size:10px;
	color:var(--secondary-20);
	white-space:nowrap;
}
.bo-search__empty,
.bo-search__loading{
	padding:24px;
	text-align:center;
	color:var(--secondary-20);
	font-size:13px;
	font-family:var(--mono);
	letter-spacing:0.04em;
}
.bo-search__loading::after{
	content:"…";
	animation:bo-dot 1.4s infinite;
}
@keyframes bo-dot{
	0%,20%{opacity:0.3}
	50%{opacity:1}
	80%,100%{opacity:0.3}
}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--sans);font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:0.06em;padding:10px 16px;border:1.5px solid transparent;border-radius:3px;cursor:pointer;transition:background 0.1s,transform 0.1s;white-space:nowrap;flex-shrink:0}
.btn:hover{transform:translateY(-1px)}
.btn.primary{background:var(--primary);color:var(--secondary);border-color:var(--primary)}
.btn.primary:hover{background:var(--primary-60)}
.btn.ghost-light{background:transparent;color:#fff;border-color:#fff}
.btn.dark{background:var(--secondary);color:#fff;border-color:var(--secondary)}
.btn.outline{background:#fff;color:var(--secondary);border-color:var(--secondary)}
.btn.sm{padding:6px 10px;font-size:10px}
.btn.lg{padding:14px 22px;font-size:14px}
.age{border:1.5px solid #fff;border-radius:50%;width:38px;height:38px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;flex-shrink:0}

/* ── Breadcrumbs ── */
.bo-crumbs{display:flex;align-items:center;gap:8px;padding:14px 24px;background:var(--paper);border-bottom:1px solid var(--secondary-20);font-family:var(--mono);font-size:11px;letter-spacing:0.05em;color:var(--secondary-60);text-transform:uppercase}
.bo-crumbs a{color:var(--secondary-60)}
.bo-crumbs a:hover{color:var(--primary)}
.bo-crumbs .sep{color:var(--secondary-20)}
.bo-crumbs .current{color:var(--secondary);font-weight:700;text-transform:none;letter-spacing:0}

/* ════════════════════════════════════════════════════════════════════
   MOBILE CHROME — port of /design-midfi/mobile/hifi/components.js
   Hidden by default, shown via @media (max-width:767px) at the end.
   ════════════════════════════════════════════════════════════════════ */

.bo-app-head,
.bo-mscore-strip,
.bo-bnav { display:none }

/* Mobile top app-head — dark bar to match the rest of the mobile chrome
   (score strip, bnav). Was previously white; switched per user feedback. */
.bo-app-head{
	position:sticky;top:0;z-index:30;
	background:var(--secondary);
	border-bottom:1px solid #000;
	padding:10px 16px;
	display:none;
	align-items:center;
	gap:10px;
	width:100%;
	color:#fff
}
.bo-app-head[data-dark]{background:transparent;border:0;color:#fff}
.bo-app-head-logo{display:inline-flex;align-items:center;line-height:0}
/* Logo stays in its natural green — pops well on dark navy background. */
.bo-app-head-logo img{height:20px;width:auto;display:block}
.bo-app-head-spacer{flex:1}
/* Icon buttons — high specificity + !important to beat Elementor's button
   rules on CPT pages where elementor-kit-* CSS is loaded. */
.bo-app-head .bo-icn,
.bo-overlay .bo-icn{
	width:36px !important;height:36px !important;
	display:inline-flex !important;align-items:center;justify-content:center;
	border-radius:50% !important;
	background:rgba(255,255,255,0.08) !important;color:#fff !important;
	cursor:pointer;
	position:relative;
	border:0 !important;outline:0;
	flex-shrink:0;
	padding:0 !important;
	box-shadow:none !important;
	text-decoration:none !important
}
.bo-app-head .bo-icn:hover,
.bo-app-head .bo-icn:focus-visible,
.bo-overlay .bo-icn:hover,
.bo-overlay .bo-icn:focus-visible{background:rgba(255,255,255,0.16) !important}
.bo-app-head .bo-icn svg,
.bo-overlay .bo-icn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.bo-app-head[data-dark] .bo-icn{background:rgba(255,255,255,0.08) !important;color:#fff !important}
.bo-app-head .bo-icn-badge{
	position:absolute;top:4px;right:4px;
	width:8px;height:8px;border-radius:50%;
	background:var(--primary);
	border:2px solid var(--secondary);
	display:block
}
.bo-app-head[data-dark] .bo-icn-badge{border-color:var(--secondary)}
.bo-app-head-av{
	width:36px;height:36px;border-radius:50%;
	background:var(--secondary);color:#fff;
	display:inline-flex;align-items:center;justify-content:center;
	font-weight:800;font-size:12px;font-family:var(--mono);
	text-decoration:none;
	flex-shrink:0;
}

/* Mobile-only generic button used by the app-head Sign in CTA. Same
   specificity boost as .bo-icn (Elementor link styles cascade hard). */
.bo-app-head .bo-btn,
.bo-overlay .bo-btn,
a.bo-btn,
button.bo-btn{
	display:inline-flex !important;align-items:center;justify-content:center;
	padding:8px 14px;border-radius:8px;
	font-family:var(--sans);font-weight:700 !important;font-size:12px !important;
	letter-spacing:0;text-decoration:none !important;
	white-space:nowrap;flex-shrink:0;
	border:1px solid transparent;cursor:pointer;
	transition:transform 0.1s
}
.bo-btn:active{transform:scale(0.97)}
.bo-app-head .bo-btn--primary,
a.bo-btn--primary{background:var(--primary) !important;color:var(--secondary) !important}
.bo-app-head .bo-btn--primary:hover,
a.bo-btn--primary:hover,
.bo-app-head .bo-btn--primary:focus-visible{background:var(--primary-60) !important;color:var(--secondary) !important}
.bo-btn--outline{background:transparent;color:#fff;border-color:rgba(255,255,255,0.25)}

/* Mobile condensed scoreboard strip (swipeable) */
.bo-mscore-strip{
	background:var(--secondary);color:#fff;
	display:none;
	overflow-x:auto;
	gap:8px;
	padding:10px 14px;
	scrollbar-width:none;
	border-bottom:1px solid #000;
	width:100%;
	min-width:0;
}
.bo-mscore-strip::-webkit-scrollbar{display:none}
.bo-mscore-label{
	flex-shrink:0;
	display:flex;align-items:center;gap:4px;
	font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.1em;
	color:var(--primary);
	padding-right:8px;border-right:1px solid #2a363e;
}
.bo-mscore-dot{
	width:6px;height:6px;border-radius:50%;
	background:var(--primary);
	animation:blink 1.4s infinite;
}
.bo-mscore-card{
	flex-shrink:0;
	background:#2a363e;
	border-radius:0;
	padding:6px 10px;
	min-width:118px;
	display:flex;flex-direction:column;gap:3px;
}
.bo-mscore-hd{
	display:flex;justify-content:space-between;align-items:center;
}
.bo-mscore-lg{
	font-family:var(--mono);font-size:8px;letter-spacing:0.1em;
	color:var(--secondary-20);font-weight:700;
}
.bo-mscore-t{
	font-family:var(--mono);font-size:9px;
	color:var(--secondary-20);font-weight:600;
}
.bo-mscore-row{
	display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px;
}
.bo-mscore-row b{
	font-weight:700;color:#fff;
	background:var(--secondary-dark);
	padding:1px 5px;border-radius:3px;font-size:10px;
	font-family:var(--mono);
}
.bo-mscore-row em{
	font-style:normal;font-weight:800;
	font-family:var(--mono);font-size:13px;
	color:#fff;
}

/* Mobile floating bottom nav */
.bo-bnav{
	position:fixed;
	bottom:max(12px, env(safe-area-inset-bottom));
	left:12px;right:12px;
	height:68px;
	background:rgba(15,24,32,0.96);
	backdrop-filter:blur(24px);
	-webkit-backdrop-filter:blur(24px);
	border-radius:999px;
	display:none;
	align-items:center;
	justify-content:space-around;
	padding:0 12px;
	z-index:40;
	box-shadow:0 12px 32px rgba(0,0,0,0.3);
	border:1px solid rgba(255,255,255,0.08);
}
.bo-bnav-item{
	flex:1;
	display:flex;flex-direction:column;align-items:center;gap:3px;
	color:rgba(255,255,255,0.5);
	font-family:var(--sans);
	font-size:9px;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;
	cursor:pointer;
	padding:8px 4px;
	border-radius:999px;
	transition:color 0.15s;
	text-decoration:none;
	box-sizing:border-box
}
/* Force the same dim-white color on every link state (:link, :visited,
   :hover, :focus, :active) — without this, the browser's default
   `:visited` (purple on dark bg) leaks through because `.bo-bnav-item`
   (specificity 0,1,0) loses to `a:visited` (0,1,1). v2.48.25 fix. */
a.bo-bnav-item:link,
a.bo-bnav-item:visited,
a.bo-bnav-item:hover,
a.bo-bnav-item:focus,
a.bo-bnav-item:active{
	color:rgba(255,255,255,0.5) !important
}
/* Preserve the active-state primary green on the current page */
a.bo-bnav-item.is-active,
a.bo-bnav-item.is-active:visited,
a.bo-bnav-item.is-active:hover,
a.bo-bnav-item.is-active:focus{
	color:var(--primary) !important
}
/* Unified icon size for all bnav items (v2.48.21) — previously the
   center "Home" was 24px while siblings were 20px, which made the row
   feel uneven. One consistent 22×22 footprint for every item, stroke-
   based OR filled, regardless of position. */
.bo-bnav-item svg{
	width:22px;height:22px;
	stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;
	display:block
}
/* Filled (non-stroke) icons like the yellow Books coin still need their
   fill honoured but should visually match the stroke icons' weight. */
.bo-bnav-item .bo-bnav-icon-custom{stroke-width:0;fill:initial}
.bo-bnav-item.is-active{color:var(--primary)}
.bo-bnav-item.is-active svg{filter:drop-shadow(0 0 6px rgba(51,204,112,0.4))}

/* Picks popover wrapper — flex:1 so the wrapped anchor takes the same
   horizontal slot as its siblings. Display:contents (v2.48.27) makes
   the wrap disappear from the box model entirely — the inner anchor
   behaves as a direct flex child of .bo-bnav, identical to siblings.
   The wrap itself becomes the positioning anchor for the popover via
   a tiny ::before pseudo + the popover's own offset. */
.bo-bnav-item-wrap{
	flex:1;
	position:relative;
	display:flex;align-items:center
}
.bo-bnav-item-wrap > .bo-bnav-item{flex:1}

/* Picks popover trigger — now an <a role="button"> so it renders
   pixel-identical to its anchor siblings (v2.48.27). Only a minimal
   .is-open state override remains; all base styling is inherited from
   .bo-bnav-item. */
.bo-bnav-item--popover.is-open{color:var(--primary) !important}
.bo-bnav-item--popover.is-open svg{filter:drop-shadow(0 0 6px rgba(51,204,112,0.4))}
/* Keyboard focus ring */
.bo-bnav-item--popover:focus{outline:0}
.bo-bnav-item--popover:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.bo-bnav-item--popover.is-open{color:var(--primary)}
.bo-bnav-item--popover.is-open svg{filter:drop-shadow(0 0 6px rgba(51,204,112,0.4))}

/* Picks popover panel — floats above the Picks button, 3 sport rows */
.bo-bnav-popover{
	position:absolute;bottom:calc(100% + 8px);
	left:50%;transform:translateX(-50%) translateY(8px);
	min-width:220px;
	background:rgba(15,24,32,0.98);
	border:1px solid rgba(255,255,255,0.1);
	border-radius:14px;
	padding:6px;
	box-shadow:0 16px 40px rgba(0,0,0,0.5);
	backdrop-filter:blur(16px);
	-webkit-backdrop-filter:blur(16px);
	opacity:0;pointer-events:none;
	transition:opacity .15s ease, transform .18s ease
}
.bo-bnav-popover.is-open{
	opacity:1;pointer-events:auto;
	transform:translateX(-50%) translateY(0)
}
/* Small arrow pointing down at the button */
.bo-bnav-popover::after{
	content:"";position:absolute;
	bottom:-5px;left:50%;transform:translateX(-50%) rotate(45deg);
	width:10px;height:10px;
	background:rgba(15,24,32,0.98);
	border-right:1px solid rgba(255,255,255,0.1);
	border-bottom:1px solid rgba(255,255,255,0.1)
}

.bo-bnav-popover__label{
	font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:0.1em;
	color:rgba(255,255,255,0.5);text-transform:uppercase;
	padding:10px 14px 6px
}

.bo-bnav-popover__item{
	display:grid;grid-template-columns:1fr auto;align-items:center;gap:14px;
	padding:12px 14px;border-radius:10px;
	color:#fff;text-decoration:none;
	transition:background .12s ease;
	position:relative
}
.bo-bnav-popover__item:hover,
.bo-bnav-popover__item:focus{background:rgba(255,255,255,0.06);outline:0}
.bo-bnav-popover__sport{
	grid-column:1;grid-row:1;
	font-family:var(--sans);font-weight:800;font-size:14px;letter-spacing:-0.01em;color:#fff
}
.bo-bnav-popover__sub{
	grid-column:1;grid-row:2;
	font-family:var(--mono);font-size:10.5px;color:rgba(255,255,255,0.5);letter-spacing:0.02em
}
.bo-bnav-popover__arrow{
	grid-column:2;grid-row:1 / span 2;
	color:var(--primary);font-weight:700;font-size:16px
}
.bo-bnav-popover__item:hover .bo-bnav-popover__arrow{transform:translateX(2px)}

/* ════════════════════════════════════════════════════════════════════
   TEAM BADGES (.bo-tbadge) — square colored chips, used in matchups,
   pick cards, standings rows. Sized via --sm / --lg modifiers.
   ════════════════════════════════════════════════════════════════════ */
.bo-tbadge{
	width:32px;height:32px;border-radius:8px;
	display:inline-flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-weight:800;font-size:11px;letter-spacing:-0.02em;
	flex-shrink:0;color:#fff;position:relative;line-height:1
}
.bo-tbadge::after{
	content:"";position:absolute;inset:0;border-radius:inherit;
	background:linear-gradient(135deg,rgba(255,255,255,0.15),transparent 50%);
	pointer-events:none
}
.bo-tbadge--sm{width:26px;height:26px;font-size:9px;border-radius:6px}
.bo-tbadge--lg{width:44px;height:44px;font-size:14px;border-radius:10px}

/* Tag + meta aliases used by mobile-hub renderer (mirror existing .tag/.meta). */
.bo-tag{
	display:inline-flex;align-items:center;gap:6px;
	background:var(--primary-tint);color:#1e6b3a;
	font-family:var(--sans);font-weight:700;font-size:11px;
	text-transform:uppercase;letter-spacing:0.08em;
	padding:4px 10px;border-radius:3px;line-height:1.2
}
.bo-tag--solid{background:var(--primary);color:var(--secondary)}
.bo-tag--dark{background:var(--secondary);color:#fff}

/* ════════════════════════════════════════════════════════════════════
   MOBILE SPORT HUB (.bo-mhub*) — port of design-midfi-mobile screens-hubs.js.
   Hidden on desktop (>=768px), shown <768px via the @media block below.
   ════════════════════════════════════════════════════════════════════ */
.bo-mhub{display:none;background:#fff}

/* Dark hero (gradient panel covering top of page). */
.bo-mhub-hero{
	background:var(--secondary);color:#fff;
	padding:18px 16px 16px;margin:0 0 14px;
	--mhub-accent:var(--primary)
}
.bo-mhub-leagues{
	display:flex;gap:6px;overflow-x:auto;margin-bottom:14px;
	scrollbar-width:none;-webkit-overflow-scrolling:touch
}
.bo-mhub-leagues::-webkit-scrollbar{display:none}
.bo-mhub-league{
	display:inline-block;padding:6px 12px;border-radius:999px;
	border:1px solid rgba(255,255,255,0.2);
	font-family:var(--sans);font-weight:600;font-size:12px;
	color:rgba(255,255,255,0.7);white-space:nowrap;cursor:pointer
}
.bo-mhub-league.is-active{
	background:var(--primary);color:var(--secondary);border-color:var(--primary)
}
.bo-mhub-hero-text{margin-top:4px}
.bo-mhub-title{
	font-family:var(--sans);font-weight:800;font-size:32px;line-height:1.02;
	letter-spacing:-0.025em;margin:10px 0 4px;color:#fff
}
.bo-mhub-title em,body .bo-mhub-title em{color:var(--primary);font-style:normal !important}
.bo-mhub-tagline{color:rgba(255,255,255,0.6);margin-top:2px}
/* NBA mobile hero — desktop intro + dynamic stats ribbon.
   High-specificity selectors to beat Elementor Kit's `.oceanwp-theme p { color:#333 !important }` rule. */
.bo-mhub-hero p.bo-mhub-intro,
body.oceanwp-theme p.bo-mhub-intro,
body .bo-mhub-hero .bo-mhub-intro{font-family:var(--sans);font-size:14px;line-height:1.5;color:#fff !important;margin:8px 0 10px}
.bo-mhub-stats{display:flex;flex-wrap:wrap;gap:10px 14px;margin-top:4px;font-family:var(--mono);font-size:10px;letter-spacing:0.06em;text-transform:uppercase;color:rgba(255,255,255,0.7)}
.bo-mhub-stats b{color:var(--primary);font-weight:700}
/* Soccer mobile — intro text appears AFTER the featured card (per 2026-04-20 spec). */
.bo-mhub-intro--below{margin-top:16px !important;margin-bottom:6px !important}

/* Featured matchup card. */
.bo-mhub-featured{
	margin:16px 0 0;
	background:linear-gradient(135deg,var(--mhub-accent) 0%,rgba(15,24,32,0.55) 100%);
	border:1px solid rgba(255,255,255,0.08);
	border-radius:14px;padding:14px
}
.bo-mhub-featured-hd{
	display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;
	color:rgba(255,255,255,0.7)
}
.bo-mhub-featured-hd .bo-meta{color:rgba(255,255,255,0.7);font-size:9px}
.bo-mhub-featured-teams{display:flex;align-items:center;gap:14px}
.bo-mhub-team-side{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0}
.bo-mhub-team-name{font-size:11px;font-weight:700;text-align:center;color:#fff;line-height:1.2}
.bo-mhub-team-score{font-family:var(--mono);font-size:14px;color:rgba(255,255,255,0.85);font-weight:700}
.bo-mhub-vs{font-family:var(--mono);font-size:11px;color:rgba(255,255,255,0.5);font-weight:700}
.bo-mhub-odds{
	display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;
	margin-top:14px;padding-top:12px;border-top:1px solid rgba(255,255,255,0.1)
}
.bo-mhub-odds-cell{
	background:rgba(255,255,255,0.05);border-radius:8px;padding:8px 6px;text-align:center
}
.bo-mhub-odds-cell .bo-meta{color:rgba(255,255,255,0.5);font-size:8px;justify-content:center}
.bo-mhub-odds-line{font-family:var(--mono);font-size:11px;font-weight:700;margin-top:3px;color:#fff}
.bo-mhub-odds-juice{font-family:var(--mono);font-size:9px;color:var(--primary);margin-top:2px}

/* Sticky tabs row under hero. Horizontal scroll when > 4 tabs so no
   cramped/touching labels. */
.bo-mhub-tabs{
	display:flex;gap:4px;border-bottom:1px solid rgba(199,204,207,0.5);
	padding:0 12px;background:#fff;overflow-x:auto;-webkit-overflow-scrolling:touch;
	position:sticky;top:58px;z-index:20;margin-bottom:6px;scrollbar-width:none
}
.bo-mhub-tabs::-webkit-scrollbar{display:none}
.bo-mhub-tab{
	flex:0 0 auto;padding:13px 12px;text-align:center;white-space:nowrap;
	font-family:var(--sans);font-size:11px;font-weight:700;
	letter-spacing:0.04em;text-transform:uppercase;
	color:var(--secondary-60);text-decoration:none
}
.bo-mhub-tab.is-active{color:var(--secondary);border-bottom:2px solid var(--primary)}
/* Scroll-margin so anchor scrolls land BELOW the sticky tabs bar (48-56px). */
.bo-mhub-sec{scroll-margin-top:120px}

/* Section wrapper. */
.bo-mhub-sec{padding:14px 16px}
.bo-mhub-ah{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px;gap:10px}
.bo-mhub-ah h2,.bo-mhub-ah .bo-mhub-ah-title{
	font-family:var(--sans);font-weight:800;font-size:18px;
	letter-spacing:-0.02em;margin:0;color:var(--secondary)
}
.bo-mhub-seeall{
	font-family:var(--mono);font-size:11px;color:var(--primary);
	text-decoration:none;font-weight:700;flex-shrink:0
}

/* Pick cards in the picks feed. */
.bo-mhub-pick{
	display:block;background:#fff;border:1px solid rgba(199,204,207,0.6);
	border-radius:14px;padding:14px;margin-bottom:10px;
	color:inherit;text-decoration:none;
	box-shadow:0 1px 2px rgba(15,24,32,0.04)
}
.bo-mhub-pick-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;gap:8px}
.bo-mhub-pick-title{
	font-family:var(--sans);font-weight:800;font-size:16px;
	letter-spacing:-0.02em;line-height:1.2;color:var(--secondary)
}
.bo-mhub-pick-take{
	font-size:12px;color:#2a363e;margin:6px 0 0;line-height:1.45
}
.bo-mhub-pick-author{
	display:flex;align-items:center;gap:8px;
	margin-top:12px;padding-top:10px;border-top:1px solid rgba(199,204,207,0.5)
}
.bo-mhub-pick-avatar{
	width:24px;height:24px;border-radius:50%;
	background:var(--secondary);color:#fff;
	display:inline-flex;align-items:center;justify-content:center;
	font-weight:800;font-size:9px
}
.bo-mhub-pick-name{font-size:11px;font-weight:700;color:var(--secondary)}

/* Empty-state card. */
.bo-mhub-empty{
	background:var(--paper);border-radius:12px;padding:18px;
	color:var(--secondary-60);font-size:13px;text-align:center
}

/* Standings card wrapper — clips heavy NBA/NFL standings shortcode to top
   ~6 rows with a fade-out, then a "Full table" link below leads off-page.
   The injected shortcode renders the entire league; we use CSS to truncate. */
/* Legacy mini-standings clip (NFL / Soccer paths).
   Targeted via the explicit `.bo-mhub-standings--legacy` class set from PHP
   on the non-NBA path. We avoid :has() here because older mobile browsers
   drop the entire rule when they don't support it. */
.bo-mhub-standings{position:relative}
.bo-mhub-standings--legacy{
	background:#fff;border:1px solid rgba(199,204,207,0.6);
	border-radius:12px;overflow:hidden;padding:0;
	max-height:340px
}
.bo-mhub-standings--legacy::after{
	content:"";position:absolute;left:0;right:0;bottom:0;height:80px;
	background:linear-gradient(to bottom,rgba(255,255,255,0) 0%,#fff 90%);
	pointer-events:none
}
.bo-mhub-standings table{width:100%;font-size:12px}
/* Hide secondary tables / league switchers inside the shortcode on mobile —
   legacy path only. */
.bo-mhub-standings--legacy .nba-stand-tabs,
.bo-mhub-standings--legacy .nfl-stand-tabs,
.bo-mhub-standings--legacy h2,
.bo-mhub-standings--legacy h3{display:none !important}
/* In the NBA per-conference groups path, hide the snippet's own h3 title
   (our custom .bo-mhub-standings-label already labels each group). */
.bo-mhub-standings-group .bo-standings__head{display:none}
.bo-mhub-standings-group .bo-standings__table{font-size:12px}

/* Playbook horizontal scroller. */
.bo-mhub-pb-row{
	display:flex;gap:10px;overflow-x:auto;
	scrollbar-width:none;padding-bottom:4px;
	-webkit-overflow-scrolling:touch
}
.bo-mhub-pb-row::-webkit-scrollbar{display:none}
.bo-mhub-pb-card{
	flex:0 0 220px;border-radius:12px;overflow:hidden;
	background:#fff;border:1px solid rgba(199,204,207,0.6);
	color:inherit;text-decoration:none
}
.bo-mhub-pb-cover{height:100px;position:relative;overflow:hidden}
.bo-mhub-pb-img{width:100%;height:100%;object-fit:cover;display:block}
.bo-mhub-pb-body{padding:12px}
.bo-mhub-pb-title{
	font-family:var(--sans);font-weight:700;font-size:13px;
	letter-spacing:-0.01em;line-height:1.25;color:var(--secondary)
}
.bo-mhub-pb-body .bo-meta{font-size:9px;margin-top:6px}

/* ════════════════════════════════════════════════════════════════════
   MOBILE PICKS ARCHIVE (.bo-mpicks*) — port of design-midfi-mobile screens-picks.js.
   Hidden on desktop, shown <768px via the @media block below.
   ════════════════════════════════════════════════════════════════════ */
.bo-mpicks{display:none;background:var(--paper)}

/* Dark hero with stats ribbon. */
.bo-mpicks-hero{
	background:var(--secondary);color:#fff;padding:18px 16px 14px;
	--mpicks-accent:var(--primary)
}
.bo-mpicks-hero-text{margin-bottom:14px}
.bo-mpicks-title{
	font-family:var(--sans);font-weight:800;font-size:28px;line-height:1.02;
	letter-spacing:-0.025em;margin:8px 0 4px;color:#fff
}
.bo-mpicks-title em{color:var(--primary);font-style:italic}
.bo-mpicks-tagline{color:rgba(255,255,255,0.6);font-size:10px;margin-top:2px}

.bo-mpicks-stats{
	display:grid;grid-template-columns:repeat(4,1fr);gap:6px
}
.bo-mpicks-stat{
	background:rgba(255,255,255,0.05);
	border:1px solid rgba(255,255,255,0.1);
	border-radius:8px;padding:8px 6px
}
.bo-mpicks-stat .bo-meta{
	color:rgba(255,255,255,0.5);font-size:8px;justify-content:flex-start
}
.bo-mpicks-stat-v{
	font-family:var(--mono);font-size:14px;font-weight:800;margin-top:2px;line-height:1.1
}
.bo-mpicks-stat-v--primary{color:var(--primary)}
.bo-mpicks-stat-v--white{color:#fff}

/* Sticky filter pill bar. */
.bo-mpicks-filterbar{
	position:sticky;top:58px;z-index:20;
	background:var(--paper);
	padding:12px 0 10px;
	border-bottom:1px solid rgba(199,204,207,0.5)
}
.bo-mpicks-pills{
	display:flex;gap:6px;overflow-x:auto;padding:0 14px;
	scrollbar-width:none;-webkit-overflow-scrolling:touch
}
.bo-mpicks-pills::-webkit-scrollbar{display:none}
.bo-mpicks-pill{
	display:inline-block;padding:6px 12px;border-radius:999px;
	border:1px solid var(--secondary-20);
	background:#fff;color:var(--secondary);
	font-family:var(--sans);font-weight:600;font-size:12px;
	white-space:nowrap;cursor:pointer
}
.bo-mpicks-pill.is-active{
	background:var(--primary);color:var(--secondary);border-color:var(--primary)
}
.bo-mpicks-filterbar-meta{padding:8px 14px 0}

/* Main picks list. */
.bo-mpicks-sec{padding:10px 16px 24px}
.bo-mpicks-bucket-hd{
	display:flex;align-items:center;gap:8px;
	margin:14px 0 10px
}
.bo-mpicks-bucket-rule{
	flex:1;height:1px;background:rgba(199,204,207,0.6)
}

/* Pick cards. */
.bo-mpicks-card{
	display:block;background:#fff;border:1px solid rgba(199,204,207,0.6);
	border-radius:12px;padding:12px 14px;margin-bottom:8px;
	color:inherit;text-decoration:none;
	box-shadow:0 1px 2px rgba(15,24,32,0.04)
}
.bo-mpicks-card-hd{
	display:flex;align-items:center;gap:10px;margin-bottom:8px
}
.bo-mpicks-vs{
	font-family:var(--mono);font-size:9px;color:var(--secondary-60);font-weight:700
}
.bo-mpicks-time{margin-left:auto;font-size:9px}
.bo-mpicks-card-title{
	font-family:var(--sans);font-weight:800;font-size:14px;
	letter-spacing:-0.01em;line-height:1.3;color:var(--secondary)
}
.bo-mpicks-card-author{
	font-family:var(--mono);font-size:10px;color:var(--secondary-60);
	margin-top:6px
}

/* ════════════════════════════════════════════════════════════════════
   DESKTOP PICKS ARCHIVE (.bo-dpicks*) — port of /design-midfi/midfi/picks-archive.js.
   Visible >=768px; hidden on mobile via @media block.
   ════════════════════════════════════════════════════════════════════ */

/* Dark hero with KPIs. */
.bo-dpicks-hero{
	background:var(--secondary);color:#fff;
	padding:44px 24px;position:relative;overflow:hidden
}
.bo-dpicks-hero-inner{max-width:1200px;margin:0 auto;position:relative;z-index:2}
.bo-dpicks-hero-title{
	font-family:var(--sans);font-weight:800;
	font-size:clamp(36px,4vw,52px);line-height:1.05;
	letter-spacing:-0.02em;margin:10px 0 12px;color:#fff;max-width:780px
}
.bo-dpicks-hero-intro{
	font-family:var(--sans);font-size:17px;color:rgba(255,255,255,0.78);
	margin:0;max-width:680px;line-height:1.55
}
.bo-dpicks-kpis{display:flex;gap:32px;margin-top:22px;flex-wrap:wrap}
.bo-dpicks-kpi .bo-meta{
	font-family:var(--mono);font-size:10px;color:var(--secondary-20);
	letter-spacing:0.1em;text-transform:uppercase
}
.bo-dpicks-kpi-v{
	font-family:var(--sans);font-weight:800;font-size:28px;
	color:#fff;margin:4px 0 2px;line-height:1.1
}
.bo-dpicks-kpi-sub{
	font-family:var(--mono);font-size:11px;color:var(--primary)
}

/* Main grid (2-col 1fr/320px). */
.bo-dpicks-section{padding:28px 24px}
.bo-dpicks-grid{
	max-width:1200px;margin:0 auto;
	display:grid;grid-template-columns:1fr 320px;gap:32px
}
.bo-dpicks-main-col{min-width:0}

/* Filter bar. */
.bo-dpicks-filterbar{
	border-bottom:1px solid var(--secondary-20);
	margin-bottom:20px;padding:0 0 14px;
	display:flex;align-items:center;gap:8px;flex-wrap:wrap
}
.bo-dpicks-filterbar .filter-chip{cursor:pointer}
.bo-dpicks-sort{
	margin-left:auto;display:flex;gap:8px;align-items:center
}
.bo-dpicks-sort .bo-meta{font-family:var(--mono);font-size:11px;color:var(--secondary-60);letter-spacing:0.05em}
.bo-dpicks-sort select{
	border:1px solid var(--secondary-20);
	padding:6px 10px;border-radius:3px;
	font-family:var(--sans);font-size:12px;background:#fff
}

/* Pick rows list. */
.bo-dpicks-list{display:flex;flex-direction:column;gap:12px}

/* One pick row (logos | main | confidence | odds | CTA). */
.bo-dpicks-row{
	display:grid;
	grid-template-columns:60px 1fr 180px 90px auto;
	gap:18px;align-items:center;
	padding:16px 18px;background:#fff;
	border:1px solid var(--secondary-20);border-radius:6px;
	color:inherit;text-decoration:none;
	transition:border-color 0.15s,transform 0.1s
}
.bo-dpicks-row:hover{border-color:var(--primary);transform:translateY(-1px)}

.bo-dpicks-logos{
	display:flex;flex-direction:column;align-items:center;gap:4px
}
.bo-dpicks-logo{
	width:32px;height:32px;border-radius:50%;
	background:var(--paper);border:1px solid var(--secondary-20);
	display:flex;align-items:center;justify-content:center;
	font-family:var(--mono);font-size:9px;font-weight:700;color:var(--secondary)
}
.bo-dpicks-vs{font-family:var(--mono);font-size:9px;color:var(--secondary-60)}

.bo-dpicks-main{min-width:0}
.bo-dpicks-tags{display:flex;gap:8px;margin-bottom:4px;align-items:center}
.bo-dpicks-title{
	font-family:var(--sans);font-weight:700;font-size:15px;
	letter-spacing:-0.01em;color:var(--secondary);
	display:block;margin-bottom:2px
}
.bo-dpicks-main .bo-meta{
	font-family:var(--mono);font-size:11px;letter-spacing:0.04em;
	color:var(--secondary-60)
}
.bo-dpicks-note{
	font-size:13px;color:var(--secondary);margin-top:6px;
	line-height:1.5;max-width:520px
}

.bo-dpicks-conf{display:flex;flex-direction:column;gap:5px;align-items:flex-start}
.bo-dpicks-conf b{font-family:var(--sans);font-weight:700;font-size:14px;color:var(--secondary)}
.bo-dpicks-conf .conf{
	width:100%;height:6px;background:var(--paper);
	border-radius:999px;overflow:hidden;display:block
}
.bo-dpicks-conf .conf span{display:block;height:100%}
.bo-dpicks-conf .bo-meta{font-family:var(--mono);font-size:10px;color:var(--secondary-60)}

.bo-dpicks-odds{text-align:center}
.bo-dpicks-odds b{
	font-family:var(--sans);font-weight:800;font-size:20px;
	color:var(--primary);display:block;line-height:1.1
}
.bo-dpicks-odds .src{
	font-family:var(--mono);font-size:10px;color:var(--secondary-60);
	letter-spacing:0.05em;margin-top:2px
}

.bo-dpicks-loadmore{display:flex;justify-content:center;margin-top:28px}

/* Sidebar. */
.bo-dpicks-aside{display:flex;flex-direction:column;gap:16px}
.bo-dpicks-aside .bo-card{padding:20px;background:#fff;border:1px solid var(--secondary-20);border-radius:6px}
.bo-dpicks-aside .side-title{
	font-family:var(--sans);font-weight:800;font-size:13px;
	letter-spacing:0.06em;text-transform:uppercase;
	color:var(--secondary);margin:0 0 14px;padding-bottom:10px;
	border-bottom:1px solid var(--secondary-20)
}
.bo-dpicks-experts .side-list{display:flex;flex-direction:column;gap:12px}
.bo-dpicks-experts .item{
	display:flex;align-items:center;gap:12px
}
.bo-dpicks-avatar{
	width:48px;height:48px;border-radius:50%;
	background:var(--secondary);color:#fff;
	display:flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-weight:800;font-size:13px;flex-shrink:0
}
.bo-dpicks-experts .tx{flex:1;min-width:0}
.bo-dpicks-experts .tx b{font-family:var(--sans);font-weight:700;font-size:13px;color:var(--secondary);display:block}
.bo-dpicks-experts .tx .meta{font-family:var(--mono);font-size:10px;color:var(--secondary-60);margin-top:2px}
.bo-dpicks-roi{
	font-family:var(--mono);font-size:11px;font-weight:700;color:var(--primary)
}

/* Dark Unlock CTA card. */
.bo-dpicks-cta{background:var(--secondary) !important;color:#fff !important}
.bo-dpicks-cta h4{margin:12px 0 8px;font-size:18px;color:#fff;font-family:var(--sans);font-weight:800}
.bo-dpicks-cta p{color:var(--secondary-20);margin:0 0 14px;font-size:13px;line-height:1.5}

/* Editorial WYSIWYG content (the_content) below the data-driven layout. */
.bo-picks__editorial{max-width:1200px;margin:32px auto 0;padding:0 24px}
.bo-picks__editorial .prose{font-size:15px;line-height:1.6;color:var(--secondary)}

/* Generic .bo-btn--sm modifier (used in row CTA). */
.bo-btn--sm{padding:6px 12px;font-size:11px;border-radius:4px}
.bo-btn--outline{background:transparent;border:1.5px solid var(--secondary);color:var(--secondary)}
.bo-btn--outline:hover{background:var(--secondary);color:#fff}

/* ════════════════════════════════════════════════════════════════════
   PICKS ARCHIVE v3 (.bo-pa*) — 2026-04-20 midfi-aligned redesign.
   Hero 2-col (text + featured match card) · functional filter+sort ·
   banner pick rows · dynamic sportsbook sidebar. All free, no paywall.
   ════════════════════════════════════════════════════════════════════ */

.bo-pa{background:var(--paper)}

/* ── Hero — 2-col (text + featured match card) ──────────────────── */
.bo-pa-hero{background:var(--secondary);color:#fff;padding:44px 24px 40px;position:relative;overflow:hidden}
.bo-pa-hero__grid{
	max-width:1200px;margin:0 auto;position:relative;z-index:2;
	display:grid;grid-template-columns:1.45fr 1fr;gap:36px;align-items:center
}
.bo-pa-hero__text{min-width:0}
.bo-pa-hero__title{
	font-family:var(--sans);font-weight:800;
	font-size:clamp(30px,3.2vw,42px);line-height:1.05;
	letter-spacing:-0.02em;margin:10px 0 12px;color:#fff
}
/* Intro + stats — pure white (OceanWP body color tries to paint these
   grey inside the single post template; we force #fff via explicit
   selector chain to beat specificity). */
.bo-pa .bo-pa-hero__intro,
.bo-pa-hero .bo-pa-hero__intro,
.bo-pa-hero__intro{
	font-family:var(--sans);font-size:16px;color:#fff !important;
	margin:0;line-height:1.55
}
.bo-pa-hero__stats{
	display:flex;gap:18px;margin-top:20px;flex-wrap:wrap;
	font-family:var(--mono);font-size:11px;color:#fff;
	letter-spacing:0.06em;text-transform:uppercase
}
.bo-pa-hero__stats span{color:#fff}
.bo-pa-hero__stats b{color:var(--primary);font-weight:800}
.bo-pa-hero__card{min-width:0}
/* Fallback tile shown when there's no next-upcoming pick. */
.bo-pa-hero__card-fallback{
	aspect-ratio:16/9;border-radius:10px;
	background:linear-gradient(135deg,var(--secondary) 0%,#2a3b48 100%);
	display:flex;align-items:center;justify-content:center;
	font-style:italic;font-weight:900;font-size:56px;color:rgba(255,255,255,0.35)
}

/* ── Main 2-col grid (feed + sportsbook sidebar) ────────────────── */
.bo-pa-main{padding:28px 24px 48px}
.bo-pa-main__grid{
	max-width:1200px;margin:0 auto;
	display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:32px;align-items:start
}
.bo-pa-main__col{min-width:0}
@media (max-width:980px){
	.bo-pa-main__grid{grid-template-columns:minmax(0,1fr)}
}

/* ── Filter + sort bar ──────────────────────────────────────────── */
.bo-pa-filterbar{
	display:flex;align-items:center;gap:12px;flex-wrap:wrap;
	border-bottom:1px solid var(--secondary-20);
	padding:0 0 14px;margin:0 0 18px
}
.bo-pa-filterbar__chips{
	display:flex;gap:8px;flex-wrap:wrap;flex:1;min-width:0
}
.bo-pa-chip{
	display:inline-flex;align-items:center;gap:6px;
	padding:7px 14px;border-radius:999px;cursor:pointer;
	background:#fff;border:1px solid var(--secondary-20);
	color:var(--secondary);
	font-family:var(--sans);font-weight:700;font-size:12px;letter-spacing:-0.01em;
	transition:background .15s,color .15s,border-color .15s
}
.bo-pa-chip:hover{border-color:var(--secondary);background:var(--paper)}
.bo-pa-chip.is-active{background:var(--secondary);color:#fff;border-color:var(--secondary)}
.bo-pa-chip__count{
	font-family:var(--mono);font-size:10px;font-weight:700;
	opacity:0.75;margin-left:2px
}
.bo-pa-chip.is-active .bo-pa-chip__count{opacity:0.85}
.bo-pa-filterbar__sort{
	display:inline-flex;align-items:center;gap:8px;margin-left:auto
}
.bo-pa-filterbar__sort-lbl{
	font-family:var(--mono);font-size:10px;font-weight:700;
	letter-spacing:0.08em;color:var(--secondary-60);text-transform:uppercase
}
.bo-pa-filterbar__sort select{
	border:1px solid var(--secondary-20);
	padding:8px 30px 8px 12px;
	border-radius:4px;
	font-family:var(--sans);font-size:12px;font-weight:600;
	line-height:1.4;min-height:34px;
	background-color:#fff;color:var(--secondary);cursor:pointer;
	-webkit-appearance:none;appearance:none;
	background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230F1820' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat:no-repeat;background-position:right 8px center;background-size:12px
}

/* ── Banner row ─────────────────────────────────────────────────── */
.bo-pa-feed{display:flex;flex-direction:column;gap:12px}
.bo-pa-feed-empty{
	padding:32px 20px;text-align:center;
	background:#fff;border:1px dashed var(--secondary-20);border-radius:10px;
	font-size:14px;color:var(--secondary-60)
}

.bo-pa-row{
	position:relative;display:grid;
	grid-template-columns:60px minmax(0,1fr) 170px 140px 140px;
	gap:14px;align-items:center;
	padding:14px 18px;background:#fff;
	border:1px solid var(--secondary-20);border-radius:8px;
	transition:border-color .15s,transform .1s,box-shadow .15s
}
.bo-pa-row:hover{border-color:var(--primary);transform:translateY(-1px);box-shadow:0 6px 18px rgba(16,24,32,0.06)}
.bo-pa-row--settled{opacity:0.82}
.bo-pa-row--hidden{display:none !important}
.bo-pa-row__overlay{
	position:absolute;inset:0;z-index:1;border-radius:inherit
}

/* Logos stack (away top, vs, home bottom). */
.bo-pa-row__logos{
	display:flex;flex-direction:column;align-items:center;gap:4px;
	position:relative;z-index:2
}
.bo-pa-row__logo{
	width:34px;height:34px;border-radius:50%;
	background:var(--paper);border:1px solid var(--secondary-20);
	object-fit:contain;
	display:flex;align-items:center;justify-content:center
}
.bo-pa-row__logo--initials{
	font-family:var(--mono);font-size:9px;font-weight:800;color:var(--secondary)
}
.bo-pa-row__vs{
	font-family:var(--mono);font-size:9px;color:var(--secondary-60);
	letter-spacing:0.06em
}

/* Main cell — tags, title, meta, catchphrase */
.bo-pa-row__main{min-width:0;position:relative;z-index:2}
.bo-pa-row__tags{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.bo-pa-row__status{
	font-family:var(--mono);font-size:9px;font-weight:700;
	letter-spacing:0.08em;text-transform:uppercase;
	color:var(--secondary-60);padding:2px 6px;
	border:1px solid var(--secondary-20);border-radius:3px
}
.bo-pa-row__status--today{background:var(--primary);color:var(--secondary);border-color:var(--primary)}
.bo-pa-row__title{
	font-family:var(--sans);font-weight:800;font-size:15px;
	letter-spacing:-0.01em;color:var(--secondary);display:block;margin-bottom:2px
}
.bo-pa-row__meta{
	font-family:var(--mono);font-size:10px;letter-spacing:0.04em;
	color:var(--secondary-60);text-transform:uppercase
}
.bo-pa-row__note{
	font-family:var(--sans);font-size:13px;line-height:1.45;
	color:var(--secondary);margin-top:6px;max-width:520px
}

/* Confidence cell — pick line + bar + Conf X% */
.bo-pa-row__conf{
	display:flex;flex-direction:column;gap:5px;align-items:flex-start;
	position:relative;z-index:2
}
.bo-pa-row__pick{
	font-family:var(--sans);font-weight:800;font-size:14px;
	color:var(--secondary);letter-spacing:-0.01em
}
.bo-pa-row__bar{
	width:100%;height:5px;background:var(--paper);border-radius:999px;overflow:hidden
}
.bo-pa-row__bar span{display:block;height:100%;background:var(--primary);transition:width .2s}
.bo-pa-row--settled .bo-pa-row__bar span{background:var(--secondary-60)}
.bo-pa-row__conf-lbl{
	font-family:var(--mono);font-size:10px;color:var(--secondary-60);letter-spacing:0.04em
}

/* Bet + Read — both share the same outer format (same min-height, padding,
   border-radius, vertical 3-line stack with a separator) so they read as a
   matched pair of CTAs. Bet fills in the book's brand colour; Read is an
   outline secondary in brand dark. */
.bo-pa-row__bet,
.bo-pa-row__read{
	position:relative;z-index:2;
	display:flex;flex-direction:column;align-items:center;justify-content:center;
	gap:2px;padding:10px 12px;border-radius:6px;
	min-height:76px;align-self:stretch;
	text-align:center;line-height:1;text-decoration:none !important;
	transition:filter .15s,transform .1s,box-shadow .15s,background .15s,color .15s
}

/* Bet — filled button in book colour. */
.bo-pa-row__bet{color:#fff !important}
.bo-pa-row__bet--live{cursor:pointer}
.bo-pa-row__bet--live:hover{
	filter:brightness(1.08);transform:translateY(-1px);
	box-shadow:0 6px 14px rgba(16,24,32,0.14);text-decoration:none
}
.bo-pa-row__bet--closed{
	background:var(--paper);color:var(--secondary) !important;
	border:1px solid var(--secondary-20);cursor:default
}
.bo-pa-row__bet-odds{
	font-family:var(--sans);font-weight:800;font-size:20px;
	letter-spacing:-0.01em;line-height:1.05
}
.bo-pa-row__bet--closed .bo-pa-row__bet-odds{color:var(--secondary)}
.bo-pa-row__bet-book{
	font-family:var(--mono);font-size:10px;font-weight:700;
	letter-spacing:0.04em;opacity:0.92;margin-top:2px
}
.bo-pa-row__bet--closed .bo-pa-row__bet-book{color:var(--secondary-60)}
.bo-pa-row__bet-arrow{
	font-family:var(--sans);font-weight:800;font-size:11px;
	letter-spacing:0.08em;text-transform:uppercase;margin-top:4px;
	padding-top:4px;border-top:1px solid rgba(255,255,255,0.28);
	width:100%
}
.bo-pa-row__bet-arrow--muted{
	color:var(--secondary-60);border-top-color:var(--secondary-20)
}

/* Read — outline secondary, mirrors Bet's 3-line stack so the two CTAs
   have identical visual weight side-by-side. */
.bo-pa-row__read{
	background:transparent;color:var(--secondary) !important;
	border:1.5px solid var(--secondary)
}
.bo-pa-row__read:hover{
	background:var(--secondary);color:#fff !important;transform:translateY(-1px)
}
.bo-pa-row__read-title{
	font-family:var(--sans);font-weight:800;font-size:20px;
	letter-spacing:-0.01em;line-height:1.05
}
.bo-pa-row__read-sub{
	font-family:var(--mono);font-size:10px;font-weight:700;
	letter-spacing:0.04em;opacity:0.8;margin-top:2px;
	text-transform:uppercase
}
.bo-pa-row__read-arrow{
	font-family:var(--sans);font-weight:800;font-size:11px;
	letter-spacing:0.08em;text-transform:uppercase;margin-top:4px;
	padding-top:4px;border-top:1px solid currentColor;
	width:100%;opacity:0.6
}
.bo-pa-row__read:hover .bo-pa-row__read-arrow{opacity:1}

/* ── Sidebar — featured sportsbook + Compare to ─────────────────── */
.bo-pa-aside{
	display:flex;flex-direction:column;gap:16px;
	position:sticky;top:130px
}
.bo-pa-aside-card{
	background:#fff;border:1px solid var(--secondary-20);
	border-radius:10px;padding:22px
}
.bo-pa-aside-card__title{
	font-family:var(--sans);font-weight:800;font-size:16px;
	letter-spacing:-0.01em;color:var(--secondary);
	margin:0 0 14px;padding-bottom:10px;
	border-bottom:1px solid var(--secondary-20)
}

.bo-pa-sb-card{text-align:center}
.bo-pa-sb-card__logo-wrap{
	width:72px;height:72px;border-radius:14px;margin:0 auto 12px;
	display:flex;align-items:center;justify-content:center;
	background:var(--paper);overflow:hidden
}
.bo-pa-sb-card__logo{
	max-width:100%;max-height:100%;object-fit:contain
}
.bo-pa-sb-card__abbr{
	width:100%;height:100%;border-radius:14px;
	display:flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-weight:800;font-size:22px
}
.bo-pa-sb-card__name{
	font-family:var(--sans);font-weight:800;font-size:16px;
	color:var(--secondary);display:block;letter-spacing:-0.01em
}
.bo-pa-sb-card__rating{
	display:flex;align-items:center;justify-content:center;gap:6px;
	margin:6px 0 14px;
	font-family:var(--mono);font-size:11px;color:var(--secondary-60)
}
.bo-pa-sb-card__stars{color:var(--primary);letter-spacing:1px;font-size:13px}
.bo-pa-sb-card__rating-val{font-weight:700;color:var(--secondary)}
.bo-pa-sb-card__btn{
	display:flex;align-items:center;justify-content:center;
	padding:11px 14px;border-radius:6px;
	font-family:var(--sans);font-weight:700;font-size:12px;
	letter-spacing:0.04em;text-transform:uppercase;text-decoration:none;
	margin-bottom:8px;
	transition:filter .15s,background .15s,color .15s,border-color .15s
}
.bo-pa-sb-card__btn--primary{background:var(--primary);color:var(--secondary)}
.bo-pa-sb-card__btn--primary:hover{filter:brightness(1.08);color:var(--secondary);text-decoration:none}
.bo-pa-sb-card__btn--outline{
	background:#fff;color:var(--secondary);
	border:1.5px solid var(--secondary);margin-bottom:12px
}
.bo-pa-sb-card__btn--outline:hover{background:var(--secondary);color:#fff;text-decoration:none}
.bo-pa-sb-card__rg{
	font-family:var(--mono);font-size:9.5px;color:var(--secondary-60);
	letter-spacing:0.04em;line-height:1.5;margin-top:4px
}

.bo-pa-compare-card__list{display:flex;flex-direction:column}
.bo-pa-compare-card__row{
	display:flex;align-items:center;gap:12px;
	padding:12px 0;border-bottom:1px solid var(--secondary-20);
	color:inherit;text-decoration:none;
	transition:opacity .15s
}
.bo-pa-compare-card__row:last-child{border-bottom:none}
.bo-pa-compare-card__row:hover{opacity:0.78;color:inherit;text-decoration:none}
.bo-pa-compare-card__badge{
	width:40px;height:40px;border-radius:8px;flex-shrink:0;
	display:flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-weight:800;font-size:12px;overflow:hidden
}
.bo-pa-compare-card__badge img{max-width:86%;max-height:86%;object-fit:contain}
.bo-pa-compare-card__tx{flex:1;min-width:0}
.bo-pa-compare-card__tx b{
	font-family:var(--sans);font-weight:700;font-size:13.5px;
	color:var(--secondary);display:block;letter-spacing:-0.01em
}
.bo-pa-compare-card__meta{
	font-family:var(--mono);font-size:10px;color:var(--secondary-60);
	letter-spacing:0.04em
}
.bo-pa-compare-card__arrow{
	color:var(--primary);font-size:12px;flex-shrink:0
}

/* Section wrapper + heading row. */
.bo-pa-section{padding:36px 24px}
.bo-pa-section--alt{background:#fff;border-top:1px solid var(--secondary-20)}
.bo-pa-section__inner{max-width:1200px;margin:0 auto}
.bo-pa-section__head{
	display:flex;align-items:baseline;justify-content:space-between;
	gap:12px;margin-bottom:20px;padding-bottom:12px;
	border-bottom:1px solid var(--secondary-20)
}
.bo-pa-section__title{
	font-family:var(--sans);font-weight:800;font-size:22px;
	letter-spacing:-0.01em;color:var(--secondary);margin:0
}
.bo-pa-section__count{
	font-family:var(--mono);font-size:11px;font-weight:700;
	letter-spacing:0.08em;text-transform:uppercase;color:var(--secondary-60)
}

/* Upcoming-picks grid — desktop 3-col (rich cards from bo_tp_render_card). */
.bo-pa-upcoming-grid{grid-template-columns:repeat(3,1fr) !important;gap:14px}
@media (max-width:1100px){
	.bo-pa-upcoming-grid{grid-template-columns:repeat(2,1fr) !important}
}

/* Compact-card grid — 3-col on desktop, 2 on tablet. */
.bo-pa-compact-grid{
	display:grid;grid-template-columns:repeat(3,1fr);gap:14px
}
@media (max-width:1100px){
	.bo-pa-compact-grid{grid-template-columns:repeat(2,1fr)}
}

/* One compact card — used by "Recently published". */
.bo-pa-compact{
	position:relative;display:flex;flex-direction:column;gap:10px;
	padding:14px;background:#fff;border:1px solid var(--secondary-20);
	border-radius:10px;color:inherit;text-decoration:none;
	transition:transform .15s ease,box-shadow .2s ease,border-color .15s ease
}
.bo-pa-compact:hover{
	transform:translateY(-2px);box-shadow:0 10px 26px rgba(16,24,32,0.08);
	border-color:var(--primary);color:inherit;text-decoration:none
}
.bo-pa-compact__hd{
	display:flex;align-items:center;justify-content:space-between;min-height:22px
}
.bo-pa-compact__badge{
	font-family:var(--mono);font-size:10px;font-weight:800;letter-spacing:0.08em;
	padding:3px 8px;border-radius:3px
}
.bo-pa-compact__badge--nba{background:#e8a93a;color:var(--secondary)}
.bo-pa-compact__badge--nfl{background:#d94848;color:#fff}
.bo-pa-compact__badge--mls{background:#5bc06b;color:var(--secondary)}
.bo-pa-compact__date{
	font-family:var(--mono);font-size:11px;color:var(--secondary-60);
	letter-spacing:0.04em
}
.bo-pa-compact__teams{
	display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:center;
	margin:2px 0
}
.bo-pa-compact__side{display:flex;align-items:center;gap:8px;min-width:0}
.bo-pa-compact__side:last-child{flex-direction:row-reverse;text-align:right}
.bo-pa-compact__logo{
	width:32px;height:32px;border-radius:50%;object-fit:contain;
	background:var(--paper);flex-shrink:0;
	display:flex;align-items:center;justify-content:center
}
.bo-pa-compact__logo--initials{
	font-family:var(--mono);font-size:9px;font-weight:800;color:var(--secondary)
}
.bo-pa-compact__name{
	font-family:var(--sans);font-weight:700;font-size:13px;
	color:var(--secondary);line-height:1.2;
	overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0
}
.bo-pa-compact__vs{
	font-family:var(--mono);font-size:10px;color:var(--secondary-60);
	letter-spacing:0.06em;text-align:center
}
.bo-pa-compact__foot{
	display:flex;align-items:center;justify-content:space-between;
	margin-top:auto;padding-top:6px;border-top:1px solid var(--secondary-20)
}
.bo-pa-compact__author{
	font-family:var(--mono);font-size:10px;font-weight:700;
	letter-spacing:0.06em;text-transform:uppercase;color:var(--secondary-60)
}
.bo-pa-compact__arrow{
	font-family:var(--sans);font-weight:800;color:var(--primary);
	transition:transform .15s ease
}
.bo-pa-compact:hover .bo-pa-compact__arrow{transform:translateX(3px)}

/* Pagination — shared desktop + mobile. */
.bo-pa-pagination{
	display:flex;align-items:center;justify-content:center;gap:16px;
	margin-top:28px;padding-top:20px
}
.bo-pa-pagination__btn{
	display:inline-flex;align-items:center;gap:6px;
	padding:10px 18px;border-radius:6px;
	background:#fff;border:1.5px solid var(--secondary);
	color:var(--secondary);text-decoration:none;
	font-family:var(--sans);font-weight:700;font-size:13px;letter-spacing:-0.01em;
	transition:background .15s,color .15s,border-color .15s,transform .1s
}
.bo-pa-pagination__btn:hover{
	background:var(--secondary);color:#fff;text-decoration:none;transform:translateY(-1px)
}
.bo-pa-pagination__btn--primary{
	background:var(--primary);border-color:var(--primary);color:var(--secondary)
}
.bo-pa-pagination__btn--primary:hover{
	background:var(--secondary);border-color:var(--secondary);color:#fff
}
.bo-pa-pagination__btn.is-disabled{
	opacity:0.4;pointer-events:none;cursor:default
}
.bo-pa-pagination__page{
	font-family:var(--mono);font-size:12px;font-weight:700;
	letter-spacing:0.04em;color:var(--secondary)
}
.bo-pa-pagination__of{color:var(--secondary-60);font-weight:600}

/* Empty state. */
.bo-pa-empty{
	padding:48px 20px;text-align:center;
	background:#fff;border:1px dashed var(--secondary-20);border-radius:10px;
	font-family:var(--sans);font-size:14px;color:var(--secondary-60)
}

/* ── Mobile overrides for picks archive v3 ──────────────────────── */
@media (max-width:767px){
	/* Mobile hero — dark, with intro below title, featured card below text. */
	.bo-mpicks--v3 .bo-mpicks-hero{padding:22px 16px 18px}
	.bo-mpicks--v3 .bo-mpicks-hero__text{margin-bottom:14px}
	.bo-mpicks--v3 .bo-mpicks-title{
		font-family:var(--sans);font-weight:800;
		font-size:26px;line-height:1.08;letter-spacing:-0.02em;
		margin:10px 0 8px;color:#fff
	}
	.bo-mpicks--v3 .bo-mpicks-hero .bo-mpicks-intro,
	.bo-mpicks--v3 .bo-mpicks-hero p.bo-mpicks-intro,
	body .bo-mpicks--v3 .bo-mpicks-intro{
		font-family:var(--sans);font-size:14px;line-height:1.5;
		color:#fff !important;margin:0 0 12px
	}
	/* Override legacy 4-cell stat grid — inline bullet ribbon matching hubs. */
	.bo-mpicks--v3 .bo-mpicks-stats{
		display:flex !important;flex-wrap:wrap;gap:10px 14px;
		font-family:var(--mono);font-size:10px;letter-spacing:0.06em;
		text-transform:uppercase;color:#fff;
		background:transparent;border:0;padding:0;
		grid-template-columns:none
	}
	.bo-mpicks--v3 .bo-mpicks-stats span{
		background:transparent;border:0;padding:0;display:inline
	}
	.bo-mpicks--v3 .bo-mpicks-stats b{color:var(--primary);font-weight:800}
	/* Featured card under the hero text (mobile layout). */
	.bo-mpicks-hero__card{margin-top:4px}

	/* Filter bar — scrollable pills row on mobile. */
	.bo-pa-filterbar--mobile{
		display:flex;flex-direction:column;gap:10px;
		padding:12px 14px 14px 14px;margin:0;
		background:var(--paper);border-bottom:1px solid var(--secondary-20)
	}
	.bo-pa-filterbar--mobile .bo-pa-filterbar__chips{
		flex-wrap:nowrap;overflow-x:auto;gap:6px;
		-webkit-overflow-scrolling:touch;scrollbar-width:none
	}
	.bo-pa-filterbar--mobile .bo-pa-filterbar__chips::-webkit-scrollbar{display:none}
	.bo-pa-filterbar--mobile .bo-pa-chip{white-space:nowrap;flex-shrink:0;padding:6px 12px;font-size:11.5px}
	.bo-pa-filterbar--mobile .bo-pa-filterbar__sort{margin-left:0;align-self:flex-end}
	.bo-pa-filterbar--mobile .bo-pa-filterbar__sort select{font-size:11px;padding:5px 8px}

	/* Banner row — stacked/compact layout on mobile.
	   Grid: [logos | main+conf | bet]  Row 2: [Read full preview full-width] */
	.bo-mpicks-feed{padding:12px 14px 22px;background:var(--paper)}
	.bo-mpicks-feed .bo-pa-feed{gap:10px}
	.bo-pa-row{
		grid-template-columns:44px minmax(0,1fr) 108px;
		grid-template-rows:auto auto auto;
		row-gap:10px;column-gap:12px;
		padding:12px 14px
	}
	.bo-pa-row__logos{
		grid-column:1;grid-row:1/span 2;flex-direction:column;gap:2px
	}
	.bo-pa-row__logo{width:28px;height:28px}
	.bo-pa-row__main{grid-column:2;grid-row:1}
	.bo-pa-row__title{font-size:14px}
	.bo-pa-row__note{font-size:12.5px;margin-top:4px}
	.bo-pa-row__conf{
		grid-column:2;grid-row:2;
		flex-direction:row;align-items:center;flex-wrap:wrap;gap:8px
	}
	.bo-pa-row__conf .bo-pa-row__pick{font-size:13px;flex:0 0 auto}
	.bo-pa-row__conf .bo-pa-row__bar{flex:1;min-width:60px;max-width:140px}
	.bo-pa-row__conf .bo-pa-row__conf-lbl{font-size:9.5px;flex:0 0 auto}
	/* Combined Bet button — right column rows 1-2. */
	.bo-pa-row__bet{
		grid-column:3;grid-row:1/span 2;
		padding:8px 8px;
		align-self:stretch
	}
	.bo-pa-row__bet-odds{font-size:17px}
	.bo-pa-row__bet-book{font-size:9.5px}
	.bo-pa-row__bet-arrow{font-size:10px;margin-top:3px;padding-top:3px}
	/* Read full preview — full-width row 3, single-line on mobile (the
	   desktop 3-stack would be too tall here). */
	.bo-pa-row__read{
		grid-column:1/-1;grid-row:3;
		flex-direction:row;gap:5px;min-height:0;
		padding:9px 10px
	}
	.bo-pa-row__read-title,
	.bo-pa-row__read-sub,
	.bo-pa-row__read-arrow{
		font-family:var(--sans);font-weight:700;font-size:11px;
		letter-spacing:0.04em;text-transform:uppercase;
		margin-top:0;padding-top:0;border-top:none !important;
		width:auto;opacity:1;line-height:1
	}

	/* Sidebar section on mobile — stacked below feed, full width. */
	.bo-mpicks-sb-sec{
		padding:14px;display:flex;flex-direction:column;gap:14px;
		background:var(--paper)
	}
	.bo-mpicks-sb-sec .bo-pa-aside-card{padding:18px}

	/* Pagination — tighter on mobile. */
	.bo-pa-pagination{
		gap:10px;padding:18px 14px 0;margin-top:0;flex-wrap:wrap
	}
	.bo-pa-pagination__btn{padding:8px 14px;font-size:12px}
	.bo-pa-pagination__page{font-size:11px}
}

/* ── Desktop hero fallback when viewport is narrow but not mobile ── */
@media (max-width:900px){
	.bo-pa-hero__grid{grid-template-columns:1fr;gap:20px}
	.bo-pa-hero__card{max-width:420px}
}

/* ════════════════════════════════════════════════════════════════════
   DESKTOP PLAYBOOK ARCHIVE (.bo-dpb*) — port of /design-midfi/midfi/guides.js
   ════════════════════════════════════════════════════════════════════ */

/* Dark hero with search + chips. Specificity boost via .bo-dpb scope so we
   beat OceanWP's default <section>/<h1> rules. */
.bo-dpb .bo-dpb-hero,
section.bo-dpb-hero{
	background:var(--secondary) !important;color:#fff !important;
	padding:48px 24px 40px !important;
	margin:0 !important
}
.bo-dpb-hero-inner{
	max-width:1200px;margin:0 auto;
	display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:center
}
.bo-dpb .bo-dpb-hero-text h1,
.bo-dpb-hero .bo-dpb-hero-text h1{
	font-family:var(--sans) !important;font-weight:800 !important;
	font-size:clamp(36px,4.2vw,54px) !important;line-height:1.05 !important;
	letter-spacing:-0.02em !important;margin:10px 0 14px !important;color:#fff !important
}
.bo-dpb-hero-text p{
	font-family:var(--sans);font-size:17px;color:#fff;
	margin:0;max-width:620px;line-height:1.55
}
.bo-dpb-hero-text p a{color:var(--primary);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.bo-dpb-hero-sub{font-size:15px !important;margin:14px 0 0 !important}
/* Crush OceanWP `.oceanwp-theme p{color:#333!important}` cascade. */
html body .bo-dpb-hero-text p,
.bo-dpb .bo-dpb-hero .bo-dpb-hero-text p,
body.oceanwp-theme .bo-dpb-hero-text p{color:#fff !important}

/* Legacy hero search-right block — kept for any other usage; replaced on
   /playbook/ v2.41.1 by the .bo-dpb-hero-latest post card. */
.bo-dpb-hero-search{
	background:#23333c;border:1px solid #2a3b48;border-radius:10px;padding:22px
}

/* Latest-post card in hero right column — v2 : post thumbnail as cover */
.bo-dpb-hero-latest{
	display:flex;flex-direction:column;
	background:#23333c;border:1px solid #2a3b48;border-radius:12px;
	color:#fff;text-decoration:none;cursor:pointer;overflow:hidden;
	transition:border-color .15s,transform .15s,box-shadow .2s
}
.bo-dpb-hero-latest:hover{
	border-color:var(--primary);transform:translateY(-2px);
	box-shadow:0 12px 32px rgba(51,204,112,0.25);
	color:#fff;text-decoration:none
}
/* Cover — uses the post's thumbnail with a dark gradient overlay for text legibility */
.bo-dpb-hero-latest__cover{
	position:relative;min-height:180px;padding:16px 18px;
	display:flex;flex-direction:column;justify-content:space-between;
	background:linear-gradient(135deg,var(--secondary) 0%,#2a4a58 100%);
	background-size:cover;background-position:center
}
.bo-dpb-hero-latest.has-cover .bo-dpb-hero-latest__cover{min-height:200px}
.bo-dpb-hero-latest.no-cover .bo-dpb-hero-latest__cover::after{
	content:"";position:absolute;inset:0;pointer-events:none;
	background:radial-gradient(circle at 85% 20%,rgba(51,204,112,0.25),transparent 55%)
}
.bo-dpb-hero-latest__eyebrow{
	align-self:flex-start;
	font-family:var(--mono);font-size:11px;font-weight:700;color:var(--primary);
	letter-spacing:0.1em;text-transform:uppercase;
	background:rgba(15,24,32,0.55);backdrop-filter:blur(4px);
	padding:4px 10px;border-radius:4px;position:relative;z-index:2
}
.bo-dpb-hero-latest__icon{
	position:absolute;top:14px;right:14px;z-index:2;
	display:inline-flex;align-items:center;justify-content:center;
	width:38px;height:38px;border-radius:8px;
	background:rgba(51,204,112,0.18);border:1px solid rgba(51,204,112,0.35);
	font-size:20px;line-height:1
}
.bo-dpb-hero-latest__tag{
	align-self:flex-start;z-index:2;
	display:inline-flex;background:var(--primary);color:var(--secondary);
	font-family:var(--mono);font-size:10px;font-weight:800;letter-spacing:0.12em;
	padding:4px 10px;border-radius:4px;text-transform:uppercase
}
/* Body — sits below the cover, dark bg for readability */
.bo-dpb-hero-latest__body{padding:18px 20px 20px;display:flex;flex-direction:column;gap:10px}
.bo-dpb-hero-latest__title{
	font-family:var(--sans);font-weight:800;font-size:20px;line-height:1.2;
	letter-spacing:-0.01em;color:#fff;margin:0
}
.bo-dpb-hero-latest__excerpt{
	font-family:var(--sans);font-size:13px;line-height:1.5;
	color:rgba(255,255,255,0.78);margin:0;
	display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden
}
html body .bo-dpb-hero-latest__excerpt,
.bo-dpb .bo-dpb-hero-latest p.bo-dpb-hero-latest__excerpt{color:rgba(255,255,255,0.78) !important}
.bo-dpb-hero-latest__foot{
	display:flex;justify-content:space-between;align-items:baseline;gap:10px;
	padding-top:12px;margin-top:2px;border-top:1px solid rgba(255,255,255,0.08);
	font-family:var(--mono);font-size:11px;letter-spacing:0.04em
}
.bo-dpb-hero-latest__author{color:rgba(255,255,255,0.72);text-transform:uppercase;letter-spacing:0.05em}
.bo-dpb-hero-latest__cta{color:var(--primary);font-weight:700;transition:transform .12s;flex-shrink:0}
.bo-dpb-hero-latest:hover .bo-dpb-hero-latest__cta{transform:translateX(3px)}

/* Filter bar (search + chips) — now lives above the grid, not in the hero. */
.bo-dpb-filters{padding:20px 24px 0;background:#fff;border-bottom:1px solid var(--secondary-20)}
.bo-dpb-section--alt + .bo-dpb-filters{background:var(--paper)}
.bo-dpb-filters__inner{max-width:1200px;margin:0 auto;display:flex;gap:16px;align-items:center;flex-wrap:wrap;padding-bottom:20px}
.bo-dpb-filters__search{
	display:inline-flex;align-items:center;gap:8px;
	background:#fff;border:1px solid var(--secondary-20);border-radius:999px;
	padding:6px 6px 6px 14px;flex:1 1 300px;max-width:460px;
	transition:border-color .15s,box-shadow .15s
}
.bo-dpb-filters__search:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px rgba(51,204,112,0.12)}
.bo-dpb-filters__search svg{color:var(--secondary-60);flex-shrink:0}
.bo-dpb-filters__search input{
	background:transparent;border:0;outline:0;flex:1;padding:6px 0;
	font-family:var(--sans);font-size:14px;color:var(--secondary);min-width:0
}
.bo-dpb-filters__search input::placeholder{color:var(--secondary-60)}
.bo-dpb-filters__reset{
	background:var(--paper) !important;border:0 !important;cursor:pointer !important;
	font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:0.08em;
	color:var(--secondary) !important;padding:7px 14px !important;border-radius:999px !important;
	text-transform:uppercase;flex-shrink:0;transition:background .12s
}
.bo-dpb-filters__reset:hover{background:var(--secondary) !important;color:#fff !important}
.bo-dpb-filters__chips{display:flex;gap:6px;flex-wrap:wrap;flex:1 1 auto;justify-content:flex-end}
.bo-dpb-filters__chips .filter-chip{
	background:#fff;color:var(--secondary);border:1px solid var(--secondary-20);
	cursor:pointer;font-family:var(--sans);font-weight:600;font-size:12px;
	letter-spacing:0.02em;padding:6px 14px;border-radius:999px;
	transition:background .12s,color .12s,border-color .12s
}
.bo-dpb-filters__chips .filter-chip:hover:not(.active){background:var(--paper);color:var(--secondary);border-color:var(--secondary-60)}
.bo-dpb-filters__chips .filter-chip.active{background:var(--secondary);color:#fff;border-color:var(--secondary)}
.bo-dpb-search-input{
	display:flex;align-items:center;gap:10px;
	background:var(--secondary);border-radius:6px;padding:12px 14px;margin-bottom:12px
}
.bo-dpb-search-input svg{color:rgba(255,255,255,0.5);flex-shrink:0}
.bo-dpb-search-input input{
	background:transparent;border:none;outline:none;color:#fff;flex:1;
	font-family:var(--sans);font-size:14px
}
.bo-dpb-search-input input::placeholder{color:var(--secondary-20)}
.bo-dpb-search-input .bo-btn{flex-shrink:0;background:transparent;color:#fff !important;border-color:#fff !important}
.bo-dpb-chips{display:flex;gap:6px;flex-wrap:wrap}
.bo-dpb-chips .filter-chip{
	background:transparent;color:#fff;border-color:#2a3b48;cursor:pointer;text-decoration:none
}
.bo-dpb-chips .filter-chip.active{background:var(--primary);color:var(--secondary);border-color:var(--primary)}

/* Per-category sections. */
.bo-dpb-section{padding:44px 24px;background:#fff}
.bo-dpb-section--alt{background:var(--paper)}
.bo-dpb-section-inner{max-width:1200px;margin:0 auto}
.bo-dpb-section-desc{
	margin:0 0 22px;color:var(--secondary);font-size:15px;max-width:720px;line-height:1.55
}
.bo-dpb-grid{
	display:grid;grid-template-columns:repeat(4,1fr);gap:18px
}

/* Legacy thumbnail-bg cards (kept for safety — no longer rendered). */
.bo-dpb-card{
	display:flex;flex-direction:column;justify-content:flex-end;
	aspect-ratio:1.5;border-radius:8px;
	padding:18px;color:#fff;text-decoration:none;
	background:linear-gradient(135deg,#1A262E,#2a3b48);
	overflow:hidden;position:relative;
	transition:transform 0.15s
}
.bo-dpb-card[data-variant="primary"]{background:linear-gradient(135deg,#1A262E,#33CC70)}
.bo-dpb-card:hover{transform:translateY(-2px)}
.bo-dpb-card .tag{position:absolute;top:14px;left:14px;align-self:flex-start}
.bo-dpb-card-date{
	position:absolute;top:18px;right:14px;
	font-family:var(--mono);font-size:10px;color:rgba(255,255,255,0.6);letter-spacing:0.05em
}
.bo-dpb-card-title{
	font-family:var(--sans);font-weight:800;font-size:18px;
	letter-spacing:-0.01em;line-height:1.2;margin:0;color:#fff
}
.bo-dpb-card-meta{
	color:var(--secondary-20);margin-top:6px;font-size:11px
}

/* ── Guide cards v2 (current) — icon-based, no post thumbnail ───────── */
.bo-dpb-card-v2{
	display:flex;flex-direction:column;gap:10px;padding:18px;
	background:#fff;border:1px solid var(--secondary-20);border-radius:10px;
	color:var(--secondary);text-decoration:none;overflow:hidden;position:relative;
	transition:transform .15s,box-shadow .2s,border-color .15s
}
.bo-dpb-section--alt .bo-dpb-card-v2{background:#fff}
.bo-dpb-card-v2:hover{
	transform:translateY(-3px);border-color:var(--primary);
	box-shadow:0 12px 28px rgba(26,38,46,0.12);text-decoration:none;color:var(--secondary)
}
.bo-dpb-card-v2__icon{
	display:inline-flex;align-items:center;justify-content:center;
	width:44px;height:44px;border-radius:10px;
	background:var(--paper);border:1px solid var(--secondary-20);
	font-size:22px;line-height:1;flex-shrink:0
}
.bo-dpb-card-v2__meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.bo-dpb-card-v2__tag{
	display:inline-flex;background:var(--primary-tint);color:var(--primary);
	font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:0.12em;
	padding:3px 8px;border-radius:999px;text-transform:uppercase
}
.bo-dpb-card-v2__read{
	font-family:var(--mono);font-size:10.5px;color:var(--secondary-60);letter-spacing:0.05em;text-transform:uppercase
}
.bo-dpb-card-v2__title{
	font-family:var(--sans);font-weight:700;font-size:16px;line-height:1.3;
	letter-spacing:-0.005em;color:var(--secondary);margin:0
}
.bo-dpb-card-v2:hover .bo-dpb-card-v2__title{color:var(--primary)}
.bo-dpb-card-v2__foot{
	margin-top:auto;padding-top:12px;border-top:1px solid var(--secondary-20);
	display:flex;justify-content:space-between;align-items:baseline;gap:8px;
	font-family:var(--mono);font-size:10.5px;color:var(--secondary-60);letter-spacing:0.04em
}
.bo-dpb-card-v2__author{font-weight:700;color:var(--secondary);text-transform:none;letter-spacing:0.02em}
.bo-dpb-card-v2__date{font-size:10px}

/* Search input: remove disabled styling, keep dark DA */
.bo-dpb-search-input input:not([disabled]){cursor:text}
.bo-dpb-search-input input:focus{outline:none}
.bo-dpb-search-input:focus-within{box-shadow:0 0 0 1.5px var(--primary)}

/* Category chips — clickable buttons */
.bo-dpb-chips .filter-chip{
	font-family:var(--sans);font-weight:600;font-size:12px;letter-spacing:0.02em;
	padding:7px 14px;border-radius:999px;border:1px solid;
	transition:background .12s,color .12s,border-color .12s
}
.bo-dpb-chips .filter-chip:hover:not(.active){background:rgba(255,255,255,0.06);color:#fff;border-color:#3a4a58}

/* Empty-state message when search returns nothing */
.bo-dpb-empty{
	font-family:var(--mono);font-size:13px;color:var(--secondary-60);letter-spacing:0.02em;
	text-align:center;padding:32px 18px
}

/* FAQ section wrapper */
.bo-dpb-faq{padding:44px 24px;background:var(--paper);border-top:1px solid var(--secondary-20)}
.bo-dpb-faq__inner{max-width:860px;margin:0 auto}
.bo-dpb-faq__hd{text-align:center;margin-bottom:24px}
.bo-dpb-faq__hd h2{
	font-family:var(--sans);font-weight:800;font-size:30px;line-height:1.15;
	letter-spacing:-0.015em;color:var(--secondary);margin:6px 0 0
}

/* Mobile responsive for the playbook desktop renderer (when viewport narrows) */
@media (max-width:767px){
	.bo-dpb-hero-inner{grid-template-columns:1fr;gap:22px}
	.bo-dpb .bo-dpb-hero,section.bo-dpb-hero{padding:28px 16px 24px !important}
	.bo-dpb-hero-search{padding:16px}
	.bo-dpb-hero-latest{padding:18px;gap:10px}
	.bo-dpb-hero-latest__title{font-size:19px}
	.bo-dpb-hero-latest__excerpt{font-size:13px}
	.bo-dpb-filters{padding:14px 14px 0}
	.bo-dpb-filters__inner{flex-direction:column;align-items:stretch;padding-bottom:14px;gap:10px}
	.bo-dpb-filters__search{max-width:100%;flex:0 0 auto}
	.bo-dpb-filters__chips{justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding-bottom:2px}
	.bo-dpb-filters__chips::-webkit-scrollbar{display:none}
	.bo-dpb-filters__chips .filter-chip{white-space:nowrap;flex-shrink:0}
	.bo-dpb-grid{grid-template-columns:1fr;gap:12px}
	.bo-dpb-section{padding:28px 16px}
	.bo-dpb-faq{padding:28px 16px}
	.bo-dpb-faq__hd h2{font-size:22px}
	.bo-dpb-newsletter{padding:36px 16px}
	.bo-dpb-newsletter h2{font-size:24px}
	.bo-dpb-nl-form{flex-direction:column;max-width:100%}
	.bo-dpb-nl-form input{padding:12px 14px}
	.bo-dpb-nl-form .bo-btn{padding:12px 18px}
	.bo-dpb-card-v2__title{font-size:15.5px}
}
@media (min-width:768px) and (max-width:1023px){
	.bo-dpb-grid{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:1024px) and (max-width:1279px){
	.bo-dpb-grid{grid-template-columns:repeat(3,1fr)}
}

/* Newsletter band. */
.bo-dpb-newsletter{background:var(--secondary);color:#fff;padding:50px 24px}
.bo-dpb-newsletter-inner{max-width:900px;margin:0 auto;text-align:center}
.bo-eyebrow{
	font-family:var(--mono);font-size:11px;font-weight:700;
	color:var(--primary);letter-spacing:0.1em;text-transform:uppercase
}
.bo-dpb-newsletter h2{
	color:#fff;margin:6px 0 14px;font-size:36px;
	font-family:var(--sans);font-weight:800;letter-spacing:-0.02em
}
.bo-dpb-newsletter p{color:#fff;font-size:16px;margin:0 auto 22px;max-width:600px;line-height:1.55}
html body .bo-dpb-newsletter p,
.bo-dpb .bo-dpb-newsletter p,
body.oceanwp-theme .bo-dpb-newsletter p{color:#fff !important}
.bo-dpb-nl-form{
	display:flex;gap:10px;justify-content:center;max-width:460px;margin:0 auto
}
.bo-dpb-nl-form input{
	flex:1;padding:14px 16px;border:1.5px solid var(--secondary-20);
	background:transparent;color:#fff;border-radius:4px;
	font-family:var(--sans);font-size:14px;outline:0
}
.bo-dpb-nl-form input::placeholder{color:var(--secondary-20)}
.bo-dpb-nl-form .bo-btn{padding:14px 20px;font-size:14px}

/* accent-head shared utility (used by other desktop sections too). */
.accent-head{
	display:flex;justify-content:space-between;align-items:baseline;
	border-bottom:2px solid var(--secondary);padding-bottom:10px;margin-bottom:18px
}
.accent-head h2{
	font-family:var(--sans);font-weight:800;font-size:22px;letter-spacing:-0.02em;
	margin:0;color:var(--secondary)
}
.accent-head .lnk{
	font-family:var(--mono);font-size:11px;color:var(--primary);
	text-decoration:none;font-weight:700;letter-spacing:0.05em
}
.accent-head .lnk:hover{text-decoration:underline}

/* ════════════════════════════════════════════════════════════════════
   DESKTOP SINGLE ARTICLE (.bo-darticle*) — port of /design-midfi/midfi/playbook-article.js
   ════════════════════════════════════════════════════════════════════ */

/* Dark hero — solid secondary + duotone-style gradient overlay (mid-fi). */
.bo-darticle .bo-darticle-hero,
section.bo-darticle-hero{
	background:var(--secondary) !important;color:#fff !important;
	padding:44px 24px !important;
	position:relative;overflow:hidden
}
.bo-darticle-hero::before{
	content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
	background:
		radial-gradient(circle at 85% 15%, rgba(51,204,112,0.28) 0%, transparent 45%),
		radial-gradient(circle at 15% 85%, rgba(51,204,112,0.12) 0%, transparent 55%),
		linear-gradient(135deg, rgba(30,44,55,0) 0%, rgba(51,204,112,0.05) 100%);
	opacity:0.9
}
.bo-darticle-hero-inner{max-width:880px;margin:0 auto;position:relative;z-index:2}
.bo-darticle-hero-tags{display:flex;gap:10px;margin-bottom:16px}
.bo-darticle .bo-darticle-hero-title,
.bo-darticle-hero .bo-darticle-hero-title{
	font-family:var(--sans) !important;font-weight:800 !important;
	font-size:clamp(32px,4vw,48px) !important;line-height:1.1 !important;
	letter-spacing:-0.02em !important;margin:0 0 16px !important;color:#fff !important
}
.bo-darticle-hero-intro{
	font-family:var(--sans);font-size:18px;color:#fff;
	margin:0 0 18px;max-width:720px;line-height:1.5
}
/* Crush OceanWP `.oceanwp-theme p{color:#333 !important}` cascade. */
html body .bo-darticle-hero-intro,
.bo-darticle .bo-darticle-hero p.bo-darticle-hero-intro,
body.oceanwp-theme .bo-darticle-hero-intro{color:#fff !important}
.bo-darticle-hero-meta{
	color:var(--secondary-20);display:flex;align-items:center;gap:8px;
	font-family:var(--mono);font-size:11px;letter-spacing:0.04em;flex-wrap:wrap
}
.bo-darticle-hero-meta b{color:#fff}
.bo-darticle-hero-meta .sep{color:var(--secondary-20)}
.bo-darticle-avatar{
	width:28px;height:28px;border-radius:50%;
	background:var(--primary);color:var(--secondary);
	display:inline-flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-weight:800;font-size:10px;flex-shrink:0
}

/* 3-col grid: TOC | prose | sidebar. */
/* Article body — force white bg with !important to beat the legacy
   playbook-snippet cascade (snippet 173, now disabled) that forced a dark
   #0F1923 background on body.post-in-category-playbook. Kept defensive. */
.bo-darticle-body,
body.post-in-category-playbook .bo-darticle-body,
body .bo-darticle .bo-darticle-body{padding:32px 24px;background:#fff !important;color:var(--secondary) !important}
.bo-darticle-grid{
	max-width:1360px;margin:0 auto;
	display:grid;grid-template-columns:220px 1fr 280px;gap:56px
}
/* Tighten slightly on mid-desktop so content still has breathing room. */
@media (max-width:1320px){
	.bo-darticle-grid{grid-template-columns:210px 1fr 270px;gap:40px}
}

/* TOC sticky — reprise du design single-pick `.bo-sp-toc` : paper card
   bordered, numbered mono primary markers, hover text primary. */
.bo-darticle-toc{
	position:sticky;top:130px;align-self:start;
	background:var(--paper);border:1px solid var(--secondary-20);
	border-radius:8px;padding:16px 18px
}
.bo-darticle-toc-label{
	font-family:var(--sans);font-weight:700;font-size:13px;
	color:var(--secondary);letter-spacing:0.05em;text-transform:uppercase;
	margin:0 0 12px;padding-bottom:10px;border-bottom:1px solid var(--secondary-20)
}
.bo-darticle-toc-list{
	list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:2px
}
.bo-darticle-toc-list li{display:block}
.bo-darticle-toc-list a{
	display:flex;gap:10px;padding:7px 0;border-radius:0;
	font-family:var(--sans);font-size:13px;color:var(--secondary);
	text-decoration:none;font-weight:500;line-height:1.4;
	transition:color .12s
}
.bo-darticle-toc-list a:hover{background:transparent;color:var(--primary);text-decoration:none}
.bo-darticle-toc-list a:hover .num{color:var(--primary)}
.bo-darticle-toc-list a .num{
	font-family:var(--mono);font-weight:700;font-size:12px;
	color:var(--primary);min-width:26px;flex-shrink:0;letter-spacing:0.02em
}
.bo-darticle-share{margin-top:20px;padding-top:20px;border-top:1px solid var(--secondary-20)}
.bo-darticle-share .bo-meta{font-family:var(--mono);font-size:11px;color:var(--secondary-60);margin-bottom:10px;letter-spacing:0.08em}
.bo-darticle-share-row{display:flex;gap:6px}
.bo-darticle-share-row .bo-btn{width:34px;height:34px;padding:0;justify-content:center}

/* Prose article body — sized to match mid-fi playbook-article.js. */
.bo-darticle-prose{font-size:17px;line-height:1.6;color:var(--secondary);min-width:0}
.bo-darticle-prose > :first-child{margin-top:0}
.bo-darticle-prose p{margin:0 0 16px;color:var(--secondary)}
.bo-darticle-prose h2{
	font-family:var(--sans);font-weight:700;font-size:24px;line-height:1.2;
	letter-spacing:-0.01em;margin:32px 0 12px;color:var(--secondary);scroll-margin-top:120px
}
.bo-darticle-prose h3{
	font-family:var(--sans);font-weight:700;font-size:19px;line-height:1.25;
	letter-spacing:-0.005em;margin:24px 0 8px;color:var(--secondary)
}
.bo-darticle-prose ul,
.bo-darticle-prose ol{padding-left:22px;margin:0 0 18px;color:var(--secondary)}
.bo-darticle-prose ul li,
.bo-darticle-prose ol li{margin-bottom:8px;line-height:1.6}
.bo-darticle-prose a{color:var(--primary);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px}
.bo-darticle-prose blockquote{
	background:var(--primary-tint);border-left:3px solid var(--primary);
	padding:14px 18px;margin:16px 0;border-radius:0 6px 6px 0;
	font-family:var(--sans);font-style:italic;font-size:17px;line-height:1.5;color:var(--secondary)
}
/* Crush OceanWP `.oceanwp-theme p{color:#333 !important}` + body-wide color. */
html body .bo-darticle-prose p,
html body .bo-darticle-prose li,
html body .bo-darticle-prose blockquote,
body.oceanwp-theme .bo-darticle-prose p{color:var(--secondary) !important}
.bo-darticle-prose code{
	background:var(--paper);padding:2px 7px;border-radius:3px;
	font-family:var(--mono);font-size:14px;color:var(--secondary)
}
.bo-darticle-prose img{max-width:100%;height:auto;border-radius:8px;margin:18px 0}
.bo-darticle-prose table{width:100%;border-collapse:collapse;margin:18px 0;font-size:14px}
.bo-darticle-prose th,.bo-darticle-prose td{padding:10px 12px;border:1px solid var(--secondary-20);text-align:left}
.bo-darticle-prose th{background:var(--paper);font-weight:700;font-family:var(--sans)}
.bo-darticle-prose tr.highlight{background:var(--primary-tint)}

/* Right sidebar. */
.bo-darticle-side{position:sticky;top:130px;align-self:start;display:flex;flex-direction:column;gap:16px}
.bo-darticle-side .bo-card{background:#fff;border:1px solid var(--secondary-20);border-radius:6px;padding:20px}
.bo-darticle-side .side-title{
	font-family:var(--sans);font-weight:800;font-size:13px;
	letter-spacing:0.06em;text-transform:uppercase;
	color:var(--secondary);margin:0 0 14px;padding-bottom:10px;
	border-bottom:1px solid var(--secondary-20)
}
.bo-darticle-side .side-list{display:flex;flex-direction:column;gap:12px}
.bo-darticle-side .side-list .item{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none}
.bo-darticle-side .side-list .item .tx{flex:1;min-width:0}
.bo-darticle-side .side-list .item b{font-family:var(--sans);font-weight:700;font-size:13px;color:var(--secondary);display:block;line-height:1.3}
.bo-darticle-side .side-list .item .meta{font-family:var(--mono);font-size:10px;color:var(--secondary-60);margin-top:3px}
.bo-darticle-side .side-list .item .arrow{color:var(--secondary-60);font-size:11px}
.bo-darticle-rel-thumb{
	width:52px;height:52px;flex-shrink:0;border-radius:6px;
	background:linear-gradient(135deg,#1A262E,#33CC70);background-size:cover
}

/* Calculator dark CTA card. (legacy — replaced by .bo-darticle-side-book) */
.bo-darticle-cta{background:var(--secondary) !important;color:#fff !important}
.bo-darticle-cta h4{color:#fff;margin:10px 0 8px;font-size:17px;font-family:var(--sans);font-weight:800}
.bo-darticle-cta p{color:var(--secondary-20);margin:0 0 12px;font-size:13px;line-height:1.5}

/* ── Article v2.42 additions — progress bar, scrollspy, SVG share, up-next,
       sportsbook CTA wrapper, icon-based related cards, mobile TOC. */

/* Reading progress bar — fixed at the very top of the viewport so it sits
   above the site's sticky scoreboard/header and is always visible. */
.bo-darticle-progress{
	position:fixed;top:0;left:0;right:0;z-index:9999;
	height:3px;background:transparent;pointer-events:none
}
.bo-darticle-progress__bar{
	display:block;height:100%;width:0%;background:var(--primary);
	box-shadow:0 0 10px rgba(51,204,112,0.6);transition:width .12s linear
}

/* Author link — white to match mid-fi (<b style="color:#fff">) */
.bo-darticle-author,
.bo-darticle-hero-meta .bo-darticle-author{
	color:#fff !important;text-decoration:none;
	border-bottom:1px solid rgba(51,204,112,0.5);padding-bottom:1px;
	transition:color .15s,border-color .15s
}
.bo-darticle-author b{color:#fff !important}
.bo-darticle-author:hover{color:var(--primary) !important;border-bottom-color:var(--primary);text-decoration:none}
.bo-darticle-author:hover b{color:var(--primary) !important}

/* Scrollspy active state on TOC items — text primary only, no block bg. */
.bo-darticle-toc-list a.is-active{
	background:transparent;color:var(--primary);font-weight:700
}
.bo-darticle-toc-list a.is-active .num{color:var(--primary)}

/* Share buttons — SVG icons in rounded square outline */
.bo-darticle-share-btn{
	display:inline-flex;align-items:center;justify-content:center;
	width:36px;height:36px;border:1px solid var(--secondary-20);
	border-radius:8px;color:var(--secondary-60);text-decoration:none;
	transition:color .12s,border-color .12s,background .12s
}
.bo-darticle-share-btn:hover{color:var(--primary);border-color:var(--primary);background:var(--primary-tint);text-decoration:none}

/* Inline "Up next" CTA injected mid-prose after the 3rd H2. Horizontal
   layout (text left, CTA right) — matches mid-fi playbook-article.js. */
.bo-darticle-upnext{
	display:flex;align-items:center;gap:24px;margin:32px 0;
	padding:24px 28px;background:var(--secondary);color:#fff;border-radius:10px
}
.bo-darticle-upnext__main{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.bo-darticle-upnext__eyebrow{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.08em;color:var(--primary);text-transform:uppercase}
.bo-darticle-upnext__title{font-family:var(--sans);font-weight:800;font-size:20px;line-height:1.25;color:#fff;margin:0;letter-spacing:-0.01em}
html body .bo-darticle-upnext__title{color:#fff !important}
.bo-darticle-upnext__meta{font-family:var(--mono);font-size:11px;letter-spacing:0.04em;color:rgba(255,255,255,0.6)}
.bo-darticle-upnext__cta{
	flex-shrink:0;display:inline-flex;align-items:center;gap:8px;
	background:var(--primary);color:var(--secondary) !important;
	padding:11px 18px;border-radius:6px;
	font-family:var(--sans);font-weight:700;font-size:13px;letter-spacing:0.02em;
	text-decoration:none;transition:transform .12s,box-shadow .15s;white-space:nowrap
}
.bo-darticle-upnext__cta:hover{transform:translateY(-1px);color:var(--secondary) !important;text-decoration:none;box-shadow:0 4px 14px rgba(51,204,112,0.35)}

/* Sidebar sportsbook CTA — wraps bo_dpicks_render_sb_card for this page */
.bo-darticle-side-book .bo-pa-sb-card{
	background:#fff;border:1px solid var(--secondary-20);border-radius:10px;
	padding:22px 20px;text-align:center;box-shadow:0 2px 10px rgba(26,38,46,0.04)
}

/* New related guides cards — icon-based, no post thumbnail */
.bo-darticle-related{padding:18px !important}
.bo-darticle-related__title{
	font-family:var(--sans);font-weight:800;font-size:13px;
	letter-spacing:0.06em;text-transform:uppercase;
	color:var(--secondary);margin:0 0 12px;padding-bottom:10px;
	border-bottom:1px solid var(--secondary-20)
}
.bo-darticle-related__list{display:flex;flex-direction:column;gap:2px}
.bo-darticle-related__item{
	display:flex;align-items:center;gap:10px;padding:10px;border-radius:6px;
	color:var(--secondary);text-decoration:none;transition:background .12s,color .12s
}
.bo-darticle-related__item:hover{background:var(--paper);text-decoration:none;color:var(--secondary)}
.bo-darticle-related__icon{
	width:40px;height:40px;border-radius:10px;
	background:var(--paper);border:1px solid var(--secondary-20);
	display:inline-flex;align-items:center;justify-content:center;
	font-size:20px;line-height:1;flex-shrink:0
}
.bo-darticle-related__tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.bo-darticle-related__tx b{font-family:var(--sans);font-weight:700;font-size:13px;line-height:1.3;color:var(--secondary);letter-spacing:-0.005em}
.bo-darticle-related__meta{font-family:var(--mono);font-size:10px;color:var(--secondary-60);letter-spacing:0.04em}
.bo-darticle-related__arrow{color:var(--secondary-60);font-family:var(--mono);transition:transform .12s,color .12s}
.bo-darticle-related__item:hover .bo-darticle-related__arrow{color:var(--primary);transform:translateX(3px)}

/* ── Mobile article TOC (collapsible <details>) ──────────────────────── */
.bo-msingle-toc{
	margin:14px 16px 18px;background:var(--paper);
	border:1px solid var(--secondary-20);border-radius:10px;overflow:hidden
}
.bo-msingle-toc__summary{
	list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;
	padding:13px 16px;font-family:var(--sans);font-weight:700;font-size:13px;color:var(--secondary)
}
.bo-msingle-toc__summary::-webkit-details-marker{display:none}
.bo-msingle-toc__label{font-family:var(--sans);font-weight:700;letter-spacing:-0.005em}
.bo-msingle-toc__chev{font-family:var(--mono);color:var(--primary);transition:transform .2s}
.bo-msingle-toc[open] .bo-msingle-toc__chev{transform:rotate(180deg)}
.bo-msingle-toc__list{list-style:none;padding:0 0 8px;margin:0;border-top:1px solid var(--secondary-20)}
.bo-msingle-toc__list li a{display:flex;align-items:baseline;gap:10px;padding:9px 16px;color:var(--secondary);text-decoration:none;font-size:13.5px;line-height:1.35}
.bo-msingle-toc__list li a:hover{background:#fff;color:var(--secondary)}
.bo-msingle-toc__num{font-family:var(--mono);font-size:11px;color:var(--secondary-60);min-width:24px;font-weight:700}

/* Mobile override for the inline up-next card */
@media (max-width:767px){
	.bo-darticle-upnext{margin:20px 0;padding:16px 18px}
	.bo-darticle-upnext__title{font-size:16.5px}
	.bo-darticle-upnext__cta{width:100%;justify-content:center}
}

/* ── Authored pb-* content styling (standalone — snippet 173 is disabled)
   Scoped inside .bo-darticle-prose so it never leaks outside the article. */

/* Quick answer box */
.bo-darticle-prose .pb-quick-answer,
.bo-msingle-body .pb-quick-answer{
	background:var(--primary-tint);border:1px solid rgba(51,204,112,0.28);
	border-left:4px solid var(--primary);
	border-radius:0 8px 8px 0;padding:18px 22px;margin:24px 0
}
.bo-darticle-prose .pb-quick-answer__label,
.bo-msingle-body .pb-quick-answer__label{
	display:inline-block;font-family:var(--mono);font-weight:700;font-size:11px;
	letter-spacing:0.1em;color:var(--primary);text-transform:uppercase;margin-bottom:6px
}
.bo-darticle-prose .pb-quick-answer__text,
.bo-msingle-body .pb-quick-answer__text{
	font-family:var(--sans);font-size:16px;line-height:1.6;color:var(--secondary);margin:0
}
html body .bo-darticle-prose .pb-quick-answer__text,
html body .bo-msingle-body .pb-quick-answer__text{color:var(--secondary) !important}

/* Step cards (how-to lists) */
.bo-darticle-prose .pb-step,
.bo-msingle-body .pb-step{
	display:flex;gap:16px;padding:16px 18px;margin:10px 0;
	background:#fff;border:1px solid var(--secondary-20);border-radius:8px
}
.bo-darticle-prose .pb-step__number,
.bo-msingle-body .pb-step__number{
	flex-shrink:0;width:32px;height:32px;border-radius:50%;
	background:var(--secondary);color:#fff;
	display:inline-flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-weight:800;font-size:13px
}
.bo-darticle-prose .pb-step__content,
.bo-msingle-body .pb-step__content{flex:1;min-width:0}

/* Highlight boxes (insight / tip / etc.) */
.bo-darticle-prose .pb-highlight,
.bo-msingle-body .pb-highlight{
	display:flex;gap:14px;padding:14px 16px;margin:16px 0;
	background:var(--paper);border-radius:8px;border-left:3px solid var(--primary)
}
.bo-darticle-prose .pb-highlight--tip,
.bo-msingle-body .pb-highlight--tip{border-left-color:#E8A93A}
.bo-darticle-prose .pb-highlight--insight,
.bo-msingle-body .pb-highlight--insight{border-left-color:var(--primary)}
.bo-darticle-prose .pb-highlight__icon,
.bo-msingle-body .pb-highlight__icon{flex-shrink:0;font-size:20px;line-height:1.3}
.bo-darticle-prose .pb-highlight__content,
.bo-msingle-body .pb-highlight__content{flex:1;min-width:0}

/* Stat boxes (number + label) — uniform full-width blocks so successive
   stat-boxes in a row all render at the same size regardless of label length. */
.bo-darticle-prose .pb-stat-box,
.bo-msingle-body .pb-stat-box{
	display:flex;flex-direction:column;gap:6px;padding:22px 24px;
	width:100%;box-sizing:border-box;
	background:var(--secondary);color:#fff;border-radius:10px;
	margin:12px 0;text-align:center;align-items:center;justify-content:center;
	min-height:96px
}
/* Hide the inline <br> WP wraps between number + label so the flex column
   doesn't inherit weird line-height gaps. */
.bo-darticle-prose .pb-stat-box br,
.bo-msingle-body .pb-stat-box br{display:none}
.bo-darticle-prose .pb-stat-box__number,
.bo-msingle-body .pb-stat-box__number{
	font-family:var(--sans);font-weight:800;font-size:32px;color:var(--primary);line-height:1;letter-spacing:-0.01em
}
.bo-darticle-prose .pb-stat-box__label,
.bo-msingle-body .pb-stat-box__label{
	font-family:var(--mono);font-size:11px;color:rgba(255,255,255,0.75);letter-spacing:0.08em;text-transform:uppercase;line-height:1.45
}

/* ═══════════════════════════════════════════════════════════════════
 * FAQ — accordion design (native <details>/<summary>, no JS required).
 * Structure :
 *   <h2 class="pb-faq__title">Frequently Asked Questions</h2>
 *   <details>
 *     <summary>Question text</summary>
 *     <div class="pb-faq__answer">Answer text</div>
 *   </details>
 *   … repeated …
 * Scope limited to content prose so the mobile TOC (.bo-msingle-toc, which
 * is also a <details>) keeps its own look outside the body.
 * ═══════════════════════════════════════════════════════════════════ */

/* Section header — upgrade the default h2 rendering to mark this as a
   grouped block (larger, subtle underline rule). */
.bo-darticle-prose .pb-faq__title,
.bo-msingle-body .pb-faq__title{
	font-family:var(--sans);font-weight:800;font-size:24px;line-height:1.2;
	color:var(--secondary);letter-spacing:-0.01em;
	margin:36px 0 16px;padding-bottom:10px;border-bottom:2px solid var(--secondary-10)
}

/* ── Accordion cards ─────────────────────────────────────────────── */
.bo-darticle-prose details,
.bo-msingle-body details{
	background:#fff;
	border:1px solid var(--secondary-20);
	border-radius:10px;
	margin:10px 0;
	overflow:hidden;
	transition:border-color .15s ease, box-shadow .2s ease, background .15s ease
}
.bo-darticle-prose details + details,
.bo-msingle-body details + details{margin-top:8px}
.bo-darticle-prose details:hover,
.bo-msingle-body details:hover{border-color:var(--primary-60)}
.bo-darticle-prose details[open],
.bo-msingle-body details[open]{
	border-color:var(--primary);
	box-shadow:0 2px 12px rgba(51,204,112,0.14)
}

/* ── Summary (question) ─────────────────────────────────────────── */
.bo-darticle-prose details > summary,
.bo-msingle-body details > summary{
	list-style:none;cursor:pointer;user-select:none;
	display:flex;gap:14px;align-items:flex-start;
	padding:16px 20px;
	font-family:var(--sans);font-weight:700;font-size:16px;line-height:1.45;
	color:var(--secondary);
	position:relative
}
.bo-darticle-prose details > summary::-webkit-details-marker,
.bo-msingle-body details > summary::-webkit-details-marker{display:none}
.bo-darticle-prose details > summary::marker,
.bo-msingle-body details > summary::marker{content:''}

/* Q badge on the left — primary-tint pill with mono "Q" */
.bo-darticle-prose details > summary::before,
.bo-msingle-body details > summary::before{
	content:'Q';
	flex-shrink:0;
	width:28px;height:28px;
	display:inline-flex;align-items:center;justify-content:center;
	background:var(--primary-tint);color:var(--primary);
	font-family:var(--mono);font-weight:700;font-size:12px;
	border-radius:50%;
	margin-top:-1px;
	transition:background .15s ease
}
.bo-darticle-prose details[open] > summary::before,
.bo-msingle-body details[open] > summary::before{
	background:var(--primary);color:#fff
}

/* Question text fills available space */
.bo-darticle-prose details > summary > *:not(.pb-faq__chev),
.bo-msingle-body details > summary > *:not(.pb-faq__chev){flex:1;min-width:0}

/* Chevron on the right (CSS arrow, rotates 180° when open) */
.bo-darticle-prose details > summary::after,
.bo-msingle-body details > summary::after{
	content:'';
	flex-shrink:0;
	margin-left:auto;margin-top:8px;
	width:9px;height:9px;
	border-right:2px solid var(--secondary-60);
	border-bottom:2px solid var(--secondary-60);
	transform:rotate(45deg);
	transition:transform .2s ease, border-color .15s ease
}
.bo-darticle-prose details:hover > summary::after,
.bo-msingle-body details:hover > summary::after{border-color:var(--primary)}
.bo-darticle-prose details[open] > summary::after,
.bo-msingle-body details[open] > summary::after{
	transform:rotate(-135deg);
	margin-top:12px;
	border-color:var(--primary)
}

/* Hover state — subtle primary lift on the whole card */
.bo-darticle-prose details:hover > summary,
.bo-msingle-body details:hover > summary{color:var(--primary)}
.bo-darticle-prose details[open] > summary,
.bo-msingle-body details[open] > summary{
	color:var(--secondary);
	border-bottom:1px solid var(--secondary-10);
	padding-bottom:14px
}

/* ── Answer ─────────────────────────────────────────────────────── */
.bo-darticle-prose .pb-faq__answer,
.bo-msingle-body .pb-faq__answer{
	padding:14px 20px 18px 62px; /* left padding aligns with Q text, skips the Q badge */
	font-family:var(--sans);font-size:15px;line-height:1.65;
	color:var(--secondary);
	margin:0
}
.bo-darticle-prose .pb-faq__answer a,
.bo-msingle-body .pb-faq__answer a{
	color:var(--primary);text-decoration:underline;text-underline-offset:2px
}

/* Mobile tightening — keep same pattern but a little more compact */
@media (max-width:640px){
	.bo-darticle-prose details > summary,
	.bo-msingle-body details > summary{padding:14px 16px;font-size:15px;gap:12px}
	.bo-darticle-prose details > summary::before,
	.bo-msingle-body details > summary::before{width:24px;height:24px;font-size:11px}
	.bo-darticle-prose .pb-faq__answer,
	.bo-msingle-body .pb-faq__answer{padding:12px 16px 16px 52px;font-size:14.5px}
}

/* Beat OceanWP p color crush for FAQ answer contents — answer is a <div>
   but may wrap text in <p> after wpautop processes authored content. */
html body .bo-darticle-prose .pb-faq__answer p,
body.oceanwp-theme .bo-darticle-prose .pb-faq__answer p{color:var(--secondary) !important}

/* ─── FAQ accordion — extend to desktop sportsbook review (.bo-dsb-prose) ───
   The rules above scope the native <details>/<summary> styling to playbook
   (.bo-darticle-prose) + mobile (.bo-msingle-body). The sportsbook review
   desktop FAQ lives inside .bo-dsb-prose, which wasn't in the chain — so it
   rendered raw. This block applies the exact same visual contract (card,
   Q badge, chevron, open state) to .bo-dsb-prose as well.
   v2.44.2 — Parity fix for user feedback "applique le meme design que mobile". */
.bo-dsb-prose .pb-faq__title{
	font-family:var(--sans);font-weight:800;font-size:24px;line-height:1.2;
	color:var(--secondary);letter-spacing:-0.01em;
	margin:36px 0 16px;padding-bottom:10px;border-bottom:2px solid var(--secondary-10)
}
.bo-dsb-prose details{
	background:#fff;border:1px solid var(--secondary-20);border-radius:10px;
	margin:10px 0;overflow:hidden;
	transition:border-color .15s ease, box-shadow .2s ease, background .15s ease
}
.bo-dsb-prose details + details{margin-top:8px}
.bo-dsb-prose details:hover{border-color:var(--primary-60)}
.bo-dsb-prose details[open]{
	border-color:var(--primary);
	box-shadow:0 2px 12px rgba(51,204,112,0.14)
}

.bo-dsb-prose details > summary{
	list-style:none;cursor:pointer;user-select:none;
	display:flex;gap:14px;align-items:flex-start;
	padding:16px 20px;
	font-family:var(--sans);font-weight:700;font-size:16px;line-height:1.45;
	color:var(--secondary);position:relative
}
.bo-dsb-prose details > summary::-webkit-details-marker{display:none}
.bo-dsb-prose details > summary::marker{content:''}

/* Q badge */
.bo-dsb-prose details > summary::before{
	content:'Q';
	flex-shrink:0;width:28px;height:28px;
	display:inline-flex;align-items:center;justify-content:center;
	background:var(--primary-tint);color:var(--primary);
	font-family:var(--mono);font-weight:700;font-size:12px;
	border-radius:50%;margin-top:-1px;
	transition:background .15s ease
}
.bo-dsb-prose details[open] > summary::before{background:var(--primary);color:#fff}

.bo-dsb-prose details > summary > *:not(.pb-faq__chev){flex:1;min-width:0}

/* Chevron */
.bo-dsb-prose details > summary::after{
	content:'';flex-shrink:0;margin-left:auto;margin-top:8px;
	width:9px;height:9px;
	border-right:2px solid var(--secondary-60);
	border-bottom:2px solid var(--secondary-60);
	transform:rotate(45deg);
	transition:transform .2s ease, border-color .15s ease
}
.bo-dsb-prose details:hover > summary::after{border-color:var(--primary)}
.bo-dsb-prose details[open] > summary::after{
	transform:rotate(-135deg);margin-top:12px;border-color:var(--primary)
}

/* Hover / open state text colors */
.bo-dsb-prose details:hover > summary{color:var(--primary)}
.bo-dsb-prose details[open] > summary{
	color:var(--secondary);
	border-bottom:1px solid var(--secondary-10);
	padding-bottom:14px
}

/* Answer */
.bo-dsb-prose .pb-faq__answer{
	padding:14px 20px 18px 62px;
	font-family:var(--sans);font-size:15px;line-height:1.65;
	color:var(--secondary);margin:0
}
.bo-dsb-prose .pb-faq__answer a{
	color:var(--primary);text-decoration:underline;text-underline-offset:2px
}
/* Crush OceanWP p color for FAQ answer text on desktop sportsbook too. */
html body .bo-dsb-prose .pb-faq__answer p,
body.oceanwp-theme .bo-dsb-prose .pb-faq__answer p{color:var(--secondary) !important}

/* The FAQ section is already rendered inside a .bo-dsb-card (white card,
   border, padding, radius). Strip the card's default padding/bg so the
   inner accordion items (which have their own cards) don't double-up —
   the h2 stays visible at the top, the <details> cards flow clean. */
.bo-dsb-card.bo-dsb-prose > .pb-faq__title:first-child{margin-top:0}

/* Tables */
.bo-darticle-prose .pb-table-wrap,
.bo-msingle-body .pb-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:18px 0}
.bo-darticle-prose .pb-table,
.bo-msingle-body .pb-table{
	width:100%;border-collapse:collapse;font-family:var(--sans);font-size:14px
}
.bo-darticle-prose .pb-table th,
.bo-darticle-prose .pb-table td,
.bo-msingle-body .pb-table th,
.bo-msingle-body .pb-table td{
	padding:10px 12px;border:1px solid var(--secondary-20);text-align:left
}
.bo-darticle-prose .pb-table th,
.bo-msingle-body .pb-table th{background:var(--paper);font-weight:700;color:var(--secondary)}

/* Inline CTA blocks (pb-cta, pb-login-cta) */
.bo-darticle-prose .pb-cta,
.bo-msingle-body .pb-cta{
	background:var(--secondary);color:#fff;padding:22px 26px;border-radius:10px;margin:22px 0
}
.bo-darticle-prose .pb-cta__title,
.bo-msingle-body .pb-cta__title{font-family:var(--sans);font-weight:800;font-size:20px;color:#fff;margin:0 0 6px;line-height:1.25}
.bo-darticle-prose .pb-cta__text,
.bo-msingle-body .pb-cta__text{color:rgba(255,255,255,0.82);font-size:15px;line-height:1.55;margin:0 0 14px}
/* Beat the `.bo-darticle-prose p{color:var(--secondary) !important}` crush
   defined earlier — without this override OceanWP's cascade (or our own
   defensive crush) repaints `Ready to Place…` + `Use our expert…` in
   #333/secondary since they live inside `<p>` tags. */
html body .bo-darticle-prose .pb-cta,
html body .bo-darticle-prose .pb-cta p,
html body .bo-darticle-prose .pb-cta .pb-cta__title,
html body .bo-msingle-body .pb-cta p,
body.oceanwp-theme .bo-darticle-prose .pb-cta p{color:#fff !important}
html body .bo-darticle-prose .pb-cta .pb-cta__text,
body.oceanwp-theme .bo-darticle-prose .pb-cta .pb-cta__text{color:rgba(255,255,255,0.82) !important}
.bo-darticle-prose .pb-cta__btn,
.bo-darticle-prose .pb-cta-btn,
.bo-msingle-body .pb-cta__btn,
.bo-msingle-body .pb-cta-btn{
	display:inline-block;background:var(--primary);color:var(--secondary);
	padding:10px 18px;border-radius:6px;font-family:var(--sans);font-weight:700;font-size:13px;
	text-decoration:none;letter-spacing:0.02em
}

/* Section wrappers (content organisation — no visual but keep spacing) */
.bo-darticle-prose .pb-section,
.bo-msingle-body .pb-section{margin:0}

/* Hide remnants we stripped but that could re-appear on unstripped posts */
.bo-darticle-prose .pb-schema,
.bo-darticle-prose .pb-hero,
.bo-msingle-body .pb-schema,
.bo-msingle-body .pb-hero{display:none}

/* Fix authored content list spacing (ul/ol on pb-body) — inherit our prose */
.bo-darticle-prose .pb-container ul,
.bo-darticle-prose .pb-body ul,
.bo-darticle-prose .pb-container ol,
.bo-darticle-prose .pb-body ol{
	padding-left:22px;margin:0 0 16px;color:var(--secondary);font-size:17px;line-height:1.6
}
.bo-darticle-prose .pb-container li,
.bo-darticle-prose .pb-body li{margin:0 0 8px;line-height:1.55}
html body .bo-darticle-prose .pb-container li,
html body .bo-darticle-prose .pb-body li,
html body .bo-darticle-prose .pb-quick-answer p{color:var(--secondary) !important}

/* ── End-of-article author card (replaces the stripped pb-author-block) */
.bo-darticle-authorcard{
	display:flex;align-items:center;gap:18px;padding:22px 24px;margin:32px 0 0;
	background:var(--paper);border:1px solid var(--secondary-20);border-radius:12px
}
.bo-darticle-authorcard__avatar{
	flex-shrink:0;width:56px;height:56px;border-radius:50%;
	background:var(--secondary);color:#fff;
	display:inline-flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-weight:800;font-size:18px;letter-spacing:0.02em
}
.bo-darticle-authorcard__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.bo-darticle-authorcard__eyebrow{
	font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:0.12em;
	color:var(--secondary-60);text-transform:uppercase
}
.bo-darticle-authorcard__name{
	font-family:var(--sans);font-weight:800;font-size:18px;color:var(--secondary);
	text-decoration:none;letter-spacing:-0.005em
}
a.bo-darticle-authorcard__name{border-bottom:1px solid transparent;transition:color .12s,border-color .12s}
a.bo-darticle-authorcard__name:hover{color:var(--primary);border-bottom-color:var(--primary)}
.bo-darticle-authorcard__bio{
	font-family:var(--sans);font-size:13.5px;line-height:1.5;color:var(--secondary-60);
	margin:2px 0 0;max-width:620px
}
html body .bo-darticle-authorcard__bio{color:var(--secondary-60) !important}
.bo-darticle-authorcard__cta{
	align-self:flex-start;font-family:var(--mono);font-size:11px;font-weight:700;
	letter-spacing:0.06em;color:var(--primary);text-decoration:none;margin-top:6px
}
.bo-darticle-authorcard__cta:hover{text-decoration:underline}

@media (max-width:767px){
	.bo-darticle-authorcard{flex-direction:column;text-align:center;align-items:center;padding:18px}
	.bo-darticle-authorcard__body{align-items:center}
	.bo-darticle-authorcard__bio{text-align:center}
}

/* ════════════════════════════════════════════════════════════════════
   DESKTOP ELEMENTOR PAGE OVERRIDES — single pick + single sportsbook
   review pages are rendered by the Elementor Theme Builder. We polish
   them with CSS so they fit the new design language without rebuilding.
   ════════════════════════════════════════════════════════════════════ */

/* Single pick: tighten H1, prose, sportsbook cards, sidebar. */
@media (min-width:768px){
	body.single-nba-predictions .elementor-shortcode h1,
	body.single-nfl-predictions .elementor-shortcode h1,
	body.single-mls-picks .elementor-shortcode h1{
		font-family:var(--sans);font-weight:800;font-size:32px;letter-spacing:-0.02em;
		line-height:1.1;margin:0 0 14px;color:var(--secondary)
	}
	body.single-nba-predictions .elementor-shortcode h2,
	body.single-nfl-predictions .elementor-shortcode h2,
	body.single-mls-picks .elementor-shortcode h2{
		position:relative;
		font-family:var(--sans);font-weight:800;font-size:24px;letter-spacing:-0.02em;
		line-height:1.15;margin:32px 0 14px;color:var(--secondary);
		padding-bottom:12px;border-bottom:1px solid var(--secondary-20)
	}
	body.single-nba-predictions .elementor-shortcode h2::before,
	body.single-nfl-predictions .elementor-shortcode h2::before,
	body.single-mls-picks .elementor-shortcode h2::before{
		content:'';position:absolute;left:0;bottom:-1px;
		width:60px;height:3px;background:var(--primary)
	}
	body.single-nba-predictions .elementor-shortcode h3,
	body.single-nfl-predictions .elementor-shortcode h3,
	body.single-mls-picks .elementor-shortcode h3{
		font-family:var(--sans);font-weight:800;font-size:18px;letter-spacing:-0.01em
	}
	body.single-nba-predictions .elementor-shortcode p,
	body.single-nfl-predictions .elementor-shortcode p,
	body.single-mls-picks .elementor-shortcode p{font-size:15px;line-height:1.6;color:var(--secondary)}
	body.single-nba-predictions .sports-match-header-preview,
	body.single-nfl-predictions .sports-match-header-preview,
	body.single-mls-picks .sports-match-header-preview{
		background:var(--secondary) !important;color:#fff !important;
		padding:24px !important;border-radius:8px;margin-bottom:24px
	}

	/* "Bet on X" CTA: keep red signalling, but tighten font/padding. */
	body.single-nba-predictions .sports-bet-button,
	body.single-nfl-predictions .sports-bet-button,
	body.single-mls-picks .sports-bet-button{
		font-family:var(--sans) !important;
		font-weight:700 !important;
		font-size:13px !important;
		letter-spacing:0.02em !important;
		text-transform:uppercase !important;
		padding:10px 18px !important;
		transition:transform .1s,box-shadow .15s
	}
	body.single-nba-predictions .sports-bet-button:hover,
	body.single-nfl-predictions .sports-bet-button:hover,
	body.single-mls-picks .sports-bet-button:hover{
		transform:translateY(-1px);
		box-shadow:0 4px 12px rgba(225,6,0,0.25)
	}

	/* GT standings table (gt-nba-standings / gt-nfl-standings / gt-mls-standings). */
	body.single-nba-predictions .gt-nba-standings,
	body.single-nfl-predictions .gt-nfl-standings,
	body.single-mls-picks .gt-mls-standings{
		border:1px solid var(--secondary-20);
		border-radius:8px;
		overflow:hidden
	}
	body.single-nba-predictions .gt-nba-standings table,
	body.single-nfl-predictions .gt-nfl-standings table,
	body.single-mls-picks .gt-mls-standings table{
		font-family:var(--sans);font-size:13px
	}
	body.single-nba-predictions .gt-nba-standings th,
	body.single-nfl-predictions .gt-nfl-standings th,
	body.single-mls-picks .gt-mls-standings th{
		background:var(--paper) !important;
		color:var(--secondary) !important;
		font-family:var(--mono);
		font-size:10px;
		letter-spacing:0.08em;
		text-transform:uppercase;
		font-weight:700
	}

	/* Head-to-head card border. */
	body.single-nba-predictions .bo-h2h-nba,
	body.single-nfl-predictions .bo-h2h-nfl,
	body.single-mls-picks .bo-h2h-mls{
		border:1px solid var(--secondary-20);
		border-radius:8px;
		padding:18px;
		background:#fff
	}
}

/* Single sportsbook review: gradient hero polish + scorecards + sidebar. */
@media (min-width:768px){
	body.single-sportsbooks-bonuses .elementor-shortcode h1{
		font-family:var(--sans);font-weight:800;font-size:38px;letter-spacing:-0.02em;
		line-height:1.05;margin:0 0 14px;color:var(--secondary)
	}
	body.single-sportsbooks-bonuses .elementor-shortcode h2{
		font-family:var(--sans);font-weight:800;font-size:24px;letter-spacing:-0.02em;
		line-height:1.15;margin:28px 0 12px;color:var(--secondary);
		padding-bottom:8px;border-bottom:2px solid var(--secondary)
	}
	body.single-sportsbooks-bonuses .sportsbook-box{
		border:1px solid var(--secondary-20) !important;
		border-radius:8px !important;
		transition:border-color 0.15s,transform 0.1s
	}
	body.single-sportsbooks-bonuses .sportsbook-box:hover{
		border-color:var(--primary) !important;transform:translateY(-2px)
	}

	/* Bet type cards (Moneyline, Point Spread, Totals, Parlays, …) — gt-* is the
	   Geniustipster review plugin. */
	body.single-sportsbooks-bonuses .gt-bet-box{
		border:1px solid var(--secondary-20) !important;
		border-radius:8px !important;
		padding:16px 18px !important;
		background:#fff !important;
		transition:border-color .15s,transform .1s,box-shadow .15s
	}
	body.single-sportsbooks-bonuses .gt-bet-box:hover{
		border-color:var(--primary) !important;
		transform:translateY(-2px);
		box-shadow:0 4px 12px rgba(0,0,0,0.06)
	}
	body.single-sportsbooks-bonuses .gt-bet-tag{
		display:inline-block !important;
		padding:3px 10px !important;
		background:var(--primary-tint) !important;
		color:var(--primary) !important;
		border-radius:999px !important;
		font-family:var(--mono) !important;
		font-size:10px !important;
		font-weight:700 !important;
		letter-spacing:0.08em !important;
		text-transform:uppercase !important;
		margin-bottom:8px !important
	}
	body.single-sportsbooks-bonuses .gt-bet-name{
		font-family:var(--sans) !important;
		font-weight:700 !important;
		font-size:15px !important;
		color:var(--secondary) !important;
		line-height:1.3 !important
	}

	/* Payment methods grid — consistent card borders. */
	body.single-sportsbooks-bonuses .gt-payments-wrapper{gap:12px !important}
	body.single-sportsbooks-bonuses .gt-payments-wrapper > *{
		border:1px solid var(--secondary-20) !important;
		border-radius:8px !important;
		transition:border-color .15s,transform .1s
	}
	body.single-sportsbooks-bonuses .gt-payments-wrapper > *:hover{
		border-color:var(--primary) !important;
		transform:translateY(-2px)
	}

	/* H2 accent bar — replace full underline with brand-colored left tick. */
	body.single-sportsbooks-bonuses .elementor-shortcode h2{
		position:relative;
		border-bottom:1px solid var(--secondary-20) !important;
		padding-bottom:12px !important;
		margin-top:36px !important
	}
	body.single-sportsbooks-bonuses .elementor-shortcode h2::before{
		content:'';position:absolute;left:0;bottom:-1px;
		width:60px;height:3px;background:var(--primary)
	}

	/* Paragraph leading tuned for review density. */
	body.single-sportsbooks-bonuses .elementor-shortcode p{
		font-size:15px;line-height:1.7;color:var(--secondary)
	}
}

/* Sportsbooks archive (/sportsbooks/) — custom template page.
   Uses full bo-page width (1440px frame) to match home layout. */
@media (min-width:768px){
	body.page-template-page-sportsbooks .bo-sportsbooks-desktop{
		max-width:none;margin:0;padding:0
	}
	body.page-template-page-sportsbooks .bo-sportsbooks__content > h2{
		position:relative;
		font-family:var(--sans);font-weight:800;font-size:28px;letter-spacing:-0.02em;
		line-height:1.15;margin:36px 0 14px;color:var(--secondary);
		padding-bottom:12px;border-bottom:1px solid var(--secondary-20)
	}
	body.page-template-page-sportsbooks .bo-sportsbooks__content > h2::before{
		content:'';position:absolute;left:0;bottom:-1px;
		width:60px;height:3px;background:var(--primary)
	}
	body.page-template-page-sportsbooks .bo-sportsbooks__content > h3{
		font-family:var(--sans);font-weight:700;font-size:18px;letter-spacing:-0.01em;
		color:var(--secondary);margin:22px 0 8px
	}
	body.page-template-page-sportsbooks .bo-sportsbooks__content p{
		font-size:15px;line-height:1.7;color:var(--secondary)
	}

	/* Sportsbook cards (BetMGM/FanDuel/Caesars/DraftKings) — subtle lift. */
	body.page-template-page-sportsbooks .sportsbook-card{
		transition:transform .15s,box-shadow .15s;
		border-radius:12px;overflow:hidden
	}
	body.page-template-page-sportsbooks .sportsbook-card:hover{
		transform:translateY(-3px);
		box-shadow:0 8px 20px rgba(0,0,0,0.12)
	}
	body.page-template-page-sportsbooks .sportsbook-btn{
		transition:transform .1s,box-shadow .15s;
		font-family:var(--sans);font-weight:700;letter-spacing:0.02em
	}
	body.page-template-page-sportsbooks .sportsbook-btn-play:hover{
		transform:translateY(-1px);
		box-shadow:0 4px 12px rgba(230,57,70,0.30)
	}
	body.page-template-page-sportsbooks .sportsbook-btn-review:hover{
		transform:translateY(-1px)
	}

	/* Rated-sportsbook rows (`.sportsbook-box` is rendered here too). */
	body.page-template-page-sportsbooks .sportsbook-box{
		border:1px solid var(--secondary-20) !important;
		border-radius:8px !important;
		transition:border-color .15s,transform .1s
	}
	body.page-template-page-sportsbooks .sportsbook-box:hover{
		border-color:var(--primary) !important;
		transform:translateY(-2px)
	}
}

/* ════════════════════════════════════════════════════════════════════════
   Betting tools hub (/betting-tools/) — page-tools.php (v2.36.x)
   Dark hero + dynamic stats ribbon + editorial body + FAQ collapsible.
   ════════════════════════════════════════════════════════════════════════ */

.bo-tools{background:var(--paper)}

/* Dark hero */
.bo-tools-hero{background:var(--secondary);color:#fff;padding:52px 24px 44px;position:relative;overflow:hidden;border-bottom:1px solid #000}
.bo-tools-hero::before{content:"";position:absolute;top:-120px;right:-80px;width:360px;height:360px;border:1px solid rgba(51,204,112,0.18);border-radius:50%;pointer-events:none}
.bo-tools-hero::after{content:"";position:absolute;bottom:-140px;left:-60px;width:320px;height:320px;border:1px solid rgba(51,204,112,0.12);border-radius:50%;pointer-events:none}
.bo-tools-hero__inner{max-width:1120px;margin:0 auto;position:relative;z-index:2}
.bo-tools-hero__tag{display:inline-block;background:var(--primary);color:var(--secondary);font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.12em;padding:5px 11px;border-radius:3px;text-transform:uppercase}
.bo-tools-hero__title{font-family:var(--sans);font-weight:800;font-size:44px;line-height:1.05;letter-spacing:-0.02em;color:#fff;margin:16px 0 14px}
.bo-tools-hero__intro{font-family:var(--sans);font-size:17px;line-height:1.5;color:#fff;max-width:720px;margin:0 0 28px}
/* Triple-class chain needed to beat OceanWP's inline `<style>` rule:
   `.oceanwp-theme p { color:#333 !important }` which has specificity
   (0,0,1,1) and loads after our external stylesheet. */
.bo-tools .bo-tools-hero .bo-tools-hero__intro,
body.oceanwp-theme .bo-tools-hero__intro,
html body p.bo-tools-hero__intro{color:#fff !important}

/* Stats ribbon */
.bo-tools-hero__ribbon{display:flex;flex-wrap:wrap;gap:0;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);border-radius:10px;overflow:hidden;margin-bottom:22px}
.bo-tools-hero__stat{flex:1 1 180px;min-width:150px;padding:14px 20px;position:relative}
.bo-tools-hero__stat + .bo-tools-hero__stat::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:1px;background:rgba(255,255,255,0.1)}
.bo-tools-hero__stat-val{display:block;font-family:var(--sans);font-weight:800;font-size:26px;line-height:1;color:var(--primary);letter-spacing:-0.01em}
.bo-tools-hero__stat-lbl{display:block;font-family:var(--mono);font-size:10px;color:#fff;letter-spacing:0.08em;text-transform:uppercase;margin-top:6px}
/* Same reason as hero__intro — lift specificity past `.oceanwp-theme p`. */
.bo-tools .bo-tools-hero .bo-tools-hero__stat-lbl,
body.oceanwp-theme .bo-tools-hero__stat-lbl,
html body span.bo-tools-hero__stat-lbl{color:#fff !important}

/* Hero CTA */
.bo-tools-hero__actions{display:flex;gap:10px;flex-wrap:wrap}
.bo-tools-hero__cta{display:inline-flex;align-items:center;gap:8px;background:var(--primary);color:var(--secondary) !important;padding:12px 22px;border-radius:6px;font-family:var(--sans);font-weight:700;font-size:13px;letter-spacing:0.02em;text-decoration:none;transition:transform .12s,box-shadow .15s}
.bo-tools-hero__cta:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(51,204,112,0.35);color:var(--secondary);text-decoration:none}

/* Body wrapper */
.bo-tools-body{padding:40px 24px 64px}
.bo-tools-body__inner{max-width:1120px;margin:0 auto}

/* Prose */
.bo-tools-prose{font-family:var(--sans);font-size:15.5px;line-height:1.65;color:var(--secondary)}
.bo-tools-prose h2{position:relative;font-family:var(--sans);font-weight:800;font-size:26px;line-height:1.2;letter-spacing:-0.015em;color:var(--secondary);margin:44px 0 16px;padding-bottom:12px;border-bottom:1px solid var(--secondary-20)}
.bo-tools-prose h2::before{content:"";position:absolute;left:0;bottom:-1px;width:60px;height:3px;background:var(--primary)}
.bo-tools-prose h2:first-child{margin-top:0}
.bo-tools-prose h3{font-family:var(--sans);font-weight:700;font-size:18px;color:var(--secondary);margin:24px 0 10px;letter-spacing:-0.005em}
.bo-tools-prose p{margin:0 0 14px;color:var(--secondary);font-size:15.5px;line-height:1.7}
.bo-tools-prose p:last-child{margin-bottom:0}
.bo-tools-prose ul,.bo-tools-prose ol{margin:0 0 16px 22px;padding:0;color:var(--secondary)}
.bo-tools-prose ul li,.bo-tools-prose ol li{margin:0 0 6px;line-height:1.65}
.bo-tools-prose strong{color:var(--secondary);font-weight:700}
.bo-tools-prose a{color:var(--secondary);text-decoration:underline;text-decoration-color:var(--primary);text-underline-offset:3px}
.bo-tools-prose a:hover{color:var(--primary)}
.bo-tools-prose blockquote{border-left:3px solid var(--primary);padding:8px 0 8px 18px;margin:18px 0;font-style:italic;color:var(--secondary)}
body .bo-tools-prose p,body .bo-tools-prose li{color:var(--secondary) !important}

/* Affiliate disclosure (kept authored in content). */
.bo-tools-prose .bo-affiliate-disclosure{font-size:13px;color:var(--secondary-60) !important;font-style:italic;margin:12px 0 24px;padding:10px 14px;background:#fff;border:1px solid var(--secondary-20);border-left:3px solid var(--secondary-20);border-radius:0 6px 6px 0}

/* Lead paragraph right under the "All betting tools" heading. */
.bo-tools-prose .bo-tools-grid__lead{font-family:var(--sans);font-size:15px;color:var(--secondary-60);margin:0 0 18px;max-width:720px}

/* ── New icon-based tool cards (v2) — no post thumbnails ──────── */
.bo-tools-prose .bo-tools-grid-v2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin:20px 0 40px}
.bo-tools-prose .bo-tools-card-v2{--bo-tools-card-accent:var(--primary);position:relative;display:flex;flex-direction:column;gap:10px;padding:24px 24px 22px;background:#fff;border:1px solid var(--secondary-20);border-radius:10px;color:var(--secondary);text-decoration:none;overflow:hidden;transition:transform .15s,box-shadow .2s,border-color .15s}
.bo-tools-prose .bo-tools-card-v2::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--bo-tools-card-accent);transition:height .15s}
.bo-tools-prose .bo-tools-card-v2:hover{transform:translateY(-3px);border-color:var(--bo-tools-card-accent);box-shadow:0 12px 28px rgba(26,38,46,0.12);text-decoration:none;color:var(--secondary)}
.bo-tools-prose .bo-tools-card-v2:hover::before{height:6px}
.bo-tools-prose .bo-tools-card-v2__icon{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:12px;background:color-mix(in srgb, var(--bo-tools-card-accent) 14%, #fff);color:var(--bo-tools-card-accent);margin-bottom:4px;transition:background .15s,transform .15s}
.bo-tools-prose .bo-tools-card-v2:hover .bo-tools-card-v2__icon{background:color-mix(in srgb, var(--bo-tools-card-accent) 22%, #fff);transform:scale(1.05)}
.bo-tools-prose .bo-tools-card-v2__eyebrow{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.12em;color:var(--bo-tools-card-accent);text-transform:uppercase}
.bo-tools-prose .bo-tools-card-v2__title{font-family:var(--sans) !important;font-weight:800 !important;font-size:19px !important;color:var(--secondary) !important;margin:0 !important;padding:0 !important;border:0 !important;letter-spacing:-0.01em !important;line-height:1.25 !important}
.bo-tools-prose .bo-tools-card-v2__title::before{display:none !important}
.bo-tools-prose .bo-tools-card-v2__blurb{font-family:var(--sans);font-size:13.5px;line-height:1.55;color:var(--secondary-60);margin:0}
body .bo-tools-prose .bo-tools-card-v2__blurb{color:var(--secondary-60) !important}
.bo-tools-prose .bo-tools-card-v2__cta{margin-top:auto;font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.06em;color:var(--bo-tools-card-accent);text-transform:uppercase;display:inline-flex;align-items:center;gap:6px;padding-top:14px;border-top:1px solid var(--secondary-20)}
.bo-tools-prose .bo-tools-card-v2__arrow{display:inline-block;transition:transform .15s}
.bo-tools-prose .bo-tools-card-v2:hover .bo-tools-card-v2__arrow{transform:translateX(4px)}

/* Hide the old card grid (authored) if any slipped through the regex strip. */
.bo-tools-prose .bo-tools-grid{display:none !important}
.bo-tools-prose .bo-tool-card{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--secondary-20);border-radius:10px;overflow:hidden;text-decoration:none;color:var(--secondary);box-shadow:0 2px 10px rgba(26,38,46,0.04);transition:transform .15s,box-shadow .2s,border-color .15s}
.bo-tools-prose .bo-tool-card:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(26,38,46,0.12);border-color:var(--primary);text-decoration:none}
.bo-tools-prose .bo-tool-card__media{position:relative;aspect-ratio:16/7;background:linear-gradient(135deg,var(--secondary) 0%,#2a4a58 100%);overflow:hidden}
.bo-tools-prose .bo-tool-card__img{width:100%;height:100%;object-fit:cover;display:block}
.bo-tools-prose .bo-tool-card__overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(26,38,46,0.1) 0%,rgba(26,38,46,0.55) 100%);pointer-events:none}
.bo-tools-prose .bo-tool-card__body{padding:20px 22px;display:flex;flex-direction:column;flex:1;gap:10px}
.bo-tools-prose .bo-tool-card__eyebrow{display:inline-block;background:var(--primary-tint);color:var(--primary);font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.1em;padding:4px 10px;border-radius:999px;text-transform:uppercase;align-self:flex-start}
.bo-tools-prose .bo-tool-card__title{font-family:var(--sans);font-weight:800;font-size:18px;line-height:1.25;color:var(--secondary);margin:0;padding:0;border:none;letter-spacing:-0.01em}
.bo-tools-prose .bo-tool-card__title::before{display:none}
.bo-tools-prose .bo-tool-card__text{font-family:var(--sans);font-size:13.5px;line-height:1.55;color:var(--secondary-60) !important;margin:0}
.bo-tools-prose .bo-tool-card__footer{margin-top:auto;padding-top:12px;border-top:1px solid var(--secondary-20)}
.bo-tools-prose .bo-tool-card__cta{font-family:var(--sans);font-weight:700;font-size:12px;letter-spacing:0.04em;color:var(--primary);text-transform:uppercase;display:inline-flex;align-items:center;gap:6px}
.bo-tools-prose .bo-tool-card__arrow{transition:transform .15s}
.bo-tools-prose .bo-tool-card:hover .bo-tool-card__arrow{transform:translateX(3px)}

/* FAQ collapsibles */
.bo-tools-faq{display:flex;flex-direction:column;gap:8px;margin:18px 0 24px}
.bo-tools-faq__item{background:#fff;border:1px solid var(--secondary-20);border-radius:8px;overflow:hidden;transition:border-color .15s,box-shadow .2s}
.bo-tools-faq__item[open]{border-color:var(--primary);box-shadow:0 4px 14px rgba(26,38,46,0.06)}
.bo-tools-faq__q{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 20px;font-family:var(--sans);font-weight:700;font-size:15px;color:var(--secondary);letter-spacing:-0.005em}
.bo-tools-faq__q::-webkit-details-marker{display:none}
.bo-tools-faq__chev{font-family:var(--mono);font-size:14px;color:var(--primary);transition:transform .2s;flex-shrink:0}
.bo-tools-faq__item[open] .bo-tools-faq__chev{transform:rotate(180deg)}
.bo-tools-faq__a{padding:0 20px 18px;color:var(--secondary);font-size:14.5px;line-height:1.65}
.bo-tools-faq__a p{margin:0 0 10px}
.bo-tools-faq__a p:last-child{margin:0}
body .bo-tools-faq__a p{color:var(--secondary) !important}

/* Mobile — /betting-tools/ hub page. Responsive revisité v2.40.3. */
@media (max-width:767px){
	/* Hero — tighter vertical rythm, smaller title, decorative rings softened */
	.bo-tools-hero{padding:28px 16px 24px}
	.bo-tools-hero::before{width:220px;height:220px;top:-80px;right:-80px;opacity:0.6}
	.bo-tools-hero::after{display:none}
	.bo-tools-hero__tag{font-size:9px;padding:4px 9px;letter-spacing:0.1em}
	.bo-tools-hero__title{font-size:26px;margin:12px 0 10px;line-height:1.1}
	.bo-tools-hero__intro{font-size:14.5px;line-height:1.5;margin:0 0 20px}

	/* Stats ribbon — stack vertically with 1px separators, compact numbers */
	.bo-tools-hero__ribbon{flex-direction:column;margin-bottom:18px}
	.bo-tools-hero__stat{flex:1 1 auto;min-width:0;padding:11px 14px;display:flex;justify-content:space-between;align-items:baseline;gap:10px}
	.bo-tools-hero__stat + .bo-tools-hero__stat::before{left:14px;right:14px;top:0;bottom:auto;width:auto;height:1px}
	.bo-tools-hero__stat-val{font-size:18px;line-height:1.1}
	.bo-tools-hero__stat-lbl{margin-top:0;text-align:right;font-size:9.5px;letter-spacing:0.06em}

	/* Hero CTA — full-width so the tap target stays comfortable */
	.bo-tools-hero__actions{gap:8px}
	.bo-tools-hero__cta{width:100%;justify-content:center;padding:12px 16px;font-size:13px}

	/* Body rhythm + prose scaling */
	.bo-tools-body{padding:24px 14px 40px}
	.bo-tools-prose h2{font-size:20px;margin:28px 0 12px;padding-bottom:10px}
	.bo-tools-prose h2:first-child{margin-top:0}
	.bo-tools-prose h3{font-size:16.5px;margin:18px 0 8px}
	.bo-tools-prose p{font-size:14.5px;line-height:1.65}
	.bo-tools-prose ul,.bo-tools-prose ol{margin-left:18px}
	.bo-tools-prose .bo-affiliate-disclosure{font-size:12.5px;padding:10px 12px}

	/* Legacy authored grid (stripped, but belt-and-suspenders). */
	.bo-tools-prose .bo-tools-grid{grid-template-columns:1fr;gap:12px}

	/* ── New tool cards v2 — compact mobile layout ───────────── */
	.bo-tools-prose .bo-tools-grid__lead{font-size:14px;margin:0 0 14px}
	.bo-tools-prose .bo-tools-grid-v2{grid-template-columns:1fr;gap:12px;margin:16px 0 28px}
	.bo-tools-prose .bo-tools-card-v2{padding:20px 18px 18px;gap:8px}
	.bo-tools-prose .bo-tools-card-v2::before{height:3px}
	.bo-tools-prose .bo-tools-card-v2:hover::before{height:4px}
	.bo-tools-prose .bo-tools-card-v2__icon{width:44px;height:44px;border-radius:10px;margin-bottom:2px}
	.bo-tools-prose .bo-tools-card-v2__icon svg{width:24px;height:24px}
	.bo-tools-prose .bo-tools-card-v2__eyebrow{font-size:9.5px;letter-spacing:0.1em}
	.bo-tools-prose .bo-tools-card-v2__title{font-size:17px !important;line-height:1.2 !important}
	.bo-tools-prose .bo-tools-card-v2__blurb{font-size:13px;line-height:1.5}
	.bo-tools-prose .bo-tools-card-v2__cta{padding-top:12px;font-size:10.5px;letter-spacing:0.05em}

	/* FAQ */
	.bo-tools-faq{gap:6px}
	.bo-tools-faq__q{padding:13px 14px;font-size:14px;gap:10px}
	.bo-tools-faq__a{padding:0 14px 12px;font-size:13.5px}
	.bo-tools-faq__a p{margin-bottom:8px}
}

/* ════════════════════════════════════════════════════════════════════
   UsersWP auth pages (/account/ login, /register/) — brand the UWP plugin's
   Bootstrap-default button/form styles so they fit the BettingOffice look.
   ════════════════════════════════════════════════════════════════════ */
body.uwp_login_page .uwp-login-class,
body.uwp_register_page .uwp-register-class,
body.uwp_account_page .uwp-account-class{
	max-width:520px;margin:32px auto;padding:32px 28px;
	background:#fff;border:1px solid var(--secondary-20);border-radius:12px;
	box-shadow:0 4px 16px rgba(0,0,0,0.04)
}
body.uwp_login_page h1,
body.uwp_register_page h1,
body.uwp_account_page h1{
	font-family:var(--sans);font-weight:800;font-size:28px;letter-spacing:-0.02em;
	color:var(--secondary);text-align:center;margin:0 0 20px
}

/* Primary CTA (LOGIN / CREATE ACCOUNT / UPDATE) — brand green. */
body.uwp_login_page .uwp_login_submit,
body.uwp_register_page .uwp_register_submit,
body.uwp_account_page .uwp_account_submit,
body.uwp_login_page .btn-primary.uwp_login_submit,
body.uwp_register_page .btn-primary.uwp_register_submit,
body.uwp_account_page .btn-primary.uwp_account_submit{
	background:var(--primary) !important;
	border-color:var(--primary) !important;
	color:var(--secondary) !important;
	font-family:var(--sans) !important;
	font-weight:700 !important;
	font-size:14px !important;
	letter-spacing:0.04em !important;
	padding:12px 18px !important;
	border-radius:6px !important;
	transition:transform .1s,box-shadow .15s
}
body.uwp_login_page .uwp_login_submit:hover,
body.uwp_register_page .uwp_register_submit:hover,
body.uwp_account_page .uwp_account_submit:hover{
	background:var(--primary-60) !important;
	transform:translateY(-1px);
	box-shadow:0 4px 12px rgba(51,204,112,0.25)
}

/* Form inputs — clean brand-matching fields. */
body.uwp_login_page .form-control,
body.uwp_register_page .form-control,
body.uwp_account_page .form-control{
	border:1px solid var(--secondary-20) !important;
	border-radius:6px !important;
	padding:11px 14px !important;
	font-family:var(--sans) !important;
	font-size:14px !important;
	color:var(--secondary) !important;
	transition:border-color .15s
}
body.uwp_login_page .form-control:focus,
body.uwp_register_page .form-control:focus,
body.uwp_account_page .form-control:focus{
	border-color:var(--primary) !important;
	outline:0 !important;
	box-shadow:0 0 0 3px rgba(51,204,112,0.12) !important
}

/* Secondary links (Create account / Forgot password) INSIDE the UsersWP
   form pane only — v2.48.24 scope fix. The earlier version painted every
   <a> on the page in primary green (body.uwp_account_page a {...}) which
   bled into the sitewide footer + mobile bnav. Now limited to links
   inside the actual form container. */
body.uwp_login_page .uwp_form a,
body.uwp_login_page .uwp-login-class a,
body.uwp_register_page .uwp_form a,
body.uwp_register_page .uwp-register-class a,
body.uwp_account_page .uwp_form a,
body.uwp_account_page .uwp-account-class a,
body.uwp_account_page .uwp-content-wrap a{
	color:var(--primary)
}
body.uwp_login_page .uwp_form a:hover,
body.uwp_login_page .uwp-login-class a:hover,
body.uwp_register_page .uwp_form a:hover,
body.uwp_register_page .uwp-register-class a:hover,
body.uwp_account_page .uwp_form a:hover,
body.uwp_account_page .uwp-account-class a:hover,
body.uwp_account_page .uwp-content-wrap a:hover{
	color:var(--primary-60);text-decoration:underline
}



/* ════════════════════════════════════════════════════════════════════
   MOBILE PLAYBOOK ARCHIVE (.bo-mpb*) — port of design-midfi-mobile screens-editorial.js (SCREENS.guides).
   ════════════════════════════════════════════════════════════════════ */
.bo-mpb{display:none;background:#fff}

/* Dark hero with search input. */
.bo-mpb-hero{background:var(--secondary);color:#fff;padding:18px 16px 18px;margin-bottom:14px}
.bo-mpb-hero-text{margin-bottom:14px}
.bo-mpb-title{
	font-family:var(--sans);font-weight:800;font-size:30px;line-height:1.02;
	letter-spacing:-0.025em;margin:10px 0 4px;color:#fff
}
.bo-mpb-title em{color:var(--primary);font-style:italic}
.bo-mpb-tagline{color:rgba(255,255,255,0.6);font-size:11px;margin-top:2px}

.bo-mpb-search{position:relative;margin-top:4px}
.bo-mpb-search svg{position:absolute;top:50%;left:14px;transform:translateY(-50%);pointer-events:none}
.bo-mpb-search input{
	width:100%;background:rgba(255,255,255,0.08);
	border:1px solid rgba(255,255,255,0.15);color:#fff;
	padding:12px 14px 12px 40px;border-radius:12px;
	font-family:var(--sans);font-size:13px;outline:0
}
.bo-mpb-search input::placeholder{color:rgba(255,255,255,0.5)}

/* Category chips (sticky scroll row). */
.bo-mpb-chips{
	display:flex;gap:6px;overflow-x:auto;padding:0 14px 4px;
	scrollbar-width:none;-webkit-overflow-scrolling:touch
}
.bo-mpb-chips::-webkit-scrollbar{display:none}
.bo-mpb-chip{
	display:inline-block;padding:6px 12px;border-radius:999px;
	border:1px solid var(--secondary-20);background:#fff;color:var(--secondary);
	font-family:var(--sans);font-weight:600;font-size:12px;white-space:nowrap;cursor:pointer
}
.bo-mpb-chip.is-active{background:var(--primary);color:var(--secondary);border-color:var(--primary)}

/* Section wrapper (re-uses bo-mhub-sec / bo-mhub-ah). */
.bo-mpb-sec{padding:14px 16px}

/* Featured guide card. */
.bo-mpb-featured{
	display:block;background:#fff;border-radius:14px;
	border:1px solid rgba(199,204,207,0.6);overflow:hidden;
	box-shadow:0 1px 2px rgba(15,24,32,0.04);
	color:inherit;text-decoration:none
}
.bo-mpb-featured-cover{
	height:180px;
	background:linear-gradient(135deg,#1A262E 0%,#33CC70 100%);
	background-size:cover;background-position:center;
	position:relative;padding:16px;color:#fff;
	display:flex;flex-direction:column;justify-content:flex-end
}
.bo-mpb-featured-cover::before{
	content:"";position:absolute;inset:0;
	background:linear-gradient(180deg,transparent 30%,rgba(15,24,32,0.7) 100%);
	pointer-events:none
}
.bo-mpb-featured-cover > *{position:relative;z-index:1}
.bo-mpb-featured-cover .bo-tag{align-self:flex-start}
.bo-mpb-featured-title{
	font-family:var(--sans);font-weight:800;font-size:22px;
	letter-spacing:-0.02em;line-height:1.1;margin-top:10px;color:#fff
}
.bo-mpb-featured-body{padding:14px}
.bo-mpb-featured-excerpt{font-size:13px;color:#2a363e;line-height:1.5;margin:0}
.bo-mpb-featured-meta{display:flex;align-items:center;gap:10px;margin-top:12px}
.bo-mpb-avatar{
	width:28px;height:28px;border-radius:50%;
	background:var(--secondary);color:#fff;
	display:inline-flex;align-items:center;justify-content:center;
	font-weight:800;font-size:10px;flex-shrink:0
}
.bo-mpb-author{font-size:11px;font-weight:700;color:var(--secondary)}
.bo-mpb-featured-meta .bo-meta{font-size:9px;margin-left:auto}

/* Guide list cards (icon + title). */
.bo-mpb-card{
	display:flex;gap:12px;align-items:center;
	background:#fff;border:1px solid rgba(199,204,207,0.6);
	border-radius:12px;padding:12px 14px;margin-bottom:8px;
	color:inherit;text-decoration:none
}
.bo-mpb-card-icon{
	width:48px;height:48px;border-radius:10px;background:var(--paper);
	display:flex;align-items:center;justify-content:center;
	font-size:22px;flex-shrink:0;line-height:1
}
.bo-mpb-card-body{flex:1;min-width:0}
.bo-mpb-card-meta{display:flex;align-items:center;gap:6px;margin-bottom:2px}
.bo-mpb-card-meta .bo-tag{font-size:8px;padding:2px 5px;letter-spacing:0.06em}
.bo-mpb-card-meta .bo-meta{font-size:9px}
.bo-mpb-card-title{
	font-family:var(--sans);font-weight:700;font-size:13px;
	letter-spacing:-0.01em;line-height:1.3;color:var(--secondary)
}
.bo-mpb-card-author{
	font-family:var(--mono);font-size:9px;color:var(--secondary-60);margin-top:3px
}
.bo-mpb-card-arrow{color:var(--secondary-60);flex-shrink:0}

/* ════════════════════════════════════════════════════════════════════
   MOBILE SPORTSBOOKS ARCHIVE (.bo-msb*) — port of screens-editorial.js (sportsbook + alternatives card pattern).
   ════════════════════════════════════════════════════════════════════ */
.bo-msb{display:none;background:var(--paper)}

/* Dark hero. */
.bo-msb-hero{background:var(--secondary);color:#fff;padding:18px 16px 14px}
.bo-msb-hero-text{margin-bottom:14px}
.bo-msb-title{
	font-family:var(--sans);font-weight:800;font-size:28px;line-height:1.02;
	letter-spacing:-0.025em;margin:8px 0 4px;color:#fff
}
.bo-msb-title em{color:var(--primary);font-style:italic}
.bo-msb-tagline{color:rgba(255,255,255,0.6);font-size:11px;margin-top:2px}

/* Stats ribbon — re-uses .bo-mpicks-stat tokens. */
.bo-msb-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.bo-msb-stats .bo-mpicks-stat{
	background:rgba(255,255,255,0.05);
	border:1px solid rgba(255,255,255,0.1);
	border-radius:8px;padding:8px 6px
}

/* Operator card. */
.bo-msb-card{
	position:relative;background:#fff;border:1px solid rgba(199,204,207,0.6);
	border-radius:14px;padding:14px;margin-bottom:10px;
	box-shadow:0 1px 2px rgba(15,24,32,0.04)
}
.bo-msb-rank{
	position:absolute;top:10px;right:12px;
	font-family:var(--mono);font-weight:800;font-size:11px;
	color:var(--primary);letter-spacing:0.04em
}
.bo-msb-card-hd{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.bo-msb-logo{
	width:48px;height:48px;border-radius:10px;
	object-fit:contain;background:var(--paper);padding:6px;flex-shrink:0
}
.bo-msb-logo--text{
	display:inline-flex;align-items:center;justify-content:center;
	background:var(--secondary);color:#fff;font-family:var(--sans);
	font-weight:800;font-size:14px;letter-spacing:-0.02em
}
.bo-msb-card-name{flex:1;min-width:0}
.bo-msb-name{
	font-family:var(--sans);font-weight:800;font-size:16px;
	letter-spacing:-0.01em;color:var(--secondary)
}
.bo-msb-card-name .bo-meta{font-size:9px;margin-top:2px}

/* Bonus block (highlighted). */
.bo-msb-bonus{
	background:linear-gradient(135deg,rgba(51,204,112,0.1) 0%,rgba(51,204,112,0.03) 100%);
	border:1px solid rgba(51,204,112,0.25);
	border-radius:10px;padding:10px 12px;margin-bottom:10px
}
.bo-msb-bonus .bo-meta{color:var(--primary);font-size:9px}
.bo-msb-bonus-text{
	font-family:var(--sans);font-weight:800;font-size:14px;
	letter-spacing:-0.01em;margin-top:3px;color:var(--secondary);line-height:1.3
}

/* Action row. */
.bo-msb-actions{display:flex;gap:8px}
.bo-msb-btn{
	flex:1;display:inline-flex;align-items:center;justify-content:center;
	padding:11px 14px;border-radius:10px;
	font-family:var(--sans);font-weight:700;font-size:12px;
	text-decoration:none;text-align:center;
	transition:transform 0.1s
}
.bo-msb-btn:active{transform:scale(0.98)}
.bo-msb-btn--primary{background:var(--primary);color:var(--secondary);flex:2}
.bo-msb-btn--outline{
	background:#fff;border:1px solid var(--secondary-20);color:var(--secondary)
}

/* RG note at the bottom. */
.bo-msb-rg{
	padding:14px 16px 24px;text-align:center;
	font-family:var(--mono);font-size:10px;color:var(--secondary-60);line-height:1.4
}
.bo-msb-rg a{color:var(--primary)}

/* ════════════════════════════════════════════════════════════════════
   MOBILE SINGLE POST (.bo-msingle*) — playbook article + sportsbook review.
   Hidden on desktop, shown <768px.
   ════════════════════════════════════════════════════════════════════ */
.bo-msingle{display:none;background:#fff}

/* ── Playbook article (.bo-msingle--pb) ─────────────────────────── */
.bo-msingle-pb-hero{
	height:280px;position:relative;
	background:linear-gradient(135deg,#1A262E 0%,#33CC70 100%);
	background-size:cover;background-position:center;
	padding:20px;color:#fff;
	display:flex;flex-direction:column;justify-content:flex-end
}
.bo-msingle-pb-hero-fade{
	position:absolute;inset:0;
	background:linear-gradient(180deg,rgba(15,24,32,0.2) 0%,rgba(15,24,32,0.85) 100%);
	pointer-events:none
}
.bo-msingle-pb-hero-text{position:relative;z-index:1}
.bo-msingle-pb-title{
	font-family:var(--sans);font-weight:800;font-style:italic;
	font-size:28px;letter-spacing:-0.025em;line-height:1.05;
	margin:10px 0 0;color:#fff
}
/* Crush any cascade that could grey the mobile H1 (OceanWP h1 defaults). */
html body .bo-msingle-pb-title,
body.oceanwp-theme .bo-msingle-pb-title{color:#fff !important}

/* Author meta strip below hero. */
.bo-msingle-meta{
	padding:14px 16px;border-bottom:1px solid rgba(199,204,207,0.5);
	display:flex;align-items:center;gap:10px;background:#fff
}
.bo-msingle-meta .bo-mpb-avatar{width:36px;height:36px;font-size:12px}
.bo-msingle-meta-text{flex:1;min-width:0}
.bo-msingle-meta-name{font-family:var(--sans);font-weight:700;font-size:13px;color:var(--secondary)}
.bo-msingle-meta-text .bo-meta{font-size:9px;margin-top:1px}

/* Article body (prose) — white bg with dark text, overriding any cascade
   (the old playbook design-system snippet used to force dark). */
.bo-msingle-body,
body .bo-msingle-body{padding:18px 16px 8px;background:#fff !important;color:#0F1820 !important}
.bo-msingle-body p{font-size:15px;line-height:1.6;color:#0F1820;margin:0 0 14px}
html body .bo-msingle-body p,
html body .bo-msingle-body li,
body.oceanwp-theme .bo-msingle-body p{color:#0F1820 !important}
.bo-msingle-body p:first-of-type{font-size:16px;font-weight:500;color:#0F1820}
.bo-msingle-body h2{
	font-family:var(--sans);font-weight:800;font-size:22px;
	letter-spacing:-0.02em;line-height:1.15;margin:24px 0 10px;color:var(--secondary)
}
.bo-msingle-body h3{
	font-family:var(--sans);font-weight:800;font-size:17px;
	letter-spacing:-0.01em;line-height:1.2;margin:20px 0 8px;color:var(--secondary)
}
.bo-msingle-body img{max-width:100%;height:auto;border-radius:10px;margin:14px 0}
.bo-msingle-body ul,
.bo-msingle-body ol{padding-left:20px;font-size:14px;line-height:1.55;color:#0F1820;margin:8px 0 16px}
.bo-msingle-body ul li,
.bo-msingle-body ol li{margin-bottom:6px}
.bo-msingle-body a{color:var(--primary);text-decoration:underline;text-underline-offset:2px}
.bo-msingle-body blockquote{
	background:var(--secondary);color:#fff;
	padding:20px 18px;border-radius:14px;margin:22px 0;
	font-family:var(--sans);font-weight:800;font-style:italic;font-size:18px;
	letter-spacing:-0.02em;line-height:1.25
}
.bo-msingle-body table{width:100%;font-size:13px;border-collapse:collapse;margin:14px 0}
.bo-msingle-body th,
.bo-msingle-body td{padding:8px 10px;border:1px solid rgba(199,204,207,0.5)}
.bo-msingle-body th{background:var(--paper);font-weight:700}

/* Strip embedded "pb-*" duotone plates from imported playbook content
   so they don't double up with our hero. */
.bo-msingle-body .pb-hero,
.bo-msingle-body .pb-hero__image,
.bo-msingle-body .pb-page > h1:first-child{display:none}

/* Related cards (More from Playbook). */
.bo-msingle-related{padding:14px 16px 24px;background:var(--paper)}
.bo-msingle-related-card{
	display:flex;align-items:center;gap:12px;
	background:#fff;border:1px solid rgba(199,204,207,0.6);
	border-radius:12px;padding:10px 12px;margin-bottom:8px;
	color:inherit;text-decoration:none
}
.bo-msingle-related-cover{
	width:64px;height:64px;border-radius:8px;flex-shrink:0;
	background:linear-gradient(135deg,#1A262E,#33CC70);
	background-size:cover;background-position:center
}
.bo-msingle-related-body{flex:1;min-width:0}
.bo-msingle-related-title{
	font-family:var(--sans);font-weight:700;font-size:13px;
	letter-spacing:-0.01em;line-height:1.3;color:var(--secondary)
}
.bo-msingle-related-body .bo-meta{font-size:9px;margin-top:4px}

/* ── Sportsbook review (.bo-msingle--sb) ────────────────────────── */
.bo-msingle--sb{padding-bottom:80px}

.bo-msingle-sb-hero{
	background:linear-gradient(135deg,var(--sb-bg,#33CC70) 0%,#0F1820 220%);
	color:var(--sb-fg,#fff);
	/* Bottom padding reduced (20 → 6) to absorb the new RG strip added at
	   the end of the hero without inflating total height — v2.44.4. */
	padding:24px 16px 6px;
	--sb-bg:#33CC70;--sb-fg:#fff
}

/* RG disclaimer inside mobile hero — compact 2-line layout:
   [21+] Gamble responsibly. Call 1-800-GAMBLER or visit ncpgambling.org */
.bo-msingle-sb-hero-rg{
	margin-top:12px;padding-top:10px;
	border-top:1px solid rgba(255,255,255,0.18);
	display:flex;align-items:flex-start;gap:8px
}
.bo-msingle-sb-hero-rg__age{
	flex-shrink:0;
	background:rgba(255,255,255,0.16);
	border:1px solid rgba(255,255,255,0.35);
	color:inherit;
	padding:2px 6px;border-radius:3px;
	font-family:var(--mono);font-weight:800;font-size:9.5px;letter-spacing:0.08em;
	line-height:1.35
}
.bo-msingle-sb-hero-rg__text{
	flex:1;min-width:0;
	font-family:var(--sans);font-size:10.5px;line-height:1.45;
	color:inherit;opacity:0.85
}
.bo-msingle-sb-hero-rg__text b{font-weight:700;opacity:1}
.bo-msingle-sb-hero-rg__text a{color:inherit;text-decoration:underline;text-underline-offset:2px}
/* Brand bg with dark fg (e.g. DraftKings green) — keep 21+ readable */
.bo-msingle--sb .bo-msingle-sb-hero[style*="--sb-fg:#000"] .bo-msingle-sb-hero-rg,
.bo-msingle--sb .bo-msingle-sb-hero[style*="--sb-fg:#000000"] .bo-msingle-sb-hero-rg{
	border-top-color:rgba(0,0,0,0.18)
}
.bo-msingle-sb-hd{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.bo-msingle-sb-logo{
	width:64px;height:64px;border-radius:14px;
	background:#fff;padding:8px;object-fit:contain;flex-shrink:0
}
.bo-msingle-sb-logo--text{
	display:inline-flex;align-items:center;justify-content:center;
	background:#000;color:var(--sb-bg);
	font-family:var(--sans);font-weight:800;font-size:20px;letter-spacing:-0.02em
}
.bo-msingle-sb-name{
	font-family:var(--sans);font-weight:800;font-size:24px;
	letter-spacing:-0.02em;color:inherit
}
.bo-msingle-sb-rating{
	font-family:var(--mono);font-size:11px;font-weight:700;color:inherit;opacity:0.85
}

/* Bonus block in hero. */
.bo-msingle-sb-bonus{
	background:rgba(0,0,0,0.15);border:1px solid rgba(0,0,0,0.2);
	border-radius:12px;padding:12px 14px;color:inherit
}
.bo-msingle-sb-bonus .bo-meta{color:rgba(0,0,0,0.6);font-size:9px}
.bo-msingle--sb[data-light-fg] .bo-msingle-sb-bonus .bo-meta{color:rgba(255,255,255,0.6)}
.bo-msingle-sb-bonus-text{
	font-family:var(--sans);font-weight:800;font-size:18px;
	letter-spacing:-0.01em;margin:3px 0;color:inherit;line-height:1.25
}

/* Verdict scorecard. */
.bo-msingle-sb-card{
	background:#fff;border:1px solid rgba(199,204,207,0.6);
	border-radius:12px;padding:14px;
	box-shadow:0 1px 2px rgba(15,24,32,0.04)
}
.bo-msingle-sb-overall{
	display:flex;justify-content:space-between;align-items:center;
	padding-bottom:12px;border-bottom:1px solid rgba(199,204,207,0.5);
	font-weight:700
}
.bo-msingle-sb-overall-v{font-family:var(--mono);font-size:22px;font-weight:800;color:var(--primary)}
.bo-msingle-sb-row{
	display:flex;align-items:center;gap:10px;padding:10px 0;
	border-top:1px solid rgba(199,204,207,0.4);font-size:12px
}
.bo-msingle-sb-row:nth-child(2){border-top:0;padding-top:12px}
.bo-msingle-sb-row-label{flex:0 0 130px;color:var(--secondary)}
.bo-msingle-sb-bar{flex:1;height:6px;background:var(--paper);border-radius:999px;overflow:hidden}
.bo-msingle-sb-bar-fill{height:100%;background:var(--primary);border-radius:999px}
.bo-msingle-sb-row-val{
	font-family:var(--mono);font-weight:700;font-size:12px;
	flex:0 0 28px;text-align:right;color:var(--secondary)
}

/* Pros / Cons two-column. */
.bo-msingle-sb-pc{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.bo-msingle-sb-pros,
.bo-msingle-sb-cons{
	background:#fff;border-radius:12px;padding:14px;
	box-shadow:0 1px 2px rgba(15,24,32,0.04)
}
.bo-msingle-sb-pros{background:rgba(51,204,112,0.06);border:1px solid rgba(51,204,112,0.3)}
.bo-msingle-sb-cons{background:rgba(217,72,72,0.05);border:1px solid rgba(217,72,72,0.25)}
.bo-msingle-sb-pros .bo-meta{color:var(--primary);font-size:9px}
.bo-msingle-sb-cons .bo-meta{color:#D94848;font-size:9px}
.bo-msingle-sb-pros ul,
.bo-msingle-sb-cons ul{margin:8px 0 0;padding-left:14px;font-size:12px;line-height:1.5;color:var(--secondary)}
.bo-msingle-sb-pros li,
.bo-msingle-sb-cons li{margin-bottom:4px}

/* State availability tag cloud. */
.bo-msingle-sb-states{display:flex;flex-wrap:wrap;gap:5px}
.bo-msingle-sb-states span{
	background:var(--paper);color:var(--secondary);padding:4px 8px;
	border-radius:4px;font-family:var(--mono);font-size:10px;font-weight:700
}

/* Editorial review prose block. */
.bo-msingle-sb-editorial p{font-size:13px;line-height:1.55;color:#2a363e;margin:0 0 10px}
.bo-msingle-sb-editorial p:last-child{margin-bottom:0}

/* Alternatives row. */
.bo-msingle-sb-alt{
	display:flex;align-items:center;gap:12px;
	background:#fff;border:1px solid rgba(199,204,207,0.6);
	border-radius:12px;padding:12px 14px;margin-bottom:8px;
	color:inherit;text-decoration:none
}
.bo-msingle-sb-alt-body{flex:1;min-width:0}
.bo-msingle-sb-alt-name{
	font-family:var(--sans);font-weight:700;font-size:13px;
	letter-spacing:-0.01em;color:var(--secondary)
}
.bo-msingle-sb-alt svg{color:var(--secondary-60);flex-shrink:0}

/* Sticky bottom CTA. */
.bo-msingle-sb-cta{
	position:fixed;left:0;right:0;bottom:0;z-index:90;
	background:#fff;border-top:1px solid rgba(199,204,207,0.6);
	padding:10px 14px calc(10px + env(safe-area-inset-bottom));
	display:flex;align-items:center;gap:10px;
	box-shadow:0 -2px 12px rgba(15,24,32,0.08)
}
.bo-msingle-sb-cta-logo{width:32px;height:32px;border-radius:8px;object-fit:contain;background:var(--paper);padding:4px;flex-shrink:0}
.bo-msingle-sb-cta-info{flex:1;min-width:0;font-family:var(--sans)}
.bo-msingle-sb-cta-info b{font-size:12px;font-weight:800;color:var(--secondary);display:block;line-height:1.2}
.bo-msingle-sb-cta-info .bo-meta{font-size:9px;margin-top:1px}

/* ════════════════════════════════════════════════════════════════════
   MOBILE SINGLE PICK (.bo-mpick*) — hero + sticky CTA + Elementor overrides.
   The Elementor Theme Builder renders ALL existing pick sections (intro,
   CI, Playoff Implications, State of Form, Lineups, H2H, Key Points,
   Betting Analysis, Best Bets, Sportsbooks, Standings). We KEEP those
   sections — but apply heavy mobile CSS on <768px to make them readable.
   ════════════════════════════════════════════════════════════════════ */
.bo-mpick{display:none}

/* Crumb strip with back arrow + "NBA · Apr 18". */
.bo-mpick-crumb{
	display:flex;align-items:center;gap:10px;
	padding:10px 16px;background:#fff;
	border-bottom:1px solid rgba(199,204,207,0.4)
}
.bo-mpick-crumb-back{
	width:30px;height:30px;border-radius:8px;
	display:inline-flex;align-items:center;justify-content:center;
	background:var(--paper);color:var(--secondary);text-decoration:none;flex-shrink:0
}
.bo-mpick-crumb .bo-meta{font-size:10px;font-weight:700;letter-spacing:0.06em;color:var(--secondary)}
.bo-mpick-crumb-spacer{flex:1}

/* Dark matchup hero. */
.bo-mpick-hero{
	background:var(--secondary);color:#fff;
	padding:18px 16px 22px
}
.bo-mpick-hero-hd{
	display:flex;justify-content:space-between;align-items:center;margin-bottom:16px
}
.bo-mpick-hero-date{color:rgba(255,255,255,0.6);font-size:9px}

.bo-mpick-teams{
	display:flex;align-items:center;gap:14px;margin-bottom:18px
}
.bo-mpick-team{flex:1;text-align:center;min-width:0}
.bo-mpick-team .bo-tbadge{margin:0 auto}
.bo-mpick-team-name{
	font-size:13px;font-weight:700;color:#fff;
	margin-top:8px;line-height:1.2;
	overflow:hidden;text-overflow:ellipsis
}
.bo-mpick-team .bo-meta{
	color:rgba(255,255,255,0.5);font-size:9px;
	margin-top:2px;justify-content:center
}
.bo-mpick-vs{
	font-family:var(--mono);font-size:11px;font-weight:700;
	color:rgba(255,255,255,0.5);align-self:flex-start;margin-top:18px
}

/* The pick (highlighted block in hero). */
.bo-mpick-the-pick{
	background:linear-gradient(135deg,rgba(51,204,112,0.15) 0%,rgba(51,204,112,0.05) 100%);
	border:1px solid rgba(51,204,112,0.3);
	border-radius:14px;padding:14px
}
.bo-mpick-the-pick .bo-meta{color:var(--primary);font-size:9px}
.bo-mpick-pick-line{
	font-family:var(--sans);font-weight:800;font-size:22px;
	letter-spacing:-0.02em;margin-top:4px;color:#fff
}
.bo-mpick-pick-meta{
	display:flex;gap:10px;margin-top:8px;flex-wrap:wrap;
	font-family:var(--mono);font-size:11px;color:rgba(255,255,255,0.7)
}
.bo-mpick-pick-meta b{color:#fff}

/* Sticky anchor strip — jump links to existing sections below. */
.bo-mpick-anchors{
	display:flex;gap:6px;overflow-x:auto;padding:10px 14px;
	background:#fff;border-bottom:1px solid rgba(199,204,207,0.5);
	position:sticky;top:58px;z-index:20;
	scrollbar-width:none
}
.bo-mpick-anchors::-webkit-scrollbar{display:none}
.bo-mpick-anchors a{
	display:inline-block;padding:7px 12px;border-radius:999px;
	background:var(--paper);color:var(--secondary);
	font-family:var(--sans);font-weight:600;font-size:11px;
	white-space:nowrap;text-decoration:none;flex-shrink:0
}
.bo-mpick-anchors a:hover{background:var(--primary);color:var(--secondary)}

/* Sticky bottom CTA — only on single pick pages. */
.bo-mpick-sticky-cta{
	display:none;
	position:fixed;left:0;right:0;bottom:0;z-index:90;
	background:#fff;border-top:1px solid rgba(199,204,207,0.6);
	padding:10px 14px calc(10px + env(safe-area-inset-bottom));
	align-items:center;gap:10px;
	color:inherit;text-decoration:none;
	box-shadow:0 -2px 12px rgba(15,24,32,0.08)
}
.bo-mpick-sticky-cta-icon{
	width:32px;height:32px;border-radius:8px;
	background:var(--primary);color:var(--secondary);
	display:flex;align-items:center;justify-content:center;flex-shrink:0
}
.bo-mpick-sticky-cta-info{flex:1;min-width:0;font-family:var(--sans)}
.bo-mpick-sticky-cta-info b{font-size:12px;font-weight:800;color:var(--secondary);display:block;line-height:1.2}
.bo-mpick-sticky-cta-info .bo-meta{font-size:9px;margin-top:1px}

/* ════════════════════════════════════════════════════════════════════
   MOBILE OVERLAYS (.bo-overlay) — full-screen panels for search + notifs.
   Triggered by app-head icons. Hidden on desktop entirely.
   ════════════════════════════════════════════════════════════════════ */
.bo-overlay{
	display:none; /* default; @media block flips on mobile */
	position:fixed;inset:0;z-index:9999;
	background:#fff;
	overflow-y:auto;-webkit-overflow-scrolling:touch
}
.bo-overlay[hidden]{display:none !important}
body.bo-overlay-open{overflow:hidden}
.bo-overlay-inner{min-height:100%;display:flex;flex-direction:column}

/* ── SEARCH OVERLAY (.bo-search-overlay / .bo-so-*) ────────────────── */
.bo-so-bar{
	position:sticky;top:0;z-index:30;background:#fff;
	padding:10px 16px 12px;border-bottom:1px solid rgba(199,204,207,0.6);
	display:flex;align-items:center;gap:10px
}
.bo-so-input-wrap{flex:1;position:relative}
.bo-so-input-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--secondary);pointer-events:none}
.bo-so-input{
	width:100%;background:var(--paper);
	border:1.5px solid var(--primary);
	padding:12px 40px 12px 40px;border-radius:12px;
	font-family:var(--sans);font-size:14px;font-weight:600;color:var(--secondary);
	outline:0
}
.bo-so-input::placeholder{color:var(--secondary-60);font-weight:500}
.bo-so-clear{
	position:absolute;right:10px;top:50%;transform:translateY(-50%);
	width:22px;height:22px;border:0;background:var(--secondary-20);color:#fff;
	border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0
}
.bo-so-cancel{
	background:transparent;border:0;
	font-family:var(--sans);font-weight:700;font-size:12px;
	color:var(--secondary);padding:6px 2px;cursor:pointer
}

.bo-so-chips{
	display:flex;gap:6px;overflow-x:auto;padding:14px 14px 10px;
	border-bottom:1px solid rgba(199,204,207,0.4);
	scrollbar-width:none
}
.bo-so-chips::-webkit-scrollbar{display:none}

/* Sections (recent / trending / results). */
.bo-so-sec{padding:14px 16px;border-bottom:1px solid rgba(199,204,207,0.4)}
.bo-so-sec:last-child{border-bottom:0}
.bo-so-sec-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.bo-so-sec-label{font-size:9px}

.bo-so-clear-recent{
	background:transparent;border:0;
	font-family:var(--mono);font-size:9px;font-weight:700;color:var(--primary);cursor:pointer
}

/* Recent list rows. */
.bo-so-recent-list{display:flex;flex-direction:column}
.bo-so-recent-item{
	display:flex;align-items:center;gap:12px;padding:10px 0;
	border-bottom:1px solid rgba(199,204,207,0.4);
	background:transparent;border-left:0;border-right:0;border-top:0;
	font-family:var(--sans);font-size:13px;color:var(--secondary);
	text-align:left;cursor:pointer;width:100%
}
.bo-so-recent-item svg{color:var(--secondary-60);flex-shrink:0}

/* Trending pill cloud. */
.bo-so-trending{display:flex;flex-wrap:wrap;gap:6px}
.bo-so-trend-pill{
	display:inline-block;padding:7px 12px;border-radius:999px;
	background:var(--paper);color:var(--secondary);
	font-family:var(--sans);font-weight:600;font-size:12px;
	cursor:pointer;border:1px solid transparent
}
.bo-so-trend-pill:hover{border-color:var(--primary)}

/* Top result card. */
.bo-so-top{
	display:flex;align-items:center;gap:12px;
	background:linear-gradient(180deg,rgba(51,204,112,0.05) 0%,#fff 60%);
	border:1.5px solid var(--primary);border-radius:14px;padding:14px;
	color:inherit;text-decoration:none
}
.bo-so-top-body{flex:1;min-width:0}
.bo-so-top-title{
	font-family:var(--sans);font-weight:800;font-size:15px;
	letter-spacing:-0.01em;color:var(--secondary);margin-bottom:3px;line-height:1.25
}
.bo-so-top svg{color:var(--secondary-60);flex-shrink:0}

/* Result row cards. */
.bo-so-item{
	display:flex;align-items:center;gap:10px;
	background:#fff;border:1px solid rgba(199,204,207,0.5);
	border-radius:10px;padding:10px 12px;margin-bottom:6px;
	color:inherit;text-decoration:none
}
.bo-so-item-icon{
	width:32px;height:32px;border-radius:8px;background:var(--paper);flex-shrink:0
}
.bo-so-item-body{flex:1;min-width:0}
.bo-so-item-title{
	font-family:var(--sans);font-weight:700;font-size:13px;
	letter-spacing:-0.01em;color:var(--secondary);line-height:1.3;
	overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical
}

.bo-so-empty,
.bo-so-loading{
	padding:40px 16px;text-align:center;color:var(--secondary-60);
	font-family:var(--sans);font-size:13px
}
.bo-so-loading::after{
	content:" ";display:inline-block;width:6px;height:6px;background:var(--primary);
	border-radius:50%;margin-left:6px;animation:bo-pulse 1s infinite
}
@keyframes bo-pulse{0%,100%{opacity:0.4}50%{opacity:1}}

/* ── NOTIFICATIONS OVERLAY (.bo-notif-overlay / .bo-no-*) ──────────── */
.bo-notif-overlay{background:var(--paper)}

.bo-no-bar{
	position:sticky;top:0;z-index:30;background:#fff;
	padding:12px 16px;border-bottom:1px solid rgba(199,204,207,0.5);
	display:flex;align-items:center;gap:10px
}
.bo-no-title-wrap{display:flex;flex-direction:column}
.bo-no-title{font-family:var(--sans);font-weight:800;font-size:16px;letter-spacing:-0.01em;color:var(--secondary)}
.bo-no-sub{font-size:9px;margin-top:1px}
.bo-no-spacer{flex:1}
.bo-no-mark{
	background:transparent;border:0;cursor:pointer;
	font-family:var(--sans);font-size:10px;font-weight:700;
	color:var(--secondary);letter-spacing:0.04em;text-transform:uppercase;
	padding:0 10px;border-radius:999px
}

.bo-no-tabs{
	display:flex;background:#fff;
	border-bottom:1px solid rgba(199,204,207,0.5);
	padding:0 16px
}
.bo-no-tab{
	flex:1;padding:12px 0;text-align:center;
	font-family:var(--sans);font-size:11px;font-weight:700;
	letter-spacing:0.04em;text-transform:uppercase;
	color:var(--secondary-60);position:relative;cursor:pointer
}
.bo-no-tab.is-active{color:var(--secondary)}
.bo-no-tab.is-active::after{
	content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--primary)
}
.bo-no-tab-count{
	display:inline-block;background:var(--primary);color:var(--secondary);
	font-family:var(--mono);font-size:9px;padding:1px 5px;border-radius:999px;margin-left:4px
}

.bo-no-sec-hd{padding:14px 16px 6px}
.bo-no-list{padding:0 14px 8px}

/* Standard notification card. */
.bo-no-card{
	display:flex;gap:12px;align-items:flex-start;
	background:#fff;border:1px solid rgba(199,204,207,0.5);
	border-radius:12px;padding:12px 14px;margin-bottom:6px;
	box-shadow:0 1px 2px rgba(15,24,32,0.04)
}
.bo-no-card.is-unread{border-left:3px solid var(--primary)}
.bo-no-card.is-read{opacity:0.85}

.bo-no-icon{
	width:36px;height:36px;border-radius:10px;background:var(--paper);
	display:flex;align-items:center;justify-content:center;
	font-size:17px;flex-shrink:0;line-height:1
}
.bo-no-icon--win{background:var(--primary);color:var(--secondary)}
.bo-no-card-body{flex:1;min-width:0}
.bo-no-card-meta{display:flex;align-items:center;gap:6px;margin-bottom:3px}
.bo-no-dot{width:6px;height:6px;border-radius:50%;background:var(--primary);flex-shrink:0;display:inline-block}
.bo-no-card-time{font-size:9px;margin-bottom:3px}
.bo-no-card-title{
	font-family:var(--sans);font-weight:700;font-size:13px;
	letter-spacing:-0.01em;line-height:1.3;color:var(--secondary)
}
.bo-no-card-text{font-size:12px;color:#2a363e;margin-top:3px;line-height:1.4}
.bo-no-units{color:var(--primary);font-weight:800}
.bo-no-card-actions{display:flex;gap:6px;margin-top:10px}
.bo-no-card-actions .bo-msb-btn{padding:6px 10px;font-size:10px;flex:0 0 auto}

/* WIN featured card (border + gradient bg). */
.bo-no-card--win{
	padding:0;overflow:hidden;
	border:1.5px solid var(--primary);
	background:#fff
}
.bo-no-card--win .bo-no-card-bg{
	padding:14px;
	background:linear-gradient(135deg,rgba(51,204,112,0.12) 0%,rgba(51,204,112,0.02) 100%);
	display:flex;gap:12px;align-items:flex-start
}

/* Settings CTA card (dark). */
.bo-no-cta-wrap{padding:16px 14px 28px}
.bo-no-cta{
	background:var(--secondary);color:#fff;
	border-radius:12px;padding:14px;
	display:flex;align-items:center;gap:12px
}
.bo-no-cta-icon{
	width:36px;height:36px;border-radius:10px;
	background:rgba(51,204,112,0.15);
	display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0
}
.bo-no-cta-body{flex:1;min-width:0}
.bo-no-cta-title{font-family:var(--sans);font-weight:700;font-size:13px;color:#fff}
.bo-no-cta .bo-meta{color:rgba(255,255,255,0.5);font-size:9px;margin-top:2px}

/* ════════════════════════════════════════════════════════════════════
   RESPONSIVE TOGGLE — show desktop chrome >=768px, mobile chrome <768px
   ════════════════════════════════════════════════════════════════════ */

@media (max-width:767px){
	/* Hide desktop chrome (header + scores bar only — footer now shows on
	   mobile with a stacked layout; see .bo-footer responsive block below). */
	.bo-score,
	.bo-header{display:none !important}
	/* Remove the body padding-bottom: on mobile the footer now owns the
	   bnav-clearance zone (its own padding-bottom is sized so the bnav
	   hovers over dark footer padding, not a paper-colored body gap). */
	body.bo-midfi{padding-bottom:0 !important}
	/* Show mobile chrome */
	.bo-app-head{display:flex}
	.bo-mscore-strip{display:flex}
	.bo-bnav{display:flex}
	/* Body bottom padding so .bo-bnav doesn't overlap content */
	body.bo-midfi{padding-bottom:calc(80px + env(safe-area-inset-bottom))}
	/* Page wrapper takes full viewport on mobile (no border frame) */
	.bo-page{border-left:0;border-right:0;max-width:100%}

	/* ── Universal grid stacking on mobile ──────────────────────
	   Page templates use inline `style="display:grid;grid-template-columns:..."`
	   for desktop layouts. Force them all to a single column on mobile.
	   The !important is required to beat the inline styles. */
	.bo-page [style*="grid-template-columns"]{
		grid-template-columns:1fr !important;
		gap:14px !important;
	}
	.bo-page .grid{
		grid-template-columns:1fr !important;
		gap:14px !important;
	}

	/* Hero "Pick of the Day" — stop 2-col split, stack vertically + reduce padding */
	.bo-page .bo-section.dark{padding:24px 16px !important}
	.bo-page .bo-section.dark h1{font-size:clamp(28px,7vw,36px) !important;line-height:1.1 !important}

	/* All bo-section paddings tightened on mobile */
	.bo-section{padding:24px 16px !important}
	.bo-section.alt,
	.bo-section.dark{padding:24px 16px !important}
	.accent-head h2{font-size:20px !important}

	/* Cards: reduce padding, full-width inside their column */
	.bo-card{padding:14px}

	/* Match cards full-width */
	.match-card{padding:14px}

	/* Hide template-side CI section header (NBA · EASTERN CONF · LAST 10) on mobile */
	.bo-home-ci-card{padding:14px !important;border-radius:10px}
	.bo-home-ci-card__header{display:none !important}

	/* ── Consistency Rankings widget compaction (snippet #105) ───
	   Hide the widget's own chrome (heading, controls, filters, footer)
	   and limit the visible team cards/rows to top 5. */
	.bo-cr-widget{padding:0 !important;margin:0 !important;border:0 !important;background:transparent !important;box-shadow:none !important}
	.bo-cr-widget .bo-cr-top,
	.bo-cr-widget .bo-cr-controls,
	.bo-cr-widget .bo-cr-tabs,
	.bo-cr-widget .bo-cr-filters,
	.bo-cr-widget .bo-cr-static-note,
	.bo-cr-widget .bo-cr-meta,
	.bo-cr-widget .bo-cr-locked-footer,
	.bo-cr-widget .bo-cr-footer-cta,
	.bo-cr-widget .bo-cr-global-cta{display:none !important}
	/* On mobile the widget renders cards (not table). Limit to top 5. */
	.bo-cr-widget .bo-cr-cards{display:flex !important;flex-direction:column;gap:8px;padding:0 !important}
	.bo-cr-widget .bo-cr-card{padding:10px 12px !important;border-radius:10px}
	.bo-cr-widget .bo-cr-cards > .bo-cr-card:nth-child(n+6){display:none !important}
	/* Hide the table view (cards take over on mobile) */
	.bo-cr-widget .bo-cr-table-wrap,
	.bo-cr-widget .bo-cr-table{display:none !important}

	/* Sport hub cards bigger (50px tall headers feel cramped) */
	.bo-card[href*="/nba/"] > div:first-child,
	.bo-card[href*="/nfl/"] > div:first-child,
	.bo-card[href*="/soccer/"] > div:first-child{height:80px !important}

	/* Editorial big article — drop the row-span 2, let it stack */
	.bo-card[style*="grid-row:span 2"]{grid-row:auto !important}

	/* Hero pick image card not too tall on mobile */
	.bo-page .ph.duotone.primary{aspect-ratio:16/10 !important}
	.bo-page .ph.duotone{height:160px !important}

	/* Long horizontal scrollers should respect viewport */
	.bo-section .grid > *{min-width:0}

	/* ── Sport hub: swap desktop layout for mobile renderer ────── */
	.bo-mhub{display:block}
	.bo-hub-desktop{display:none !important}
	.bo-subnav{display:none !important}

	/* ── Picks archive: swap desktop content for mobile renderer ─ */
	.bo-mpicks{display:block}
	.bo-picks-desktop,
	.bo-dpicks{display:none !important}

	/* ── Playbook archive: swap desktop content for mobile renderer ─ */
	.bo-mpb{display:block}
	.bo-playbook-desktop,
	.bo-dpb{display:none !important}

	/* ── Sportsbooks archive: swap desktop content for mobile renderer ─ */
	.bo-msb{display:block}
	.bo-sportsbooks-desktop{display:none !important}

	/* ── Mobile overlays (show only when JS un-hides them) ── */
	.bo-overlay:not([hidden]){display:block}

	/* ── Single-post: swap desktop content for mobile renderer ── */
	.bo-msingle{display:block}
	.bo-single-desktop,
	.bo-darticle{display:none !important}

	/* ── Single PICK pages (Elementor template hijacks single-{cpt}.php).
	   We KEEP the Elementor content but inject our mobile hero + sticky
	   CTA above it, and apply heavy mobile overrides below. */
	body.single-nba-predictions .bo-mpick,
	body.single-nfl-predictions .bo-mpick,
	body.single-mls-picks .bo-mpick{display:block}
	body.single-nba-predictions .bo-mpick-sticky-cta,
	body.single-nfl-predictions .bo-mpick-sticky-cta,
	body.single-mls-picks .bo-mpick-sticky-cta{display:flex}
	/* Reserve room for sticky CTA so it doesn't cover the bnav. */
	body.single-nba-predictions,
	body.single-nfl-predictions,
	body.single-mls-picks{padding-bottom:calc(150px + env(safe-area-inset-bottom))}
	body.single-nba-predictions .bo-bnav,
	body.single-nfl-predictions .bo-bnav,
	body.single-mls-picks .bo-bnav{bottom:64px}

	/* Force Elementor 2-col layout to stack on mobile + tighten paddings. */
	body.single-nba-predictions .elementor-column,
	body.single-nfl-predictions .elementor-column,
	body.single-mls-picks .elementor-column{width:100% !important}
	body.single-nba-predictions .e-con,
	body.single-nfl-predictions .e-con,
	body.single-mls-picks .e-con{padding:14px 12px !important}
	body.single-nba-predictions .elementor-section,
	body.single-nfl-predictions .elementor-section,
	body.single-mls-picks .elementor-section{padding:0 !important}
	body.single-nba-predictions .elementor-container,
	body.single-nfl-predictions .elementor-container,
	body.single-mls-picks .elementor-container{padding:0 !important}

	/* Hide the original page H1 (we render our own hero with team names). */
	body.single-nba-predictions .elementor-location-single h1.elementor-heading-title:first-of-type,
	body.single-nfl-predictions .elementor-location-single h1.elementor-heading-title:first-of-type,
	body.single-mls-picks .elementor-location-single h1.elementor-heading-title:first-of-type,
	body.single-nba-predictions .sports-match-header-preview,
	body.single-nfl-predictions .sports-match-header-preview,
	body.single-mls-picks .sports-match-header-preview{display:none !important}

	/* Tighten section H2 typography on mobile. */
	body.single-nba-predictions .elementor-shortcode h2,
	body.single-nfl-predictions .elementor-shortcode h2,
	body.single-mls-picks .elementor-shortcode h2{
		font-family:var(--sans);font-weight:800;font-size:20px;
		letter-spacing:-0.02em;line-height:1.15;margin:18px 0 10px;color:var(--secondary)
	}
	body.single-nba-predictions .elementor-shortcode h3,
	body.single-nfl-predictions .elementor-shortcode h3,
	body.single-mls-picks .elementor-shortcode h3{
		font-family:var(--sans);font-weight:800;font-size:16px;letter-spacing:-0.01em;
		margin:14px 0 8px;color:var(--secondary)
	}
	body.single-nba-predictions .elementor-shortcode p,
	body.single-nfl-predictions .elementor-shortcode p,
	body.single-mls-picks .elementor-shortcode p,
	body.single-nba-predictions .elementor-text-editor p,
	body.single-nfl-predictions .elementor-text-editor p,
	body.single-mls-picks .elementor-text-editor p{font-size:14px;line-height:1.55;color:#0F1820}
	body.single-nba-predictions .elementor-shortcode ul,
	body.single-nfl-predictions .elementor-shortcode ul,
	body.single-mls-picks .elementor-shortcode ul{padding-left:18px;font-size:14px;line-height:1.55}

	/* Compact CI widget on single pick pages (reuse home-style rules). */
	body.single-nba-predictions .bo-ci-widget,
	body.single-nfl-predictions .bo-ci-widget,
	body.single-mls-picks .bo-ci-widget{padding:0;border:0;background:transparent;box-shadow:none}
	body.single-nba-predictions .bo-cr-widget .bo-cr-controls,
	body.single-nfl-predictions .bo-cr-widget .bo-cr-controls,
	body.single-mls-picks .bo-cr-widget .bo-cr-controls,
	body.single-nba-predictions .bo-cr-widget .bo-cr-tabs,
	body.single-nfl-predictions .bo-cr-widget .bo-cr-tabs,
	body.single-mls-picks .bo-cr-widget .bo-cr-tabs,
	body.single-nba-predictions .bo-cr-widget .bo-cr-filters,
	body.single-nfl-predictions .bo-cr-widget .bo-cr-filters,
	body.single-mls-picks .bo-cr-widget .bo-cr-filters{display:none !important}
	body.single-nba-predictions .bo-cr-widget .bo-cr-cards > .bo-cr-card:nth-child(n+6),
	body.single-nfl-predictions .bo-cr-widget .bo-cr-cards > .bo-cr-card:nth-child(n+6),
	body.single-mls-picks .bo-cr-widget .bo-cr-cards > .bo-cr-card:nth-child(n+6){display:none !important}

	/* Stack H2H rows vertically on mobile. */
	body.single-nba-predictions .bo-h2h-nba__row,
	body.single-nfl-predictions .bo-h2h-nba__row,
	body.single-mls-picks .bo-h2h-nba__row{flex-direction:column;gap:6px}

	/* Sportsbook cards stack: full-width per card. */
	body.single-nba-predictions .sports-team-odds,
	body.single-nfl-predictions .sports-team-odds,
	body.single-mls-picks .sports-team-odds{width:100% !important;display:block}

	/* Sidebar predictions: hide on mobile (already shown in archives + bnav). */
	body.single-nba-predictions .bo-sidebar-predictions,
	body.single-nfl-predictions .bo-sidebar-predictions,
	body.single-mls-picks .bo-sidebar-predictions{display:none !important}

	/* Hide chrome we already supply via .bo-mpick-crumb (back arrow + sport · date). */
	body.single-nba-predictions .bo-crumbs,
	body.single-nfl-predictions .bo-crumbs,
	body.single-mls-picks .bo-crumbs,
	body.single-nba-predictions [class*="breadcrumb"]:not(.bo-mpick-crumb),
	body.single-nfl-predictions [class*="breadcrumb"]:not(.bo-mpick-crumb),
	body.single-mls-picks [class*="breadcrumb"]:not(.bo-mpick-crumb){display:none !important}

	/* Sportsbook CPT: Elementor Theme Builder template is hijacking
	   single-sportsbooks-bonuses.php; hide its wrapper on mobile so only
	   our wp_body_open-injected mobile renderer shows. */
	body.single-sportsbooks-bonuses .elementor-location-single,
	body.single-sportsbooks-bonuses .elementor-location-archive,
	body.single-sportsbooks-bonuses #site-content,
	body.single-sportsbooks-bonuses #content-wrap,
	body.single-sportsbooks-bonuses .entry-header,
	body.single-sportsbooks-bonuses .entry-content,
	body.single-sportsbooks-bonuses .ocean-row,
	body.single-sportsbooks-bonuses #main{display:none !important}
	/* Sticky CTA on sportsbook review reserves room above bnav. */
	body.single-sportsbooks-bonuses{padding-bottom:calc(140px + env(safe-area-inset-bottom))}
	/* Push the bnav above the sticky CTA. */
	body.single-sportsbooks-bonuses .bo-bnav{bottom:64px}
}

/* ── Footer (full-width chrome, inner capped 1440px) ── */
.bo-footer{background:var(--secondary);color:#fff;margin-top:56px;width:100%}
.bo-foot-top{padding:32px 24px 0}
.bo-foot-inner{max-width:1440px;margin:0 auto}
.bo-footer .bo-logo img{height:22px;max-height:22px;width:auto;display:block}

.bo-foot-brandrow{display:flex;align-items:center;justify-content:space-between;padding-bottom:24px;border-bottom:1px solid #2a363e;gap:20px;flex-wrap:wrap}

/* Newsletter: label + input + button on a single row, no wrap */
.bo-foot-nl{display:flex;align-items:center;gap:12px;flex-wrap:nowrap}
.bo-foot-nl .lb{font-weight:700;font-size:14px;color:#fff;white-space:nowrap}
.bo-foot-nl input[type="email"]{
	background:#2a363e;border:1px solid #2a363e;color:#fff;padding:10px 14px;
	min-width:0;width:260px;max-width:100%;border-radius:3px;font-family:var(--sans);font-size:13px;flex:1 1 200px
}
.bo-foot-nl input[type="email"]::placeholder{color:var(--secondary-20)}
.bo-foot-nl button[type="submit"]{flex-shrink:0}

/* 5-column link grid */
.bo-foot-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:28px;padding:28px 0}
.bo-foot-col h5{
	font-size:12px;
	font-weight:700;
	text-transform:uppercase;
	letter-spacing:0.1em;
	margin:0 0 14px;
	color:#fff !important;
}
.bo-foot-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.bo-foot-col a{color:#E5E8EA;font-size:13px;font-weight:500;text-decoration:none}
.bo-foot-col a:hover{color:var(--primary)}

/* Dark bottom bar — full-width, inner capped */
.bo-foot-bottom{background:var(--secondary-dark);padding:16px 0;margin-top:0}
.bo-foot-bottom-inner{
	padding:0 24px;
	display:flex;justify-content:space-between;align-items:center;
	font-family:var(--mono);font-size:11px;color:var(--secondary-20);
	flex-wrap:wrap;gap:10px
}
.bo-foot-bottom a{color:var(--secondary-20);text-decoration:none}
.bo-foot-bottom a:hover{color:var(--primary)}
.bo-foot-bottom .ac{background:var(--primary);color:var(--secondary);padding:2px 7px;font-weight:700;margin-right:6px}
.bo-foot-bottom u{color:var(--primary);text-decoration:underline}
.bo-foot-bottom u a{color:inherit}

/* Responsive */
@media (max-width:1023px){
	.bo-foot-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:767px){
	.bo-footer{margin-top:40px;padding-bottom:96px} /* avoid .bo-bnav overlap */
	.bo-foot-top{padding:28px 20px 0}
	.bo-foot-brandrow{flex-direction:column;align-items:center;text-align:center;gap:18px}
	.bo-foot-nl{flex-wrap:wrap;width:100%;justify-content:center}
	.bo-foot-nl .lb{width:100%;text-align:center}
	.bo-foot-nl input[type="email"]{min-width:0;flex:1 1 200px;width:auto}
	.bo-foot-grid{grid-template-columns:repeat(2,1fr);gap:24px;padding:24px 20px}
	.bo-foot-bottom{padding:14px 0}
	.bo-foot-bottom-inner{padding:0 20px;flex-direction:column;align-items:center;text-align:center;gap:8px}
}
@media (max-width:479px){
	.bo-foot-grid{grid-template-columns:1fr}
}

/* ── Article / section scaffolds ── */
.bo-section{padding:44px 24px}
.bo-section.alt{background:var(--paper)}
.bo-section.dark{background:var(--secondary);color:#fff}
.bo-section h2{font-family:var(--sans);font-weight:700;font-size:clamp(24px,3vw,32px);line-height:1.2;margin:0 0 4px;letter-spacing:-0.01em}
.bo-section h3{font-family:var(--sans);font-weight:700;font-size:20px;line-height:1.25;margin:0 0 12px}
.bo-eyebrow{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:0.1em;color:var(--secondary-60);display:block;margin-bottom:8px}
.bo-section.dark .bo-eyebrow{color:var(--primary)}
.bo-section.dark h2{color:#fff}
.bo-more{font-family:var(--mono);font-size:12px;text-transform:uppercase;letter-spacing:0.1em;color:var(--primary);float:right}

/* ── Card primitives ── */
.bo-card{background:#fff;border:1px solid var(--secondary-20);border-radius:8px;padding:20px;transition:transform 0.15s,box-shadow 0.15s}
.bo-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(16,24,32,0.08)}
.bo-card.shade{background:var(--paper)}
.bo-card.dark{background:var(--secondary);color:#fff;border-color:var(--secondary)}

/* ── Image placeholders (hatched) ── */
.ph{background:repeating-linear-gradient(-45deg,#f0efe8 0 6px,#e4e2d8 6px 12px);border:1px solid var(--secondary-20);position:relative;display:flex;align-items:center;justify-content:center;color:var(--secondary-60);font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:0.08em;text-align:center;padding:8px;border-radius:6px}
.ph.duotone{background:linear-gradient(135deg,#1A262E 0%,#2a3b48 60%,var(--primary) 100%);color:#fff;border-color:var(--secondary)}
.ph.duotone.primary{background:linear-gradient(135deg,#1A262E 0%,#1f5a3a 60%,var(--primary) 100%)}
.ph.avatar{border-radius:50%;background:linear-gradient(135deg,var(--secondary) 0%,#2a3b48 100%);color:#fff}
.ph .lbl{position:absolute;top:8px;right:8px;font-family:var(--mono);font-size:10px;color:rgba(255,255,255,0.7);background:rgba(0,0,0,0.3);padding:2px 6px;border-radius:2px}

/* ── Pill tag ── */
.tag{display:inline-flex;align-items:center;gap:6px;background:var(--primary-tint);color:#1e6b3a;font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:0.08em;padding:4px 10px;border-radius:3px}
.tag.dark{background:var(--secondary);color:#fff}
.tag.white{background:#fff;color:var(--secondary);border:1px solid var(--secondary-20)}
.tag.nba{background:#c8102e;color:#fff}
.tag.nfl{background:#013369;color:#fff}
.tag.mls{background:#001e62;color:#fff}
.tag.epl{background:#3d195b;color:#fff}

/* ── Meta row ── */
.bo-meta{font-family:var(--mono);font-size:11px;letter-spacing:0.04em;color:var(--secondary-60);display:flex;gap:10px;align-items:center}
.bo-meta .sep{color:var(--secondary-20)}

/* ── Confidence bar ── */
.conf{height:8px;background:var(--paper);border-radius:999px;overflow:hidden;position:relative}
.conf span{display:block;height:100%;background:var(--primary);border-radius:999px}

/* ── Bar chart utility ── */
.bars{display:flex;align-items:flex-end;gap:3px;height:var(--h,80px);border-bottom:1px solid var(--secondary-20);position:relative}
.bars .b{flex:1;background:var(--secondary-60);border-radius:2px 2px 0 0}
.bars .b.hit{background:var(--primary)}
.bars .line{position:absolute;left:0;right:0;border-top:1.5px dashed var(--primary)}

/* ── Sport subnav ── */
.bo-subnav{background:var(--paper);border-bottom:1px solid var(--secondary-20);padding:10px 24px;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.bo-subnav .title{font-weight:800;font-size:20px;letter-spacing:-0.01em}
.bo-subnav .links{display:flex;gap:4px;flex-wrap:wrap}
.bo-subnav .links a{font-family:var(--sans);font-size:13px;padding:6px 10px;border-radius:3px;color:var(--secondary-60);font-weight:600}
.bo-subnav .links a.active{background:var(--secondary);color:#fff}
.bo-subnav .links a:hover{background:var(--primary-tint);color:var(--secondary)}
.bo-subnav .meta{margin-left:auto;font-family:var(--mono);font-size:11px;color:var(--secondary-60)}

/* ── Match card ── */
.match-card{background:#fff;border:1px solid var(--secondary-20);border-radius:8px;padding:16px;position:relative;display:flex;flex-direction:column;gap:10px}
.match-card .top{display:flex;justify-content:space-between;font-family:var(--mono);font-size:10px;letter-spacing:0.08em;color:var(--secondary-60)}
.match-card .top .live{color:var(--primary);display:flex;align-items:center;gap:4px}
.match-card .top .live::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--primary);animation:blink 1.4s infinite}
.match-card .row{display:flex;align-items:center;gap:10px}
.match-card .row .logo{width:28px;height:28px;border-radius:50%;background:var(--paper);border:1px solid var(--secondary-20);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:9px;color:var(--secondary);font-weight:700}
.match-card .row .name{flex:1;font-weight:600;font-size:14px}
.match-card .row .sp{font-family:var(--mono);font-size:12px;color:var(--secondary-60)}
.match-card .row .sc{font-family:var(--sans);font-weight:700;font-size:18px}
.match-card .bottom{border-top:1px solid var(--secondary-20);padding-top:10px;display:flex;justify-content:space-between;align-items:center}
.match-card .pick{font-weight:700;font-size:13px;color:var(--primary)}
.match-card .pick::before{content:"● ";color:var(--primary)}
.match-card .conf-v{font-family:var(--mono);font-size:11px;color:var(--secondary-60)}

/* ── Dark match card ── */
.match-card.dark{background:#23333c;border-color:#2a363e;color:#fff}
.match-card.dark .row .logo{background:#fff;color:var(--secondary);border-color:#fff}
.match-card.dark .row .sp{color:var(--secondary-20)}
.match-card.dark .bottom{border-top-color:#2a363e}
.match-card.dark .conf-v{color:var(--secondary-20)}

/* ── Data tables ── */
.bo-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--secondary-20);border-radius:8px;overflow:hidden}
.bo-table thead{background:var(--secondary);color:#fff}
.bo-table th{font-family:var(--mono);font-size:10px;letter-spacing:0.1em;text-transform:uppercase;font-weight:700;padding:12px 14px;text-align:left;color:#fff}
.bo-table td{padding:14px;font-size:13px;border-bottom:1px solid var(--secondary-20);vertical-align:middle}
.bo-table tbody tr:last-child td{border-bottom:none}
.bo-table tbody tr:hover{background:var(--paper)}
.bo-table td.rank{font-weight:700;color:var(--primary);font-family:var(--sans);font-size:16px;width:44px}
.bo-table .with-logo{display:flex;align-items:center;gap:10px}
.bo-table .with-logo .logo{width:28px;height:28px;border-radius:50%;background:var(--paper);border:1px solid var(--secondary-20);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:9px;font-weight:700;color:var(--secondary)}
.bo-table tr.highlight{background:var(--primary-tint)}

/* ── Responsible gambling band ── */
.bo-rg{background:var(--secondary);color:#fff;padding:24px;border-radius:8px;margin:24px 0;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.bo-rg h3{color:#fff;margin:0 0 4px;font-size:18px}
.bo-rg p,
.bo-rg > div p,
.bo-rg p.bo-rg__text,
body .bo-rg p{margin:0;color:#fff !important;font-size:13px;max-width:620px;line-height:1.55}
/* Red warning clause inside the paragraph */
.bo-rg .bo-rg__warn{color:var(--danger) !important;font-weight:600}
/* CTA to /responsible-gambling/ */
.bo-rg .bo-rg__cta{
	display:inline-flex;align-items:center;gap:6px;margin-top:10px;
	font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:0.06em;
	text-transform:uppercase;color:var(--primary);text-decoration:none;
	border-bottom:1px dotted rgba(51,204,112,0.4);padding-bottom:2px;
	transition:color .15s,border-color .15s,transform .1s
}
.bo-rg .bo-rg__cta:hover{color:var(--primary-60);border-color:var(--primary);transform:translateX(2px)}
.bo-rg .side{display:flex;flex-direction:column;gap:8px;align-items:flex-end}
/* Mobile: the RG band wraps to a single column — center the side block
   (Must-be-21+ pill + phone line) instead of keeping it right-aligned. */
@media (max-width:767px){
	.bo-rg .side{align-items:center;width:100%;text-align:center;margin-top:8px}
	.bo-rg .side .phone{display:inline-block;text-align:center}
}
.bo-rg .phone{font-family:var(--mono);font-size:12px}
.bo-rg .phone u{color:var(--primary)}

/* ── Utility ── */
.row{display:flex;gap:16px}
.col{display:flex;flex-direction:column;gap:16px}
.grid{display:grid;gap:16px}
.mute{color:var(--secondary-60)}
hr{border:none;border-top:1px solid var(--secondary-20);margin:16px 0}

/* ── Chip/badge for league ── */
.league-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-family:var(--mono);font-size:10px;letter-spacing:0.1em;text-transform:uppercase;font-weight:700}

/* ── Sidebar cards ── */
.side-title{font-weight:700;font-size:16px;margin:0 0 12px;padding-bottom:10px;border-bottom:2px solid var(--secondary)}
.side-list{display:flex;flex-direction:column}
.side-list .item{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--secondary-20);align-items:center}
.side-list .item:last-child{border-bottom:none}
.side-list .item .ph{width:52px;height:52px;flex-shrink:0;border-radius:6px}
.side-list .item .tx{flex:1;min-width:0}
.side-list .item .tx b{display:block;font-size:13px;font-weight:700;line-height:1.3;color:var(--secondary)}
.side-list .item .tx .meta{font-family:var(--mono);font-size:10px;color:var(--secondary-60);margin-top:3px;letter-spacing:0.05em}
.side-list .item .arrow{color:var(--primary);font-weight:700}

/* ── Sportsbook row ── */
.sb-row{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--secondary-20);border-radius:8px;padding:14px;transition:transform 0.12s,box-shadow 0.12s}
.sb-row:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(16,24,32,0.08)}
.sb-row .logo{width:54px;height:54px;border-radius:8px;background:var(--secondary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:16px;flex-shrink:0}
.sb-row .logo.dk{background:#53d337}
.sb-row .logo.fd{background:#1493ff}
.sb-row .logo.mgm{background:#bd9b60;color:#1A262E}
.sb-row .logo.cz{background:#d4a54a;color:#1A262E}
.sb-row .logo.espn{background:#d2232a}
.sb-row .logo.bet365{background:#f0b538;color:#1A262E}
.sb-row .info{flex:1}
.sb-row .info b{font-size:15px;display:block}
.sb-row .info .bonus{font-family:var(--mono);font-size:11px;color:var(--secondary-60);margin-top:2px}
.sb-row .stars{font-family:var(--mono);font-size:12px;font-weight:700;color:var(--secondary)}

/* ── Guides grid image card ── */
.guide-card{
	position:relative;border-radius:8px;overflow:hidden;
	background:var(--secondary);color:#fff;aspect-ratio:1.9;
	display:flex;flex-direction:column;justify-content:flex-end;padding:18px;
	cursor:pointer;text-decoration:none;
	background-size:cover;background-position:center;
	transition:transform .15s ease,box-shadow .2s ease
}
.guide-card:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(16,24,32,0.22);color:#fff}
/* Dark gradient overlay for text readability. Has a striped fallback
   pattern when no featured image is set. */
.guide-card::before{
	content:"";position:absolute;inset:0;
	background:linear-gradient(180deg,rgba(16,24,32,0.25) 0%,rgba(16,24,32,0.88) 100%)
}
.guide-card:not(.has-bg)::before{
	background:
		linear-gradient(180deg,rgba(16,24,32,0.2) 0%,rgba(16,24,32,0.85) 100%),
		repeating-linear-gradient(-45deg,#243540 0 8px,#2a3b48 8px 16px)
}
.guide-card > *{position:relative;z-index:1}
.guide-card .date{font-family:var(--mono);font-size:10px;letter-spacing:0.1em;position:absolute;top:14px;right:14px;z-index:2;background:rgba(0,0,0,0.5);padding:4px 8px;border-radius:2px}
.guide-card h4{font-family:var(--sans);font-weight:700;font-size:17px;line-height:1.25;margin:0;color:#fff;letter-spacing:-0.005em}
.guide-card .tag{position:absolute;top:14px;left:14px;z-index:2}

/* ── TOC ── */
.bo-toc{background:var(--paper);border:1px solid var(--secondary-20);border-radius:8px;padding:18px 22px}
.bo-toc .hd{display:flex;justify-content:space-between;align-items:center;cursor:pointer}
.bo-toc .hd h4{margin:0;font-size:14px;text-transform:uppercase;letter-spacing:0.08em}
.bo-toc .hd .chev{color:var(--primary)}
.bo-toc ol{list-style:none;padding:14px 0 0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:8px 20px}
.bo-toc ol li{display:flex;gap:10px;font-size:13px}
.bo-toc ol li::before{content:attr(data-n);font-family:var(--mono);color:var(--primary);font-weight:700;min-width:28px}

/* ── Prose typography for article bodies ── */
.prose{font-size:17px;line-height:1.6;color:var(--ink)}
.prose p{margin:0 0 16px}
.prose strong,.prose b{font-weight:700}
.prose a{color:var(--secondary);text-decoration:underline;text-decoration-color:var(--primary);text-decoration-thickness:2px;text-underline-offset:2px}
.prose h2{font-size:24px;margin:32px 0 12px;font-weight:700;letter-spacing:-0.01em}
.prose h3{font-size:19px;margin:24px 0 8px;font-weight:700}
.prose blockquote{margin:16px 0;padding:14px 18px;background:var(--primary-tint);border-left:3px solid var(--primary);border-radius:0 6px 6px 0;font-style:italic}
.prose ul{margin:0 0 16px;padding-left:22px}
.prose ul li::marker{color:var(--primary)}

/* ── Filter bar ── */
.filter-bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;padding:14px 0}
.filter-chip{background:#fff;border:1px solid var(--secondary-20);color:var(--secondary);padding:7px 14px;border-radius:999px;font-size:12px;font-weight:600;cursor:pointer}
.filter-chip.active{background:var(--secondary);color:#fff;border-color:var(--secondary)}
.filter-chip:hover{border-color:var(--secondary)}

/* ── Pick row ── */
.pick-row{display:grid;grid-template-columns:48px 1fr 160px 140px 110px;gap:18px;padding:18px;border:1px solid var(--secondary-20);border-radius:8px;background:#fff;align-items:center;transition:transform 0.12s}
.pick-row:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(16,24,32,0.06)}
.pick-row .logo{width:44px;height:44px;border-radius:8px;background:var(--paper);border:1px solid var(--secondary-20);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:11px;font-weight:700}
.pick-row .main b{display:block;font-size:16px;font-weight:700}
.pick-row .main .meta{font-family:var(--mono);font-size:11px;color:var(--secondary-60);margin-top:3px}
.pick-row .main .note{margin-top:4px;font-size:13px;color:var(--ink)}
.pick-row .conf-cell{display:flex;flex-direction:column;gap:6px}
.pick-row .conf-cell b{font-family:var(--mono);font-size:12px}
.pick-row .odds{text-align:center}
.pick-row .odds b{font-family:var(--sans);font-weight:800;font-size:22px;color:var(--primary);display:block}
.pick-row .odds .src{font-family:var(--mono);font-size:10px;color:var(--secondary-60);margin-top:2px}

/* ── Section headers with accent line ── */
.accent-head{border-top:3px solid var(--secondary);padding-top:14px;display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.accent-head + p{margin-top:0}
.accent-head h2{margin:0;font-size:28px}
.accent-head .lnk{font-family:var(--mono);font-size:12px;color:var(--primary);letter-spacing:0.08em;text-transform:uppercase}
.accent-head .lnk::after{content:" →"}

/* small utility */
.stat-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px dashed var(--secondary-20);font-size:13px}
.stat-row:last-child{border-bottom:none}

/* ════════════════════════════════════════════════════════════════════
   SPORTSBOOKS ARCHIVE (rewrite of /sportsbooks/) — mobile + desktop.
   Port of design-midfi "Best US Sportsbooks" + "Sportsbooks Mobile".
   The .bo-msb ↔ .bo-sportsbooks-desktop display toggle is kept from the
   existing mobile-media-query block (below).
   ════════════════════════════════════════════════════════════════════ */

/* ── Shared card (used by both mobile and desktop ranking lists) ── */
.bo-sb-card{
	background:#fff;border:1px solid rgba(199,204,207,0.6);
	border-radius:14px;overflow:hidden;margin-bottom:10px;
	box-shadow:0 2px 6px rgba(15,24,32,0.04)
}
.bo-sb-card-top{display:flex;align-items:stretch;gap:0;border-bottom:1px solid rgba(199,204,207,0.4)}
.bo-sb-rank{
	flex:0 0 52px;background:var(--paper);color:var(--secondary-60);
	display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px
}
.bo-sb-rank--first{background:var(--primary);color:var(--secondary)}
.bo-sb-rank .bo-meta{font-size:9px}
.bo-sb-rank-n{font-family:var(--sans);font-weight:800;font-size:22px;letter-spacing:-0.02em;line-height:1}
.bo-sb-card-hd{flex:1;padding:14px 14px 12px;min-width:0;display:flex;gap:10px;align-items:flex-start}
.bo-sb-logo{
	display:inline-flex;align-items:center;justify-content:center;
	flex-shrink:0;font-family:var(--sans);font-weight:800;
	letter-spacing:-0.01em;line-height:1
}
.bo-sb-logo--xs{width:18px;height:18px;border-radius:4px;font-size:8px}
.bo-sb-card-title{flex:1;min-width:0}
.bo-sb-name{
	display:flex;align-items:center;gap:6px;flex-wrap:wrap;
	font-family:var(--sans);font-weight:800;font-size:15px;
	letter-spacing:-0.01em;color:var(--secondary)
}
.bo-sb-new{font-size:8px;padding:2px 5px}
.bo-sb-rating{display:flex;align-items:center;gap:5px;margin-top:3px}
.bo-sb-stars{color:var(--warn);font-size:11px;letter-spacing:-0.05em}
.bo-sb-rating-n{font-family:var(--mono);font-size:11px;font-weight:700;color:var(--secondary)}
.bo-sb-rating-reviews{font-family:var(--mono);font-size:9px;color:var(--secondary-60)}
.bo-sb-rating-label{font-family:var(--mono);font-size:9px;color:var(--secondary-60);letter-spacing:0.05em;text-transform:uppercase}
.bo-sb-tagline{
	font-family:var(--mono);font-size:9px;color:var(--primary);
	font-weight:700;letter-spacing:0.04em;text-transform:uppercase;margin-top:6px
}

.bo-sb-card-offer{
	display:flex;align-items:center;gap:10px;
	padding:10px 14px;background:var(--primary-tint);
	border-bottom:1px solid rgba(199,204,207,0.4)
}
.bo-sb-card-offer-text{flex:1;min-width:0}
.bo-sb-card-offer-text .bo-meta{color:var(--primary);font-size:9px}
.bo-sb-promo{
	font-family:var(--sans);font-weight:700;font-size:13px;
	letter-spacing:-0.01em;color:var(--secondary)
}
.bo-sb-promo-sub{font-family:var(--mono);font-size:9px;color:var(--secondary-60);margin-top:1px}
.bo-sb-claim{
	background:var(--primary);color:var(--secondary);
	padding:9px 14px;border-radius:8px;
	font-family:var(--sans);font-weight:700;font-size:11px;
	letter-spacing:0.04em;text-transform:uppercase;text-decoration:none;
	white-space:nowrap;flex-shrink:0;transition:transform .1s,box-shadow .15s
}
.bo-sb-claim:hover{transform:translateY(-1px);box-shadow:0 4px 10px rgba(51,204,112,0.3);color:var(--secondary);text-decoration:none}

.bo-sb-card-bot{display:grid;grid-template-columns:1fr 1fr;gap:0}
.bo-sb-card-bot-col{padding:10px 14px}
.bo-sb-card-bot-col:first-child{border-right:1px solid rgba(199,204,207,0.4)}
.bo-sb-card-bot-col--kv{display:flex;flex-direction:column;justify-content:center;gap:4px}
.bo-sb-strengths{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.bo-sb-strength{
	background:var(--paper);color:var(--secondary);padding:2px 6px;border-radius:3px;
	font-family:var(--mono);font-size:9px;font-weight:600
}
.bo-sb-kv{display:flex;justify-content:space-between;align-items:baseline}
.bo-sb-kv-v{font-family:var(--mono);font-size:11px;font-weight:700;color:var(--secondary)}

.bo-sb-review-link{
	display:block;padding:10px 14px;background:var(--paper);
	font-family:var(--mono);font-size:10px;font-weight:700;color:var(--secondary);
	letter-spacing:0.06em;text-transform:uppercase;text-decoration:none;
	border-top:1px solid rgba(199,204,207,0.4);text-align:center;
	transition:background .15s
}
.bo-sb-review-link:hover{background:var(--primary-tint);color:var(--primary)}

/* ────────── MOBILE (.bo-msb, display:block only <768px) ────────── */
.bo-msb-hero{
	background:var(--secondary);color:#fff;padding:18px 16px 22px
}
.bo-msb-hero-title{
	font-family:var(--sans);font-weight:800;font-size:32px;line-height:1.02;
	letter-spacing:-0.025em;margin:10px 0 6px;color:#fff
}
.bo-msb-hero-title em{color:var(--primary);font-style:italic}
.bo-msb-hero-meta{
	font-family:var(--mono);font-size:11px;color:rgba(255,255,255,0.55);
	letter-spacing:0.02em;margin-bottom:16px
}
.bo-msb-loc{
	background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);
	border-radius:12px;padding:10px 12px;
	display:flex;align-items:center;gap:10px;color:var(--primary)
}
.bo-msb-loc-text{flex:1;color:#fff}
.bo-msb-loc-label{color:rgba(255,255,255,0.5);font-size:9px}
.bo-msb-loc-value{font-family:var(--sans);font-weight:700;font-size:13px;color:#fff}
.bo-msb-loc-btn{
	background:var(--primary);color:var(--secondary);border:none;
	padding:6px 10px;border-radius:6px;
	font-family:var(--mono);font-size:10px;font-weight:700;
	letter-spacing:0.05em;text-transform:uppercase;cursor:pointer
}

.bo-msb-chips-wrap{
	position:sticky;top:0;background:#fff;z-index:20;
	padding:12px 0 10px;border-bottom:1px solid rgba(199,204,207,0.5)
}
.bo-msb-chips{display:flex;gap:6px;overflow-x:auto;padding:0 14px 2px;scrollbar-width:none}
.bo-msb-chips::-webkit-scrollbar{display:none}
.bo-msb-chip{
	display:inline-flex;align-items:center;gap:4px;
	font-family:var(--mono);font-size:10px;padding:5px 10px;
	border-radius:999px;background:#fff;color:var(--secondary);
	font-weight:600;border:1px solid var(--secondary-20);white-space:nowrap;cursor:pointer
}
.bo-msb-chip.active{background:var(--secondary);color:#fff;border-color:var(--secondary)}

.bo-msb-sec{padding:18px 14px}

.bo-msb-ep-label{
	font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.08em;
	text-transform:uppercase;color:var(--secondary-60);
	display:flex;align-items:center;gap:6px;margin-bottom:10px
}
.bo-msb-ep-label .dot{width:4px;height:4px;background:var(--primary);border-radius:50%}
.bo-msb-ep{
	border-radius:16px;padding:18px;color:#000;
	position:relative;overflow:hidden
}
.bo-msb-ep-badge{
	position:absolute;top:14px;right:14px;
	background:rgba(0,0,0,0.85);color:var(--primary);
	font-family:var(--mono);font-size:9px;font-weight:800;letter-spacing:0.08em;
	padding:4px 7px;border-radius:4px
}
.bo-msb-ep-hd{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.bo-msb-ep-name{font-family:var(--sans);font-weight:800;font-size:22px;letter-spacing:-0.02em}
.bo-msb-ep-rating{font-family:var(--mono);font-size:10px;font-weight:700}
.bo-msb-ep-offer{
	background:rgba(0,0,0,0.1);border:1px solid rgba(0,0,0,0.15);
	border-radius:10px;padding:10px 12px;margin-bottom:12px
}
.bo-msb-ep-offer-label{color:rgba(0,0,0,0.6);font-size:9px}
.bo-msb-ep-offer-text{
	font-family:var(--sans);font-weight:800;font-size:16px;
	letter-spacing:-0.01em;margin-top:2px
}
.bo-msb-ep-actions{display:flex;gap:8px}
.bo-msb-hero .bo-msb-hero-intro,
body .bo-msb-hero-intro{font-family:var(--sans);font-size:14px;line-height:1.55;color:#fff !important;margin:10px 0 14px;opacity:0.95}
.bo-msb-ep-logo{width:56px;height:56px;object-fit:contain;background:#fff;border-radius:10px;padding:5px}
.bo-msb-ep-label{color:#fff !important}
.bo-msb-ep-name{color:#fff !important}
.bo-msb-ep-rating{color:#fff !important}
.bo-msb-ep-rating-label{color:#fff !important;font-family:var(--mono);font-size:9px;letter-spacing:0.05em;text-transform:uppercase;opacity:0.8}
.bo-msb-ep-offer-label{color:#fff !important;font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;opacity:0.85}
.bo-msb-ep-offer-text{color:#F1C84B !important;font-family:var(--sans);font-weight:800;font-size:18px;letter-spacing:-0.02em;margin-top:3px}
.bo-msb-ep-offer-sub{color:#fff !important;font-family:var(--mono);font-size:10px;margin-top:3px;opacity:0.85}
.bo-msb-ep-btn{
	display:inline-flex;align-items:center;justify-content:center;
	padding:11px 14px;border-radius:6px;
	font-family:var(--sans);font-weight:700;font-size:13px;
	letter-spacing:0.02em;text-decoration:none;
	transition:transform .1s,box-shadow .15s,filter .15s;min-width:0
}
.bo-msb-ep-btn:hover{transform:translateY(-1px);text-decoration:none}
.bo-msb-ep-btn--primary{flex:3;background:var(--primary) !important;color:var(--secondary) !important;border:1px solid var(--primary)}
.bo-msb-ep-btn--primary:hover{color:var(--secondary) !important}
.bo-msb-ep-btn--outline{flex:1;background:#fff !important;color:var(--secondary) !important;border:1px solid var(--secondary-20)}
.bo-msb-ep-btn--outline:hover{background:var(--paper) !important;border-color:var(--secondary);color:var(--secondary) !important}
.bo-msb-ep-btn--compare{
	display:flex !important;align-items:center;justify-content:center;gap:8px;
	width:100%;margin-top:8px;padding:11px 14px;
	background:var(--secondary) !important;color:#fff !important;
	border:1px solid var(--secondary);border-radius:6px;
	font-family:var(--sans);font-weight:700;font-size:13px;letter-spacing:0.02em;
	text-decoration:none;transition:transform .1s,box-shadow .15s
}
.bo-msb-ep-btn--compare:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(26,38,46,0.3);color:#fff !important;text-decoration:none}
.bo-msb-ep-btn-icon{width:18px;height:18px;object-fit:contain;flex-shrink:0}

.bo-msb-ah{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.bo-msb-ah h2,.bo-msb-ah .bo-msb-ah-title{margin:0;font-family:var(--sans);font-weight:800;font-size:18px;letter-spacing:-0.01em;color:var(--secondary)}
.bo-msb-sort{
	font-family:var(--mono);font-size:10px;color:var(--primary);
	letter-spacing:0.08em;font-weight:700;text-transform:uppercase;cursor:pointer
}

.bo-msb-cards .bo-sb-card{margin-bottom:10px}

.bo-msb-compare{
	background:var(--secondary);color:#fff;
	border:1px solid #000;border-radius:14px;padding:14px
}
.bo-msb-compare-hd{
	display:flex;align-items:center;gap:10px;margin-bottom:10px;
	color:var(--primary)
}
.bo-msb-compare-hd > div{color:#fff;font-family:var(--sans);font-weight:800;font-size:14px}
.bo-msb-compare-sub{color:rgba(255,255,255,0.55);font-size:10px;margin-bottom:12px}
.bo-msb-compare-chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.bo-msb-compare-chip{
	display:flex;align-items:center;gap:6px;
	background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.12);
	padding:5px 8px 5px 5px;border-radius:6px;
	font-family:var(--mono);font-size:10px;font-weight:600;color:#fff;cursor:pointer;
	transition:background .15s,border-color .15s,opacity .15s;font:inherit;line-height:1
}
.bo-msb-compare-chip:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.bo-msb-compare-chip .plus,.bo-msb-compare-chip__state{color:rgba(255,255,255,0.5);font-size:12px;margin-left:2px;font-weight:700}
.bo-msb-compare-chip--active{background:var(--primary);border-color:var(--primary);color:var(--secondary)}
.bo-msb-compare-chip--active .bo-msb-compare-chip__state{color:var(--secondary)}
.bo-msb-compare-chip--capped{opacity:0.4;cursor:not-allowed}
.bo-msb-compare-cta{
	display:flex;width:100%;text-align:center;align-items:center;justify-content:center;gap:6px;
	background:var(--primary);color:var(--secondary);
	padding:12px 14px;border-radius:10px;
	font-family:var(--sans);font-weight:700;font-size:12px;
	letter-spacing:0.06em;text-transform:uppercase;text-decoration:none;
	transition:transform .1s,filter .15s,opacity .15s
}
.bo-msb-compare-cta:hover{transform:translateY(-1px);color:var(--secondary);text-decoration:none}
.bo-msb-compare-cta--disabled{opacity:0.45;pointer-events:none;filter:saturate(0.5)}

.bo-msb-pillars{background:#fff;border:1px solid rgba(199,204,207,0.6);border-radius:14px;padding:14px}
.bo-msb-pillars-label{margin-bottom:10px}
.bo-msb-pillar{
	display:flex;align-items:center;gap:10px;padding:8px 0;
	border-top:1px solid rgba(199,204,207,0.4)
}
.bo-msb-pillar:first-of-type{border-top:none}
.bo-msb-pillar > div:first-child{flex:1}
.bo-msb-pillar-k{font-family:var(--sans);font-weight:700;font-size:12px;color:var(--secondary)}
.bo-msb-pillar-desc{font-family:var(--mono);font-size:9px;color:var(--secondary-60)}
.bo-msb-pillar-v{font-family:var(--mono);font-size:11px;font-weight:700;color:var(--primary)}
.bo-msb-pillars-link{
	display:block;padding:12px 0 0;
	font-family:var(--mono);font-size:10px;font-weight:700;
	color:var(--primary);letter-spacing:0.08em;text-transform:uppercase;text-decoration:none
}

.bo-msb-disclaimer{
	padding:14px 16px 80px;
	font-family:var(--mono);font-size:9px;line-height:1.6;
	color:var(--secondary-60);letter-spacing:0.02em
}
.bo-msb-disclaimer a{color:var(--primary)}

/* ────────── DESKTOP (.bo-sb-desktop, hidden <768px) ────────── */
.bo-sb-desktop{background:var(--paper);color:var(--secondary)}

.bo-sb-hero{
	background:linear-gradient(135deg,var(--secondary) 0%,#243844 70%,var(--secondary-dark) 100%);
	color:#fff;padding:56px 24px
}
.bo-sb-hero-inner{
	max-width:none;margin:0;
	display:grid;grid-template-columns:1.3fr 1fr;gap:44px;align-items:center
}
.bo-sb-hero-title{
	font-family:var(--sans);font-weight:800;font-size:clamp(36px,4vw,52px);
	line-height:1.02;letter-spacing:-0.03em;margin:14px 0 14px;color:#fff
}
.bo-sb-hero-title em{color:var(--primary);font-style:italic}
.bo-sb-hero .bo-sb-hero-intro,
body .bo-sb-hero-intro{
	font-family:var(--sans);font-size:16px;line-height:1.6;
	color:#fff !important;margin:0 0 18px;max-width:560px
}
.bo-sb-hero-meta{
	font-family:var(--mono);font-size:11px;color:rgba(255,255,255,0.55);
	letter-spacing:0.04em;text-transform:uppercase
}
.bo-sb-hero-meta .sep{opacity:0.4;margin:0 4px}

.bo-sb-hero-editor-label{
	display:flex;align-items:center;gap:8px;color:rgba(255,255,255,0.7);margin-bottom:10px
}
.bo-sb-hero-editor-label .dot{width:6px;height:6px;background:var(--primary);border-radius:50%}
.bo-sb-hero-editor-card{
	border-radius:18px;padding:24px;color:#000;position:relative;overflow:hidden;
	box-shadow:0 20px 60px rgba(0,0,0,0.35)
}
.bo-sb-hero-editor-hd{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.bo-sb-hero-editor-name{
	font-family:var(--sans);font-weight:800;font-size:28px;letter-spacing:-0.02em
}
.bo-sb-hero-editor-rating{font-family:var(--mono);font-size:11px;font-weight:700;margin-top:2px}
.bo-sb-hero-editor-offer{
	background:rgba(0,0,0,0.12);border:1px solid rgba(0,0,0,0.18);
	border-radius:12px;padding:14px 16px;margin-bottom:14px
}
.bo-sb-hero-editor-offer-text{
	font-family:var(--sans);font-weight:800;font-size:20px;letter-spacing:-0.02em;margin-top:3px
}
.bo-sb-hero-editor-offer-sub{font-family:var(--mono);font-size:10px;color:rgba(0,0,0,0.6);margin-top:3px}
.bo-sb-hero-editor-actions{display:flex;gap:10px}
.bo-sb-hero-editor-btn{
	display:inline-flex;align-items:center;justify-content:center;
	padding:12px 16px;border-radius:6px;
	font-family:var(--sans);font-weight:700;font-size:13px;
	letter-spacing:0.02em;text-decoration:none;
	transition:transform .1s,box-shadow .15s,filter .15s;min-width:0
}
.bo-sb-hero-editor-btn:hover{transform:translateY(-1px);text-decoration:none}
.bo-sb-hero-editor-btn--primary{flex:3;background:var(--primary) !important;color:var(--secondary) !important;border:1px solid var(--primary)}
.bo-sb-hero-editor-btn--primary:hover{box-shadow:0 4px 12px rgba(51,204,112,0.30);color:var(--secondary) !important}
.bo-sb-hero-editor-btn--outline{flex:1;background:#fff !important;color:var(--secondary) !important;border:1px solid var(--secondary-20)}
.bo-sb-hero-editor-btn--outline:hover{background:var(--paper) !important;border-color:var(--secondary);color:var(--secondary) !important}

/* Compare-this-book button — full row, brand-dark color */
.bo-sb-hero-editor-btn--compare{
	display:flex !important;align-items:center;justify-content:center;gap:8px;
	width:100%;margin-top:10px;padding:11px 16px;
	background:var(--secondary) !important;color:#fff !important;
	border:1px solid var(--secondary);border-radius:6px;
	font-family:var(--sans);font-weight:700;font-size:13px;letter-spacing:0.02em;
	text-decoration:none;transition:transform .1s,box-shadow .15s,filter .15s
}
.bo-sb-hero-editor-btn--compare:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(26,38,46,0.3);color:#fff !important;text-decoration:none}
.bo-sb-hero-editor-btn-icon{width:20px;height:20px;object-fit:contain;flex-shrink:0}

/* ── Editor card: force white labels + gold offer text, independent of card's brand color ── */
.bo-sb-hero-editor-label-text{color:#fff !important;font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase}
.bo-sb-hero-editor-rating-label{color:#fff !important;font-family:var(--mono);font-size:9px;letter-spacing:0.05em;text-transform:uppercase;opacity:0.8}
.bo-sb-hero-editor-offer-label{color:#fff !important;font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;opacity:0.85}
.bo-sb-hero-editor-offer-text{color:#F1C84B !important;font-family:var(--sans);font-weight:800;font-size:22px;letter-spacing:-0.02em;margin-top:3px}
.bo-sb-hero-editor-offer-sub{color:#fff !important;font-family:var(--mono);font-size:10px;margin-top:3px;opacity:0.85}
.bo-sb-hero-editor-name{color:#fff !important}
.bo-sb-hero-editor-rating{color:#fff !important}
.bo-sb-hero-editor-logo{width:64px;height:64px;object-fit:contain;background:#fff;border-radius:12px;padding:6px}

.bo-sb-filterbar{
	background:#fff;border-bottom:1px solid var(--secondary-20);
	position:sticky;top:var(--bo-sticky-offset,180px);z-index:10
}
.bo-sb-filterbar-inner{
	max-width:none;margin:0;padding:14px 24px;
	display:flex;align-items:center;gap:20px
}
.bo-sb-chips{display:flex;gap:8px;overflow-x:auto;flex:1;scrollbar-width:none}
.bo-sb-chips::-webkit-scrollbar{display:none}
.bo-sb-sort{position:relative;font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.06em;color:var(--secondary);white-space:nowrap}
.bo-sb-sort-trigger{background:none;border:0;padding:6px 10px;cursor:pointer;font:inherit;color:inherit;letter-spacing:inherit;border-radius:6px}
.bo-sb-sort-trigger:hover{background:var(--secondary-10, rgba(0,0,0,0.06))}
.bo-sb-sort-menu{position:absolute;top:calc(100% + 4px);right:0;margin:0;padding:6px 0;list-style:none;background:#fff;border:1px solid var(--secondary-20, rgba(0,0,0,0.12));border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,0.12);min-width:180px;z-index:50}
.bo-sb-sort-menu[hidden]{display:none}
.bo-sb-sort-menu li{padding:8px 14px;font-size:12px;font-weight:600;cursor:pointer;color:var(--secondary)}
.bo-sb-sort-menu li:hover{background:var(--primary-tint, #f0f5f2);color:var(--secondary)}
.bo-sb-sort-menu li[aria-selected="true"]{color:var(--primary);background:var(--primary-tint, #f0f5f2)}
/* Filter chips became <button> elements in Wave 3 — reset UA button styling
   without disturbing the existing visual rules (which already set bg/border). */
button.bo-msb-chip{font:inherit;line-height:1}
button.bo-msb-chip:focus-visible{outline:2px solid var(--primary);outline-offset:2px}

/* ═══════════════════════════════════════════════════════════════════
   State selector widget — mobile + desktop
   ═══════════════════════════════════════════════════════════════════ */
.bo-sb-state-widget{position:relative;display:inline-flex;align-items:center;gap:10px;max-width:100%}
.bo-sb-state-widget__icon{flex-shrink:0}
.bo-sb-state-widget__text{display:flex;flex-direction:column;min-width:0}
.bo-sb-state-widget__label{font-family:var(--mono);font-size:9px;letter-spacing:0.06em;text-transform:uppercase;opacity:0.7;line-height:1.4}
.bo-sb-state-widget__value{display:inline-flex;align-items:center;gap:4px;background:none;border:0;padding:2px 0;font-family:var(--sans);font-weight:700;font-size:15px;cursor:pointer;text-align:left;color:inherit;line-height:1.3}
.bo-sb-state-widget__value:hover{text-decoration:underline;text-underline-offset:3px}
.bo-sb-state-widget__value:focus-visible{outline:2px solid var(--primary);outline-offset:3px;border-radius:2px}

.bo-sb-state-widget__menu{position:absolute;top:calc(100% + 8px);left:0;right:auto;margin:0;padding:6px;background:#fff;border:1px solid var(--secondary-20, rgba(0,0,0,0.12));border-radius:10px;box-shadow:0 12px 32px rgba(0,0,0,0.18);z-index:60;min-width:260px;max-height:360px;overflow-y:auto;display:grid;grid-template-columns:1fr 1fr;gap:2px}
.bo-sb-state-widget__menu[hidden]{display:none}
.bo-sb-state-widget__opt{background:none;border:0;padding:8px 10px;font-family:var(--sans);font-size:13px;color:var(--secondary);text-align:left;cursor:pointer;border-radius:6px;line-height:1.2}
.bo-sb-state-widget__opt:hover{background:var(--primary-tint, #f0f5f2)}
.bo-sb-state-widget__opt[aria-selected="true"]{background:var(--primary);color:var(--secondary);font-weight:700}
.bo-sb-state-widget__opt:first-child{grid-column:1/-1;border-bottom:1px solid var(--secondary-20, rgba(0,0,0,0.1));margin-bottom:2px;padding-bottom:10px;font-weight:600}

/* Desktop variant: sit under hero meta, lighter text (on dark bg) */
.bo-sb-state-widget--desktop{margin-top:14px;color:rgba(255,255,255,0.92)}
.bo-sb-state-widget--desktop .bo-sb-state-widget__label{color:rgba(255,255,255,0.7)}
.bo-sb-state-widget--desktop .bo-sb-state-widget__value{color:#fff}

/* Mobile variant: full-width block, looks like original .bo-msb-loc */
.bo-sb-state-widget--mobile{display:flex;width:100%;margin-top:14px;padding:12px 14px;background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.15);border-radius:10px;color:#fff}
.bo-sb-state-widget--mobile .bo-sb-state-widget__label{color:rgba(255,255,255,0.7)}
.bo-sb-state-widget--mobile .bo-sb-state-widget__value{color:#fff}
.bo-sb-state-widget--mobile .bo-sb-state-widget__menu{left:-1px;right:-1px;min-width:0;max-height:300px}

@media (max-width:540px){
	.bo-sb-state-widget__menu{grid-template-columns:1fr;min-width:240px}
}

/* Empty state (all books filtered out for current state) */
.bo-sb-empty{text-align:center;padding:48px 20px;background:var(--paper);border:1px dashed var(--secondary-20);border-radius:12px;margin-top:20px}
.bo-sb-empty[hidden]{display:none}
.bo-sb-empty-icon{font-size:32px;margin-bottom:10px}
.bo-sb-empty-title{font-family:var(--sans);font-weight:800;font-size:18px;color:var(--secondary);margin-bottom:8px}
.bo-sb-empty-body{font-family:var(--sans);font-size:14px;line-height:1.5;color:var(--secondary-80, rgba(0,0,0,0.7));max-width:440px;margin:0 auto 16px}
.bo-sb-empty-reset{background:var(--primary);color:var(--secondary);border:0;padding:10px 18px;border-radius:6px;font-family:var(--sans);font-weight:700;font-size:13px;cursor:pointer}
.bo-sb-empty-reset:hover{box-shadow:0 4px 12px rgba(51,204,112,0.30)}

.bo-sb-ranking{padding:40px 24px;background:var(--paper)}
.bo-sb-ranking-inner{max-width:none;margin:0}
.bo-sb-ranking-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.bo-sb-ranking-grid .bo-sb-card{margin-bottom:0}

/* Upscale the shared card for desktop variant. */
.bo-sb-card--desktop .bo-sb-rank{flex:0 0 68px}
.bo-sb-card--desktop .bo-sb-rank-n{font-size:28px}
.bo-sb-card--desktop .bo-sb-name{font-size:18px}
.bo-sb-card--desktop .bo-sb-promo{font-size:15px}
.bo-sb-card--desktop .bo-sb-claim{padding:11px 18px;font-size:12px}

.bo-sb-compare-sec{padding:48px 24px;background:#fff}

/* ═══════════════════════════════════════════════════════════════════
   COMPARE WIDGET — on-page, inline matrix (2026-04-19 redesign)
   Lives on /sportsbooks/ and /betting-tools/compare-sportsbooks/.
   Inspired by the site DA: dark band, green accents, mono-family labels.
   ═══════════════════════════════════════════════════════════════════ */
.bo-sb-compare-widget{background:var(--secondary);color:#fff;padding:40px 24px}
.bo-sb-compare-widget__inner{max-width:none;margin:0}
.bo-sb-compare-widget__hd{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:22px;flex-wrap:wrap}
.bo-sb-compare-widget__hd-main{display:flex;align-items:flex-start;gap:14px;flex:1;min-width:0}
.bo-sb-compare-widget__icon{width:40px;height:40px;border-radius:10px;background:rgba(51,204,112,0.14);color:var(--primary);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.bo-sb-compare-widget__title{font-family:var(--sans);font-weight:800;font-size:clamp(22px,2.2vw,30px);letter-spacing:-0.02em;color:#fff;margin:0 0 4px;line-height:1.15}
.bo-sb-compare-widget .bo-sb-compare-widget__sub,
body .bo-sb-compare-widget__sub{font-family:var(--sans);font-size:14px;line-height:1.5;color:#fff !important;margin:0;max-width:560px}
.bo-sb-compare-widget__status{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--primary);background:rgba(51,204,112,0.12);border:1px solid rgba(51,204,112,0.25);padding:8px 12px;border-radius:999px;white-space:nowrap;align-self:flex-start}

/* Chip selector */
.bo-sb-compare-widget__chips{display:flex;gap:8px;flex-wrap:wrap;padding-bottom:22px;border-bottom:1px solid rgba(255,255,255,0.1);margin-bottom:22px}
.bo-sb-compare-widget__chip{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.14);border-radius:999px;font-family:var(--sans);font-size:13px;font-weight:600;color:#fff;cursor:pointer;line-height:1;transition:background .15s,border-color .15s,opacity .15s,transform .1s}
.bo-sb-compare-widget__chip:hover{background:rgba(255,255,255,0.1);border-color:rgba(255,255,255,0.25)}
.bo-sb-compare-widget__chip:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.bo-sb-compare-widget__chip-logo{width:24px;height:24px;border-radius:50%;object-fit:contain;background:#fff;padding:3px;flex-shrink:0}
.bo-sb-compare-widget__chip-logo--initials{display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:9px;font-weight:800;padding:0}
.bo-sb-compare-widget__chip-state{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:rgba(255,255,255,0.12);font-family:var(--mono);font-weight:800;font-size:11px;color:rgba(255,255,255,0.65);flex-shrink:0;transition:background .15s,color .15s}
.bo-sb-compare-widget__chip--active{background:var(--primary);border-color:var(--primary);color:var(--secondary)}
.bo-sb-compare-widget__chip--active .bo-sb-compare-widget__chip-state{background:var(--secondary);color:var(--primary)}
.bo-sb-compare-widget__chip--capped{opacity:0.35;cursor:not-allowed}

/* Body: empty state + rendered matrix */
.bo-sb-compare-widget__body{min-height:200px;position:relative}
.bo-sb-compare-widget__empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:48px 20px;text-align:center;background:rgba(255,255,255,0.03);border:1px dashed rgba(255,255,255,0.15);border-radius:14px}
.bo-sb-compare-widget__empty[hidden]{display:none}
.bo-sb-compare-widget__empty-illu{color:rgba(255,255,255,0.28)}
.bo-sb-compare-widget__empty-text{display:flex;flex-direction:column;gap:4px}
.bo-sb-compare-widget__empty-text strong{font-family:var(--sans);font-weight:800;font-size:18px;color:#fff;letter-spacing:-0.01em}
.bo-sb-compare-widget__empty-text span{font-family:var(--sans);font-size:14px;color:rgba(255,255,255,0.65)}
.bo-sb-compare-widget__empty-link{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--primary);text-decoration:none;padding:6px 10px;border-radius:4px;margin-top:6px}
.bo-sb-compare-widget__empty-link:hover{text-decoration:underline;text-underline-offset:3px}

/* Injected matrix container — puts the PHP-rendered matrix on a lighter
   panel so it contrasts against the dark widget band. */
.bo-sb-compare-widget__rendered{background:var(--paper);border-radius:16px;padding:24px;margin-top:8px;animation:bo-cmp-fade .25s ease-out}
.bo-sb-compare-widget__rendered.is-loading{opacity:0.55;position:relative}
.bo-sb-compare-widget__rendered.is-loading::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.35),transparent);animation:bo-cmp-shine 1.2s infinite}
@keyframes bo-cmp-fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@keyframes bo-cmp-shine{from{transform:translateX(-100%)}to{transform:translateX(100%)}}

/* Scope the matrix's header so it fits inside the widget (no need for
   its own hero — widget header already introduces it). */
.bo-sb-compare-widget__rendered .bo-sb-cmp-hd{display:none}
.bo-sb-compare-widget__rendered .bo-sb-cmp-table-wrap{background:#fff}

/* Mobile variant */
.bo-sb-compare-widget--mobile{padding:24px 16px}
.bo-sb-compare-widget--mobile .bo-sb-compare-widget__title{font-size:18px}
.bo-sb-compare-widget--mobile .bo-sb-compare-widget__sub{font-size:13px}
.bo-sb-compare-widget--mobile .bo-sb-compare-widget__hd{flex-wrap:nowrap}
.bo-sb-compare-widget--mobile .bo-sb-compare-widget__rendered{padding:14px 10px}

@media (max-width:767px){
	.bo-sb-compare-widget{padding:28px 14px}
	.bo-sb-compare-widget__hd{flex-direction:column;gap:12px}
	.bo-sb-compare-widget__status{align-self:flex-start}
	.bo-sb-compare-widget__rendered{padding:14px}
}
.bo-sb-compare-inner{
	max-width:none;margin:0;
	background:var(--secondary);color:#fff;border-radius:18px;padding:32px;
	display:grid;grid-template-columns:1fr 1.3fr;gap:32px;align-items:center
}
.bo-sb-compare-left{display:flex;gap:16px}
.bo-sb-compare-title{
	margin:0 0 6px;font-family:var(--sans);font-weight:800;font-size:26px;
	letter-spacing:-0.02em;color:#fff
}
.bo-sb-compare-sub{margin:0;font-size:14px;color:rgba(255,255,255,0.6);line-height:1.5}
.bo-sb-compare-right{display:flex;flex-direction:column;gap:14px}
.bo-sb-compare-right .bo-msb-compare-chips{margin:0}
.bo-sb-compare-right .bo-msb-compare-chip{padding:6px 10px 6px 6px}
.bo-sb-compare-right .bo-msb-logo--xs{width:22px;height:22px;font-size:9px}
.bo-sb-compare-right .bo-sb-compare-cta{align-self:flex-start;padding:12px 22px;border-radius:10px;font-size:13px}

.bo-sb-compare-cta{
	display:inline-flex !important;align-items:center;justify-content:center;gap:8px;
	background:var(--primary) !important;color:var(--secondary) !important;
	padding:14px 28px !important;border-radius:999px !important;
	font-family:var(--sans) !important;font-weight:700 !important;font-size:13px !important;
	letter-spacing:0.04em !important;text-transform:none !important;text-decoration:none !important;
	border:0 !important;cursor:pointer !important;pointer-events:auto !important;
	box-shadow:0 4px 14px rgba(51,204,112,0.22) !important;
	transition:transform .12s,box-shadow .15s,filter .15s !important
}
.bo-sb-compare-cta:hover{transform:translateY(-1px) !important;box-shadow:0 6px 18px rgba(51,204,112,0.4) !important;color:var(--secondary) !important;text-decoration:none !important}
/* Disabled state — paper chip outline, secondary-60 text, no shadow. */
.bo-sb-compare-cta--disabled,
.bo-sb-compare-cta--disabled:hover{
	background:var(--paper) !important;color:var(--secondary-60) !important;
	border:1.5px solid var(--secondary-20) !important;
	box-shadow:none !important;pointer-events:none !important;cursor:not-allowed !important;
	transform:none !important;filter:none !important;opacity:1 !important
}
/* Picker CTA variant — stretch full width of the chip row on standalone pages. */
.bo-sb-compare-picker__cta{display:flex !important;max-width:360px;margin:0 auto;width:100%}

.bo-sb-methodology{padding:48px 24px;background:var(--paper)}
.bo-sb-methodology-inner{max-width:none;margin:0}
.bo-sb-pillars-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:16px}
.bo-sb-pillar-card{
	background:#fff;border:1px solid var(--secondary-20);border-radius:12px;padding:20px;
	display:flex;flex-direction:column;gap:6px
}
.bo-sb-pillar-card .bo-sb-pillar-v{
	font-family:var(--sans);font-weight:800;font-size:32px;
	color:var(--primary);letter-spacing:-0.02em;line-height:1
}
.bo-sb-pillar-card .bo-sb-pillar-k{
	font-family:var(--sans);font-weight:700;font-size:14px;color:var(--secondary)
}
.bo-sb-pillar-card .bo-sb-pillar-desc{font-family:var(--mono);font-size:10px;color:var(--secondary-60);line-height:1.4}

.bo-sb-disclaimer{padding:24px;background:var(--secondary-dark);color:rgba(255,255,255,0.6)}
.bo-sb-disclaimer-inner{
	max-width:none;margin:0;
	font-family:var(--mono);font-size:11px;line-height:1.6;letter-spacing:0.02em
}
.bo-sb-disclaimer-inner a{color:var(--primary)}

@media (max-width:1023px){
	.bo-sb-hero-inner{grid-template-columns:1fr;gap:28px}
	.bo-sb-ranking-grid{grid-template-columns:1fr}
	.bo-sb-compare-inner{grid-template-columns:1fr;gap:20px}
	.bo-sb-pillars-grid{grid-template-columns:repeat(2,1fr)}
}

/* ════════════════════════════════════════════════════════════════════
   EXPERTS CPT — single-experts.php template
   Port of /design-midfi/author-desktop-mobile-src.html (desktop + mobile)
   ════════════════════════════════════════════════════════════════════ */

.bo-expert{background:#fff;color:var(--secondary)}
.hide-mobile{display:inline}
.hide-desktop{display:none}
@media (max-width:767px){
	.hide-mobile{display:none !important}
	.hide-desktop{display:inline}
}

/* ─── Hero band (dark) ──────────────────────────── */
.bo-exp-hero{background:var(--secondary);color:#fff;padding:30px 36px 26px}
.bo-exp-hero-inner{max-width:1440px;margin:0 auto;display:grid;grid-template-columns:auto 1fr auto;gap:28px;align-items:center}
.bo-exp-avatar{
	width:120px;height:120px;border-radius:50%;
	background:var(--secondary-dark);border:4px solid var(--primary);
	display:flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-size:40px;font-weight:800;color:var(--primary);
	flex-shrink:0;background-size:cover;background-position:center
}
.bo-exp-avatar--photo{color:transparent}
.bo-exp-avatar--photo .sr-only{position:absolute;clip:rect(0,0,0,0)}
.bo-exp-hero-tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.bo-exp-chip{
	font-family:var(--mono);font-size:9px;font-weight:700;
	padding:3px 7px;border-radius:3px;letter-spacing:0.08em;text-transform:uppercase;
	background:rgba(255,255,255,0.10);color:#fff;border:1px solid rgba(255,255,255,0.2)
}
.bo-exp-chip--solid{background:var(--primary);color:var(--secondary);border:none;font-weight:800}
.bo-exp-hero-name{
	font-family:var(--sans);font-weight:800;font-size:44px;letter-spacing:-0.02em;
	line-height:1;margin:0 0 8px;color:#fff
}
/* OceanWP's heading color token repaints h1 in var(--e-global-color-text)
   by default — boost specificity to keep the expert name white on the dark
   hero. Same crush strategy as .bo-dsb-hero-title (v2.44.1). */
html body .bo-exp-hero h1.bo-exp-hero-name,
html body .bo-expert .bo-exp-hero-name,
body.oceanwp-theme .bo-exp-hero-name{color:#fff !important}
.bo-exp-hero-tagline,
.bo-exp-hero p.bo-exp-hero-tagline{
	font-size:14px;color:rgba(255,255,255,0.7) !important;margin:0 0 12px;max-width:580px;line-height:1.5
}
.bo-exp-hero-meta{
	display:flex;gap:14px;align-items:center;font-size:11px;color:rgba(255,255,255,0.55);
	font-family:var(--mono);flex-wrap:wrap
}
.bo-exp-hero-meta b{color:#fff}
.bo-exp-hero-meta .sep{opacity:0.4}
.bo-exp-hero-cta{display:flex;flex-direction:column;gap:6px;min-width:180px}
/* Button base — `!important` on bg/color/border to beat Elementor & OceanWP
   default button styles which otherwise inject red/blue into our CTAs. */
.bo-expert .bo-exp-btn,
button.bo-exp-btn{
	padding:10px 18px !important;border-radius:6px !important;
	font-family:var(--sans) !important;font-weight:700 !important;font-size:12px !important;
	cursor:pointer;letter-spacing:0.02em;transition:transform .1s,box-shadow .15s;
	border:none !important
}
.bo-expert .bo-exp-btn--primary,
button.bo-exp-btn--primary{
	background:var(--primary) !important;color:#fff !important
}
.bo-expert .bo-exp-btn--primary:hover{
	transform:translateY(-1px);
	background:var(--primary-60) !important;
	box-shadow:0 4px 12px rgba(51,204,112,0.30)
}
.bo-expert .bo-exp-btn--outline,
button.bo-exp-btn--outline{
	background:rgba(255,255,255,0.1) !important;color:#fff !important;
	border:1px solid rgba(255,255,255,0.25) !important
}
.bo-expert .bo-exp-btn--outline:hover{background:rgba(255,255,255,0.18) !important}
.bo-expert .bo-exp-btn--ghost,
button.bo-exp-btn--ghost{
	background:transparent !important;color:rgba(255,255,255,0.6) !important;
	border:1px solid rgba(255,255,255,0.15) !important;
	padding:8px 18px !important;font-size:11px !important;font-weight:600 !important
}
.bo-expert .bo-exp-btn--ghost:hover{color:#fff !important;border-color:rgba(255,255,255,0.3) !important}

/* ─── Stat ribbon ──────────────────────────────── */
.bo-exp-ribbon{
	background:var(--paper);border-bottom:1px solid var(--secondary-20);
	display:grid;grid-template-columns:repeat(5,1fr);max-width:1440px;margin:0 auto
}
.bo-exp-ribbon-cell{padding:18px 16px;border-right:1px solid var(--secondary-20)}
.bo-exp-ribbon-cell:last-child{border-right:0}
.bo-exp-ribbon-lbl{
	font-family:var(--mono);font-size:9px;color:var(--secondary-60);
	letter-spacing:0.08em;margin-bottom:5px;text-transform:uppercase
}
.bo-exp-ribbon-val{
	font-family:var(--sans);font-weight:800;font-size:24px;color:var(--secondary);
	letter-spacing:-0.015em
}
.bo-exp-ribbon-sub{
	font-family:var(--mono);font-size:9px;color:var(--primary);letter-spacing:0.04em;
	font-weight:600;margin-top:3px
}

/* ─── Hot-streak strip (mobile only) ───────────── */
.bo-exp-streak-strip{
	background:#FFF4E8;padding:10px 20px;display:flex;align-items:center;gap:10px;
	border-bottom:1px solid var(--secondary-20)
}
.bo-exp-streak-icon{font-size:20px}
.bo-exp-streak-body{flex:1}
.bo-exp-streak-kicker{font-family:var(--mono);font-size:9px;color:#A07010;letter-spacing:0.08em;font-weight:700}
.bo-exp-streak-line{font-size:12px;color:var(--secondary);font-weight:600}
.bo-exp-streak-arrow{font-family:var(--mono);font-size:11px;color:var(--primary);font-weight:700}

/* ─── 2-col body ───────────────────────────────── */
.bo-exp-grid{
	max-width:1440px;margin:0 auto;padding:32px 36px;
	display:grid;grid-template-columns:1fr 280px;gap:32px
}
.bo-exp-main{min-width:0}

.bo-exp-accent-head{
	border-top:3px solid var(--secondary);padding-top:14px;
	display:flex;align-items:baseline;justify-content:space-between;gap:18px;
	margin-bottom:18px;flex-wrap:wrap
}
.bo-exp-accent-head h2{
	font-family:var(--sans);font-weight:800;font-size:20px;margin:0;
	letter-spacing:-0.01em;color:var(--secondary)
}
.bo-exp-accent-head p{font-size:12px;color:var(--secondary-60);margin:0}
.bo-exp-meta{
	font-family:var(--mono);font-size:10px;color:var(--secondary-60);
	letter-spacing:0.06em;text-transform:uppercase
}

/* ─── Background cards (Experience + Credentials) ─ */
.bo-exp-bg-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:32px}
.bo-exp-bg-card{background:var(--paper);border-radius:10px;padding:20px}
.bo-exp-timeline{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.bo-exp-timeline li{display:flex;gap:10px;align-items:flex-start}
.bo-exp-dot{width:7px;height:7px;border-radius:50%;background:var(--secondary-60);margin-top:6px;flex-shrink:0}
.bo-exp-dot.is-current{background:var(--primary)}
.bo-exp-timeline-org{font-size:13px;font-weight:700;color:var(--secondary)}
.bo-exp-timeline-role{font-size:11px;color:var(--secondary-60)}
.bo-exp-timeline-range{
	font-family:var(--mono);font-size:9px;color:var(--secondary-60);
	margin-top:2px;letter-spacing:0.04em
}
.bo-exp-creds{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px;font-size:12px;line-height:1.4;color:var(--secondary)}
.bo-exp-creds li{display:flex;gap:6px;align-items:flex-start}
.bo-exp-cred-icon{flex-shrink:0;font-size:14px;line-height:1}
.bo-exp-creds b{font-weight:700}

/* ─── Specialty bars ───────────────────────────── */
.bo-exp-spec-card{background:#fff;border:1px solid var(--secondary-20);border-radius:10px;padding:20px;margin-bottom:32px}
.bo-exp-spec-row{margin-bottom:14px}
.bo-exp-spec-row:last-child{margin-bottom:0}
.bo-exp-spec-row-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:6px;gap:14px}
.bo-exp-spec-row-title{font-size:13px;font-weight:700;color:var(--secondary);line-height:1.2}
.bo-exp-spec-row-num{text-align:right}
.bo-exp-spec-row-score{
	font-family:var(--mono);font-size:20px;font-weight:800;color:var(--primary);line-height:1
}
.bo-exp-spec-bar{height:5px;background:var(--secondary-20);border-radius:3px;overflow:hidden}
.bo-exp-spec-bar > span{display:block;height:100%;background:var(--primary);border-radius:3px}

/* ─── Performance ledger ───────────────────────── */
.bo-exp-perf-card{background:#fff;border:1px solid var(--secondary-20);border-radius:10px;padding:20px;margin-bottom:32px}
.bo-exp-perf-range{display:flex;gap:16px;margin-bottom:16px;align-items:center}
.bo-exp-perf-pill{
	padding:3px 9px;border-radius:999px;background:var(--paper);color:var(--secondary);
	font-family:var(--mono);font-size:10px;font-weight:700;cursor:pointer
}
.bo-exp-perf-pill.is-active{background:var(--secondary);color:#fff}
.bo-exp-perf-chart{width:100%;height:200px;display:block}
.bo-exp-perf-stats{
	display:grid;grid-template-columns:repeat(4,1fr);gap:14px;
	padding-top:14px;border-top:1px solid var(--secondary-20);margin-top:10px
}
.bo-exp-perf-stat-val{
	font-family:var(--sans);font-weight:800;font-size:16px;color:var(--secondary);margin-top:3px
}

/* ─── Recent content grid ─────────────────────── */
.bo-exp-rc-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:32px}
.bo-exp-rc-card{
	background:#fff;border:1px solid var(--secondary-20);border-radius:10px;padding:14px;
	display:flex;gap:12px;align-items:flex-start;cursor:pointer;
	text-decoration:none;color:inherit;transition:border-color .15s,transform .1s
}
.bo-exp-rc-card:hover{border-color:var(--primary);transform:translateY(-2px)}
.bo-exp-rc-thumb{
	width:56px;height:56px;border-radius:8px;flex-shrink:0;
	display:flex;align-items:center;justify-content:center;
	font-family:var(--mono);font-size:10px;font-weight:800;letter-spacing:0.06em
}
.bo-exp-rc-body{flex:1;min-width:0}
.bo-exp-rc-kicker{display:flex;gap:6px;align-items:center;margin-bottom:4px}
.bo-exp-rc-cat{
	font-family:var(--mono);font-size:8px;padding:2px 5px;border-radius:3px;
	letter-spacing:0.06em;font-weight:800
}
.bo-exp-rc-title{font-size:12px;font-weight:700;line-height:1.3;margin-bottom:6px;color:var(--secondary)}
.bo-exp-rc-foot{display:flex;justify-content:space-between;align-items:center}

/* ─── Right sidebar ───────────────────────────── */
.bo-exp-side{display:flex;flex-direction:column;gap:16px}
.bo-exp-side-card{background:#fff;border:1px solid var(--secondary-20);border-radius:12px;padding:16px}
.bo-exp-side-cta{
	background:var(--secondary);color:#fff;border-radius:12px;padding:18px;
	position:relative;overflow:hidden
}
.bo-exp-side-cta::after{
	content:"";position:absolute;top:-10px;right:-10px;width:90px;height:90px;border-radius:50%;
	background:var(--primary);opacity:0.18
}
.bo-exp-side-cta-kicker{color:var(--primary);letter-spacing:0.12em;margin-bottom:6px;position:relative}
.bo-exp-side-cta h3{
	font-family:var(--sans);font-weight:800;font-size:17px;line-height:1.15;
	margin:0 0 6px;position:relative;color:#fff
}
.bo-exp-side-cta p,
.bo-expert .bo-exp-side-cta p{font-size:11px;color:rgba(255,255,255,0.7) !important;margin:0 0 12px;line-height:1.5;position:relative}
.bo-exp-side-cta .bo-exp-btn{position:relative;padding:10px}

/* Socials list */
.bo-exp-side-socials{display:flex;flex-direction:column;gap:6px;margin-top:12px}
.bo-exp-side-soc{
	display:flex;align-items:center;gap:10px;padding:8px;background:var(--paper);
	border-radius:8px;text-decoration:none;color:inherit;transition:background .15s
}
.bo-exp-side-soc:hover{background:var(--secondary-20)}
.bo-exp-side-soc-icon{
	width:30px;height:30px;border-radius:6px;color:#fff;flex-shrink:0;
	display:flex;align-items:center;justify-content:center;
	font-family:var(--mono);font-size:11px;font-weight:800
}
.bo-exp-side-soc-body{flex:1;min-width:0}
.bo-exp-side-soc-h{font-size:12px;font-weight:700;color:var(--secondary)}
.bo-exp-side-soc-f{font-family:var(--mono);font-size:9px;color:var(--secondary-60)}
.bo-exp-side-soc-arrow{color:var(--primary);font-family:var(--mono);font-size:11px;font-weight:700}

/* CI widget */
.bo-exp-ci{display:flex;gap:14px;align-items:center;margin:12px 0 12px}
.bo-exp-ci-dial{
	width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0
}
.bo-exp-ci-dial > span{
	width:50px;height:50px;border-radius:50%;background:#fff;
	display:flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-size:17px;font-weight:800;color:var(--secondary)
}
.bo-exp-ci-title{font-size:12px;font-weight:700;color:var(--secondary);line-height:1.2}
.bo-exp-ci-caption{font-size:10px;color:var(--secondary-60);margin-top:3px;line-height:1.4}
.bo-exp-ci-bars{display:flex;flex-direction:column;gap:6px;font-size:10px}
.bo-exp-ci-bar-row{display:flex;align-items:center;gap:8px}
.bo-exp-ci-bar-lbl{color:var(--secondary-60);width:50px}
.bo-exp-ci-bar-track{flex:1;height:3px;background:var(--secondary-20);border-radius:2px;overflow:hidden}
.bo-exp-ci-bar-track > span{display:block;height:100%;background:var(--primary)}
.bo-exp-ci-bar-val{font-family:var(--mono);font-weight:700;color:var(--secondary);width:22px;text-align:right}

/* Disclosure */
.bo-exp-disclosure{
	padding:14px;background:var(--paper);border:1px dashed var(--secondary-20);
	border-radius:8px;font-size:10px;color:var(--secondary-60);line-height:1.55
}
.bo-exp-disclosure b{color:var(--secondary)}

/* ─── Mobile ──────────────────────────────────── */
@media (max-width:767px){
	.bo-exp-hero{padding:16px 20px 18px}
	.bo-exp-hero-inner{
		grid-template-columns:auto 1fr;gap:16px;grid-template-areas:"avatar body" "cta cta"
	}
	.bo-exp-avatar{width:84px;height:84px;border-width:3px;font-size:26px;grid-area:avatar}
	.bo-exp-hero-body{grid-area:body;min-width:0}
	.bo-exp-hero-cta{grid-area:cta;flex-direction:row;min-width:0;margin-top:4px}
	.bo-exp-hero-cta .bo-exp-btn{flex:1;padding:12px;font-size:14px}
	.bo-exp-hero-name{font-size:26px;margin-bottom:4px}
	.bo-exp-hero-tagline{font-size:13px;color:rgba(255,255,255,0.75);margin:0 0 16px}
	.bo-exp-hero-meta{font-size:10px;gap:6px}

	.bo-exp-ribbon{grid-template-columns:repeat(4,1fr)}
	.bo-exp-ribbon-cell:nth-last-child(1){display:none}
	.bo-exp-ribbon-cell{padding:14px 6px;text-align:center}
	.bo-exp-ribbon-lbl{font-size:8px}
	.bo-exp-ribbon-val{font-size:16px}
	.bo-exp-ribbon-sub{display:none}

	.bo-exp-grid{grid-template-columns:1fr;padding:22px 20px 4px;gap:0}
	.bo-exp-side{margin-top:24px}

	.bo-exp-bg-grid{grid-template-columns:1fr;gap:12px}
	.bo-exp-rc-grid{grid-template-columns:1fr;gap:12px}
	.bo-exp-accent-head h2{font-size:17px}
	.bo-exp-accent-head{border-top-width:2px;padding-top:10px;margin-bottom:12px}
}

@media (max-width:1023px) and (min-width:768px){
	.bo-exp-grid{grid-template-columns:1fr;padding:24px 28px}
	.bo-exp-side{display:grid;grid-template-columns:1fr 1fr;gap:16px}
}

/* ════════════════════════════════════════════════════════════════════
   REGISTER PAGE — /register/  (v2.48.14)
   Hero + 2-col (value props + UsersWP form) + RG band.
   Ports design-midfi/midfi/auth.js. The form card re-skins UsersWP's
   [uwp_register] output — we don't rewrite the plugin's HTML, we just
   target its classes (.uwp-registration-form .uwp_form_row, etc.).
   ════════════════════════════════════════════════════════════════════ */

.bo-register{background:#fff;color:var(--secondary);font-family:var(--sans)}

/* ── Hero ─────────────────────────────────────────────────────── */
.bo-register-hero{
	background:linear-gradient(135deg, var(--secondary) 0%, var(--secondary-dark) 70%);
	color:#fff;padding:56px 24px 48px;position:relative;overflow:hidden
}
.bo-register-hero::before{
	content:'';position:absolute;inset:0;pointer-events:none;
	background:radial-gradient(circle at 85% 0%, rgba(51,204,112,0.15) 0%, transparent 55%)
}
.bo-register-hero__inner{max-width:1200px;margin:0 auto;position:relative}
.bo-register-hero__eyebrow{
	display:inline-block;
	font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.14em;
	color:var(--primary);margin-bottom:12px
}
.bo-register-hero__title{
	font-family:var(--sans);font-weight:800;font-size:48px;line-height:1.05;letter-spacing:-0.02em;
	margin:0 0 14px;color:#fff
}
.bo-register-hero__lead{
	margin:0;color:rgba(255,255,255,0.88);font-size:17px;line-height:1.55;max-width:720px
}
html body .bo-register-hero h1.bo-register-hero__title,
body.oceanwp-theme .bo-register-hero__title{color:#fff !important}
html body .bo-register-hero p.bo-register-hero__lead,
body.oceanwp-theme .bo-register-hero__lead{color:rgba(255,255,255,0.88) !important}

/* ── Body grid ────────────────────────────────────────────────── */
.bo-register-body{padding:56px 24px 32px;background:linear-gradient(180deg,var(--paper) 0%,#fff 60%)}
.bo-register-grid{
	max-width:1200px;margin:0 auto;
	display:grid;grid-template-columns:1fr 480px;gap:56px;align-items:start
}

/* ── Left: value props ────────────────────────────────────────── */
.bo-register-value{padding-top:10px}
.bo-register-value__title{
	font-family:var(--sans);font-weight:800;font-size:28px;line-height:1.15;
	letter-spacing:-0.01em;margin:0 0 22px;color:var(--secondary)
}
.bo-register-value__list{list-style:none;padding:0;margin:0 0 28px;display:flex;flex-direction:column;gap:16px}
.bo-register-value__list li{
	display:flex;gap:14px;align-items:flex-start;
	padding:14px 16px;background:#fff;border:1px solid var(--secondary-20);border-radius:10px
}
.bo-register-value__dot{
	color:var(--primary);font-size:22px;line-height:1;flex-shrink:0;margin-top:-2px
}
.bo-register-value__list li b{
	display:block;font-family:var(--sans);font-weight:800;font-size:15px;color:var(--secondary);margin-bottom:3px
}
.bo-register-value__list li span{
	font-size:13.5px;line-height:1.55;color:var(--secondary-60)
}
html body .bo-register-value__list li span,
body.oceanwp-theme .bo-register-value__list li span{color:var(--secondary-60) !important}

.bo-register-value__proof{
	display:flex;align-items:center;gap:12px;margin-bottom:22px
}
.bo-register-value__stars{color:var(--primary);font-size:20px;letter-spacing:1px}
.bo-register-value__proof b{font-size:15px;color:var(--secondary)}
.bo-register-value__proof-sub{
	font-family:var(--mono);font-size:11px;color:var(--secondary-60);letter-spacing:0.06em
}

.bo-register-value__rg{
	background:rgba(232,169,58,0.08);border:1px solid rgba(232,169,58,0.35);border-left:3px solid var(--warn);
	border-radius:6px;padding:12px 16px;font-size:13px;line-height:1.55;color:var(--secondary-60)
}
.bo-register-value__rg strong{color:var(--secondary)}
.bo-register-value__rg a{color:var(--primary);text-decoration:underline}

/* ── Right: form card ─────────────────────────────────────────── */
.bo-register-card{
	background:#fff;border:1px solid var(--secondary-20);border-left:3px solid var(--primary);
	border-radius:10px;padding:32px 32px 28px;
	position:sticky;top:100px;
	box-shadow:0 10px 28px rgba(26,38,46,0.06)
}
.bo-register-card__title{
	font-family:var(--sans);font-weight:800;font-size:24px;line-height:1.15;
	letter-spacing:-0.01em;margin:0 0 6px;color:var(--secondary);text-align:center
}
.bo-register-card__sub{
	margin:0 0 22px;text-align:center;
	font-family:var(--mono);font-size:11px;letter-spacing:0.06em;color:var(--secondary-60);text-transform:uppercase
}
.bo-register-card__footer{
	margin:20px 0 0;text-align:center;font-size:14px;color:var(--secondary-60);
	padding-top:18px;border-top:1px solid var(--secondary-20)
}
.bo-register-card__footer a{color:var(--primary);font-weight:700;text-decoration:none}
.bo-register-card__footer a:hover{text-decoration:underline}

/* ── UsersWP form re-skin ─────────────────────────────────────── */
/* The plugin renders `.uwp-registration-form` with `.uwp_form_row` children
   (label + input). We re-skin these inside our .bo-register-card wrapper
   without touching plugin code. */

.bo-register-card .uwp-registration-form{margin:0}
.bo-register-card .uwp_form_row,
.bo-register-card .uwp-field-wrap{
	margin-bottom:14px
}
/* Regular field labels (non-checkbox) — sentence case, readable */
.bo-register-card .uwp_form_row:not([class*="checkbox"]) > label,
.bo-register-card .uwp-field-wrap:not([class*="checkbox"]) > label{
	display:block;margin:0 0 6px;
	font-family:var(--sans);font-size:13px;font-weight:600;letter-spacing:0;
	color:var(--secondary);text-transform:none;line-height:1.4
}
.bo-register-card input[type="text"],
.bo-register-card input[type="email"],
.bo-register-card input[type="password"],
.bo-register-card input[type="number"],
.bo-register-card input[type="tel"],
.bo-register-card input[type="url"],
.bo-register-card select,
.bo-register-card textarea{
	width:100%;
	padding:12px 14px;
	background:#fff;border:1.5px solid var(--secondary-20);border-radius:8px;
	font-family:var(--sans);font-size:14px;color:var(--secondary);
	outline:none;transition:border-color .15s ease, box-shadow .15s ease;
	box-sizing:border-box
}
.bo-register-card input:focus,
.bo-register-card select:focus,
.bo-register-card textarea:focus{
	border-color:var(--primary);
	box-shadow:0 0 0 3px rgba(51,204,112,0.15)
}
.bo-register-card input::placeholder{color:var(--secondary-60);opacity:1}
/* Select — don't let browser render it gray/disabled-looking */
.bo-register-card select{
	background-color:#fff;color:var(--secondary);cursor:pointer;
	-webkit-appearance:none;-moz-appearance:none;appearance:none;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='%23707A82' stroke-width='2'%3E%3Cpolyline points='2 2 6 6 10 2'/%3E%3C/svg%3E");
	background-repeat:no-repeat;background-position:right 14px center;
	background-size:11px 7px;padding-right:40px
}

/* Checkboxes — 21+ consent, privacy, marketing */
.bo-register-card input[type="checkbox"]{
	width:18px;height:18px;flex-shrink:0;accent-color:var(--primary);margin:3px 0 0
}
/* Checkbox-row — whole row flex, label sentence-case sans */
.bo-register-card .uwp_form_row_checkbox,
.bo-register-card .uwp_form_row[class*="checkbox"],
.bo-register-card .uwp-field-wrap[class*="checkbox"],
.bo-register-card .form-check{
	display:flex;align-items:flex-start;gap:10px;margin-bottom:10px
}
.bo-register-card .uwp_form_row_checkbox > label,
.bo-register-card .uwp_form_row[class*="checkbox"] > label,
.bo-register-card .uwp-field-wrap[class*="checkbox"] > label,
.bo-register-card .form-check-label{
	display:inline;margin:0;flex:1;
	font-family:var(--sans);font-size:13px;font-weight:500;letter-spacing:0;
	color:var(--secondary);text-transform:none;line-height:1.5;cursor:pointer
}

/* Submit button — UsersWP uses button[type=submit] or input[type=submit] */
.bo-register-card button[type="submit"],
.bo-register-card input[type="submit"]{
	width:100%;padding:14px;
	background:var(--primary);color:var(--secondary);
	border:1.5px solid var(--primary);border-radius:6px;
	font-family:var(--sans);font-weight:800;font-size:13px;letter-spacing:0.08em;text-transform:uppercase;
	cursor:pointer;transition:transform .15s ease, box-shadow .15s ease;
	margin-top:4px
}
.bo-register-card button[type="submit"]:hover,
.bo-register-card input[type="submit"]:hover{
	transform:translateY(-1px);box-shadow:0 6px 16px rgba(51,204,112,0.3)
}

/* Error + success messages */
.bo-register-card .uwp-alert,
.bo-register-card .uwp_message_error,
.bo-register-card .uwp_message_success,
.bo-register-card .alert{
	padding:12px 14px;border-radius:6px;margin:0 0 14px;font-size:13.5px;line-height:1.5
}
.bo-register-card .uwp-alert-error,
.bo-register-card .alert-danger,
.bo-register-card .uwp_message_error{
	background:rgba(217,72,72,0.08);border:1px solid rgba(217,72,72,0.3);color:#8b2020
}
.bo-register-card .uwp-alert-success,
.bo-register-card .alert-success,
.bo-register-card .uwp_message_success{
	background:rgba(51,204,112,0.08);border:1px solid rgba(51,204,112,0.35);color:#1e6b3a
}
.bo-register-card .uwp-alert-info,
.bo-register-card .alert-info{
	background:var(--paper);border:1px solid var(--secondary-20);color:var(--secondary)
}

/* Required asterisks in blue-green */
.bo-register-card .uwp_required,
.bo-register-card .required{color:var(--danger);font-weight:700}

/* ── RG band at bottom ───────────────────────────────────────── */
.bo-register-rgband{
	background:var(--secondary);color:rgba(255,255,255,0.85);
	padding:24px 24px;border-top:1px solid var(--secondary-dark)
}
.bo-register-rgband__inner{
	max-width:1200px;margin:0 auto;
	display:flex;gap:14px;align-items:center;flex-wrap:wrap
}
.bo-register-rgband__age{
	flex-shrink:0;
	background:rgba(255,255,255,0.12);border:1px solid rgba(255,255,255,0.3);
	color:#fff;padding:4px 10px;border-radius:4px;
	font-family:var(--mono);font-weight:800;font-size:11px;letter-spacing:0.08em
}
.bo-register-rgband p{
	flex:1;min-width:0;margin:0;
	font-size:13px;line-height:1.55;color:inherit
}
.bo-register-rgband a{color:#fff;text-decoration:underline;text-underline-offset:2px}
.bo-register-rgband a:hover{color:var(--primary)}
html body .bo-register-rgband p,
body.oceanwp-theme .bo-register-rgband p{color:rgba(255,255,255,0.85) !important}

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width:960px){
	.bo-register-hero{padding:36px 20px 32px}
	.bo-register-hero__title{font-size:32px}
	.bo-register-hero__lead{font-size:15px}
	.bo-register-body{padding:36px 20px 24px}
	.bo-register-grid{grid-template-columns:1fr;gap:28px}
	.bo-register-value__title{font-size:22px}
	.bo-register-card{position:static;padding:24px 22px 22px}
	.bo-register-card__title{font-size:20px}
}

/* ════════════════════════════════════════════════════════════════════
   ACCOUNT DASHBOARD — /account/  (v2.48.16)
   Reuses .bo-register-hero + .bo-register-rgband. Adds dashboard grid
   (UsersWP [uwp_account] card + quick-actions sidebar).
   ════════════════════════════════════════════════════════════════════ */

/* Hero meta row (member since, email) */
.bo-account-hero__meta{
	margin-top:14px;font-family:var(--mono);font-size:12px;letter-spacing:0.03em;
	color:rgba(255,255,255,0.7);display:flex;gap:10px;flex-wrap:wrap;align-items:center
}
.bo-account-hero__meta b{color:#fff;font-weight:700}
.bo-account-hero__meta .sep{opacity:0.4}

/* Body — full-width single card (UsersWP has its own internal sidebar) */
.bo-account-body{
	padding:48px 24px 32px;
	background:linear-gradient(180deg,var(--paper) 0%,#fff 60%)
}
.bo-account-card{
	max-width:1200px;margin:0 auto;
	background:#fff;border:1px solid var(--secondary-20);border-left:3px solid var(--primary);
	border-radius:10px;padding:32px;
	box-shadow:0 10px 28px rgba(26,38,46,0.06);
	min-height:500px
}

/* ─ UsersWP [uwp_account] re-skin ───────────────────────────────
   UsersWP (bootstrap variant) emits this structure:
     .container > .row > .col-lg-3 (sidebar) + .col-lg-9 (content)
   Inside the sidebar:
     .navbar-light > .bg-light > (avatar, @username, nav menu)

   Two things to fix:
   1. Bootstrap `.container` has default max-width:1140px — cap below
      our .bo-account-card 1200px → force 100% so we can use the full
      width the parent card gives us.
   2. `.row > .col-lg-*` is a Bootstrap flex grid at ≥992px — convert
      to a custom 260px | 1fr grid for predictable sizing. */

/* Kill container cap + Bootstrap gutters */
.bo-account-card .container,
.bo-account-card .container-fluid,
.bo-account-card .uwp-content-wrap{
	max-width:100% !important;width:100%;padding:0 !important;margin:0
}

/* Row → custom grid (beats Bootstrap .row flex) */
.bo-account-card .row{
	display:grid !important;
	grid-template-columns:260px 1fr;gap:32px;
	margin:0;width:100%;align-items:start
}

/* Columns — neutralise Bootstrap flex-basis + padding */
.bo-account-card [class^="col-"],
.bo-account-card [class*=" col-"]{
	flex:none;width:auto;max-width:none;padding:0 !important
}

/* Older non-bootstrap markup — keep a fallback in case the theme
   switches variant */
.bo-account-card .uwp-account-page,
.bo-account-card .uwp-account-form-page{
	display:grid;grid-template-columns:260px 1fr;gap:32px;align-items:start
}

/* Bootstrap `.bg-light` sidebar wrapper — our re-skin */
.bo-account-card .bg-light{
	background:var(--paper) !important;
	border:1px solid var(--secondary-20);border-radius:10px;
	padding:24px 18px !important
}
.bo-account-card .navbar-light{padding:0;margin:0}
.bo-account-card .navbar-light .bg-light{padding:24px 18px !important}
/* Remove Bootstrap's huge top padding on the sidebar */
.bo-account-card .pt-5{padding-top:0 !important}

/* Sidebar avatar (rendered by [uwp_user_avatar size=150 allow_change=1]) */
.bo-account-card .uwp-profile-avatar img,
.bo-account-card .uwp-profile-avatar-image img,
.bo-account-card .uwp-avatar-wrap img,
.bo-account-card .bg-light img.avatar,
.bo-account-card .bg-light img[src*="gravatar"]{
	width:96px !important;height:96px !important;border-radius:50% !important;
	border:3px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,0.08);
	margin:0 auto 14px !important;display:block;object-fit:cover
}

/* Username button (rendered via aui()->button, becomes an <a class="btn">) */
.bo-account-card .bg-light > .d-flex .btn,
.bo-account-card .bg-light a.btn.font-weight-bold{
	background:transparent !important;border:0 !important;padding:0 !important;
	font-family:var(--sans) !important;font-weight:800 !important;font-size:17px !important;
	color:var(--primary) !important;letter-spacing:-0.01em !important;
	text-decoration:none !important;margin:0 0 18px !important;
	box-shadow:none !important
}

/* Nav menu wrapper — remove Bootstrap flex-centred layout */
.bo-account-card .bg-light .nav,
.bo-account-card .navbar-light .nav{
	display:flex !important;flex-direction:column;gap:2px;
	margin:0 !important;padding:0;list-style:none;width:100%;
	justify-content:flex-start !important
}

/* Content right pane — strip Bootstrap pl-lg-4 pt-5 etc. */
.bo-account-card .col-lg-9 > div,
.bo-account-card .col-lg-9 .pl-lg-4,
.bo-account-card .col-lg-9 .pt-5{
	padding:0 !important
}
.bo-account-card .col-lg-9 h3:first-of-type{
	font-family:var(--sans);font-weight:800;font-size:22px;color:var(--secondary);
	margin:0 0 20px;letter-spacing:-0.01em
}

/* ── Sidebar (avatar + username + vertical tabs) ─────────── */
.bo-account-card .uwp-account-sidebar,
.bo-account-card .uwp_account_sidebar,
.bo-account-card .uwp-profile-sidebar{
	background:var(--paper);border:1px solid var(--secondary-20);
	border-radius:10px;padding:24px 20px;text-align:center;
	position:sticky;top:100px
}
/* Avatar */
.bo-account-card .uwp-avatar-img,
.bo-account-card .uwp_profile_avatar img,
.bo-account-card .uwp-profile-avatar img,
.bo-account-card .avatar{
	width:96px;height:96px;border-radius:50%;
	border:3px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,0.1);
	object-fit:cover;margin:0 auto 14px;display:block
}
/* Username */
.bo-account-card .uwp-sidebar-title,
.bo-account-card .uwp_account_username,
.bo-account-card .uwp-profile-username,
.bo-account-card h3.uwp-title{
	font-family:var(--sans);font-weight:800;font-size:17px;color:var(--primary);
	margin:0 0 18px;padding:0;letter-spacing:-0.01em;text-align:center
}
/* Vertical tabs */
.bo-account-card .uwp-account-tabs,
.bo-account-card .uwp_account_tabs,
.bo-account-card .uwp-tabs,
.bo-account-card nav.uwp-account-nav ul,
.bo-account-card .uwp_tabs_list{
	list-style:none;padding:0;margin:0;
	display:flex;flex-direction:column;gap:2px;
	border-bottom:0
}
.bo-account-card .uwp-account-tabs li,
.bo-account-card .uwp_account_tabs li,
.bo-account-card .uwp-tabs li,
.bo-account-card .uwp_tabs_list li,
.bo-account-card nav.uwp-account-nav li{margin:0;padding:0;display:block;width:100%}
.bo-account-card .uwp-account-tabs li a,
.bo-account-card .uwp_account_tabs li a,
.bo-account-card .uwp-tabs li a,
.bo-account-card .uwp_tabs_list li a,
.bo-account-card nav.uwp-account-nav li a{
	display:flex;align-items:center;gap:10px;
	padding:11px 14px;
	font-family:var(--sans);font-size:13.5px;font-weight:600;letter-spacing:0;
	color:var(--secondary-60);text-decoration:none;
	border-radius:6px;border:0;
	transition:background .15s ease, color .15s ease
}
.bo-account-card .uwp-account-tabs li a:hover,
.bo-account-card .uwp_account_tabs li a:hover,
.bo-account-card .uwp-tabs li a:hover,
.bo-account-card .uwp_tabs_list li a:hover,
.bo-account-card nav.uwp-account-nav li a:hover{
	background:#fff;color:var(--secondary)
}
.bo-account-card .uwp-account-tabs li.active a,
.bo-account-card .uwp-account-tabs li.uwp-tab-active a,
.bo-account-card .uwp_account_tabs li.active a,
.bo-account-card .uwp_tabs_list li.active a,
.bo-account-card .uwp_tabs_list li.uwp-tab-active a,
.bo-account-card nav.uwp-account-nav li.active a,
.bo-account-card .uwp-tabs-nav .active{
	background:rgba(51,204,112,0.08);color:var(--primary);font-weight:700
}

/* Logout row — last tab, danger accent */
.bo-account-card .uwp-account-tabs li a[href*="logout"],
.bo-account-card .uwp_account_tabs li a[href*="logout"],
.bo-account-card .uwp_tabs_list li a[href*="logout"],
.bo-account-card nav.uwp-account-nav li a[href*="logout"],
.bo-account-card a[href*="wp-login.php?action=logout"]{
	color:var(--danger);margin-top:4px;
	border-top:1px solid var(--secondary-20);border-radius:0;padding-top:16px
}
.bo-account-card .uwp_tabs_list li a[href*="logout"]:hover{
	background:rgba(217,72,72,0.06);color:#8b2020
}

/* ── Right pane: active-tab content ─────────────────────── */
.bo-account-card .uwp-account-content,
.bo-account-card .uwp-tab-content,
.bo-account-card .uwp_account_content,
.bo-account-card .uwp-form-area,
.bo-account-card .tab-content{
	min-width:0
}
/* Top of content: form title */
.bo-account-card .uwp-account-content h2,
.bo-account-card .uwp-account-content h3:first-of-type,
.bo-account-card .uwp-tab-content h2:first-of-type{
	font-family:var(--sans);font-weight:800;font-size:22px;color:var(--secondary);
	margin:0 0 18px;letter-spacing:-0.01em
}

/* Hide duplicate sidebar rendered by plugin inside the content pane */
.bo-account-card .uwp-account-content .uwp-account-sidebar,
.bo-account-card .uwp-tab-content .uwp-account-sidebar{display:none}

/* ── UsersWP form field labels in account pane — v2.48.18 fix ──
   UsersWP uses placeholder-only inputs for text fields (no separate
   label), so we only surface real labels via .uwp_form_row > label.
   Critical: the earlier blanket `.bo-account-card label { mono; uppercase }`
   rule was catching checkbox labels too — producing ugly all-caps mono
   text. Now scoped to `.uwp_form_row:not(.uwp_form_row_checkbox) > label`. */
.bo-account-card .uwp_form_row label,
.bo-account-card .uwp-field-wrap label{
	display:block;margin:0 0 6px;
	font-family:var(--sans);font-size:13px;font-weight:600;letter-spacing:0;
	color:var(--secondary);text-transform:none;line-height:1.4
}

/* Checkbox-row labels — sentence case, inline with input on the left */
.bo-account-card .uwp_form_row_checkbox,
.bo-account-card .uwp_form_row.uwp_form_row_check,
.bo-account-card .uwp_form_row[class*="checkbox"],
.bo-account-card .form-check{
	display:flex;align-items:flex-start;gap:10px;margin-bottom:12px
}
.bo-account-card .uwp_form_row_checkbox label,
.bo-account-card .uwp_form_row.uwp_form_row_check label,
.bo-account-card .uwp_form_row[class*="checkbox"] label,
.bo-account-card .form-check label,
.bo-account-card .form-check-label{
	display:inline;margin:0;flex:1;
	font-family:var(--sans);font-size:13.5px;font-weight:500;letter-spacing:0;
	color:var(--secondary);text-transform:none;line-height:1.5;cursor:pointer
}
.bo-account-card .uwp_form_row_checkbox input[type="checkbox"],
.bo-account-card .form-check input[type="checkbox"]{
	margin:3px 0 0;flex-shrink:0
}

/* Select — ensure it never looks disabled (UsersWP renders it with paper
   background that we were inheriting as gray). */
.bo-account-card select{
	background-color:#fff !important;color:var(--secondary) !important;
	cursor:pointer;
	-webkit-appearance:none;-moz-appearance:none;appearance:none;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='%23707A82' stroke-width='2'%3E%3Cpolyline points='2 2 6 6 10 2'/%3E%3C/svg%3E") !important;
	background-repeat:no-repeat !important;background-position:right 14px center !important;
	background-size:11px 7px !important;padding-right:40px
}
.bo-account-card select:disabled{background-color:var(--paper) !important;color:var(--secondary-60) !important;cursor:not-allowed}

/* Placeholders — make them readable (not too faint) */
.bo-account-card input::placeholder,
.bo-account-card textarea::placeholder{color:var(--secondary-60);opacity:1}

/* Required marker */
.bo-account-card .uwp_required,
.bo-account-card label .required,
.bo-account-card label span.red{color:var(--danger);font-weight:700}

/* Submit "UPDATE ACCOUNT" button — full width matching register/login */
.bo-account-card .uwp-account-content button[type="submit"],
.bo-account-card .uwp-tab-content button[type="submit"],
.bo-account-card .uwp-account-content input[type="submit"],
.bo-account-card .uwp-tab-content input[type="submit"]{
	margin-top:8px
}

/* Tab body / forms — reuse our register-card form styles */
.bo-account-card .uwp_form_row,
.bo-account-card .uwp-field-wrap{margin-bottom:14px}
/* Note: label styling is handled lower down via .uwp_form_row label for
   regular fields + checkbox-row variant. Removing the old blanket
   `label { mono; uppercase }` rule that was catching checkbox labels
   (v2.48.18 fix). */
.bo-account-card input[type="text"],
.bo-account-card input[type="email"],
.bo-account-card input[type="password"],
.bo-account-card input[type="tel"],
.bo-account-card input[type="url"],
.bo-account-card input[type="number"],
.bo-account-card select,
.bo-account-card textarea{
	width:100%;padding:12px 14px;
	background:#fff;border:1.5px solid var(--secondary-20);border-radius:8px;
	font-family:var(--sans);font-size:14px;color:var(--secondary);
	outline:none;box-sizing:border-box;
	transition:border-color .15s ease, box-shadow .15s ease
}
.bo-account-card input:focus,
.bo-account-card select:focus,
.bo-account-card textarea:focus{
	border-color:var(--primary);
	box-shadow:0 0 0 3px rgba(51,204,112,0.15)
}

.bo-account-card input[type="checkbox"]{
	width:18px;height:18px;margin-right:8px;accent-color:var(--primary);vertical-align:middle
}
.bo-account-card label:has(input[type="checkbox"]){
	display:flex;align-items:flex-start;gap:10px;
	font-family:var(--sans);font-size:13px;font-weight:500;letter-spacing:0;
	color:var(--secondary);text-transform:none;line-height:1.5;
	margin:0 0 10px;cursor:pointer
}

.bo-account-card button[type="submit"],
.bo-account-card input[type="submit"]{
	padding:12px 22px;
	background:var(--primary);color:var(--secondary);
	border:1.5px solid var(--primary);border-radius:6px;
	font-family:var(--sans);font-weight:800;font-size:13px;letter-spacing:0.06em;text-transform:uppercase;
	cursor:pointer;transition:transform .15s ease, box-shadow .15s ease
}
.bo-account-card button[type="submit"]:hover,
.bo-account-card input[type="submit"]:hover{
	transform:translateY(-1px);box-shadow:0 6px 16px rgba(51,204,112,0.3)
}

/* Alerts inside account panels */
.bo-account-card .uwp-alert,
.bo-account-card .uwp_message_error,
.bo-account-card .uwp_message_success,
.bo-account-card .alert{
	padding:12px 14px;border-radius:6px;margin:0 0 14px;font-size:13.5px;line-height:1.5
}
.bo-account-card .uwp-alert-error,
.bo-account-card .alert-danger,
.bo-account-card .uwp_message_error{
	background:rgba(217,72,72,0.08);border:1px solid rgba(217,72,72,0.3);color:#8b2020
}
.bo-account-card .uwp-alert-success,
.bo-account-card .alert-success,
.bo-account-card .uwp_message_success{
	background:rgba(51,204,112,0.08);border:1px solid rgba(51,204,112,0.35);color:#1e6b3a
}

/* Account section headings (when UsersWP emits h2/h3 inside) */
.bo-account-card h2,
.bo-account-card h3{
	font-family:var(--sans);font-weight:800;letter-spacing:-0.01em;color:var(--secondary);
	margin:0 0 12px
}
.bo-account-card h2{font-size:22px}
.bo-account-card h3{font-size:17px;margin-top:20px}

/* Separator between sections if the plugin emits <hr> */
.bo-account-card hr{
	border:0;border-top:1px solid var(--secondary-20);margin:24px 0
}

/* ── Responsive ──────────────────────────────────────────────── */
/* Stack sidebar above content when viewport starts to squeeze the right pane.
   The 2-col grid is 260 + gap 32 + 1fr — below ~820px viewport, the content
   pane becomes cramped. Switch to 1-col earlier (at 900px) for a cleaner
   stacked layout where both sidebar and content can breathe. */
@media (max-width:900px){
	.bo-account-body{padding:32px 16px 20px}
	.bo-account-card{padding:22px 18px}
	.bo-account-card .row,
	.bo-account-card .uwp-account-page,
	.bo-account-card .uwp-account-form-page{
		grid-template-columns:1fr !important;gap:20px
	}
	.bo-account-card .bg-light{padding:18px 16px !important}
	.bo-account-card .uwp-profile-avatar img,
	.bo-account-card .bg-light img.avatar{width:72px !important;height:72px !important}
	/* Vertical nav → horizontal scrollable row on mobile */
	.bo-account-card .bg-light .nav,
	.bo-account-card .navbar-light .nav{
		flex-direction:row !important;overflow-x:auto;-webkit-overflow-scrolling:touch;
		padding-bottom:4px;gap:4px;justify-content:flex-start !important
	}
	.bo-account-card .bg-light .nav > *,
	.bo-account-card .navbar-light .nav > *{flex-shrink:0;width:auto}
	.bo-account-card a[href*="logout"]{
		border-top:0 !important;padding-top:11px !important;border-radius:6px !important
	}
}

/* ════════════════════════════════════════════════════════════════════
   LOGIN PAGE — /login/  (v2.48.15)
   Reuses .bo-register-hero, .bo-register-card, .bo-register-rgband.
   Adds .bo-login-* for single-column centered card + brand accent in h1.
   ════════════════════════════════════════════════════════════════════ */

/* Brand accent inside the login h1 "Log in on BettingOffice" */
.bo-login-hero__brand{color:var(--primary)}

/* Body wrapper — centers a single ~460px card under the hero */
.bo-login-body{
	padding:56px 24px 32px;
	background:linear-gradient(180deg,var(--paper) 0%,#fff 60%);
	display:flex;justify-content:center
}
.bo-login-card{
	max-width:460px;width:100%;
	/* override .bo-register-card sticky (no grid context here) */
	position:static
}

/* UsersWP login form — Username + Password + Remember-me/Forgot row.
   The plugin emits `.uwp-login-form` (or similar). Our `.bo-register-card`
   styles already cover inputs/labels/checkbox/submit; the login-specific
   tweak is the "Remember me + Forgot password" row: we want those on the
   same line with space-between. UsersWP usually puts them in separate
   `.uwp_form_row` blocks, but we can flex the parent form into a final
   row. */
.bo-login-card__form .uwp-login-form,
.bo-login-card__form form{
	display:flex;flex-direction:column;gap:0
}
/* Forgot-password link typically lives in a `.uwp-login-forgot` or plain
   anchor below the password field. Style it inline below with link-primary. */
.bo-login-card__form a[href*="forgot"],
.bo-login-card__form a[href*="reset"],
.bo-login-card__form .uwp-login-forgot a{
	color:var(--primary);font-weight:700;font-size:13px;
	text-decoration:none;letter-spacing:0.02em
}
.bo-login-card__form a[href*="forgot"]:hover,
.bo-login-card__form .uwp-login-forgot a:hover{text-decoration:underline}

/* Submit "Login" — rounded pill per the auth.js design (vs register's
   radius 6). Keep the same primary fill. */
.bo-login-card__form button[type="submit"],
.bo-login-card__form input[type="submit"]{
	border-radius:999px;
	padding:14px
}

/* Mobile tightening */
@media (max-width:640px){
	.bo-login-hero.bo-register-hero{padding:32px 20px 28px}
	.bo-login-body{padding:32px 20px 20px}
}

/* ════════════════════════════════════════════════════════════════════
   LEGAL PAGES — /editorial-policy/, /privacy-policy/, /terms-of-use/,
   /responsible-gambling/, /cookies-policy/  (v2.48.0)
   Single-column 760px container, intro card + anchor TOC + dated article.
   Applies to any page using page-templates/page-legal.php.
   ════════════════════════════════════════════════════════════════════ */

.bo-legal{
	background:#fff;color:var(--secondary);font-family:var(--sans);
	padding:48px 24px 64px
}
.bo-legal__container{max-width:760px;margin:0 auto}
.bo-legal__article h1{
	font-family:var(--sans);font-weight:800;font-size:40px;line-height:1.1;
	letter-spacing:-0.02em;margin:0 0 10px;color:var(--secondary)
}
.bo-legal__updated{
	font-family:var(--mono);font-size:11px;color:var(--secondary-60);
	letter-spacing:0.05em;text-transform:uppercase;font-weight:700;
	margin:0 0 28px;padding-bottom:16px;border-bottom:1px solid var(--secondary-20)
}
.bo-legal__content{font-size:16px;line-height:1.7;color:var(--secondary)}
.bo-legal__content > :first-child{margin-top:0}
.bo-legal__content h2{
	font-family:var(--sans);font-weight:800;font-size:24px;line-height:1.25;
	letter-spacing:-0.01em;margin:40px 0 14px;color:var(--secondary);scroll-margin-top:120px
}
.bo-legal__content h3{
	font-family:var(--sans);font-weight:700;font-size:18px;line-height:1.3;
	margin:24px 0 10px;color:var(--secondary)
}
.bo-legal__content p{margin:0 0 16px;color:var(--secondary)}
.bo-legal__content a{color:var(--primary);text-decoration:underline;text-underline-offset:3px}
.bo-legal__content strong,
.bo-legal__content b{color:var(--secondary);font-weight:700}
.bo-legal__content ul,
.bo-legal__content ol{padding-left:24px;margin:0 0 18px}
.bo-legal__content li{margin-bottom:8px;line-height:1.65}
.bo-legal__content hr{border:0;border-top:1px solid var(--secondary-20);margin:36px 0}
/* Crush OceanWP p color */
html body .bo-legal__content p,
html body .bo-legal__content li,
body.oceanwp-theme .bo-legal__content p{color:var(--secondary) !important}

/* Intro paragraph — styled callout */
.bo-legal__content .bo-legal-intro{
	background:var(--paper);border:1px solid var(--secondary-20);border-left:3px solid var(--primary);
	border-radius:6px;padding:18px 22px;font-size:16px;line-height:1.6;color:var(--secondary);
	margin:0 0 28px
}

/* Anchor TOC at top of page */
.bo-legal__content .bo-legal-toc{
	background:var(--paper);border:1px solid var(--secondary-20);border-radius:10px;
	padding:20px 24px;margin:0 0 32px
}
.bo-legal__content .bo-legal-toc strong{
	display:block;font-family:var(--mono);font-size:11px;letter-spacing:0.08em;
	text-transform:uppercase;color:var(--secondary-60);font-weight:700;margin-bottom:10px
}
.bo-legal__content .bo-legal-toc ol{
	margin:0;padding-left:20px;columns:2;column-gap:28px
}
.bo-legal__content .bo-legal-toc li{margin-bottom:5px;break-inside:avoid}
.bo-legal__content .bo-legal-toc a{
	color:var(--secondary);text-decoration:none;font-size:14px;font-weight:500;
	transition:color .12s
}
.bo-legal__content .bo-legal-toc a:hover{color:var(--primary);text-decoration:underline}

/* Compliance block (RG info inside legal pages) */
.bo-legal__content .bo-compliance-block{
	background:rgba(232,169,58,0.06);
	border:1px solid rgba(232,169,58,0.35);border-left:3px solid var(--warn);
	border-radius:6px;padding:20px 24px;margin:24px 0
}
.bo-legal__content .bo-compliance-block p{margin:0 0 10px;color:var(--secondary)}
.bo-legal__content .bo-compliance-block p:last-child{margin-bottom:0}
.bo-legal__content .bo-compliance-block strong{color:var(--secondary)}

/* End meta "reviewed quarterly" note */
.bo-legal__content .bo-legal-meta{
	font-size:13px;color:var(--secondary-60);font-style:italic;margin:12px 0 0
}
html body .bo-legal__content p.bo-legal-meta,
body.oceanwp-theme .bo-legal-meta{color:var(--secondary-60) !important}

/* ── Contact page — v2.48.2 — single-email layout ────────────
   Hero email card + topic-routing list. The old 4-card grid
   (.bo-contact-grid + .bo-contact-card) is kept below for
   backwards compat — no longer rendered on /contact/ but the
   rules don't hurt and can be reused for other layouts. */

.bo-legal__content .bo-contact-single{
	display:flex;gap:22px;align-items:flex-start;
	background:linear-gradient(135deg, var(--primary-tint) 0%, rgba(51,204,112,0.04) 100%);
	border:1px solid var(--primary-60);border-radius:12px;
	padding:28px 30px;margin:18px 0 22px
}
.bo-legal__content .bo-contact-single__icon{
	width:56px;height:56px;flex-shrink:0;border-radius:12px;
	background:var(--primary);color:var(--secondary);
	display:flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-weight:800;font-size:26px
}
.bo-legal__content .bo-contact-single__body{flex:1;min-width:0}
.bo-legal__content .bo-contact-single__label{
	font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.1em;
	color:var(--secondary-60);text-transform:uppercase;margin-bottom:4px
}
.bo-legal__content .bo-contact-single__email{
	display:inline-block;
	font-family:var(--mono);font-weight:800;font-size:22px;
	color:var(--secondary);letter-spacing:0.01em;
	text-decoration:underline;text-decoration-color:var(--primary);
	text-underline-offset:6px;text-decoration-thickness:2px;
	margin-bottom:10px;word-break:break-all
}
.bo-legal__content .bo-contact-single__email:hover{color:var(--primary)}
.bo-legal__content .bo-contact-single__note{
	margin:0;font-size:14px;line-height:1.55;color:var(--secondary)
}
html body .bo-legal__content p.bo-contact-single__note,
body.oceanwp-theme .bo-contact-single__note{color:var(--secondary) !important}

/* Topic routing list — 4 subjects pointing to the same email */
.bo-legal__content .bo-contact-topics{
	background:var(--paper);border:1px solid var(--secondary-20);border-radius:10px;
	padding:18px 22px;margin:0 0 28px
}
.bo-legal__content .bo-contact-topics > strong{
	display:block;
	font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.08em;
	color:var(--secondary-60);text-transform:uppercase;margin-bottom:10px
}
.bo-legal__content .bo-contact-topics ul{list-style:none;padding:0;margin:0}
.bo-legal__content .bo-contact-topics li{
	padding:10px 0;margin:0;font-size:14px;line-height:1.55;color:var(--secondary);
	border-top:1px solid var(--secondary-20)
}
.bo-legal__content .bo-contact-topics li:first-child{border-top:0;padding-top:4px}
.bo-legal__content .bo-contact-topics li:last-child{padding-bottom:4px}
.bo-legal__content .bo-contact-topics li strong{
	color:var(--primary);font-weight:700;font-family:var(--sans);
	display:inline-block;min-width:140px
}
html body .bo-legal__content .bo-contact-topics li,
body.oceanwp-theme .bo-legal__content .bo-contact-topics li{color:var(--secondary) !important}

/* Mobile: stack the hero card + single-col topics */
@media (max-width:640px){
	.bo-legal__content .bo-contact-single{
		flex-direction:column;padding:22px 20px;gap:16px
	}
	.bo-legal__content .bo-contact-single__email{font-size:17px}
	.bo-legal__content .bo-contact-topics{padding:14px 18px}
	.bo-legal__content .bo-contact-topics li strong{display:block;min-width:0;margin-bottom:2px}
}

/* ── Careers page — v2.48.3 ───────────────────────────────────
   Status badge banner for "not hiring" state. Uses page-legal
   template. Same tokens as .bo-contact-single for visual family. */
.bo-legal__content .bo-careers-status{
	display:flex;gap:18px;align-items:center;
	background:linear-gradient(135deg, rgba(232,169,58,0.08) 0%, rgba(232,169,58,0.02) 100%);
	border:1px solid rgba(232,169,58,0.35);border-left:3px solid var(--warn);
	border-radius:10px;padding:20px 24px;margin:22px 0 28px
}
.bo-legal__content .bo-careers-status__badge{
	width:56px;height:56px;flex-shrink:0;border-radius:12px;
	background:var(--warn);color:#fff;
	display:flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-weight:800;font-size:26px
}
.bo-legal__content .bo-careers-status__body{flex:1;min-width:0}
.bo-legal__content .bo-careers-status__body strong{
	display:block;font-family:var(--sans);font-weight:800;font-size:16px;
	color:var(--secondary);margin-bottom:4px;letter-spacing:-0.01em
}
.bo-legal__content .bo-careers-status__body p{
	margin:0;font-size:14px;line-height:1.55;color:var(--secondary-60)
}
html body .bo-legal__content .bo-careers-status__body p,
body.oceanwp-theme .bo-careers-status__body p{color:var(--secondary-60) !important}

@media (max-width:640px){
	.bo-legal__content .bo-careers-status{flex-direction:column;align-items:flex-start;padding:18px 20px;gap:14px}
}

/* ── Advertise page — v2.48.4 ─────────────────────────────────
   "What we don't do" constraints list with danger-tint rows. */
.bo-legal__content .bo-advertise-dont{
	display:flex;flex-direction:column;gap:10px;
	margin:18px 0 28px
}
.bo-legal__content .bo-advertise-dont__row{
	display:flex;gap:14px;align-items:flex-start;
	background:rgba(217,72,72,0.04);
	border:1px solid rgba(217,72,72,0.25);border-left:3px solid var(--danger);
	border-radius:8px;padding:16px 20px
}
.bo-legal__content .bo-advertise-dont__mark{
	flex-shrink:0;width:26px;height:26px;border-radius:50%;
	background:var(--danger);color:#fff;
	display:inline-flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-weight:800;font-size:14px;margin-top:2px
}
.bo-legal__content .bo-advertise-dont__row > div{
	flex:1;font-size:14px;line-height:1.6;color:var(--secondary)
}
.bo-legal__content .bo-advertise-dont__row strong{color:var(--secondary);font-weight:700}
html body .bo-legal__content .bo-advertise-dont__row > div,
body.oceanwp-theme .bo-legal__content .bo-advertise-dont__row > div{color:var(--secondary) !important}

/* Mobile */
@media (max-width:640px){
	.bo-legal__content .bo-advertise-dont__row{padding:14px 16px;gap:12px}
}

/* ── Legacy 4-card contact grid (kept for reusability) ───────── */

.bo-legal__content .bo-contact-grid{
	display:grid;grid-template-columns:repeat(2,1fr);gap:16px;
	margin:16px 0 32px
}
.bo-legal__content .bo-contact-card{
	background:var(--paper);border:1px solid var(--secondary-20);border-radius:10px;
	padding:22px 24px;display:flex;flex-direction:column;gap:8px;
	transition:border-color .15s ease
}
.bo-legal__content .bo-contact-card:hover{border-color:var(--primary-60)}
.bo-legal__content .bo-contact-card__icon{
	width:40px;height:40px;border-radius:10px;
	background:var(--primary-tint);color:var(--primary);
	display:flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-weight:800;font-size:18px;margin-bottom:6px
}
.bo-legal__content .bo-contact-card h3{
	font-family:var(--sans);font-weight:800;font-size:16px;color:var(--secondary);
	margin:0 0 4px;letter-spacing:-0.01em
}
.bo-legal__content .bo-contact-card p{
	margin:0 0 8px;font-size:13.5px;line-height:1.55;color:var(--secondary-60)
}
html body .bo-legal__content .bo-contact-card p,
body.oceanwp-theme .bo-legal__content .bo-contact-card p{color:var(--secondary-60) !important}
.bo-legal__content .bo-contact-card__email{
	display:inline-block;margin:4px 0 6px;
	font-family:var(--mono);font-size:13px;font-weight:700;letter-spacing:0.02em;
	color:var(--primary);text-decoration:underline;text-underline-offset:3px;
	word-break:break-all
}
.bo-legal__content .bo-contact-card__sla{
	margin-top:auto;padding-top:10px;border-top:1px solid var(--secondary-20);
	font-family:var(--mono);font-size:10.5px;color:var(--secondary-60);
	letter-spacing:0.05em;font-weight:700;text-transform:uppercase
}

/* Company facts list — key:value rows */
.bo-legal__content .bo-contact-facts{
	list-style:none;padding:0;margin:18px 0 24px;
	background:var(--paper);border:1px solid var(--secondary-20);border-radius:10px;
	overflow:hidden
}
.bo-legal__content .bo-contact-facts li{
	padding:14px 20px;margin:0;
	border-top:1px solid var(--secondary-20);
	font-size:14px;line-height:1.5;color:var(--secondary);
	display:flex;flex-wrap:wrap;gap:8px
}
.bo-legal__content .bo-contact-facts li:first-child{border-top:0}
.bo-legal__content .bo-contact-facts li strong{
	min-width:160px;color:var(--secondary);font-weight:700
}
html body .bo-legal__content .bo-contact-facts li,
body.oceanwp-theme .bo-legal__content .bo-contact-facts li{color:var(--secondary) !important}

/* Mobile: 1-col grid */
@media (max-width:760px){
	.bo-legal__content .bo-contact-grid{grid-template-columns:1fr;gap:10px}
	.bo-legal__content .bo-contact-card{padding:18px 20px}
	.bo-legal__content .bo-contact-facts li{padding:12px 16px;flex-direction:column;gap:2px}
	.bo-legal__content .bo-contact-facts li strong{min-width:0}
}

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width:760px){
	.bo-legal{padding:32px 20px 48px}
	.bo-legal__article h1{font-size:30px}
	.bo-legal__content{font-size:15px;line-height:1.65}
	.bo-legal__content h2{font-size:20px;margin:28px 0 12px}
	.bo-legal__content .bo-legal-intro{padding:14px 16px;font-size:15px}
	.bo-legal__content .bo-legal-toc{padding:16px 20px}
	.bo-legal__content .bo-legal-toc ol{columns:1}
}

/* ════════════════════════════════════════════════════════════════════
   EXPERTS HUB — /experts/ archive (v2.47.0)
   Custom archive template that bypasses Elementor. Hero + philosophy
   band + enriched team grid + editorial standards + CTA. Reuses some
   of the about-us patterns (hero gradient, CTA block).
   ════════════════════════════════════════════════════════════════════ */

.bo-exphub{background:#fff;color:var(--secondary);font-family:var(--sans)}

/* ── 1. Hero ──────────────────────────────────────────────────── */
.bo-exphub-hero{
	background:linear-gradient(135deg, var(--secondary) 0%, var(--secondary-dark) 70%);
	color:#fff;padding:56px 24px 52px;position:relative;overflow:hidden
}
.bo-exphub-hero::before{
	content:'';position:absolute;inset:0;pointer-events:none;
	background:radial-gradient(circle at 85% 0%, rgba(51,204,112,0.12) 0%, transparent 55%)
}
.bo-exphub-hero__inner{max-width:1100px;margin:0 auto;position:relative}
.bo-exphub-hero__eyebrow{
	display:inline-block;
	font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.14em;
	color:var(--primary);margin-bottom:12px
}
.bo-exphub-hero__title{
	font-family:var(--sans);font-weight:800;font-size:52px;line-height:1.05;letter-spacing:-0.02em;
	margin:0 0 14px;color:#fff
}
.bo-exphub-hero__lead{
	margin:0 0 18px;color:rgba(255,255,255,0.88);font-size:17px;line-height:1.55;max-width:720px
}
.bo-exphub-hero__meta{
	font-family:var(--mono);font-size:12px;color:rgba(255,255,255,0.7);
	display:flex;gap:10px;flex-wrap:wrap;align-items:center;letter-spacing:0.03em
}
.bo-exphub-hero__meta b{color:#fff;font-weight:700}
.bo-exphub-hero__meta .sep{opacity:0.4}
html body .bo-exphub-hero h1.bo-exphub-hero__title,
body.oceanwp-theme .bo-exphub-hero__title{color:#fff !important}
html body .bo-exphub-hero p.bo-exphub-hero__lead,
body.oceanwp-theme .bo-exphub-hero__lead{color:rgba(255,255,255,0.88) !important}

/* ── 2. Philosophy band ───────────────────────────────────────── */
.bo-exphub-philo{background:var(--paper);border-bottom:1px solid var(--secondary-20);padding:40px 24px}
.bo-exphub-philo__inner{max-width:1200px;margin:0 auto}
.bo-exphub-philo__grid{
	display:grid;grid-template-columns:repeat(4,1fr);gap:20px
}
.bo-exphub-philo__cell{
	background:#fff;border:1px solid var(--secondary-20);border-radius:10px;
	padding:22px 20px;text-align:left
}
.bo-exphub-philo__ico{
	width:36px;height:36px;border-radius:8px;
	background:var(--primary-tint);color:var(--primary);
	display:flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-weight:800;font-size:16px;
	margin-bottom:12px
}
.bo-exphub-philo__cell h3{
	font-family:var(--sans);font-weight:800;font-size:15px;
	margin:0 0 8px;color:var(--secondary);letter-spacing:-0.01em
}
.bo-exphub-philo__cell p{
	margin:0;font-size:13.5px;line-height:1.55;color:var(--secondary-60)
}
html body .bo-exphub-philo__cell p,
body.oceanwp-theme .bo-exphub-philo__cell p{color:var(--secondary-60) !important}

/* ── 3. Team grid ─────────────────────────────────────────────── */
.bo-exphub-team{padding:64px 24px}
.bo-exphub-team__inner{max-width:1200px;margin:0 auto}
.bo-exphub-team__head{text-align:center;margin-bottom:32px}
.bo-exphub-team__head h2{
	font-family:var(--sans);font-weight:800;font-size:32px;line-height:1.15;
	letter-spacing:-0.01em;margin:0 0 10px;color:var(--secondary)
}
.bo-exphub-team__head p{
	font-size:15px;color:var(--secondary-60);margin:0 auto;max-width:600px
}
html body .bo-exphub-team__head p,
body.oceanwp-theme .bo-exphub-team__head p{color:var(--secondary-60) !important}

.bo-exphub-team__grid{
	display:grid;grid-template-columns:repeat(3,1fr);gap:22px
}
.bo-exphub-team__empty{text-align:center;color:var(--secondary-60);padding:40px 0}

/* Card — enriched vs. the about-us compact version */
.bo-exphub-card{
	background:#fff;border:1px solid var(--secondary-20);border-radius:12px;
	padding:24px;text-decoration:none;color:inherit;
	display:flex;flex-direction:column;gap:14px;
	transition:transform .15s ease, border-color .15s ease, box-shadow .15s ease
}
.bo-exphub-card:hover{
	transform:translateY(-3px);
	border-color:var(--primary);
	box-shadow:0 10px 28px rgba(26,38,46,0.1)
}

.bo-exphub-card__head{display:flex;gap:14px;align-items:center}
.bo-exphub-card__avatar{
	flex-shrink:0;width:64px;height:64px;border-radius:50%;
	background:var(--secondary);color:#fff;
	display:flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-weight:800;font-size:20px;letter-spacing:-0.02em;
	border:2px solid var(--primary-20)
}
.bo-exphub-card__avatar--photo{
	background-size:cover;background-position:center;background-repeat:no-repeat
}
.bo-exphub-card__id{flex:1;min-width:0}
.bo-exphub-card__name{
	font-family:var(--sans);font-weight:800;font-size:17px;color:var(--secondary);
	letter-spacing:-0.01em;line-height:1.2
}
.bo-exphub-card__role{
	font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:0.06em;
	text-transform:uppercase;color:var(--primary);margin-top:5px
}

.bo-exphub-card__tag{
	margin:0;font-size:14px;line-height:1.55;color:var(--secondary);
	padding:12px 0;border-top:1px solid var(--secondary-10);border-bottom:1px solid var(--secondary-10)
}
html body .bo-exphub-card p.bo-exphub-card__tag,
body.oceanwp-theme .bo-exphub-card__tag{color:var(--secondary) !important}

.bo-exphub-card__meta{display:flex;gap:14px;flex-wrap:wrap}
.bo-exphub-card__metric{
	font-family:var(--mono);font-size:11px;color:var(--secondary-60);letter-spacing:0.03em;
	display:inline-flex;align-items:baseline;gap:4px
}
.bo-exphub-card__metric b{
	font-family:var(--sans);font-weight:800;font-size:14px;color:var(--secondary);letter-spacing:-0.01em
}

.bo-exphub-card__foot{
	display:flex;gap:10px;align-items:center;justify-content:space-between;
	flex-wrap:wrap
}
.bo-exphub-card__chips{display:flex;gap:5px;flex-wrap:wrap}
.bo-exphub-card__chips span{
	padding:4px 10px;border-radius:999px;
	background:var(--primary-tint);color:var(--primary);
	font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.05em
}
.bo-exphub-card__verified{
	font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.05em;
	color:var(--primary);
	background:rgba(51,204,112,0.08);padding:4px 8px;border-radius:4px
}
.bo-exphub-card__more{
	margin-top:6px;font-family:var(--sans);font-weight:700;font-size:13px;
	color:var(--primary);letter-spacing:0.01em
}

/* ── 4. Editorial standards ───────────────────────────────────── */
.bo-exphub-standards{
	background:var(--paper);border-top:1px solid var(--secondary-20);padding:64px 24px
}
.bo-exphub-standards__inner{max-width:1100px;margin:0 auto}
.bo-exphub-standards header{margin-bottom:28px}
.bo-exphub-standards h2{
	font-family:var(--sans);font-weight:800;font-size:30px;line-height:1.15;
	letter-spacing:-0.01em;margin:4px 0 0;color:var(--secondary)
}
.bo-exphub-standards__cols{
	display:grid;grid-template-columns:1fr 1fr;gap:22px
}
.bo-exphub-standards__cols > div{
	background:#fff;border:1px solid var(--secondary-20);border-left:3px solid var(--primary);
	border-radius:8px;padding:22px 26px
}
.bo-exphub-standards__cols h3{
	font-family:var(--sans);font-weight:800;font-size:16px;color:var(--secondary);
	margin:0 0 10px;letter-spacing:-0.01em
}
.bo-exphub-standards__cols p{
	margin:0;font-size:14px;line-height:1.65;color:var(--secondary-60)
}
html body .bo-exphub-standards__cols p,
body.oceanwp-theme .bo-exphub-standards__cols p{color:var(--secondary-60) !important}

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width:960px){
	.bo-exphub-hero{padding:36px 20px 32px}
	.bo-exphub-hero__title{font-size:34px}
	.bo-exphub-hero__lead{font-size:15px}
	.bo-exphub-philo{padding:28px 20px}
	.bo-exphub-philo__grid{grid-template-columns:1fr;gap:10px}
	.bo-exphub-team{padding:40px 20px}
	.bo-exphub-team__head h2{font-size:24px}
	.bo-exphub-team__grid{grid-template-columns:1fr;gap:14px}
	.bo-exphub-card{padding:20px}
	.bo-exphub-standards{padding:40px 20px}
	.bo-exphub-standards__cols{grid-template-columns:1fr;gap:12px}
}
@media (min-width:961px) and (max-width:1200px){
	.bo-exphub-philo__grid{grid-template-columns:repeat(2,1fr)}
	.bo-exphub-team__grid{grid-template-columns:repeat(2,1fr)}
}

/* ════════════════════════════════════════════════════════════════════
   ABOUT US — /about-us/ page (v2.46.0)
   Hero + credibility ribbon + styled editor content + dynamic team grid
   + final CTA. Content classes (.bo-values-grid, .bo-founder-hero,
   .bo-compliance-block, .bo-affiliate-disclosure) are authored in the
   WP editor and styled here.
   ════════════════════════════════════════════════════════════════════ */

.bo-about--v2{background:#fff;color:var(--secondary);font-family:var(--sans)}

/* Hero (dark gradient, eyebrow + h1 + lead) */
.bo-about-hero{
	background:linear-gradient(135deg, var(--secondary) 0%, var(--secondary-dark) 70%);
	color:#fff;padding:56px 24px 52px;position:relative;overflow:hidden
}
.bo-about-hero::before{
	content:'';position:absolute;inset:0;pointer-events:none;
	background:radial-gradient(circle at 85% 0%, rgba(51,204,112,0.12) 0%, transparent 55%)
}
.bo-about-hero__inner{max-width:1200px;margin:0 auto;position:relative}
.bo-about-hero__eyebrow{
	display:inline-block;
	font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.14em;
	color:var(--primary);margin-bottom:12px
}
.bo-about-hero__title{
	font-family:var(--sans);font-weight:800;font-size:48px;line-height:1.05;letter-spacing:-0.02em;
	margin:0 0 14px;color:#fff
}
.bo-about-hero__lead{
	margin:0;color:rgba(255,255,255,0.88);font-size:17px;line-height:1.55;max-width:760px
}
html body .bo-about-hero h1.bo-about-hero__title,
html body .bo-about .bo-about-hero__title,
body.oceanwp-theme .bo-about-hero__title{color:#fff !important}
html body .bo-about-hero p.bo-about-hero__lead,
body.oceanwp-theme .bo-about-hero__lead{color:rgba(255,255,255,0.88) !important}

/* Credibility stats ribbon */
.bo-about-ribbon{
	background:var(--paper);border-bottom:1px solid var(--secondary-20);
	padding:28px 24px
}
.bo-about-ribbon__inner{
	max-width:1200px;margin:0 auto;
	display:grid;grid-template-columns:repeat(4,1fr);gap:20px
}
.bo-about-ribbon__cell{text-align:center}
.bo-about-ribbon__lbl{
	font-family:var(--mono);font-size:10px;color:var(--secondary-60);
	letter-spacing:0.08em;font-weight:700;margin-bottom:6px;text-transform:uppercase
}
.bo-about-ribbon__val{
	font-family:var(--sans);font-weight:800;font-size:36px;color:var(--primary);
	line-height:1;letter-spacing:-0.01em
}
.bo-about-ribbon__sub{font-family:var(--mono);font-size:11px;color:var(--secondary-60);margin-top:6px}

/* Main content container — styles the text authored in the WP editor */
.bo-about-body{padding:56px 24px}
.bo-about-body__inner{max-width:900px;margin:0 auto}
.bo-about-content{font-size:16px;line-height:1.75;color:var(--secondary)}
.bo-about-content h2{
	font-family:var(--sans);font-weight:800;font-size:28px;line-height:1.2;
	letter-spacing:-0.01em;margin:40px 0 14px;color:var(--secondary);
	padding-bottom:10px;border-bottom:2px solid var(--secondary-10)
}
.bo-about-content h2:first-child{margin-top:0}
.bo-about-content h3{
	font-family:var(--sans);font-weight:700;font-size:19px;line-height:1.3;
	margin:24px 0 10px;color:var(--secondary)
}
.bo-about-content p{margin:0 0 16px;color:var(--secondary)}
.bo-about-content a{color:var(--primary);text-decoration:underline;text-underline-offset:3px}
.bo-about-content ul,
.bo-about-content ol{padding-left:22px;margin:0 0 18px}
.bo-about-content li{margin-bottom:7px}
html body .bo-about-content p,
html body .bo-about-content li,
body.oceanwp-theme .bo-about-content p{color:var(--secondary) !important}

/* Values grid (authored in content as .bo-values-grid > .bo-values-grid__item) */
.bo-about-content .bo-values-grid{
	display:grid;grid-template-columns:repeat(2,1fr);gap:16px;
	margin:18px 0 28px;padding:0;list-style:none
}
.bo-about-content .bo-values-grid__item{
	background:var(--paper);border:1px solid var(--secondary-20);border-radius:10px;
	padding:22px 24px;position:relative;transition:border-color .15s
}
.bo-about-content .bo-values-grid__item:hover{border-color:var(--primary-60)}
.bo-about-content .bo-values-grid__item h3{
	font-family:var(--sans);font-weight:800;font-size:16px;color:var(--secondary);
	margin:0 0 10px;padding-left:24px;position:relative
}
.bo-about-content .bo-values-grid__item h3::before{
	content:'✓';position:absolute;left:0;top:0;
	width:18px;height:18px;border-radius:50%;
	background:var(--primary);color:var(--secondary);
	display:inline-flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-weight:800;font-size:10px;line-height:1
}
.bo-about-content .bo-values-grid__item p{
	margin:0;font-size:14px;line-height:1.6;color:var(--secondary-60)
}
html body .bo-about-content .bo-values-grid__item p,
body.oceanwp-theme .bo-about-content .bo-values-grid__item p{color:var(--secondary-60) !important}

/* Affiliate disclosure callout */
.bo-about-content .bo-affiliate-disclosure{
	background:var(--paper);border:1px solid var(--secondary-20);
	border-left:3px solid var(--primary);border-radius:6px;
	padding:18px 22px;margin:20px 0;font-size:14px;line-height:1.6;color:var(--secondary-60)
}
html body .bo-about-content .bo-affiliate-disclosure p,
body.oceanwp-theme .bo-about-content .bo-affiliate-disclosure p{color:var(--secondary-60) !important;margin:0}

/* Compliance block (RG info) — amber accent for safety / legal emphasis */
.bo-about-content .bo-compliance-block{
	background:rgba(232,169,58,0.06);
	border:1px solid rgba(232,169,58,0.35);border-left:3px solid var(--warn);
	border-radius:6px;padding:20px 24px;margin:24px 0
}
.bo-about-content .bo-compliance-block p{
	margin:0 0 10px;font-size:14px;line-height:1.6;color:var(--secondary)
}
.bo-about-content .bo-compliance-block p:last-child{margin-bottom:0}
.bo-about-content .bo-compliance-block strong{color:var(--secondary);font-weight:700}
html body .bo-about-content .bo-compliance-block p,
body.oceanwp-theme .bo-about-content .bo-compliance-block p{color:var(--secondary) !important}

/* Hide the legacy founder-hero block if it's still in authored content
   (the template now renders a dynamic team grid below). */
.bo-about-content .bo-founder-hero{display:none}

/* ── Meet the Team — dynamic grid ─────────────────────────────── */
.bo-about-team{background:var(--paper);padding:64px 24px;border-top:1px solid var(--secondary-20)}
.bo-about-team__inner{max-width:1200px;margin:0 auto}
.bo-about-team__head{text-align:center;margin-bottom:36px}
.bo-about-team__head h2{
	font-family:var(--sans);font-weight:800;font-size:32px;line-height:1.15;
	letter-spacing:-0.01em;margin:6px 0 12px;color:var(--secondary)
}
.bo-about-team__head p{
	font-size:16px;line-height:1.55;color:var(--secondary-60);margin:0 auto;max-width:600px
}
html body .bo-about-team__head p,
body.oceanwp-theme .bo-about-team__head p{color:var(--secondary-60) !important}

.bo-about-team__grid{
	display:grid;grid-template-columns:repeat(3,1fr);gap:22px
}
.bo-about-team__card{
	background:#fff;border:1px solid var(--secondary-20);border-radius:12px;
	padding:28px 24px;text-align:center;text-decoration:none;color:inherit;
	display:flex;flex-direction:column;align-items:center;
	transition:transform .15s ease, border-color .15s ease, box-shadow .15s ease
}
.bo-about-team__card:hover{
	transform:translateY(-3px);
	border-color:var(--primary);
	box-shadow:0 10px 28px rgba(26,38,46,0.1)
}
.bo-about-team__avatar{
	width:100px;height:100px;border-radius:50%;
	background:var(--secondary);color:#fff;
	display:flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-weight:800;font-size:30px;letter-spacing:-0.02em;
	border:3px solid var(--primary-20);margin-bottom:16px
}
.bo-about-team__avatar--photo{
	background-size:cover;background-position:center;background-repeat:no-repeat
}
.bo-about-team__name{
	font-family:var(--sans);font-weight:800;font-size:18px;color:var(--secondary);
	letter-spacing:-0.01em
}
.bo-about-team__role{
	font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.06em;
	text-transform:uppercase;color:var(--primary);margin:6px 0 12px
}
.bo-about-team__tag{
	margin:0 0 14px;font-size:13.5px;line-height:1.55;color:var(--secondary-60)
}
html body .bo-about-team__card p.bo-about-team__tag,
body.oceanwp-theme .bo-about-team__tag{color:var(--secondary-60) !important}
.bo-about-team__chips{display:flex;gap:5px;flex-wrap:wrap;justify-content:center;margin-bottom:14px}
.bo-about-team__chips span{
	padding:4px 10px;border-radius:999px;
	background:var(--primary-tint);color:var(--primary);
	font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.05em
}
.bo-about-team__more{
	margin-top:auto;font-family:var(--sans);font-weight:700;font-size:13px;
	color:var(--primary);letter-spacing:0.01em
}

/* ── Final CTA ─────────────────────────────────────────────────── */
.bo-about-cta{
	background:var(--secondary);color:#fff;padding:56px 24px;text-align:center
}
.bo-about-cta__inner{max-width:720px;margin:0 auto}
.bo-about-cta h2{
	font-family:var(--sans);font-weight:800;font-size:30px;line-height:1.15;
	letter-spacing:-0.01em;color:#fff;margin:0 0 12px
}
html body .bo-about-cta h2,
body.oceanwp-theme .bo-about-cta h2{color:#fff !important}
.bo-about-cta p{
	margin:0 0 24px;font-size:16px;line-height:1.6;color:rgba(255,255,255,0.78)
}
html body .bo-about-cta p,
body.oceanwp-theme .bo-about-cta p{color:rgba(255,255,255,0.78) !important}
.bo-about-cta__btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.bo-about-btn{
	padding:12px 22px;border-radius:6px;
	font-family:var(--sans);font-weight:700;font-size:14px;
	text-decoration:none;letter-spacing:0.02em;
	display:inline-block;transition:transform .15s ease, box-shadow .15s ease
}
.bo-about-btn--primary{background:var(--primary);color:var(--secondary)}
.bo-about-btn--primary:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(51,204,112,0.3)}
.bo-about-btn--outline{background:transparent;color:#fff;border:1px solid rgba(255,255,255,0.4)}
.bo-about-btn--outline:hover{background:rgba(255,255,255,0.08)}
.bo-about-btn--ghost{background:transparent;color:rgba(255,255,255,0.65)}
.bo-about-btn--ghost:hover{color:#fff}

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width:960px){
	.bo-about-hero{padding:36px 20px 32px}
	.bo-about-hero__title{font-size:32px}
	.bo-about-hero__lead{font-size:15px}
	.bo-about-ribbon__inner{grid-template-columns:repeat(2,1fr);gap:18px}
	.bo-about-ribbon__val{font-size:28px}
	.bo-about-body{padding:40px 20px}
	.bo-about-content h2{font-size:22px;margin:28px 0 12px}
	.bo-about-content .bo-values-grid{grid-template-columns:1fr;gap:10px}
	.bo-about-team{padding:40px 20px}
	.bo-about-team__head h2{font-size:24px}
	.bo-about-team__grid{grid-template-columns:1fr;gap:14px}
	.bo-about-team__card{padding:22px 18px}
	.bo-about-cta{padding:36px 20px}
	.bo-about-cta h2{font-size:22px}
	.bo-about-cta__btns{flex-direction:column}
	.bo-about-btn{width:100%}
}
@media (min-width:961px) and (max-width:1200px){
	.bo-about-team__grid{grid-template-columns:repeat(2,1fr)}
}

/* ════════════════════════════════════════════════════════════════════
   Expert profile — v2.45.0 SIMPLIFIED (presentation + SEO, no tracking)
   New sections: .bo-exp-hero-role, .bo-exp-about, .bo-exp-expertise,
   .bo-exp-standards, .bo-exp-side-profile, .bo-exp-rc-more.
   Reuses existing .bo-exp-hero / .bo-exp-grid / .bo-exp-timeline /
   .bo-exp-creds / .bo-exp-rc-grid / .bo-exp-side-* rules above.
   ════════════════════════════════════════════════════════════════════ */

/* Role line under the h1 (e.g. "Senior Handicapper") */
.bo-exp-hero-role{
	font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:0.08em;
	text-transform:uppercase;color:var(--primary);margin:0 0 8px
}

/* Remove tight lite-mode padding bottom — hero no longer ends with KPI ribbon */
.bo-expert--lite .bo-exp-hero{padding-bottom:32px}

/* About card (long bio) */
.bo-exp-about{
	background:#fff;border:1px solid var(--secondary-20);border-radius:10px;
	padding:24px 28px;font-size:16px;line-height:1.7;color:var(--secondary)
}
.bo-exp-about p{margin:0 0 14px}
.bo-exp-about p:last-child{margin-bottom:0}
html body .bo-exp-about p,
body.oceanwp-theme .bo-exp-about p{color:var(--secondary) !important}

/* Expertise & editorial focus */
.bo-exp-expertise{
	background:#fff;border:1px solid var(--secondary-20);border-radius:10px;
	padding:22px 26px
}
.bo-exp-expertise__chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.bo-exp-expertise__chip{
	padding:7px 14px;
	background:var(--primary-tint);color:var(--primary);
	font-family:var(--sans);font-weight:700;font-size:13px;letter-spacing:0.02em;
	border-radius:999px;border:1px solid var(--primary-60)
}
.bo-exp-expertise__text{
	margin:0;font-size:15px;line-height:1.65;color:var(--secondary-60)
}
html body .bo-exp-expertise__text,
body.oceanwp-theme .bo-exp-expertise__text{color:var(--secondary-60) !important}

/* Recent articles — "See all N articles" link */
.bo-exp-rc-more{margin-top:16px;text-align:center}

/* Editorial standards block — trust manifesto */
.bo-exp-standards{margin-top:36px}
.bo-exp-standards__list{
	list-style:none;padding:0;margin:0;
	display:grid;grid-template-columns:1fr 1fr;gap:14px
}
.bo-exp-standards__list > li{
	display:flex;gap:12px;align-items:flex-start;
	background:var(--paper);border:1px solid var(--secondary-20);border-radius:10px;
	padding:16px 18px;font-size:14px;line-height:1.55;color:var(--secondary-60)
}
.bo-exp-standards__list b{color:var(--secondary);font-weight:700;display:block;margin-bottom:4px}
.bo-exp-standards__ico{
	flex-shrink:0;width:24px;height:24px;border-radius:50%;
	background:var(--primary);color:var(--secondary);
	display:inline-flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-weight:800;font-size:12px
}

/* Sidebar — compact profile card (replaces the signal-tool CTA) */
.bo-exp-side-profile{
	background:#fff;border:1px solid var(--secondary-20);border-radius:10px;
	padding:22px 20px;text-align:center
}
.bo-exp-side-profile__avatar{
	width:96px;height:96px;margin:0 auto 14px;border-radius:50%;
	background-size:cover;background-position:center;background-repeat:no-repeat;
	border:2px solid var(--primary-20)
}
.bo-exp-side-profile__avatar--text{
	display:flex;align-items:center;justify-content:center;
	background:var(--secondary);color:#fff;
	font-family:var(--sans);font-weight:800;font-size:28px;letter-spacing:-0.02em
}
.bo-exp-side-profile__name{
	display:block;font-family:var(--sans);font-weight:800;font-size:16px;
	color:var(--secondary);letter-spacing:-0.01em
}
.bo-exp-side-profile__role{
	font-family:var(--mono);font-size:11px;color:var(--secondary-60);
	letter-spacing:0.06em;text-transform:uppercase;margin:4px 0 16px
}

/* ── Mobile refinements for lite layout ─────────────────────────── */
@media (max-width:767px){
	.bo-expert--lite .bo-exp-hero{padding:18px 20px 20px}
	.bo-exp-hero-role{font-size:11px;margin:0 0 6px}
	.bo-exp-about{padding:18px 20px;font-size:15px;line-height:1.65}
	.bo-exp-expertise{padding:16px 18px}
	.bo-exp-standards__list{grid-template-columns:1fr;gap:10px}
	.bo-exp-standards__list > li{padding:14px 16px;font-size:13.5px}
	.bo-exp-side-profile{padding:18px 16px}
	.bo-exp-side-profile__avatar{width:80px;height:80px}
}

/* ════════════════════════════════════════════════════════════════════
   PICK OF THE DAY HERO — rendered by [bo_pick_of_the_day]
   ════════════════════════════════════════════════════════════════════ */

.bo-pod-hero{
	background:var(--secondary);color:#fff;
	padding:20px 24px 44px;position:relative;overflow:hidden
}
/* Subtle grid watermark */
.bo-pod-hero::before{
	content:"";position:absolute;inset:0;opacity:0.04;pointer-events:none;
	background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px);
	background-size:60px 60px
}
.bo-pod-hero__grid{
	max-width:1440px;margin:0 auto;position:relative;z-index:2;
	display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:center
}
.bo-pod-hero__main{min-width:0}

/* Eyebrow: "● Pick of the Day · Friday, Apr 19 · 7:30 ET"
   Positioned at the TOP of the section (full width, above the 2-col grid).
   Tight top margin/padding so the line sits flush against the section top. */
.bo-pod-hero__eyebrow{
	font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:0.1em;
	text-transform:uppercase;color:var(--primary);
	max-width:1440px;margin:0 auto 18px;position:relative;z-index:2;
	display:flex;align-items:center;gap:8px
}
.bo-pod-hero__dot{
	width:8px;height:8px;border-radius:50%;background:var(--primary);
	animation:blink 1.4s infinite
}

/* Tags row */
.bo-pod-hero__tags{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.bo-pod-hero__tag{
	display:inline-block;padding:6px 11px;border-radius:4px;
	font-family:var(--mono);font-size:11px;font-weight:800;letter-spacing:0.08em;
	text-transform:uppercase;background:rgba(255,255,255,0.10);color:#fff;
	border:1px solid rgba(255,255,255,0.2)
}
.bo-pod-hero__tag--league.nba{background:#e8a93a;color:var(--secondary);border-color:transparent}
.bo-pod-hero__tag--league.nfl{background:#d94848;color:#fff;border-color:transparent}
.bo-pod-hero__tag--league.mls{background:#5bc06b;color:var(--secondary);border-color:transparent}
/* League tag as link — hover lift + subtle brightness. */
a.bo-pod-hero__tag{text-decoration:none;cursor:pointer;transition:transform .1s,filter .15s,box-shadow .15s}
a.bo-pod-hero__tag:hover{transform:translateY(-1px);filter:brightness(1.08);box-shadow:0 2px 8px rgba(0,0,0,0.2)}
a.bo-pod-hero__tag--league.nba:hover{color:var(--secondary)}
a.bo-pod-hero__tag--league.nfl:hover{color:#fff}
a.bo-pod-hero__tag--league.mls:hover{color:var(--secondary)}

/* Pick headline: "Celtics -6.5 vs 76ers" or "Celtics win vs 76ers" */
.bo-pod-hero__pick{
	font-family:var(--sans);font-size:clamp(36px,4.4vw,56px);line-height:1.02;
	margin:10px 0 14px;font-weight:800;letter-spacing:-0.02em;color:#fff
}
.bo-pod-hero__pick-val{color:var(--primary)}
.bo-pod-hero__pick-vs{font-weight:400;color:var(--secondary-20)}

/* Catchphrase — white, slightly larger. `!important` beats Elementor Kit's
   global `p { color:#333 !important }`. */
.bo-pod-hero .bo-pod-hero__catchphrase,
p.bo-pod-hero__catchphrase{
	font-size:20px !important;color:#fff !important;font-weight:500;line-height:1.4;
	margin:0 0 22px;max-width:680px
}

/* Mobile-only inline image (hidden on desktop). `!important` beats OceanWP
   / Elementor default `a {display:inline}`. */
.bo-pod-hero .bo-pod-hero__img-mobile,
a.bo-pod-hero__img-mobile{display:none !important}

/* Odds row (best odds card + confidence slot) */
.bo-pod-hero__row{
	display:flex;gap:14px;align-items:stretch;flex-wrap:wrap;margin:18px 0 22px
}
.bo-pod-hero__odds-card{
	background:#fff;color:var(--secondary);padding:10px 16px;border-radius:4px;
	display:flex;flex-direction:column;justify-content:center;min-width:140px;
	text-decoration:none;cursor:pointer;
	transition:transform .1s,box-shadow .15s
}
a.bo-pod-hero__odds-card:hover{
	transform:translateY(-1px);color:var(--secondary) !important;
	box-shadow:0 4px 14px rgba(0,0,0,0.18), 0 0 0 2px var(--primary) inset
}
.bo-pod-hero__odds-lbl{
	font-family:var(--mono);font-size:10px;letter-spacing:0.08em;font-weight:600
}
.bo-pod-hero__odds-val{
	font-size:26px;font-weight:800;color:var(--primary);line-height:1.1;margin-top:2px
}

/* Confidence Index bar (mid-fi hero). Color buckets per spec:
   red (<5), orange (5–6.9), green (7+). Max cap at 9.5. */
.bo-pod-hero__confidence{
	display:flex;flex-direction:column;justify-content:center;
	text-decoration:none;color:inherit;gap:6px;min-width:220px;
	transition:transform .1s,filter .15s
}
a.bo-pod-hero__confidence:hover{transform:translateY(-1px);filter:brightness(1.1)}
.bo-pod-hero__conf-lbl{
	font-family:var(--mono);font-size:10px;color:var(--secondary-20);
	letter-spacing:0.08em;font-weight:600
}
.bo-pod-hero__conf-row{display:flex;align-items:center;gap:10px}
.bo-pod-hero__conf-track{
	flex:1;min-width:160px;height:8px;background:#2a363e;border-radius:4px;overflow:hidden;position:relative
}
.bo-pod-hero__conf-track > span{
	display:block;height:100%;border-radius:4px;transition:width .35s ease
}
.bo-pod-hero__conf-val{
	font-family:var(--mono);font-weight:700;font-size:16px;white-space:nowrap
}
/* Color variants */
.bo-pod-hero__confidence--green .bo-pod-hero__conf-track > span{background:var(--primary)}
.bo-pod-hero__confidence--green .bo-pod-hero__conf-val{color:var(--primary)}
.bo-pod-hero__confidence--orange .bo-pod-hero__conf-track > span{background:#E8A93A}
.bo-pod-hero__confidence--orange .bo-pod-hero__conf-val{color:#E8A93A}
.bo-pod-hero__confidence--red .bo-pod-hero__conf-track > span{background:#D94848}
.bo-pod-hero__confidence--red .bo-pod-hero__conf-val{color:#D94848}

/* CTAs — Bet at FanDuel (primary) FIRST, Read full analysis (ghost) SECOND */
.bo-pod-hero__cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:4px}
.bo-pod-hero__btn{
	padding:14px 22px;border-radius:6px;
	font-family:var(--sans);font-weight:700;font-size:14px;
	letter-spacing:0.02em;text-decoration:none;
	display:inline-flex;align-items:center;gap:6px;
	transition:transform .1s,box-shadow .15s;cursor:pointer
}
.bo-pod-hero__btn--primary{
	background:var(--primary) !important;color:var(--secondary) !important;border:none
}
.bo-pod-hero__btn--primary:hover{
	transform:translateY(-1px);box-shadow:0 4px 14px rgba(51,204,112,0.3);color:var(--secondary) !important
}
.bo-pod-hero__btn--ghost{
	background:transparent !important;color:#fff !important;
	border:1px solid rgba(255,255,255,0.3) !important
}
.bo-pod-hero__btn--ghost:hover{
	background:rgba(255,255,255,0.08) !important;color:#fff !important
}

/* Byline: "EXPERT · MIKE BRADY ● READ TIME · 8 MIN" */
.bo-pod-hero__byline{
	margin-top:22px;display:flex;gap:24px;flex-wrap:wrap;
	font-family:var(--mono);font-size:11px;color:var(--secondary-20);letter-spacing:0.05em
}
.bo-pod-hero__byline a{color:#fff;text-decoration:none;border-bottom:1px dotted rgba(255,255,255,0.3)}
.bo-pod-hero__byline a:hover{color:var(--primary);border-color:var(--primary)}
.bo-pod-hero__sep{color:var(--primary);opacity:0.7}

/* Media (right column) — div wrapper; image is its own <a> to pick post,
   badges are independent anchors (CI → consistency-index tool page). */
.bo-pod-hero__media{
	position:relative;aspect-ratio:4/3;border-radius:12px;overflow:hidden
}
.bo-pod-hero__media-link{
	display:block;position:absolute;inset:0;border-radius:12px;overflow:hidden;
	text-decoration:none;color:inherit;
	transition:transform .2s ease,box-shadow .25s ease
}
.bo-pod-hero__media-link:hover{
	transform:translateY(-2px);
	box-shadow:0 14px 36px rgba(0,0,0,0.35), 0 0 0 1px rgba(51,204,112,0.35) inset
}
.bo-pod-hero__media-link:hover .bo-pod-hero__img{transform:scale(1.03)}
.bo-pod-hero__img{
	width:100%;height:100%;object-fit:cover;display:block;border-radius:12px;
	transition:transform .5s ease
}
.bo-pod-hero__img--placeholder{
	background:linear-gradient(135deg,var(--primary) 0%,var(--primary-60) 100%)
}

/* Badges — CI top-LEFT (linked to the Consistency Index tool), stadium top-RIGHT.
   Absolute over the media/media-link (z-index above the link so clicks reach the
   badge itself and not the underlying pick-post link). */
.bo-pod-hero__badge{
	position:absolute;padding:8px 12px;border-radius:4px;
	font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.08em;
	z-index:3;text-decoration:none
}
a.bo-pod-hero__badge{cursor:pointer;transition:transform .1s,box-shadow .15s,filter .15s}
a.bo-pod-hero__badge:hover{transform:translateY(-1px);filter:brightness(1.06);box-shadow:0 4px 12px rgba(0,0,0,0.25)}
.bo-pod-hero__badge--ci{
	top:20px;left:20px;background:var(--primary);color:var(--secondary)
}
.bo-pod-hero__badge--ci:hover{color:var(--secondary)}
.bo-pod-hero__badge--stadium{
	top:20px;right:20px;background:rgba(15,24,32,0.85);color:#fff;
	backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)
}

/* Mobile — stack layout, hide desktop media, show inline image between
   catchphrase and odds row. */
@media (max-width:767px){
	.bo-pod-hero{padding:32px 20px 30px}
	.bo-pod-hero__grid{grid-template-columns:1fr;gap:0}
	.bo-pod-hero__media{display:none}       /* desktop media column hidden */
	.bo-pod-hero .bo-pod-hero__img-mobile,
	div.bo-pod-hero__img-mobile{
		display:block !important;position:relative;margin:4px 0 22px;
		border-radius:10px;overflow:hidden;aspect-ratio:16/9;background:rgba(255,255,255,0.04)
	}
	.bo-pod-hero__img-mobile-link{display:block;position:absolute;inset:0;text-decoration:none}
	.bo-pod-hero__img-mobile img{width:100%;height:100%;object-fit:cover;display:block}
	/* Mobile badges — slightly smaller than desktop, same positioning (CI left, stadium right). */
	.bo-pod-hero__img-mobile .bo-pod-hero__badge{
		padding:6px 10px;font-size:9px;top:12px
	}
	.bo-pod-hero__img-mobile .bo-pod-hero__badge--ci{left:12px}
	.bo-pod-hero__img-mobile .bo-pod-hero__badge--stadium{right:12px}
	.bo-pod-hero__pick{font-size:32px}
	.bo-pod-hero .bo-pod-hero__catchphrase,
	p.bo-pod-hero__catchphrase{font-size:17px !important;margin-bottom:18px;color:#fff !important}
	.bo-pod-hero__tag{font-size:10px;padding:5px 9px}
	.bo-pod-hero__cta{flex-direction:column}
	.bo-pod-hero__btn{justify-content:center}
	.bo-pod-hero__row{gap:12px}
	/* Galaxy / narrow Android fix — lock the odds card to max 3 lines:
	   label truncates to 2 lines, value stays on 1. Prevents the browser
	   from breaking mid-word ("FANDU / EL", "-1 / 85"). */
	.bo-pod-hero__odds-card{min-width:110px;flex:1;word-break:normal;overflow-wrap:normal;hyphens:none}
	.bo-pod-hero__odds-card .bo-pod-hero__odds-lbl{
		display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
		line-clamp:2;overflow:hidden;line-height:1.25;word-break:normal;overflow-wrap:normal
	}
	.bo-pod-hero__odds-card .bo-pod-hero__odds-val{white-space:nowrap}
	.bo-pod-hero__byline{font-size:10px;gap:14px}
}

@media (min-width:768px) and (max-width:1023px){
	.bo-pod-hero__grid{grid-template-columns:1fr}
	.bo-pod-hero__media{max-width:640px;margin-top:16px}
}

/* Very narrow phones (<=380px, e.g. Galaxy S Mini / iPhone SE portrait
   at high zoom) — trim label + value sizes so the 3-line guarantee holds
   for the widest possible odds value ("+1000"). */
@media (max-width:380px){
	.bo-pod-hero__odds-card{padding:8px 12px}
	.bo-pod-hero__odds-lbl{font-size:9px;letter-spacing:0.04em}
	.bo-pod-hero__odds-val{font-size:22px}
}

/* ════════════════════════════════════════════════════════════════════
   CONFIDENCE INDEX page — hides the Consistency Rankings table widget
   inherited from the shared Elementor Theme Builder template for the
   betting-tools CPT. Confidence Index is per-match, not per-team, so
   the rankings table doesn't apply here.
   ════════════════════════════════════════════════════════════════════ */
body.postid-6750 .bo-cr-widget,
body.postid-6750 .elementor-element:has(.bo-cr-widget){
	display:none !important
}
/* Defensive fallback for browsers without :has() — kill any Elementor
   container on the Confidence Index page whose sole child is the CR widget. */
body.postid-6750 [data-widget_type="shortcode.default"] .bo-cr-widget{
	display:none !important
}

/* Standalone .bo-ci and .bo-ci-bar components (reusable outside the hero) */
.bo-ci{
	font-family:var(--mono);font-weight:800;font-size:18px;letter-spacing:-0.01em;white-space:nowrap
}
.bo-ci--red{color:#D94848}
.bo-ci--orange{color:#E8A93A}
.bo-ci--green{color:var(--primary)}
.bo-ci__max{font-weight:600;opacity:0.6;font-size:0.8em}

.bo-ci-bar{display:flex;flex-direction:column;gap:6px;min-width:220px}
.bo-ci-bar__lbl{font-family:var(--mono);font-size:10px;color:var(--secondary-60);letter-spacing:0.08em;font-weight:600;text-transform:uppercase}
.bo-ci-bar__row{display:flex;align-items:center;gap:10px}
.bo-ci-bar__track{flex:1;min-width:140px;height:8px;background:var(--secondary-20);border-radius:4px;overflow:hidden}
.bo-ci-bar__track > span{display:block;height:100%;border-radius:4px;transition:width .35s ease}
.bo-ci-bar__val{font-family:var(--mono);font-weight:700;font-size:15px;white-space:nowrap}
.bo-ci-bar--green .bo-ci-bar__track > span, .bo-ci-bar--green .bo-ci-bar__val{background:var(--primary)}
.bo-ci-bar--green .bo-ci-bar__val{color:var(--primary);background:transparent}
.bo-ci-bar--orange .bo-ci-bar__track > span{background:#E8A93A}
.bo-ci-bar--orange .bo-ci-bar__val{color:#E8A93A}
.bo-ci-bar--red .bo-ci-bar__track > span{background:#D94848}
.bo-ci-bar--red .bo-ci-bar__val{color:#D94848}

/* ════════════════════════════════════════════════════════════════════
   TODAY'S PICKS STRIP — [bo_todays_picks] (home page)
   ════════════════════════════════════════════════════════════════════ */
.bo-tpicks-grid{
	display:grid;grid-template-columns:repeat(4,1fr);gap:14px;
	max-width:1440px;margin:0 auto
}
.bo-tpick{
	position:relative;
	background:#fff;border:1px solid var(--secondary-20);border-radius:10px;
	display:flex;flex-direction:column;overflow:hidden;
	transition:transform .15s ease,box-shadow .2s ease,border-color .15s ease
}
.bo-tpick:hover{
	transform:translateY(-2px);
	box-shadow:0 10px 26px rgba(16,24,32,0.10);
	border-color:var(--primary)
}

/* Body — main click target for the pick post.
   flex:1 1 auto so the body absorbs extra grid-row height; this keeps the
   CTA below as a fixed-height banner on cards with shorter content (e.g.
   a single-line keypoint) instead of the CTA growing to fill the gap. */
.bo-tpick__body{
	flex:1 1 auto;
	display:flex;flex-direction:column;gap:10px;
	padding:14px 14px 12px;text-decoration:none;color:inherit;min-height:148px
}
.bo-tpick__body:hover{color:inherit}
.bo-tpick__head{
	display:flex;align-items:center;justify-content:space-between;
	min-height:22px;
	font-family:var(--mono);font-size:11px;color:var(--secondary-60);letter-spacing:0.04em
}
.bo-tpick__badge-slot{display:inline-block;width:40px}

/* Competition badge — standalone anchor, positioned over the head row.
   Colors match the league pattern from the hero. */
.bo-tpick__badge{
	position:absolute;top:12px;left:12px;z-index:2;
	font-family:var(--mono);font-size:10px;font-weight:800;letter-spacing:0.08em;
	text-transform:uppercase;padding:4px 8px;border-radius:3px;
	text-decoration:none;transition:transform .1s,filter .15s
}
.bo-tpick__badge:hover{transform:translateY(-1px);filter:brightness(1.08)}
.bo-tpick__badge--nba{background:#e8a93a;color:var(--secondary)}
.bo-tpick__badge--nfl{background:#d94848;color:#fff}
.bo-tpick__badge--mls{background:#5bc06b;color:var(--secondary)}

/* Match — team rows with logos. */
.bo-tpick__match{
	display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;
	margin:4px 0 8px
}
.bo-tpick__team{display:flex;align-items:center;gap:8px;min-width:0}
.bo-tpick__team--away{flex-direction:row-reverse;text-align:right}
.bo-tpick__logo{
	width:36px;height:36px;border-radius:50%;
	object-fit:contain;background:var(--paper);flex-shrink:0;
	display:flex;align-items:center;justify-content:center
}
.bo-tpick__logo--initials{
	font-family:var(--mono);font-size:10px;font-weight:800;
	color:var(--secondary)
}
.bo-tpick__name{
	font-size:12px;font-weight:700;color:var(--secondary);line-height:1.2;
	overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0
}
.bo-tpick__vs{
	font-family:var(--mono);font-size:10px;color:var(--secondary-60);
	letter-spacing:0.06em;text-align:center
}

/* Key point — short data-driven insight. */
.bo-tpick__keypoint{
	font-size:12px;line-height:1.4;color:var(--secondary);
	background:var(--primary-tint);padding:8px 10px;border-radius:6px
}

/* CTA button — affiliate link, color from book's main_color ACF.
   flex-shrink:0 + margin-top:auto locks the CTA as a fixed-height banner
   at the bottom of the card, even when the grid row is taller than the
   card's natural content height (see .bo-tpick__body flex:1 1 auto). */
.bo-tpick__cta{
	flex-shrink:0;margin-top:auto;
	display:flex;flex-direction:column;gap:4px;
	padding:12px 14px;text-decoration:none !important;color:#fff !important;
	font-family:var(--sans);
	transition:filter .15s,transform .1s
}
.bo-tpick__cta:hover{filter:brightness(1.08);transform:translateY(-1px);color:#fff !important}
.bo-tpick__cta-pick{
	font-weight:800;font-size:14px;letter-spacing:-0.01em;line-height:1.1
}
.bo-tpick__cta-meta{
	display:flex;align-items:center;gap:10px;
	font-family:var(--mono);font-size:11px;font-weight:600;opacity:0.92
}
.bo-tpick__cta-odds{margin-left:auto;font-weight:700}
.bo-tpick__cta-book{
	font-family:var(--mono);font-size:10px;font-weight:700;
	letter-spacing:0.08em;text-transform:uppercase;opacity:0.9;margin-top:2px
}

/* Mobile — same logic, stacked 1 or 2 cols. */
@media (max-width:767px){
	.bo-tpicks-grid{grid-template-columns:1fr;gap:12px;padding:0 4px}
	.bo-tpick__body{min-height:auto}
	.bo-tpick__name{font-size:13px}
	.bo-tpick__logo{width:32px;height:32px}
}
@media (min-width:768px) and (max-width:1023px){
	.bo-tpicks-grid{grid-template-columns:repeat(2,1fr)}
}

/* ════════════════════════════════════════════════════════════════════
   HOME — Best US sportsbooks strip ([bo_home_sportsbooks])
   ════════════════════════════════════════════════════════════════════ */
.bo-home-sb-grid{
	display:grid;grid-template-columns:repeat(3,1fr);gap:18px;
	max-width:1440px;margin:0 auto
}
.bo-home-sb-card{
	background:#fff;border:1px solid var(--secondary-20);border-radius:12px;
	padding:20px;display:flex;flex-direction:column;gap:14px;
	transition:transform .15s ease,box-shadow .2s ease,border-color .15s ease
}
.bo-home-sb-card:hover{
	transform:translateY(-2px);box-shadow:0 10px 26px rgba(16,24,32,0.08);
	border-color:var(--primary)
}

/* Head row: logo | name+bonus | rating */
.bo-home-sb-card__head{display:flex;align-items:center;gap:14px}
.bo-home-sb-card__logo{
	width:52px;height:52px;border-radius:10px;flex-shrink:0;
	object-fit:contain;background:var(--paper);padding:4px;
	display:flex;align-items:center;justify-content:center
}
.bo-home-sb-card__logo--initials{
	font-family:var(--mono);font-size:13px;font-weight:800;color:var(--secondary)
}
.bo-home-sb-card__info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.bo-home-sb-card__name{
	font-family:var(--sans);font-weight:800;font-size:16px;color:var(--secondary);
	letter-spacing:-0.01em;line-height:1.15
}
.bo-home-sb-card__bonus{display:flex;flex-direction:column;gap:1px;min-width:0}
.bo-home-sb-card__bonus-main{
	font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.04em;
	color:var(--primary);text-transform:uppercase;line-height:1.2;
	white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.bo-home-sb-card__bonus-desc{
	font-size:11px;color:var(--secondary-60);line-height:1.25;
	white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.bo-home-sb-card__rating{
	font-family:var(--mono);font-size:14px;font-weight:700;color:var(--secondary);
	white-space:nowrap;flex-shrink:0
}
.bo-home-sb-card__rating span{color:#e8a93a;font-size:13px;margin-left:2px}

/* Catchphrase */
.bo-home-sb-card__catchphrase{
	font-size:13px;line-height:1.45;color:var(--secondary);
	background:var(--paper);border-radius:6px;padding:10px 12px;margin:0
}

/* CTAs — Claim bonus = 3/4 width, Review = 1/4 width */
.bo-home-sb-card__cta{display:flex;gap:8px}
.bo-home-sb-card__btn{
	padding:10px 14px;border-radius:6px;
	font-family:var(--sans);font-weight:700;font-size:13px;
	text-align:center;text-decoration:none;letter-spacing:0.02em;
	transition:transform .1s,box-shadow .15s,filter .15s;
	min-width:0
}
.bo-home-sb-card__btn--primary{
	flex:3;
	background:var(--primary) !important;color:var(--secondary) !important;
	border:1px solid var(--primary)
}
.bo-home-sb-card__btn--primary:hover{
	transform:translateY(-1px);
	box-shadow:0 4px 12px rgba(51,204,112,0.30);
	color:var(--secondary) !important
}
.bo-home-sb-card__btn--outline{
	flex:1;
	background:transparent !important;color:var(--secondary) !important;
	border:1px solid var(--secondary-20)
}
.bo-home-sb-card__btn--outline:hover{
	background:var(--paper) !important;border-color:var(--secondary);
	color:var(--secondary) !important
}

/* Responsive */
@media (max-width:1023px) and (min-width:768px){
	.bo-home-sb-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:767px){
	.bo-home-sb-grid{grid-template-columns:1fr;gap:12px;padding:0 4px}
}

/* ═══════════════════════════════════════════════════════════════════
   COMPARE TOOL — page + picker + desktop matrix + mobile stack
   ═══════════════════════════════════════════════════════════════════ */
.bo-sb-compare-page{padding:40px 24px;background:var(--paper)}
.bo-sb-compare-page__inner{max-width:none;margin:0}

/* Picker (when <2 slugs) */
.bo-sb-compare-page__picker-hd{text-align:center;max-width:640px;margin:0 auto 32px}
.bo-sb-compare-page__h1{font-family:var(--sans);font-weight:800;font-size:clamp(28px,3.2vw,42px);letter-spacing:-0.02em;color:var(--secondary);margin:12px 0}
.bo-sb-compare-page__intro{font-family:var(--sans);font-size:16px;line-height:1.55;color:var(--secondary-80, rgba(0,0,0,0.7));margin:0}
/* Compare picker (full-page variant used on /sportsbooks/compare/ AND
   /betting-tools/compare-sportsbooks/). Redesigned v2.40.1 to align with
   site DA — paper chip, primary accent on hover/active, no red cascade.
   All !important guards defeat Elementor Kit's global button cascade. */
.bo-sb-compare-picker{max-width:900px;margin:0 auto}
.bo-sb-compare-picker__chips{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-bottom:22px}

.bo-sb-compare-picker__chip,
button.bo-sb-compare-picker__chip,
.bo-sb-compare-picker__chip.bo-msb-compare-chip{
	display:inline-flex !important;align-items:center;gap:10px;
	background:#fff !important;color:var(--secondary) !important;
	border:1.5px solid var(--secondary-20) !important;
	padding:9px 16px 9px 9px !important;border-radius:999px !important;
	font-family:var(--sans) !important;font-weight:600 !important;font-size:13px !important;letter-spacing:0.01em !important;
	text-transform:none !important;cursor:pointer !important;pointer-events:auto !important;
	box-shadow:0 1px 2px rgba(26,38,46,0.04) !important;
	transition:border-color .12s,background .12s,transform .12s,box-shadow .15s !important;
	line-height:1.2 !important
}
.bo-sb-compare-picker__chip:hover,
button.bo-sb-compare-picker__chip:hover{
	border-color:var(--primary) !important;background:var(--paper) !important;
	transform:translateY(-1px);box-shadow:0 4px 12px rgba(26,38,46,0.08) !important;color:var(--secondary) !important
}
.bo-sb-compare-picker__chip .bo-msb-logo{
	width:26px !important;height:26px !important;border-radius:50% !important;
	display:inline-flex !important;align-items:center;justify-content:center;
	font-family:var(--sans) !important;font-weight:800 !important;font-size:10px !important;letter-spacing:0.02em !important;flex-shrink:0
}
.bo-sb-compare-picker__chip .bo-msb-compare-chip__state{
	color:var(--secondary-60) !important;font-family:var(--mono) !important;font-weight:700 !important;
	font-size:13px !important;margin-left:4px;line-height:1;transition:color .12s
}
.bo-sb-compare-picker__chip:hover .bo-msb-compare-chip__state{color:var(--primary) !important}

/* Active state — primary green fill + secondary text + ✓ mark */
.bo-sb-compare-picker__chip.bo-msb-compare-chip--active,
button.bo-sb-compare-picker__chip.bo-msb-compare-chip--active,
.bo-sb-compare-picker__chip.bo-sb-compare-widget__chip--active{
	background:var(--primary) !important;color:var(--secondary) !important;border-color:var(--primary) !important;
	box-shadow:0 4px 14px rgba(51,204,112,0.3) !important
}
.bo-sb-compare-picker__chip.bo-msb-compare-chip--active .bo-msb-compare-chip__state{color:var(--secondary) !important}

/* Capped state — n==MAX, chip not selected and not selectable */
.bo-sb-compare-picker__chip.bo-msb-compare-chip--capped{
	opacity:0.45 !important;cursor:not-allowed !important;transform:none !important;box-shadow:none !important
}
.bo-sb-compare-picker__cta{max-width:320px;margin:0 auto;display:flex}

/* Footer: change selection */
.bo-sb-compare-page__footer{display:flex;justify-content:space-between;align-items:center;margin-top:32px;padding-top:24px;border-top:1px solid var(--secondary-20, rgba(0,0,0,0.1));flex-wrap:wrap;gap:12px}
.bo-sb-compare-page__change,.bo-sb-compare-page__hub{font-family:var(--mono);font-size:12px;font-weight:700;color:var(--secondary);text-decoration:none;letter-spacing:0.04em}
.bo-sb-compare-page__change:hover,.bo-sb-compare-page__hub:hover{color:var(--primary)}

/* Matrix header */
.bo-sb-cmp-hd{text-align:center;max-width:720px;margin:0 auto 28px}
.bo-sb-cmp-h1{font-family:var(--sans);font-weight:800;font-size:clamp(24px,2.6vw,36px);letter-spacing:-0.02em;color:var(--secondary);margin:12px 0 8px;line-height:1.15}
.bo-sb-cmp-sub{font-family:var(--sans);font-size:14px;line-height:1.5;color:var(--secondary-80, rgba(0,0,0,0.65));margin:0}

/* Desktop table */
.bo-sb-cmp-table-wrap{overflow-x:auto;background:#fff;border:1px solid var(--secondary-20, rgba(0,0,0,0.1));border-radius:14px;box-shadow:0 4px 16px rgba(0,0,0,0.04)}
.bo-sb-cmp-table{width:100%;border-collapse:collapse;table-layout:fixed}
.bo-sb-cmp-table th,.bo-sb-cmp-table td{padding:14px 16px;vertical-align:middle;border-bottom:1px solid var(--secondary-20, rgba(0,0,0,0.06))}
.bo-sb-cmp-table tbody tr:last-child td,.bo-sb-cmp-table tbody tr:last-child th{border-bottom:0}
.bo-sb-cmp-table tbody tr:nth-child(even) td,.bo-sb-cmp-table tbody tr:nth-child(even) th{background:var(--paper)}
/* Row hover (desktop) — subtle lift, keeps winner highlight visible */
@media (hover:hover) and (pointer:fine){
	.bo-sb-cmp-table tbody tr:not(.bo-sb-cmp-cta-row):hover td,
	.bo-sb-cmp-table tbody tr:not(.bo-sb-cmp-cta-row):hover th{background:rgba(51,204,112,0.06);transition:background .15s}
	.bo-sb-cmp-table tbody tr:not(.bo-sb-cmp-cta-row):hover .bo-sb-cmp-cell--winner{background:rgba(51,204,112,0.14) !important}
}

.bo-sb-cmp-rowlabel{font-family:var(--sans);font-weight:700;font-size:13px;color:var(--secondary-80, rgba(0,0,0,0.7));text-align:left;width:180px;min-width:180px;position:sticky;left:0;background:inherit;text-transform:none !important;letter-spacing:normal !important}
/* Brand mark in the empty top-left corner of the table */
.bo-sb-cmp-rowlabel--hd{background:var(--secondary) !important;padding:20px 16px !important;text-align:center}
.bo-sb-cmp-brand{display:inline-block;width:40px;height:40px;object-fit:contain;margin:0 auto}
.bo-sb-cmp-bookhead{background:var(--secondary) !important;color:#fff;padding:20px 16px !important;position:sticky;top:0;z-index:2}
.bo-sb-cmp-bookhead-inner{display:flex;flex-direction:column;align-items:center;gap:8px}
.bo-sb-cmp-logo{width:56px;height:56px;object-fit:contain;background:#fff;border-radius:10px;padding:5px;display:block}
.bo-sb-cmp-logo--initials{display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:14px;font-weight:800;padding:0}
.bo-sb-cmp-bookname{font-family:var(--sans);font-weight:800;font-size:16px;letter-spacing:-0.01em;color:#fff;text-align:center}

.bo-sb-cmp-cell{font-family:var(--sans);font-size:14px;color:var(--secondary);text-align:center;position:relative}
.bo-sb-cmp-cell--winner{background:rgba(51,204,112,0.08) !important}
.bo-sb-cmp-cell--winner .bo-sb-cmp-v{color:var(--secondary);font-weight:700}

.bo-sb-cmp-v{font-family:var(--sans);font-weight:600;font-size:15px;color:var(--secondary)}
.bo-sb-cmp-v--muted{color:var(--secondary-40, rgba(0,0,0,0.35))}
.bo-sb-cmp-unit{font-family:var(--mono);font-size:10px;color:var(--secondary-60, rgba(0,0,0,0.55));margin-left:3px}
.bo-sb-cmp-text{font-size:13px;line-height:1.4;color:var(--secondary)}
.bo-sb-cmp-yes{color:var(--primary);font-size:18px;font-weight:800;display:inline-block}
.bo-sb-cmp-no{color:var(--secondary-40, rgba(0,0,0,0.35));font-size:16px;display:inline-block}

.bo-sb-cmp-list{display:flex;flex-wrap:wrap;gap:4px;justify-content:center}
.bo-sb-cmp-tag{display:inline-block;padding:3px 8px;background:var(--paper);border:1px solid var(--secondary-20, rgba(0,0,0,0.08));border-radius:4px;font-family:var(--mono);font-size:10px;font-weight:600;color:var(--secondary);white-space:nowrap}
.bo-sb-cmp-tag--more{background:var(--secondary-10, rgba(0,0,0,0.04));color:var(--secondary-60, rgba(0,0,0,0.55))}

.bo-sb-cmp-best{display:inline-block;margin-left:10px;padding:3px 9px;background:var(--primary);color:var(--secondary);font-family:var(--sans);font-size:10px;font-weight:700;letter-spacing:0.01em;border-radius:999px;vertical-align:middle}

/* CTA row at the bottom of the table */
.bo-sb-cmp-cta-row th,.bo-sb-cmp-cta-row td{background:var(--secondary) !important;border-bottom:0 !important}
.bo-sb-cmp-cta-row .bo-sb-cmp-rowlabel{color:#fff}
.bo-sb-cmp-cta-cell{padding:16px 12px !important}
.bo-sb-cmp-cta-primary,.bo-sb-cmp-cta-outline{display:block;padding:10px 12px;border-radius:6px;font-family:var(--sans);font-weight:700;font-size:12px;text-decoration:none;text-align:center;margin-bottom:6px;transition:transform .1s,box-shadow .15s}
.bo-sb-cmp-cta-primary{background:var(--primary);color:var(--secondary) !important;border:1px solid var(--primary)}
.bo-sb-cmp-cta-primary:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(51,204,112,0.30)}
.bo-sb-cmp-cta-outline{background:transparent;color:#fff !important;border:1px solid rgba(255,255,255,0.3)}
.bo-sb-cmp-cta-outline:hover{background:rgba(255,255,255,0.1);border-color:#fff}

/* Mobile stack (hidden on desktop) */
.bo-sb-cmp-stack{display:none}
.bo-sb-cmp-card{background:#fff;border:1px solid var(--secondary-20, rgba(0,0,0,0.1));border-radius:12px;padding:18px;margin-bottom:14px;box-shadow:0 2px 8px rgba(0,0,0,0.03)}
.bo-sb-cmp-card-hd{display:flex;align-items:center;gap:12px;padding-bottom:12px;border-bottom:1px solid var(--secondary-20, rgba(0,0,0,0.08));margin-bottom:12px}
.bo-sb-cmp-card-logo{width:44px;height:44px;object-fit:contain;background:var(--paper);border-radius:8px;padding:4px}
.bo-sb-cmp-card-logo--initials{display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:12px;font-weight:800;padding:0}
.bo-sb-cmp-card-name{font-family:var(--sans);font-weight:800;font-size:18px;letter-spacing:-0.01em;color:var(--secondary)}
.bo-sb-cmp-card-dl{margin:0}
.bo-sb-cmp-card-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--secondary-20, rgba(0,0,0,0.06));position:relative}
.bo-sb-cmp-card-row:last-child{border-bottom:0}
.bo-sb-cmp-card-row--winner{background:rgba(51,204,112,0.06);margin:0 -10px;padding:10px}
.bo-sb-cmp-card-k{font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:normal;color:var(--secondary-80, rgba(0,0,0,0.7));text-transform:none;flex-shrink:0}
.bo-sb-cmp-card-v{margin:0;text-align:right;font-family:var(--sans);font-size:14px;font-weight:600;color:var(--secondary);max-width:60%}
.bo-sb-cmp-card-cta{display:flex;gap:8px;margin-top:14px}
.bo-sb-cmp-card-cta .bo-sb-cmp-cta-primary{flex:3;margin:0}
.bo-sb-cmp-card-cta .bo-sb-cmp-cta-outline{flex:1;margin:0;color:var(--secondary) !important;border-color:var(--secondary-20)}

@media (max-width:767px){
	.bo-sb-cmp-table-wrap{display:none}
	.bo-sb-cmp-stack{display:block}
	.bo-sb-compare-page{padding:24px 16px}
}
@media (min-width:768px) and (max-width:1023px){
	.bo-sb-cmp-rowlabel{width:140px;min-width:140px}
	.bo-sb-cmp-bookhead{padding:16px 10px !important}
	.bo-sb-cmp-logo{width:40px;height:40px}
	.bo-sb-cmp-bookname{font-size:14px}
	.bo-sb-cmp-table th,.bo-sb-cmp-table td{padding:12px 10px}
}

/* ═══════════════════════════════════════════════════════════════════
   Sport hub — Featured match card (next upcoming pick + stadium bg)
   Used in desktop hero right column + mobile hero body.
   ═══════════════════════════════════════════════════════════════════ */
.bo-featured-card{display:flex;flex-direction:column;gap:12px;padding:18px;aspect-ratio:16/9;min-height:280px;border-radius:10px;background-size:cover;background-position:center;background-repeat:no-repeat;color:#fff;text-decoration:none;position:relative;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,0.25);transition:transform .15s,box-shadow .15s}
.bo-featured-card:hover{transform:translateY(-2px);box-shadow:0 14px 38px rgba(0,0,0,0.32);color:#fff;text-decoration:none}
/* Overlay link — makes the whole card clickable to the pick permalink,
   while the center CTA (z:2) stays clickable for the affiliate URL. */
.bo-featured-card__overlay{position:absolute;inset:0;z-index:1}
.bo-featured-card__hd{display:flex;justify-content:space-between;align-items:center}
.bo-featured-card__hd .bo-tag{background:var(--primary);color:var(--secondary)}
.bo-featured-card__meta{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:rgba(255,255,255,0.85)}
.bo-featured-card__teams{flex:1;display:flex;align-items:center;justify-content:space-around;gap:14px;min-height:80px}
.bo-featured-card__team{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;min-width:0}
.bo-featured-card__logo{width:54px;height:54px;object-fit:contain;background:rgba(255,255,255,0.92);border-radius:50%;padding:5px;box-shadow:0 4px 12px rgba(0,0,0,0.2)}
.bo-featured-card__name{font-family:var(--sans);font-weight:700;font-size:13px;line-height:1.2;color:#fff;letter-spacing:-0.01em;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bo-featured-card__vs{font-family:var(--sans);font-weight:900;font-size:22px;color:rgba(255,255,255,0.5);font-style:italic}
.bo-featured-card__venue{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10px;color:rgba(255,255,255,0.72);font-weight:600;letter-spacing:0.02em}
.bo-featured-card__venue svg{color:rgba(255,255,255,0.72);flex-shrink:0}
.bo-featured-card__odds{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;background:rgba(0,0,0,0.35);border:1px solid rgba(255,255,255,0.1);border-radius:8px;padding:8px;backdrop-filter:blur(4px);position:relative;z-index:2}
/* Soccer 2-col: moneyline (narrow) left, elongated CTA right. */
.bo-featured-card__odds--2col{grid-template-columns:1fr 1.25fr;align-items:stretch}
.bo-featured-card__odds--2col .bo-featured-card__cta{
	flex-direction:row;gap:10px;padding:10px 14px;margin:0;min-width:0;width:100%;min-height:48px
}
.bo-featured-card__odds--2col .bo-featured-card__cta-label{font-size:12px}
.bo-featured-card__odds--3col{grid-template-columns:1fr auto 1fr;align-items:stretch}
.bo-featured-card__odds-cell,.bo-featured-card__cta{position:relative;z-index:2}
/* Center CTA — compact primary-green button with book logo + "Bet →" */
.bo-featured-card__cta{
	display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
	padding:4px 10px;margin:0 4px;min-width:58px;
	background:var(--primary);color:var(--secondary);border-radius:6px;text-decoration:none;
	transition:transform .1s,box-shadow .15s,filter .1s
}
.bo-featured-card__cta:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(51,204,112,0.35);color:var(--secondary);text-decoration:none;filter:brightness(1.05)}
.bo-featured-card__cta-logo{width:28px;height:28px;object-fit:contain;background:#fff;border-radius:50%;padding:2px}
.bo-featured-card__cta-abbr{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;font-family:var(--mono);font-size:10px;font-weight:800}
.bo-featured-card__cta-label{font-family:var(--sans);font-weight:800;font-size:11px;letter-spacing:0.04em;text-transform:uppercase;line-height:1}
.bo-featured-card__odds-cell{text-align:center;padding:2px 4px}
.bo-featured-card__odds-k{font-family:var(--mono);font-size:8.5px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:rgba(255,255,255,0.6);margin-bottom:3px}
.bo-featured-card__odds-v{font-family:var(--sans);font-weight:800;font-size:14px;color:#fff;letter-spacing:-0.01em;line-height:1.1}
.bo-featured-card__odds-j{font-family:var(--mono);font-size:9px;color:rgba(255,255,255,0.58);margin-top:2px}

/* Mobile variant — slightly smaller + full-width inside bo-mhub-hero */
.bo-featured-card--mobile{aspect-ratio:auto;min-height:0;margin-top:14px}
.bo-featured-card--mobile .bo-featured-card__teams{min-height:70px}
.bo-featured-card--mobile .bo-featured-card__logo{width:46px;height:46px}

/* ═══════════════════════════════════════════════════════════════════
   Sport hub — Consistency Index members-only gate
   ═══════════════════════════════════════════════════════════════════ */
.bo-ci-gate{position:relative;border-radius:12px;overflow:hidden;min-height:360px;background:var(--paper);border:1px solid var(--secondary-20)}
.bo-ci-gate__blur{filter:blur(6px);opacity:0.5;pointer-events:none;padding:20px}
.bo-ci-gate__overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:30px 22px;text-align:center;background:linear-gradient(180deg, rgba(255,255,255,0.75) 0%, rgba(255,255,255,0.92) 60%, rgba(255,255,255,0.98) 100%)}
.bo-ci-gate__lock{width:52px;height:52px;border-radius:50%;background:var(--primary-tint, rgba(51,204,112,0.14));color:var(--primary);display:flex;align-items:center;justify-content:center}
.bo-ci-gate__title{font-family:var(--sans);font-weight:800;font-size:clamp(18px,2vw,22px);letter-spacing:-0.02em;color:var(--secondary);max-width:480px}
.bo-ci-gate__sub{font-family:var(--sans);font-size:14px;line-height:1.5;color:var(--secondary-80, rgba(0,0,0,0.7));max-width:500px;margin:0}
.bo-ci-gate__cta{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:4px}
.bo-ci-gate__btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 22px;border-radius:6px;font-family:var(--sans);font-weight:700;font-size:13px;text-decoration:none;transition:transform .1s,box-shadow .15s}
.bo-ci-gate__btn--primary{background:var(--primary) !important;color:var(--secondary) !important;border:1px solid var(--primary)}
.bo-ci-gate__btn--primary:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(51,204,112,0.3);color:var(--secondary) !important}
.bo-ci-gate__btn--outline{background:#fff !important;color:var(--secondary) !important;border:1px solid var(--secondary-20)}
.bo-ci-gate__btn--outline:hover{background:var(--paper) !important;border-color:var(--secondary);color:var(--secondary) !important}
.bo-ci-gate__learn{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--primary);text-decoration:none;margin-top:6px}
.bo-ci-gate__learn:hover{text-decoration:underline;text-underline-offset:3px}

/* ═══════════════════════════════════════════════════════════════════
   Sport hub — CI banner (logged-out, no preview)
   ═══════════════════════════════════════════════════════════════════ */
.bo-ci-banner{display:flex;align-items:center;gap:20px;padding:28px 24px;background:var(--secondary);color:#fff;border-radius:14px;box-shadow:0 8px 28px rgba(0,0,0,0.15);flex-wrap:wrap}
.bo-ci-banner__icon{width:60px;height:60px;border-radius:50%;background:rgba(51,204,112,0.18);color:var(--primary);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.bo-ci-banner__body{flex:1;min-width:220px}
.bo-ci-banner__title{font-family:var(--sans);font-weight:800;font-size:clamp(18px,2vw,22px);letter-spacing:-0.02em;color:#fff;margin-bottom:6px}
.bo-ci-banner .bo-ci-banner__sub,
body .bo-ci-banner__sub{font-family:var(--sans);font-size:14px;line-height:1.5;color:rgba(255,255,255,0.78) !important;margin:0;max-width:540px}
.bo-ci-banner__cta{display:flex;gap:10px;flex-wrap:wrap}
.bo-ci-banner__btn{display:inline-flex;align-items:center;justify-content:center;padding:11px 20px;border-radius:6px;font-family:var(--sans);font-weight:700;font-size:13px;text-decoration:none;transition:transform .1s,box-shadow .15s;white-space:nowrap}
.bo-ci-banner__btn--primary{background:var(--primary) !important;color:var(--secondary) !important;border:1px solid var(--primary)}
.bo-ci-banner__btn--primary:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(51,204,112,0.3);color:var(--secondary) !important}
.bo-ci-banner__btn--outline{background:transparent !important;color:#fff !important;border:1px solid rgba(255,255,255,0.3)}
.bo-ci-banner__btn--outline:hover{background:rgba(255,255,255,0.08) !important;border-color:#fff;color:#fff !important}

/* ═══════════════════════════════════════════════════════════════════
   CI wrapper (logged-in) — NBA-only: hide MLS tab + truncate rows
   ═══════════════════════════════════════════════════════════════════ */
/* Hide MLS tab/button in the consistency-rankings widget (snippet #105).
   Selectors cover the common tab classes and data attributes used. */
.bo-ci-wrap .bo-cr-tab[data-sport="mls"],
.bo-ci-wrap [data-sport-tab="mls"],
.bo-ci-wrap .bo-cr-sport-switch__btn[data-sport="mls"],
.bo-ci-wrap .bo-cr-tabs button[data-value="mls"],
.bo-ci-wrap .bo-cr-nav__item[data-sport="mls"]{display:none !important}
/* Row truncation — JS adds .is-truncated and inline styles on rows beyond
   data-bo-ci-initial (see site.js). We keep broad fallback rules here for
   the common initial values (5 for standings, 10 for CI rankings). */
.bo-ci-wrap[data-bo-ci-initial="10"].is-truncated .bo-cr-row:nth-child(n+11),
.bo-ci-wrap[data-bo-ci-initial="10"].is-truncated .bo-cr-team:nth-child(n+11),
.bo-ci-wrap[data-bo-ci-initial="10"].is-truncated tbody tr:nth-child(n+11){display:none}
.bo-ci-wrap[data-bo-ci-initial="5"].is-truncated .bo-cr-row:nth-child(n+6),
.bo-ci-wrap[data-bo-ci-initial="5"].is-truncated .bo-cr-team:nth-child(n+6),
.bo-ci-wrap[data-bo-ci-initial="5"].is-truncated tbody tr:nth-child(n+6){display:none}
.bo-ci-wrap__actions{margin-top:14px;text-align:center}
.bo-ci-wrap__more{display:inline-flex;align-items:center;gap:6px;padding:11px 22px;background:var(--secondary);color:#fff;border:1px solid var(--secondary);border-radius:6px;font-family:var(--sans);font-weight:700;font-size:13px;cursor:pointer;transition:transform .1s,box-shadow .15s}
.bo-ci-wrap__more:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(26,38,46,0.25);color:#fff}
.bo-ci-wrap__more[hidden]{display:none}

/* ═══════════════════════════════════════════════════════════════════
   Playoff bracket (snippet #111) — DA restyle + hide play-in block
   ═══════════════════════════════════════════════════════════════════ */
/* Hide the play-in tournament section (play-in is finished once the
   conferences are locked). */
.bo-npb__playin{display:none !important}
/* Restyle the bracket container to match the paper-card aesthetic. */
.bo-npb{background:#fff;border:1px solid var(--secondary-20, rgba(0,0,0,0.1));border-radius:14px;padding:20px;box-shadow:0 2px 12px rgba(0,0,0,0.04)}
.bo-npb__head{padding-bottom:14px;border-bottom:1px solid var(--secondary-20, rgba(0,0,0,0.06));margin-bottom:18px}
.bo-npb__updated{font-family:var(--mono);font-size:10px;color:var(--secondary-60, rgba(0,0,0,0.55));letter-spacing:0.04em;text-transform:uppercase}
.bo-npb__game{background:var(--paper);border:1px solid var(--secondary-20, rgba(0,0,0,0.08));border-radius:8px;transition:border-color .15s,box-shadow .15s}
.bo-npb__game:hover{border-color:var(--primary);box-shadow:0 2px 8px rgba(51,204,112,0.15)}
.bo-npb__game[data-status="final"]{background:#fff}
.bo-npb__round-label{font-family:var(--mono);font-size:9px;letter-spacing:0.06em;text-transform:uppercase;color:var(--secondary-60, rgba(0,0,0,0.5))}
.bo-npb__seed{font-family:var(--mono);font-size:10px;font-weight:700;color:var(--primary);background:var(--primary-tint, rgba(51,204,112,0.14));padding:2px 6px;border-radius:3px}
.bo-npb__abbr{font-family:var(--sans);font-weight:700;color:var(--secondary)}
.bo-npb__full{font-family:var(--sans);color:var(--secondary-80, rgba(0,0,0,0.7))}
.bo-npb__logo{background:#fff;border-radius:50%;padding:2px}
.bo-npb__conf-label{font-family:var(--sans);font-weight:800;letter-spacing:-0.01em;color:var(--secondary);text-transform:none}
.bo-npb__bracket-title{font-family:var(--sans);font-weight:800;color:var(--secondary)}

/* ═══════════════════════════════════════════════════════════════════
   NBA Scoreboard (snippet #64) — DA restyle
   ═══════════════════════════════════════════════════════════════════ */
.bo-nba-scoreboard{background:#fff;border:1px solid var(--secondary-20, rgba(0,0,0,0.1));border-radius:14px;padding:20px;box-shadow:0 2px 12px rgba(0,0,0,0.04);margin-top:14px}
.bo-nba-scoreboard__title{font-family:var(--sans);font-weight:800;color:var(--secondary);font-size:18px;letter-spacing:-0.01em}
.bo-nba-scoreboard__header{padding-bottom:14px;border-bottom:1px solid var(--secondary-20, rgba(0,0,0,0.06));margin-bottom:16px}
.bo-nba-game{background:var(--paper);border:1px solid var(--secondary-20, rgba(0,0,0,0.08));border-radius:8px;padding:14px;margin-bottom:10px;transition:border-color .15s,box-shadow .15s}
.bo-nba-game:hover{border-color:var(--primary);box-shadow:0 2px 8px rgba(51,204,112,0.12)}
.bo-nba-name{font-family:var(--sans);font-weight:700;color:var(--secondary)}
.bo-nba-logo{background:#fff;border-radius:50%;padding:2px}

/* ═══════════════════════════════════════════════════════════════════
   Sidebar picks (snippet #93) — DA restyle
   ═══════════════════════════════════════════════════════════════════ */
/* ═══════════════════════════════════════════════════════════════════
   Sidebar-picks (snippet #93) — DA restyle, horizontal 2-col grid
   Used in the sport hub "Next picks" section.
   ═══════════════════════════════════════════════════════════════════ */
.bo-sidebar-predictions{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:0;padding:0;list-style:none}
.bo-sidebar-pred-card{margin:0;padding:0;list-style:none}
.bo-sidebar-pred-link{
	display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;
	padding:14px 16px;background:#fff;
	border:1px solid var(--secondary-20, rgba(0,0,0,0.09));border-radius:10px;
	box-shadow:0 2px 8px rgba(0,0,0,0.04);
	text-decoration:none;position:relative;overflow:hidden;
	transition:transform .15s,box-shadow .15s,border-color .15s
}
.bo-sidebar-pred-link::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--primary);opacity:0;transition:opacity .15s}
.bo-sidebar-pred-link:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(0,0,0,0.08);border-color:var(--primary);text-decoration:none}
.bo-sidebar-pred-link:hover::before{opacity:1}

/* Logos — slightly overlapped to save space */
.bo-sidebar-match-logos{display:inline-flex;align-items:center;flex-shrink:0}
.bo-sidebar-team-logo{width:38px;height:38px;object-fit:contain;background:var(--paper);border:2px solid #fff;border-radius:50%;padding:3px}
.bo-sidebar-match-logos .bo-sidebar-team-logo:last-of-type{margin-left:-12px}
.bo-sidebar-vs{display:none}

/* Main text column */
.bo-sidebar-pred-main{display:flex;flex-direction:column;gap:3px;min-width:0}
.bo-sidebar-pred-title{font-family:var(--sans);font-weight:700;font-size:14px;color:var(--secondary);letter-spacing:-0.01em;line-height:1.25;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bo-sidebar-pred-date{font-family:var(--mono);font-size:10px;color:var(--secondary-60, rgba(0,0,0,0.55));letter-spacing:0.05em;text-transform:uppercase}

/* Arrow indicator — reuses existing `.bo-sidebar-triangle` glyph */
.bo-sidebar-pred-cta{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:26px;height:26px;border-radius:50%;background:var(--paper);color:var(--secondary-60, rgba(0,0,0,0.45));transition:background .15s,color .15s,transform .15s}
.bo-sidebar-pred-link:hover .bo-sidebar-pred-cta{background:var(--primary);color:var(--secondary);transform:translateX(2px)}
.bo-sidebar-triangle{width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:7px solid currentColor;margin-left:2px}

/* Empty state */
.bo-sidebar-no-predictions{grid-column:1/-1;padding:24px;text-align:center;font-family:var(--sans);font-size:14px;color:var(--secondary-60, rgba(0,0,0,0.55));background:var(--paper);border:1px dashed var(--secondary-20);border-radius:10px}

/* Responsive — 1 col on phones */
@media (max-width:600px){
	.bo-sidebar-predictions{grid-template-columns:1fr}
	.bo-sidebar-team-logo{width:34px;height:34px}
}

/* ═══════════════════════════════════════════════════════════════════
   Mobile hub — NBA newly added sections (scoreboard / playoffs / CI / reviews / RG)
   ═══════════════════════════════════════════════════════════════════ */
/* Tame the imported snippets so they fit the mobile column. */
.bo-mhub-sec .bo-npb,
.bo-mhub-sec .bo-nba-scoreboard{background:#fff;border:1px solid var(--secondary-20, rgba(0,0,0,0.08));border-radius:10px;padding:12px;overflow-x:auto}
/* Bracket: shrink type on narrow screens + prevent odds/wins from overlapping
   the team abbr. Give the right column a hard gap and shrink the ML label. */
@media (max-width:767px){
	.bo-mhub-sec .bo-npb__bracket-title{font-size:13px}
	.bo-mhub-sec .bo-npb__round-label{font-size:8px}
	.bo-mhub-sec .bo-npb__abbr,.bo-mhub-sec .bo-npb__full{font-size:12px}
	.bo-mhub-sec .bo-npb__logo{width:22px;height:22px}
	.bo-mhub-sec .bo-npb__game{padding:8px 10px}
	.bo-mhub-sec .bo-npb__team{column-gap:14px !important;padding:6px 10px !important}
	.bo-mhub-sec .bo-npb__left{overflow:hidden;min-width:0}
	.bo-mhub-sec .bo-npb__right{gap:10px !important;flex-shrink:0}
	.bo-mhub-sec .bo-npb__ml{font-size:10px !important;min-width:32px !important}
	.bo-mhub-sec .bo-npb__wins{font-size:13px !important}
}
/* Scoreboard cards stay tidy inside the mobile card wrapper */
.bo-mhub-sec .bo-nba-game{background:var(--paper);border:1px solid var(--secondary-20);padding:10px}
/* Scoreboard mobile — reset the right-column left-padding that leaks from
   the 2-col desktop layout (games 4-6 were shifted right on mobile). */
@media (max-width:767px){
	.bo-mhub-sec .bo-nba-scoreboard__col--right{padding-left:0 !important;padding-right:0 !important}
	.bo-mhub-sec .bo-nba-scoreboard__col{padding-right:0 !important}
}

/* Standings mobile — 2 conferences, show-more wrapper (shares .bo-ci-wrap JS) */
.bo-mhub-standings-group{margin-bottom:14px}
.bo-mhub-standings-group:last-child{margin-bottom:0}
.bo-mhub-standings-label{font-family:var(--mono);font-size:10px;font-weight:800;letter-spacing:0.08em;text-transform:uppercase;color:var(--secondary);margin:0 0 6px;padding:0 2px}
/* ═══════════════════════════════════════════════════════════════════
   NBA standings — custom renderer (inc/nba-standings.php).
   Pure child-theme markup. Inline onclick drives the show-more toggle —
   no dependency on deferred scripts or CSS :checked hacks.
   ═══════════════════════════════════════════════════════════════════ */
.bo-stand{
	position:relative;background:#fff;
	border:1px solid rgba(199,204,207,0.6);border-radius:12px;
	overflow:hidden
}
.bo-stand__scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.bo-stand__table{width:100%;border-collapse:collapse;font-family:var(--sans);font-size:13px}
.bo-stand__th{
	background:var(--secondary);color:#fff;
	font-family:var(--mono);font-size:10px;font-weight:800;
	letter-spacing:0.08em;text-transform:uppercase;
	padding:9px 8px;text-align:left;white-space:nowrap
}
.bo-stand__th--rk{width:32px;text-align:center;padding-left:10px}
.bo-stand__th--team{min-width:0}
.bo-stand__th--num{text-align:center;width:44px}
.bo-stand__row{border-top:1px solid rgba(0,0,0,0.05);transition:background .15s}
.bo-stand__row:hover{background:var(--paper)}
.bo-stand__td{padding:9px 8px;color:var(--secondary);vertical-align:middle}
.bo-stand__td--rk{width:32px;text-align:center;font-family:var(--mono);font-size:11px;font-weight:700;color:var(--secondary-60, rgba(0,0,0,0.5));padding-left:10px}
.bo-stand__td--team{display:flex;align-items:center;gap:8px;font-weight:700;letter-spacing:-0.01em;white-space:nowrap}
.bo-stand__logo{width:22px;height:22px;object-fit:contain;background:#fff;border-radius:50%;padding:1px;flex-shrink:0}
.bo-stand__td--num{text-align:center;font-family:var(--mono);font-weight:700;font-size:12px}
.bo-stand__streak{display:inline-block;min-width:22px;padding:2px 6px;border-radius:4px;font-size:11px;font-weight:800}
.bo-stand__streak--w{background:rgba(51,204,112,0.16);color:#1a7f3c}
.bo-stand__streak--l{background:rgba(26,38,46,0.08);color:var(--secondary-60)}

/* Gradient fade above the button — only when collapsed (no .is-expanded) */
.bo-stand:not(.is-expanded) .bo-stand__scroll::after{
	content:"";position:absolute;left:0;right:0;bottom:44px;height:60px;
	background:linear-gradient(to bottom,rgba(255,255,255,0) 0%,#fff 85%);
	pointer-events:none;z-index:1
}

/* Show-more / show-less button — !important to beat Elementor kit + OceanWP
   button defaults that bleed red on single-* pages. */
.bo-stand__toggle,
button.bo-stand__toggle{
	display:flex !important;align-items:center;justify-content:center;gap:8px;
	width:100%;padding:12px 16px;
	background:var(--secondary) !important;color:#fff !important;
	border:0 !important;border-top:1px solid rgba(0,0,0,0.05) !important;
	font-family:var(--sans) !important;font-weight:700 !important;font-size:13px !important;letter-spacing:0.02em !important;
	text-transform:none !important;
	cursor:pointer;transition:filter .15s;position:relative;z-index:2;
	box-shadow:none !important;border-radius:0 !important
}
.bo-stand__toggle:hover,
button.bo-stand__toggle:hover{filter:brightness(1.1);background:var(--secondary) !important;color:#fff !important}
.bo-stand__chevron{display:inline-block;transition:transform .2s}
.bo-stand.is-expanded .bo-stand__chevron{transform:rotate(180deg)}
.bo-stand--empty{padding:24px;text-align:center;font-size:13px;color:var(--secondary-60, rgba(0,0,0,0.55))}

/* MLS variant — slightly narrower numeric cols + form dots */
.bo-stand--soccer .bo-stand__th--num,.bo-stand--soccer .bo-stand__td--num{width:36px}
.bo-stand--soccer .bo-stand__td--pts{font-weight:800;color:var(--secondary)}
.bo-stand__th--form{width:94px;text-align:center}
.bo-stand__td--form{text-align:center;padding-right:10px}
.bo-stand__form{display:inline-flex;gap:3px}
.bo-stand__form-dot{display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border-radius:50%;font-family:var(--mono);font-size:8.5px;font-weight:800;color:#fff;background:var(--secondary-40, rgba(0,0,0,0.3))}
.bo-stand__form-dot--w{background:#1a7f3c}
.bo-stand__form-dot--l{background:#b3232f}
.bo-stand__form-dot--d{background:#b3a232}

/* Desktop hub standings — 2-column grid (East / West side by side) */
.bo-dhub-standings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:4px}
.bo-dhub-standings-label{font-family:var(--mono);font-size:11px;font-weight:800;letter-spacing:0.08em;text-transform:uppercase;color:var(--secondary);margin:0 0 10px;padding:0 2px}
@media (max-width:900px){
	.bo-dhub-standings-grid{grid-template-columns:1fr;gap:16px}
}

/* Mobile slider — soccer standings have 8 columns (rk / team / P / W / D / L /
   PTS / FORM) which don't fit on narrow viewports. Force a natural-width
   table inside the overflow-x:auto scroller + subtle right-edge shadow hint
   so the horizontal scroll affordance is visible. */
@media (max-width:700px){
	.bo-stand--soccer{overflow:hidden} /* container keeps rounded corners */
	.bo-stand--soccer .bo-stand__scroll{
		overflow-x:auto;-webkit-overflow-scrolling:touch;
		scrollbar-width:thin
	}
	.bo-stand--soccer .bo-stand__table{width:auto;min-width:560px}
	/* Cancel the collapsed gradient-fade overlay inside a horizontal
	   scroller — it clips weirdly when the table is wider than the box. */
	.bo-stand--soccer:not(.is-expanded) .bo-stand__scroll::after{display:none}
	/* Right-edge shadow hint to cue horizontal swipe. Attached to the
	   wrapper, not the scroller, so it stays put while scrolling. */
	.bo-stand--soccer::after{
		content:"";position:absolute;top:0;right:0;bottom:44px;width:18px;
		background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.9) 85%);
		pointer-events:none;z-index:1
	}
	.bo-stand--soccer.is-expanded::after{bottom:0}
}

/* Pure-CSS collapse via checkbox + label (no JS, no <details> quirks).
   The hidden <input type="checkbox"> sits as a SIBLING of the .bo-sg-collapse
   div; clicking the <label for="..."> toggles its :checked state which
   drives the nth-child row-hiding + gradient via `:checked + .bo-sg-collapse`. */
/* Hide checkbox fully out of visual flow — defensive multi-property hide */
input.bo-sg-toggle-input{
	position:absolute !important;left:-9999px !important;
	width:0 !important;height:0 !important;opacity:0 !important;
	pointer-events:none !important;visibility:hidden !important
}
.bo-sg-collapse{
	display:flex !important;flex-direction:column !important;position:relative;
	background:#fff;border:1px solid rgba(199,204,207,0.6);border-radius:12px;overflow:hidden
}
.bo-sg-collapse__content{order:1 !important;overflow-x:auto;-webkit-overflow-scrolling:touch}
.bo-sg-collapse__toggle{
	order:2 !important;display:flex;align-items:center;justify-content:center;gap:8px;
	padding:12px 16px;background:var(--secondary);color:#fff;
	font-family:var(--sans);font-weight:700;font-size:13px;letter-spacing:0.02em;
	border-top:1px solid rgba(0,0,0,0.04);z-index:3;position:relative;
	cursor:pointer;transition:filter .15s
}
.bo-sg-collapse__toggle:hover{filter:brightness(1.08)}
.bo-sg-collapse__chevron{display:inline-block;transition:transform .2s}

/* Default state (checkbox UNCHECKED): hide rows 6-15 + gradient fade + "Show all" label */
.bo-sg-toggle-input:not(:checked) + .bo-sg-collapse tbody tr:nth-child(n+6){display:none}
.bo-sg-toggle-input:not(:checked) + .bo-sg-collapse::after{
	content:"";position:absolute;left:0;right:0;bottom:48px;height:70px;
	background:linear-gradient(to bottom,rgba(255,255,255,0) 0%,#fff 85%);
	pointer-events:none;z-index:2
}
.bo-sg-toggle-input:not(:checked) + .bo-sg-collapse .bo-sg-collapse__close-label{display:none}

/* Expanded state (checkbox CHECKED): show all rows, hide gradient, swap label, rotate chevron */
.bo-sg-toggle-input:checked + .bo-sg-collapse .bo-sg-collapse__open-label{display:none}
.bo-sg-toggle-input:checked + .bo-sg-collapse .bo-sg-collapse__chevron{transform:rotate(180deg)}

/* Shortcode inner border redundant with our wrap border */
.bo-sg-collapse .bo-standings__scroll{border:0 !important;border-radius:0 !important}
.bo-sg-collapse .bo-standings__head{display:none}
.bo-sg-collapse .bo-standings__table{font-size:12px}

/* CI banner mobile variant — stack icon / body / CTAs vertically */
.bo-ci-banner--mobile{flex-direction:column;align-items:flex-start;padding:20px 18px;gap:14px}
.bo-ci-banner--mobile .bo-ci-banner__icon{width:46px;height:46px}
.bo-ci-banner--mobile .bo-ci-banner__title{font-size:16px}
.bo-ci-banner--mobile .bo-ci-banner__cta{width:100%;flex-direction:row}
.bo-ci-banner--mobile .bo-ci-banner__btn{flex:1;padding:10px 12px;font-size:12px}

/* Mobile "Compare sportsbooks" CTA under the reviews section */
.bo-mhub-compare-cta-wrap{margin-top:12px;text-align:center}
.bo-mhub-compare-cta{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;background:var(--secondary);color:#fff;border-radius:6px;font-family:var(--sans);font-weight:700;font-size:12px;text-decoration:none;transition:transform .1s,box-shadow .15s}
.bo-mhub-compare-cta:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(26,38,46,0.25);color:#fff;text-decoration:none}
.bo-mhub-compare-cta img{object-fit:contain}

/* RG section spacing */
.bo-mhub-sec--rg{margin:18px 0}

/* ════════════════════════════════════════════════════════════════════════
   SINGLE PICK PAGE (v2.34 — nba-predictions / nfl-predictions / mls-picks)
   Dark hero banner + consolidated "Game preview" article rendered from ACF.
   CI card + mini standings + verdict + sidebar come in later phases.
   ════════════════════════════════════════════════════════════════════════ */

.bo-sp{background:var(--paper)}
.bo-sp-hero{background-color:var(--secondary);color:#fff;padding:48px 24px;border-bottom:1px solid #000;position:relative;overflow:hidden}
.bo-sp-hero__inner{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr auto 1fr;gap:32px;align-items:center;position:relative;z-index:2}
.bo-sp-hero__team{text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px}
.bo-sp-hero__logo{width:88px;height:88px;object-fit:contain;background:#fff;border-radius:50%;padding:8px;box-shadow:0 6px 16px rgba(0,0,0,0.35)}
.bo-sp-hero__team-name{font-family:var(--sans);font-weight:800;font-size:22px;line-height:1.15;letter-spacing:0.01em;color:#fff;max-width:220px}
.bo-sp-hero__team-role{font-family:var(--mono);font-size:10px;letter-spacing:0.14em;color:var(--secondary-20)}
.bo-sp-hero__ml{font-family:var(--mono);font-size:11px;color:var(--secondary-20);letter-spacing:0.05em;margin-top:2px}
.bo-sp-hero__ml b{color:var(--primary);font-weight:700}
.bo-sp-hero__bet{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;margin-top:4px;background:var(--primary);color:#fff !important;font-family:var(--sans);font-weight:700;font-size:12px;letter-spacing:0.02em;text-decoration:none;border-radius:6px;transition:transform .12s,box-shadow .15s}
.bo-sp-hero__bet:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(0,0,0,0.25);text-decoration:none;color:#fff}
.bo-sp-hero__center{text-align:center;padding:0 12px}
.bo-sp-hero__tag{display:inline-block;background:var(--primary);color:var(--secondary);font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.1em;padding:4px 10px;border-radius:4px;margin-bottom:14px}
.bo-sp-hero__vs{font-family:var(--sans);font-weight:800;font-size:56px;line-height:1;color:var(--primary)}
.bo-sp-hero__date{font-family:var(--mono);font-size:12px;color:#fff;margin-top:14px;letter-spacing:0.05em}
.bo-sp-hero__venue{font-family:var(--mono);font-size:11px;color:var(--secondary-20);margin-top:4px;letter-spacing:0.05em}

/* Main content grid */
.bo-sp-body{padding:32px 24px 64px}
.bo-sp-grid{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1fr 340px;gap:32px}
.bo-sp-side{min-height:1px}

/* Shared card styling (white, radius, shadow) for all editorial sections. */
.bo-sp-card{background:#fff;border:1px solid var(--secondary-20);border-radius:8px;padding:28px;box-shadow:0 2px 10px rgba(26,38,46,0.04)}
.bo-sp-main > .bo-sp-card + .bo-sp-card,
.bo-sp-main > .bo-sp-card + .bo-sp-ci,
.bo-sp-main > .bo-sp-card + .bo-sp-standings,
.bo-sp-main > .bo-sp-card + .bo-sp-verdict,
.bo-sp-main > .bo-sp-ci + .bo-sp-card,
.bo-sp-main > .bo-sp-standings + .bo-sp-card,
.bo-sp-main > .bo-sp-verdict + .bo-sp-card,
.bo-sp-main > section + section,
.bo-sp-main > section + nav,
.bo-sp-main > nav + section{margin-top:20px}

/* Intro card */
.bo-sp-intro__hd{border-bottom:1px solid var(--secondary-20);padding-bottom:16px;margin-bottom:18px}
.bo-sp-intro__title{font-family:var(--sans);font-weight:800;font-size:30px;line-height:1.2;letter-spacing:-0.01em;color:var(--secondary);margin:0 0 12px}
.bo-sp-intro__meta{font-family:var(--mono);font-size:11px;color:var(--secondary-60);letter-spacing:0.05em;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.bo-sp-intro__meta .sep{opacity:0.6}
.bo-sp-intro__author{color:inherit;text-decoration:none;border-bottom:1px solid rgba(51,204,112,0.5);padding-bottom:1px;transition:color .15s,border-color .15s}
.bo-sp-intro__author:hover{color:var(--primary);border-bottom-color:var(--primary);text-decoration:none}

/* Shared prose typography — used inside .bo-sp-intro and .bo-sp-prose-card */
.bo-sp-prose{color:var(--secondary);font-family:var(--sans);font-size:15.5px;line-height:1.65}
.bo-sp-prose h2{font-family:var(--sans);font-weight:800;font-size:22px;line-height:1.25;letter-spacing:-0.005em;color:var(--secondary);margin:0 0 14px}
.bo-sp-prose h3{font-family:var(--sans);font-weight:700;font-size:17px;color:var(--secondary);margin:22px 0 10px}
.bo-sp-prose p{margin:0 0 14px;color:var(--secondary)}
.bo-sp-prose p:last-child{margin-bottom:0}
.bo-sp-prose ul,.bo-sp-prose ol{margin:0 0 16px 22px;padding:0;color:var(--secondary)}
.bo-sp-prose ul li,.bo-sp-prose ol li{margin:0 0 6px;line-height:1.6}
.bo-sp-prose strong{color:var(--secondary);font-weight:700}
.bo-sp-prose a{color:var(--secondary);text-decoration:underline;text-decoration-color:var(--primary);text-underline-offset:3px}
.bo-sp-prose a:hover{color:var(--primary)}
.bo-sp-prose blockquote{border-left:3px solid var(--primary);padding:8px 0 8px 18px;margin:18px 0;font-style:italic;color:var(--secondary)}

/* Defeat OceanWP body p{color:…} that could grey out the prose */
body .bo-sp-prose p,
body .bo-sp-prose li{color:var(--secondary) !important}

/* Mobile */
@media (max-width:767px){
	.bo-sp-hero{padding:28px 16px}
	.bo-sp-hero__inner{grid-template-columns:1fr;gap:20px}
	.bo-sp-hero__center{order:-1;padding:0}
	.bo-sp-hero__vs{font-size:36px}
	.bo-sp-hero__logo{width:68px;height:68px;padding:6px}
	.bo-sp-hero__team-name{font-size:17px}
	.bo-sp-hero__team{flex-direction:row;gap:14px;text-align:left;justify-content:flex-start;flex-wrap:wrap}
	.bo-sp-hero__team-name,.bo-sp-hero__team-role,.bo-sp-hero__ml{text-align:left}
	.bo-sp-hero__bet{margin-left:auto}
	.bo-sp-body{padding:20px 12px 48px}
	.bo-sp-grid{grid-template-columns:1fr;gap:20px}
	.bo-sp-card{padding:20px 16px;border-radius:6px}
	.bo-sp-intro__title{font-size:22px}
	.bo-sp-prose{font-size:14.5px}
	.bo-sp-prose h2{font-size:18px;margin:0 0 10px}
	.bo-sp-prose h3{font-size:15.5px}
}

/* ── Single pick — CI card, standings, verdict (Phase 2, v2.34.1) ─────── */

.bo-sp-main > .bo-sp-ci,
.bo-sp-main > .bo-sp-standings,
.bo-sp-main > .bo-sp-verdict{margin-top:20px}

/* CI card */
.bo-sp-ci{background:var(--secondary);color:#fff;border-radius:8px;padding:24px 28px;position:relative;overflow:hidden}
.bo-sp-ci__hd{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:18px;flex-wrap:wrap}
.bo-sp-ci__tag{display:inline-block;background:var(--primary);color:var(--secondary);font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.1em;padding:3px 8px;border-radius:3px;margin-bottom:8px}
.bo-sp-ci__title{font-family:var(--sans);font-weight:700;font-size:18px;color:#fff;margin:0;letter-spacing:-0.005em;line-height:1.3;max-width:520px}
body .bo-sp-ci__title,
.bo-sp-ci h3.bo-sp-ci__title{color:#fff !important}
.bo-sp-ci__link{font-family:var(--mono);font-size:11px;color:var(--primary);letter-spacing:0.04em;text-decoration:none;white-space:nowrap;align-self:center}
.bo-sp-ci__link:hover{color:#fff;text-decoration:underline}
.bo-sp-ci__grid{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:stretch}
.bo-sp-ci__cell{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);border-radius:6px;padding:16px;display:flex;flex-direction:column;gap:10px}
.bo-sp-ci__cell--green{border-color:rgba(51,204,112,0.45);box-shadow:inset 0 0 0 1px rgba(51,204,112,0.12)}
.bo-sp-ci__cell--orange{border-color:rgba(241,160,56,0.45);box-shadow:inset 0 0 0 1px rgba(241,160,56,0.12)}
.bo-sp-ci__cell--red{border-color:rgba(224,80,80,0.45);box-shadow:inset 0 0 0 1px rgba(224,80,80,0.12)}
.bo-sp-ci__role{font-family:var(--mono);font-size:10px;letter-spacing:0.14em;color:var(--secondary-20)}
.bo-sp-ci__team{display:flex;align-items:center;gap:10px}
.bo-sp-ci__logo{width:28px;height:28px;object-fit:contain;background:#fff;border-radius:50%;padding:3px}
.bo-sp-ci__team-name{font-family:var(--sans);font-weight:700;font-size:14px;color:#fff}
.bo-sp-ci__score{font-family:var(--sans);font-weight:800;font-size:30px;line-height:1;color:#fff}
.bo-sp-ci__cell--green .bo-sp-ci__score{color:var(--primary)}
.bo-sp-ci__cell--orange .bo-sp-ci__score{color:#F1A038}
.bo-sp-ci__cell--red .bo-sp-ci__score{color:#E05050}
.bo-sp-ci__max{font-size:13px;font-weight:400;color:var(--secondary-20)}
.bo-sp-ci__bar{background:rgba(255,255,255,0.08);height:5px;border-radius:999px;overflow:hidden;margin-top:2px}
.bo-sp-ci__bar > span{display:block;height:100%;background:var(--primary);border-radius:999px;transition:width .3s}
.bo-sp-ci__cell--orange .bo-sp-ci__bar > span{background:#F1A038}
.bo-sp-ci__cell--red .bo-sp-ci__bar > span{background:#E05050}
.bo-sp-ci__vs{font-family:var(--sans);font-weight:800;font-size:22px;color:var(--primary);align-self:center}

/* CI — locked state (non-logged-in users) */
.bo-sp-ci__locked-body{display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px;padding:16px 8px 8px}
.bo-sp-ci__lock-icon{width:56px;height:56px;border-radius:50%;background:rgba(51,204,112,0.12);border:1px solid rgba(51,204,112,0.35);color:var(--primary);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.bo-sp-ci__lock-copy{font-family:var(--sans);font-size:15px;line-height:1.5;color:#fff !important;margin:0;max-width:520px}
.bo-sp-ci .bo-sp-ci__locked-body p.bo-sp-ci__lock-copy{color:#fff !important}
.bo-sp-ci__lock-cta{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.bo-sp-ci__btn{display:inline-flex;align-items:center;justify-content:center;padding:11px 22px;border-radius:6px;font-family:var(--sans);font-weight:700;font-size:13px;letter-spacing:0.02em;text-decoration:none;transition:transform .12s,box-shadow .15s,background .15s;border:1.5px solid transparent}
.bo-sp-ci__btn--primary{background:var(--primary);color:var(--secondary) !important;border-color:var(--primary)}
.bo-sp-ci__btn--primary:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(0,0,0,0.25);color:var(--secondary);text-decoration:none}
.bo-sp-ci__btn--ghost{background:transparent;color:#fff !important;border-color:rgba(255,255,255,0.3)}
.bo-sp-ci__btn--ghost:hover{background:rgba(255,255,255,0.08);color:#fff;text-decoration:none;border-color:rgba(255,255,255,0.5)}
body .bo-sp-ci__lock-copy,
body.single-nba-predictions .bo-sp-ci__lock-copy,
body.single-nfl-predictions .bo-sp-ci__lock-copy,
body.single-mls-picks .bo-sp-ci__lock-copy{color:#fff !important}

/* Standings wrapper (card + heading). Reuses bo-stand renderer inside. */
.bo-sp-standings{background:#fff;border:1px solid var(--secondary-20);border-radius:8px;overflow:hidden;box-shadow:0 2px 10px rgba(26,38,46,0.04)}
.bo-sp-standings__hd{padding:16px 22px;border-bottom:1px solid var(--secondary-20);display:flex;justify-content:space-between;align-items:center}
.bo-sp-standings__title{font-family:var(--sans);font-weight:700;font-size:17px;color:var(--secondary);margin:0}
.bo-sp-standings__body{padding:0}
.bo-sp-standings__body .bo-stand{border:none;border-radius:0;box-shadow:none}
.bo-sp-standings__body .bo-stand__scroll{border:none !important;border-radius:0 !important}
.bo-stand__row--highlight{background:rgba(51,204,112,0.12) !important}
.bo-stand__row--highlight .bo-stand__td{font-weight:700}
.bo-stand__row--highlight .bo-stand__name{color:var(--secondary)}

/* Verdict card */
.bo-sp-verdict{background:var(--secondary);color:#fff;border-radius:8px;padding:28px}
.bo-sp-verdict__hd{display:flex;gap:10px;align-items:center;margin-bottom:12px}
.bo-sp-verdict__tag{background:var(--primary);color:var(--secondary);font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.1em;padding:4px 10px;border-radius:4px}
.bo-sp-verdict__market{font-family:var(--mono);font-size:10px;letter-spacing:0.1em;color:var(--secondary-20)}
.bo-sp-verdict__pick{font-family:var(--sans);font-weight:800;font-size:28px;line-height:1.15;letter-spacing:-0.01em;color:#fff;margin:0 0 18px;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.bo-sp-verdict__price{font-family:var(--mono);font-size:18px;color:var(--primary);font-weight:700}
.bo-sp-verdict__conf{margin:0 0 22px}
.bo-sp-verdict__conf-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px;font-family:var(--mono);font-size:11px;letter-spacing:0.06em}
.bo-sp-verdict__conf-lbl{color:var(--secondary-20)}
.bo-sp-verdict__conf-val{font-size:15px;font-weight:700;letter-spacing:0}
.bo-sp-verdict__conf-val--green{color:var(--primary)}
.bo-sp-verdict__conf-val--orange{color:#F1A038}
.bo-sp-verdict__conf-val--red{color:#E05050}
.bo-sp-verdict__conf-val--none{color:var(--secondary-20)}
.bo-sp-verdict__conf-bar{background:rgba(255,255,255,0.1);height:6px;border-radius:999px;overflow:hidden}
.bo-sp-verdict__conf-bar > span{display:block;height:100%;background:var(--primary);border-radius:999px;transition:width .3s}
.bo-sp-verdict__cta-row{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.bo-sp-verdict__cta{display:inline-flex;align-items:center;gap:8px;padding:14px 22px;background:var(--primary);color:#fff !important;font-family:var(--sans);font-weight:700;font-size:14px;letter-spacing:0.01em;text-decoration:none;border-radius:6px;transition:transform .12s,box-shadow .15s}
.bo-sp-verdict__cta:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(0,0,0,0.3);color:#fff;text-decoration:none}
.bo-sp-verdict__method{font-family:var(--mono);font-size:11px;color:var(--secondary-20);letter-spacing:0.05em;text-decoration:none}
.bo-sp-verdict__method:hover{color:#fff;text-decoration:underline}

/* Defeat OceanWP body p{color:…} that could tint verdict text */
body .bo-sp-verdict p,body .bo-sp-verdict h3{color:#fff !important}

/* Mobile */
@media (max-width:767px){
	.bo-sp-ci{padding:18px 16px;border-radius:6px}
	.bo-sp-ci__hd{flex-direction:column;gap:10px;margin-bottom:14px}
	.bo-sp-ci__title{font-size:16px}
	.bo-sp-ci__grid{grid-template-columns:1fr;gap:10px}
	.bo-sp-ci__vs{display:none}
	.bo-sp-ci__score{font-size:26px}
	.bo-sp-standings__hd{padding:14px 16px}
	.bo-sp-standings__title{font-size:15.5px}
	.bo-sp-verdict{padding:20px 16px;border-radius:6px}
	.bo-sp-verdict__pick{font-size:22px;margin:0 0 16px}
	.bo-sp-verdict__price{font-size:15px}
	.bo-sp-verdict__cta{width:100%;justify-content:center}
}

/* ── Single pick — Sidebar + mobile pick strip + sticky CTA (Phase 3, v2.34.2) ── */

/* Sidebar wrapper */
.bo-sp-side{min-width:0}
.bo-sp-side__sticky{position:sticky;top:120px;display:flex;flex-direction:column;gap:16px}
.bo-sp-side-card{background:#fff;border:1px solid var(--secondary-20);border-radius:8px;padding:18px;box-shadow:0 2px 10px rgba(26,38,46,0.04)}
.bo-sp-side-card--book{padding:16px}
.bo-sp-side-card__title{font-family:var(--sans);font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:0.05em;color:var(--secondary-60);margin:0 0 12px}
.bo-sp-side-card__list{display:flex;flex-direction:column;gap:4px}
.bo-sp-side-card__more{display:inline-block;margin-top:12px;font-family:var(--mono);font-size:11px;color:var(--primary);letter-spacing:0.04em;text-decoration:none}
.bo-sp-side-card__more:hover{text-decoration:underline}

/* Override bo-pa-sb-card padding for sidebar context (reused book card is built for picks-archive). */
.bo-sp-side-card--book .bo-pa-sb-card{box-shadow:none;border:none;padding:0}

/* Compact related-pick row */
.bo-sp-side-pick{display:flex;align-items:center;gap:10px;padding:8px;border-radius:6px;text-decoration:none;color:var(--secondary);transition:background .12s}
.bo-sp-side-pick:hover{background:var(--paper);text-decoration:none;color:var(--secondary)}
.bo-sp-side-pick__logos{display:inline-flex;width:48px;flex-shrink:0}
.bo-sp-side-pick__logo{width:26px;height:26px;object-fit:contain;background:#fff;border:1px solid var(--secondary-20);border-radius:50%;padding:2px}
.bo-sp-side-pick__logos .bo-sp-side-pick__logo + .bo-sp-side-pick__logo{margin-left:-8px}
.bo-sp-side-pick__tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.bo-sp-side-pick__tx b{font-family:var(--sans);font-size:13px;font-weight:700;color:var(--secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bo-sp-side-pick__meta{font-family:var(--mono);font-size:10px;color:var(--secondary-60);letter-spacing:0.04em}
.bo-sp-side-pick__arrow{font-family:var(--mono);font-size:12px;color:var(--secondary-60);flex-shrink:0}
.bo-sp-side-pick:hover .bo-sp-side-pick__arrow{color:var(--primary)}

/* Mobile "The pick" gradient strip — desktop hidden */
.bo-sp-pick-strip{display:none}
@media (max-width:767px){
	.bo-sp-pick-strip{display:block;padding:12px 16px;background:var(--secondary)}
	.bo-sp-pick-strip__inner{background:linear-gradient(135deg,rgba(51,204,112,0.22) 0%,rgba(51,204,112,0.06) 100%);border:1px solid rgba(51,204,112,0.45);border-radius:12px;padding:14px 16px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
	.bo-sp-pick-strip__tx{flex:1;min-width:140px;display:flex;flex-direction:column;gap:2px;color:#fff}
	.bo-sp-pick-strip__lbl{font-family:var(--mono);font-size:9px;color:var(--primary);letter-spacing:0.14em;font-weight:700}
	.bo-sp-pick-strip__line{font-family:var(--sans);font-weight:800;font-size:20px;letter-spacing:-0.01em;color:#fff;line-height:1.1}
	.bo-sp-pick-strip__odds{font-family:var(--mono);font-size:11px;color:rgba(255,255,255,0.75);letter-spacing:0.04em}
	.bo-sp-pick-strip__cta{background:var(--primary);color:#fff !important;font-family:var(--sans);font-weight:700;font-size:12px;padding:9px 14px;border-radius:6px;text-decoration:none;white-space:nowrap}
	.bo-sp-pick-strip__cta:hover{text-decoration:none;color:#fff}
}

/* Mobile sticky bottom CTA — desktop hidden */
.bo-sp-sticky-cta{display:none}
@media (max-width:767px){
	.bo-sp-sticky-cta{display:flex;align-items:center;gap:10px;position:fixed;left:8px;right:8px;bottom:60px;z-index:40;padding:10px 12px;background:#fff;border:1px solid var(--secondary-20);border-radius:12px;box-shadow:0 10px 32px rgba(26,38,46,0.22),0 2px 8px rgba(26,38,46,0.1);text-decoration:none}
	.bo-sp-sticky-cta:hover{text-decoration:none}
	.bo-sp-sticky-cta__book{width:36px;height:36px;border-radius:50%;background:var(--sp-sticky-book-color,var(--secondary));color:#fff;font-family:var(--sans);font-weight:800;font-size:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0;letter-spacing:0.02em}
	.bo-sp-sticky-cta__tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
	.bo-sp-sticky-cta__tx b{font-family:var(--sans);font-size:13px;font-weight:700;color:var(--secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-0.005em}
	.bo-sp-sticky-cta__meta{font-family:var(--mono);font-size:10px;color:var(--secondary-60);letter-spacing:0.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
	.bo-sp-sticky-cta__btn{background:var(--primary);color:#fff;font-family:var(--sans);font-weight:700;font-size:11px;padding:9px 12px;border-radius:6px;white-space:nowrap;flex-shrink:0}
}

/* Hide desktop sidebar on mobile — the related picks still render under the main column (grid collapse already puts them there) */
@media (max-width:767px){
	.bo-sp-side__sticky{position:static;gap:12px}
	.bo-sp-side-card{padding:14px 16px}
	.bo-sp-side-card--book .bo-pa-sb-card{padding:0}
}

/* ── Single pick — TOC + Lineup + H2H (Phase 4, v2.35.0) ──────────────── */

/* TOC card */
.bo-sp-toc{background:var(--paper);border:1px solid var(--secondary-20);border-radius:8px;padding:18px 22px}
.bo-sp-toc__hd{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.bo-sp-toc__hd h4{font-family:var(--sans);font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:0.08em;color:var(--secondary);margin:0}
.bo-sp-toc__chev{color:var(--primary);font-size:14px}
.bo-sp-toc__list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:8px 22px}
.bo-sp-toc__list li{display:flex;align-items:baseline;gap:10px;font-size:13.5px;line-height:1.45}
.bo-sp-toc__list li::before{content:attr(data-n);font-family:var(--mono);color:var(--primary);font-weight:700;min-width:28px;font-size:12px;letter-spacing:0.02em}
.bo-sp-toc__list li a{color:var(--secondary);text-decoration:none;font-family:var(--sans);font-weight:500}
.bo-sp-toc__list li a:hover{color:var(--primary);text-decoration:underline;text-decoration-color:var(--primary);text-underline-offset:3px}

/* ── Lineup card ── */
.bo-sp-lineup{padding:28px}
.bo-sp-lineup__hd{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:22px;border-bottom:1px solid var(--secondary-20);padding-bottom:14px}
.bo-sp-lineup__title{font-family:var(--sans);font-weight:800;font-size:22px;color:var(--secondary);margin:0;letter-spacing:-0.005em}
.bo-sp-lineup__subtitle{font-family:var(--mono);font-size:11px;color:var(--secondary-60);letter-spacing:0.05em;text-transform:uppercase}
.bo-sp-lineup__grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.bo-sp-lineup__side{background:var(--paper);border:1px solid var(--secondary-20);border-radius:8px;padding:18px}
.bo-sp-lineup__side-hd{display:flex;align-items:center;gap:12px;padding-bottom:12px;margin-bottom:14px;border-bottom:1px solid var(--secondary-20)}
.bo-sp-lineup__side-logo{width:32px;height:32px;object-fit:contain;background:#fff;border:1px solid var(--secondary-20);border-radius:50%;padding:2px}
.bo-sp-lineup__side-name{font-family:var(--sans);font-weight:700;font-size:15px;color:var(--secondary);letter-spacing:-0.005em;min-width:0;word-break:break-word}

/* NBA / MLS starters */
.bo-sp-lineup__starters{display:flex;flex-direction:column;gap:8px}
.bo-sp-lineup__player{display:flex;align-items:center;gap:12px;padding:8px;border-radius:6px;background:#fff;border:1px solid var(--secondary-20)}
.bo-sp-lineup__avatar{width:34px;height:34px;border-radius:50%;background:var(--secondary);color:#fff;font-family:var(--sans);font-weight:700;font-size:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0;letter-spacing:0.02em}
.bo-sp-lineup__player-tx{flex:1;min-width:0;display:flex;justify-content:space-between;align-items:center;gap:10px}
.bo-sp-lineup__player-tx b{font-family:var(--sans);font-weight:600;font-size:14px;color:var(--secondary);letter-spacing:-0.005em;overflow:hidden;text-overflow:ellipsis}
.bo-sp-lineup__pos{font-family:var(--mono);font-size:10px;color:var(--secondary);background:var(--primary-20);padding:2px 7px;border-radius:4px;font-weight:700;letter-spacing:0.04em;flex-shrink:0}

/* NBA bench — collapsed chip list */
.bo-sp-lineup__bench{margin-top:14px;border-top:1px solid var(--secondary-20);padding-top:14px}
.bo-sp-lineup__bench summary{font-family:var(--mono);font-size:11px;color:var(--secondary-60);letter-spacing:0.06em;cursor:pointer;text-transform:uppercase;list-style:none}
.bo-sp-lineup__bench summary::-webkit-details-marker{display:none}
.bo-sp-lineup__bench summary::before{content:'▸ ';color:var(--primary);font-family:var(--mono)}
.bo-sp-lineup__bench[open] summary::before{content:'▾ '}
.bo-sp-lineup__bench-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.bo-sp-lineup__bench-chip{font-family:var(--sans);font-size:11.5px;color:var(--secondary);background:#fff;border:1px solid var(--secondary-20);border-radius:999px;padding:4px 10px}

/* NFL position groups */
.bo-sp-lineup__group + .bo-sp-lineup__group{margin-top:12px}
.bo-sp-lineup__group-label{font-family:var(--mono);font-size:10px;color:var(--primary);letter-spacing:0.12em;font-weight:700;margin-bottom:6px;text-transform:uppercase}
.bo-sp-lineup__group-list{display:flex;flex-wrap:wrap;gap:5px}
.bo-sp-lineup__name{font-family:var(--sans);font-size:12.5px;color:var(--secondary);background:#fff;border:1px solid var(--secondary-20);border-radius:6px;padding:4px 10px;line-height:1.3;font-weight:500}

/* ── H2H widget ── */
.bo-sp-h2h{padding:28px}
.bo-sp-h2h__hd{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:20px;border-bottom:1px solid var(--secondary-20);padding-bottom:14px;flex-wrap:wrap}
.bo-sp-h2h__title{font-family:var(--sans);font-weight:800;font-size:22px;color:var(--secondary);margin:0;letter-spacing:-0.005em}
.bo-sp-h2h__summary{font-family:var(--mono);font-size:11.5px;color:var(--secondary-60);letter-spacing:0.04em;background:var(--paper);padding:5px 11px;border-radius:999px;font-weight:600}
.bo-sp-h2h__list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:0}
.bo-sp-h2h__item{display:grid;grid-template-columns:92px 1fr;gap:14px;padding:14px 0;border-bottom:1px solid var(--secondary-20);align-items:center}
.bo-sp-h2h__item:last-child{border-bottom:none}
.bo-sp-h2h__date{font-family:var(--mono);font-size:11px;color:var(--secondary-60);letter-spacing:0.05em;text-transform:uppercase}
.bo-sp-h2h__match{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:center}
.bo-sp-h2h__side{display:flex;align-items:center;gap:10px;min-width:0}
.bo-sp-h2h__side--home{justify-content:flex-start}
.bo-sp-h2h__side--away{justify-content:flex-end}
.bo-sp-h2h__logo{width:30px;height:30px;object-fit:contain;background:#fff;border:1px solid var(--secondary-20);border-radius:50%;padding:2px;flex-shrink:0}
.bo-sp-h2h__name{font-family:var(--sans);font-weight:600;font-size:14px;color:var(--secondary);letter-spacing:-0.005em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bo-sp-h2h__side.is-winner .bo-sp-h2h__name{font-weight:700}
.bo-sp-h2h__score{font-family:var(--sans);font-weight:700;font-size:20px;color:var(--secondary-60);display:flex;gap:8px;align-items:baseline;letter-spacing:-0.01em}
.bo-sp-h2h__score b.is-winner{color:var(--primary);font-weight:800}
.bo-sp-h2h__sep{color:var(--secondary-20);font-weight:500;font-size:16px}

/* Mobile overrides for new components */
@media (max-width:767px){
	.bo-sp-toc{padding:14px 16px}
	.bo-sp-toc__list{grid-template-columns:1fr;gap:6px}

	.bo-sp-lineup,.bo-sp-h2h{padding:20px 16px}
	.bo-sp-lineup__title,.bo-sp-h2h__title{font-size:18px}
	.bo-sp-lineup__grid{grid-template-columns:1fr;gap:12px}
	.bo-sp-lineup__side{padding:14px}
	.bo-sp-lineup__player-tx b{font-size:13.5px}

	.bo-sp-h2h__item{grid-template-columns:1fr;gap:6px}
	.bo-sp-h2h__date{order:-1}
	.bo-sp-h2h__match{grid-template-columns:1fr auto 1fr;gap:8px}
	.bo-sp-h2h__name{font-size:13px}
	.bo-sp-h2h__score{font-size:17px}
	.bo-sp-h2h__logo{width:24px;height:24px}
}

/* ════════════════════════════════════════════════════════════════════════
   Consistency Index tool page (/betting-tools/consistency-index/) — v2.38.0
   Mid-fi: extra.js#consistencyIndex. Dark hero (text + cheat-sheet legend)
   + body 2-col (rankings widget + methodology | sidebar "more tools").
   ════════════════════════════════════════════════════════════════════════ */

.bo-tool-ci{background:var(--paper)}

/* Hero */
.bo-tool-ci-hero{background:var(--secondary);color:#fff;padding:52px 24px 48px;position:relative;overflow:hidden;border-bottom:1px solid #000}
.bo-tool-ci-hero::before{content:"";position:absolute;top:-120px;right:-100px;width:420px;height:420px;border:1px solid rgba(51,204,112,0.15);border-radius:50%;pointer-events:none}
.bo-tool-ci-hero__inner{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:center;position:relative;z-index:2}
.bo-tool-ci-hero__tag{display:inline-flex;align-items:center;background:var(--primary);color:var(--secondary);font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.12em;padding:5px 11px;border-radius:3px;text-transform:uppercase}
.bo-tool-ci-hero__title{font-family:var(--sans);font-weight:800;line-height:1.05;letter-spacing:-0.02em;color:#fff;margin:14px 0 14px;font-size:clamp(32px,4vw,52px)}
/* Same specificity lift as hero__intro — OceanWP kit sets `h1{color:...}`. */
html body .bo-tool-ci-hero__title,
.bo-tool-ci .bo-tool-ci-hero .bo-tool-ci-hero__title,
body.oceanwp-theme .bo-tool-ci-hero__title{color:#fff !important}
.bo-tool-ci-hero__intro{font-family:var(--sans);font-size:17px;line-height:1.55;color:#fff;max-width:600px;margin:0 0 24px}
html body .bo-tool-ci-hero__intro,
.bo-tool-ci .bo-tool-ci-hero .bo-tool-ci-hero__intro,
body.oceanwp-theme .bo-tool-ci-hero__intro{color:#fff !important}
/* ACF-authored intro ships <p> children — target them directly so they beat
   the OceanWP inline `.oceanwp-theme p{color:#333 !important}` cascade. */
html body .bo-tool-ci-hero__intro p,
html body .bo-tool-ci-hero__intro strong,
html body .bo-tool-ci-hero__intro b,
.bo-tool-ci .bo-tool-ci-hero .bo-tool-ci-hero__intro p,
body.oceanwp-theme .bo-tool-ci-hero__intro p{color:#fff !important}
.bo-tool-ci-hero__actions{display:flex;gap:10px;flex-wrap:wrap}
.bo-tool-ci-hero__cta{display:inline-flex;align-items:center;gap:8px;background:var(--primary);color:var(--secondary) !important;padding:12px 22px;border-radius:6px;font-family:var(--sans);font-weight:700;font-size:13px;letter-spacing:0.02em;text-decoration:none;transition:transform .12s,box-shadow .15s}
.bo-tool-ci-hero__cta:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(51,204,112,0.35);color:var(--secondary);text-decoration:none}
.bo-tool-ci-hero__cta--ghost{background:transparent;color:#fff !important;border:1.5px solid rgba(255,255,255,0.3)}
.bo-tool-ci-hero__cta--ghost:hover{background:rgba(255,255,255,0.08);border-color:rgba(255,255,255,0.5);box-shadow:none;color:#fff !important}

/* Cheat-sheet legend (hero right column) */
.bo-tool-ci-legend{background:#23333c;border:1px solid #2a3b48;border-radius:12px;padding:22px}
.bo-tool-ci-legend__hd{font-family:var(--mono);font-size:11px;color:var(--primary);letter-spacing:0.12em;text-transform:uppercase;font-weight:700;margin-bottom:12px}
.bo-tool-ci-legend__row{display:grid;grid-template-columns:52px 1fr 140px;align-items:center;gap:10px;padding:6px 0}
.bo-tool-ci-legend__range{font-family:var(--mono);font-size:11px;font-weight:700;text-align:center}
.bo-tool-ci-legend__bar{display:block;height:6px;border-radius:999px}
.bo-tool-ci-legend__label{font-family:var(--sans);font-size:12px;color:rgba(255,255,255,0.75);text-align:right}

/* Body */
.bo-tool-ci-body{padding:36px 24px 64px}
.bo-tool-ci-body__inner{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 320px;gap:32px}
.bo-tool-ci-main{min-width:0}
.bo-tool-ci-main > * + *{margin-top:20px}

/* Native Consistency Rankings widget — replaces snippet 105. */
.bo-tool-ci-widget-card{background:#fff;border:1px solid var(--secondary-20);border-radius:8px;padding:0;overflow:hidden;box-shadow:0 2px 10px rgba(26,38,46,0.04)}
.bo-crw{padding:24px}
.bo-crw__hd{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding-bottom:14px;margin-bottom:16px;border-bottom:1px solid var(--secondary-20)}
/* Underline-style tab bar (modern / segmented). The container has a thin
   baseline; the active tab paints a primary-colored bar on top of it.
   All !important rules below defeat Elementor Kit's global button cascade
   which otherwise overrides padding / background / pointer-events. */
.bo-crw__tabs{display:inline-flex;background:transparent;border:0;border-bottom:2px solid var(--secondary-20);padding:0;gap:4px}
.bo-crw__tab,
button.bo-crw__tab{
	display:inline-flex !important;align-items:center;gap:10px;
	background:transparent !important;border:0 !important;
	padding:10px 18px !important;margin-bottom:-2px !important;
	font-family:var(--sans) !important;font-weight:700 !important;font-size:13px !important;
	letter-spacing:0.02em !important;color:var(--secondary-60) !important;
	cursor:pointer !important;pointer-events:auto !important;
	position:relative;border-radius:0 !important;border-bottom:2px solid transparent !important;
	transition:color .12s,border-color .12s;text-transform:none !important;
	box-shadow:none !important;line-height:1.2 !important
}
.bo-crw__tab:hover,
button.bo-crw__tab:hover{color:var(--secondary) !important;background:transparent !important}
.bo-crw__tab.is-active,
button.bo-crw__tab.is-active,
.bo-crw__tab.is-active:hover,
button.bo-crw__tab.is-active:hover{
	color:var(--secondary) !important;
	background:transparent !important;
	border-bottom:2px solid var(--primary) !important
}
.bo-crw__tab-logo{width:22px;height:22px;object-fit:contain;background:transparent;border:0;border-radius:0;padding:0;flex-shrink:0;filter:grayscale(1) opacity(0.45);transition:filter .15s}
.bo-crw__tab.is-active .bo-crw__tab-logo,
.bo-crw__tab:hover .bo-crw__tab-logo{filter:none}
.bo-crw__tab-label{letter-spacing:0.03em}
.bo-crw__updated{font-family:var(--mono);font-size:11px;color:var(--secondary-60);letter-spacing:0.04em;text-transform:uppercase}

.bo-crw__filters{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px;align-items:center}
.bo-crw__filter{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;color:var(--secondary-60);letter-spacing:0.05em;text-transform:uppercase}
.bo-crw__filter > span{flex-shrink:0;line-height:1}
/* Explicit height + line-height fix the bug where option text was anchored
   at the bottom of the select box (browser default baseline behaviour). */
.bo-crw__filter select{height:36px;line-height:1;box-sizing:border-box;border:1px solid var(--secondary-20);background:#fff;padding:0 32px 0 12px;border-radius:6px;font-family:var(--sans);font-weight:600;font-size:12.5px;color:var(--secondary);letter-spacing:0;text-transform:none;cursor:pointer;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6' fill='none' stroke='%231A262E' stroke-width='1.5'><path d='M1 1l4 4 4-4'/></svg>");background-repeat:no-repeat;background-position:right 10px center;margin:0;vertical-align:middle}
.bo-crw__filter select:focus{outline:0;border-color:var(--primary);box-shadow:0 0 0 3px rgba(51,204,112,0.12)}

/* Table (desktop) */
.bo-crw-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.bo-crw-table{width:100%;border-collapse:separate;border-spacing:0;font-family:var(--sans);font-size:13.5px;color:var(--secondary)}
.bo-crw-table thead th{text-align:left;font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:#fff;background:var(--secondary);padding:10px 12px;border:0}
.bo-crw-table thead th:first-child{padding-left:16px;border-radius:6px 0 0 0}
.bo-crw-table thead th:last-child{padding-right:16px;border-radius:0 6px 0 0}
.bo-crw-table tbody td{padding:10px 12px;border-bottom:1px solid var(--secondary-20)}
.bo-crw-table tbody td:first-child{padding-left:16px}
.bo-crw-table tbody td:last-child{padding-right:16px}
.bo-crw-table tbody tr:nth-child(even){background:var(--paper)}
.bo-crw-table tbody tr:hover{background:rgba(51,204,112,0.06)}
.bo-crw-table tbody tr[hidden]{display:none}

.bo-crw-team{display:flex;align-items:center;gap:10px;min-width:180px}
.bo-crw-rank{font-family:var(--mono);font-size:11px;font-weight:700;color:var(--secondary-60);width:22px;flex-shrink:0}
.bo-crw-logo-wrap{position:relative;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;flex-shrink:0;background:#fff;border:1px solid var(--secondary-20);border-radius:50%}
.bo-crw-logo{width:100%;height:100%;object-fit:contain;padding:2px;background:transparent;border:0;border-radius:50%}
/* Fallback badge: either set from PHP (empty URL) or swapped by onerror. */
.bo-crw-logo-init{font-family:var(--sans);font-weight:700;font-size:10.5px;color:var(--secondary);letter-spacing:0.02em;line-height:1}
.bo-crw-logo-wrap.is-fallback{background:var(--paper)}
.bo-crw-logo-wrap.is-fallback::before{content:attr(data-initials);font-family:var(--sans);font-weight:700;font-size:10.5px;color:var(--secondary);letter-spacing:0.02em}
.bo-crw-name{font-family:var(--sans);font-weight:700;font-size:13.5px;color:var(--secondary);letter-spacing:-0.005em}
.bo-crw-td-conf{color:var(--secondary-60);font-family:var(--mono);font-size:11.5px;letter-spacing:0.03em;text-transform:uppercase}
.bo-crw-th-score{text-align:left}
.bo-crw-td-score{min-width:130px}

.bo-crw-score{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono)}
.bo-crw-score-val{font-family:var(--sans);font-weight:800;font-size:14.5px;min-width:40px;letter-spacing:-0.005em}
.bo-crw-score-bar{display:inline-block;width:90px;height:6px;background:var(--paper);border:1px solid var(--secondary-20);border-radius:999px;overflow:hidden}
.bo-crw-score-bar > span{display:block;height:100%;border-radius:999px;transition:width .3s}
.bo-crw-na{color:var(--secondary-60);font-family:var(--mono);font-size:13px}
.bo-crw-lock{color:var(--secondary-20);letter-spacing:0.3em;font-family:var(--mono);font-size:14px}

/* Trust badges */
.bo-crw-badge{display:inline-flex;align-items:center;padding:3px 10px;border-radius:999px;font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase}
.bo-crw-badge--hightrust{background:rgba(51,204,112,0.14);color:#1a7f3c}
.bo-crw-badge--reliable {background:rgba(112,221,150,0.2);color:#1a7f3c}
.bo-crw-badge--volatile {background:rgba(232,169,58,0.18);color:#b37a15}
.bo-crw-badge--disruptive{background:rgba(217,72,72,0.14);color:#b3232f}
.bo-crw-badge--na       {background:var(--paper);color:var(--secondary-60);border:1px solid var(--secondary-20)}

/* Show-more toggle (appears when teams > 10) */
.bo-crw__showmore,
button.bo-crw__showmore{
	display:flex !important;align-items:center;justify-content:center;gap:8px;
	width:100%;margin-top:14px;padding:12px 16px;
	background:var(--primary) !important;color:var(--secondary) !important;
	border:0 !important;border-radius:6px !important;
	font-family:var(--sans) !important;font-weight:700 !important;font-size:13px !important;
	letter-spacing:0.02em !important;text-transform:none !important;
	cursor:pointer !important;pointer-events:auto !important;
	box-shadow:none !important;transition:transform .12s,box-shadow .15s
}
.bo-crw__showmore:hover,
button.bo-crw__showmore:hover{
	background:var(--primary) !important;color:var(--secondary) !important;
	transform:translateY(-1px);box-shadow:0 6px 18px rgba(51,204,112,0.35) !important
}
.bo-crw__chev{display:inline-block;font-family:var(--mono);transition:transform .2s}

/* Locked state footer */
.bo-crw__locked{margin-top:18px;padding:20px 22px;background:var(--paper);border:1px solid var(--secondary-20);border-radius:8px;text-align:center}
.bo-crw__locked p{margin:0 0 14px;color:var(--secondary);font-size:14px}
body .bo-crw__locked p{color:var(--secondary) !important}
.bo-crw__locked-cta{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.bo-crw__btn{display:inline-flex;align-items:center;padding:10px 20px;border-radius:6px;font-family:var(--sans);font-weight:700;font-size:13px;text-decoration:none;transition:transform .12s,box-shadow .15s,background .15s}
.bo-crw__btn--primary{background:var(--primary);color:var(--secondary) !important;border:1.5px solid var(--primary)}
.bo-crw__btn--primary:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(51,204,112,0.3);color:var(--secondary);text-decoration:none}
.bo-crw__btn--ghost{background:transparent;color:var(--secondary) !important;border:1.5px solid var(--secondary-20)}
.bo-crw__btn--ghost:hover{background:var(--secondary);color:#fff !important;border-color:var(--secondary);text-decoration:none}

/* Mobile cards (hidden on desktop) */
.bo-crw-cards{display:none;flex-direction:column;gap:10px}
.bo-crw-card{background:#fff;border:1px solid var(--secondary-20);border-radius:8px;padding:14px 16px}
.bo-crw-card[hidden]{display:none}
.bo-crw-card__hd{display:flex;align-items:center;gap:10px;justify-content:space-between}
.bo-crw-card__meta{font-family:var(--mono);font-size:10.5px;color:var(--secondary-60);letter-spacing:0.04em;text-transform:uppercase;margin:6px 0 10px}
.bo-crw-card__metrics{display:grid;grid-template-columns:1fr 1fr;gap:10px;border-top:1px solid var(--secondary-20);padding-top:10px}
.bo-crw-card__metric{display:flex;flex-direction:column;gap:4px}
.bo-crw-card__metric > span{font-family:var(--mono);font-size:10px;color:var(--secondary-60);letter-spacing:0.06em;text-transform:uppercase}

.bo-crw__panel-sep,.bo-crw-panel__meta{display:flex;align-items:center;gap:8px;padding:0 0 12px;font-family:var(--mono);font-size:11px;color:var(--secondary-60);letter-spacing:0.05em;text-transform:uppercase}
.bo-crw-panel__sport{color:var(--secondary);font-weight:700}
.bo-crw-panel__sep{opacity:0.5}

/* Mobile swap: table ↔ cards */
@media (max-width:767px){
	.bo-crw{padding:18px 14px}
	.bo-crw-table-wrap{display:none}
	.bo-crw-cards{display:flex}
	.bo-crw__hd{flex-direction:column;align-items:flex-start}
	.bo-crw__tabs{width:100%;justify-content:center}
	.bo-crw__filters{gap:8px}
	.bo-crw__filter{flex:1 1 calc(50% - 8px)}
	.bo-crw__filter select{width:100%}
}

/* Methodology prose card */
.bo-tool-ci-prose-card{background:#fff;border:1px solid var(--secondary-20);border-radius:8px;padding:28px;box-shadow:0 2px 10px rgba(26,38,46,0.04)}
.bo-tool-ci-prose{font-family:var(--sans);font-size:15.5px;line-height:1.65;color:var(--secondary)}
.bo-tool-ci-prose h2{position:relative;font-family:var(--sans);font-weight:800;font-size:22px;line-height:1.25;color:var(--secondary);margin:24px 0 14px;padding-bottom:10px;border-bottom:1px solid var(--secondary-20);letter-spacing:-0.005em}
.bo-tool-ci-prose h2:first-child{margin-top:0}
.bo-tool-ci-prose h2::before{content:"";position:absolute;left:0;bottom:-1px;width:50px;height:3px;background:var(--primary)}
.bo-tool-ci-prose h3{font-family:var(--sans);font-weight:700;font-size:17px;color:var(--secondary);margin:20px 0 8px}
.bo-tool-ci-prose p{margin:0 0 14px;color:var(--secondary);font-size:15px;line-height:1.7}
.bo-tool-ci-prose p:last-child{margin-bottom:0}
.bo-tool-ci-prose ul,.bo-tool-ci-prose ol{margin:0 0 16px 22px;padding:0}
.bo-tool-ci-prose li{margin:0 0 6px;line-height:1.65}
.bo-tool-ci-prose strong{color:var(--secondary);font-weight:700}
.bo-tool-ci-prose a{color:var(--secondary);text-decoration:underline;text-decoration-color:var(--primary);text-underline-offset:3px}
.bo-tool-ci-prose a:hover{color:var(--primary)}
html body .bo-tool-ci-prose p,html body .bo-tool-ci-prose li{color:var(--secondary) !important}

/* Sidebar */
.bo-tool-ci-side{min-width:0}
.bo-tool-ci-side__card{background:#fff;border:1px solid var(--secondary-20);border-radius:8px;padding:22px;position:sticky;top:120px;box-shadow:0 2px 10px rgba(26,38,46,0.04)}
.bo-tool-ci-side__title{font-family:var(--sans);font-weight:700;font-size:13px;color:var(--secondary-60);letter-spacing:0.05em;text-transform:uppercase;margin:0 0 14px}
.bo-tool-ci-side__list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:2px}
.bo-tool-ci-side__link{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border-radius:6px;text-decoration:none;transition:background .12s,color .12s}
.bo-tool-ci-side__link:hover{background:var(--paper);text-decoration:none}
.bo-tool-ci-side__link b{font-family:var(--sans);font-weight:700;font-size:14px;color:var(--secondary)}
.bo-tool-ci-side__link span{font-family:var(--mono);font-size:11px;color:var(--secondary-60);letter-spacing:0.02em}
.bo-tool-ci-side__link:hover b{color:var(--primary)}
.bo-tool-ci-side__all{display:inline-block;margin-top:14px;font-family:var(--mono);font-size:11px;color:var(--primary);letter-spacing:0.05em;text-decoration:none;font-weight:700}
.bo-tool-ci-side__all:hover{text-decoration:underline}

/* ── Top confidence picks widget (/betting-tools/confidence-index/) ──── */
.bo-tool-cfi-top{background:#fff;border:1px solid var(--secondary-20);border-radius:8px;padding:24px;box-shadow:0 2px 10px rgba(26,38,46,0.04);margin-bottom:20px}
.bo-tool-cfi-top__hd{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;padding-bottom:14px;margin-bottom:12px;border-bottom:1px solid var(--secondary-20)}
.bo-tool-cfi-top__title{font-family:var(--sans);font-weight:800;font-size:20px;color:var(--secondary);margin:0;letter-spacing:-0.01em}
.bo-tool-cfi-top__meta{font-family:var(--mono);font-size:11px;color:var(--secondary-60);letter-spacing:0.04em;text-transform:uppercase}
.bo-tool-cfi-top__list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.bo-tool-cfi-top__item{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;padding:14px;background:var(--paper);border:1px solid var(--secondary-20);border-radius:8px;transition:border-color .12s,transform .12s,box-shadow .15s}
.bo-tool-cfi-top__item:hover{border-color:var(--primary);transform:translateY(-1px);box-shadow:0 6px 18px rgba(26,38,46,0.08)}
.bo-tool-cfi-top__link{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;text-decoration:none;color:var(--secondary)}
.bo-tool-cfi-top__link:hover{text-decoration:none;color:var(--secondary)}

/* CI score tile (left) */
.bo-tool-cfi-top__score{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:64px;padding:10px 12px;background:#fff;border:1px solid var(--secondary-20);border-radius:8px;position:relative}
.bo-tool-cfi-top__score b{font-family:var(--sans);font-weight:800;font-size:22px;color:var(--cfi-color, var(--secondary));line-height:1;letter-spacing:-0.01em}
.bo-tool-cfi-top__score span{font-family:var(--mono);font-size:9px;color:var(--secondary-60);letter-spacing:0.05em;text-transform:uppercase}
.bo-tool-cfi-top__score-bar{display:block;width:100%;height:4px;background:var(--secondary-20);border-radius:999px;overflow:hidden;margin-top:4px}
.bo-tool-cfi-top__score-bar > span{display:block;height:100%;border-radius:999px}

/* Middle: sport chip + teams + pick + date */
.bo-tool-cfi-top__mid{min-width:0;display:flex;flex-direction:column;gap:4px}
.bo-tool-cfi-top__match{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.bo-tool-cfi-top__sport{display:inline-flex;align-items:center;background:var(--secondary);color:#fff;font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.1em;padding:3px 7px;border-radius:3px;text-transform:uppercase}
.bo-tool-cfi-top__teams{display:inline-flex;align-items:center;gap:6px;font-family:var(--sans);font-size:13.5px;color:var(--secondary)}
.bo-tool-cfi-top__teams b{font-weight:700}
.bo-tool-cfi-top__logo{width:20px;height:20px;object-fit:contain;background:#fff;border:1px solid var(--secondary-20);border-radius:50%;padding:1px;flex-shrink:0}
.bo-tool-cfi-top__vs{color:var(--secondary-60);font-family:var(--mono);font-size:10px;letter-spacing:0.08em;text-transform:uppercase}
.bo-tool-cfi-top__pick{font-family:var(--sans);font-weight:600;font-size:14px;color:var(--secondary)}
body .bo-tool-cfi-top__pick{color:var(--secondary) !important}
.bo-tool-cfi-top__date{font-family:var(--mono);font-size:10.5px;color:var(--secondary-60);letter-spacing:0.04em;text-transform:uppercase}
.bo-tool-cfi-top__arrow{font-family:var(--mono);font-size:14px;color:var(--secondary-60);flex-shrink:0;transition:transform .12s,color .12s}
.bo-tool-cfi-top__item:hover .bo-tool-cfi-top__arrow{color:var(--primary);transform:translateX(3px)}

/* Bet CTA (right) */
.bo-tool-cfi-top__bet{display:inline-flex;align-items:center;gap:6px;padding:9px 14px;background:var(--secondary);color:#fff !important;font-family:var(--sans);font-weight:700;font-size:11.5px;letter-spacing:0.02em;text-decoration:none;border-radius:6px;white-space:nowrap;flex-shrink:0;transition:transform .12s,filter .12s}
.bo-tool-cfi-top__bet:hover{transform:translateY(-1px);filter:brightness(1.08);color:#fff !important;text-decoration:none}

/* Compare-sportsbooks tool widget card */
.bo-tool-cmp-widget-card{background:#fff;border:1px solid var(--secondary-20);border-radius:8px;padding:0;overflow:hidden;box-shadow:0 2px 10px rgba(26,38,46,0.04);margin-bottom:20px}
.bo-tool-cmp-widget-card__hd{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;padding:18px 22px;border-bottom:1px solid var(--secondary-20);background:var(--paper)}
.bo-tool-cmp-widget-card__title{font-family:var(--sans);font-weight:800;font-size:18px;color:var(--secondary);margin:0;letter-spacing:-0.005em}
.bo-tool-cmp-widget-card__meta{font-family:var(--mono);font-size:11px;color:var(--secondary-60);letter-spacing:0.04em;text-transform:uppercase}
.bo-tool-cmp-widget-card__reset{font-family:var(--mono);font-size:11px;font-weight:700;color:var(--primary);letter-spacing:0.04em;text-decoration:none;text-transform:uppercase}
.bo-tool-cmp-widget-card__reset:hover{text-decoration:underline;color:var(--primary)}
.bo-tool-cmp-widget-card__body{padding:22px}
.bo-tool-cmp-widget-card__body--picker{padding:22px}
.bo-tool-cmp-widget-card__body--picker .bo-sb-compare-picker__chips{margin-bottom:14px}

/* Mobile */
@media (max-width:767px){
	.bo-tool-ci-hero{padding:32px 16px 28px}
	.bo-tool-ci-hero__inner{grid-template-columns:1fr;gap:22px}
	.bo-tool-ci-hero__intro{font-size:15px}
	.bo-tool-ci-legend{padding:16px}
	.bo-tool-ci-legend__row{grid-template-columns:52px 1fr 110px;gap:8px}
	.bo-tool-ci-legend__label{font-size:11px}
	.bo-tool-ci-body{padding:20px 12px 48px}
	.bo-tool-ci-body__inner{grid-template-columns:1fr;gap:16px}
	.bo-tool-ci-prose-card{padding:20px 16px}
	.bo-tool-ci-prose h2{font-size:19px}
	.bo-tool-ci-side__card{position:static}
	.bo-tool-ci-widget-card .bo-cr-widget{padding:16px}
	.bo-tool-cmp-widget-card__body{padding:16px}
	.bo-tool-cmp-widget-card__hd{padding:14px 16px}
	/* Top-picks widget mobile */
	.bo-tool-cfi-top{padding:18px 14px}
	.bo-tool-cfi-top__item{grid-template-columns:1fr;gap:10px;padding:12px}
	.bo-tool-cfi-top__link{grid-template-columns:auto 1fr;gap:10px}
	.bo-tool-cfi-top__arrow{display:none}
	.bo-tool-cfi-top__bet{width:100%;justify-content:center}
}


/* ═══════════════════════════════════════════════════════════════════════
 * SPORTSBOOK REVIEW — desktop (.bo-dsb-*)
 * Template: inc/single-sportsbook-review.php
 * Port of design-midfi/midfi/sportsbook-review.js, wired to real ACF data.
 * Show/hide: mobile renders `.bo-msingle--sb` (existing rules below),
 * desktop renders `.bo-dsb`; both live in the DOM, toggled at 960px.
 * ═══════════════════════════════════════════════════════════════════════ */

/* Hide mobile renderer on wide viewports, hide desktop on narrow. */
@media (min-width:960px){
	.bo-msingle.bo-msingle--sb{display:none}
}
@media (max-width:959.98px){
	.bo-dsb{display:none}
}

/* Outer wrap — reset the default OceanWP single layout so our hero can
   go edge-to-edge and the subsequent sections control their own width. */
.bo-dsb{background:#fff;color:var(--secondary);font-family:var(--sans)}
.bo-dsb-crumbs-wrap{
	max-width:1360px;margin:0 auto;padding:12px 24px 0;
	font-family:var(--mono);font-size:11px
}
.bo-dsb-crumbs-wrap .bo-crumbs{display:flex;flex-wrap:wrap;gap:4px;align-items:center}

/* ── 1. Hero ──────────────────────────────────────────────────── */
/* Bottom padding reduced from 44px → 16px (v2.44.4) to absorb the RG
   disclaimer strip added below the .bo-dsb-hero-inner grid without
   making the hero visually taller overall. */
.bo-dsb-hero{
	background:linear-gradient(135deg, var(--sb-grad-from, #1A262E) 0%, var(--sb-grad-to, #0F1820) 70%);
	color:#fff;padding:40px 24px 16px;position:relative;overflow:hidden
}
.bo-dsb-hero::before{
	content:'';position:absolute;inset:0;pointer-events:none;
	background:radial-gradient(circle at 80% 0%, rgba(255,255,255,0.08) 0%, transparent 50%)
}
.bo-dsb-hero-inner{
	max-width:1360px;margin:0 auto;
	display:grid;grid-template-columns:1fr 340px;gap:40px;align-items:center;position:relative
}
.bo-dsb-hero-main{display:flex;gap:28px;align-items:center}
/* Logo tile — solid white so brand logos (often coloured + on transparent)
   pop against the dark brand-tinted hero gradient. */
.bo-dsb-hero-logo{
	width:110px;height:110px;flex-shrink:0;
	background:#fff;border:1px solid rgba(255,255,255,0.35);
	border-radius:16px;padding:14px;
	display:flex;align-items:center;justify-content:center;
	box-shadow:0 6px 20px rgba(0,0,0,0.15)
}
.bo-dsb-hero-logo img{max-width:100%;max-height:100%;object-fit:contain}
.bo-dsb-hero-logo-fallback{
	font-family:var(--sans);font-weight:800;font-size:28px;letter-spacing:-0.02em;
	color:var(--secondary)
}
.bo-dsb-hero-info{flex:1;min-width:0}
.bo-dsb-hero-tags{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.bo-dsb-hero-tags .bo-tag--solid{
	background:var(--primary);color:var(--secondary);
	font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.08em;
	padding:5px 10px;border-radius:4px
}
.bo-dsb-hero-stars{font-family:var(--mono);font-size:12px;color:#fff !important;letter-spacing:0.04em}

/* Hero text in white — boost specificity to beat OceanWP's heading color
   tokens + the `.oceanwp-theme p{color:#333 !important}` cascade. Same
   crush strategy as the single-pick + playbook hero. */
.bo-dsb-hero-title{
	font-family:var(--sans);font-weight:800;font-size:40px;line-height:1.05;letter-spacing:-0.02em;
	margin:4px 0 10px;color:#fff
}
html body .bo-dsb-hero h1.bo-dsb-hero-title,
html body .bo-dsb .bo-dsb-hero-title,
body.oceanwp-theme .bo-dsb-hero-title{color:#fff !important}
.bo-dsb-hero-lead{
	margin:0;color:rgba(255,255,255,0.9);font-size:16px;line-height:1.5;max-width:620px
}
html body .bo-dsb-hero p.bo-dsb-hero-lead,
html body .bo-dsb .bo-dsb-hero-lead,
body.oceanwp-theme .bo-dsb-hero .bo-dsb-hero-lead{color:rgba(255,255,255,0.9) !important}

/* Offer card on the right */
.bo-dsb-hero-offer{
	background:#fff;color:var(--secondary);
	border-radius:12px;padding:22px;text-align:center;
	box-shadow:0 10px 30px rgba(0,0,0,0.18)
}
.bo-dsb-hero-offer__eyebrow{
	font-family:var(--mono);font-size:11px;letter-spacing:0.1em;color:var(--secondary-60);font-weight:700
}
.bo-dsb-hero-offer__bonus{
	font-family:var(--sans);font-weight:800;font-size:22px;line-height:1.2;margin:6px 0 2px;letter-spacing:-0.01em
}
.bo-dsb-hero-offer__sub{font-family:var(--mono);font-size:11px;color:var(--secondary-60);margin-bottom:14px}
.bo-dsb-hero-offer__code{
	font-family:var(--mono);font-size:12px;color:var(--secondary);
	background:var(--paper);border:1px dashed var(--secondary-20);
	padding:8px 10px;border-radius:4px;margin-bottom:12px;letter-spacing:0.04em
}
.bo-dsb-hero-offer__code b{letter-spacing:0.1em}
.bo-dsb-hero-offer__cta{
	display:block;width:100%;padding:14px;
	background:var(--primary);color:var(--secondary);
	border-radius:6px;font-family:var(--sans);font-weight:700;font-size:14px;
	text-decoration:none;letter-spacing:0.02em;text-align:center;
	transition:transform .15s, box-shadow .15s
}
.bo-dsb-hero-offer__cta:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(51,204,112,0.3)}
.bo-dsb-hero-offer__foot{font-family:var(--mono);font-size:10px;color:var(--secondary-60);margin-top:10px}

/* ── 1b. Hero RG disclaimer strip ─────────────────────────────
   Full-width band at the bottom of the hero gradient carrying the
   21+ badge + "Gamble responsibly" + 1-800-GAMBLER link. Visible
   above the fold on every sportsbook review for legal compliance.
   v2.44.4: compacted (margin-top 28→16, padding 14→10, font 12→11.5)
   to fit inside the hero without expanding total vertical footprint;
   hero bottom padding reduced in tandem (44→16). */
.bo-dsb-hero-rg{
	margin-top:16px;
	padding:10px 0 2px;
	border-top:1px solid rgba(255,255,255,0.15);
	position:relative
}
.bo-dsb-hero-rg__inner{
	max-width:1360px;margin:0 auto;padding:0 4px;
	display:flex;align-items:center;gap:10px;flex-wrap:wrap
}
.bo-dsb-hero-rg__age{
	flex-shrink:0;
	background:rgba(255,255,255,0.14);
	border:1px solid rgba(255,255,255,0.4);
	color:#fff;
	padding:3px 8px;border-radius:3px;
	font-family:var(--mono);font-weight:800;font-size:10.5px;letter-spacing:0.08em
}
.bo-dsb-hero-rg__icon{color:rgba(255,255,255,0.7);flex-shrink:0}
.bo-dsb-hero-rg__text{
	font-family:var(--sans);font-size:11.5px;line-height:1.45;
	color:rgba(255,255,255,0.85);flex:1;min-width:0
}
.bo-dsb-hero-rg__text b{color:#fff;font-weight:700}
.bo-dsb-hero-rg__text a{color:#fff;text-decoration:underline;text-underline-offset:2px}
.bo-dsb-hero-rg__text a:hover{color:var(--primary)}

/* Tighten even more on narrow desktop so the strip wraps cleanly. */
@media (max-width:960px){
	.bo-dsb-hero-rg{margin-top:14px;padding-top:9px}
	.bo-dsb-hero-rg__text{font-size:11px;line-height:1.4}
}

/* ── 2. Sticky nav chips ──────────────────────────────────────── */
.bo-dsb-nav{
	position:sticky;top:0;z-index:20;
	background:var(--paper);border-bottom:1px solid var(--secondary-20);
	padding:10px 24px
}
.bo-dsb-nav-inner{
	max-width:1360px;margin:0 auto;
	display:flex;gap:6px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none
}
.bo-dsb-nav-inner::-webkit-scrollbar{display:none}
.bo-dsb-nav__chip{
	white-space:nowrap;
	padding:8px 14px;
	background:#fff;border:1px solid var(--secondary-20);border-radius:999px;
	font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.04em;
	color:var(--secondary-60);text-decoration:none;
	transition:all .15s ease
}
.bo-dsb-nav__chip:hover{border-color:var(--primary);color:var(--primary)}
.bo-dsb-nav__chip.is-active{background:var(--primary);border-color:var(--primary);color:var(--secondary)}

/* ── 3+. Main grid ────────────────────────────────────────────── */
.bo-dsb-body{padding:40px 24px}
.bo-dsb-grid{
	max-width:1360px;margin:0 auto;
	display:grid;grid-template-columns:1fr 320px;gap:40px;align-items:start
}

/* Common card wrapper */
.bo-dsb-card{
	background:#fff;border:1px solid var(--secondary-20);border-radius:10px;
	padding:28px 32px;margin-bottom:22px
}
.bo-dsb-card > h2{
	font-family:var(--sans);font-weight:800;font-size:24px;line-height:1.2;
	letter-spacing:-0.01em;margin:0 0 18px;color:var(--secondary);scroll-margin-top:140px
}

/* Prose inside cards */
.bo-dsb-prose{font-size:16px;line-height:1.65;color:var(--secondary)}
.bo-dsb-prose > :first-child{margin-top:0}
.bo-dsb-prose h2{margin-top:0}
.bo-dsb-prose h3{
	font-family:var(--sans);font-weight:700;font-size:19px;line-height:1.25;
	margin:24px 0 10px;color:var(--secondary)
}
.bo-dsb-prose p{margin:0 0 14px;color:var(--secondary)}
.bo-dsb-prose ul,
.bo-dsb-prose ol{padding-left:22px;margin:0 0 16px}
.bo-dsb-prose ul li,
.bo-dsb-prose ol li{margin-bottom:7px;line-height:1.55}
.bo-dsb-prose a{color:var(--primary);text-decoration:underline;text-underline-offset:3px}
.bo-dsb-prose strong,.bo-dsb-prose b{font-weight:700;color:var(--secondary)}
/* Crush OceanWP p color */
html body .bo-dsb-prose p,
html body .bo-dsb-prose li,
body.oceanwp-theme .bo-dsb-prose p{color:var(--secondary) !important}

/* ── 3a. Stats grid (4 cols) ──────────────────────────────────── */
.bo-dsb-stats{
	display:grid;grid-template-columns:repeat(4, 1fr);gap:14px;margin-bottom:20px
}
.bo-dsb-stat{
	background:#fff;border:1px solid var(--secondary-20);border-radius:10px;
	padding:20px 18px;text-align:center
}
.bo-dsb-stat__label{
	font-family:var(--mono);font-size:10px;color:var(--secondary-60);
	letter-spacing:0.08em;font-weight:700;margin-bottom:6px
}
.bo-dsb-stat__value{
	font-family:var(--sans);font-weight:800;font-size:32px;color:var(--primary);line-height:1;letter-spacing:-0.01em
}
.bo-dsb-stat__desc{font-size:12px;color:var(--secondary-60);margin-top:6px}

/* ── 3b. Feature chips row ────────────────────────────────────── */
.bo-dsb-chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}
.bo-dsb-chip{
	display:inline-flex;align-items:center;gap:5px;
	padding:7px 12px;
	background:var(--paper);border:1px solid var(--secondary-20);border-radius:999px;
	font-family:var(--mono);font-size:11px;font-weight:700;color:var(--secondary);letter-spacing:0.03em
}
.bo-dsb-chip b{letter-spacing:0.01em}
.bo-dsb-chip.is-on{background:var(--primary-tint);border-color:var(--primary-60);color:var(--secondary)}
.bo-dsb-chip.is-off{color:var(--secondary-60)}

/* ── 6. Pros & Cons grid ──────────────────────────────────────── */
.bo-dsb-pc-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.bo-dsb-pc-col{
	background:var(--paper);border:1px solid var(--secondary-20);
	border-radius:8px;padding:18px 20px
}
.bo-dsb-pc-col--pros{background:rgba(51,204,112,0.06);border-color:rgba(51,204,112,0.3)}
.bo-dsb-pc-col--cons{background:rgba(217,72,72,0.04);border-color:rgba(217,72,72,0.25)}
.bo-dsb-pc-head{
	display:flex;align-items:center;gap:8px;
	font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.06em;
	text-transform:uppercase;margin-bottom:12px
}
.bo-dsb-pc-col--pros .bo-dsb-pc-head{color:var(--primary)}
.bo-dsb-pc-col--cons .bo-dsb-pc-head{color:var(--danger)}
.bo-dsb-pc-mark{
	width:22px;height:22px;border-radius:50%;
	display:inline-flex;align-items:center;justify-content:center;
	font-size:12px;font-family:var(--sans);font-weight:800
}
.bo-dsb-pc-col--pros .bo-dsb-pc-mark{background:var(--primary);color:var(--secondary)}
.bo-dsb-pc-col--cons .bo-dsb-pc-mark{background:var(--danger);color:#fff}
.bo-dsb-pc-col ul{list-style:none;margin:0;padding:0}
.bo-dsb-pc-col li{
	padding:6px 0 6px 22px;font-size:14px;line-height:1.5;color:var(--secondary);
	position:relative
}
.bo-dsb-pc-col li::before{
	content:'';position:absolute;left:0;top:12px;
	width:10px;height:10px
}
.bo-dsb-pc-col--pros li::before{
	border-left:2px solid var(--primary);border-bottom:2px solid var(--primary);
	transform:rotate(-45deg);top:10px;height:5px;width:9px
}
.bo-dsb-pc-col--cons li::before{
	background:var(--danger);mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 10 10' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1 L9 9 M9 1 L1 9' stroke='black' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;
	-webkit-mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 10 10' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1 L9 9 M9 1 L1 9' stroke='black' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* ── 7. Comparison table ──────────────────────────────────────── */
.bo-dsb-cmp-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.bo-dsb-cmp{width:100%;border-collapse:collapse;font-family:var(--sans);font-size:14px}
.bo-dsb-cmp th{
	text-align:left;padding:12px 14px;
	border-bottom:2px solid var(--secondary-20);
	font-family:var(--mono);font-size:11px;letter-spacing:0.06em;color:var(--secondary-60);
	text-transform:uppercase;font-weight:700
}
.bo-dsb-cmp td{padding:14px;border-bottom:1px solid var(--secondary-20);vertical-align:middle}
.bo-dsb-cmp tr.is-current td{background:var(--primary-tint);font-weight:600}
.bo-dsb-cmp-book{display:inline-flex;align-items:center;gap:10px;color:var(--secondary);text-decoration:none}
.bo-dsb-cmp-book:hover{color:var(--primary)}
.bo-dsb-cmp-book__badge{
	width:32px;height:32px;border-radius:6px;
	display:inline-flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-weight:800;font-size:12px;flex-shrink:0
}
.bo-dsb-cmp-book__you{
	margin-left:6px;padding:2px 6px;
	background:var(--primary);color:var(--secondary);border-radius:3px;
	font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.06em
}

/* ── 5b. Promo code box ───────────────────────────────────────── */
.bo-dsb-codebox{
	display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;
	background:var(--paper);border:1px dashed var(--primary);border-radius:8px;
	padding:14px 18px;margin-top:16px
}
.bo-dsb-codebox__label{font-family:var(--mono);font-size:10px;color:var(--secondary-60);letter-spacing:0.08em;font-weight:700}
.bo-dsb-codebox__value{
	font-family:var(--mono);font-weight:800;font-size:20px;color:var(--secondary);letter-spacing:0.08em
}
.bo-dsb-codebox__cta{
	padding:10px 16px;background:var(--primary);color:var(--secondary);
	border-radius:4px;font-family:var(--sans);font-weight:700;font-size:13px;
	text-decoration:none;white-space:nowrap
}

/* ── 5d. Payment methods ──────────────────────────────────────── */
.bo-dsb-pm{margin-top:18px;padding-top:18px;border-top:1px solid var(--secondary-20)}
.bo-dsb-pm__label{font-family:var(--mono);font-size:11px;color:var(--secondary-60);letter-spacing:0.05em;font-weight:700;margin-bottom:10px;text-transform:uppercase}
.bo-dsb-pm__chips{display:flex;gap:6px;flex-wrap:wrap}
.bo-dsb-pm__chip{
	padding:6px 12px;background:#fff;border:1px solid var(--secondary-20);border-radius:4px;
	font-family:var(--mono);font-size:11px;font-weight:600;color:var(--secondary)
}

/* ── 8. Available states grid ─────────────────────────────────── */
.bo-dsb-states-lead{font-size:14px;color:var(--secondary-60);margin:0 0 16px}
.bo-dsb-states{display:flex;flex-wrap:wrap;gap:6px}
.bo-dsb-states__chip{
	padding:6px 10px;background:var(--paper);border:1px solid var(--secondary-20);border-radius:4px;
	font-family:var(--mono);font-size:11px;font-weight:700;color:var(--secondary);letter-spacing:0.04em
}

/* ── 12. RG disclaimer ────────────────────────────────────────── */
.bo-dsb-rg{
	background:var(--paper);border:1px solid var(--secondary-20);border-radius:8px;
	padding:18px 22px;margin-top:24px
}
.bo-dsb-rg__title{font-family:var(--sans);font-weight:700;font-size:13px;color:var(--secondary);margin-bottom:6px;text-transform:uppercase;letter-spacing:0.05em}
.bo-dsb-rg p{margin:0;font-size:13px;line-height:1.55;color:var(--secondary-60)}
.bo-dsb-rg a{color:var(--primary);text-decoration:underline}

/* ── Sidebar ──────────────────────────────────────────────────── */
.bo-dsb-side{position:sticky;top:80px;align-self:start;display:flex;flex-direction:column;gap:16px}

.bo-dsb-side-cta{
	background:#fff;border:1px solid var(--secondary-20);border-radius:10px;
	padding:22px;text-align:center
}
.bo-dsb-side-cta__logo{
	width:72px;height:72px;margin:0 auto 12px;
	border-radius:12px;object-fit:contain;background:var(--paper);padding:10px;display:block
}
.bo-dsb-side-cta__logo--text{
	display:flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-weight:800;font-size:22px;letter-spacing:-0.02em;
	padding:0
}
.bo-dsb-side-cta__name{display:block;font-family:var(--sans);font-weight:800;font-size:17px;color:var(--secondary)}
.bo-dsb-side-cta__rating{font-family:var(--mono);font-size:11px;color:var(--secondary-60);margin:6px 0 12px;letter-spacing:0.03em}
.bo-dsb-side-cta__bonus{
	background:var(--paper);border-radius:4px;padding:10px 12px;margin:0 0 14px;
	font-family:var(--sans);font-weight:700;font-size:13px;color:var(--secondary);line-height:1.3
}
.bo-dsb-side-cta__btn{
	display:block;padding:12px 16px;background:var(--primary);color:var(--secondary);
	border-radius:6px;font-family:var(--sans);font-weight:700;font-size:14px;
	text-decoration:none;transition:transform .15s, box-shadow .15s
}
.bo-dsb-side-cta__btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(51,204,112,0.3)}
.bo-dsb-side-cta__foot{font-family:var(--mono);font-size:10px;color:var(--secondary-60);margin-top:10px}

.bo-dsb-side-compare,
.bo-dsb-side-facts{
	background:#fff;border:1px solid var(--secondary-20);border-radius:10px;padding:18px 20px
}
.bo-dsb-side-compare h4,
.bo-dsb-side-facts h4{
	font-family:var(--sans);font-weight:700;font-size:13px;color:var(--secondary);
	text-transform:uppercase;letter-spacing:0.06em;margin:0 0 12px;
	padding-bottom:10px;border-bottom:1px solid var(--secondary-20)
}
.bo-dsb-side-compare__row{
	display:flex;gap:12px;align-items:center;padding:10px 0;
	color:var(--secondary);text-decoration:none;border-bottom:1px solid var(--secondary-20);
	transition:color .12s
}
.bo-dsb-side-compare__row:last-child{border-bottom:0}
.bo-dsb-side-compare__row:hover{color:var(--primary)}
.bo-dsb-side-compare__badge{
	width:36px;height:36px;border-radius:6px;
	display:flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-weight:800;font-size:12px;letter-spacing:-0.01em;flex-shrink:0
}
.bo-dsb-side-compare__tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.bo-dsb-side-compare__tx b{font-family:var(--sans);font-weight:700;font-size:14px}
.bo-dsb-side-compare__tx span{font-family:var(--mono);font-size:10px;color:var(--secondary-60);letter-spacing:0.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bo-dsb-side-compare__arrow{color:var(--secondary-60);font-size:13px;flex-shrink:0}
.bo-dsb-side-compare__row:hover .bo-dsb-side-compare__arrow{color:var(--primary)}

.bo-dsb-side-facts dl{margin:0}
.bo-dsb-side-facts dl > div{
	display:flex;justify-content:space-between;align-items:center;
	padding:9px 0;border-bottom:1px solid var(--secondary-20);font-size:13px
}
.bo-dsb-side-facts dl > div:last-child{border-bottom:0}
.bo-dsb-side-facts dt{font-family:var(--mono);font-size:11px;color:var(--secondary-60);letter-spacing:0.04em}
.bo-dsb-side-facts dd{margin:0;font-family:var(--sans);font-weight:700;font-size:13px;color:var(--secondary)}

/* ── Responsive: mid-desktop / small-desktop squeeze ─────────── */
@media (max-width:1200px){
	.bo-dsb-grid{grid-template-columns:1fr 280px;gap:28px}
	.bo-dsb-hero-inner{grid-template-columns:1fr 300px;gap:28px}
	.bo-dsb-hero-title{font-size:34px}
	.bo-dsb-stats{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:960px){
	/* Below this, the mobile renderer takes over — bo_msingle--sb. */
	.bo-dsb{display:none}
}

/* ═══════════════════════════════════════════════════════════════════
 * Mobile sportsbook review — added sections for parity with desktop
 * (v2.44.1): feature chips, welcome offer code box, sign-up collapsible,
 * banking card, mini comparison list, RG disclaimer.
 * ═══════════════════════════════════════════════════════════════════ */

/* Feature chips row */
.bo-msingle-sb-chips{
	display:flex;gap:6px;flex-wrap:wrap;padding:12px 16px 6px
}
.bo-msingle-sb-chip{
	display:inline-flex;align-items:center;gap:4px;
	padding:5px 10px;
	background:var(--paper);border:1px solid var(--secondary-20);border-radius:999px;
	font-family:var(--mono);font-size:10px;font-weight:700;color:var(--secondary);letter-spacing:0.03em
}
.bo-msingle-sb-chip.is-on{background:var(--primary-tint);border-color:var(--primary-60);color:var(--secondary)}
.bo-msingle-sb-chip.is-off{color:var(--secondary-60)}
.bo-msingle-sb-chip b{letter-spacing:0.01em}

/* Promo code box (inside welcome-offer card) */
.bo-msingle-sb-codebox{
	display:flex;align-items:center;gap:10px;
	background:var(--paper);border:1px dashed var(--primary);border-radius:8px;
	padding:10px 12px;margin-top:10px
}
.bo-msingle-sb-codebox > div{flex:1}
.bo-msingle-sb-codebox__value{
	font-family:var(--mono);font-weight:800;font-size:15px;color:var(--secondary);letter-spacing:0.06em
}
.bo-msingle-sb-codebox .bo-msb-btn{padding:8px 12px;font-size:11px;flex:0 0 auto}

/* Sign-up collapsible */
.bo-msingle-sb-expand{
	background:#fff;border:1px solid var(--secondary-20);border-radius:10px;overflow:hidden
}
.bo-msingle-sb-expand[open]{border-color:var(--primary)}
.bo-msingle-sb-expand summary{
	list-style:none;cursor:pointer;user-select:none;
	padding:14px 16px;
	font-family:var(--sans);font-weight:700;font-size:14px;color:var(--secondary);
	display:flex;justify-content:space-between;align-items:center
}
.bo-msingle-sb-expand summary::-webkit-details-marker{display:none}
.bo-msingle-sb-expand summary::after{
	content:'';width:8px;height:8px;
	border-right:2px solid var(--secondary-60);border-bottom:2px solid var(--secondary-60);
	transform:rotate(45deg);transition:transform .2s
}
.bo-msingle-sb-expand[open] summary::after{transform:rotate(-135deg);border-color:var(--primary)}
.bo-msingle-sb-expand .bo-msingle-sb-editorial{padding:4px 16px 14px;font-size:13.5px;line-height:1.55;color:var(--secondary)}

/* Payment methods chips inside banking card */
.bo-msingle-sb-pm{margin-top:12px}
.bo-msingle-sb-pm__chips{display:flex;gap:5px;flex-wrap:wrap;margin-top:6px}
.bo-msingle-sb-pm__chips span{
	padding:5px 10px;background:var(--paper);border:1px solid var(--secondary-20);border-radius:4px;
	font-family:var(--mono);font-size:10px;font-weight:600;color:var(--secondary)
}

/* Key facts dl inside banking card */
.bo-msingle-sb-facts{margin:12px 0 0;padding-top:12px;border-top:1px solid var(--secondary-20)}
.bo-msingle-sb-facts > div{
	display:flex;justify-content:space-between;padding:6px 0;
	font-size:12px;border-bottom:1px solid rgba(199,204,207,0.35)
}
.bo-msingle-sb-facts > div:last-child{border-bottom:0}
.bo-msingle-sb-facts dt{font-family:var(--mono);font-size:10px;color:var(--secondary-60);letter-spacing:0.04em;margin:0}
.bo-msingle-sb-facts dd{margin:0;font-family:var(--sans);font-weight:700;font-size:12px;color:var(--secondary)}

/* Mini comparison list */
.bo-msingle-sb-cmp{background:#fff;border:1px solid var(--secondary-20);border-radius:10px;overflow:hidden}
.bo-msingle-sb-cmp__row{
	display:flex;gap:10px;align-items:center;
	padding:12px 14px;
	color:var(--secondary);text-decoration:none;
	border-bottom:1px solid var(--secondary-20)
}
.bo-msingle-sb-cmp__row:last-child{border-bottom:0}
.bo-msingle-sb-cmp__row.is-current{background:var(--primary-tint)}
.bo-msingle-sb-cmp__badge{
	width:36px;height:36px;flex-shrink:0;border-radius:6px;
	display:flex;align-items:center;justify-content:center;
	font-family:var(--sans);font-weight:800;font-size:12px
}
.bo-msingle-sb-cmp__tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.bo-msingle-sb-cmp__tx b{font-family:var(--sans);font-weight:700;font-size:13px}
.bo-msingle-sb-cmp__tx span{font-family:var(--mono);font-size:10px;color:var(--secondary-60);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bo-msingle-sb-cmp__row svg{color:var(--secondary-60);flex-shrink:0}

/* RG disclaimer (mobile) */
.bo-msingle-sb-rg{
	background:var(--paper);border:1px solid var(--secondary-20);border-radius:10px;
	padding:14px 16px;font-size:11.5px;line-height:1.5;color:var(--secondary-60)
}
.bo-msingle-sb-rg b{color:var(--secondary)}
.bo-msingle-sb-rg a{color:var(--primary);text-decoration:underline}

/* FAQ accordion on mobile — reuse the .pb-faq / v2.43.6 accordion that
   already targets `.bo-msingle-body details`. Add a subtle tweak: the
   sb-faq block sits inside `.bo-msingle-body` as well, so the existing
   rules already apply. Just ensure the card background is correct. */
.bo-msingle-sb-faq{background:#fff;border-radius:10px;padding:12px 14px;border:1px solid var(--secondary-20)}
.bo-msingle-sb-faq details{margin:0 0 6px;border:1px solid var(--secondary-20);border-radius:8px;background:#fff}
.bo-msingle-sb-faq details[open]{border-color:var(--primary)}
.bo-msingle-sb-faq details summary{padding:12px 14px;font-size:14px;font-weight:700}
.bo-msingle-sb-faq .pb-faq__answer{padding:10px 14px 14px 44px;font-size:13.5px}


/* ════════════════════════════════════════════════════════════════════
   v2.50.3 — BNAV + SINGLE-PICK MOBILE TWEAKS
   ════════════════════════════════════════════════════════════════════ */

/* ── Popover: defensive layering + clip guard ──
   The popover lives inside `.bo-bnav` which has `backdrop-filter`. Some
   browsers treat that as a stacking + clipping context. Make sure the
   popover wrap never clips and the popover itself sits above everything
   else in the bnav stacking context. */
.bo-bnav-item-wrap { overflow: visible !important; contain: none !important; }
.bo-bnav { overflow: visible !important; }
.bo-bnav-popover { z-index: 200; }
/* When open, bypass any transform-based "slide in" offset for the
   initial paint so the popover is fully visible even if the transition
   glitches (Safari sometimes leaves the pre-transition transform stuck). */
.bo-bnav-popover.is-open {
	visibility: visible !important;
	opacity: 1 !important;
	pointer-events: auto !important;
}

/* ── Single pick pages: stack sticky CTA ABOVE the bnav pill (v2.50.5) ──
   The live renderer is bo_render_desktop_single_pick (inc/single-pick.php)
   which outputs `.bo-sp-sticky-cta` — NOT `.bo-mpick-sticky-cta` (which is
   the old mobile-only renderer, not used on current single pick pages).
   Previous fix targeted the wrong class.

   v2.50.5:
     - bnav stays at universal bottom:max(12px, safe-area)
     - .bo-sp-sticky-cta sits above bnav: bottom:calc(80px + safe-area + 4px)
     - CTA matches the bnav pill width (12px side margins) so the two
       stacked elements feel like one coherent bottom shelf. */
@media (max-width: 767px) {
	body.single-nba-predictions .bo-sp-sticky-cta,
	body.single-nfl-predictions .bo-sp-sticky-cta,
	body.single-mls-picks .bo-sp-sticky-cta {
		bottom: calc(80px + env(safe-area-inset-bottom) + 4px) !important;
		left: 12px !important;
		right: 12px !important;
		z-index: 39 !important; /* one below bnav (40) so bnav can float over CTA edge if needed */
	}
	body.single-nba-predictions,
	body.single-nfl-predictions,
	body.single-mls-picks {
		/* Reserve: CTA (~60px) + bnav (~68px) + safe-area + gaps. */
		padding-bottom: calc(160px + env(safe-area-inset-bottom)) !important;
	}
	body.single-nba-predictions .bo-bnav,
	body.single-nfl-predictions .bo-bnav,
	body.single-mls-picks .bo-bnav {
		/* Bnav keeps its universal bottom position — the CTA floats above it. */
		bottom: max(12px, env(safe-area-inset-bottom)) !important;
	}
}

/* ── HUB popover alignment (v2.50.4) ──
   The HUB trigger is the LEFTMOST bnav item. With the default popover
   positioning (left:50% + translateX(-50%)) the popover extends ~110px to
   the left of the HUB button center — off the viewport on a 375px screen.
   Anchor the HUB popover to the left edge of the bnav pill instead, and
   move the down-arrow to point at the HUB button center (~36px from the
   bnav-pill left edge, matching the HUB item's horizontal center). */
#bo-bnav-hub-menu {
	left: 0 !important;
	/* Replace the default centering transform on both states.
	   Keeping the slide-down animation (8px → 0 on open). */
	transform: translateX(0) translateY(8px) !important;
}
#bo-bnav-hub-menu.is-open {
	transform: translateX(0) translateY(0) !important;
}
#bo-bnav-hub-menu::after {
	/* Arrow points at the HUB icon center, not the popover center. */
	left: 36px !important;
	transform: rotate(45deg) !important;
}

/* ── Single pick pages: nuclear right-overflow guard (v2.50.5) ──
   Correct target: the live renderer uses .bo-sp-* classes, not Elementor
   widgets. Clamp every major content container to the viewport width, let
   long words wrap, and clip any residual overflow at body level. */
@media (max-width: 767px) {
	body.single-nba-predictions .bo-sp,
	body.single-nfl-predictions .bo-sp,
	body.single-mls-picks .bo-sp,
	body.single-nba-predictions .bo-sp-body,
	body.single-nfl-predictions .bo-sp-body,
	body.single-mls-picks .bo-sp-body,
	body.single-nba-predictions .bo-sp-grid,
	body.single-nfl-predictions .bo-sp-grid,
	body.single-mls-picks .bo-sp-grid,
	body.single-nba-predictions .bo-sp-main,
	body.single-nfl-predictions .bo-sp-main,
	body.single-mls-picks .bo-sp-main,
	body.single-nba-predictions .bo-sp-side,
	body.single-nfl-predictions .bo-sp-side,
	body.single-mls-picks .bo-sp-side {
		max-width: 100% !important;
		min-width: 0 !important;
		overflow-x: hidden;
	}
	body.single-nba-predictions .bo-sp p,
	body.single-nfl-predictions .bo-sp p,
	body.single-mls-picks .bo-sp p,
	body.single-nba-predictions .bo-sp-prose,
	body.single-nfl-predictions .bo-sp-prose,
	body.single-mls-picks .bo-sp-prose,
	body.single-nba-predictions .bo-sp-prose *,
	body.single-nfl-predictions .bo-sp-prose *,
	body.single-mls-picks .bo-sp-prose * {
		overflow-wrap: anywhere;
		word-break: break-word;
		min-width: 0;
	}
	body.single-nba-predictions img,
	body.single-nfl-predictions img,
	body.single-mls-picks img,
	body.single-nba-predictions table,
	body.single-nfl-predictions table,
	body.single-mls-picks table {
		max-width: 100% !important;
	}
	body.single-nba-predictions,
	body.single-nfl-predictions,
	body.single-mls-picks,
	html:has(body.single-nba-predictions),
	html:has(body.single-nfl-predictions),
	html:has(body.single-mls-picks) {
		overflow-x: hidden !important;
	}
}

/* ── Soccer picks archive: restore the right-overflow guard (v2.50.3) ──
   MLS team names are long ("Vancouver Whitecaps", "Los Angeles Galaxy",
   "Sporting Kansas City"). Without explicit min-width:0 + word-wrap on
   the banner-row grid children, Chrome lets the title column push past
   the 108px bet column, clipping content on the right edge. Defensive
   rules here so the regression can't sneak back in. */
@media (max-width: 767px) {
	.bo-mpicks-feed .bo-pa-row {
		max-width: 100%;
	}
	.bo-mpicks-feed .bo-pa-row__main,
	.bo-mpicks-feed .bo-pa-row__conf,
	.bo-mpicks-feed .bo-pa-row__read {
		min-width: 0;
	}
	.bo-mpicks-feed .bo-pa-row__title,
	.bo-mpicks-feed .bo-pa-row__note,
	.bo-mpicks-feed .bo-pa-row__pick {
		overflow-wrap: anywhere;
		word-break: break-word;
	}
}
