:root{--rd-red:#d4202f;--rd-red-grad-a:#e23142;--rd-red-grad-b:#c41626;--rd-red-tint:#fdecee;--rd-down:#e0566b;--rd-up:#2fa66a;--rd-gold:#f5a623;--rd-kalshi:#16c98d;--rd-ink:#1d1d1f;--rd-body:#2f2f34;--rd-muted:#6e6e73;--rd-subtle:#86868b;--rd-faint:#a1a1a6;--rd-disabled:#b0b0b5;--rd-canvas:#eef0f3;--rd-content:#fbfbfd;--rd-tint:#f5f5f7;--rd-tint2:#fbfbfc;--rd-card-border:#ececef;--rd-hairline:#f0f0f3;--rd-hairline2:#f4f4f6;--rd-rule:#e8e8ed;--rd-dark:#2e2e33;--rd-font:-apple-system,BlinkMacSystemFont,'SF Pro Display',system-ui,'Helvetica Neue',sans-serif;--rd-radius-card:14px;--rd-radius-inner:12px;--rd-radius-pill:11px;--rd-shadow:0 4px 20px rgba(20,23,28,.08);--rd-shadow-hover:0 8px 26px rgba(20,23,28,.12)}body.rd{margin:0;background:var(--rd-canvas);font-family:var(--rd-font);color:var(--rd-ink);-webkit-font-smoothing:antialiased}body.rd a{color:inherit;text-decoration:none}body.rd .flex-header,body.rd .flex-nav,body.rd #mobile-search-box,body.rd #bottom-container{display:none}.rd-canvas{min-height:100vh;background:var(--rd-canvas);padding:0 20px 28px;box-sizing:border-box}.rd-card{max-width:1180px;margin:0 auto;background:#fff;border-radius:0 0 var(--rd-radius-card) var(--rd-radius-card);box-shadow:var(--rd-shadow);overflow:hidden}.rd-header{display:flex;align-items:center;gap:16px;padding:20px 28px;border-bottom:1px solid var(--rd-hairline);background:#fff;text-align:left}.rd-logo-tile{width:40px;height:40px;flex:none;border-radius:var(--rd-radius-pill);background:linear-gradient(135deg,var(--rd-red-grad-a),var(--rd-red-grad-b));display:flex;align-items:center;justify-content:center}.rd-logo-img{width:30px;height:30px;object-fit:contain;display:block}.rd-wordmark{font-size:22px;font-weight:700;letter-spacing:-.7px;color:var(--rd-ink);line-height:1}.rd-tagline{font-size:11.5px;color:var(--rd-subtle);margin-top:4px;letter-spacing:-.1px}.rd-search{margin-left:auto;display:flex;align-items:center;gap:9px;background:var(--rd-tint);border-radius:var(--rd-radius-pill);padding:11px 15px;width:300px;box-sizing:border-box;position:relative}.rd-search svg{color:var(--rd-subtle);flex:none}.rd-search input{border:0;outline:0;background:transparent;font:inherit;font-size:14.5px;color:var(--rd-ink);width:100%}.rd-search input::placeholder{color:var(--rd-subtle)}.rd-suggest{position:absolute;top:calc(100% + 6px);left:0;right:0;background:#fff;border:1px solid var(--rd-card-border);border-radius:var(--rd-radius-inner);box-shadow:var(--rd-shadow-hover);z-index:60;overflow:hidden;display:none}.rd-suggest.show{display:block}.rd-suggest a{display:flex;align-items:center;gap:10px;padding:9px 14px;color:var(--rd-ink);font-size:14px;border-bottom:1px solid var(--rd-hairline)}.rd-suggest a:last-child{border-bottom:0}.rd-suggest a.active,.rd-suggest a:hover{background:var(--rd-tint)}.rd-suggest .rd-sug-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rd-suggest .rd-sug-type{margin-left:auto;flex:none;font-size:10.5px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--rd-subtle)}.rd-nav{display:flex;align-items:center;padding:0 22px;border-bottom:1px solid var(--rd-hairline);background:#fff}.rd-nav-scroll{display:flex;align-items:center;flex-wrap:wrap;flex:1;min-width:0}.rd-nav-item{display:block;padding:8px 14px;margin:9px 2px;font-size:14.5px;font-weight:500;color:var(--rd-muted);border-radius:9px;white-space:nowrap;transition:color .12s,background .12s}.rd-nav-item:hover{color:var(--rd-ink)}.rd-nav-item.is-active{color:var(--rd-red);background:var(--rd-red-tint);font-weight:600}.rd-header-controls{margin-left:auto;display:flex;align-items:center;gap:14px;flex:none}.rd-header-controls #parlay-mode-container,.rd-header-controls #format-container,.rd-header-controls #auto-refresh-container{position:relative}.rd-header-controls #parlay-mode-box{display:flex;align-items:center;gap:7px;color:var(--rd-muted);font-size:13px}.rd-header-controls #parlay-mode-box .bfo-check-box{width:15px;height:15px;border:1.5px solid #d2d2d7;border-radius:5px;color:transparent;font-size:11px;line-height:14px;text-align:center}.rd-header-controls .dropdown,.rd-header-controls .dropdown li{list-style:none;margin:0;padding:0}.rd-header-controls #format-toggle-text{color:var(--rd-muted);font-size:13px}body.rd #format-container ul.dropdown > li.hover{background:var(--rd-tint);border-radius:9px}body.rd #format-container .sub_menu{background:#fff;border:1px solid var(--rd-card-border);border-radius:var(--rd-radius-inner);box-shadow:var(--rd-shadow-hover);padding:8px;margin-top:8px;right:0;min-width:224px}body.rd #format-container .sub_menu li{background:#fff;color:var(--rd-ink);height:auto;border-radius:8px;margin:2px 0}body.rd #format-container .sub_menu li:hover{background:var(--rd-tint)}body.rd #format-container .sub_menu li a{color:var(--rd-ink);border-right:0;display:block;padding:10px 16px 10px 38px;font-size:14px;position:relative}body.rd #format-container .sub_menu li a:hover{color:var(--rd-ink)}body.rd #format-container .sub_menu li a span{position:absolute;left:15px;top:50%;transform:translateY(-50%);padding:0;margin:0;font-size:11px;color:var(--rd-red)}/* "Return on $ [amount]" row:inline so the input sits beside the label */ body.rd #format-container .sub_menu li[style]{display:flex;align-items:center;gap:2px;padding:8px 16px 10px 38px;margin-bottom:4px;border-bottom-color:var(--rd-hairline) !important}body.rd #format-container .sub_menu li[style] a{display:inline !important;padding:0}body.rd #format-container .sub_menu li[style] a span{position:static;transform:none;margin-right:4px}body.rd #format-amount-box1{border:1px solid #d2d2d7;border-radius:7px;padding:5px 8px;width:56px;font-size:13px;margin-left:6px;color:var(--rd-ink);background:#fff}body.rd #format-amount-box1:focus{outline:0;border-color:var(--rd-red)}/* text-align:left resets the base site's body{text-align:center}, which the
   redesign content would otherwise inherit (centered breadcrumbs/titles). */
.rd-content { background: var(--rd-content); padding: 16px 24px 24px; display: flex; flex-direction: column; gap: 10px; text-align: left; }

/* ---- Footer -------------------------------------------------------------- */
.rd-footer { text-align: center; padding: 26px 18px 30px; border-top: 1px solid var(--rd-hairline); background: #fff; }
.rd-footer .rd-foot-links { font-size: 13px; color: var(--rd-muted); line-height: 2; }
.rd-footer .rd-foot-links a { color: var(--rd-muted); }
.rd-footer .rd-foot-links a:hover { color: var(--rd-red); }
.rd-footer .rd-foot-sep { color: var(--rd-disabled); margin: 0 8px; }
/* --rd-faint on white is only 2.57:1 — below the 4.5:1 AA threshold, and this
   is responsible-gambling copy that must be legible. --rd-muted is 5.07:1. */
.rd-footer .rd-foot-rg { margin-top: 12px; font-size: 12px; color: var(--rd-muted); }
.rd-footer .rd-foot-rg a { color: var(--rd-muted); text-decoration: underline; }

/* ---- Section header bar motif (shared, used by later phases) ------------- */
.rd-bar { display: flex; align-items: center; gap: 14px; padding: 18px 18px 18px 20px; background: var(--rd-tint); border-left: 4px solid var(--rd-red); border-bottom: 1px solid var(--rd-hairline); }
.rd-bar h2, .rd-bar .rd-bar-title { font-size: 19px; font-weight: 700; letter-spacing: -.4px; color: var(--rd-ink); margin: 0; }

/* ---- Responsive (foundation; refined in a later phase) ------------------- */
@media (max-width: 1024px) {
  .rd-canvas { padding: 0 12px 16px; }
  .rd-search { width: 220px; }
}
@media (max-width: 768px) {
  .rd-header { flex-wrap: wrap; padding: 14px 16px; gap: 12px; }
  /* Free up the row so Parlay/Settings fit beside the wordmark: drop the
     tagline and shrink the wordmark on small screens. */
  .rd-tagline { display: none; }
  .rd-wordmark { font-size: 19px; }
  .rd-search { margin-left: 0; width: 100%; order: 3; }
  /* Parlay/Settings live in the header top-right (inline, no separate row);
     the nav links scroll horizontally in a single row. */
  .rd-nav { padding: 0; }
  .rd-nav-scroll { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; padding: 5px 10px; scrollbar-width: none; }
  .rd-nav-scroll::-webkit-scrollbar { display: none; }
  .rd-nav-item { flex: none; margin: 4px 1px; padding: 7px 12px; }
  .rd-header-controls { gap: 12px; }
  .rd-content { padding: 16px; }
}

/* ============================================================================
   Phase 1 — Content & news surfaces. Re-skins the existing news_index (.nx-*),
   news_post (.na-*) and author (.au-*) components to the redesign tokens.
   Scoped under body.rd so it overrides each template's inline <style> (higher specificity) and never affects the live view. ========================================================================== */ body.rd .nx{padding:0}body.rd .nx-head{border-bottom:1px solid var(--rd-hairline);padding:4px 0 18px}body.rd .nx-head h1{font-size:32px;font-weight:700;letter-spacing:-.9px;color:var(--rd-ink)}body.rd .nx-head p{color:var(--rd-subtle);font-size:14px}body.rd .nx-grid{gap:22px}body.rd .nx-card{border:1px solid var(--rd-card-border);border-radius:var(--rd-radius-card);background:#fff;box-shadow:var(--rd-shadow);transition:box-shadow .15s,transform .15s}body.rd .nx-card:hover{box-shadow:var(--rd-shadow-hover);transform:translateY(-2px)}body.rd .nx-thumb-ph{background:linear-gradient(135deg,#3a3a40,#1d1d22)}body.rd .nx-cat{background:var(--rd-red-tint);color:var(--rd-red);font-weight:700;letter-spacing:.4px;border-radius:6px}body.rd .nx-title{font-size:18px;font-weight:700;color:var(--rd-ink);line-height:1.3}body.rd .nx-card:hover .nx-title{color:var(--rd-red)}body.rd .nx-excerpt{color:var(--rd-muted)}body.rd .nx-meta{color:var(--rd-subtle);border-top:1px solid var(--rd-hairline);padding-top:14px;margin-top:14px}body.rd .nx-pager .cur{background:var(--rd-red);border-color:var(--rd-red)}body.rd .nx-pager a:hover{border-color:var(--rd-red);color:var(--rd-red)}body.rd .na-crumbs,body.rd .na-crumbs a{color:var(--rd-subtle)}body.rd .na-crumbs a:hover{color:var(--rd-red)}body.rd .na-cat{background:var(--rd-red-tint);color:var(--rd-red);font-weight:700;letter-spacing:.5px}body.rd .na-title{font-size:38px;font-weight:700;letter-spacing:-1.2px;color:var(--rd-ink);line-height:1.1}body.rd .na-meta{color:var(--rd-subtle)}body.rd .na-meta strong{color:var(--rd-body)}body.rd .na-hero{background:linear-gradient(135deg,#3a3a40,#1d1d22);border-radius:var(--rd-radius-card)}body.rd .na-body{font-size:16px;line-height:1.78;color:var(--rd-body)}body.rd .na-body h2{font-size:23px;font-weight:700;letter-spacing:-.5px;color:var(--rd-ink);border-left:4px solid var(--rd-red);border-bottom:0;padding:0 0 0 14px;margin:40px 0 16px}body.rd .na-body a{color:#2a5da8}body.rd .na-body blockquote{border-left:3px solid var(--rd-red);background:var(--rd-tint);color:var(--rd-body);border-radius:0 8px 8px 0}body.rd .na-body th{background:var(--rd-dark)}body.rd .na-author{background:var(--rd-tint);border:1px solid var(--rd-card-border);border-radius:var(--rd-radius-inner)}body.rd .na-author-avatar{background:linear-gradient(135deg,var(--rd-red-grad-a),var(--rd-red-grad-b))}body.rd .na-author-name{color:var(--rd-ink)}body.rd .na-author-role{color:var(--rd-subtle)}body.rd .na-author-bio{color:var(--rd-muted)}body.rd .na-back{color:var(--rd-red)}body.rd .na-disc{color:var(--rd-faint);border-top:1px solid var(--rd-hairline)}body.rd .na-author .au-social{box-shadow:none}body.rd .au-header{border-bottom:1px solid var(--rd-hairline)}body.rd .au-avatar{background:linear-gradient(135deg,var(--rd-red-grad-a),var(--rd-red-grad-b))}body.rd .au-name{font-size:30px;font-weight:700;letter-spacing:-.8px;color:var(--rd-ink)}body.rd .au-title{color:var(--rd-subtle)}body.rd .au-bio{color:var(--rd-muted)}body.rd .au-sub{color:var(--rd-subtle)}body.rd .au-post{border-bottom:1px solid var(--rd-hairline)}body.rd .au-post a.au-post-title{font-size:18px;font-weight:700;color:var(--rd-ink)}body.rd .au-post a.au-post-title:hover{color:var(--rd-red)}body.rd .au-post-meta{color:var(--rd-subtle)}body.rd .au-post-ex{color:var(--rd-muted)}body.rd .au-pager .cur{background:var(--rd-red);border-color:var(--rd-red)}body.rd .au-pager a:hover{border-color:var(--rd-red);color:var(--rd-red)}body.rd .cp a{color:#2a5da8}body.rd .cp-crumbs,body.rd .cp-crumbs a{color:var(--rd-subtle)}body.rd .cp-crumbs{padding:2px 0 4px}body.rd .cp-crumbs a:hover{color:var(--rd-red)}body.rd .cp-title{font-size:32px;font-weight:700;letter-spacing:-.9px;color:var(--rd-ink);margin:6px 0 6px}body.rd .cp-meta{color:var(--rd-subtle)}body.rd .cp h2{font-size:23px;font-weight:700;letter-spacing:-.5px;color:var(--rd-ink);border-bottom:0;border-left:4px solid var(--rd-red);padding:0 0 0 14px;margin:40px 0 16px}body.rd .cp h3{color:var(--rd-ink)}body.rd .cp-takeaways{background:#f4fbf7;border:1px solid #d8ede2;border-left:4px solid var(--rd-up);border-radius:0 12px 12px 0}body.rd .cp-takeaways-title{color:var(--rd-ink)}body.rd .cp-takeaways-title::before{color:var(--rd-up)}body.rd .cp-takeaways li::before{color:var(--rd-up)}body.rd .cp-callout{background:var(--rd-tint);border-left:3px solid var(--rd-dark);border-radius:0 8px 8px 0}body.rd .cp-callout strong{color:var(--rd-dark)}body.rd .cp-tip{background:#fff8e9;border-left:3px solid var(--rd-gold)}body.rd .cp-tbl thead th,body.rd .cp-main th{background:var(--rd-tint);color:var(--rd-subtle);border-bottom:1px solid var(--rd-hairline)}body.rd .cp-tbl .hl{background:var(--rd-red-tint)}body.rd .cp-main table:not(.cp-tbl){border-collapse:separate;border-spacing:0;border:1px solid var(--rd-card-border);border-radius:12px;overflow:hidden;font-variant-numeric:tabular-nums}body.rd .cp-main table:not(.cp-tbl) th,body.rd .cp-main table:not(.cp-tbl) td{border:0;border-bottom:1px solid var(--rd-hairline);padding:13px 16px;text-align:left;vertical-align:top;line-height:1.5}body.rd .cp-main table:not(.cp-tbl) thead th{background:var(--rd-tint);color:var(--rd-subtle);font-size:11.5px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;white-space:normal;border-bottom:1px solid var(--rd-card-border)}body.rd .cp-main table:not(.cp-tbl) tbody td{font-size:14px;color:var(--rd-body);font-weight:400}body.rd .cp-main table:not(.cp-tbl) tbody td:first-child{color:var(--rd-ink);font-weight:600}body.rd .cp-main table:not(.cp-tbl) tbody tr:nth-child(even){background:var(--rd-tint2)}body.rd .cp-main table:not(.cp-tbl) tbody tr:hover{background:var(--rd-tint)}body.rd .cp-main table:not(.cp-tbl) tbody tr:last-child td{border-bottom:0}body.rd .cp-fp{border:1px solid var(--rd-card-border);border-radius:var(--rd-radius-inner);box-shadow:var(--rd-shadow)}body.rd .cp-fp::before{background:linear-gradient(90deg,var(--rd-red-grad-b),var(--rd-red),#e6404e)}body.rd .cp-fp-stars-val{color:var(--rd-red)}body.rd .cp .cp-fp-cta{background:var(--rd-red)}body.rd .cp .cp-fp-cta:hover{background:var(--rd-red-grad-b);box-shadow:0 4px 14px rgba(212,32,47,.28)}body.rd .cp-fp-name{color:var(--rd-ink)}body.rd a.cp-fp-name:hover{color:var(--rd-red)}body.rd .cp-faq-item.open .cp-faq-icon{background:var(--rd-dark)}body.rd .cp-toc{background:var(--rd-tint);border:1px solid var(--rd-hairline);border-radius:var(--rd-radius-inner)}body.rd .cp-toc li.active::before{border-color:var(--rd-red);background:var(--rd-red)}body.rd .cp-toc li.active a{color:var(--rd-ink)}body.rd .cp-toc a:hover{color:var(--rd-red)}body.rd .cp-toc-top a{color:#2a5da8}body.rd .cp-author{border:1px solid var(--rd-card-border);border-radius:var(--rd-radius-inner)}body.rd .cp-author-avatar{background:linear-gradient(135deg,var(--rd-red-grad-a),var(--rd-red-grad-b))}body.rd .cp-author-name{color:var(--rd-ink)}body.rd .cp-disc{color:var(--rd-faint)}body.rd #related-pages a:hover{border-color:var(--rd-red)}body.rd .rd-article-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:36px;align-items:start;max-width:1160px;margin:0 auto}body.rd .rd-article-grid .na{max-width:none;margin:0;padding:0}body.rd .rd-side{position:sticky;top:20px;display:flex;flex-direction:column;gap:18px}body.rd .rd-widget{border:1px solid var(--rd-card-border);border-radius:var(--rd-radius-inner);background:#fff;overflow:hidden}body.rd .rd-widget-head{padding:14px 18px;background:var(--rd-tint);border-left:4px solid var(--rd-red);border-bottom:1px solid var(--rd-hairline);font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--rd-ink)}body.rd .rd-widget-news{list-style:none;margin:0;padding:6px 0}body.rd .rd-widget-news li{display:flex;gap:10px;padding:9px 18px;align-items:baseline}body.rd .rd-widget-num{color:var(--rd-disabled);font-weight:700;font-size:13px;font-variant-numeric:tabular-nums}body.rd .rd-widget-news-t{display:block;font-size:13.5px;font-weight:600;color:var(--rd-ink);line-height:1.35}body.rd .rd-widget-news a:hover .rd-widget-news-t{color:var(--rd-red)}body.rd .rd-widget-news-d{display:block;font-size:11.5px;color:var(--rd-subtle);margin-top:2px}body.rd .rd-widget-sites,body.rd .rd-widget-events{padding:6px 0}body.rd .rd-site,body.rd .rd-event{display:flex;align-items:center;gap:10px;padding:9px 18px}body.rd .rd-site-logo{width:28px;height:28px;flex:none;border-radius:8px;background:var(--rd-dark);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px}body.rd .rd-site-name,body.rd .rd-event-t{font-size:13.5px;font-weight:600;color:var(--rd-ink);line-height:1.3}body.rd .rd-site-name:hover{color:var(--rd-red)}body.rd .rd-event-t:hover{color:var(--rd-red)}body.rd .rd-site-rate{margin-left:auto;font-size:12px;color:var(--rd-gold);white-space:nowrap}body.rd .rd-event-info{min-width:0}body.rd .rd-event-d{display:block;font-size:11.5px;color:var(--rd-subtle)}body.rd .rd-site-get,body.rd .rd-event-odds{background:var(--rd-red);color:#fff;font-size:12px;font-weight:700;padding:5px 12px;border-radius:8px;white-space:nowrap}body.rd .rd-event-odds{margin-left:auto;flex:none}body.rd .rd-site-get:hover,body.rd .rd-event-odds:hover{background:var(--rd-red-grad-b)}@media (max-width:900px){body.rd .rd-article-grid{grid-template-columns:1fr}body.rd .rd-side{position:static}}body.rd .rv a{color:#2a5da8}body.rd .rv-crumbs,body.rd .rv-crumbs a,body.rd .rv-meta{color:var(--rd-subtle)}body.rd .rv-crumbs{padding:0 0 4px}body.rd .rv-crumbs a:hover{color:var(--rd-red)}body.rd .rv-title{font-size:28px;font-weight:700;letter-spacing:-.6px;color:var(--rd-ink);margin:4px 0 8px}body.rd .rv-hero{background:var(--rv-accent,var(--rd-kalshi));padding:14px;border:0;border-radius:16px;box-shadow:none;overflow:visible}body.rd .rv-hero-top{background:var(--rd-dark);border-radius:9px 9px 0 0}body.rd .rv-hero-body{background:#fff}body.rd .rv-hero-footer{background:#fff;border-radius:0 0 9px 9px}body.rd .rv-hero-stars{color:var(--rd-gold)}body.rd .rv-hero-tag{background:var(--rd-red);border-radius:999px;letter-spacing:.6px}body.rd .rv-hero-offer strong{color:var(--rd-red)}body.rd .rv-hero-badge{background:#f1f2f4;border-radius:999px;color:var(--rd-muted)}body.rd .rv-code-copy{background:var(--rd-dark)}body.rd .rv-code-copy:hover{background:#44444a}body.rd .rv-code-copy.copied{background:var(--rd-up);border-color:var(--rd-up)}body.rd .rv .rv-cta-btn{background:var(--rd-red);color:#fff}body.rd .rv .rv-cta-btn:hover{background:var(--rd-red-grad-b)}body.rd .rv-main h2{border-bottom:0;border-left:4px solid var(--rd-red);padding:0 0 0 14px;letter-spacing:-.5px}body.rd .rv-callout{background:var(--rd-tint);border-left:4px solid var(--rd-red);border-radius:0 8px 8px 0}body.rd .rv-tbl thead th{background:var(--rd-dark)}body.rd .rv-chk-icon{color:var(--rd-up)}body.rd .rv-pc-pro{background:#f0fdf4;border:1px solid #bbf7d0}body.rd .rv-pc-con{background:#fef2f2;border:1px solid #fecaca}body.rd .rv-faq-item.open .rv-faq-icon{background:var(--rd-dark)}body.rd .rv-toc{background:var(--rd-tint);border:1px solid var(--rd-hairline);border-radius:var(--rd-radius-inner)}body.rd .rv-toc a:hover{color:var(--rd-red)}body.rd .rv-author{border:1px solid var(--rd-card-border);border-radius:var(--rd-radius-inner)}body.rd .rv-author-avatar{background:linear-gradient(135deg,var(--rd-red-grad-a),var(--rd-red-grad-b))}body.rd .rv-author-name{color:var(--rd-ink)}body.rd .rv-disc{color:var(--rd-faint)}body.rd .rv-cta-box{background:var(--rv-accent,var(--rd-kalshi));padding:14px;border:0;border-radius:16px}body.rd .rv-cta-box .rv-code-copy{background:var(--rd-dark)}/* Hero name to prototype size;clean the in-article "Use code" chip (markup uses .rv-cta-code — a dashed grey pill the green-frame override didn't reach) */
body.rd .rv-hero-top-name { font-size: 24px; }
body.rd .rv-cta-code { background: #fff; border: 1px solid var(--rd-card-border); border-radius: 8px; color: var(--rd-muted); }
body.rd .rv-cta-code:hover { background: var(--rd-tint); }
body.rd .rv-cta-code strong { color: var(--rd-ink); }

/* ---- Reviews index (.rvs-*) — promos grid ------------------------------- */
body.rd .rvs-card { border: 1px solid var(--rd-card-border); border-radius: var(--rd-radius-card); transition: box-shadow .15s, transform .15s; }
body.rd .rvs-card:hover { box-shadow: var(--rd-shadow-hover); transform: translateY(-2px); }
body.rd .rvs-stars { color: var(--rd-gold); }
body.rd .rvs-logo { border-radius: 11px; }
body.rd .rvs .rvs-cta { background: var(--rd-red); border-radius: 9px; }
body.rd .rvs .rvs-cta:hover { background: var(--rd-red-grad-b); }
body.rd .rvs-disc { color: var(--rd-faint); }

/* ============================================================================
   Phase 2 — Fighter page (gen_teampage.php: .team-stats-*). CSS-only reskin
   (the page content is server-generated/cached, so styling is flag-driven in
   <head>, never baked into the cached HTML).
   ========================================================================== */
body.rd #page-wrapper { max-width: 980px !important; margin: 0 auto; }
/* Data/list pages use more of the width (prose pages keep their narrower inline
   width for readability). Fighter history -> wider; search/archive -> wider plus
   a multi-column grid so the short result rows fill the space instead of a sparse
   single column. Scoped via :has(.archive_search_button) so the alerts matchup
   list (also .content-list) is left as a normal table. */
body.rd #page-wrapper:has(.team-stats-table) { max-width: 1080px !important; }
body.rd #page-wrapper:has(.archive_search_button) { max-width: 1040px !important; }
body.rd #page-wrapper:has(.archive_search_button) .content-list { display: block; }
body.rd #page-wrapper:has(.archive_search_button) .content-list tbody { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); column-gap: 26px; }
body.rd #page-wrapper:has(.archive_search_button) .content-list tbody tr { display: block; border-bottom: 1px solid var(--rd-hairline); padding: 9px 2px; }
body.rd #page-wrapper:has(.archive_search_button) .content-list tbody tr:hover { background: var(--rd-tint); }
body.rd #page-wrapper:has(.archive_search_button) .content-list tbody td { display: inline; padding: 0; border: 0; }
body.rd #page-wrapper:has(.archive_search_button) .content-list tbody td.content-list-date:not(:empty) { color: var(--rd-subtle); font-size: 12px; margin-right: 8px; }
/* Hero bar (fighter name) */
body.rd .team-stats-header { background: var(--rd-tint); border: 1px solid var(--rd-card-border); border-left: 4px solid var(--rd-red); border-radius: 14px 14px 0 0; padding: 18px 20px; margin: 0; }
body.rd #team-name { font-size: 26px; font-weight: 700; letter-spacing: -.4px; color: var(--rd-ink); margin: 0; }
/* History table card */
body.rd #team-stats-container { display: block !important; border: 1px solid var(--rd-card-border); border-top: 0; border-radius: 0 0 14px 14px; overflow-x: auto; }
body.rd .team-stats-table { width: 100%; border-collapse: collapse; font-family: var(--rd-font); }
body.rd .team-stats-table thead th { background: var(--rd-tint2); color: var(--rd-subtle); font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; padding: 12px 10px; border-bottom: 1px solid var(--rd-hairline); }
body.rd .team-stats-table td, body.rd .team-stats-table th { font-size: 14px; }
body.rd .team-stats-table .oppcell a { color: var(--rd-ink); font-weight: 600; }
body.rd .team-stats-table .oppcell a:hover { color: var(--rd-red); }
body.rd .team-stats-table .moneyline { font-variant-numeric: tabular-nums; color: var(--rd-body); }
/* Bolder divider before each fight's first row */ body.rd .team-stats-table .main-row th,body.rd .team-stats-table .main-row td{border-top:2px solid var(--rd-rule)}body.rd .team-stats-table .event-header td{background:var(--rd-tint);color:var(--rd-muted);font-size:12.5px;font-weight:600;padding:8px 12px}body.rd .team-stats-table .event-header a{color:var(--rd-muted)}body.rd .team-stats-table .event-header a:hover{color:var(--rd-red)}body.rd .header-movement{white-space:nowrap}body.rd .team-stats-header{display:flex;align-items:center;gap:14px}body.rd .rd-fh-avatar{display:flex !important;align-items:center;justify-content:center;width:52px;height:52px;flex:none;border-radius:50%;background:linear-gradient(135deg,var(--rd-red-grad-a),var(--rd-red-grad-b));color:#fff;font-weight:700;font-size:18px;letter-spacing:.5px}body.rd .rd-fh-stats{display:flex !important;gap:10px;padding:14px 20px;background:#fff;border-left:1px solid var(--rd-card-border);border-right:1px solid var(--rd-card-border);border-bottom:1px solid var(--rd-hairline)}body.rd .rd-fh-tile{flex:1;background:var(--rd-tint);border:1px solid var(--rd-hairline);border-radius:10px;padding:11px 14px;display:flex;flex-direction:column;gap:3px}body.rd .rd-fh-val{font-size:20px;font-weight:700;color:var(--rd-ink);font-variant-numeric:tabular-nums;letter-spacing:-.3px}body.rd .rd-fh-lbl{font-size:11px;font-weight:600;color:var(--rd-subtle);text-transform:uppercase;letter-spacing:.4px}body.rd .team-stats-table .mv-up{color:var(--rd-up) !important}body.rd .team-stats-table .mv-down{color:var(--rd-down) !important}@media (max-width:600px){body.rd .rd-fh-stats{flex-wrap:wrap;padding:12px 14px}}body.rd .table-outer-wrapper{padding:0}body.rd .table-div{box-shadow:none;border:1px solid var(--rd-card-border);border-radius:var(--rd-radius-card);overflow:hidden}body.rd .table-div .table-header{background:var(--rd-tint);border-left:4px solid var(--rd-red);border-bottom:1px solid var(--rd-hairline);color:var(--rd-ink);height:auto;padding:13px 16px 13px 16px;align-items:center}body.rd .table-header a{color:var(--rd-ink);font-weight:700}body.rd .table-header a:hover{color:var(--rd-red)}body.rd .table-header h1{font-size:18px;font-weight:700;letter-spacing:-.3px}body.rd .table-header{gap:8px}body.rd .table-header-date{color:var(--rd-muted);font-size:13px;padding-top:0;flex:none;white-space:nowrap}body.rd .table-header > a{min-width:0;overflow:hidden}body.rd .table-header h1{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}body.rd .table-div:not(.event-collapsed) .table-header{padding-right:44px}/* On the home listing the share is hidden,so drop that reserved right padding — lets the hint go truly flush-right,aligned with the "View card" labels. (The event page keeps 44px to clear its visible share button.) */ body.rd .table-div:not(.event-collapsed) .table-header:has(.rd-view-odds){padding-right:16px}body.rd .event-collapsed .event-collapsed-label{color:var(--rd-muted);position:static;transform:none;right:auto;top:auto;margin-left:auto;flex:none;padding-left:10px}body.rd .event-collapsed .event-toggle-caret{border-top-color:var(--rd-muted)}body.rd .share-area{right:14px}/* share_3.png is a white icon (built for the dark legacy bar);recolor it black for the light redesign header so it's visible. */
body.rd .share-button { opacity: .7; filter: brightness(0); }
body.rd .share-button:hover { opacity: 1; }
/* "View <event> Odds (<date>)" hint on the home listing — ships hidden (so the
   shared cached oddspage is unchanged for legacy) and is revealed only here. */
body.rd .rd-view-odds { display: inline-block !important; margin-left: auto; margin-right: 0; color: var(--rd-muted); font-size: 12.5px; white-space: nowrap; }
/* not bold + don't shrink,so margin-left:auto reliably right-aligns the long text (beat the bold/shrinking .table-header > a rules) */ /* Match the "View card" labels:muted grey,11px / 400,no uppercase (the hint is an .table-header a,which otherwise forces ink color + uppercase). */ body.rd .table-header a.rd-view-odds{color:var(--rd-muted);font-size:11px;font-weight:400;text-transform:none;flex:none;overflow:visible}body.rd .table-header a.rd-view-odds:hover{color:var(--rd-red)}/* On a collapsed event the hint stays hidden ("View card" shows instead);it appears once the card is expanded — so after clicking "No odds yet · View
   card" you get the "View <event> Odds" link too. */ body.rd .table-div.event-collapsed:not(.event-expanded) .rd-view-odds{display:none !important}/* Both the hint and the "View card" labels sit flush-right (aligned):drop the home-listing share icon on desktop so the hint owns the far-right edge. Share still shows on the event page (no hint there) and on mobile (hint hidden). */ @media (min-width:769px){body.rd .table-header:has(.rd-view-odds) .share-area{display:none}}@media (max-width:768px){body.rd .rd-view-odds{display:none !important}}body.rd .event-banners{background:var(--rd-tint)}body.rd .odds-table thead tr{background:var(--rd-tint2)}body.rd .odds-table thead th{border-bottom:1px solid var(--rd-hairline);vertical-align:top;padding-top:6px}body.rd .odds-table thead th a{color:var(--rd-body);text-decoration:none;font-weight:600}body.rd .odds-table thead th a:hover{color:var(--rd-red);text-decoration:none}body.rd .odds-table thead th.table-prop-header{color:var(--rd-muted)}/* Book promo subtitle (e.g. "$50 Bonus","$10 Free") in the brand red */ /* Promo subtitles ("$50 Bonus","$10 Free"):subtle red text with a thin red underline accent — catches the eye without a background. */ body.rd .bookie-bonus-badge{display:inline-block;margin-top:2px;padding-bottom:1px;background:none;color:var(--rd-red);border-bottom:1.5px solid var(--rd-red);border-radius:0;font-size:9px;font-weight:700;letter-spacing:.2px;line-height:1.4;white-space:nowrap;text-decoration:none}body.rd .bookie-bonus-badge:hover{color:var(--rd-red-grad-b);border-bottom-color:var(--rd-red-grad-b);text-decoration:none}/* Risk-disclosure "i" next to a bonus badge. The odds table scrolls (overflow-x:scroll clips the vertical axis too),so the tooltip itself is a position:fixed node appended to <body> by JS — never clipped by the scroller. */ /* 24x24 tap target (WCAG 2.2 target-size) with the 12px circle drawn inside by::before,so it looks identical but is comfortably tappable on mobile. The negative margins collapse the box back to 12px for layout,keeping the odds header exactly as tall as before. font-size:0 hides the literal "i" glyph — the pseudo-element supplies it,and aria-label carries the accessible name. */ body.rd .bonus-info{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;margin:-6px -6px -6px -2px;vertical-align:middle;border:0;background:none;font-size:0;cursor:pointer;user-select:none}body.rd .bonus-info::before{content:"i";display:flex;align-items:center;justify-content:center;width:12px;height:12px;border:1px solid var(--rd-faint);border-radius:50%;color:var(--rd-muted);font-size:8px;font-weight:700;font-style:normal;line-height:1;text-transform:none;letter-spacing:0}body.rd .bonus-info:hover::before,body.rd .bonus-info:focus::before{border-color:var(--rd-red);color:var(--rd-red)}body.rd .bonus-info:focus{outline:none}body.rd .bonus-info:focus-visible::before{outline:2px solid var(--rd-red);outline-offset:2px}.bfo-disc-tip{position:fixed;z-index:9999;display:none;max-width:320px;padding:12px 14px;background:#fff;color:var(--rd-body);border:1px solid var(--rd-rule);border-radius:10px;box-shadow:0 8px 28px rgba(20,23,28,.16);font-family:var(--rd-font);font-size:12px;font-weight:400;line-height:1.55;text-align:left;text-transform:none;letter-spacing:0;white-space:normal}.bfo-disc-tip-h{font-size:12.5px;font-weight:700;color:var(--rd-ink);margin-bottom:5px}body.rd .odds-table tbody th a{color:var(--rd-ink)}body.rd .odds-table tbody th a:hover{color:var(--rd-red)}/* Two rows per fight:top row shaded,bottom row white with a bolder rule that reads as the divider between fights (the last fight's rule is killed inline). */
body.rd .odds-table tbody tr { background: var(--rd-tint2); }
body.rd .odds-table tbody tr:nth-child(2n) { background: #fff; border-bottom: 1px solid var(--rd-hairline); }
/* Prop sub-rows (revealed on expand) stay visually subordinate */
body.rd .odds-table tbody tr.pr { background: var(--rd-tint); }
body.rd .odds-table tbody tr.pr:nth-child(2n) { background: var(--rd-tint2); border-bottom: 1px solid var(--rd-hairline); }
body.rd .odds-table tbody tr.eventprop { background: var(--rd-tint); border-top: 1px solid var(--rd-rule); }

/* Best price -> red pill on a tinted red field */
body.rd .odds-table tbody td .bestbet {
  background: var(--rd-red-tint);
  color: var(--rd-red);
  border-radius: 5px;
  padding: 1px 5px;
  font-weight: 700;
}
/* Movement arrows: redesign green up / soft-red down (age opacity preserved) */
body.rd .aru { color: var(--rd-up); }
body.rd .ard { color: var(--rd-down); }
body.rd .odds-table tbody td span.na { color: var(--rd-subtle); }
/* Cell hover */
@media not screen and (max-width: 767px) {
  body.rd .odds-table tbody td:hover:not(.button-cell):not(.chart-cell):not(.prop-cell):not(:empty) { background-color: var(--rd-tint); }
  body.rd .odds-table tbody tr.pr td:hover:not(.button-cell):not(.chart-cell):not(.prop-cell):not(:empty) { background-color: var(--rd-hairline2); }
}
/* Parlay / alert / expand glyphs */
body.rd .svg-i { color: var(--rd-muted); }
body.rd .prop-cell a { color: var(--rd-muted); }
body.rd .prop-cell a:hover { color: var(--rd-red); }

/* No-odds + last-changed footer */
body.rd .no-odds { color: var(--rd-muted); }
body.rd .no-odds a { color: var(--rd-red); }
/* "Last change" is a sibling of the event card, so the .rd-content flex gap
   (18px) sits between them. Pull it up tight under its card (the gap before the
   NEXT event is unaffected). */
body.rd .table-last-changed { color: var(--rd-faint); padding-right: 2px; padding-top: 0; margin-top: -6px; }

/* ---- Line-movement / expected-outcome chart cards (event page) ----------- */
/* They sit side by side on desktop. The wrapper is a generic .table-outer-wrapper,
   so target the one holding the charts and lay it out as a grid (deterministic —
   the legacy 45/55 inline-block broke once the cards gained a 1px border under
   the content-box default). Stack on mobile. */
body.rd .table-outer-wrapper:has(> #event-swing-area) { display: grid; grid-template-columns: minmax(0, 45fr) minmax(0, 55fr); gap: 18px; align-items: start; }
body.rd #event-swing-area,
body.rd #event-outcome-area {
  box-shadow: none;
  border: 1px solid var(--rd-card-border);
  border-radius: var(--rd-radius-card);
  overflow: hidden;
  box-sizing: border-box;
  width: auto;
  margin: 0;
  display: block;
}
@media (max-width: 768px) {
  body.rd .table-outer-wrapper:has(> #event-swing-area) { grid-template-columns: 1fr; }
}
/* Chart title bar: dark -> tinted, red-left section bar */
body.rd .content-header {
  background: var(--rd-tint);
  color: var(--rd-ink);
  border-left: 4px solid var(--rd-red);
  border-bottom: 1px solid var(--rd-hairline);
  height: auto;
  padding: 12px 16px;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -.2px;
}
body.rd .content-header a { color: var(--rd-ink); }
body.rd #event-swing-picker-menu { color: var(--rd-muted); font-weight: 400; }
body.rd .event-swing-picker { color: var(--rd-muted); }
body.rd .event-swing-picker:hover { color: var(--rd-ink); }
body.rd .event-swing-picker.picked { color: var(--rd-red); font-weight: 700; }
body.rd .event-swing-expand { color: var(--rd-muted); }
body.rd .event-swing-expand:hover { color: var(--rd-red); }

/* Event custom (SEO) content block -> card */
body.rd .event-custom-content {
  box-shadow: none;
  border: 1px solid var(--rd-card-border);
  border-radius: var(--rd-radius-card);
  margin: 0;
  padding: 20px 22px;
}
/* Links inside the article body: the redesign's global `body.rd a` reset (color:inherit;no underline) out-specifies the base rule,so re-apply the editorial link style (blue + underline,red on hover) to match content/ review/news pages and stand apart from body text. */ body.rd .event-custom-content a{color:#2a5da8;text-decoration:underline}body.rd .event-custom-content a:hover{color:var(--rd-red)}/* ---- "Latest MMA News" module (home + event + fighter) ------------------- */ body.rd .bfo-news-mod{margin:6px auto 0}body.rd .bfo-news-mod-card{border-color:var(--rd-card-border);border-radius:var(--rd-radius-inner)}body.rd .bfo-news-mod-head{background:var(--rd-tint);border-left:4px solid var(--rd-red);border-bottom:1px solid var(--rd-hairline)}body.rd .bfo-news-mod-head a{color:var(--rd-red)}body.rd .bfo-news-mod-list a:hover{background:var(--rd-tint);color:var(--rd-red)}body.rd .bfo-news-mod-list li{border-bottom-color:var(--rd-hairline)}/* ============================================================================ Phase 4 — remaining utility/legal pages,shared popups,and the full responsive/mobile pass. Promos index (.rvs-*) was done in Phase 1d;reviews render from those classes. Dark mode is intentionally NOT carried into the redesign:the format menu's dark-mode toggle is disabled and darkmode.css is
   never loaded under the flag, so the redesign is light-only by design.
   ========================================================================== */

/* ---- Shared content shell: alerts, archive, search, terms, privacy,
        responsible-gaming, widget (all use #page-container/#page-content) ---- */
body.rd #page-wrapper { margin: 0 auto; }
body.rd #page-container {
  background: #fff;
  box-shadow: none;
  border: 1px solid var(--rd-card-border);
  border-radius: var(--rd-radius-card);
  margin: 0;
  overflow: hidden;
}
body.rd #page-inner-wrapper { padding: 22px 24px; }
body.rd #page-content { font-size: 14px; color: var(--rd-body); }
body.rd #page-content p { line-height: 1.7; }
body.rd #page-content a { color: #2a5da8; }
body.rd #page-content a:hover { color: var(--rd-red); }
/* Section headings use the redesign red-left rule */
body.rd #page-content h1 { font-size: 22px; font-weight: 700; letter-spacing: -.4px; color: var(--rd-ink); border-left: 4px solid var(--rd-red); padding: 0 0 0 14px; margin: 26px 0 12px; }
body.rd #page-content h1:first-child { margin-top: 4px; }
body.rd #page-content h2 { font-size: 17px; font-weight: 700; color: var(--rd-ink); padding-top: 8px; }

/* Form controls -> rounded, light, red focus + red submit buttons */
body.rd #page-content input[type="text"],
body.rd #page-content select,
body.rd #page-content textarea {
  border: 1px solid #d2d2d7;
  border-radius: 8px;
  height: auto;
  min-height: 38px;
  padding: 8px 11px;
  font-size: 14px;
  color: var(--rd-ink);
  background: #fff;
  vertical-align: middle;
  box-sizing: border-box;
}
body.rd #page-content textarea { min-height: 0; }
body.rd #page-content input[type="text"]:focus,
body.rd #page-content select:focus,
body.rd #page-content textarea:focus { outline: 0; border-color: var(--rd-red); }
body.rd #page-content input[type="submit"],
body.rd .archive_search_button {
  background: var(--rd-red);
  color: #fff;
  border: 0;
  border-radius: 8px;
  padding: 9px 16px;
  height: auto;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}
body.rd #page-content input[type="submit"]:hover,
body.rd .archive_search_button:hover { background: var(--rd-red-grad-b); }

/* List tables (archive / search / alerts matchups) */
body.rd .content-list tr { border-bottom: 1px solid var(--rd-hairline); }
body.rd .content-list tr:hover { background: var(--rd-tint); }
body.rd .content-list td a { color: var(--rd-ink); }
body.rd .content-list td a:hover { color: var(--rd-red); }
body.rd .content-vs-cell { color: var(--rd-subtle); }

/* Inline action buttons ("Add alert", reset-to-default, etc.) */
body.rd .button { background: var(--rd-red); color: #fff; border: 0; border-radius: 8px; padding: 7px 14px; font-size: 13px; font-weight: 600; }
body.rd .button:hover { background: var(--rd-red-grad-b); }

/* Sidebar helper note + widget labels */
body.rd .content-sidebar { color: var(--rd-muted); font-size: 12.5px; }
body.rd .content-sidebar a { color: var(--rd-body); }
body.rd .content-sidebar a:hover { color: var(--rd-red); }
body.rd .links-line { color: var(--rd-ink); font-weight: 600; }

/* ---- Shared popups: chart / parlay / bookie-settings / alert windows ----- */
/* (JS-driven scale/opacity transitions are left untouched — colour only.) */
body.rd .popup-window { border-radius: var(--rd-radius-inner); box-shadow: var(--rd-shadow-hover); overflow: hidden; }
body.rd .popup-header { background: var(--rd-tint); color: var(--rd-ink); border-left: 4px solid var(--rd-red); border-bottom: 1px solid var(--rd-hairline); font-weight: 700; padding: 11px 14px; }
body.rd .popup-header a:hover { color: var(--rd-red); }
body.rd .cd-popup-close { color: var(--rd-muted); }
body.rd .cd-popup-close:hover { color: var(--rd-red); }
/* Parlay window exit (×): the toggle lives in the nav which scrolls out of
   reach on mobile, and #parlay-header's innerHTML is JS-overwritten,so the close sits as a sibling and triggers the existing parlay toggle to exit. */ body.rd #parlay-window .popup-header{padding-right:34px}body.rd .rd-parlay-close{position:absolute;top:9px;right:11px;z-index:3;font-size:14px;line-height:1;color:var(--rd-muted);padding:2px 5px}body.rd .rd-parlay-close:hover{color:var(--rd-red)}body.rd .highlighted-button,body.rd #chart-link{background:var(--rd-red);color:#fff;border:0;border-radius:8px;padding:8px 14px;font-weight:600}body.rd .highlighted-button:hover,body.rd #chart-link:hover{background:var(--rd-red-grad-b)}body.rd #bookie-order-items li{background:var(--rd-tint);border:1px solid var(--rd-card-border);border-radius:7px;margin-bottom:5px;height:auto;padding:7px 8px}body.rd #bookie-order-items li.sortable-chosen{background:var(--rd-red-tint)}body.rd #parlay-area,body.rd #alert-area,body.rd #bookie-settings-area{color:var(--rd-body)}/* Event cards rely on .rd-content's gap, not legacy bottom margin */
body.rd .table-outer-wrapper { margin-bottom: 0; }

/* Odds grid on phones: the legacy layout shows a sticky left fighter-name
   column (.odds-table-responsive-header) and blanks the names in the scrolling
   table. Re-assert that blanking under body.rd so the Phase-3 ink colour (equal
   specificity, later in the cascade) doesn't make the names reappear/double. */ @media only screen and (max-width:961px){body.rd .odds-table:not(.odds-table-responsive-header) tbody tr th,body.rd .odds-table:not(.odds-table-responsive-header) tbody tr th a{color:transparent}}/* Collapsed events ("No odds yet · View card") expose the mobile sticky left-name column when expanded,via the legacy .event-collapsed.event-expanded rule that forces display:block at ALL widths. On desktop that column overlaps the main grid (the broken expand). The sticky column is only needed on mobile,so keep it hidden above the breakpoint. */ @media only screen and (min-width:962px){body.rd .event-collapsed.event-expanded .odds-table-responsive-header{display:none}}@media (max-width:600px){body.rd .rd-canvas{padding:0 7px 10px}body.rd .rd-card{border-radius:0 0 12px 12px}body.rd .rd-content{padding:12px}body.rd #page-inner-wrapper{padding:16px 15px}body.rd .na-title{font-size:27px;letter-spacing:-.7px}body.rd .nx-head h1,body.rd .cp-title,body.rd .rv-title{font-size:23px}body.rd .au-name{font-size:24px}body.rd .rd-header{padding:13px 14px;gap:10px}body.rd .rd-wordmark{font-size:18px}}/* ===== Native featured-odds CTA (book-linked banner) ===== * * A banner with a featured sportsbook renders as a slim,single-row odds + * payout bar for the event's main fight. Ships hidden in the cached HTML;
 * revealed only in the redesign. Accent comes from the banner's BG/Text colors * via the inline --cta-accent / --cta-on custom properties. Odds + payout text * stay dark ink so they're readable against any accent the admin picks. Uses
 * width, not height: one row on desktop, wraps gracefully when narrow.        */
body.rd .rd-odds-cta {
  display: block !important;
  background: #fff;
  border: 1px solid var(--rd-card-border);
  border-radius: 12px;
  margin: 0 0 12px;
  font-family: var(--rd-font);
  text-align: left;
  overflow: hidden;
}
body.rd .rd-cta-row { display: flex; align-items: center; gap: 9px 16px; flex-wrap: wrap; padding: 9px 14px; }
body.rd .rd-cta-pickline { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; flex: 1 1 auto; min-width: 0; }
body.rd .rd-cta-book { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--rd-subtle); }
body.rd .rd-cta-fighter { font-size: 17px; font-weight: 600; color: var(--rd-ink); letter-spacing: -.2px; }
body.rd .rd-cta-odds { font-size: 17px; font-weight: 600; color: var(--rd-ink); }
body.rd .rd-cta-sub { font-size: 12px; color: var(--rd-muted); }
body.rd .rd-cta-calc { display: flex; align-items: center; gap: 7px; background: var(--rd-tint); border-radius: 9px; padding: 5px 11px; flex: none; }
body.rd .rd-cta-stake-wrap { display: inline-flex; align-items: center; gap: 1px; margin: 0; }
body.rd .rd-cta-calc-lbl { font-size: 13px; color: var(--rd-muted); margin-right: 3px; }
body.rd .rd-cta-dollar { font-size: 14px; color: var(--rd-muted); }
body.rd .rd-cta-stake {
  width: 52px; font-size: 14px; font-weight: 600; color: var(--rd-ink);
  border: 1px solid var(--rd-rule); border-radius: 6px; background: #fff; padding: 3px 6px;
  -moz-appearance: textfield;
}
body.rd .rd-cta-stake:focus { outline: none; border-color: var(--cta-accent, var(--rd-red)); }
body.rd .rd-cta-stake::-webkit-outer-spin-button,
body.rd .rd-cta-stake::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
body.rd .rd-cta-arrow { color: var(--rd-faint); font-size: 14px; }
body.rd .rd-cta-profit { font-size: 17px; font-weight: 600; color: var(--rd-ink); }
body.rd .rd-cta-win-lbl { font-size: 12px; color: var(--rd-muted); }
body.rd .rd-cta-total { color: var(--rd-faint); }
body.rd .rd-cta-bonus-add { font-size: 16px; font-weight: 600; color: var(--rd-up); white-space: nowrap; }
body.rd .rd-cta-bonus-add-lbl { font-size: 11px; font-weight: 400; }
body.rd .rd-cta-action { display: flex; align-items: center; gap: 10px; flex: none; }
body.rd .rd-cta-bonus { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--rd-body); white-space: nowrap; }
body.rd .rd-cta-gift { color: var(--rd-up); flex: none; }
body.rd .rd-cta-btn {
  display: inline-block; text-decoration: none; white-space: nowrap;
  background: var(--cta-accent, var(--rd-red)); color: var(--cta-on, #fff);
  border-radius: 8px; padding: 8px 18px; font-size: 14px; font-weight: 600; letter-spacing: .1px;
  transition: filter .15s ease;
}
body.rd .rd-cta-btn:hover { filter: brightness(.94); }
body.rd .rd-cta-btn-disabled { opacity: .6; cursor: default; }
body.rd .rd-cta-legal { font-size: 10px; line-height: 1.4; color: var(--rd-faint); padding: 0 14px 7px; }
body.rd .rd-cta-foot { font-size: 11px; line-height: 1.5; color: var(--rd-faint); padding: 1px 14px 8px; }
body.rd .rd-cta-offer { color: var(--rd-body); font-weight: 500; white-space: nowrap; }
body.rd .rd-cta-offer .rd-cta-gift { vertical-align: -2px; margin-right: 3px; }
body.rd .rd-cta-flag { color: var(--rd-faint); }
body.rd .rd-cta-terms { display: inline; }
body.rd .rd-cta-terms > summary { display: inline; cursor: pointer; color: var(--rd-muted); text-decoration: underline; list-style: none; }
body.rd .rd-cta-terms > summary::-webkit-details-marker { display: none; }
body.rd .rd-cta-terms > summary::after { content: " \25BE"; text-decoration: none; font-size: 9px; }
body.rd .rd-cta-terms[open] > summary::after { content: " \25B4"; }
body.rd .rd-cta-terms-body { display: block; margin-top: 5px; color: var(--rd-faint); font-size: 10.5px; line-height: 1.5; max-width: 820px; }
@media (max-width: 760px) {
  body.rd .rd-cta-action { width: 100%; justify-content: space-between; }
  body.rd .rd-cta-btn { flex: 1 1 auto; text-align: center; }
}
/* Fighter-page CTA: wrapper ships display:none; reveal under the redesign and
   give it gutters inside the fighter card (between hero stats and history). */
body.rd .rd-fighter-cta-wrap { display: block !important; padding: 0 16px; }
body.rd .rd-fighter-cta-wrap .rd-odds-cta { margin: 0 0 4px; }
/* "Rumored & future matchups" divider in the fight history */
body.rd .team-stats-table tr.rumored-header td {
  background: var(--rd-tint); color: var(--rd-subtle);
  font-weight: 600; font-size: 12px; padding: 8px 10px;
  border-top: 1px solid var(--rd-rule);
}
@media (max-width: 480px) {
  body.rd .rd-cta-calc { width: 100%; justify-content: flex-start; }
}