.live-calendar {
  container: live-calendar / inline-size;
  margin-block: 16px;
}
.live-calendar-board {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 12px;
}
.live-calendar-column {
  --live-calendar-inset: 8px;
  background: var(--color-soft);
  scroll-margin-block-start: 110px;
}
.live-calendar-column-heading {
  flex-wrap: nowrap;
  gap: 8px;
  padding: 10px 12px;
  border-bottom: 0;
  border-radius: calc(var(--collection-radius) - 1px) calc(var(--collection-radius) - 1px) 0 0;
  background: var(--color-primary-surface);
  color: var(--color-on-primary);
}
.live-calendar-column-heading h3 {
  min-width: 0;
  color: inherit;
  font-family: var(--font-heading);
  font-weight: 700;
}
.live-calendar-column-heading .icon { color: color-mix(in srgb, var(--color-accent) 45%, var(--color-surface)); }
.live-calendar-count {
  flex: none;
  min-width: 26px;
  padding: 3px 7px;
  border-radius: 999px;
  background: #ffffff26;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.live-calendar-cards {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: var(--live-calendar-inset);
  list-style: none;
}
.live-calendar-cards > li { min-inline-size: 0; }
.live-calendar-column .live-calendar-more {
  display: flex;
  width: auto;
  min-height: 44px;
  margin: 0 var(--live-calendar-inset) var(--live-calendar-inset);
  background: var(--color-surface);
}
.live-calendar-column .live-calendar-more:hover { border-color: var(--color-primary); }
.live-calendar-column .collection-empty-icon { background: var(--color-surface); }

.live-calendar .calendar-match-card { gap: 6px; padding: 7px 10px; }
.live-calendar .calendar-match-card--suspended {
  --card-tone: #a05047;
  --card-tint: #f8ebe8;
  --card-edge: #dfbdb5;
  --card-ink: #733831;
}
.live-calendar .calendar-card-top { flex-wrap: wrap; gap: 4px 8px; }
.live-calendar .calendar-card-time {
  flex: 1 1 auto;
  gap: 4px 8px;
  line-height: 1.4;
}
.live-calendar .calendar-card-time time { font-size: 14px; white-space: normal; }
.live-calendar .calendar-card-time-label,
.live-calendar .calendar-card-court {
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 600;
}
.live-calendar .calendar-card-court {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.live-calendar .calendar-card-court .icon { width: 13px; height: 13px; }
.live-calendar .calendar-card-teams { font-size: 14px; font-weight: 700; line-height: 1.3; }
.live-calendar .calendar-card-teams .matchup--stacked { gap: 2px; }
.live-calendar .calendar-card-teams .matchup-versus {
  display: flex;
  align-items: center;
  justify-self: stretch;
  gap: 6px;
  padding: 0;
  background: transparent;
  color: var(--color-muted);
}
.live-calendar .calendar-card-teams .matchup-versus::after {
  content: "";
  flex: 1;
  border-top: 1px solid var(--card-edge);
}
.live-calendar .calendar-card-footer {
  flex-wrap: wrap;
  gap: 4px 10px;
  padding-block-start: 5px;
  border-top-color: var(--card-edge);
}
.live-calendar .calendar-card-category { font-size: 12px; line-height: 1.4; }
.live-calendar .calendar-card-score {
  max-width: 100%;
  padding: 2px 6px;
  font-size: 13px;
  white-space: normal;
}
.live-calendar .calendar-card-context {
  display: grid;
  gap: 4px;
  padding-block-start: 5px;
  border-top: 1px solid var(--collection-rule);
}
.live-calendar .calendar-card-context :is(.calendar-original-citation, .court-turn, .warning-text, .calendar-overlap-chip) {
  font-size: 12px;
  line-height: 1.4;
}
.live-calendar .calendar-card-context .court-turn--review:not([hidden]),
.live-calendar .calendar-card-context .warning-text { padding: 4px 6px; }
.live-calendar .calendar-card-context .warning-text {
  max-width: none;
  border-radius: 4px;
  background: #fff1dc;
  color: #694413;
  white-space: pre-line;
}
.live-calendar-jumps {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-block-end: 12px;
}
.live-calendar-jumps a {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  min-height: 44px;
  padding: 6px 10px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-button);
  background: var(--color-surface);
  color: var(--color-primary);
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
}
.live-calendar-jumps a:hover { border-color: var(--color-primary); }
.live-calendar-jumps a:focus-visible,
.live-calendar-column:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}
.live-calendar-jumps a > span {
  padding: 2px 6px;
  border-radius: 999px;
  background: var(--color-soft);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

@container live-calendar (min-width: 560px) {
  .live-calendar-board { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .live-calendar-jumps { display: flex; flex-wrap: wrap; }
}
@container live-calendar (min-width: 960px) {
  .live-calendar-board { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .live-calendar-jumps { justify-content: end; }
  .live-calendar-jumps:not(:has(.live-calendar-jump--unscheduled, .live-calendar-jump--suspended)),
  .live-calendar-jumps a:not(.live-calendar-jump--unscheduled, .live-calendar-jump--suspended) { display: none; }
}

@media screen {
  :root[data-court-theme^='dark-'] .live-calendar .calendar-match-card--suspended {
    --card-tone: var(--color-danger-border); --card-tint: var(--color-danger-bg); --card-edge: var(--color-border); --card-ink: var(--color-danger-text);
  }
  :root[data-court-theme^='dark-'] .live-calendar .warning-text { color: var(--color-warning-text); background: var(--color-warning-bg); }
}