/* Original NexPlay design remains in nexplay.css; only additive controls and guides here. */
:root { scroll-padding-top: 92px; }
.hero h1 { font-size:clamp(44px,5.1vw,68px); }
.hero-title-main { display:block; white-space:nowrap; }
.hero-plan-link { display:flex; width:fit-content; align-items:center; gap:8px; margin:14px 0 0; color:var(--cyan); font-size:13px; font-weight:700; }
.marquee-caption { display:flex; align-items:center; justify-content:center; gap:12px; margin:0 auto 20px; }
.marquee-caption .marquee-label { margin:0; padding:0; }
.motion-toggle { flex:0 0 44px; width:44px; height:44px; padding:0; border:1px solid var(--border); border-radius:50%; background:var(--bg-soft); color:var(--muted); font-family:inherit; font-size:13px; font-weight:700; line-height:1; cursor:pointer; }
.motion-toggle[hidden] { display:none; }
.motion-toggle:disabled { opacity:.55; cursor:default; }
/* Resume must work while the pointer stays on the button, outside the moving viewport. */
.channel-marquee:hover .logo-marquee-track,.content-marquee:hover .content-marquee-track { animation-play-state:running; }
@media(hover:hover) and (pointer:fine) {
  .channel-marquee:not(:focus-within) .marquee-viewport:hover .logo-marquee-track,.content-marquee:hover .content-marquee-track { animation-play-state:paused; }
}
.motion-paused .channel-marquee .logo-marquee-track,.motion-paused .content-marquee .content-marquee-track { animation-play-state:paused; }
.content-marquee-track { animation-duration:var(--content-flow-duration,54s); }
.content-marquee figcaption strong { line-height:1.3; }
.football { border-bottom:1px solid var(--border); }
.football-panel { display:block; max-width:860px; margin-inline:auto; overflow:hidden; border:1px solid var(--border-strong); border-radius:32px; background:radial-gradient(circle at 5% 100%,rgba(141,66,255,.16),transparent 28rem),linear-gradient(135deg,#10295a,#071127); box-shadow:var(--shadow); }
.football-copy { padding:44px; min-width:0; text-align:center; }
.football-copy h2 { margin:0 0 20px; font-size:clamp(32px,3.8vw,48px); line-height:1.08; letter-spacing:-.045em; }
.football-copy h2 em { color:var(--cyan); font-style:normal; }
.football-copy>p:not(.section-kicker) { color:var(--muted); font-size:16px; line-height:1.65; }
.football-leagues { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:25px 0; padding:0; list-style:none; }
.football-leagues li { display:flex; min-width:0; align-items:center; flex-direction:column; justify-content:center; gap:9px; padding:12px 6px; border:1px solid var(--border); border-radius:14px; background:rgba(3,10,27,.38); text-align:center; }
.league-mark { display:grid; width:52px; height:52px; padding:6px; place-items:center; flex:0 0 52px; border-radius:10px; background:#fff; }
.league-mark img { width:100%; height:100%; object-fit:contain; }
.football-leagues li>span:last-child { min-height:2.7em; display:grid; align-items:center; font-size:12px; font-weight:750; line-height:1.3; }
.football-copy>p.football-note { margin:16px 0 0; font-size:11px; line-height:1.6; }
.football-broadcast { margin-top:28px; }
.football-broadcast>p { margin:0 0 14px; color:var(--muted); font-size:12px; text-align:center; }
.football-brands { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; max-width:760px; margin:auto; }
.football-brands>span { display:grid; height:57px; padding:11px 17px; background:#f4f7fc; border-radius:12px; place-items:center; }
.football-brands>.brand-dark { background:var(--surface-light); border:1px solid var(--border-strong); }
.football-brands img { width:100%; height:100%; max-width:85px; max-height:35px; object-fit:contain; }
.football-sources { max-width:760px; margin:24px auto 0; padding-top:18px; border-top:1px solid var(--border); color:var(--muted); font-size:12px; line-height:1.7; }
.football-sources summary { min-height:44px; padding-block:10px; cursor:pointer; color:#c6d5ed; text-align:center; }
.football-sources ul { padding-left:20px; }
.football-sources li { margin:7px 0; }
.football-sources a { color:var(--cyan); text-decoration:underline; }
@media(max-width:1050px) { .football-copy { padding:32px; } }
@media(max-width:820px) { .football-panel { border-radius:25px; }.football-copy { padding:28px; }.football-copy h2 { font-size:36px; }.football-leagues { margin:23px 0; }.football-leagues li { min-height:105px; }.football-copy .button { width:100%; } }
@media(max-width:620px) { .football-copy { padding:25px 20px; }.football-copy h2 { font-size:clamp(27px,8.2vw,32px); }.football-copy>p:not(.section-kicker) { font-size:15px; }.football-copy>p.football-note { font-size:11px; }.football-leagues { gap:8px; }.league-mark { width:44px; height:44px; flex-basis:44px; }.football-leagues li { min-height:98px; padding:10px 3px; }.football-leagues li>span:last-child { font-size:11px; }.football-brands { grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }.football-brands>span { height:48px; padding:10px 15px; } }
.plans-carousel { width:100%; max-width:440px; min-width:0; margin-inline:auto; }
.plan-picker { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; margin-bottom:12px; }
.plan-picker button { min-height:44px; padding:8px 4px; border:1px solid var(--border); border-radius:999px; background:rgba(3,10,27,.5); color:var(--muted); font-family:inherit; font-size:12px; font-weight:700; line-height:1.2; cursor:pointer; white-space:nowrap; }
.plan-picker button[aria-pressed="true"] { border-color:var(--cyan); background:rgba(43,224,255,.12); color:#fff; }
.plan-viewport { display:flex; gap:16px; overflow-x:auto; min-width:0; width:100%; border-radius:26px; scroll-snap-type:x mandatory; overscroll-behavior-x:contain; scrollbar-width:none; }
.plan-viewport::-webkit-scrollbar { display:none; }
.plans-carousel .checkout-card { flex:0 0 100%; width:100%; min-width:0; margin:0; scroll-snap-align:start; scroll-snap-stop:always; }
.plan-equivalent { margin:0 0 20px; color:var(--muted); font-size:12px; line-height:1.5; }
.plan-equivalent strong { color:var(--cyan); }
.plans-carousel .checkout-card .button { padding-inline:12px; }
.plan-controls { display:flex; align-items:center; justify-content:center; gap:20px; margin-top:14px; }
.plan-controls span { min-width:44px; color:var(--muted); text-align:center; font-size:12px; }
.plan-arrow { width:44px; height:44px; padding:0; border:1px solid var(--border); border-radius:50%; color:#fff; background:var(--bg-soft); font-size:20px; cursor:pointer; }
.plan-arrow:disabled { opacity:.3; cursor:default; }
.plan-picker[hidden],.plan-controls[hidden] { display:none; }
.plan-hint { margin:9px 0 0; color:var(--muted); font-size:11px; text-align:center; }
.offer-copy .offer-help { margin:24px 0 0; font-size:13px; line-height:1.7; }
.offer-help a,.guide-body a,.guide-aside a { color:var(--cyan); text-decoration:underline; text-underline-offset:4px; }
.anchor-offset { display:block; scroll-margin-top:92px; }
.site-footer nav { flex-wrap:wrap; justify-content:center; row-gap:12px; }
dialog.consent-modal { margin:0; border:0; width:100%; max-width:none; height:100%; max-height:none; color:var(--text); background:transparent; }
dialog.consent-modal:not([open]) { display:none; }
.consent-modal[open] { display:grid; }
dialog.consent-modal::backdrop { background:rgb(0 4 15 / .78); backdrop-filter:blur(5px); }
dialog .consent-modal-card { max-height:calc(100dvh - 36px); overflow-y:auto; }
.guide-hero { padding:65px 0 45px; border-bottom:1px solid var(--border); background:radial-gradient(ellipse at 85% 0,#242b6740,transparent 65%); }
.breadcrumbs { display:flex; flex-wrap:wrap; gap:10px; color:var(--muted); font-size:.8rem; margin-bottom:35px; }
.breadcrumbs a { color:var(--muted); text-decoration:none; }
.guide-hero h1 { max-width:860px; font-size:clamp(2.2rem,4.5vw,3.9rem); letter-spacing:-.045em; line-height:1.08; margin:12px 0 22px; }
.guide-lead { max-width:770px; color:var(--muted); font-size:1.07rem; line-height:1.8; }
.guide-date { margin:22px 0 0; color:var(--muted); font-size:.76rem; }
.guide-layout { display:grid; grid-template-columns:minmax(0,760px) minmax(220px,1fr); gap:70px; padding-top:52px; padding-bottom:80px; }
.guide-body { color:#c8d2e4; line-height:1.85; }
.guide-body h2 { color:#f2f6ff; letter-spacing:-.025em; font-size:1.5rem; line-height:1.3; margin:38px 0 16px; scroll-margin-top:110px; }
.guide-body h2:first-child { margin-top:0; }
.guide-body p { margin:0 0 19px; }
.guide-body li { padding-left:6px; margin:9px 0; }
.guide-body ul,.guide-body ol { padding-left:21px; margin-bottom:24px; }
.guide-aside { align-self:start; position:sticky; top:115px; padding:25px; border:1px solid var(--border); border-radius:18px; background:#101c31; }
.guide-aside h2 { margin:0 0 16px; font-size:1.1rem; }
.guide-aside a { display:block; padding:10px 0; line-height:1.5; font-size:.88rem; }
.guide-aside .button { margin-top:20px; padding:13px; color:#fff; }
.guide-aside p { color:var(--muted); font-size:.8rem; line-height:1.6; }

@media(max-width:1000px) { .guide-layout { gap:36px; grid-template-columns:minmax(0,1fr) 240px; } }
@media(max-width:820px) { .hero-plan-link { margin-inline:auto; } }
@media(max-width:700px) { .guide-layout { display:block; padding-top:36px; padding-bottom:50px; }.guide-aside { position:static; margin-top:35px; }.guide-hero { padding:36px 0; }.guide-hero h1 { font-size:2.35rem; }.guide-lead { font-size:1rem; }.guide-body { font-size:.95rem; } }
@media(max-width:620px) { .hero h1 { font-size:clamp(36px,11vw,52px); line-height:1.08; }.marquee-caption { gap:8px; }.plans-carousel .checkout-card .button { font-size:13px; } }
@media(max-width:380px) { .site-header .button-small { padding-inline:12px; white-space:nowrap; } }
@media(prefers-reduced-motion:reduce) { .plan-viewport { scroll-behavior:auto; } }