.sports-tabs { display: flex; gap: 24px; overflow-x: auto; border-bottom: 1px solid var(--border); margin: 0 0 24px; }
.sports-tabs a { padding: 12px 0; flex-shrink: 0; border-bottom: 3px solid transparent; color: var(--muted); font-weight: 600; text-decoration: none; }
.sports-tabs a[aria-selected="true"] { color: var(--text); border-bottom-color: var(--primary); }
.sports-tabs a:focus-visible { outline: 2px solid var(--primary); outline-offset: 4px; }
.sports-card[hidden] { display: none; }
.ubb-matches { list-style: none; padding: 0; margin: 12px 0 28px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ubb-match { padding: 18px; border: 1px solid var(--border); border-radius: 12px; min-width: 0; }
.ubb-match-today { border-color: var(--primary); background: color-mix(in srgb, var(--primary) 8%, transparent); box-shadow: inset 4px 0 0 var(--primary); }
.ubb-today-badge { display: inline-block; margin-bottom: 12px; padding: 4px 10px; border-radius: 999px; background: var(--primary); color: var(--on-primary, #fff); font-size: .8rem; font-weight: 700; }
.ubb-match-meta { display: flex; flex-direction: column; gap: 4px; color: var(--muted); font-size: .8rem; margin-bottom: 16px; }
.ubb-match-teams { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; font-weight: 600; }
.ubb-match-teams span:last-child { text-align: right; }
.ubb-match-teams strong { color: var(--primary); text-align: center; font-size: 1.1rem; }
.ubb-standings-scroll { overflow-x: auto; margin: 12px 0 24px; border: 1px solid var(--border); border-radius: 12px; }
.ubb-standings-scroll:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
.ubb-standings { width: 100%; border-collapse: collapse; font-size: .9rem; white-space: nowrap; }
.ubb-standings caption { text-align: left; padding: 16px; font-weight: 700; color: var(--text); }
.ubb-standings th, .ubb-standings td { padding: 10px 14px; border-top: 1px solid var(--border); text-align: right; }
.ubb-standings th:nth-child(2) { text-align: left; }
.ubb-standings thead { color: var(--muted); font-size: .8rem; }
.ubb-standings-highlight { background: color-mix(in srgb, var(--primary) 10%, transparent); font-weight: 700; }
.ubb-standings-highlight th { color: var(--primary); }
@media (max-width: 640px) { .ubb-matches { grid-template-columns: 1fr; } .ubb-match { padding: 14px; } }