:root {
  --dh-red: #b73535;
  --dh-red-dark: #8f2929;
  --dh-ink: #111;
  --dh-muted: #646464;
  --dh-border: #e5e5e5;
  --dh-max-width: 1120px;
}

.dh-scoreboard, .dh-scoreboard * { box-sizing: border-box; }
.dh-scoreboard { background: #fff; border-bottom: 1px solid var(--dh-border); color: var(--dh-ink); font-family: Arial, sans-serif; }
.dh-scoreboard__inner { max-width: var(--dh-max-width); margin: 0 auto; padding: 0 22px; }
.dh-scoreboard__topline { display: flex; min-height: 43px; align-items: stretch; border-bottom: 1px solid #ececec; }
.dh-scoreboard__title { align-self: center; margin: 0 22px 0 0; color: #444; font-size: 10px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; white-space: nowrap; }
.dh-scoreboard__dates { display: flex; overflow-x: auto; scrollbar-width: none; }
.dh-scoreboard__dates::-webkit-scrollbar, .dh-scoreboard__games::-webkit-scrollbar { display: none; }
.dh-scoreboard__date { border: 0; border-left: 1px solid #eee; background: transparent; color: #555; cursor: pointer; font-size: 10px; font-weight: 600; line-height: 1.18; padding: 7px 15px; white-space: nowrap; }
.dh-scoreboard__date strong { display: block; font-size: 11px; }
.dh-scoreboard__date.is-active { box-shadow: inset 0 -3px var(--dh-red); color: var(--dh-red); }
.dh-scoreboard__all-games { align-self: center; margin-left: auto; border-radius: 3px; background: var(--dh-red); color: #fff; font-size: 11px; font-weight: 700; line-height: 1; padding: 8px 12px; text-decoration: none; white-space: nowrap; transition: background .16s, transform .16s; }
.dh-scoreboard__all-games:hover { background: var(--dh-red-dark); transform: translateY(-1px); }
.dh-scoreboard__filters { display: flex; align-items: center; gap: 8px; padding: 10px 0 0; }
.dh-scoreboard__filters > span { color: #6b6b6b; font-size: 9px; font-weight: 700; letter-spacing: .12em; margin-right: 4px; text-transform: uppercase; }
.dh-scoreboard__league { border: 1px solid #cfd2d7; border-radius: 3px; background: #fff; color: #303236; cursor: pointer; font-size: 11px; font-weight: 700; padding: 6px 12px; }
.dh-scoreboard__league:hover { border-color: var(--dh-red); color: var(--dh-red); }
.dh-scoreboard__league.is-active { border-color: var(--dh-red); background: var(--dh-red); color: #fff; }
.dh-scoreboard__carousel { position: relative; margin: 0 20px; }
.dh-scoreboard__games { display: flex; overflow-x: auto; scroll-behavior: smooth; scrollbar-width: none; }
.dh-scoreboard__game { min-width: 218px; border: 0; border-right: 1px solid var(--dh-border); background: #fff; cursor: pointer; padding: 12px 14px; text-align: left; }
.dh-scoreboard__game:first-child { border-left: 1px solid var(--dh-border); }
.dh-scoreboard__game:hover { background: #fff6f6; }
.dh-scoreboard__game-meta { display: flex; justify-content: space-between; margin-bottom: 8px; color: #747474; font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.dh-scoreboard__game-league { color: var(--dh-red); }
.dh-scoreboard__match { display: grid; grid-template-columns: 1fr auto; gap: 4px; font-size: 12px; font-weight: 700; }
.dh-scoreboard__record { color: #888; font-size: 10px; font-weight: 500; margin-left: 4px; }
.dh-scoreboard__time { grid-row: span 2; align-self: center; color: #555; font-size: 10px; }
.dh-scoreboard .dh-scoreboard__scroll { position: absolute; top: 28px; z-index: 1; display: grid; width: 26px; height: 26px; place-items: center; border: 1px solid #ddd; border-radius: 50%; background: #fff; cursor: pointer; font-size: 18px; line-height: 1; padding: 0; margin: 0; color: #333; text-align: center; box-shadow: 0 1px 3px rgba(0,0,0,0.08); }
.dh-scoreboard .dh-scoreboard__scroll:hover { border-color: #bbb; background: #fafafa; }
.dh-scoreboard .dh-scoreboard__scroll--previous { left: -32px; }
.dh-scoreboard .dh-scoreboard__scroll--next { right: -32px; }
.dh-scoreboard button:focus-visible, .dh-scoreboard a:focus-visible { outline: 3px solid var(--dh-ink); outline-offset: 2px; }

@media (max-width: 640px) {
  .dh-scoreboard__inner { padding: 0 12px; }
  .dh-scoreboard__topline { min-height: 38px; }
  .dh-scoreboard__title { display: none; }
  .dh-scoreboard__date { padding: 6px 10px; font-size: 9px; }
  .dh-scoreboard__date strong { font-size: 10px; }
  .dh-scoreboard__date:nth-child(1), .dh-scoreboard__date:nth-child(n+5) { display: none; }
  .dh-scoreboard__all-games { padding: 7px 9px; font-size: 10px; }
  .dh-scoreboard__filters { gap: 5px; padding-top: 8px; }
  .dh-scoreboard__filters > span { margin-right: 1px; font-size: 8px; }
  .dh-scoreboard__league { padding: 5px 9px; font-size: 10px; }
  .dh-scoreboard__game { min-width: 222px; }
  .dh-scoreboard__carousel { margin: 0; }
  .dh-scoreboard .dh-scoreboard__scroll { display: none !important; }
}
