.day-picker {
  display: grid;
  grid-template-columns: none;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - 24px) / 5);
  gap: 6px;
  overflow-x: auto;
  padding: 1px 1px 8px;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
  scrollbar-color: #3b4655 transparent;
}

.day-picker::-webkit-scrollbar { height: 4px; }
.day-picker::-webkit-scrollbar-thumb { border-radius: 10px; background: #3b4655; }
.day-button { height: 66px; scroll-snap-align: start; }
.day-button span,
.day-button strong,
.day-button em { display: block; }
.day-button strong { margin-top: 3px; }
.day-button em { margin-top: 2px; color: #7f8a99; font-size: 8px; font-style: normal; }
.day-button.selected em { color: #dce7ff; }

@media (max-width: 370px) {
  .day-picker { grid-auto-columns: calc((100% - 16px) / 5); gap: 4px; }
}