/* Hulu Sport Betting Info — dark sportsbook theme on top of the shared engine CSS. */
:root {
  --bg: #101B17;
  --bg-soft: #182820;
  --card: #20352A;
  --card-2: #1a2c23;
  --ink: #FFFFFF;
  --text: #DCE6DF;
  --muted: #A9B9AE;
  --line: rgba(255, 255, 255, .09);
  --line-strong: rgba(255, 255, 255, .16);
  --green: #16A34A;
  --green-bright: #22C55E;
  --gold: #F4C84A;
  --light: #F4F7F4;
  --tint: rgba(34, 197, 94, .10);
  --tint-strong: rgba(34, 197, 94, .18);
  --container: 1240px;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .25);
  --shadow: 0 6px 20px rgba(0, 0, 0, .28);
  --shadow-lg: 0 18px 44px rgba(0, 0, 0, .38);
}
html { background: var(--bg); color-scheme: dark; }
body { background: var(--bg); color: var(--text); font-size: 16px; line-height: 1.65; }
a { color: var(--green-bright); }
:focus-visible { outline-color: var(--gold); }
h1, h2, h3 { color: var(--ink); }
h2 { font-size: clamp(1.35rem, 2.4vw, 1.75rem); }
.section { padding: 30px 0; }
.intro { color: var(--muted); }
.prose > * { max-width: 820px; }
.prose > [class^="hs-"], .prose > [class*=" hs-"] { max-width: none; }
.prose li::marker { color: var(--green-bright); }
.prose table { border-color: var(--line); }
.prose th { background: var(--card); }
.prose th, .prose td { border-color: var(--line); }

/* Buttons */
.btn { box-shadow: 0 2px 0 #0d6b30; border-radius: 10px; }
.btn--ghost { color: var(--ink); border-color: var(--line-strong); background: transparent; }
.btn--ghost:hover { background: rgba(255, 255, 255, .06); }
.btn--gold { background: var(--gold); color: #1b1606; box-shadow: 0 2px 0 #a8831e; }

/* Header */
.site-header { background: rgba(13, 22, 19, .96); border-bottom: 1px solid var(--line); }
.header__inner { min-height: 64px; gap: 14px; }
.logo { color: #fff; gap: 10px; flex: none; }
.logo img { width: 34px; height: 34px; border-radius: 9px; }
.logo__text { display: flex; flex-direction: column; line-height: 1.05; }
.logo__text span { font-weight: 900; letter-spacing: .04em; font-size: 1.08rem; }
.logo__text small { font-size: .66rem; font-weight: 600; color: var(--muted); letter-spacing: .02em; margin-top: 3px; }
.site-nav { margin-left: auto; }
.site-nav a, .nav-more summary { color: var(--text); font-size: .9rem; padding: 8px 10px; font-weight: 650; }
.site-nav a:hover, .site-nav a[aria-current="page"] { background: var(--tint); color: var(--green-bright); }
.nav-more { position: relative; }
.nav-more summary { list-style: none; cursor: pointer; border-radius: 8px; display: flex; align-items: center; gap: 6px; }
.nav-more summary::-webkit-details-marker { display: none; }
.nav-more summary::after { content: ""; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); }
.nav-more summary:hover { background: var(--tint); color: var(--green-bright); }
.nav-more ul { position: absolute; right: 0; top: calc(100% + 8px); min-width: 180px; flex-direction: column; background: var(--card); border: 1px solid var(--line-strong); border-radius: 12px; padding: 6px; box-shadow: var(--shadow-lg); }
.header-links { display: flex; gap: 8px; flex: none; }
.header-links .btn { min-height: 40px; }
.nav-toggle span { background: #fff; }

@media (max-width: 1260px) {
  .nav-toggle { display: block; order: 3; }
  .site-nav { display: none; position: absolute; left: 0; right: 0; top: 64px; background: #0d1613; border-bottom: 1px solid var(--line); box-shadow: var(--shadow-lg); margin: 0; max-height: calc(100vh - 64px); overflow-y: auto; }
  .site-nav.is-open { display: block; }
  .site-nav > ul { flex-direction: column; padding: 8px 16px 16px; }
  .site-nav a, .nav-more summary { padding: 12px; font-size: 1rem; }
  .nav-more ul { position: static; box-shadow: none; border: 0; background: transparent; padding: 0 0 0 12px; }
  .nav-more details[open] summary::after, .nav-more summary::after { display: none; }
  .header-links { margin-left: auto; }
  .nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
}
@media (max-width: 600px) {
  .header-links .btn:not(.header-links__mobile) { display: none; }
  .logo__text small { display: none; }
}

/* Bottom navigation (mobile) */
.bottom-nav { display: none; }
@media (max-width: 900px) {
  .bottom-nav { display: grid; grid-template-columns: repeat(5, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; background: rgba(13, 22, 19, .98); border-top: 1px solid var(--line-strong); padding: 4px 4px calc(4px + env(safe-area-inset-bottom)); }
  .bottom-nav a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: 52px; color: var(--muted); text-decoration: none; font-size: .72rem; font-weight: 700; border-radius: 10px; }
  .bottom-nav a[aria-current="page"] { color: var(--green-bright); background: var(--tint); }
  .bottom-nav .icon { width: 22px; height: 22px; }
  body { padding-bottom: 68px; }
}

/* Breadcrumbs */
.hero-dark .breadcrumbs ol, .hero-dark .breadcrumbs a { color: var(--muted); }

/* Hero */
.hero-dark .hero { background: radial-gradient(900px 420px at 90% -20%, rgba(34, 197, 94, .28), transparent 62%), radial-gradient(600px 300px at -10% 120%, rgba(244, 200, 74, .10), transparent 60%), linear-gradient(180deg, #0d1613, #101B17); border-bottom: 1px solid var(--line); padding: 64px 0 44px; }
.hero h1 { font-size: clamp(1.9rem, 4vw, 2.85rem); }
.hero__lead { color: var(--muted); }
.hero__inner--split { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 40px; }
@media (max-width: 1000px) { .hero__inner--split { grid-template-columns: 1fr; gap: 26px; } }
.hero-dark .badge { background: rgba(34, 197, 94, .12); border-color: rgba(34, 197, 94, .35); color: #d9fbe5; }
.hero-dark .hero__panel { background: rgba(255, 255, 255, .04); }
.highlight { background: var(--card); border-color: var(--line); }
.highlight__value { color: #fff; }
.highlight__icon { background: var(--tint-strong); color: var(--green-bright); }

/* Engine cards in dark */
.fact, .feature, .step__card, .panel, .summary, .table-wrap, .toc, .related, .pc, .verdict { background: var(--card); border-color: var(--line); }
.feature:hover { border-color: rgba(34, 197, 94, .45); }
.feature p, .step__card p { color: var(--muted); }
.feature__icon, .fact__icon, .step__icon, .cell-icon { background: var(--tint-strong); color: var(--green-bright); }
.features { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
.facts dd { color: #fff; }
.step__num { background: var(--green); box-shadow: 0 0 0 5px var(--bg); }
.band .step__num { box-shadow: 0 0 0 5px var(--bg-soft); }
.band--tint .step__num { box-shadow: 0 0 0 5px #13261c; }
.steps::before { background: linear-gradient(var(--line), var(--green), var(--line)); }
.band--soft { background: var(--bg-soft); }
.band--tint { background: #13261c; }
.data-table thead th { background: #1a2c23; color: var(--muted); }
.data-table tbody tr:nth-child(even) { background: rgba(255, 255, 255, .02); }
.data-table th, .data-table td { border-color: var(--line); }
.data-table strong { color: #fff; }

/* Notice */
.notice { max-width: 860px; }
.notice--info { background: rgba(56, 189, 248, .08); border-color: rgba(56, 189, 248, .28); }
.notice--info .notice__icon { color: #7dd3fc; }
.notice--warning { background: rgba(244, 200, 74, .08); border-color: rgba(244, 200, 74, .32); }
.notice--warning .notice__icon { color: var(--gold); }
.notice--important { background: var(--tint); border-color: rgba(34, 197, 94, .3); }
.notice--important .notice__icon { color: var(--green-bright); }
.notice__title { color: #fff; }

/* FAQ */
.faq details { background: var(--card); border-color: var(--line); }
.faq details[open] { border-color: rgba(34, 197, 94, .45); }
.faq summary { color: #fff; }
.faq summary:hover { background: rgba(255, 255, 255, .03); }
.faq summary::after { border-color: var(--green-bright); }
.faq__answer { color: var(--text); }

/* Footer */
.site-footer { background: #0a120f; border-top: 1px solid var(--line); color: var(--muted); margin-top: 40px; }
.site-footer a { color: #e7efe9; text-decoration: none; }
.site-footer a:hover { color: var(--green-bright); text-decoration: underline; }
.footer-cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin-bottom: 26px; }
.footer-col__title { color: #fff; font-weight: 800; margin-bottom: 10px; letter-spacing: .02em; }
.footer-col ul { list-style: none; margin: 0; padding: 0; }
.footer-col li { margin-bottom: 8px; }
.footer-badges { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; margin: 0 0 16px; }
.footer-badges li { border: 1px solid var(--line-strong); border-radius: 999px; padding: 4px 12px; font-size: .8rem; font-weight: 700; color: #fff; }
.footer-rg { border-color: var(--line-strong); }
@media (max-width: 700px) { .footer-cols { grid-template-columns: 1fr 1fr; } }

/* ---------- Components (hs-*) ---------- */
.hs-label { display: inline-flex; align-items: center; gap: 6px; font-size: .72rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--gold); }
.hs-demo-note { font-size: .78rem; color: var(--muted); margin: 10px 0 0; }

/* Link cards */
.hs-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 8px 0 0; }
.hs-card { position: relative; display: flex; gap: 14px; align-items: flex-start; padding: 18px; background: linear-gradient(160deg, #20352A, #182820); border: 1px solid var(--line); border-radius: 14px; color: var(--text); text-decoration: none; transition: border-color .2s, transform .15s; }
.hs-card:hover { border-color: rgba(34, 197, 94, .55); transform: translateY(-1px); text-decoration: none; }
.hs-card__icon { display: inline-flex; flex: none; width: 46px; height: 46px; align-items: center; justify-content: center; border-radius: 12px; background: var(--tint-strong); color: var(--green-bright); }
.hs-card__icon .icon { width: 24px; height: 24px; }
.hs-card strong { display: block; color: #fff; font-size: 1.05rem; margin-bottom: 2px; }
.hs-card span.hs-card__text { display: block; color: var(--muted); font-size: .92rem; line-height: 1.5; }
.hs-card::after { content: "›"; position: absolute; right: 16px; top: 14px; color: var(--green-bright); font-size: 1.4rem; line-height: 1; }
@media (max-width: 900px) { .hs-cards { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .hs-cards { grid-template-columns: 1fr; gap: 10px; } .hs-card { padding: 14px; } }

/* Sport pills (horizontal selector) */
.hs-pills { display: flex; gap: 8px; overflow-x: auto; padding: 2px 0 10px; margin: 0 0 14px; scrollbar-width: thin; list-style: none; }
.hs-pills li { flex: none; }
.hs-pill { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 999px; background: var(--card); border: 1px solid var(--line); color: var(--text); font-weight: 700; font-size: .9rem; text-decoration: none; white-space: nowrap; cursor: pointer; font-family: inherit; }
.hs-pill .icon { width: 18px; height: 18px; color: var(--green-bright); }
.hs-pill.is-active, .hs-pill[aria-pressed="true"], .hs-pill[aria-selected="true"] { background: var(--green); border-color: var(--green); color: #fff; }
.hs-pill.is-active .icon, .hs-pill[aria-selected="true"] .icon { color: #fff; }
a.hs-pill:hover { border-color: var(--green-bright); text-decoration: none; }

/* Event rows (example) */
.hs-board { background: var(--card-2); border: 1px solid var(--line); border-radius: 16px; overflow: hidden; box-shadow: var(--shadow); }
.hs-board__head { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 12px 16px; background: #1d3227; border-bottom: 1px solid var(--line); }
.hs-board__head strong { color: #fff; font-size: .95rem; }
.hs-board__cols { display: grid; grid-template-columns: repeat(3, 56px); gap: 6px; font-size: .72rem; color: var(--muted); font-weight: 800; text-align: center; }
.hs-event { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 12px 16px; border-bottom: 1px solid var(--line); }
.hs-event:last-child { border-bottom: 0; }
.hs-event__teams { min-width: 0; }
.hs-event__teams b { display: block; color: #fff; font-weight: 700; font-size: .95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hs-event__meta { font-size: .76rem; color: var(--muted); }
.hs-odds { display: grid; grid-template-columns: repeat(3, 56px); gap: 6px; }
.hs-odd { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 44px; border-radius: 8px; background: #2a4335; border: 1px solid transparent; color: var(--gold); font-weight: 800; font-size: .92rem; font-family: inherit; cursor: pointer; padding: 2px; }
.hs-odd small { color: var(--muted); font-size: .66rem; font-weight: 700; }
.hs-odd:hover { border-color: var(--gold); }
.hs-odd[aria-pressed="true"] { background: var(--green); color: #fff; }
.hs-odd[aria-pressed="true"] small { color: #d9fbe5; }
@media (max-width: 420px) { .hs-odds, .hs-board__cols { grid-template-columns: repeat(3, 48px); gap: 4px; } .hs-event { padding: 10px 12px; } }

/* Bet slip (demo) */
.hs-slip { background: var(--light); color: #13261c; border-radius: 16px; overflow: hidden; box-shadow: var(--shadow-lg); }
.hs-slip__tabs { display: grid; grid-template-columns: repeat(3, 1fr); background: #dfe8e2; }
.hs-slip__tab { border: 0; background: transparent; padding: 11px 6px; font-weight: 800; font-size: .88rem; color: #3f5649; cursor: pointer; font-family: inherit; min-height: 44px; }
.hs-slip__tab[aria-selected="true"] { background: var(--green); color: #fff; }
.hs-slip__body { padding: 14px 16px 16px; }
.hs-slip__title { display: flex; justify-content: space-between; align-items: center; font-weight: 800; margin-bottom: 8px; color: #101B17; }
.hs-slip__count { background: #101B17; color: #fff; border-radius: 999px; font-size: .75rem; padding: 2px 9px; }
.hs-slip__list { list-style: none; margin: 0 0 10px; padding: 0; }
.hs-slip__item { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; padding: 9px 0; border-bottom: 1px dashed #c9d6cd; font-size: .86rem; }
.hs-slip__item span { color: #55695d; font-size: .78rem; }
.hs-slip__item b { grid-row: span 2; align-self: center; color: #0d6b30; }
.hs-slip__empty { color: #55695d; font-size: .88rem; padding: 8px 0; }
.hs-slip__row { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: .9rem; padding: 4px 0; }
.hs-slip__row label { font-weight: 700; color: #33473b; }
.hs-slip__row input { width: 110px; padding: 8px 10px; border: 1px solid #b9c9be; border-radius: 8px; font: inherit; text-align: right; background: #fff; color: #101B17; }
.hs-slip__return { font-weight: 900; color: #0d6b30; font-size: 1.05rem; }
.hs-slip__foot { margin-top: 10px; padding: 10px 12px; border-radius: 10px; background: #e8efe9; color: #3f5649; font-size: .76rem; line-height: 1.45; }

/* Hero sportsbook composition */
.hs-hero-ui { display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 14px; align-items: start; }
.hs-hero-ui .hs-slip { margin-top: 28px; }
@media (max-width: 1100px) { .hs-hero-ui { grid-template-columns: 1fr; } .hs-hero-ui .hs-slip { margin-top: 0; } }

/* League cards */
.hs-leagues { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.hs-league { position: relative; display: flex; align-items: center; gap: 14px; padding: 18px; border-radius: 14px; background: var(--card); border: 1px solid var(--line); color: var(--text); text-decoration: none; overflow: hidden; }
.hs-league:hover { border-color: rgba(34, 197, 94, .55); text-decoration: none; }
.hs-league--feature { grid-column: span 1; background: linear-gradient(135deg, #1f4a33, #20352A 60%); border-color: rgba(34, 197, 94, .35); }
.hs-crest { flex: none; width: 52px; height: 52px; border-radius: 14px; display: flex; align-items: center; justify-content: center; font-weight: 900; font-size: .95rem; color: #fff; letter-spacing: .02em; background: var(--crest, #2a4335); box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .14); }
.hs-league strong { display: block; color: #fff; font-size: 1.02rem; }
.hs-league span.hs-league__meta { display: block; color: var(--muted); font-size: .84rem; line-height: 1.45; }
@media (max-width: 900px) { .hs-leagues { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .hs-leagues { grid-template-columns: 1fr; gap: 10px; } .hs-league { padding: 14px; } }

/* Game cards */
.hs-games { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; }
.hs-game { display: flex; flex-direction: column; background: var(--card); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; color: var(--text); text-decoration: none; transition: transform .15s, border-color .2s; }
.hs-game:hover { transform: translateY(-2px); border-color: rgba(244, 200, 74, .55); text-decoration: none; }
.hs-game img { width: 100%; height: auto; aspect-ratio: 5 / 3; object-fit: cover; }
.hs-game__body { padding: 12px 14px 14px; }
.hs-game__body strong { display: block; color: #fff; font-size: 1rem; }
.hs-game__tag { display: inline-block; margin-top: 4px; font-size: .72rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--gold); }
.hs-game__body p { margin: 6px 0 0; color: var(--muted); font-size: .86rem; line-height: 1.45; }
.hs-game[hidden] { display: none; }
@media (max-width: 520px) { .hs-games { grid-template-columns: 1fr 1fr; gap: 10px; } .hs-game__body p { display: none; } .hs-game__body { padding: 10px 12px 12px; } }

/* Phone mockup */
.hs-phone-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 40px; align-items: center; }
.hs-phone { width: 270px; margin: 0 auto; padding: 12px; border-radius: 38px; background: #050907; border: 2px solid #2b3b33; box-shadow: var(--shadow-lg), inset 0 0 0 2px #0c1410; }
.hs-phone__screen { border-radius: 28px; overflow: hidden; background: var(--bg); border: 1px solid var(--line); }
.hs-phone__bar { display: flex; justify-content: space-between; align-items: center; padding: 12px 14px; background: #0d1613; border-bottom: 1px solid var(--line); font-weight: 900; color: #fff; font-size: .82rem; letter-spacing: .05em; }
.hs-phone__bar i { font-style: normal; font-size: .64rem; padding: 3px 8px; border-radius: 6px; border: 1px solid var(--line-strong); color: var(--text); letter-spacing: 0; }
.hs-phone__pills { display: flex; gap: 6px; padding: 10px 10px 4px; overflow: hidden; }
.hs-phone__pills span { flex: none; font-size: .66rem; font-weight: 800; padding: 5px 9px; border-radius: 999px; background: var(--card); color: var(--text); }
.hs-phone__pills span:first-child { background: var(--green); color: #fff; }
.hs-phone__list { padding: 6px 10px; display: grid; gap: 6px; }
.hs-phone__row { display: flex; justify-content: space-between; align-items: center; gap: 6px; padding: 8px; border-radius: 10px; background: var(--card); font-size: .68rem; color: #fff; font-weight: 700; }
.hs-phone__row em { font-style: normal; display: flex; gap: 4px; }
.hs-phone__row em span { background: #2a4335; color: var(--gold); border-radius: 5px; padding: 3px 5px; font-size: .62rem; }
.hs-phone__nav { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); margin-top: 8px; }
.hs-phone__nav span { text-align: center; padding: 9px 0; font-size: .6rem; font-weight: 800; color: var(--muted); }
.hs-phone__nav span:first-child { color: var(--green-bright); }
.hs-phone figcaption { text-align: center; }
@media (max-width: 860px) { .hs-phone-wrap { grid-template-columns: 1fr; gap: 24px; } }

/* Market cards */
.hs-markets { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 14px; }
.hs-market { padding: 18px; border-radius: 14px; background: var(--card); border: 1px solid var(--line); }
.hs-market h3 { font-size: 1.05rem; margin: 0 0 6px; }
.hs-market p { margin: 0; color: var(--muted); font-size: .92rem; line-height: 1.55; }
.hs-market__ex { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 10px; }
.hs-market__ex span { display: inline-flex; gap: 6px; align-items: baseline; padding: 5px 9px; border-radius: 8px; background: #2a4335; font-size: .78rem; font-weight: 700; color: var(--text); }
.hs-market__ex b { color: var(--gold); }

/* Club cards */
.hs-clubs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; list-style: none; padding: 0; margin: 0; }
.hs-club { display: flex; align-items: center; gap: 10px; padding: 12px; border-radius: 12px; background: var(--card); border: 1px solid var(--line); color: #fff; font-weight: 700; font-size: .92rem; }
.hs-club .hs-crest { width: 38px; height: 38px; border-radius: 50%; font-size: .72rem; }
@media (max-width: 800px) { .hs-clubs { grid-template-columns: 1fr 1fr; } }

/* Tabs (match centre, lobby) */
.hs-tabs { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 8px; margin-bottom: 14px; }
.hs-panel { background: var(--card-2); border: 1px solid var(--line); border-radius: 14px; padding: 18px; margin-bottom: 12px; }
.hs-panel h3 { margin-top: 0; }
.hs-panel > :last-child { margin-bottom: 0; }
.js .hs-panel[hidden] { display: none; }

/* Today panel */
.hs-today { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 18px; align-items: stretch; }
.hs-date { padding: 22px; border-radius: 16px; background: linear-gradient(140deg, #1f4a33, #182820); border: 1px solid rgba(34, 197, 94, .35); }
.hs-date__day { display: block; font-size: clamp(1.4rem, 3vw, 2rem); font-weight: 900; color: #fff; line-height: 1.15; }
.hs-date__tz { display: block; color: var(--muted); font-size: .86rem; margin-top: 6px; }
.hs-day-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; }
.hs-day { display: flex; flex-direction: column; gap: 2px; padding: 14px; border-radius: 12px; background: var(--card); border: 1px solid var(--line); color: var(--text); text-decoration: none; min-height: 72px; }
.hs-day:hover { border-color: rgba(34, 197, 94, .55); text-decoration: none; }
.hs-day strong { color: #fff; }
.hs-day span { color: var(--muted); font-size: .82rem; }
.hs-empty { margin-top: 16px; display: flex; gap: 12px; align-items: flex-start; padding: 16px 18px; border-radius: 12px; border: 1px dashed var(--line-strong); background: rgba(255, 255, 255, .02); }
.hs-empty .icon { color: var(--gold); width: 24px; height: 24px; margin-top: 2px; }
.hs-empty p { margin: 0; }
.hs-empty strong { color: #fff; }
@media (max-width: 800px) { .hs-today { grid-template-columns: 1fr; } }

/* Status card */
.hs-status { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.hs-status__item { padding: 16px; border-radius: 12px; background: var(--card); border: 1px solid var(--line); }
.hs-status__item strong { display: block; color: #fff; margin-bottom: 4px; }
.hs-status__item p { margin: 0; color: var(--muted); font-size: .9rem; line-height: 1.5; }
.hs-tag { display: inline-block; font-size: .7rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; padding: 3px 8px; border-radius: 6px; margin-bottom: 8px; }
.hs-tag--off { background: rgba(239, 68, 68, .14); color: #fca5a5; }
.hs-tag--warn { background: rgba(244, 200, 74, .14); color: var(--gold); }
.hs-tag--info { background: rgba(56, 189, 248, .12); color: #7dd3fc; }
@media (max-width: 800px) { .hs-status { grid-template-columns: 1fr; } }

/* Calculator */
.hs-calc { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; align-items: end; padding: 20px; border-radius: 16px; background: var(--card); border: 1px solid rgba(34, 197, 94, .3); }
.hs-calc label { display: block; font-size: .8rem; font-weight: 800; color: var(--muted); margin-bottom: 6px; text-transform: uppercase; letter-spacing: .05em; }
.hs-calc input { width: 100%; min-height: 46px; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--line-strong); background: #0f1a15; color: #fff; font: inherit; font-weight: 700; }
.hs-calc output { display: flex; align-items: center; min-height: 46px; padding: 10px 12px; border-radius: 10px; background: rgba(34, 197, 94, .14); color: var(--green-bright); font-weight: 900; font-size: 1.15rem; }
.hs-calc__note { grid-column: 1 / -1; margin: 0; font-size: .82rem; color: var(--muted); }
@media (max-width: 640px) { .hs-calc { grid-template-columns: 1fr; } }

/* Compare (single vs multiple) */
.hs-compare { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.hs-compare > div { padding: 18px; border-radius: 14px; background: var(--card); border: 1px solid var(--line); }
.hs-compare h3 { margin-top: 0; }
.hs-compare ul { margin: 0; padding-left: 1.2em; }
@media (max-width: 700px) { .hs-compare { grid-template-columns: 1fr; } }

/* Sportsbook layout (sidebar / main / slip) */
.hs-book { display: grid; grid-template-columns: 220px minmax(0, 1fr) 300px; gap: 16px; align-items: start; }
.hs-side { background: var(--card-2); border: 1px solid var(--line); border-radius: 14px; padding: 10px; position: sticky; top: 80px; }
.hs-side p { margin: 4px 8px 8px; font-size: .74rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.hs-side ul { list-style: none; margin: 0; padding: 0; }
.hs-side li { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 9px; color: var(--text); font-weight: 650; font-size: .92rem; }
.hs-side li:first-child { background: var(--tint-strong); color: #fff; }
.hs-side .icon { width: 18px; height: 18px; color: var(--green-bright); }
.hs-book__slip { position: sticky; top: 80px; }
.hs-book .hs-pills { display: none; }
@media (max-width: 1100px) { .hs-book { grid-template-columns: minmax(0, 1fr) 280px; } .hs-side { display: none; } .hs-book .hs-pills { display: flex; } }
@media (max-width: 800px) { .hs-book { grid-template-columns: minmax(0, 1fr); } .hs-book__slip { position: static; } }

/* Account access illustration (not a form) */
.hs-access { padding: 22px; border-radius: 18px; background: linear-gradient(160deg, #20352A, #13261c); border: 1px solid var(--line-strong); box-shadow: var(--shadow-lg); }
.hs-access__head { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; color: #fff; font-weight: 800; }
.hs-access__head .icon { color: var(--green-bright); }
.hs-access__field { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 10px; background: rgba(0, 0, 0, .25); border: 1px solid var(--line); color: var(--muted); font-size: .92rem; margin-bottom: 10px; }
.hs-access__field .icon { width: 18px; height: 18px; color: var(--green-bright); }
.hs-access__steps { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 8px; counter-reset: s; }
.hs-access__steps li { counter-increment: s; display: flex; gap: 10px; align-items: center; font-size: .9rem; color: var(--text); }
.hs-access__steps li::before { content: counter(s); flex: none; width: 24px; height: 24px; border-radius: 50%; background: var(--green); color: #fff; font-size: .78rem; font-weight: 800; display: flex; align-items: center; justify-content: center; }

/* Payment cards */
.hs-pay { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.hs-pay__card { display: flex; gap: 14px; align-items: center; padding: 16px; border-radius: 14px; background: var(--card); border: 1px solid var(--line); }
.hs-pay__mark { flex: none; width: 52px; height: 52px; border-radius: 14px; display: flex; align-items: center; justify-content: center; font-weight: 900; font-size: .82rem; color: #fff; background: var(--crest, #2a4335); }
.hs-pay__card strong { display: block; color: #fff; }
.hs-pay__card span { display: block; color: var(--muted); font-size: .84rem; line-height: 1.4; }
@media (max-width: 900px) { .hs-pay { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .hs-pay { grid-template-columns: 1fr; } }

/* Promotions */
.hs-promos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.hs-promo { position: relative; padding: 20px 18px; border-radius: 16px; background: linear-gradient(160deg, #2a3f1c, #20352A 55%); border: 1px solid rgba(244, 200, 74, .25); overflow: hidden; }
.hs-promo .icon { width: 30px; height: 30px; color: var(--gold); margin-bottom: 10px; }
.hs-promo strong { display: block; color: #fff; font-size: 1.05rem; margin-bottom: 4px; }
.hs-promo p { margin: 0 0 10px; color: var(--muted); font-size: .88rem; line-height: 1.5; }
.hs-promo a { font-weight: 700; font-size: .9rem; }
@media (max-width: 1000px) { .hs-promos { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .hs-promos { grid-template-columns: 1fr; } }

/* Brand variations (small text block) */
.hs-variations { padding: 18px 20px; border-radius: 14px; border: 1px solid var(--line); background: rgba(255, 255, 255, .02); font-size: .94rem; color: var(--muted); }
.hs-variations p { margin: 0; }

/* Two-column text + visual */
.hs-split { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 36px; align-items: center; }
@media (max-width: 860px) { .hs-split { grid-template-columns: 1fr; gap: 22px; } }

/* Accordion inside content */
.hs-acc details { border: 1px solid var(--line); border-radius: 10px; background: var(--card); margin-bottom: 8px; }
.hs-acc summary { cursor: pointer; padding: 14px 18px; font-weight: 700; color: #fff; list-style: none; position: relative; padding-right: 44px; }
.hs-acc summary::-webkit-details-marker { display: none; }
.hs-acc summary::after { content: "+"; position: absolute; right: 18px; top: 10px; font-size: 1.3rem; color: var(--green-bright); }
.hs-acc details[open] summary::after { content: "–"; }
.hs-acc details > p { padding: 0 18px 14px; margin: 0; }

/* 404 */
.hs-404 { font-size: clamp(4rem, 14vw, 8rem); font-weight: 900; color: var(--green); line-height: 1; margin: 0 0 10px; }

@media (max-width: 700px) {
  .hero-dark .hero { padding: 54px 0 30px; }
  .hero__lead { font-size: 1.02rem; }
}

/* Helpers */
.hs-odds--2 { grid-template-columns: repeat(2, 56px); }
.hs-odd--empty { background: transparent; cursor: default; }
.hs-leagues--stack { grid-template-columns: 1fr; }
.hs-mt { margin-top: 18px; }
.hs-empty--flush { margin-top: 0; margin-bottom: 12px; }
.hs-status--1 { grid-template-columns: 1fr; }
.hs-book--2 { grid-template-columns: minmax(0, 1fr) 300px; }
.hs-book--2 .hs-pills { display: flex; }
span.hs-slip__tab { display: flex; align-items: center; justify-content: center; min-height: 40px; }
.hs-phone-fig { margin: 0; }
.hs-hero-ui .hs-board__head { padding: 10px 14px; }
@media (max-width: 800px) { .hs-book--2 { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 700px) { .hs-hero-ui .hs-slip { display: none; } }

.prose .hs-pills, .hs-pills { padding: 2px 0 10px; }
.hs-slip__return { white-space: nowrap; }
.hs-pills li { margin: 0; }
.hs-book > *, .hs-split > *, .hs-phone-wrap > *, .hs-hero-ui > *, .hero__inner > * { min-width: 0; }
.prose > div:not(.callout) { max-width: none; }
.prose .hs-clubs, .prose .hs-access__steps, .prose .hs-pills { padding-left: 0; }
/* Affiliate CTA banner on the dark theme */
.cta { background: radial-gradient(520px 220px at 100% 0%, rgba(244, 200, 74, .16), transparent 70%), linear-gradient(135deg, #1f4a33, #13261c); border: 1px solid rgba(34, 197, 94, .35); }
.cta .btn--ghost-light { border-color: var(--line-strong); }
.hero__actions .btn--lg { padding: 14px 22px; } @media (min-width: 1001px) { .hero__inner--split { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.hs-hero-ui .hs-event__teams b { white-space: normal; }