.sports-hub { --sh-canvas: var(--canvas, #090a0c); --sh-surface: var(--surface, #141518); --sh-text: var(--text, #f2efe8); --sh-muted: var(--muted, #a9abb1); --sh-accent: var(--accent, #e31332); margin: 0 0 36px; color: var(--sh-text); font-size: 12px; }
.sports-hub[hidden], .sports-hub [hidden] { display: none !important; }
.sports-hub * { box-sizing: border-box; }
.sports-hub h2, .sports-hub h3, .sports-hub p { margin: 0; }
.sh-content { display: grid; gap: 23px; }
.sh-subtle { color: var(--sh-muted); font-size: 11px; line-height: 1.5; }
.sh-hero { position: relative; isolation: isolate; height: clamp(235px, 19vw, 310px); overflow: hidden; border: 0; border-radius: 12px; background: #060708; color: #fff; }
.sh-hero-art { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; z-index: -2; }
.sh-hero::after { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, #050607b3, transparent 49%, #05060712), linear-gradient(0deg, #0506078c, transparent 40%); pointer-events: none; content: ''; }
.sh-hero-copy { position: absolute; top: 50%; left: 26px; transform: translateY(-50%); max-width: 43%; }
.sh-kicker { margin-bottom: 8px !important; color: #ff283f; font-size: 10px; font-weight: 800; letter-spacing: .14em; }
.sh-hero h2 { margin: 0 0 5px; color: #fff; font-size: clamp(34px, 4.6vw, 68px); font-weight: 800; letter-spacing: -.05em; line-height: 1.05; text-shadow: 0 2px 20px #0005; }
.sh-hero-subtitle { color: #f1f0f0; font-size: clamp(12px, 1.35vw, 18px); line-height: 1.5; }
.sh-hero-football { height: clamp(235px, 18vw, 290px); }
.sh-hero-football .sh-hero-art { left: auto; right: 3%; width: 88%; object-fit: contain; mask-image: linear-gradient(90deg, transparent, #000 12%, #000 86%, transparent); }
.sh-hero-football::after { background: linear-gradient(90deg, #050607b3, transparent 45%, #05060720); }
.sh-hero-quote { position: absolute; right: 30px; top: 50%; transform: translateY(-50%); display: grid; gap: 22px; width: 115px; padding: 15px 0; text-shadow: 0 2px 12px #000; }
.sh-hero-quote > span { max-width: 106px; color: #fff; font-size: 16px; letter-spacing: .2em; line-height: 1.7; }
.sh-hero-quote small { max-width: 100px; color: #e8e8e8; font-size: 9px; letter-spacing: .19em; line-height: 1.7; }
.sh-hero-categories { position: absolute; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: 53% 23% 24%; align-items: end; }
.sports-hub .sh-art-category { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 44px; padding: 8px 17px; border: 0; border-radius: 0; background: transparent; color: white; font-size: 12px; font-weight: 550; text-align: left; text-shadow: 0 1px 8px #000; }
.sports-hub .sh-art-category:hover { background: #ffffff10; transform: none; }
.sports-hub .sh-art-category[aria-pressed="true"] { color: #ff5b6d; }
.sh-art-category .sh-icon { flex: none; width: 23px; height: 23px; padding: 3px; border-radius: 50%; box-shadow: inset 0 0 0 1px #ffffff75; }
.sh-icon { display: block; flex: none; width: 17px; height: 17px; pointer-events: none; }
.sports-hub .sh-button, .sports-hub .sh-filter-chip { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 32px; padding: 8px 15px; border: 0; border-radius: 8px; background: rgba(53, 54, 58, .6); background: linear-gradient(160deg, #ffffff0c, #ffffff00 62%), color-mix(in srgb, var(--sh-surface) 76%, transparent); color: var(--sh-text); box-shadow: inset 0 1px 0 #ffffff1c, 0 4px 14px #00000013; font-size: 11px; font-weight: 650; line-height: 1.3; white-space: nowrap; }
.sports-hub .sh-button:hover, .sports-hub .sh-filter-chip:hover { background-color: color-mix(in srgb, var(--sh-text) 8%, var(--sh-surface)); transform: none; }
.sports-hub .sh-button > .sh-icon { order: -1; width: 13px; height: 13px; }
.sports-hub .sh-hero-action { min-height: 43px; margin-top: 17px; padding: 11px 26px; border-radius: 999px; background: linear-gradient(150deg, #ffffff25, #ffffff05 55%, #b712271a), #212124a6; color: #fff; box-shadow: inset 0 1px 0 #ffffff80, 0 2px 0 #e3133266, 0 7px 22px #e3133220; font-size: 14px; font-weight: 550; }
.sports-hub .sh-hero-action > .sh-icon { width: 18px; height: 18px; }
.sports-hub .sh-hero-action:hover { background-color: #37373bbd; }
.sports-hub .sh-filter-chip { min-height: 34px; padding: 8px 12px; font-size: 10px; font-weight: 500; }
.sports-hub .sh-filter-chip[aria-pressed="true"] { color: var(--sh-text); box-shadow: inset 0 1px 0 #ffffff12, 0 2px 0 color-mix(in srgb, var(--sh-accent) 65%, transparent); }
@supports (backdrop-filter: blur(10px)) { .sports-hub .sh-button, .sports-hub .sh-filter-chip, .sh-filter select, .sh-filter input, .sh-channel-chip { backdrop-filter: blur(10px); } }
.sh-featured { display: grid; gap: 13px; }
.sh-featured-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; }
.sh-featured-heading h3 { font-size: 19px; font-weight: 650; letter-spacing: -.025em; }
.sh-featured-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.sh-feature-card { min-width: 0; display: grid; gap: 12px; padding: 13px 15px; border: 0; border-radius: 12px; background: color-mix(in srgb, var(--sh-surface) 67%, transparent); }
.sh-feature-pair { display: grid; grid-template-columns: 1fr 80px 1fr; align-items: start; gap: 10px; }
.sh-feature-team { display: grid; justify-items: center; gap: 6px; text-align: center; }
.sh-feature-team .sh-team-badge { width: 28px; height: 28px; }
.sh-feature-team strong { max-width: 100%; font-size: 11px; line-height: 1.4; }
.sh-feature-time { display: grid; justify-items: center; gap: 4px; padding-top: 5px; }
.sh-feature-time > span { color: var(--sh-muted); font-size: 10px; }
.sh-feature-time > strong { color: var(--sh-text); font-size: 20px; }
.sh-feature-time > small { color: var(--sh-muted); font-size: 11px; }
.sh-feature-footer { display: flex; align-items: end; gap: 7px; min-width: 0; }
.sh-feature-meta { display: grid; flex: 1; gap: 4px; min-width: 0; }
.sh-feature-meta .sh-competition { white-space: normal; }
.sh-feature-meta small { color: var(--sh-muted); font-size: 9px; line-height: 1.4; }
.sh-feature-footer .sh-button { padding: 7px 12px; font-size: 10px; }
.sh-agenda { display: grid; gap: 13px; min-width: 0; scroll-margin-top: calc(var(--header-height, 80px) + 20px); outline: none; }
.sh-agenda-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 18px; min-height: 64px; }
.sh-agenda-title { flex: none; }
.sh-agenda-title h3 { color: var(--sh-text); font-size: 22px; font-weight: 650; letter-spacing: -.035em; }
.sh-agenda-summary { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px; margin-top: 5px; color: var(--sh-muted); font-size: 11px; }
.sh-agenda-toggles { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin-left: auto; }
.sh-channel-shortcuts { display: flex; align-items: center; gap: 8px; min-width: 0; }
.sh-shortcut-title { color: var(--sh-muted); font-size: 10px; font-weight: 500; }
.sports-hub[data-mode="sports"] .sh-channel-shortcuts { position: relative; display: grid; grid-template-columns: auto auto; align-items: end; gap: 7px; }
.sports-hub[data-mode="sports"] .sh-shortcut-title { grid-column: 1 / -1; }
.sh-channel-featured { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.sports-hub .sh-channel-chip { position: relative; display: flex; align-items: center; justify-content: center; flex: 0 0 84px; width: 84px; min-width: 84px; min-height: 44px; padding: 6px; border: 0; border-radius: 8px; background: transparent; color: var(--sh-text); box-shadow: none; font-size: 12px; font-weight: 650; line-height: 1.2; }
.sports-hub .sh-channel-chip:hover { transform: none; background: #ffffff05; box-shadow: 0 0 14px #e3133214; }
.sh-channel-chip[data-available="false"] { opacity: .77; }
.sports-hub .sh-channel-chip[data-has-logo="true"] { font-size: 0; }
.sh-channel-logo { position: absolute; top: 50%; left: 50%; display: block; width: 56px; height: 20px; object-fit: contain; transform: translate(-50%, -50%); }
.sh-channel-chip[data-has-logo="false"] .sh-channel-logo { visibility: hidden; }
.sports-hub .sh-more-channels { white-space: nowrap; color: var(--sh-muted); font-size: 10px; font-weight: 600; }
.sh-filters { display: flex; align-items: end; flex-wrap: wrap; gap: 12px; padding: 0; border: 0; background: transparent; }
.sh-filter { display: grid; flex: 1 1 120px; gap: 6px; min-width: 0; color: var(--sh-muted); font-size: 10px; }
.sh-filter select, .sh-filter input { width: 100%; min-width: 0; min-height: 35px; padding: 8px 11px; border: 0; border-radius: 7px; outline: none; background-color: color-mix(in srgb, var(--sh-surface) 80%, transparent); color: var(--sh-text); box-shadow: inset 0 1px 0 #ffffff12, 0 3px 14px #0000000a; font: inherit; font-size: 11px; }
.sh-filter select { background-position: calc(100% - 14px) 14px, calc(100% - 9px) 14px; padding-right: 23px; }
.sh-filter input:focus-visible, .sh-filter select:focus-visible { box-shadow: inset 0 0 0 1px var(--sh-accent); }
.sh-date-filter { flex: 0 1 146px; }
.sh-days-filter { flex: 0 1 100px; }
.sh-search-filter { flex-grow: 1.4; }
.sh-feed-info { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; color: var(--sh-muted); font-size: 9px; }
.sh-feed-info .sh-subtle { font-size: 9px; }
.sh-data-status { color: var(--sh-muted); font-size: 9px; }
.sh-data-status-partial, .sh-data-status-unavailable { color: var(--sh-accent); }
.sh-data-status-demo { color: #b7854b; }
.sh-sources { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; color: var(--sh-muted); font-size: 9px; }
.sh-source { color: var(--sh-muted); text-decoration: none; }
.sh-source:hover { color: var(--sh-text); text-decoration: underline; }
.sh-notice { position: fixed; z-index: 75; left: 50%; bottom: max(20px, env(safe-area-inset-bottom, 0px)); width: max-content; max-width: min(560px, calc(100vw - 32px)); margin: 0; padding: 12px 16px; border: 1px solid var(--sh-line, #ffffff24); border-radius: 12px; background: var(--sh-surface); color: var(--sh-text); box-shadow: 0 8px 32px #0006; font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; pointer-events: none; transform: translateX(-50%); }
.sh-notice[hidden] { display: none; }
.sh-notice[data-announcement-only="true"] { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; box-shadow: none; transform: none; }
.sh-reminder-save-warning { grid-column: 1 / -1; max-width: 100%; color: #f1c879; font-size: .75rem; line-height: 1.4; overflow-wrap: anywhere; }
.sh-match-table { min-width: 0; padding: 0; border: 0; border-radius: 0; overflow: visible; background: transparent; }
.sh-table-heading, .sh-match-row { display: grid; grid-template-columns: 76px minmax(230px, 1.7fr) minmax(120px, .8fr) minmax(155px, 1fr) 88px 188px; align-items: center; gap: 14px; padding: 0 9px; }
.sh-table-heading { min-height: 28px; color: var(--sh-muted); background: transparent; font-size: 10px; font-weight: 500; }
.sh-match-row { min-height: 51px; padding-top: 5px; padding-bottom: 5px; border: 0; border-radius: 7px; background: transparent; }
.sh-match-row:hover { background: color-mix(in srgb, var(--sh-surface) 48%, transparent); }
.sh-time-cell { display: grid; gap: 3px; }
.sh-date { color: var(--sh-muted); font-size: 9px; }
.sh-time { color: var(--sh-text); font-size: 11px; font-weight: 700; }
.sh-team-pair { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 12px; min-width: 0; }
.sh-match-badges { display: grid; grid-template-columns: 24px 12px 24px; align-items: center; gap: 6px; width: 72px; min-width: 72px; }
.sh-match-row .sh-team-badge { width: 24px; height: 24px; }
.sh-match-copy { display: grid; gap: 3px; min-width: 0; }
.sh-match-title { color: var(--sh-text); font-size: 11px; font-weight: 550; line-height: 1.4; overflow-wrap: anywhere; }
.sh-match-score { color: var(--sh-muted); font-size: 9px; line-height: 1.3; }
.sh-versus { flex: none; color: var(--sh-muted); font-size: 11px; white-space: nowrap; }
.sh-team-badge { display: grid; position: relative; flex: none; width: 24px; height: 24px; place-items: center; }
.sh-badge-image { display: block; width: 100%; height: 100%; object-fit: contain; }
.sh-badge-image, .sh-identity-image, .sh-channel-logo { padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; filter: none; }
.sh-badge-image.sh-athlete-portrait { object-fit: cover; object-position: 50% 20%; border-radius: 50%; }
.sports-hub .sh-team-badge.sh-athlete-badge { width: 30px; height: 30px; overflow: hidden; border-radius: 50%; }
.sports-hub .sh-athlete-portrait[src$="/adam-azim-official-v1.jpg"] { transform: scale(3); transform-origin: 50% 8%; object-position: 50% 0; }
.sh-match-meta { display: grid; gap: 4px; min-width: 0; }
.sh-competition { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--sh-text); font-size: 10px; text-decoration: none; }
 a.sh-competition:hover { color: var(--sh-text); text-decoration: underline; }
.sh-competition-identity { display: grid; grid-template-columns: 22px minmax(0, 1fr); align-items: center; gap: 8px; min-width: 0; overflow: visible; white-space: normal; }
.sh-competition-mark, .sh-broadcast-mark { position: relative; display: grid; flex: none; place-items: center; width: 36px; height: 36px; }
.sh-competition-mark { width: 22px; height: 22px; background: transparent; border: 0; border-radius: 0; box-shadow: none; }
.sh-competition-mark[hidden] { display: none; }
.sports-hub .sh-competition-identity[data-badge="false"] { grid-template-columns: minmax(0, 1fr); gap: 0; }
.sh-identity-fallback { display: grid; place-items: center; min-width: 0; height: 24px; padding: 0; border: 0; border-radius: 0; background: transparent; color: var(--sh-muted); font-size: 10px; font-weight: 650; letter-spacing: .02em; }
.sh-identity-image { position: absolute; display: block; width: 100%; height: 100%; object-fit: contain; opacity: 0; transition: opacity .18s ease; }
[data-image="loaded"] > .sh-identity-image { opacity: 1; }
.sh-competition-name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: var(--sh-muted); font-size: 10.5px; font-weight: 500; line-height: 1.4; overflow-wrap: anywhere; }
.sh-match-state { justify-self: start; color: var(--sh-muted); font-size: 9px; line-height: 1.4; }
.sh-match-state[data-status="live"] { color: var(--sh-accent); }
.sh-match-row[data-phase="live"] { background: linear-gradient(90deg, #e5091414, transparent 75%); box-shadow: inset 2px 0 var(--sh-accent); }
.sports-hub .sh-live-badge { display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px; border-radius: 6px; background: #e5091422; color: var(--sh-accent); font-size: 10px; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.sh-live-badge::before { content: ''; width: 6px; height: 6px; flex: none; border-radius: 50%; background: currentColor; }
.sh-live-scoreboard { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; min-width: 0; }
.sh-live-score { color: var(--sh-text); font-size: 13px; font-weight: 750; font-variant-numeric: tabular-nums; }
.sh-live-clock { color: var(--sh-text); font-size: 10px; line-height: 1.5; overflow-wrap: anywhere; }
.sh-live-checked, .sh-match-note { color: var(--sh-muted); font-size: 10px; line-height: 1.5; overflow-wrap: anywhere; }
.sh-transmission { display: grid; align-content: center; justify-items: start; gap: 6px; min-width: 0; }
.sh-transmission small { color: var(--sh-muted); font-size: 10px; }
.sh-broadcast-mark { width: 52px; max-width: 100%; height: 18px; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.sh-broadcast-mark .sh-broadcast-name { display: block; width: 100%; height: auto; max-width: 100%; color: var(--sh-text); font-size: 10px; font-weight: 600; line-height: 17px; letter-spacing: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sh-transmission .sh-transmission-note { color: var(--sh-muted); font-size: 10px; line-height: 1.4; }
.sh-transmission-preview { display: inline-flex; align-items: center; gap: 7px; max-width: 100%; padding: 4px 6px; border: 1px dashed #e3133245; border-radius: 5px; background: #e3133209; }
.sh-transmission-preview .sh-preview-label { color: #d7969f; font-size: 8px; white-space: nowrap; }
.sh-feature-meta .sh-competition-identity { grid-template-columns: 22px minmax(0, 1fr); gap: 7px; }
.sh-feature-meta .sh-competition-mark { width: 22px; height: 22px; }
.sh-feature-meta .sh-competition-name { font-size: 10.5px; }
.sh-row-actions { display: flex; align-items: center; justify-content: flex-end; gap: 6px; }
.sports-hub .sh-row-actions .sh-button { min-width: 103px; padding: 7px 12px; border-radius: 7px; font-size: 10px; }
.sports-hub .sh-icon-button { display: grid; width: 34px; height: 36px; flex: none; place-items: center; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--sh-text); box-shadow: none; }
.sports-hub .sh-icon-button:hover { background: color-mix(in srgb, var(--sh-text) 5%, transparent); transform: none; }
.sports-hub .sh-icon-button .sh-icon { width: 18px; height: 18px; }
.sports-hub .sh-reminder-button[aria-pressed="true"] { color: var(--sh-accent); }
.sports-hub button:disabled { opacity: .38; cursor: default; transform: none; }
.sh-continuation { padding-top: 9px; color: var(--sh-muted); }
.sh-table-note { color: var(--sh-muted); font-size: 9px; line-height: 1.6; }
.sh-empty { display: grid; justify-items: start; gap: 9px; padding: 26px 9px; color: var(--sh-text); font-size: 12px; }
.sh-empty p { max-width: 610px; color: var(--sh-muted); font-size: 11px; line-height: 1.6; }
.sh-reminders { padding: 0; border: 0; border-radius: 0; background: transparent; scroll-margin-top: calc(var(--header-height, 80px) + 25px); }
.sh-reminders summary { padding: 11px 0; color: var(--sh-muted); cursor: pointer; font-size: 11px; }
.sh-reminder-content { display: grid; gap: 11px; padding: 2px 0 12px; }
.sh-reminder-toolbar { display: flex; align-items: end; flex-wrap: wrap; gap: 12px; }
.sh-reminder-toolbar .sh-filter { flex: 0 0 105px; }
.sh-reminder-entry { display: flex; align-items: center; flex-wrap: wrap; gap: 9px 16px; padding: 10px 0; border: 0; }
.sh-reminder-entry strong { font-size: 11px; margin-right: auto; }
.sports-hub .sh-link-button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 5px 0; border: 0; border-radius: 3px; background: transparent; color: var(--sh-muted); box-shadow: none; font-size: 10px; font-weight: 500; }
.sports-hub .sh-link-button:hover { background: transparent; color: var(--sh-text); transform: none; text-decoration: underline; }
.sh-link-button .sh-icon { order: -1; width: 13px; height: 13px; }
.sh-refresh-button { margin-left: auto; }
.sh-discover { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 18px; padding: 4px 0; }
.sh-row-skeleton { display: grid; grid-template-columns: 60px 2fr 1fr 1fr 90px; align-items: center; gap: 24px; min-height: 51px; padding: 10px; }
.sh-skeleton-line, .sh-feature-skeleton { min-height: 12px; border-radius: 6px; background: linear-gradient(100deg, color-mix(in srgb, var(--sh-muted) 7%, transparent) 20%, color-mix(in srgb, var(--sh-muted) 15%, transparent) 48%, color-mix(in srgb, var(--sh-muted) 7%, transparent) 70%); background-size: 220% 100%; animation: sh-skeleton 1.5s ease-in-out infinite; }
.sh-feature-skeleton { height: 140px; }
@keyframes sh-skeleton { to { background-position: -220% 0; } }
.sh-mini-loader { display: inline-block; flex: none; width: 13px; height: 13px; border: 2px solid color-mix(in srgb, var(--sh-muted) 20%, transparent); border-top-color: var(--sh-accent); border-radius: 50%; animation: sh-loading-turn .8s linear infinite; }
@keyframes sh-loading-turn { to { transform: rotate(360deg); } }
.sh-data-status-loading { display: inline-flex; align-items: center; gap: 8px; }
.sh-data-status-loading .sh-mini-loader { order: -1; }
.sports-hub.sh-teams-dialog { position: fixed; inset: 0; margin: auto; width: min(600px, calc(100vw - 28px)); max-width: none; max-height: min(740px, calc(100dvh - 40px)); padding: 24px; border: 1px solid var(--line, #ffffff18); border-radius: 20px; background: var(--sh-surface); color: var(--sh-text); box-shadow: 0 30px 120px #0008; }
.sh-teams-dialog::backdrop { background: #0009; backdrop-filter: blur(9px); }
.sh-teams-dialog[open] { display: flex; flex-direction: column; gap: 18px; }
.sh-team-picker-header, .sh-team-picker-footer { display: flex; flex: none; align-items: center; justify-content: space-between; gap: 18px; }
.sh-team-picker-header h3 { color: var(--sh-text); font-size: 22px; letter-spacing: -.02em; }
.sh-team-picker-header p { margin-top: 6px; color: var(--sh-muted); font-size: 11px; line-height: 1.6; }
.sports-hub .sh-team-picker-search { flex: none; width: 100%; height: 42px; margin: 0; padding: 10px 13px; border: 1px solid var(--line, #ffffff18); border-radius: 10px; background: var(--sh-canvas); color: var(--sh-text); font: inherit; }
.sh-team-picker-status { flex: none; min-height: 17px; color: var(--sh-muted); font-size: 11px; line-height: 1.5; }
.sh-team-picker-list { display: grid; align-content: start; min-height: 150px; max-height: 440px; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--line, #ffffff18) transparent; padding-right: 5px; }
.sh-team-option { display: flex; align-items: center; gap: 13px; min-height: 60px; padding: 10px 12px; border-radius: 10px; cursor: pointer; }
.sh-team-option:hover { background: color-mix(in srgb, var(--sh-text) 4%, transparent); }
.sh-team-option[data-selected="true"] { background: color-mix(in srgb, var(--sh-accent) 7%, transparent); }
.sh-team-option .sh-team-badge { width: 24px; height: 24px; }
.sh-team-option-copy { display: grid; gap: 4px; min-width: 0; margin-right: auto; }
.sh-team-option-copy strong { font-size: 12px; font-weight: 600; }
.sh-team-option-copy small { color: var(--sh-muted); font-size: 10px; }
.sports-hub .sh-team-option input { flex: none; width: 18px; height: 18px; min-height: 0; margin: 0; padding: 0; accent-color: var(--sh-accent); cursor: pointer; }
.sh-team-picker-progress { display: flex; align-items: center; gap: 10px; padding: 16px 12px; color: var(--sh-muted); font-size: 11px; }
.sh-team-picker-empty { padding: 22px 12px; color: var(--sh-muted); font-size: 12px; line-height: 1.6; }
.sh-picker-group { margin: 14px 12px 5px; color: var(--sh-muted); font-size: 9px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.sh-picker-group:first-child { margin-top: 4px; }
.sh-legacy-preferences { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 12px; border-radius: 8px; background: color-mix(in srgb, var(--sh-surface) 65%, transparent); }
.sh-legacy-copy { display: grid; gap: 4px; min-width: 0; }
.sh-legacy-copy strong { color: var(--sh-text); font-size: 10px; font-weight: 550; line-height: 1.4; }
.sh-legacy-copy small { color: var(--sh-muted); font-size: 9px; line-height: 1.4; }
.sports-hub .sh-legacy-import { min-height: 36px; padding: 7px 11px; font-size: 10px; }
@media (max-width: 480px) { .sh-legacy-preferences { flex-wrap: wrap; } .sports-hub .sh-legacy-import { min-height: 44px; } }
.sh-competition-option .sh-competition-mark { width: 22px; height: 22px; }
.sh-team-picker-footer { padding-top: 12px; border-top: 1px solid var(--line, #ffffff18); color: var(--sh-muted); font-size: 11px; }
@media (max-width: 740px) { .sports-hub.sh-teams-dialog { padding: 18px; gap: 14px; } .sh-agenda-toggles { flex-wrap: wrap; } .sh-team-picker-header h3 { font-size: 20px; } }
@media (prefers-reduced-motion: reduce) { .sh-mini-loader { animation: none; } }
.sports-hub button:focus-visible, .sports-hub a:focus-visible, .sports-hub summary:focus-visible { outline: 2px solid var(--sh-text); outline-offset: 4px; }
@media (max-width: 1300px) { .sh-table-heading, .sh-match-row { grid-template-columns: 65px minmax(210px, 1.5fr) minmax(100px, .7fr) minmax(120px, .8fr) 75px 165px; gap: 10px; padding-left: 3px; padding-right: 3px; } .sports-hub .sh-row-actions .sh-button { min-width: 88px; padding: 7px 9px; } .sports-hub .sh-icon-button { width: 30px; } .sh-agenda-toolbar { gap: 15px; } .sh-channel-chip { min-width: 65px; } }
@media (max-width: 1100px) { .sh-table-heading { display: none; } .sh-match-row { grid-template-columns: 65px minmax(0, 1fr) 165px; gap: 7px 12px; min-height: 81px; padding: 10px 2px; } .sh-time-cell { grid-column: 1; grid-row: 1 / span 2; } .sh-team-pair { grid-column: 2; grid-row: 1; } .sh-match-meta { grid-column: 2; grid-row: 2; } .sh-transmission { grid-column: 2; grid-row: 3; max-height: none; flex-direction: row; flex-wrap: wrap; gap: 5px; } .sh-match-row > .sh-match-state { grid-column: 3; grid-row: 1; justify-self: end; } .sh-row-actions { grid-column: 3; grid-row: 2 / span 2; } .sh-team strong { font-size: 11px; } .sh-agenda-toggles { margin-left: 0; } .sh-featured-list { gap: 10px; } .sh-feature-card { padding: 12px 10px; } .sh-feature-pair { grid-template-columns: 1fr 64px 1fr; gap: 6px; } .sh-feature-footer { flex-wrap: wrap; } .sh-feature-meta { flex-basis: calc(100% - 40px); } .sh-feature-footer .sh-button { margin-left: auto; } .sh-hero-quote { right: 16px; width: 94px; } .sh-hero-quote > span { font-size: 13px; } }
@media (max-width: 740px) { .sh-content { gap: 19px; } .sh-hero { height: 245px; } .sh-hero-copy { left: 18px; max-width: 46%; } .sh-hero h2 { font-size: 40px; } .sh-hero-subtitle { font-size: 12px; } .sh-hero-quote { display: none; } .sh-hero-football .sh-hero-art { width: 100%; right: -8%; } .sh-featured-list { display: flex; overflow-x: auto; padding-bottom: 6px; scroll-snap-type: x proximity; } .sh-feature-card, .sh-feature-skeleton { flex: 0 0 280px; scroll-snap-align: start; } .sh-feature-pair { grid-template-columns: 1fr 75px 1fr; } .sh-featured-heading h3 { font-size: 17px; } .sh-agenda-toolbar { gap: 15px 20px; } .sh-agenda-title h3 { font-size: 21px; } .sh-channel-shortcuts { flex-wrap: wrap; } .sports-hub[data-mode="sports"] .sh-channel-shortcuts { width: 100%; } .sh-channel-featured { gap: 6px; } .sports-hub .sh-channel-chip { min-width: 66px; font-size: 10px; } .sh-filters { gap: 10px; } .sh-filter { flex-basis: calc(50% - 5px); } .sh-date-filter { flex: 1 1 135px; } .sh-days-filter { flex: 0 0 90px; } .sh-search-filter { flex-basis: 100%; } .sh-row-skeleton { grid-template-columns: 45px 1fr 70px; gap: 16px; } .sh-row-skeleton span:nth-child(n+4) { display: none; } }
@media (max-width: 480px) { .sh-hero-sports { height: 270px; } .sh-hero-sports .sh-hero-art { height: 138px; object-fit: cover; object-position: center 15%; } .sh-hero-sports::after { background: linear-gradient(0deg, #050607 34%, transparent 75%); } .sh-hero-sports .sh-hero-copy { top: auto; bottom: 12px; transform: none; max-width: 95%; } .sh-hero-sports .sh-hero-copy h2 { font-size: 32px; } .sh-hero-sports .sh-kicker { display: none; } .sh-hero-sports .sh-hero-action { position: absolute; left: 190px; bottom: 0; min-height: 36px; padding: 8px 18px; font-size: 12px; } .sh-hero-sports .sh-hero-categories { top: 111px; bottom: auto; } .sports-hub .sh-art-category { min-height: 38px; padding: 5px 8px; gap: 3px; font-size: 8px; } .sh-art-category .sh-icon { width: 17px; height: 17px; padding: 2px; } .sh-hero-football { height: 235px; } .sh-hero-football .sh-hero-copy { max-width: 58%; } .sh-hero-football .sh-hero-art { right: -17%; width: 110%; object-fit: cover; object-position: 70% center; mask-image: linear-gradient(90deg, transparent, #000 35%); } .sh-hero h2 { font-size: 37px; } .sh-hero .sh-hero-action { min-height: 38px; padding: 9px 18px; font-size: 12px; } .sh-match-row { grid-template-columns: 53px minmax(0, 1fr); gap: 6px 9px; min-height: 114px; } .sh-team-pair { gap: 5px; } .sh-team { gap: 5px; } .sh-team strong { white-space: normal; line-height: 1.3; } .sh-team-badge { width: 24px; height: 24px; } .sh-row-actions { grid-column: 1 / -1; grid-row: 4; justify-content: flex-end; } .sh-match-row > .sh-match-state { grid-column: 1; grid-row: 3; justify-self: start; font-size: 8px; } .sh-time-cell { align-self: start; } .sh-transmission { grid-column: 2; grid-row: 3; } .sh-reminder-entry strong { flex-basis: 100%; } .sports-hub .sh-icon-button { width: 44px; height: 44px; } }
@media (prefers-reduced-motion: reduce) { .sh-skeleton-line, .sh-feature-skeleton { animation: none; } }

/* Shared agenda geometry keeps every field and action aligned in both views. */
.sh-agenda-toolbar { display: grid; grid-template-columns: minmax(210px, auto) minmax(0, 1fr) auto; align-items: end; gap: 16px; min-height: 62px; }
.sh-agenda-title { align-self: end; padding-bottom: 1px; }
.sh-agenda-toggles { align-self: end; justify-content: flex-end; margin: 0; max-width: none; flex-wrap: nowrap; gap: 4px; }
.sports-hub .sh-agenda-control { position: relative; display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; min-width: 44px; min-height: 44px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--sh-muted); box-shadow: none; transition: color .18s ease, background-color .18s ease, box-shadow .18s ease; }
.sports-hub .sh-agenda-control > .sh-icon { width: 22px; height: 22px; }
.sports-hub .sh-agenda-control:is(:hover,:focus-visible) { background: #e3133208; color: var(--sh-text); box-shadow: 0 0 16px #e313321a; transform: none; }
.sports-hub .sh-agenda-control[aria-pressed="true"] { color: var(--sh-accent); }
.sh-agenda-control[aria-pressed="true"] > .sh-icon { filter: drop-shadow(0 0 5px #e3133259); }
.sh-control-tooltip { position: absolute; z-index: 25; left: 50%; bottom: calc(100% + 7px); padding: 7px 10px; border: 1px solid var(--line, #ffffff12); border-radius: 8px; background: var(--sh-surface); color: var(--sh-text); box-shadow: 0 6px 20px #0004; font-size: 11px; font-weight: 500; line-height: 1.3; white-space: nowrap; opacity: 0; visibility: hidden; pointer-events: none; transform: translate(-50%, 4px); transition: opacity .16s ease, transform .16s ease, visibility .16s; }
.sh-agenda-control:is(:hover,:focus-visible) .sh-control-tooltip { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.sh-agenda-toggles > .sh-agenda-control:first-child .sh-control-tooltip { left: 0; transform: translateY(4px); }
.sh-agenda-toggles > .sh-agenda-control:last-child .sh-control-tooltip, .sh-more-channels .sh-control-tooltip { left: auto; right: 0; transform: translateY(4px); }
.sh-agenda-toggles > .sh-agenda-control:first-child:is(:hover,:focus-visible) .sh-control-tooltip, .sh-agenda-toggles > .sh-agenda-control:last-child:is(:hover,:focus-visible) .sh-control-tooltip, .sh-more-channels:is(:hover,:focus-visible) .sh-control-tooltip { transform: translateY(0); }
.sh-channel-shortcuts, .sports-hub[data-mode="sports"] .sh-channel-shortcuts { display: grid; position: relative; grid-template-columns: minmax(0, 1fr) 44px; align-items: end; justify-content: start; gap: 7px 9px; width: 100%; }
.sh-shortcut-title, .sports-hub[data-mode="sports"] .sh-shortcut-title { grid-column: 1 / -1; min-height: 14px; line-height: 14px; }
.sh-channel-featured { min-width: 0; flex-wrap: nowrap; align-items: center; gap: 8px; overflow-x: auto; scrollbar-width: thin; }
.sports-hub .sh-channel-chip { height: 44px; min-height: 44px; box-sizing: border-box; }
.sports-hub .sh-filter-chip { height: 36px; min-height: 36px; box-sizing: border-box; }
.sports-hub .sh-more-channels { height: 44px; min-height: 44px; }
.sh-filters { display: grid; grid-template-columns: minmax(82px, .65fr) repeat(3, minmax(0, 1fr)) minmax(160px, 1.3fr); align-items: end; gap: 12px; }
.sports-hub[data-mode="football"] .sh-filters { grid-template-columns: minmax(82px, .65fr) repeat(2, minmax(0, 1fr)) minmax(160px, 1.3fr); }
.sh-filters > .sh-filter { display: grid; grid-template-rows: 14px 36px; align-content: end; gap: 7px; min-width: 0; }
.sh-filters > .sh-filter > span { min-height: 14px; line-height: 14px; }
.sports-hub .sh-filters .sh-filter input, .sports-hub .sh-filters .sh-filter select { height: 36px; min-height: 36px; max-height: 36px; margin: 0; box-sizing: border-box; }
.sports-hub .sh-filters .sh-filter select:disabled { color: var(--sh-muted); opacity: 1; cursor: default; }

/* The original portrait remains intact; only CSS crops its central celebration. */
.sh-hero-football { --sh-football-height: clamp(260px, 21vw, 320px); height: var(--sh-football-height); }
.sh-football-atmosphere { position: absolute; inset: -20px; width: calc(100% + 40px); height: calc(100% + 40px); z-index: -3; object-fit: cover; object-position: center 64%; filter: blur(20px) brightness(.55); opacity: .45; pointer-events: none; }
.sh-hero-football .sh-hero-art { inset: 0 16% 0 auto; width: var(--sh-football-height); height: 100%; object-fit: cover; object-position: center 64%; mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.sh-hero-football::after { background: linear-gradient(90deg, #050607bd, #05060724 52%, #05060738); }

/* Each panel owns its crop, radius and gradient: no overlay crosses the gaps. */
.sh-hero-sports { display: grid; grid-template-columns: minmax(0, 2.3fr) repeat(2, minmax(0, 1fr)); gap: 14px; height: clamp(240px, 20vw, 320px); overflow: visible; border-radius: 0; background: transparent; }
.sh-hero-sports::after { content: none; }
.sh-sport-panel { position: relative; isolation: isolate; overflow: hidden; min-width: 0; height: 100%; border-radius: 12px; background: #060708; }
button.sh-sport-panel { display: block; width: 100%; min-height: 0; padding: 0; border: 0; color: #fff; text-align: left; background: radial-gradient(ellipse at 80% 35%, #e313321a, transparent 65%), #060708; box-shadow: none; transition: box-shadow .22s ease, translate .22s ease; }
button.sh-sport-panel:is(:hover, :focus-visible) { background: radial-gradient(ellipse at 80% 35%, #e313321a, transparent 65%), #060708; box-shadow: inset 0 0 0 1px #f02a3b80, 0 0 0 1px #e3133266, 0 8px 28px #e3133240, 0 0 18px #e3133238; }
.sh-sport-panel::before { content: ''; position: absolute; inset: 0; z-index: 2; padding: 1.5px; border-radius: inherit; background: conic-gradient(from var(--hover-angle, 0deg), transparent 0 50%, #e3133200 59%, #e3133280 76%, #f02a3b 88%, #ffbac3 92%, #f02a3b 96%, transparent 100%); mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite: exclude; opacity: 0; pointer-events: none; transition: opacity .22s ease; }
.sh-sport-panel:is(:hover, :focus-visible)::before { opacity: 1; animation: hls-hover-orbit 2.8s linear infinite; }
.sh-sport-panel > * { pointer-events: none; }
.sh-sport-panel .sh-kicker, .sh-sport-panel .sh-hero-heading, .sh-sport-panel .sh-hero-subtitle { display: block; }
.sh-sport-panel .sh-hero-heading { margin: 0 0 5px; color: #fff; font-size: clamp(34px, 4vw, 59px); font-weight: 800; letter-spacing: -.05em; line-height: 1.05; text-shadow: 0 2px 20px #0005; }
.sh-sport-panel::after { position: absolute; inset: 0; z-index: -1; content: ''; pointer-events: none; background: linear-gradient(0deg, #000b, transparent 36%); }
.sh-sport-panel-motorsport::after { background: linear-gradient(90deg, #000a, transparent 64%), linear-gradient(0deg, #000b, transparent 35%); }
.sh-hero-sports .sh-panel-art { position: absolute; inset: 0 auto auto 0; height: 100%; max-width: none; object-fit: cover; object-position: center 30%; z-index: -2; }
.sh-sport-panel-motorsport .sh-panel-art { width: 188.679245%; left: 0; }
.sh-sport-panel-basketball .sh-panel-art { width: 434.782609%; left: -230.434783%; }
.sh-sport-panel-american_football .sh-panel-art { width: 416.666667%; left: -316.666667%; }
.sh-panel-loading { position: absolute; inset: 0; display: grid; place-items: center; color: var(--sh-accent); }
.sh-panel-loading .sh-icon { width: 24px; height: 24px; filter: drop-shadow(0 0 9px #e3133266); animation: hls-soft-pulse 1.3s ease-in-out infinite; }
.sh-sport-panel .sh-hero-copy { top: 46%; bottom: auto; left: 24px; transform: translateY(-50%); max-width: 58%; }
.sh-sport-panel .sh-hero-copy h2 { font-size: clamp(34px, 4vw, 59px); }
.sports-hub .sh-sport-panel .sh-art-category { position: absolute; left: 0; right: 0; bottom: 0; display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 44px; height: auto; padding: 9px 15px; border: 0; box-shadow: none; background: transparent; font-size: 11px; }
.sports-hub .sh-sport-panel:is(:hover, :focus-visible) .sh-art-category { background: #ffffff08; color: #fff; }
.sports-hub .sh-sport-panel[aria-pressed="true"] .sh-art-category { color: #ff5b6d; }
.sh-sport-panel .sh-hero-action { position: relative; left: auto; bottom: auto; }
@media (hover: hover) and (pointer: fine) { button.sh-sport-panel:is(:hover, :focus-visible) { translate: 0 -3px; } }
@media (prefers-reduced-motion: reduce) { button.sh-sport-panel { transition: none; } button.sh-sport-panel:is(:hover, :focus-visible) { translate: none; } .sh-sport-panel::before, .sh-sport-panel:is(:hover, :focus-visible)::before, .sh-panel-loading .sh-icon { transition: none; animation: none; } }
@media (max-width: 1150px) {
  .sh-agenda-toolbar { grid-template-columns: minmax(0, 1fr) auto; }
  .sh-agenda-title { grid-column: 1; grid-row: 1; }
  .sh-agenda-toggles { grid-column: 2; grid-row: 1; justify-content: end; }
  .sh-channel-shortcuts, .sports-hub[data-mode="sports"] .sh-channel-shortcuts { grid-column: 1 / -1; grid-row: 2; }
  .sh-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sh-hero-football .sh-hero-art { right: 10%; }
  .sh-hero-sports { gap: 11px; }
  .sh-sport-panel .sh-hero-copy { left: 18px; max-width: 65%; }
}
@media (max-width: 740px) {
  .sh-hero-football { --sh-football-height: 275px; }
  .sh-hero-football .sh-hero-art { right: 4%; width: var(--sh-football-height); }
  .sh-hero-football .sh-hero-copy { max-width: 52%; }
  .sh-hero-sports { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: 230px auto; height: auto; gap: 12px; }
  .sh-sport-panel-motorsport { grid-column: 1 / -1; height: 230px; }
  .sh-sport-panel-basketball, .sh-sport-panel-american_football { aspect-ratio: 1 / 1; height: auto; }
  .sh-sport-panel .sh-hero-copy { top: 46%; bottom: auto; transform: translateY(-50%); max-width: 58%; }
  .sh-sport-panel .sh-hero-copy h2, .sh-sport-panel .sh-hero-heading { font-size: 40px; }
  .sh-sport-panel .sh-kicker { display: block; }
  .sh-hero-sports .sh-panel-art { height: 100%; object-position: center 60%; }
  .sh-sport-panel-motorsport .sh-panel-art { object-position: center 25%; }
  .sh-sport-panel .sh-hero-action { position: relative; left: auto; bottom: auto; min-height: 38px; }
}
@media (max-width: 580px) {
  .sh-agenda-toolbar { grid-template-columns: minmax(0, 1fr); }
  .sh-agenda-title { grid-column: 1; grid-row: 1; }
  .sh-agenda-toggles { grid-column: 1; grid-row: 3; justify-content: start; flex-wrap: nowrap; }
  .sh-channel-shortcuts, .sports-hub[data-mode="sports"] .sh-channel-shortcuts { grid-column: 1; grid-row: 2; }
  .sh-channel-featured { flex-wrap: nowrap; }
  .sh-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
  .sh-hero-football { --sh-football-height: 260px; }
  .sh-hero-football .sh-hero-art { right: -11%; width: var(--sh-football-height); object-position: center 64%; }
  .sh-hero-football .sh-hero-copy { max-width: 60%; }
  .sh-hero-football::after { background: linear-gradient(90deg, #050607d9, #05060760 45%, transparent 75%); }
}

/* Keep the same emblem rail and text start when agenda actions wrap below. */
@media (max-width: 620px) {
  .sh-match-row { grid-template-columns: 53px minmax(0, 1fr); gap: 6px 9px; }
  .sh-team-pair { grid-template-columns: 76px minmax(0, 1fr); gap: 10px; }
  .sh-row-actions { grid-column: 1 / -1; grid-row: 4; justify-content: flex-end; }
  .sh-match-row > .sh-match-state { grid-column: 1; grid-row: 3; justify-self: start; }
  .sh-time-cell { align-self: start; }
  .sh-transmission { grid-column: 2; grid-row: 3; }
}
@media (prefers-reduced-motion: reduce) { .sports-hub .sh-agenda-control, .sh-control-tooltip { transition: none; } }
.sh-guide-channels { font-size: 12px; line-height: 1.45; overflow-wrap: anywhere; }
.sh-guide-badge { display: inline-block; width: fit-content; padding: 3px 7px; border-radius: 6px; background: #3a88ca18; color: #70b7ed; font-size: 10px; line-height: 1.5; }
.sh-guide-warning { color: #e5b763; }
.sh-guide-badge.sh-guide-warning { background: #d5982317; }
.sh-guide-details { font-size: 10px; line-height: 1.5; color: var(--sh-muted, #a7a7aa); }
.sh-guide-details summary { cursor: pointer; }
.sh-guide-details small { display: block; margin-top: 5px; max-width: 260px; }
.sh-guide-coverage { font-size: 11px; }
[data-theme="light"] .sh-guide-badge { color: #15578a; }
[data-theme="light"] .sh-guide-warning { color: #8a5400; }
.sh-api-broadcasts { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.sh-api-broadcast { display: inline-flex; flex-direction: column; align-items: center; gap: 4px; }
.sh-api-broadcast > small { font-size: 9px; color: #a5a5ac; }

/* Mobile sports has its own composition. The desktop agenda above is intact. */
.sh-mobile-query, .sh-mobile-sources, .sh-mobile-sport, .sh-mobile-warning, .sh-mobile-more-label, .sh-feature-mobile-pair { display: none; }
.sports-hub.sh-filter-dialog { width: min(560px, calc(100% - 24px)); max-height: calc(100dvh - 24px); margin: auto; padding: 20px; border: 1px solid var(--line, #ffffff1c); border-radius: 20px; overflow: auto; overscroll-behavior: contain; background: var(--sh-canvas); color: var(--sh-text); box-shadow: 0 24px 90px #0009; }
.sports-hub.sh-filter-dialog::backdrop { background: #0009; backdrop-filter: blur(5px); }
.sh-sheet-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.sh-sheet-header h3 { margin: 0; font-size: 20px; line-height: 1.3; }
.sh-sheet-fields { display: grid; gap: 16px; margin: 20px 0; }
.sh-sheet-fields .sh-filter { display: grid; gap: 8px; min-width: 0; }
.sh-sheet-fields input, .sh-sheet-fields select { width: 100%; min-width: 0; min-height: 44px; font-size: 16px; }
.sh-sheet-check { display: flex; align-items: center; gap: 12px; min-height: 44px; font-size: 14px; line-height: 1.45; }
.sh-sheet-check input { flex: none; width: 22px; height: 22px; min-height: 22px; margin: 0; accent-color: var(--sh-accent); }
.sh-sheet-preferences { display: flex; flex-wrap: wrap; gap: 10px; padding-top: 12px; border-top: 1px solid var(--line, #ffffff18); }
.sh-sheet-preferences p { flex-basis: 100%; }
.sh-sheet-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px; padding-top: 12px; border-top: 1px solid var(--line, #ffffff18); }
.sh-sheet-footer .sh-link-button { margin-right: auto; }
.sh-source-sections { display: grid; gap: 20px; padding-top: 16px; }
.sh-source-section { display: grid; gap: 8px; padding-bottom: 16px; border-bottom: 1px solid var(--line, #ffffff18); }
.sh-source-section h4 { margin: 0; font-size: 16px; }
.sh-source-section p { font-size: 14px; line-height: 1.5; }
@media (max-width: 720px), (max-width: 900px) and (max-height: 500px) and (pointer: coarse) {
  .sports-hub { font-size: 14px; margin-bottom: calc(24px + env(safe-area-inset-bottom, 0px)); }
  .sh-notice { bottom: calc(16px + env(safe-area-inset-bottom, 0px) + max(0px, calc(100dvh - var(--mobile-visual-height, 100dvh) - var(--mobile-visual-offset-top, 0px)))); }
  .sh-content { gap: 24px; min-width: 0; }
  .sh-agenda { gap: 16px; scroll-margin-top: calc(var(--mobile-header-height, 112px) + 14px); }
  .sh-agenda-toolbar { display: flex; flex-direction: column; align-items: stretch; gap: 16px; }
  .sh-agenda-title h3 { font-size: 22px; line-height: 1.25; }
  .sh-agenda-summary, .sh-subtle { font-size: 12px; line-height: 1.5; }
  .sh-agenda-toggles, .sh-filters { display: none; }
  .sh-channel-shortcuts, .sports-hub[data-mode="sports"] .sh-channel-shortcuts { gap: 6px; grid-template-columns: minmax(0, 1fr) 52px; }
  .sh-shortcut-title, .sports-hub[data-mode="sports"] .sh-shortcut-title { min-height: 18px; font-size: 12px; line-height: 1.5; }
  .sh-channel-featured { gap: 6px; }
  .sports-hub .sh-channel-chip { flex-basis: 86px; width: 86px; min-width: 86px; border-radius: 10px; }
  .sports-hub .sh-more-channels { width: 52px; height: auto; min-height: 44px; border-radius: 10px; }
  .sh-more-channels .sh-control-tooltip { display: none; }
  .sh-mobile-more-label { display: block; color: var(--sh-muted); font-size: 11px; line-height: 1.3; }
  .sports-hub .sh-more-channels { gap: 2px; }
  .sh-mobile-query { display: grid; gap: 12px; min-width: 0; }
  .sh-query-actions { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: end; gap: 8px; }
  .sh-mobile-period select { min-height: 44px; }
  .sports-hub .sh-button, .sports-hub .sh-filter-chip, .sports-hub .sh-link-button { min-height: 44px; height: auto; font-size: 13px; line-height: 1.4; white-space: normal; }
  .sh-query-actions .sh-button { padding: 9px 10px; }
  .sh-query-actions .sh-button[aria-pressed="true"] { box-shadow: inset 0 0 0 1px var(--sh-accent), 0 3px 12px #e3133215; background: color-mix(in srgb, var(--sh-accent) 11%, var(--sh-surface)); }
  .sh-mobile-date { display: grid; grid-template-columns: minmax(0, 1fr); gap: 7px; width: 100%; min-width: 0; font-size: 13px; }
  .sports-hub .sh-mobile-date input { display: block; width: 100%; min-width: 0; max-width: 100%; height: 46px; min-height: 46px; margin: 0; padding: 10px 12px; box-sizing: border-box; font: inherit; font-size: 16px; line-height: 1.3; -webkit-appearance: none; appearance: none; border-radius: 10px; }
  .sh-mobile-date input::-webkit-date-and-time-value { min-width: 0; text-align: left; }
  .sh-mobile-date input::-webkit-datetime-edit { display: block; padding: 0; }
  .sh-query-context { color: var(--sh-muted); font-size: 12px; line-height: 1.5; }
  .sh-active-filters { display: flex; flex-wrap: wrap; gap: 8px; min-width: 0; }
  .sh-active-filters:empty { display: none; }
  .sh-active-filters .sh-filter-chip { max-width: 100%; overflow-wrap: anywhere; text-align: left; }
  .sh-feed-info { display: flex; align-items: center; gap: 4px 16px; padding: 12px 0; border-block: 1px solid var(--line, #ffffff12); font-size: 12px; line-height: 1.5; }
  .sh-feed-info > .sh-data-status { flex-basis: 100%; font-size: 12px; line-height: 1.5; }
  .sh-feed-info > small, .sh-feed-info > .sh-sources { display: none; }
  .sh-mobile-sources { display: inline-flex; align-items: center; }
  .sh-feed-info .sh-refresh-button { margin-left: auto; }
  .sh-table-heading { display: none; }
  .sh-match-list { display: grid; gap: 12px; }
  .sh-match-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: none; align-items: start; gap: 12px 10px; min-height: 0; padding: 16px; border: 1px solid var(--line, #ffffff12); border-radius: 14px; background: color-mix(in srgb, var(--sh-surface) 55%, transparent); }
  .sh-match-row > .sh-time-cell { grid-column: 1; grid-row: 1; display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 10px; }
  .sh-time-cell .sh-date { font-size: 12px; line-height: 1.5; }
  .sh-time-cell .sh-time { font-size: 20px; line-height: 1.3; }
  .sh-time-cell > .sh-subtle { flex-basis: 100%; font-size: 11px; }
  .sh-match-row > .sh-match-state { grid-column: 2; grid-row: 1; justify-self: end; max-width: 108px; white-space: normal; font-size: 11px; line-height: 1.45; text-align: right; }
  .sh-match-row > .sh-team-pair { grid-column: 1 / -1; grid-row: 2; grid-template-columns: auto minmax(0, 1fr); gap: 12px; }
  .sh-match-badges { gap: 5px; }
  .sh-match-row .sh-team-badge { width: 24px; height: 24px; }
  .sh-match-copy { min-width: 0; }
  .sh-match-title { display: block; font-size: 15px; line-height: 1.45; white-space: normal; overflow-wrap: anywhere; }
  .sh-match-row > .sh-match-meta { grid-column: 1 / -1; grid-row: 3; display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; }
  .sh-mobile-sport { display: inline; color: var(--sh-muted); font-size: 12px; }
  .sh-match-meta .sh-competition-identity { min-width: 0; max-width: 100%; min-height: 44px; gap: 7px; grid-template-columns: 22px minmax(0, 1fr); white-space: normal; }
  .sh-match-meta .sh-competition-name { white-space: normal; overflow-wrap: anywhere; font-size: 12px; line-height: 1.4; }
  .sh-match-meta .sh-competition-mark { width: 22px; height: 22px; }
  .sh-match-row .sh-transmission { display: grid; grid-column: 1 / -1; grid-row: 4; gap: 8px; max-height: none; }
  .sh-guide-channels { font-size: 15px; line-height: 1.4; }
  .sh-transmission small, .sh-transmission .sh-transmission-note { font-size: 12px; line-height: 1.5; }
  .sh-guide-badge { padding: 5px 8px; font-size: 12px; }
  .sh-mobile-warning { display: block; color: var(--sh-text); border-left: 2px solid #dba94c; padding-left: 9px; font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
  .sh-guide-details { width: 100%; font-size: 12px; }
  .sh-guide-details summary { display: flex; align-items: center; min-height: 44px; list-style: disclosure-closed; text-decoration: underline; text-underline-offset: 3px; }
  .sh-guide-details small { max-width: none; overflow-wrap: anywhere; }
  .sh-match-row .sh-row-actions { grid-column: 1 / -1; grid-row: 5; justify-content: flex-start; flex-wrap: wrap; gap: 8px; padding-top: 3px; }
  .sports-hub .sh-row-actions .sh-button { flex: 1; min-width: 110px; padding: 11px 14px; }
  .sports-hub .sh-icon-button { flex: none; width: 44px; height: 44px; min-width: 44px; min-height: 44px; }
  .sh-table-note { font-size: 12px; line-height: 1.6; }
  .sh-featured-heading { align-items: start; gap: 12px; }
  .sh-featured-heading h3 { min-width: 0; max-width: 75%; font-size: 18px; line-height: 1.4; }
  .sh-featured-heading .sh-link-button { flex: none; }
  .sh-featured-list { display: flex; align-items: flex-start; gap: 12px; width: 100%; min-width: 0; max-width: 100%; padding: 0 0 8px; overflow-x: auto; scroll-snap-type: x proximity; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; touch-action: pan-x pan-y pinch-zoom; }
  .sh-feature-card, .sh-feature-skeleton { flex: 0 0 calc(100% - 28px); min-width: 0; padding: 16px; gap: 12px; scroll-snap-align: start; }
  .sh-feature-card { display: flex; flex-direction: column; align-self: flex-start; height: auto; min-height: 0; }
  .sh-feature-pair { display: flex; flex-direction: column; align-items: stretch; gap: 10px; min-width: 0; }
  .sh-feature-pair > .sh-feature-team { display: none; }
  .sh-feature-mobile-pair { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 10px; min-width: 0; }
  .sh-feature-mobile-pair .sh-team-badge { width: 28px; height: 28px; }
  .sh-feature-match-title { min-width: 0; font-size: 14px; line-height: 1.45; overflow-wrap: anywhere; }
  .sh-feature-time { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 0; }
  .sh-feature-time > small { display: none; }
  .sh-feature-time > span, .sh-feature-time > small { font-size: 12px; }
  .sh-feature-time > strong { font-size: 22px; }
  .sh-feature-footer { display: grid; grid-template-columns: 44px minmax(0, 1fr); grid-auto-rows: auto; gap: 8px; align-items: center; width: 100%; }
  .sh-feature-meta { display: flex; flex-direction: column; align-items: stretch; grid-column: 1 / -1; grid-row: auto; gap: 8px; flex: none; flex-basis: auto; width: 100%; min-width: 0; height: auto; min-height: 0; }
  .sh-feature-meta > .sh-competition-identity { grid-column: auto; grid-row: auto; grid-template-columns: 22px minmax(0, 1fr); min-height: 28px; }
  .sh-feature-meta .sh-competition-mark { width: 22px; height: 22px; }
  .sh-feature-meta > .sh-feature-transmission { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; align-content: start; justify-content: flex-start; grid-column: auto; grid-row: auto; gap: 6px 8px; width: 100%; min-width: 0; height: auto; min-height: 0; max-height: none; margin: 0; }
  .sh-feature-transmission > .sh-guide-channels { font-size: 14px; }
  .sh-feature-transmission > .sh-guide-badge { padding: 4px 7px; font-size: 11px; }
  .sh-feature-transmission > :is(.sh-guide-details, .sh-mobile-warning) { flex-basis: 100%; width: 100%; margin: 0; }
  .sh-feature-meta small { font-size: 12px; }
  .sh-feature-footer > .sh-button { margin: 0; width: 100%; }
  .sh-feature-meta .sh-competition-name { white-space: normal; font-size: 12px; }
  .sh-hero-football { --sh-football-height: 220px; }
  .sh-hero-football .sh-hero-copy { max-width: 62%; left: 16px; }
  .sh-hero h2, .sh-sport-panel .sh-hero-heading { font-size: clamp(28px, 8vw, 40px); }
  .sh-hero-football .sh-hero-action { min-height: 44px; }
  .sh-hero-sports { grid-template-rows: 180px auto; gap: 10px; }
  .sh-sport-panel-motorsport { height: 180px; }
  .sh-sport-panel-basketball, .sh-sport-panel-american_football { aspect-ratio: 1.25 / 1; min-height: 115px; }
  .sports-hub .sh-sport-panel .sh-art-category { min-height: 44px; padding: 8px; font-size: 12px; }
  .sh-sport-panel .sh-hero-copy { left: 16px; }
  .sh-sport-panel .sh-kicker { font-size: 10px; }
  .sh-sport-panel .sh-hero-subtitle { font-size: 12px; }
  .sports-hub.sh-filter-dialog, .sports-hub.sh-teams-dialog { width: 100%; max-width: 100%; max-height: calc(100dvh - max(12px, env(safe-area-inset-top, 0px))); margin: auto 0 0; padding: 20px max(16px, env(safe-area-inset-right, 0px)) calc(16px + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px)); border-radius: 20px 20px 0 0; }
  .sh-sheet-fields .sh-filter > span { font-size: 14px; line-height: 1.5; }
  .sports-hub.sh-filter-dialog .sh-subtle { font-size: 12px; }
  .sh-sheet-footer { position: static; padding-bottom: 4px; }
  .sh-sheet-footer .sh-button { flex: 1; }
  .sh-sheet-footer .sh-link-button { flex-basis: 100%; justify-content: flex-start; }
  .sh-team-picker-header > div { min-width: 0; }
  .sh-team-picker-header h3 { font-size: 20px; overflow-wrap: anywhere; }
  .sh-team-option-copy { overflow-wrap: anywhere; }
  .sh-team-picker-search { font-size: 16px; min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  .sh-featured-list { scroll-behavior: auto; scroll-snap-type: none; }
  .sh-filter-dialog, .sh-filter-dialog::backdrop { animation: none !important; transition: none !important; }
}

/* Missing crests never reserve a placeholder column or reveal broken images. */
.sports-hub :is(.sh-team-pair, .sh-feature-mobile-pair) { grid-template-columns: max-content minmax(0, 1fr); }
.sports-hub .sh-match-badges { display: flex; width: max-content; min-width: 0; }
.sports-hub :is(.sh-team-badge, .sh-match-badges, .sh-versus)[hidden] { display: none; }
.sports-hub :is(.sh-team-pair, .sh-feature-mobile-pair):has(> .sh-match-badges[hidden]) { grid-template-columns: minmax(0, 1fr); gap: 0; }

/* Official monochrome artwork: preserve its shape and ensure contrast. */
:root:not([data-theme="light"]) .sh-badge-image[src="https://www.independientedelvalle.com/wp-content/uploads/2025/09/LOGO-NEGRO-dragonasIDV-USFQ.png"] { filter: invert(1); }

/* Sports transmissions: quiet surfaces, one event per row, explicit routes. */
.sports-hub { --sh-line: color-mix(in srgb, var(--sh-muted) 14%, transparent); min-width: 0; }
.sh-agenda { gap: 18px; }
.sh-agenda-toolbar { grid-template-columns: minmax(180px, auto) minmax(0, 1fr) auto; gap: 20px; }
.sh-agenda-title h3 { font-size: 25px; letter-spacing: -.035em; line-height: 1.2; }
.sh-agenda-summary { font-size: 12px; line-height: 1.5; }
.sports-hub .sh-agenda-control:is(:hover, :focus-visible) { background: color-mix(in srgb, var(--sh-text) 5%, transparent); box-shadow: none; }
.sh-agenda-control[aria-pressed="true"] > .sh-icon { filter: none; }
.sh-shortcut-title, .sports-hub[data-mode="sports"] .sh-shortcut-title { font-size: 11px; }
.sports-hub .sh-channel-chip { border-radius: 7px; }
.sports-hub .sh-channel-chip:hover { box-shadow: none; background: color-mix(in srgb, var(--sh-text) 4%, transparent); }
.sh-filters > .sh-filter { grid-template-rows: 16px 42px; gap: 8px; font-size: 12px; }
.sh-filters > .sh-filter > span { min-height: 16px; line-height: 16px; }
.sports-hub .sh-filters .sh-filter :is(input, select) { height: 42px; min-height: 42px; max-height: none; border: 1px solid var(--sh-line); background: color-mix(in srgb, var(--sh-surface) 82%, transparent); box-shadow: none; font-size: 13px; }
.sh-feed-info { gap: 0; min-height: 20px; padding: 0; border: 0; font-size: 12px; line-height: 1.5; }
.sh-feed-info .sh-subtle { font-size: 12px; }
.sh-match-table { min-width: 0; }
.sh-table-heading, .sh-match-row { grid-template-columns: 76px minmax(180px, 1.6fr) minmax(90px, .55fr) minmax(145px, .9fr) minmax(175px, 1.2fr) 44px; gap: 16px; padding-inline: 12px; }
.sh-table-heading { min-height: 34px; font-size: 11px; }
.sh-match-list { min-width: 0; }
.sh-match-row { min-width: 0; min-height: 100px; padding-block: 18px; border-block-start: 1px solid var(--sh-line); border-radius: 0; }
.sh-match-row:last-child { border-block-end: 1px solid var(--sh-line); }
.sh-match-row[data-phase="live"] { background: linear-gradient(90deg, color-mix(in srgb, var(--sh-accent) 5%, transparent), transparent 64%); box-shadow: inset 2px 0 var(--sh-accent); }
.sh-match-row[data-double-play="true"], .sh-feature-card[data-double-play="true"] { cursor: pointer; touch-action: manipulation; }
.sh-feature-card:focus-visible { outline: 2px solid var(--sh-text); outline-offset: 2px; }
.sh-match-row:focus-visible { outline: 2px solid var(--sh-text); outline-offset: -2px; }
.sh-time-cell { min-width: 0; gap: 5px; }
.sh-date { font-size: 11px; line-height: 1.4; }
.sh-time { font-size: 17px; line-height: 1.2; font-variant-numeric: tabular-nums; }
@media (min-width: 1101px) {
  .sh-time[data-source="tv"] { font-size: 14px; white-space: nowrap; }
}
.sh-time-cell .sh-match-state { grid-column: auto; grid-row: auto; justify-self: start; max-width: 100%; font-size: 10px; text-align: left; }
.sports-hub .sh-live-badge { gap: 5px; padding: 0; background: transparent; color: var(--sh-accent); font-size: 10px; line-height: 1.5; letter-spacing: .025em; }
.sh-live-badge::before { box-shadow: none; animation: none; }
.sh-team-pair { gap: 13px; min-width: 0; }
.sh-match-row .sh-team-badge { width: 30px; height: 34px; }
.sh-match-badges { gap: 7px; }
.sh-match-title { font-size: 13px; font-weight: 650; line-height: 1.5; }
.sh-match-copy { gap: 7px; }
.sh-match-score { font-size: 13px; }
.sh-live-scoreboard { gap: 5px 12px; }
.sh-live-score { font-size: 19px; line-height: 1.25; letter-spacing: .02em; }
.sh-live-clock { font-size: 12px; line-height: 1.45; }
.sh-live-checked, .sh-match-note { font-size: 11px; }
.sh-match-meta { min-width: 0; }
.sh-match-sport { display: block; min-width: 0; color: var(--sh-text); font-size: 12px; font-weight: 550; line-height: 1.5; overflow-wrap: anywhere; }
.sh-competition-identity { grid-template-columns: 28px minmax(0, 1fr); gap: 9px; }
.sh-competition-mark { width: 28px; height: 32px; }
.sh-competition-name { color: var(--sh-text); font-size: 12px; line-height: 1.45; }
.sh-transmission { min-width: 0; gap: 8px; }
.sh-broadcast-chips { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; max-width: 100%; min-width: 0; }
.sh-broadcast-chip { display: inline-flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 6px; max-width: 100%; min-width: 0; min-height: 32px; padding: 5px 7px; border: 1px solid var(--sh-line); border-radius: 6px; background: color-mix(in srgb, var(--sh-surface) 55%, transparent); }
.sh-brand-logo { display: block; flex: none; width: 74px; max-width: 100%; height: 24px; object-fit: contain; }
.sh-brand-name { min-width: 0; color: var(--sh-text); font-size: 11px; font-weight: 600; line-height: 1.4; overflow-wrap: anywhere; }
.sh-option-count { align-self: center; color: var(--sh-muted); font-size: 11px; line-height: 1.4; }
.sh-transmission .sh-transmission-note { font-size: 11px; }
.sh-row-actions { justify-content: flex-start; align-content: center; flex-wrap: wrap; gap: 7px; min-width: 0; }
.sports-hub .sh-row-actions .sh-button { flex: 1 1 98px; min-width: 0; min-height: 38px; padding: 9px 10px; border: 1px solid var(--sh-line); border-radius: 7px; background: color-mix(in srgb, var(--sh-surface) 75%, transparent); box-shadow: none; font-size: 11px; line-height: 1.35; white-space: normal; }
.sports-hub .sh-watch-confirm { border-color: transparent; background: var(--sh-accent); color: #fff; box-shadow: none; }
.sports-hub .sh-watch-confirm:hover { background: color-mix(in srgb, var(--sh-accent) 87%, #000); }
.sports-hub .sh-row-actions .sh-icon-button { width: 32px; height: 34px; min-width: 32px; min-height: 34px; border-radius: 7px; }
.sports-hub .sh-row-actions .sh-icon-button .sh-icon { width: 17px; height: 17px; }
.sh-group-heading { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; margin: 27px 0 0; padding: 9px 0 14px; color: var(--sh-text); font-size: 18px; font-weight: 650; line-height: 1.4; }
.sh-group-heading:first-child { margin-top: 8px; }
.sh-group-heading h4 { margin: 0; color: inherit; font: inherit; }
.sh-group-heading[data-phase="live"]::before { content: ''; flex: none; width: 9px; height: 9px; border-radius: 50%; background: var(--sh-accent); }
.sh-group-count { color: var(--sh-muted); font-size: 12px; font-weight: 400; }
.sh-feature-transmission .sh-brand-logo { width: 66px; height: 22px; }
.sh-feature-transmission .sh-broadcast-chip { min-height: 29px; }
[data-theme="light"] .sports-hub :is(.sh-competition-mark, .sh-watch-brand) { background: #111316; border-radius: 5px; }

/* A native dialog keeps the selector above the header and mobile navigation. */
.sports-hub.sh-watch-dialog { inset: 0; width: min(510px, calc(100vw - 40px)); max-width: none; max-height: calc(100vh - 40px); max-height: calc(100dvh - 40px); margin: auto; padding: 22px; overflow: auto; overscroll-behavior: contain; border: 1px solid var(--sh-line); border-radius: 15px; background: var(--sh-canvas); color: var(--sh-text); box-shadow: 0 24px 100px #0009; }
.sh-watch-dialog::backdrop { background: #0009; backdrop-filter: blur(4px); }
.sh-watch-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.sh-watch-header > :first-child { min-width: 0; }
.sh-watch-header h3 { margin: 0; font-size: 21px; font-weight: 650; letter-spacing: -.025em; line-height: 1.3; }
.sports-hub .sh-watch-header .sh-icon-button { width: 44px; height: 44px; min-width: 44px; min-height: 44px; }
.sh-watch-event { margin: 3px 0 18px !important; color: var(--sh-muted); font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.sh-watch-options { display: grid; gap: 8px; min-width: 0; margin: 0; padding: 0; border: 0; }
.sh-watch-option { display: grid; grid-template-columns: 18px auto minmax(0, 1fr) 18px; align-items: center; gap: 9px 12px; min-width: 0; min-height: 76px; padding: 12px; border: 1px solid var(--sh-line); border-radius: 9px; background: color-mix(in srgb, var(--sh-surface) 55%, transparent); cursor: pointer; }
.sh-watch-option:hover { background: color-mix(in srgb, var(--sh-text) 4%, var(--sh-surface)); }
.sh-watch-option[data-selected="true"] { border-color: var(--sh-accent); background: color-mix(in srgb, var(--sh-accent) 7%, var(--sh-surface)); }
.sh-watch-option:focus-within { outline: 2px solid var(--sh-text); outline-offset: 2px; }
.sh-watch-option[data-route="unavailable"] { cursor: default; }
dialog.sh-watch-dialog:not(#player-screen) .sh-watch-radio { display: block; width: 18px; height: 18px; min-width: 18px; min-height: 18px; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; accent-color: var(--sh-accent); appearance: auto; }
.sh-watch-option > .sh-icon { width: 18px; height: 18px; color: var(--sh-muted); }
.sh-watch-brand { display: flex; align-items: center; justify-content: flex-start; min-width: 0; max-width: 100%; }
.sh-watch-brand .sh-brand-logo { width: 82px; height: 30px; }
.sh-broadcast-chip .sh-watch-brand .sh-brand-logo { width: 66px; height: 22px; }
.sh-watch-copy { display: grid; align-content: center; gap: 4px; min-width: 0; color: var(--sh-text); font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.sh-watch-copy small { color: var(--sh-muted); font-size: 11px; line-height: 1.45; }
.sh-watch-option .sh-watch-action { display: inline-flex; align-items: center; gap: 6px; color: var(--sh-muted); font-size: 11px; line-height: 1.4; }
.sh-watch-action .sh-icon { width: 16px; height: 16px; }
.sh-watch-variants { display: grid; grid-column: 1 / -1; gap: 6px; min-width: 0; padding-top: 8px; color: var(--sh-muted); font-size: 12px; line-height: 1.45; }
.sh-watch-variants select { width: 100%; min-width: 0; min-height: 44px; padding: 10px 12px; border: 1px solid var(--sh-line); border-radius: 7px; background: var(--sh-surface); color: var(--sh-text); font: inherit; }
.sh-watch-variants select:focus-visible { outline: 2px solid var(--sh-text); outline-offset: 3px; }
.sh-watch-feedback { min-height: 0; margin: 14px 0 0 !important; color: var(--sh-text); font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.sh-watch-feedback:empty { display: none; }
.sports-hub .sh-watch-confirm { display: inline-flex; align-items: center; justify-content: center; gap: 9px; width: 100%; min-height: 46px; margin-top: 18px; padding: 12px 16px; border: 1px solid transparent; border-radius: 8px; font-size: 13px; font-weight: 650; line-height: 1.4; white-space: normal; }
.sh-watch-confirm .sh-icon { width: 17px; height: 17px; }
.sports-hub .sh-watch-confirm:disabled { opacity: .5; }

@media (max-width: 1450px) {
  .sh-agenda-toolbar { grid-template-columns: minmax(0, 1fr) auto; gap: 15px; }
  .sh-agenda-title { grid-column: 1; grid-row: 1; }
  .sh-agenda-toggles { grid-column: 2; grid-row: 1; }
  .sh-channel-shortcuts, .sports-hub[data-mode="sports"] .sh-channel-shortcuts { grid-column: 1 / -1; grid-row: 2; }
  .sh-table-heading, .sh-match-row { gap: 12px; grid-template-columns: 70px minmax(150px, 1.6fr) minmax(88px, .6fr) minmax(120px, .85fr) minmax(145px, 1fr) 44px; }
  .sh-match-row .sh-team-badge { width: 27px; height: 30px; }
  .sh-match-badges { gap: 5px; }
}
@media (max-width: 1100px) {
  .sh-table-heading { display: none; }
  .sh-match-row { grid-template-columns: 78px minmax(0, 1fr); gap: 12px 16px; padding: 18px 12px; }
  .sh-match-row > .sh-time-cell { grid-column: 1; grid-row: 1 / span 4; align-self: start; display: grid; }
  .sh-match-row > .sh-team-pair { grid-column: 2; grid-row: 1; }
  .sh-match-row > .sh-match-sport { grid-column: 2; grid-row: 2; color: var(--sh-muted); }
  .sh-match-row > .sh-match-meta { grid-column: 2; grid-row: 3; }
  .sh-match-row .sh-transmission { grid-column: 2; grid-row: 4; }
  .sh-match-row .sh-row-actions { grid-column: 2; grid-row: 5; }
  .sh-row-actions { justify-content: flex-start; }
  .sports-hub .sh-row-actions .sh-button { flex: 0 1 auto; min-width: 116px; }
  .sports-hub .sh-row-actions .sh-icon-button { width: 40px; min-width: 40px; height: 40px; min-height: 40px; }
  .sh-match-title { font-size: 14px; }
  .sh-competition-name { -webkit-line-clamp: unset; font-size: 12px; }
}
@media (max-width: 720px), (max-width: 900px) and (max-height: 500px) and (pointer: coarse) {
  .sh-agenda-toolbar { display: flex; gap: 14px; }
  .sh-agenda-title h3 { font-size: 24px; }
  .sh-channel-featured { gap: 5px; }
  .sh-feed-info { padding: 0; min-height: 20px; border: 0; }
  .sh-feed-info > small { display: inline; }
  .sh-mobile-query { gap: 10px; }
  .sh-match-list { gap: 12px; }
  .sh-group-heading { gap: 8px 10px; margin: 14px 0 0; padding-bottom: 2px; font-size: 18px; }
  .sh-group-heading:first-child { margin-top: 6px; }
  .sh-match-row { grid-template-columns: minmax(0, 1fr); gap: 13px; padding: 16px; border: 1px solid var(--sh-line); border-radius: 12px; background: color-mix(in srgb, var(--sh-surface) 55%, transparent); }
  .sh-match-row:last-child { border-block-end: 1px solid var(--sh-line); }
  .sh-match-row[data-phase="live"] { box-shadow: inset 3px 0 var(--sh-accent); }
  .sh-match-row > .sh-time-cell { grid-column: 1; grid-row: 1; display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 10px; }
  .sh-time-cell .sh-match-state { margin-left: auto; max-width: 48%; font-size: 11px; }
  .sh-time-cell .sh-date { font-size: 12px; }
  .sh-time-cell .sh-time { font-size: 20px; }
  .sh-match-row > .sh-team-pair { grid-column: 1; grid-row: 2; gap: 12px; }
  .sh-match-title { font-size: 15px; line-height: 1.5; }
  .sh-match-row .sh-team-badge { width: 29px; height: 33px; }
  .sh-live-score { font-size: 22px; }
  .sh-live-clock, .sh-match-note { font-size: 12px; }
  .sh-match-row > .sh-match-sport { grid-column: 1; grid-row: 3; color: var(--sh-muted); font-size: 12px; }
  .sh-match-row > .sh-match-meta { grid-column: 1; grid-row: 4; gap: 7px 10px; }
  .sh-match-meta .sh-competition-identity { grid-template-columns: 26px minmax(0, 1fr); min-height: 32px; }
  .sh-match-meta .sh-competition-mark { width: 26px; height: 30px; }
  .sh-match-meta .sh-competition-name { font-size: 12px; }
  .sh-mobile-sport { font-size: 11px; }
  .sh-match-row .sh-transmission { grid-column: 1; grid-row: 5; gap: 8px; }
  .sh-broadcast-chip { min-height: 34px; padding: 5px 7px; }
  .sh-brand-logo { width: 73px; height: 23px; }
  .sh-brand-name, .sh-option-count, .sh-transmission .sh-transmission-note { font-size: 12px; }
  .sh-match-row .sh-row-actions { grid-column: 1; grid-row: 6; gap: 8px; padding-top: 0; }
  .sports-hub .sh-row-actions .sh-button { flex: 1 1 calc(50% - 4px); min-width: 0; min-height: 44px; padding: 11px 10px; font-size: 12px; }
  .sports-hub .sh-row-actions .sh-icon-button { width: 44px; min-width: 44px; height: 44px; min-height: 44px; }
  .sh-feature-transmission .sh-broadcast-chips { width: 100%; }
  .sh-feature-footer { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sh-feature-footer > .sh-feature-meta { grid-column: 1 / -1; grid-row: 1; }
  .sh-feature-footer > .sh-reminder-button { grid-column: 1 / -1; grid-row: 3; justify-self: end; }
  .sports-hub.sh-watch-dialog { inset: auto 0 max(0px, calc(100dvh - var(--mobile-visual-height, 100dvh) - var(--mobile-visual-offset-top, 0px))); width: 100%; max-width: 100%; max-height: calc(100vh - 16px); max-height: calc(var(--mobile-visual-height, 100dvh) - max(12px, env(safe-area-inset-top, 0px))); margin: auto 0 0; padding: 18px max(16px, env(safe-area-inset-right, 0px)) calc(18px + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px)); border-radius: 18px 18px 0 0; }
  body dialog.sh-watch-dialog:not(#player-screen) { width: 100%; max-width: 100%; max-height: calc(var(--mobile-visual-height, 100dvh) - max(12px, env(safe-area-inset-top, 0px))); }
  .sh-watch-header h3 { font-size: 21px; }
  .sh-watch-event { margin-bottom: 16px !important; font-size: 13px; }
  .sh-watch-option { gap: 10px; min-height: 86px; padding: 12px; }
  .sh-watch-copy { font-size: 14px; }
  .sh-watch-copy small { font-size: 12px; }
  .sh-watch-option .sh-watch-action { font-size: 12px; }
  .sh-watch-brand .sh-brand-logo { width: 72px; height: 28px; }
  .sh-watch-variants select { font-size: 16px; }
  .sports-hub .sh-watch-confirm { min-height: 48px; margin-top: 16px; font-size: 14px; }
}
@media (max-width: 380px) {
  .sh-match-row { padding: 14px; }
  .sh-match-row > .sh-team-pair { gap: 9px; }
  .sh-match-row .sh-team-badge { width: 24px; height: 29px; }
  .sh-match-badges { gap: 4px; }
  .sh-match-title { font-size: 14px; }
  .sh-watch-option { gap: 8px; padding: 10px; }
  .sh-watch-brand .sh-brand-logo { width: 60px; height: 25px; }
  .sh-watch-copy { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  .sh-watch-dialog, .sh-watch-dialog::backdrop { animation: none !important; transition: none !important; }
  .sh-identity-image { transition: none; }
}

/* Transmissions are the playback controls: a brand and its exact feed number. */
.sports-hub button.sh-transmission-button { display: inline-flex; align-items: center; justify-content: center; gap: 5px; min-width: 80px; min-height: 44px; padding: 8px 5px; border: 0; border-radius: 6px; background: transparent; color: var(--sh-text); box-shadow: none; font-size: 12px; line-height: 1; cursor: pointer; transform: none; }
.sports-hub button.sh-transmission-button:is(:hover, :active, :focus-visible) { border: 0; background: transparent; box-shadow: none; transform: none; }
.sh-transmission-button .sh-brand-logo { display: block; width: 74px; height: 25px; object-fit: contain; transition: scale 160ms ease; }
.sh-transmission-button .sh-transmission-number { flex: none; font-size: 15px; font-weight: 750; line-height: 1; }
.sh-transmission-fallback { max-width: 150px; font-size: 12px; line-height: 1.4; overflow-wrap: anywhere; }
.sh-table-heading, .sh-match-row { grid-template-columns: 76px minmax(180px, 1.6fr) minmax(90px, .55fr) minmax(145px, .9fr) minmax(175px, 1.2fr) 44px; }
.sh-row-actions { justify-content: flex-end; gap: 4px; }
@media (hover: hover) and (pointer: fine) {
  .sports-hub button.sh-transmission-button:hover .sh-brand-logo { scale: 1.07; }
}
@media (max-width: 1450px) and (min-width: 1101px) {
  .sh-table-heading, .sh-match-row { grid-template-columns: 70px minmax(150px, 1.6fr) minmax(88px, .6fr) minmax(120px, .85fr) minmax(145px, 1fr) 44px; }
}
@media (max-width: 1100px) {
  .sh-match-row { grid-template-columns: 78px minmax(0, 1fr); }
  .sh-row-actions { justify-content: flex-start; }
}
@media (max-width: 720px), (max-width: 900px) and (max-height: 500px) and (pointer: coarse) {
  .sh-match-row { grid-template-columns: minmax(0, 1fr); }
  .sh-feature-footer { grid-template-columns: minmax(0, 1fr) 44px; }
  .sh-feature-footer > .sh-feature-meta { grid-column: 1; grid-row: 1; }
  .sh-feature-footer > .sh-reminder-button { grid-column: 2; grid-row: 1; align-self: end; }
}
@media (prefers-reduced-motion: reduce) {
  .sh-transmission-button .sh-brand-logo { transition: none; scale: none !important; }
}

.sports-hub .sh-channel-chip:is(:hover, :active, :focus-visible) { background: transparent; box-shadow: none; transform: none; }
.sports-hub .sh-channel-logo { transition: scale 160ms ease; }
@media (hover: hover) and (pointer: fine) {
  .sports-hub .sh-channel-chip:hover .sh-channel-logo { scale: 1.07; }
}
@media (prefers-reduced-motion: reduce) {
  .sports-hub .sh-channel-chip .sh-channel-logo { transition: none; scale: none !important; }
}

/* Agenda rows stay a compact list; only featured fixtures use cards. */
.sh-match-support, .sh-match-destinations, .sh-match-context { display: contents; }
@media (max-width: 1100px) {
  .sports-hub .sh-match-list { display: block; }
  .sports-hub .sh-match-row { grid-template-columns: 64px minmax(0, 1fr) minmax(100px, 176px) 44px; grid-template-rows: auto auto; align-content: center; align-items: center; gap: 4px 10px; min-height: 96px; padding: 10px 8px; border: 0; border-block-start: 1px solid var(--sh-line); border-radius: 0; background: transparent; }
  .sports-hub .sh-match-row:last-child { border-block-end: 1px solid var(--sh-line); }
  .sports-hub .sh-match-row[data-phase="live"] { background: linear-gradient(90deg, color-mix(in srgb, var(--sh-accent) 5%, transparent), transparent 65%); box-shadow: inset 2px 0 var(--sh-accent); }
  .sports-hub .sh-match-row > .sh-time-cell { display: grid; grid-column: 1; grid-row: 1 / span 2; align-self: center; align-items: start; gap: 4px; }
  .sports-hub .sh-match-row .sh-time-cell .sh-date { font-size: 12px; line-height: 1.4; }
  .sports-hub .sh-match-row .sh-time-cell .sh-time { font-size: 17px; line-height: 1.2; }
  .sports-hub .sh-match-row .sh-time-cell .sh-time[data-source="tv"] { font-size: 14px; }
  .sports-hub .sh-match-row .sh-time-cell .sh-match-state { max-width: 100%; margin: 0; font-size: 12px; line-height: 1.35; white-space: normal; text-align: left; }
  .sports-hub .sh-match-row .sh-time-cell .sh-live-badge { gap: 3px; font-size: 11px; letter-spacing: 0; text-transform: none; white-space: nowrap; }
  .sports-hub .sh-match-row .sh-time-cell .sh-live-badge::before { width: 5px; height: 5px; }
  .sports-hub .sh-match-row > .sh-team-pair { grid-column: 2; grid-row: 1; align-self: end; gap: 8px; }
  .sports-hub .sh-match-row .sh-match-badges { gap: 4px; }
  .sports-hub .sh-match-row .sh-team-badge { width: 22px; height: 24px; }
  .sports-hub .sh-match-row .sh-versus { font-size: 10px; }
  .sports-hub .sh-match-row .sh-match-title { font-size: 13px; line-height: 1.4; }
  .sports-hub .sh-match-row .sh-match-copy { gap: 3px; }
  .sports-hub .sh-match-row .sh-match-context { display: flex; grid-column: 2; grid-row: 2; align-self: start; align-items: center; flex-wrap: wrap; gap: 2px 7px; min-width: 0; }
  .sports-hub .sh-match-context > .sh-match-sport { flex: 0 1 auto; max-width: 100%; color: var(--sh-muted); font-size: 12px; line-height: 1.4; }
  .sports-hub .sh-match-context > .sh-match-sport::after { content: '·'; margin-left: 7px; }
  .sports-hub .sh-match-context > .sh-match-meta { display: block; min-width: 0; max-width: 100%; }
  .sports-hub .sh-match-context .sh-competition-identity { display: inline-flex; align-items: center; max-width: 100%; min-height: 0; gap: 5px; }
  .sports-hub .sh-match-context .sh-competition-mark { width: 16px; height: 18px; }
  .sports-hub .sh-match-context .sh-competition-name { display: block; color: var(--sh-muted); font-size: 12px; line-height: 1.4; -webkit-line-clamp: unset; }
  .sports-hub .sh-match-row .sh-transmission { display: grid; grid-column: 3; grid-row: 1 / span 2; align-self: center; align-content: center; gap: 2px; max-height: none; }
  .sports-hub .sh-match-row .sh-broadcast-chips { gap: 0 4px; }
  .sports-hub .sh-match-row .sh-transmission-button { min-width: 72px; min-height: 44px; padding: 5px; }
  .sports-hub .sh-match-row .sh-transmission-button .sh-brand-logo { width: 62px; height: 24px; }
  .sports-hub .sh-match-row .sh-transmission-button[data-brand="tnt"] { width: 48px; min-width: 48px; height: 44px; }
  .sports-hub .sh-match-row .sh-transmission-button[data-brand="tnt"] .sh-brand-logo { width: 36px; height: 34px; }
  .sports-hub .sh-match-row :is(.sh-transmission-note, .sh-guide-warning, .sh-match-note, .sh-live-clock, .sh-live-checked) { font-size: 12px; line-height: 1.4; overflow-wrap: anywhere; }
  .sports-hub .sh-match-row .sh-row-actions { grid-column: 4; grid-row: 1 / span 2; align-self: center; justify-content: flex-end; margin: 0; padding: 0; }
  .sports-hub .sh-match-row .sh-row-actions .sh-icon-button { width: 44px; min-width: 44px; height: 44px; min-height: 44px; }
  .sports-hub .sh-match-row .sh-live-score { font-size: 16px; line-height: 1.3; }
}
@media (max-width: 740px), (max-width: 900px) and (max-height: 500px) and (pointer: coarse) {
  .sports-hub .sh-match-row { grid-template-columns: 56px minmax(0, 1fr) 44px; grid-template-rows: auto auto auto; gap: 3px 8px; min-height: 108px; padding: 10px 4px; }
  .sports-hub .sh-match-row > .sh-time-cell { grid-row: 1 / span 3; align-self: start; gap: 4px; }
  .sports-hub .sh-match-row .sh-time-cell .sh-time[data-source="tv"] { font-size: 12px; }
  .sports-hub .sh-match-row > .sh-team-pair { grid-column: 2 / -1; grid-row: 1; align-self: center; gap: 7px; }
  .sports-hub .sh-match-row .sh-team-badge { width: 20px; height: 22px; }
  .sports-hub .sh-match-row .sh-match-context { grid-column: 2 / -1; grid-row: 2; }
  .sports-hub .sh-match-row .sh-transmission { grid-column: 2; grid-row: 3; }
  .sports-hub .sh-match-row .sh-row-actions { grid-column: 3; grid-row: 3; }
}

/* Featured fixtures keep one readable composition on every screen. */
.sh-featured-list { align-items: stretch; }
.sh-feature-card { display: flex; flex-direction: column; align-self: stretch; gap: 12px; height: auto; min-height: 0; padding: 18px; border: 1px solid var(--sh-line); border-radius: 14px; background: linear-gradient(145deg, #ffffff04, transparent 65%), color-mix(in srgb, var(--sh-surface) 76%, var(--sh-canvas)); box-shadow: none; }
.sh-feature-header { display: flex; align-items: center; min-width: 0; min-height: 26px; }
.sh-feature-header .sh-competition-identity { max-width: 100%; grid-template-columns: 22px minmax(0, 1fr); gap: 8px; }
.sh-feature-header .sh-competition-mark { width: 22px; height: 26px; }
.sh-feature-header .sh-competition-name { color: var(--sh-muted); font-size: 11px; font-weight: 550; line-height: 1.45; }
.sh-feature-pair { display: grid; grid-template-columns: minmax(0, 1fr) 70px minmax(0, 1fr); align-items: center; gap: 12px; min-width: 0; min-height: 100px; }
.sh-feature-pair > .sh-feature-team { display: grid; align-self: start; align-content: start; justify-items: center; min-width: 0; gap: 9px; text-align: center; }
.sh-feature-pair .sh-feature-team .sh-team-badge { width: 44px; height: 44px; }
.sh-feature-pair .sh-feature-team strong { max-width: 100%; color: var(--sh-text); font-size: 14px; font-weight: 650; line-height: 1.45; white-space: normal; overflow-wrap: anywhere; }
.sh-feature-pair .sh-feature-time { display: grid; align-self: center; align-content: center; justify-content: center; justify-items: center; gap: 3px; min-width: 0; padding: 0; text-align: center; }
.sh-feature-time > span { color: var(--sh-muted); font-size: 11px; line-height: 1.5; white-space: nowrap; }
.sh-feature-time > strong { color: var(--sh-text); font-size: 28px; font-weight: 750; line-height: 1.2; letter-spacing: -.025em; font-variant-numeric: tabular-nums; }
.sh-feature-time > small { display: block; color: var(--sh-muted); font-size: 12px; line-height: 1.5; }
.sh-feature-mobile-pair { display: none; }
.sh-feature-card .sh-feature-footer { display: grid; grid-template-columns: minmax(0, 1fr) 44px; align-items: center; gap: 12px; width: 100%; min-width: 0; min-height: 57px; margin-top: auto; padding-top: 12px; border-top: 1px solid var(--sh-line); }
.sh-feature-footer > .sh-feature-meta { display: block; grid-column: 1; grid-row: 1; flex: none; width: 100%; min-width: 0; min-height: 0; height: auto; }
.sh-feature-footer > .sh-feature-meta > .sh-feature-transmission { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; align-content: center; justify-content: flex-start; width: 100%; min-width: 0; min-height: 44px; height: auto; max-height: none; margin: 0; gap: 6px; }
.sh-feature-footer .sh-broadcast-chips { width: 100%; gap: 6px; }
.sh-feature-footer .sh-transmission-button .sh-brand-logo { width: 62px; height: 24px; }
.sports-hub .sh-feature-footer > .sh-reminder-button { grid-column: 2; grid-row: 1; align-self: center; justify-self: end; width: 44px; min-width: 44px; height: 44px; min-height: 44px; margin: 0; padding: 0; }
.sh-feature-footer > .sh-reminder-button .sh-icon { width: 20px; height: 20px; }

/* TNT is a square mark; a compact image box preserves its visible size. */
.sports-hub .sh-transmission-button[data-brand="tnt"] { width: 48px; min-width: 48px; height: 44px; min-height: 44px; padding: 5px; }
.sh-transmission-button[data-brand="tnt"] .sh-brand-logo,
.sh-watch-brand[data-brand="tnt"] .sh-brand-logo,
.sh-broadcast-chip .sh-watch-brand[data-brand="tnt"] .sh-brand-logo { width: 36px; height: 34px; }

@media (max-width: 1200px) {
  .sh-feature-card { padding: 16px; }
  .sh-feature-pair { grid-template-columns: minmax(0, 1fr) 62px minmax(0, 1fr); gap: 8px; }
  .sh-feature-pair .sh-feature-team .sh-team-badge { width: 42px; height: 42px; }
  .sh-feature-pair .sh-feature-team strong { font-size: 13px; }
  .sh-feature-time > strong { font-size: 26px; }
}
@media (max-width: 740px), (max-width: 900px) and (max-height: 500px) and (pointer: coarse) {
  .sh-featured-list { display: flex; align-items: stretch; gap: 12px; width: 100%; min-width: 0; max-width: 100%; padding: 0 0 8px; overflow-x: auto; scroll-snap-type: x proximity; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; touch-action: pan-x pan-y pinch-zoom; }
  .sh-feature-card, .sh-feature-skeleton { flex: 0 0 min(360px, calc(100% - 24px)); min-width: 0; scroll-snap-align: start; }
  .sh-feature-card { padding: 16px; gap: 13px; }
  .sh-feature-pair { grid-template-columns: minmax(0, 1fr) 62px minmax(0, 1fr); min-height: 108px; gap: 8px; }
  .sh-feature-pair .sh-feature-team .sh-team-badge { width: 44px; height: 44px; }
  .sh-feature-header .sh-competition-name { font-size: 12px; }
  .sh-feature-time > span { font-size: 11px; }
  .sh-feature-footer .sh-brand-name, .sh-feature-footer .sh-transmission-note { font-size: 12px; }
}

/* One chronological list, shared by every composition. Day headings carry
   dates; routine state labels do not consume another line in every fixture. */
.sports-hub .sh-time-cell .sh-date,
.sports-hub .sh-match-state[data-routine="true"] { display: none; }
.sports-hub[data-mode="football"] .sh-match-sport,
.sports-hub[data-mode="football"] .sh-sport-heading { display: none; }
.sports-hub[data-mode="football"] :is(.sh-table-heading, .sh-match-row) { grid-template-columns: 64px minmax(180px, 1.8fr) minmax(140px, 1fr) minmax(190px, 1.2fr) 44px; }
.sports-hub .sh-group-heading { margin: 18px 0 0; padding: 9px 0; font-size: 14px; font-weight: 650; text-transform: none; }
.sports-hub .sh-group-count { color: var(--sh-muted); font-size: 12px; font-weight: 400; text-transform: none; }
.sports-hub .sh-team-badge > img.sh-badge-image { position: absolute; inset: 0; width: 100%; max-width: 100%; min-width: 0; height: 100%; max-height: 100%; min-height: 0; object-fit: contain; }
.sports-hub .sh-team-badge > img.sh-athlete-portrait { object-fit: cover; object-position: 50% 20%; }
.sports-hub .sh-broadcast-chips { display: flex; flex-wrap: nowrap; align-items: center; gap: 4px; min-width: 0; max-width: 100%; }
.sports-hub .sh-more-transmissions { display: inline-grid; flex: none; place-items: center; width: 44px; min-width: 44px; min-height: 44px; padding: 0; border: 1px solid var(--sh-line); border-radius: 8px; background: transparent; box-shadow: none; color: var(--sh-text); font: inherit; font-weight: 650; }
.sports-hub .sh-more-transmissions:is(:hover, :focus-visible) { border-color: var(--sh-muted); background: transparent; transform: none; }
.sports-hub button.sh-transmission-button { flex: 0 1 auto; min-width: 44px; padding: 4px; }
.sports-hub button.sh-transmission-button:active .sh-brand-logo { scale: .97; }
.sports-hub button.sh-transmission-button:focus-visible,
.sports-hub .sh-more-transmissions:focus-visible { outline: 2px solid var(--sh-text); outline-offset: 2px; }
.sports-hub .sh-watch-catalog-label { margin: 14px 0 2px; color: var(--sh-muted); font-size: 12px; line-height: 1.5; }
.sports-hub .sh-channel-shortcuts { position: relative; }
.sports-hub .sh-channel-extra { display: grid; position: absolute; z-index: 5; top: 100%; right: 0; grid-template-columns: repeat(3, minmax(0, 1fr)); width: min(470px, 80vw); max-height: min(460px, 65dvh); padding: 12px; gap: 6px; overflow: auto; border: 1px solid var(--sh-line); border-radius: 12px; background: var(--sh-surface); box-shadow: 0 8px 24px #0006; }
.sports-hub .sh-channel-extra-item { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; min-width: 0; min-height: 68px; padding: 8px; border: 0; background: transparent; color: var(--sh-text); box-shadow: none; font-size: 12px; }
.sports-hub .sh-watch-dialog .sh-watch-variants select,
.sports-hub .sh-filter-dialog :is(input, select),
.sports-hub .sh-filter-dialog .sh-sheet-check { min-height: 44px; }
.sports-hub .sh-reminder-button { transition: color 140ms ease, opacity 140ms ease; }
.sports-hub .sh-transmission-button[data-brand="tnt"] .sh-brand-logo,
.sports-hub .sh-match-row .sh-transmission-button[data-brand="tnt"] .sh-brand-logo { width: 34px; height: 34px; }
.sports-hub .sh-icon-button:is(:hover, :active, :focus-visible),
.sports-hub .sh-agenda-control:is(:hover, :active, :focus-visible) { background: transparent; box-shadow: none; transform: none; }
@media (hover: hover) and (pointer: fine) {
  .sports-hub :is(.sh-icon-button, .sh-agenda-control):hover > .sh-icon { scale: 1.08; }
}

/* Tablet uses the same compact controls as touch mobile, with roomier rows.
   The single content tree survives portrait, landscape and split-view resize. */
@media (max-width: 1366px) {
  .sports-hub .sh-agenda { gap: 9px; }
  .sports-hub .sh-agenda-toolbar { display: flex; align-items: center; min-height: 0; gap: 8px; }
  .sports-hub .sh-agenda-title h3 { font-size: 23px; }
  .sports-hub .sh-agenda-summary { margin-top: 3px; font-size: 12px; }
  .sports-hub .sh-channel-shortcuts,
  .sports-hub[data-mode="sports"] .sh-channel-shortcuts,
  .sports-hub .sh-agenda-toggles,
  .sports-hub .sh-filters { display: none; }
  .sports-hub .sh-mobile-query { display: grid; gap: 7px; }
  .sports-hub .sh-query-actions { display: flex; align-items: end; gap: 8px; width: 100%; min-width: 0; }
  .sports-hub .sh-query-actions .sh-mobile-refresh { flex: 0 0 44px; }
  .sports-hub .sh-mobile-refresh .sh-control-tooltip { left: auto; right: 0; transform: none; }
  .sports-hub .sh-query-actions > .sh-mobile-period { flex: 1 1 0; min-width: 0; max-width: 145px; }
  .sports-hub .sh-query-actions .sh-mobile-period select { width: 100%; min-width: 0; }
  .sports-hub .sh-mobile-period > span { display: none; }
  .sports-hub .sh-mobile-period > select,
  .sports-hub .sh-open-filters { min-height: 44px; height: 44px; font-size: 14px; }
  .sports-hub .sh-open-filters { flex: 1 1 0; min-width: 0; max-width: 150px; margin: 0; }
  .sports-hub .sh-query-context { color: var(--sh-muted); font-size: 12px; }
  .sports-hub .sh-active-filters { display: flex; flex-wrap: nowrap; max-width: 100%; min-width: 0; overflow-x: auto; gap: 8px; padding: 2px; overscroll-behavior-x: contain; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
  .sports-hub .sh-active-filters .sh-filter-chip { flex: 0 0 auto; max-width: none; min-height: 44px; white-space: nowrap; overflow-wrap: normal; }
  .sports-hub .sh-feed-info { min-height: 0; padding: 0; }
  .sports-hub .sh-feed-info:empty { display: none; }
  .sports-hub .sh-updating { color: var(--sh-muted); font-size: 12px; }
  .sports-hub .sh-notice { bottom: calc(88px + env(safe-area-inset-bottom, 0px) + max(0px, calc(100dvh - var(--mobile-visual-height, 100dvh) - var(--mobile-visual-offset-top, 0px)))); padding: 9px 12px; max-width: min(460px, calc(100vw - 32px)); font-size: 12px; }
  .sports-hub .sh-table-heading { display: none; }
  .sports-hub .sh-match-row,
  .sports-hub[data-mode="football"] .sh-match-row { display: grid; grid-template-columns: 58px minmax(0, 1fr) 190px 44px; grid-template-rows: auto auto; min-height: 86px; gap: 2px 10px; padding: 8px 4px; border: 0; border-top: 1px solid var(--sh-line); border-radius: 0; background: transparent; }
  .sports-hub .sh-match-row > .sh-time-cell { grid-column: 1; grid-row: 1 / span 2; align-self: center; display: grid; gap: 4px; }
  .sports-hub .sh-match-row .sh-time { font-size: 17px; font-variant-numeric: tabular-nums; }
  .sports-hub .sh-match-row > .sh-team-pair { grid-column: 2; grid-row: 1; align-self: end; gap: 8px; }
  .sports-hub .sh-match-row .sh-match-title { font-size: 14px; line-height: 1.4; }
  .sports-hub .sh-match-row .sh-team-badge { width: 23px; height: 25px; }
  .sports-hub .sh-match-row .sh-match-context { display: flex; grid-column: 2; grid-row: 2; align-self: start; align-items: center; flex-wrap: wrap; gap: 2px 6px; min-width: 0; }
  .sports-hub .sh-match-context :is(.sh-match-sport, .sh-competition-name) { color: var(--sh-muted); font-size: 12px; line-height: 1.4; }
  .sports-hub .sh-match-context .sh-competition-identity { display: inline-flex; min-height: 0; gap: 5px; }
  .sports-hub .sh-match-context .sh-competition-mark { width: 16px; height: 18px; }
  .sports-hub .sh-match-row .sh-transmission { grid-column: 3; grid-row: 1 / span 2; align-self: center; gap: 2px; }
  .sports-hub .sh-match-row .sh-row-actions { grid-column: 4; grid-row: 1 / span 2; align-self: center; margin: 0; padding: 0; }
  .sports-hub .sh-match-row .sh-transmission-button { min-width: 44px; min-height: 44px; padding: 2px; }
  .sports-hub .sh-match-row .sh-transmission-button .sh-brand-logo { width: 54px; height: 24px; }
  .sports-hub .sh-match-row .sh-transmission-number { font-size: 12px; }
  .sports-hub .sh-featured-list { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x proximity; padding: 2px 0 8px; }
  .sports-hub .sh-feature-card { flex: 0 0 clamp(300px, 43%, 430px); min-width: 0; scroll-snap-align: start; }
  .sports-hub .sh-match-row .sh-match-state { font-size: 11px; line-height: 1.35; }
  .sports-hub .sh-match-row[data-phase="live"] { box-shadow: inset 2px 0 var(--sh-accent); }
}
@media (max-width: 860px) {
  .sports-hub .sh-agenda { gap: 4px; }
  .sports-hub .sh-agenda-toolbar { min-height: 0; gap: 0; }
  .sports-hub .sh-agenda-title { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; width: 100%; gap: 4px 12px; }
  .sports-hub .sh-agenda-title h3 { font-size: 1.375rem; line-height: 1.25; }
  .sports-hub .sh-agenda-summary { margin: 0; font-size: .6875rem; }
  .sports-hub .sh-agenda-summary > .sh-subtle { display: none; }
  .sports-hub .sh-mobile-query { gap: 6px; }
  .sports-hub .sh-query-actions { align-items: center; gap: 8px; }
  .sports-hub .sh-query-actions > .sh-mobile-period { max-width: 112px; }
  .sports-hub .sh-open-filters { max-width: none; }
  .sports-hub .sh-active-filters:empty { display: none; }
  .sports-hub .sh-feed-info { display: flex; flex-wrap: wrap; gap: 3px 8px; }
  .sports-hub .sh-feed-info > .sh-subtle { font-size: .6875rem; }
  .sports-hub .sh-match-row,
  .sports-hub[data-mode="football"] .sh-match-row { grid-template-columns: 44px minmax(0, 1fr); grid-template-rows: auto auto; gap: 4px 8px; min-height: 84px; padding: 6px 0; }
  .sports-hub .sh-match-row > .sh-time-cell { grid-column: 1; grid-row: 1; align-self: center; padding: 0; gap: 2px; }
  .sports-hub .sh-match-row .sh-time { font-size: 1rem; line-height: 1.4; }
  .sports-hub .sh-match-row > .sh-team-pair { grid-column: 2 / -1; grid-row: 1; }
  .sports-hub .sh-match-row .sh-match-title { font-size: .875rem; line-height: 1.5; }
  .sports-hub .sh-match-row .sh-team-badge { width: 20px; height: 22px; }
  .sports-hub .sh-match-row .sh-match-badges { gap: 3px; }
  .sports-hub .sh-match-row > .sh-match-support { display: flex; grid-column: 1 / -1; grid-row: 2; align-items: center; flex-wrap: wrap; gap: 4px 8px; min-width: 0; font-size: .75rem; }
  .sports-hub .sh-match-row .sh-match-destinations { display: flex; flex: 0 1 auto; align-items: center; gap: 8px; min-width: 0; max-width: 100%; margin-left: auto; }
  .sports-hub .sh-match-row .sh-match-context { display: flex; flex: 1 1 8em; align-self: center; gap: 1px 5px; min-width: 0; max-width: 100%; }
  .sports-hub .sh-match-context :is(.sh-match-sport, .sh-competition-name) { font-size: .75rem; line-height: 1.35; overflow-wrap: anywhere; }
  .sports-hub .sh-match-context .sh-competition-mark { display: none; }
  .sports-hub .sh-match-context .sh-competition-identity { display: block; }
  .sports-hub .sh-match-row .sh-transmission { flex: 0 1 auto; align-self: center; min-width: 0; max-width: 156px; gap: 0; }
  .sports-hub .sh-match-row .sh-row-actions { flex: 0 0 44px; align-self: center; margin-left: auto; }
  .sports-hub .sh-match-row .sh-broadcast-chips { gap: 4px; }
  .sports-hub .sh-match-row .sh-transmission-button { flex: 0 1 52px; flex-wrap: nowrap; width: 52px; min-width: 44px; min-height: 44px; padding: 3px 0; gap: 2px; }
  .sports-hub .sh-match-row .sh-transmission-button .sh-watch-brand { flex: 0 1 auto; min-width: 0; }
  .sports-hub .sh-match-row .sh-transmission-button .sh-brand-logo { width: auto; max-width: min(44px, 100%); height: 22px; max-height: 22px; object-fit: contain; }
  .sports-hub .sh-match-row .sh-transmission-button[data-brand="tnt"] { width: 52px; min-width: 44px; height: 44px; padding: 3px; }
  .sports-hub .sh-match-row .sh-transmission-button[data-brand="tnt"] .sh-brand-logo { width: 24px; height: 24px; max-width: 24px; max-height: 24px; }
  .sports-hub .sh-match-row .sh-transmission-number { font-size: .6875rem; }
  .sports-hub .sh-match-row :is(.sh-transmission-note, .sh-guide-warning) { font-size: .625rem; line-height: 1.3; max-width: 156px; margin: 0; }
  .sports-hub .sh-match-row .sh-transmission-fallback { max-width: 100%; font-size: .6875rem; }
  .sports-hub .sh-group-heading { margin-top: 8px; padding: 4px 0; font-size: .8125rem; }
  .sports-hub .sh-group-heading:first-child { margin-top: 0; }
  .sports-hub .sh-group-count { font-size: .6875rem; }
  .sports-hub .sh-feature-card { flex-basis: min(360px, calc(100% - 18px)); }
  .sports-hub .sh-feature-pair { min-height: 78px; }
  .sports-hub .sh-feature-team .sh-team-badge { width: 34px; height: 36px; }
  .sports-hub .sh-hero-football { height: clamp(150px, 24vw, 205px); }
  .sports-hub .sh-hero { max-height: 220px; }
  .sports-hub .sh-hero-sports { max-height: none; }
}
@media (max-width: 380px) {
  .sports-hub .sh-match-row,
  .sports-hub[data-mode="football"] .sh-match-row { grid-template-columns: 44px minmax(0, 1fr); gap: 4px 6px; }
  .sports-hub .sh-match-row .sh-match-title { font-size: .875rem; }
  .sports-hub .sh-match-row .sh-transmission-number { font-size: .6875rem; }
  .sports-hub .sh-match-row .sh-broadcast-chips { gap: 4px; }
}
.sports-hub .sh-reminder-button .sh-icon { transition: color 140ms ease, fill 140ms ease, opacity 140ms ease; }
.sports-hub .sh-reminder-button[aria-pressed="true"] .sh-icon { fill: color-mix(in srgb, currentColor 16%, transparent); }
@media (prefers-reduced-motion: reduce) {
  .sports-hub .sh-reminder-button,
  .sports-hub .sh-reminder-button .sh-icon,
  .sports-hub button.sh-transmission-button .sh-brand-logo { transition: none; }
  .sports-hub :is(.sh-icon-button, .sh-agenda-control, .sh-transmission-button):is(:hover, :active) :is(.sh-icon, .sh-brand-logo) { scale: none !important; }
}
@media (min-width: 1600px) {
  .sports-hub .sh-match-row .sh-match-title { font-size: 16px; }
  .sports-hub .sh-match-row .sh-time { font-size: 20px; }
  .sports-hub .sh-match-row .sh-competition-name,
  .sports-hub .sh-match-row .sh-match-sport { font-size: 14px; }
  .sports-hub .sh-match-row .sh-transmission-button .sh-brand-logo { width: 82px; height: 28px; }
  .sports-hub .sh-match-row .sh-transmission-button[data-brand="tnt"] .sh-brand-logo { width: 40px; height: 40px; }
  .sports-hub .sh-match-row .sh-transmission-button[data-brand="tnt"] { width: 48px; height: 48px; }
  .sports-hub .sh-match-row:focus-visible { outline-width: 3px; }
}