:root { --sports:#0b7a54; --sports-deep:#064e3b; --sports-blue:#1264d8; }
[hidden] { display:none !important; }
body[data-service="sports"] { --accent:var(--sports); --accent-soft:rgba(11,122,84,.09); }
body[data-service="sports"] .page { padding-top:clamp(6px,.7vw,9px); }
body[data-service="sports"] .header { margin-bottom:9px; }
.sports-hero { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:8px; padding:12px 18px; overflow:hidden; border:1px solid color-mix(in srgb,var(--sports) 26%,var(--border)); border-radius:16px; background:linear-gradient(120deg,color-mix(in srgb,var(--card) 91%,#dcfce7 9%),color-mix(in srgb,var(--card) 91%,#dbeafe 9%)); box-shadow:var(--shadow); }
.sports-hero > div:first-child { display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:2px 12px; min-width:0; }
.sports-kicker,.section-heading span { color:var(--sports); font-size:11px; font-weight:950; letter-spacing:.13em; }
.sports-hero h2 { margin:0; font-size:clamp(21px,2.2vw,29px); line-height:1.15; }
.sports-hero p { grid-column:1/-1; overflow:hidden; margin-top:2px; color:var(--muted); font-size:11px; white-space:nowrap; text-overflow:ellipsis; }
.sports-summary { grid-column:1/-1; display:flex; flex-wrap:wrap; gap:5px; margin-top:5px; }.sports-summary span { padding:3px 7px; border:1px solid color-mix(in srgb,var(--sports) 22%,var(--border)); border-radius:999px; background:var(--card); color:var(--muted); font-size:8px; font-weight:750; }.sports-summary b { color:var(--sports); }
.sports-now { display:grid; grid-template-columns:auto auto; align-items:center; gap:1px 7px; flex:0 0 auto; padding:8px 11px; border:1px solid rgba(11,122,84,.2); border-radius:12px; background:var(--card); }
.sports-now > span { grid-row:1/3; display:grid; width:22px; height:22px; place-items:center; border-radius:7px; background:linear-gradient(135deg,var(--sports),var(--sports-blue)); color:#fff; font-size:8px; box-shadow:0 4px 10px rgba(11,122,84,.2); }
.sports-now strong { font-size:12px; }.sports-now small { color:var(--muted); font-size:9px; }
.sports-feed,.watch-section { margin-bottom:14px; }
.sports-controls { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:5px 2px 7px; }
.scope-tabs { display:inline-flex; padding:3px; border:1px solid var(--border); border-radius:12px; background:var(--card); }
.scope-tabs button,.sport-tabs button { border:0; font:inherit; font-size:12px; font-weight:850; cursor:pointer; }
.scope-tabs button { min-width:74px; padding:8px 13px; border-radius:9px; background:transparent; color:var(--muted); }
.scope-tabs button.is-active { background:var(--sports); color:#fff; box-shadow:0 4px 12px rgba(11,122,84,.25); }
.share-button { display:inline-flex; align-items:center; justify-content:center; gap:5px; min-height:34px; padding:6px 13px; border:1px solid color-mix(in srgb,var(--sports) 38%,var(--border)); border-radius:999px; background:var(--accent-soft); color:var(--sports); box-shadow:0 7px 18px rgba(11,122,84,.12); font:inherit; white-space:nowrap; cursor:pointer; transition:.16s ease; }
.share-button > span { font-size:13px; font-weight:900; }
.share-button strong { font-size:12px; font-weight:850; }
.share-button:hover,.share-button:focus-visible { border-color:var(--sports); transform:translateY(-1px); }
.share-button.is-copied { border-color:#16a34a; background:color-mix(in srgb,#16a34a 10%,var(--card)); color:#15803d; }
.sport-tabs { display:flex; gap:6px; padding:0 2px 9px; overflow-x:auto; scrollbar-width:none; }
.sport-tabs::-webkit-scrollbar { display:none; }
.sport-tabs button { flex:0 0 auto; padding:8px 11px; border:1px solid var(--border); border-radius:999px; background:var(--card); color:var(--muted); }
.sport-tabs button.is-active { border-color:var(--sports); background:var(--sports); color:#fff; }
.sport-tabs button:disabled { display:none; }
.sports-merchants { position:relative; display:flex; align-items:center; gap:13px; min-height:38px; margin-bottom:8px; padding:7px 8px 5px; overflow-x:auto; border:1px solid var(--border); border-radius:12px; background:color-mix(in srgb,var(--card) 93%,var(--accent-soft)); scrollbar-width:none; }
.sports-merchants::-webkit-scrollbar { display:none; }.sports-merchants::before { content:''; position:absolute; top:3px; right:12px; left:12px; height:1px; border-radius:999px; background:linear-gradient(90deg,#f59e0b,var(--sports),var(--sports-blue)); opacity:.58; pointer-events:none; }
.sports-merchant-group { display:flex; align-items:center; gap:4px; white-space:nowrap; }.sports-merchant-group strong { margin-right:2px; color:var(--text); font-size:11px; }
.sports-merchant-group a { display:inline-flex; align-items:center; gap:4px; min-height:29px; padding:4px 7px; border:1px solid var(--border); border-radius:999px; background:var(--card); color:var(--muted); font-size:11px; font-weight:800; line-height:1; text-decoration:none; transition:.16s ease; }.sports-merchant-group a:hover { border-color:var(--sports); background:var(--accent-soft); color:var(--sports); transform:translateY(-1px); }.sports-merchant-group img { width:16px; height:16px; border-radius:5px; background:#fff; box-shadow:0 0 0 1px rgba(15,23,42,.08); }
.sports-status { padding:28px; border:1px solid var(--border); border-radius:16px; background:var(--card); color:var(--muted); text-align:center; font-size:13px; }
.sports-workspace { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(310px,.75fr); overflow:hidden; border:1px solid var(--border); border-radius:18px; background:var(--card); box-shadow:var(--shadow); }
.sports-player-card { min-width:0; border-right:1px solid var(--border); }
.sports-player-wrap { position:relative; aspect-ratio:16/9; background:#020617; }
.sports-player-wrap iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.player-fallback-link { position:absolute; right:10px; bottom:10px; z-index:2; padding:6px 9px; border:1px solid rgba(255,255,255,.22); border-radius:8px; background:rgba(2,6,23,.78); color:#fff; font-size:9px; font-weight:800; text-decoration:none; opacity:.72; transition:.16s ease; }.player-fallback-link:hover,.player-fallback-link:focus-visible { opacity:1; }
.external-player { position:absolute; inset:0; z-index:3; display:grid; place-content:center; justify-items:center; gap:9px; padding:28px; background:radial-gradient(circle at 50% 15%,#361017,#070b13 62%); color:#fff; text-align:center; }.external-player[hidden] { display:none; }.external-player span { color:#ff1e35; font-size:12px; font-weight:950; letter-spacing:.18em; }.external-player strong { font-size:clamp(20px,3vw,32px); }.external-player p { max-width:480px; color:#cbd5e1; font-size:11px; line-height:1.55; }.external-player a { margin-top:4px; padding:10px 16px; border-radius:10px; background:#e10600; color:#fff; font-size:12px; font-weight:900; text-decoration:none; }
.sports-player-info { position:relative; padding:16px 19px 14px; }
.sports-player-info h3 { max-width:calc(100% - 145px); margin:6px 0 0; font-size:clamp(16px,1.7vw,21px); line-height:1.4; }
.sports-player-info > a { position:absolute; top:18px; right:18px; color:var(--muted); font-size:10px; font-weight:800; text-decoration:none; }
.video-meta { display:flex; align-items:center; gap:7px; color:var(--muted); font-size:10px; }
.live-badge,.official-badge,.highlight-badge { padding:3px 6px; border-radius:5px; color:#fff; font-size:9px; }.live-badge { background:#ef4444; }.official-badge { background:var(--sports); }.highlight-badge { background:linear-gradient(135deg,var(--sports-blue),#0ea5e9); }
.sports-player-nav { display:grid; grid-template-columns:auto 1fr auto auto; align-items:center; gap:10px; padding:12px 18px 15px; border-top:1px solid var(--border); color:var(--muted); font-size:10px; }
.sports-player-nav button { min-height:38px; padding:0 15px; border:1px solid var(--border); border-radius:10px; background:var(--card); color:var(--text); font:inherit; font-size:11px; font-weight:850; cursor:pointer; }
.sports-player-guide { justify-self:center; color:var(--muted); font-size:10px; }
.sports-loop-controls { display:grid; grid-template-columns:minmax(190px,.62fr) minmax(0,1.38fr); align-items:center; gap:12px 16px; padding:13px 18px 15px; border-top:2px solid color-mix(in srgb,var(--sports-blue) 32%,var(--border)); background:linear-gradient(135deg,color-mix(in srgb,var(--card) 93%,var(--sports) 7%),color-mix(in srgb,var(--card) 93%,var(--sports-blue) 7%)); }
.sports-loop-controls.is-active { background:linear-gradient(135deg,color-mix(in srgb,var(--card) 86%,var(--sports) 14%),color-mix(in srgb,var(--card) 86%,var(--sports-blue) 14%)); box-shadow:inset 5px 0 var(--sports-blue); }
.sports-loop-controls.is-disabled { opacity:.74; }
.sports-loop-copy { display:grid; gap:4px; min-width:0; }.sports-loop-copy strong { font-size:14px; font-weight:950; }.sports-loop-copy small { color:var(--muted); font-size:10px; font-weight:650; line-height:1.45; }
.sports-loop-shortcuts { display:flex; align-items:center; flex-wrap:wrap; gap:3px 5px; color:var(--muted); font-size:9px; font-weight:750; }.sports-loop-shortcuts kbd { display:inline-grid; min-width:21px; height:20px; place-items:center; padding:0 4px; border:1px solid color-mix(in srgb,var(--text) 20%,var(--border)); border-bottom-width:2px; border-radius:5px; background:var(--card); color:var(--text); font:inherit; font-weight:900; }
.sports-loop-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; min-width:0; }.sports-loop-actions button { min-height:36px; padding:0 8px; border:1px solid color-mix(in srgb,var(--sports-blue) 24%,var(--border)); border-radius:9px; background:var(--card); color:var(--text); box-shadow:0 2px 6px rgba(15,23,42,.08); font:inherit; font-size:10px; font-weight:900; white-space:nowrap; cursor:pointer; transition:.16s ease; }.sports-loop-actions .sports-loop-point { background:color-mix(in srgb,var(--card) 90%,var(--sports-blue) 10%); }.sports-loop-actions button b { margin-left:3px; color:var(--muted); font-size:10px; font-variant-numeric:tabular-nums; }.sports-loop-actions button:hover:not(:disabled),.sports-loop-actions button.active { border-color:var(--sports-blue); background:var(--sports-blue); color:#fff; transform:translateY(-1px); }.sports-loop-actions button.active b,.sports-loop-actions button:hover:not(:disabled) b { color:currentColor; }.sports-loop-actions .sports-shortcut-mode.is-active { border-color:#22c55e; background:#22c55e; color:#052e16; }.sports-loop-actions button:disabled { cursor:not-allowed; opacity:.42; }
.sports-queue { display:grid; grid-template-rows:auto minmax(0,1fr); min-width:0; max-height:735px; }
.sports-queue-head { display:flex; justify-content:space-between; padding:14px 15px; border-bottom:1px solid var(--border); font-size:11px; }.sports-queue-head span { color:var(--muted); }
.sports-queue-list { overflow-y:auto; }
.queue-item { position:relative; display:grid; grid-template-columns:105px minmax(0,1fr); gap:9px; width:100%; padding:10px; border:0; border-bottom:1px solid var(--border); background:transparent; color:var(--text); text-align:left; cursor:pointer; }
.queue-item:hover,.queue-item.is-active { background:color-mix(in srgb,var(--card) 88%,var(--sports) 12%); }.queue-item.is-active { box-shadow:inset 4px 0 var(--sports); }
.queue-thumb { position:relative; aspect-ratio:16/9; overflow:hidden; border-radius:7px; background:#111827; }.queue-thumb img { width:100%; height:100%; object-fit:cover; }.queue-thumb em { position:absolute; left:4px; bottom:4px; padding:2px 4px; border-radius:3px; background:#ef4444; color:#fff; font-size:8px; font-style:normal; font-weight:900; }
.queue-thumb em.highlight-rank { background:linear-gradient(135deg,var(--sports-blue),#0ea5e9); font-size:7px; letter-spacing:.02em; }
.queue-copy { display:grid; align-content:center; gap:4px; min-width:0; }.queue-copy strong { display:-webkit-box; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:2; font-size:11px; line-height:1.4; }.queue-copy small { overflow:hidden; color:var(--muted); font-size:9px; white-space:nowrap; text-overflow:ellipsis; }.queue-item > i { position:absolute; top:4px; right:6px; color:var(--faint); font-size:8px; font-style:normal; }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; padding:8px 3px 10px; }.section-heading h2 { margin:3px 0 0; font-size:21px; }.section-heading p { color:var(--muted); font-size:10px; }
.provider-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.provider-card { position:relative; display:grid; grid-template-columns:auto 1fr; align-items:center; gap:10px; min-height:82px; padding:13px; border:1px solid var(--border); border-radius:14px; background:var(--card); color:var(--text); text-decoration:none; transition:.16s ease; }.provider-card:hover { border-color:var(--sports); transform:translateY(-2px); box-shadow:var(--shadow); }
.provider-icon { display:grid; width:34px; height:34px; place-items:center; border-radius:10px; background:linear-gradient(135deg,var(--sports),var(--sports-blue)); color:#fff; font-size:11px; }.provider-card span:nth-child(2) { display:grid; gap:4px; min-width:0; }.provider-card strong { font-size:12px; }.provider-card small { overflow:hidden; color:var(--muted); font-size:9px; white-space:nowrap; text-overflow:ellipsis; }.provider-card em { grid-column:2; width:max-content; padding:3px 6px; border-radius:999px; background:var(--accent-soft); color:var(--sports); font-size:8px; font-style:normal; font-weight:850; }.provider-card > b { position:absolute; top:10px; right:11px; color:var(--faint); }.provider-empty { color:var(--muted); }
.sports-guide { display:flex; align-items:center; gap:12px; margin-bottom:12px; padding:13px 16px; border:1px solid color-mix(in srgb,var(--sports) 22%,var(--border)); border-radius:13px; background:var(--accent-soft); }.sports-guide strong { flex:0 0 auto; color:var(--sports-deep); font-size:11px; }.sports-guide p { color:var(--muted); font-size:10px; line-height:1.5; }
body.theme-dark .sports-guide strong { color:#6ee7b7; }
@media (max-width:1000px) { .provider-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.sports-workspace { grid-template-columns:1fr; }.sports-player-card { border-right:0; border-bottom:1px solid var(--border); }.sports-queue { max-height:430px; } }
@media (max-width:600px) { .sports-hero { align-items:flex-start; padding:10px 12px; }.sports-hero > div:first-child { gap:2px 8px; }.sports-kicker { font-size:8px; }.sports-hero h2 { font-size:19px; }.sports-hero p { font-size:10px; }.sports-now { padding:7px 8px; }.sports-now small { display:none; }.sports-now strong { font-size:10px; }.sports-summary span { font-size:8px; }.sports-controls { align-items:flex-start; }.scope-tabs button { min-width:60px; padding-inline:9px; }.share-button { padding-inline:10px; }.sports-merchants { margin-right:-3px; margin-left:-3px; padding:7px 5px 5px; }.sports-merchant-group strong { display:none; }.sports-merchant-group a { min-height:32px; padding:5px 8px; font-size:12px; }.sports-merchant-group img { width:17px; height:17px; }.sports-workspace { margin-inline:-16px; border-radius:0; border-right:0; border-left:0; }.sports-player-info h3 { max-width:100%; }.sports-player-info > a { position:static; display:inline-block; margin-top:9px; }.sports-player-nav { grid-template-columns:1fr 1fr; }.sports-player-guide { justify-self:start; text-align:left !important; }.sports-player-nav span { text-align:right; }.sports-loop-controls { grid-template-columns:1fr; gap:9px; padding:12px 14px 14px; }.sports-loop-actions { grid-template-columns:repeat(2,minmax(0,1fr)); }.sports-loop-shortcuts,.sports-shortcut-mode { display:none; }.queue-item { grid-template-columns:112px minmax(0,1fr); }.provider-grid { grid-template-columns:1fr; }.section-heading { align-items:flex-start; }.section-heading p { max-width:130px; text-align:right; }.sports-guide { display:grid; } }
