/*
Theme Name: USBookies
Theme URI: https://usbookies.com
Author: Bettercollective
Description: Editorial American-sports blog theme for usbookies.com — independent analysis, previews and how-to guides across the NFL, NBA and MLB. Saira Condensed display + Archivo body, navy / red / gold palette. Full-width templates with a left sidebar, a hero Guides card that reshuffles on every refresh, static Final Scores strip, author profiles, related posts and a betting glossary. Editorial content only — no live odds feeds, no affiliate funnels.
Version: 1.1.1
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: usbookies
Tags: blog, sports, editorial, news, full-width-template, custom-menu, featured-images, translation-ready
*/

/* ============================================================
   1. Design tokens
   ============================================================ */
:root{
  --ub-navy-deep:#081530;   /* top strip + footer surface          */
  --ub-navy:#0B1A38;         /* logo, headings, dark surfaces        */
  --ub-hero-1:#0C1D40;       /* hero gradient start                  */
  --ub-hero-2:#081530;       /* hero gradient end                    */
  --ub-red:#E01E37;          /* primary accent / CTA                 */
  --ub-red-deep:#8E1422;     /* avatar gradient end                  */
  --ub-gold:#F2B53C;         /* secondary accent / star / scores     */
  --ub-up:#1F9D57;           /* power-ranking riser                  */

  --ub-ink:#0B1A38;          /* primary headings / dark text         */
  --ub-body:#2C3850;         /* article body text                    */
  --ub-muted:#8A94A6;        /* meta / muted text on light           */
  --ub-muted-2:#5A6A85;      /* secondary muted on light             */
  --ub-muted-dark:#8FA0BE;   /* muted text on dark                   */
  --ub-muted-dark-2:#9DA9C0; /* footer link text                     */
  --ub-foot-muted:#7585A3;   /* footer fine print                    */

  --ub-paper:#F2F4F7;        /* section background                    */
  --ub-paper-2:#E7EAEF;      /* page background                       */
  --ub-card:#fff;            /* card surface                          */
  --ub-line:#E3E7ED;         /* hairline border                       */
  --ub-line-2:#EDEFF3;       /* inner row border                      */
  --ub-line-dark:#18294A;    /* divider on dark                       */
  --ub-line-dark-2:#1E2F52;  /* dark panel border                     */
  --ub-field-dark:#0A1730;   /* input on dark                         */
  --ub-field-dark-b:#25365A; /* input border on dark                  */

  --ub-container:1200px;
  --ub-gutter:40px;
  --ub-radius:8px;
  --ub-radius-sm:6px;
  --ub-radius-xs:5px;

  --ub-font-display:'Saira Condensed',Impact,sans-serif;
  --ub-font-body:'Archivo',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}

/* ============================================================
   2. Base / reset
   ============================================================ */
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  background:var(--ub-paper-2);
  color:var(--ub-ink);
  font-family:var(--ub-font-body);
  font-size:16px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}
p{margin:0 0 16px;}
:focus-visible{outline:3px solid var(--ub-red);outline-offset:2px;}

.screen-reader-text{
  border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);
  height:1px;width:1px;margin:-1px;padding:0;overflow:hidden;
  position:absolute !important;word-wrap:normal !important;
}
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:100;
  background:var(--ub-red);color:#fff;
  padding:10px 16px;font-weight:800;border-radius:0 0 8px 0;
}
.skip-link:focus{left:0;}

/* ============================================================
   3. Layout primitives — sidebar LEFT (320px), content RIGHT
   ============================================================ */
.ub-container{
  max-width:var(--ub-container);
  margin:0 auto;
  padding:0 var(--ub-gutter);
}
.ub-grid{
  display:grid;
  grid-template-columns:320px 1fr;
  gap:40px;
}
.ub-content{grid-column:2;min-width:0;}
.ub-sidebar{grid-column:1;grid-row:1;}
.ub-section{background:var(--ub-paper);}
.ub-section__inner{padding:38px var(--ub-gutter);}

.ub-display{
  font-family:var(--ub-font-display);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:0.01em;
  line-height:1;
  margin:0;
}

/* ============================================================
   4. Header / navigation
   ============================================================ */
.ub-header{background:var(--ub-card);}

/* static "Final Scores" strip (editorial, not a live feed) */
.ub-scores{background:var(--ub-navy-deep);}
.ub-scores__inner{
  display:flex;align-items:center;gap:20px;height:38px;
}
.ub-scores__label{
  font-family:var(--ub-font-display);font-weight:700;font-size:14px;
  letter-spacing:0.08em;text-transform:uppercase;color:var(--ub-gold);white-space:nowrap;
}
.ub-scores__games{
  flex:1;display:flex;gap:26px;overflow:hidden;font-size:12px;
  color:var(--ub-muted-dark-2);white-space:nowrap;
}
.ub-scores__games b{color:#fff;}
.ub-scores__week{
  font-family:var(--ub-font-display);font-size:13px;font-weight:700;
  letter-spacing:0.06em;text-transform:uppercase;color:var(--ub-muted-dark);white-space:nowrap;
}

/* white masthead bar */
.ub-bar{border-bottom:3px solid var(--ub-navy);}
.ub-bar__inner{display:flex;align-items:center;height:74px;}

.ub-brand{display:inline-flex;align-items:center;gap:11px;white-space:nowrap;}
.ub-brand__mark{
  width:38px;height:38px;border-radius:var(--ub-radius-xs);background:var(--ub-navy);
  display:flex;align-items:center;justify-content:center;color:var(--ub-gold);
  font-size:20px;line-height:1;flex-shrink:0;
}
.ub-brand__text{
  font-family:var(--ub-font-display);font-weight:800;font-size:28px;
  letter-spacing:0.01em;text-transform:uppercase;color:var(--ub-navy);
}
.ub-brand__accent{color:var(--ub-red);}
.ub-brand img{max-height:40px;width:auto;}

.ub-header__nav{flex:1;display:flex;justify-content:center;}
.ub-nav__list{display:flex;gap:30px;list-style:none;margin:0;padding:0;}
.ub-nav__list a{
  color:var(--ub-navy);font-family:var(--ub-font-display);font-weight:700;font-size:18px;
  letter-spacing:0.03em;text-transform:uppercase;border-bottom:3px solid transparent;
  padding:3px 0 2px;transition:color .12s,border-color .12s;display:inline-block;
}
.ub-nav__list a:hover{color:var(--ub-red);border-bottom-color:var(--ub-red);}
.ub-nav__list .current-menu-item > a,
.ub-nav__list .current_page_item > a{color:var(--ub-red);border-bottom-color:var(--ub-red);}

.ub-header__right{display:flex;align-items:center;justify-content:flex-end;gap:18px;}
.ub-search-toggle{
  background:none;border:0;cursor:pointer;color:var(--ub-muted);
  font-size:19px;line-height:1;padding:2px;
}
.ub-search-toggle:hover{color:var(--ub-red);}
.ub-cta{
  background:var(--ub-red);color:#fff;font-family:var(--ub-font-display);font-weight:700;
  font-size:15px;letter-spacing:0.04em;text-transform:uppercase;padding:9px 18px;
  border-radius:var(--ub-radius-xs);white-space:nowrap;
}
.ub-cta:hover{filter:brightness(1.06);}

.ub-nav-toggle{
  display:none;background:none;border:0;cursor:pointer;color:var(--ub-navy);
  width:40px;height:40px;flex-direction:column;justify-content:center;gap:5px;align-items:center;
}
.ub-nav-toggle span{display:block;width:22px;height:2px;background:var(--ub-navy);border-radius:2px;}

.ub-search-drawer{display:none;background:var(--ub-navy-deep);border-top:1px solid var(--ub-line-dark);}
.ub-search-drawer.is-open{display:block;}
.ub-search-form{display:flex;gap:10px;padding:16px 0;}
.ub-search-form .search-field{
  flex:1;border:0;border-radius:var(--ub-radius-sm);padding:11px 14px;font-size:15px;font-family:inherit;
}
.ub-search-form .search-submit{
  background:var(--ub-red);color:#fff;border:0;border-radius:var(--ub-radius-sm);
  padding:11px 18px;font-weight:700;cursor:pointer;font-family:var(--ub-font-display);
  text-transform:uppercase;letter-spacing:0.04em;
}

/* ============================================================
   5. Hero
   ============================================================ */
.ub-hero{
  background:linear-gradient(160deg,var(--ub-hero-1),var(--ub-hero-2));
  color:#fff;position:relative;overflow:hidden;border-bottom:3px solid var(--ub-red);
}
.ub-hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(125deg,transparent,transparent 26px,rgba(255,255,255,0.024) 26px,rgba(255,255,255,0.024) 27px);
}
.ub-hero__inner{
  padding:46px var(--ub-gutter) 50px;position:relative;
  display:grid;grid-template-columns:1.18fr 0.82fr;gap:40px;align-items:center;
}
.ub-hero__title{font-size:58px;margin:0;color:#fff;text-wrap:balance;}
.ub-hero__excerpt{
  font-size:17px;line-height:1.6;color:#AEBAD2;max-width:500px;margin:18px 0 26px;
}
.ub-eyebrow{display:flex;gap:10px;align-items:center;margin-bottom:18px;flex-wrap:wrap;}
.ub-tag{
  background:var(--ub-red);color:#fff;font-size:11px;font-weight:800;
  letter-spacing:0.1em;padding:5px 10px;border-radius:4px;text-transform:uppercase;
}
.ub-cat-label{
  color:var(--ub-gold);font-size:12px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;
}

/* byline */
.ub-byline{display:flex;align-items:center;gap:13px;}
.ub-byline__avatar{
  width:42px;height:42px;border-radius:50%;flex-shrink:0;overflow:hidden;
  background:linear-gradient(135deg,var(--ub-red),var(--ub-red-deep));
}
.ub-byline__avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%;}
.ub-byline__text{font-size:13px;color:var(--ub-muted-dark);font-weight:500;}
.ub-byline__name{color:#fff;font-weight:700;}

/* narrow / centered hero (single, page, glossary term, 404) */
.ub-hero--narrow .ub-hero__inner{display:block;}

/* ============================================================
   6. Power Rankings card (signature editorial element)
   ============================================================ */
.ub-pr{
  background:var(--ub-card);border-radius:var(--ub-radius);overflow:hidden;
  box-shadow:0 24px 50px -28px rgba(0,0,0,0.6);
}
.ub-pr__head{
  background:var(--ub-navy);padding:14px 18px;display:flex;justify-content:space-between;
  align-items:center;border-bottom:3px solid var(--ub-gold);
}
.ub-pr__title{
  font-family:var(--ub-font-display);font-weight:700;font-size:19px;letter-spacing:0.02em;
  text-transform:uppercase;color:#fff;margin:0;
}
.ub-pr__week{font-size:11px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--ub-muted-dark);}
.ub-pr__body{padding:6px 18px 12px;}
.ub-pr__row{display:flex;align-items:center;gap:13px;padding:11px 0;border-bottom:1px solid var(--ub-line-2);}
.ub-pr__row:last-child{border-bottom:0;}
.ub-pr__rank{font-family:var(--ub-font-display);font-weight:800;font-size:22px;color:var(--ub-navy);width:22px;}
.ub-pr__dot{width:11px;height:11px;border-radius:50%;background:var(--ub-muted);flex-shrink:0;}
.ub-pr__team{flex:1;font-weight:700;font-size:15px;color:var(--ub-navy);}
.ub-pr__move{font-family:var(--ub-font-display);font-weight:700;font-size:14px;color:var(--ub-muted);}
.ub-pr__move--up{color:var(--ub-up);}
.ub-pr__move--down{color:var(--ub-red);}
.ub-pr__foot{
  background:#F6F8FB;border-top:1px solid var(--ub-line-2);padding:9px 18px;
  font-size:11px;font-weight:600;color:var(--ub-muted);text-align:center;letter-spacing:0.03em;
}

/* Guides variant — cycling guide list in the same card shell */
.ub-guides__row{display:flex;align-items:center;gap:13px;padding:11px 0;border-bottom:1px solid var(--ub-line-2);}
.ub-guides__row:last-child{border-bottom:0;}
.ub-guides__row.is-hidden{display:none;}
.ub-guides__num{font-family:var(--ub-font-display);font-weight:800;font-size:20px;color:var(--ub-red);width:24px;flex-shrink:0;}
.ub-guides__title{flex:1;min-width:0;font-weight:700;font-size:14px;line-height:1.25;color:var(--ub-navy);}
.ub-guides__go{color:var(--ub-muted);font-weight:700;flex-shrink:0;}
.ub-guides__row:hover .ub-guides__title,.ub-guides__row:hover .ub-guides__go{color:var(--ub-red);}
.ub-guides__more{display:block;color:var(--ub-red);font-weight:700;text-transform:uppercase;letter-spacing:0.04em;}
.ub-guides__more:hover{filter:brightness(0.9);}

/* ============================================================
   7. Breadcrumb
   ============================================================ */
.ub-breadcrumb{font-size:12px;color:var(--ub-muted-dark);font-weight:600;margin-bottom:16px;}
.ub-breadcrumb a{color:var(--ub-muted-dark);}
.ub-breadcrumb a:hover{color:var(--ub-gold);}
.ub-breadcrumb__current{color:var(--ub-gold);}
.ub-breadcrumb__sep{margin:0 6px;}

/* ============================================================
   8. Topics bar
   ============================================================ */
.ub-topics{background:var(--ub-card);border-bottom:1px solid var(--ub-line);}
.ub-topics__inner{padding:13px var(--ub-gutter);display:flex;gap:9px;align-items:center;}
.ub-topics__label{
  font-size:11px;font-weight:800;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--ub-muted);white-space:nowrap;
}
.ub-chips{display:flex;gap:8px;flex-wrap:wrap;list-style:none;margin:0;padding:0;}
.ub-chip{
  background:var(--ub-paper);color:#3D4860;font-weight:600;font-size:13px;
  padding:6px 14px;border-radius:var(--ub-radius-xs);border:1px solid var(--ub-line);display:inline-block;
}
.ub-chip:hover{border-color:var(--ub-red);color:var(--ub-red);}
.ub-chip.is-active{background:var(--ub-red);color:#fff;font-weight:700;border-color:var(--ub-red);}

/* ============================================================
   9. Section heading row
   ============================================================ */
.ub-section-head{
  display:flex;justify-content:space-between;align-items:center;
  margin-bottom:20px;gap:16px;border-bottom:2px solid var(--ub-navy);padding-bottom:10px;
}
.ub-section-head__title{font-size:26px;color:var(--ub-navy);}
.ub-link-more{
  color:var(--ub-red);font-weight:700;font-size:13px;text-transform:uppercase;
  letter-spacing:0.04em;white-space:nowrap;
}
.ub-link-more:hover{filter:brightness(0.9);}

/* ============================================================
   10. Post cards
   ============================================================ */
.ub-card-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.ub-card{
  background:var(--ub-card);border:1px solid var(--ub-line);border-radius:var(--ub-radius);
  overflow:hidden;display:flex;flex-direction:column;
}
.ub-card__media{height:150px;background:linear-gradient(135deg,var(--ub-hero-1),#04101F);display:block;}
.ub-card__media img{width:100%;height:100%;object-fit:cover;}
.ub-card__body{padding:16px;}
.ub-card__eyebrow{
  font-size:11px;font-weight:800;color:var(--ub-red);text-transform:uppercase;letter-spacing:0.08em;
}
.ub-card__title{
  font-family:var(--ub-font-display);font-weight:700;font-size:21px;line-height:1.08;
  text-transform:uppercase;margin:8px 0 10px;color:var(--ub-ink);
}
.ub-card__title a{color:inherit;}
.ub-card__title a:hover{color:var(--ub-red);}
.ub-card__meta{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ub-muted);font-weight:600;}
.ub-card__meta-avatar{width:24px;height:24px;border-radius:50%;overflow:hidden;flex-shrink:0;background:linear-gradient(135deg,var(--ub-red),var(--ub-red-deep));}
.ub-card__meta-avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%;}
.ub-card--compact .ub-card__title{margin:6px 0 0;font-size:20px;}

/* load-more / button */
.ub-btn-block{
  display:block;text-align:center;margin-top:22px;background:var(--ub-navy);color:#fff;
  font-family:var(--ub-font-display);font-weight:700;font-size:16px;letter-spacing:0.04em;
  text-transform:uppercase;padding:14px;border-radius:var(--ub-radius-sm);
}
.ub-btn-block:hover{filter:brightness(1.15);}

/* ============================================================
   11. Archive list rows
   ============================================================ */
.ub-list{display:flex;flex-direction:column;gap:16px;}
.ub-list-row{
  display:flex;gap:18px;align-items:stretch;background:var(--ub-card);
  border:1px solid var(--ub-line);border-radius:var(--ub-radius);overflow:hidden;
}
.ub-list-row__media{width:190px;flex-shrink:0;background:linear-gradient(135deg,#134A8E,#08203F);display:block;}
.ub-list-row__media img{width:100%;height:100%;object-fit:cover;}
.ub-list-row__body{padding:18px 20px 18px 0;flex:1;min-width:0;}
.ub-list-row__eyebrow{font-size:11px;font-weight:800;color:var(--ub-red);text-transform:uppercase;letter-spacing:0.08em;}
.ub-list-row__title{
  font-family:var(--ub-font-display);font-weight:700;font-size:24px;line-height:1.05;
  text-transform:uppercase;margin:6px 0 8px;color:var(--ub-ink);
}
.ub-list-row__title a:hover{color:var(--ub-red);}
.ub-list-row__meta{font-size:12px;color:var(--ub-muted);font-weight:600;}

/* ============================================================
   12. Pagination
   ============================================================ */
.ub-pagination{display:flex;gap:7px;justify-content:center;margin-top:28px;}
.ub-pagination .page-numbers{
  min-width:40px;height:40px;padding:0 10px;display:flex;align-items:center;justify-content:center;
  border-radius:var(--ub-radius-sm);background:var(--ub-card);border:1px solid var(--ub-line);
  font-family:var(--ub-font-display);font-weight:800;font-size:17px;color:var(--ub-navy);
}
.ub-pagination .page-numbers.current{background:var(--ub-red);color:#fff;border-color:var(--ub-red);}
.ub-pagination a.page-numbers:hover{border-color:var(--ub-red);color:var(--ub-red);}

/* ============================================================
   13. Single article body
   ============================================================ */
.ub-article__featured{
  height:300px;border-radius:var(--ub-radius);overflow:hidden;margin-bottom:26px;
  background:linear-gradient(135deg,var(--ub-hero-1),#04101F);
}
.ub-article__featured img{width:100%;height:100%;object-fit:cover;}
.ub-prose{font-size:17px;line-height:1.75;color:var(--ub-body);}
.ub-prose p{margin:0 0 18px;}
.ub-prose strong{color:var(--ub-navy);}
.ub-prose h2{
  font-family:var(--ub-font-display);font-weight:800;font-size:30px;text-transform:uppercase;
  color:var(--ub-navy);margin:30px 0 12px;letter-spacing:0.01em;line-height:1.05;
}
.ub-prose h3{
  font-family:var(--ub-font-display);font-weight:700;font-size:24px;text-transform:uppercase;
  color:var(--ub-navy);margin:24px 0 10px;letter-spacing:0.01em;line-height:1.08;
}
.ub-prose a{color:var(--ub-red);text-decoration:underline;text-underline-offset:2px;}
.ub-prose ul,.ub-prose ol{margin:0 0 18px;padding-left:22px;line-height:1.75;}
.ub-prose img{border-radius:var(--ub-radius);margin:8px 0 20px;}
.ub-prose blockquote{
  background:var(--ub-card);border:1px solid var(--ub-line);border-left:4px solid var(--ub-red);
  margin:0 0 20px;padding:16px 20px;border-radius:0 var(--ub-radius) var(--ub-radius) 0;
  font-size:17px;color:var(--ub-body);
}

/* editorial formula callout ([ub_formula]) */
.ub-formula{
  background:var(--ub-card);border:1px solid var(--ub-line);border-left:4px solid var(--ub-red);
  border-radius:0 var(--ub-radius) var(--ub-radius) 0;padding:18px 20px;margin:0 0 22px;
}
.ub-formula__label{
  font-size:12px;font-weight:800;color:var(--ub-red);text-transform:uppercase;
  letter-spacing:0.06em;margin-bottom:6px;
}
.ub-formula__value{font-family:var(--ub-font-display);font-weight:800;font-size:28px;color:var(--ub-navy);letter-spacing:0.01em;}

/* worked-example odds box ([ub_example]/[ub_odds]) — static editorial figure, not live odds */
.ub-example{background:var(--ub-card);border:1px solid var(--ub-line);border-radius:var(--ub-radius);overflow:hidden;margin:24px 0;}
.ub-example__head{
  background:var(--ub-navy);border-bottom:3px solid var(--ub-gold);font-family:var(--ub-font-display);
  font-size:16px;font-weight:700;letter-spacing:0.03em;text-transform:uppercase;color:#fff;padding:11px 16px;
}
.ub-example__grid{display:flex;flex-wrap:wrap;gap:1px;background:var(--ub-line);}
.ub-odds{background:var(--ub-card);padding:16px;text-align:center;flex:1 1 0;min-width:90px;}
.ub-odds__price{font-size:12px;font-weight:700;color:var(--ub-muted);}
.ub-odds__prob{font-family:var(--ub-font-display);font-weight:800;font-size:26px;color:var(--ub-navy);margin-top:4px;}
.ub-odds__prob--hot{color:var(--ub-red);}

/* ============================================================
   14. Author box (end of single.php)
   ============================================================ */
.ub-authorbox{
  background:var(--ub-card);border:1px solid var(--ub-line);border-left:4px solid var(--ub-red);
  border-radius:var(--ub-radius);padding:22px;display:flex;gap:18px;align-items:center;margin:8px 0 30px;
}
.ub-authorbox__avatar{
  width:72px;height:72px;border-radius:50%;flex-shrink:0;overflow:hidden;
  background:linear-gradient(135deg,var(--ub-red),var(--ub-red-deep));
}
.ub-authorbox__avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%;}
.ub-authorbox__head{display:flex;align-items:center;gap:9px;flex-wrap:wrap;}
.ub-authorbox__name{font-family:var(--ub-font-display);font-weight:800;font-size:24px;text-transform:uppercase;margin:0;color:var(--ub-ink);}
.ub-authorbox__name a{color:inherit;}
.ub-authorbox__name a:hover{color:var(--ub-red);}
.ub-badge{
  background:var(--ub-navy);color:var(--ub-gold);font-size:10px;font-weight:800;
  letter-spacing:0.06em;text-transform:uppercase;padding:3px 8px;border-radius:4px;white-space:nowrap;
}
.ub-badge--red{background:var(--ub-red);color:#fff;}
.ub-authorbox__bio{font-size:13px;color:var(--ub-muted-2);line-height:1.55;margin:7px 0 0;}

/* ============================================================
   15. Related posts ("Read next")
   ============================================================ */
.ub-related__title{
  font-family:var(--ub-font-display);font-weight:800;font-size:24px;text-transform:uppercase;
  color:var(--ub-ink);border-bottom:2px solid var(--ub-navy);padding-bottom:8px;margin:0 0 18px;
}
.ub-related__grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.ub-related-card{background:var(--ub-card);border:1px solid var(--ub-line);border-radius:var(--ub-radius);overflow:hidden;display:flex;flex-direction:column;}
.ub-related-card__media{display:block;height:104px;background:linear-gradient(135deg,#552583,#27114A);}
.ub-related-card__media img{width:100%;height:100%;object-fit:cover;display:block;}
.ub-related-card__body{display:block;padding:14px;}
.ub-related-card__eyebrow{display:block;font-size:11px;font-weight:800;color:var(--ub-red);text-transform:uppercase;letter-spacing:0.08em;}
.ub-related-card__title{display:block;font-family:var(--ub-font-display);font-weight:700;font-size:19px;line-height:1.08;text-transform:uppercase;margin-top:5px;color:var(--ub-ink);}
.ub-related-card:hover .ub-related-card__title{color:var(--ub-red);}

/* ============================================================
   16. Sidebar widgets
   ============================================================ */
.ub-sidebar{display:flex;flex-direction:column;gap:18px;}
.ub-widget{background:var(--ub-card);border:1px solid var(--ub-line);border-radius:var(--ub-radius);padding:18px;}
.ub-widget__title{
  font-family:var(--ub-font-display);font-weight:800;font-size:18px;letter-spacing:0.02em;
  text-transform:uppercase;color:var(--ub-navy);border-bottom:2px solid var(--ub-red);
  padding-bottom:8px;margin:0 0 12px;
}

/* TOC widget */
.ub-widget--toc{position:sticky;top:20px;}
.ub-toc{display:flex;flex-direction:column;gap:10px;font-size:14px;list-style:none;margin:0;padding:0;}
.ub-toc a{color:var(--ub-muted-2);border-left:3px solid var(--ub-line);padding-left:11px;display:block;}
.ub-toc a:hover,.ub-toc a.is-active{color:var(--ub-navy);font-weight:700;border-left-color:var(--ub-red);}

/* trending / ranked list */
.ub-ranked{display:flex;flex-direction:column;list-style:none;margin:0;padding:0;}
.ub-ranked li{display:flex;gap:13px;align-items:baseline;padding:9px 0;border-bottom:1px solid var(--ub-line-2);}
.ub-ranked li:last-child{border-bottom:0;}
.ub-ranked__num{font-family:var(--ub-font-display);font-weight:800;font-size:20px;color:var(--ub-red);}
.ub-ranked__title{font-weight:600;font-size:14px;line-height:1.3;color:var(--ub-ink);}
.ub-ranked__title a:hover{color:var(--ub-red);}

/* browse-by-league list */
.ub-leagues{display:flex;flex-direction:column;}
.ub-league{display:flex;align-items:center;gap:11px;padding:10px 0;border-bottom:1px solid var(--ub-line-2);}
.ub-league:last-child{border-bottom:0;}
.ub-league__icon{
  width:34px;height:34px;border-radius:var(--ub-radius-sm);background:var(--ub-paper);
  border:1px solid var(--ub-line);display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.ub-league__main{flex:1;min-width:0;}
.ub-league__name{font-weight:700;font-size:14px;color:var(--ub-ink);}
.ub-league__name a:hover{color:var(--ub-red);}
.ub-league__sub{font-size:11px;color:var(--ub-muted);font-weight:600;}
.ub-league__count{font-family:var(--ub-font-display);font-weight:700;color:var(--ub-muted);font-size:15px;}

/* plain link list */
.ub-linklist{display:flex;flex-direction:column;gap:12px;font-weight:600;font-size:14px;line-height:1.3;list-style:none;margin:0;padding:0;}
.ub-linklist a:hover{color:var(--ub-red);}

/* about widget (author / archive) */
.ub-about{display:flex;flex-direction:column;}
.ub-about__row{display:flex;justify-content:space-between;font-size:13px;padding:8px 0;border-bottom:1px solid var(--ub-line-2);gap:12px;}
.ub-about__row:last-child{border-bottom:0;}
.ub-about__row > span:first-child{color:var(--ub-muted-2);font-weight:500;}
.ub-about__val{color:var(--ub-navy);font-weight:700;text-align:right;}
.ub-about__val--accent{color:var(--ub-red);}

/* The Tip Sheet (newsletter, dark) */
.ub-newsletter{background:linear-gradient(160deg,var(--ub-hero-1),var(--ub-hero-2));border-radius:var(--ub-radius);padding:20px;border-top:3px solid var(--ub-red);}
.ub-newsletter__title{font-family:var(--ub-font-display);font-weight:800;font-size:21px;letter-spacing:0.02em;text-transform:uppercase;color:#fff;margin:0;}
.ub-newsletter__text{font-size:13px;line-height:1.5;color:#AEBAD2;margin:6px 0 13px;}
.ub-newsletter__form{display:flex;flex-direction:column;gap:9px;}
.ub-newsletter__input{
  background:var(--ub-field-dark);border:1px solid var(--ub-field-dark-b);border-radius:var(--ub-radius-sm);
  padding:11px 13px;font-size:13px;color:#fff;font-family:inherit;width:100%;
}
.ub-newsletter__input::placeholder{color:var(--ub-muted-dark);}
.ub-newsletter__btn{
  background:var(--ub-red);color:#fff;font-family:var(--ub-font-display);font-weight:700;font-size:15px;
  letter-spacing:0.04em;text-transform:uppercase;padding:11px;border-radius:var(--ub-radius-sm);
  text-align:center;border:0;cursor:pointer;width:100%;
}
.ub-newsletter__btn:hover{filter:brightness(1.06);}

/* ============================================================
   17. Author hero
   ============================================================ */
.ub-author-hero{
  background:linear-gradient(160deg,var(--ub-hero-1),var(--ub-hero-2));
  color:#fff;border-bottom:3px solid var(--ub-red);
}
.ub-author-hero__inner{padding:34px var(--ub-gutter);display:flex;align-items:center;gap:24px;flex-wrap:wrap;}
.ub-author-hero__avatar{
  width:100px;height:100px;border-radius:50%;flex-shrink:0;overflow:hidden;border:3px solid var(--ub-gold);
  background:linear-gradient(135deg,var(--ub-red),var(--ub-red-deep));
}
.ub-author-hero__avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%;}
.ub-author-hero__main{flex:1;min-width:260px;}
.ub-author-hero__name-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.ub-author-hero__name{font-family:var(--ub-font-display);font-weight:800;font-size:40px;text-transform:uppercase;color:#fff;margin:0;}
.ub-author-hero__bio{font-size:13px;color:var(--ub-muted-dark);font-weight:500;margin:6px 0 0;max-width:560px;line-height:1.5;}
.ub-author-stats{display:flex;gap:1px;background:var(--ub-line-dark-2);border:1px solid var(--ub-line-dark-2);border-radius:var(--ub-radius);overflow:hidden;}
.ub-author-stat{background:#0A1A38;padding:14px 22px;text-align:center;}
.ub-author-stat__num{font-family:var(--ub-font-display);font-weight:800;font-size:28px;color:#fff;}
.ub-author-stat:first-child .ub-author-stat__num{color:var(--ub-gold);}
.ub-author-stat__label{font-size:10px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ub-muted-dark);}

/* ============================================================
   18. Archive / glossary headers
   ============================================================ */
.ub-archive-head{background:linear-gradient(160deg,var(--ub-hero-1),var(--ub-hero-2));color:#fff;border-bottom:3px solid var(--ub-red);}
.ub-archive-head__inner{padding:34px var(--ub-gutter);}
.ub-archive-head__eyebrow{font-size:12px;color:var(--ub-muted-dark);font-weight:700;letter-spacing:0.1em;text-transform:uppercase;}
.ub-archive-head__title{font-family:var(--ub-font-display);font-weight:800;font-size:50px;text-transform:uppercase;letter-spacing:0.01em;color:#fff;margin:4px 0 0;}
.ub-archive-head__meta{font-size:13px;color:var(--ub-muted-dark);font-weight:500;margin:6px 0 0;}

/* A–Z index */
.ub-az{display:flex;gap:7px;flex-wrap:wrap;list-style:none;margin:18px 0 0;padding:0;}
.ub-az a{
  background:#0A1A38;border:1px solid var(--ub-line-dark-2);color:var(--ub-muted-dark);
  font-family:var(--ub-font-display);font-weight:700;font-size:15px;
  width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:var(--ub-radius-xs);
}
.ub-az a:hover,.ub-az .is-active a{background:var(--ub-red);color:#fff;border-color:var(--ub-red);}

/* ============================================================
   19. Glossary terms
   ============================================================ */
.ub-terms{display:flex;flex-direction:column;gap:14px;}
.ub-az-anchor{display:block;position:relative;top:-90px;visibility:hidden;}
.ub-term{background:var(--ub-card);border:1px solid var(--ub-line);border-left:4px solid var(--ub-red);border-radius:var(--ub-radius);padding:18px 20px;}
.ub-term__name{font-family:var(--ub-font-display);font-weight:700;font-size:22px;text-transform:uppercase;color:var(--ub-navy);margin:0;}
.ub-term__alias{font-size:13px;font-weight:600;color:var(--ub-muted);text-transform:none;}
.ub-term__def{font-size:14px;color:var(--ub-body);line-height:1.6;margin-top:5px;}

/* ============================================================
   20. Footer
   ============================================================ */
.ub-footer{background:var(--ub-navy-deep);color:var(--ub-muted-dark-2);}
.ub-footer a{color:var(--ub-muted-dark-2);}
.ub-footer a:hover{color:#fff;}
.ub-footer__cols{padding:36px var(--ub-gutter);display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:30px;}
.ub-footer__brand .ub-brand__mark{background:#fff;color:var(--ub-navy);width:30px;height:30px;font-size:16px;}
.ub-footer__brand .ub-brand__text{font-size:22px;color:#fff;}
.ub-footer__brand .ub-brand__accent{color:#fff;}
.ub-footer__blurb{font-size:13px;line-height:1.6;margin:14px 0 0;max-width:320px;}
.ub-footer__col-title{color:#fff;font-weight:700;font-size:13px;margin-bottom:11px;text-transform:uppercase;letter-spacing:0.06em;}
.ub-footer__links{display:flex;flex-direction:column;gap:8px;font-size:13px;list-style:none;margin:0;padding:0;}
.ub-footer__bar{border-top:1px solid var(--ub-line-dark);}
.ub-footer__bar-inner{padding:16px var(--ub-gutter);font-size:12px;line-height:1.6;color:var(--ub-foot-muted);}

/* ============================================================
   21. WordPress core / utility
   ============================================================ */
.alignleft{float:left;margin:0 20px 12px 0;}
.alignright{float:right;margin:0 0 12px 20px;}
.aligncenter{margin-left:auto;margin-right:auto;}
.wp-caption{max-width:100%;}
.wp-caption-text{font-size:13px;color:var(--ub-muted);margin-top:6px;}
.ub-comments{margin-top:32px;}
.ub-page-links{margin:16px 0;font-weight:700;}
.comment-list{list-style:none;margin:0;padding:0;}

/* ============================================================
   22. Responsive
   ============================================================ */
@media (max-width:900px){
  :root{--ub-gutter:20px;}
  .ub-grid{grid-template-columns:1fr;gap:30px;}
  .ub-content{grid-column:auto;}
  .ub-sidebar{grid-column:auto;grid-row:auto;}
  .ub-hero__inner{grid-template-columns:1fr;}
  .ub-hero__title{font-size:40px;}
  .ub-archive-head__title,.ub-author-hero__name{font-size:34px;}
  .ub-widget--toc{position:static;}

  .ub-header__nav,.ub-header__right .ub-cta{display:none;}
  .ub-nav-toggle{display:flex;}
  .ub-header.is-open .ub-header__nav{
    display:flex;position:absolute;left:0;right:0;top:112px;z-index:40;
    background:var(--ub-card);padding:8px var(--ub-gutter) 18px;border-bottom:3px solid var(--ub-navy);
  }
  .ub-header.is-open .ub-nav__list{flex-direction:column;gap:2px;width:100%;}
  .ub-header.is-open .ub-nav__list a{display:block;padding:11px 0;border-bottom:1px solid var(--ub-line);border-top:0;}
  .ub-header{position:relative;}
  .ub-bar__inner{justify-content:space-between;}
  .ub-header__right{flex:0;}
}

@media (max-width:600px){
  .ub-hero__title{font-size:32px;}
  .ub-card-grid,.ub-related__grid{grid-template-columns:1fr;}
  .ub-list-row{flex-direction:column;align-items:stretch;}
  .ub-list-row__media{width:100%;height:170px;}
  .ub-list-row__body{padding:0 18px 18px;}
  .ub-author-stats{width:100%;}
  .ub-author-stat{flex:1;}
  .ub-archive-head__title{font-size:32px;}
  .ub-scores__week{display:none;}
}

/* ============================================================
   23. Colour + font lock (design source of truth)
   ------------------------------------------------------------
   Title elements are usually links; a host's global a{} or
   theme.json heading colour can repaint them. These class-level
   selectors out-specify any bare a{} and pin each text role to
   its design colour. Keep this block LAST so it wins ties.
   ============================================================ */
.ub-hero__title,.ub-section-head__title,.ub-widget__title,.ub-related__title,
.ub-authorbox__name,.ub-author-hero__name,.ub-archive-head__title,.ub-term__name,
.ub-newsletter__title,.ub-pr__title,.ub-prose h2,.ub-prose h3,.ub-formula__value,
.ub-odds__prob,.ub-card__title,.ub-card__title a,.ub-list-row__title,
.ub-list-row__title a,.ub-related-card__title,.ub-brand__text{
  font-family:var(--ub-font-display);
}

/* WHITE on dark hero/footer surfaces */
.ub-hero__title,.ub-hero__title a,.ub-hero__title a:link,.ub-hero__title a:visited,
.ub-hero__title a:hover,.ub-author-hero__name,.ub-archive-head__title,.ub-pr__title{
  color:#fff !important;
}
.ub-hero__excerpt,.ub-author-hero__bio{color:#AEBAD2 !important;}

/* NAVY: section headings, card/list/term/related titles */
.ub-section-head__title,.ub-widget__title,.ub-related__title,.ub-prose h2,.ub-prose h3,
.ub-term__name,.ub-pr__team,.ub-odds__prob{color:var(--ub-navy) !important;}
.ub-card__title,.ub-card__title a,.ub-card__title a:link,.ub-card__title a:visited,
.ub-list-row__title,.ub-list-row__title a,.ub-list-row__title a:link,.ub-list-row__title a:visited,
.ub-related-card__title,.ub-authorbox__name,.ub-authorbox__name a{color:var(--ub-ink) !important;}
.ub-card__title a:hover,.ub-list-row__title a:hover,.ub-authorbox__name a:hover,
.ub-related-card:hover .ub-related-card__title{color:var(--ub-red) !important;}

/* RED: kickers / eyebrows / trending + guide numbers */
.ub-card__eyebrow,.ub-list-row__eyebrow,.ub-related-card__eyebrow,.ub-ranked__num,.ub-guides__num{color:var(--ub-red) !important;}
.ub-guides__title{color:var(--ub-navy) !important;}
.ub-guides__row:hover .ub-guides__title{color:var(--ub-red) !important;}
.ub-guides__more,.ub-guides__more:link,.ub-guides__more:visited{color:var(--ub-red) !important;}

/* GOLD-on-navy hot odds stays red; mini-brand in footer stays white */
.ub-odds__prob--hot{color:var(--ub-red) !important;}
.ub-footer .ub-brand__text,.ub-footer .ub-brand__accent{color:#fff !important;}
.ub-nav__list a{font-family:var(--ub-font-display) !important;}