.calendar-panel {
  font-size: 1rem;
  line-height: 1.6;
}
.calendar-panel .event-row {
  grid-template-columns: minmax(170px, 1fr) minmax(0, 2fr) auto minmax(
      95px,
      auto
    );
  gap: 18px;
  padding-block: 24px;
}
.calendar-panel .event-time {
  font-size: 1rem;
  font-weight: 650;
  line-height: 1.5;
}
.calendar-panel .event-time small {
  margin-top: 5px;
  color: #435448;
  font-size: 0.875rem;
  line-height: 1.5;
}
.calendar-panel .event-title h3 {
  color: #000000;
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: -0.01em;
}
.calendar-panel .event-title p,
.calendar-panel .event-title a {
  font-size: 0.9375rem;
  line-height: 1.6;
}
.calendar-panel .event-title small {
  color: #435448;
  font-size: 0.875rem;
  line-height: 1.6;
}
.calendar-panel .currency {
  font-size: 0.75rem;
}
.calendar-panel .impact {
  font-size: 0.8125rem;
}
.calendar-panel .demo-tag {
  font-size: 0.75rem;
  letter-spacing: 0.04em;
}
.calendar-panel .event-row .demo-tag {
  justify-self: start;
  max-width: 100%;
  white-space: normal;
}
.calendar-panel .period-controls button,
.calendar-panel .zone-label,
.calendar-panel .filter-row {
  font-size: 1rem;
}
.calendar-panel .period-controls button {
  min-height: 44px;
  padding: 10px 14px;
}
.calendar-panel select {
  min-height: 44px;
  max-width: 100%;
  font-size: 1rem;
}
.calendar-panel .calendar-toolbar {
  flex-wrap: wrap;
  gap: 16px;
}
.calendar-panel .zone-label {
  flex-wrap: wrap;
  max-width: 100%;
}
.calendar-panel .calendar-context,
.calendar-panel .state-message,
.calendar-panel .calendar-legend p,
.calendar-panel .calendar-legend a {
  font-size: 0.9375rem;
  line-height: 1.6;
}
.calendar-panel .calendar-legend {
  flex-wrap: wrap;
}
#source-health {
  font-size: 0.9375rem;
  line-height: 1.6;
}
#source-health h3 {
  font-size: 1.125rem;
}
#source-health small {
  font-size: 0.875rem;
}
@media (max-width: 900px) {
  .calendar-panel .event-row {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px 16px;
  }
  .calendar-panel .event-time {
    grid-column: 1 / -1;
    grid-row: 1;
  }
  .calendar-panel .event-title {
    grid-column: 1 / -1;
    grid-row: 2;
  }
  .calendar-panel .impact {
    grid-column: 1;
    grid-row: 3;
  }
  .calendar-panel .event-row .demo-tag {
    grid-column: 2;
    grid-row: 3;
    align-self: center;
  }
}
@media (max-width: 620px) {
  .calendar-panel {
    padding: 18px;
  }
  .calendar-panel .section-heading {
    flex-wrap: wrap;
  }
  .calendar-panel .calendar-legend a {
    flex-basis: 100%;
  }
}
