#town-time { display: flex; align-items: center; gap: 8px; padding: 0 6px; }
.town-time-reading { display: flex; flex-direction: column; min-width: 42px; }
#town-time time { color: var(--text); font-size: 13px; font-weight: 800; font-variant-numeric: tabular-nums; }
#town-time .town-time-reading > span { color: #bec6d5; font-size: 10px; }
#town-time button { min-height: 30px; padding: 4px 8px; border: 1px solid #526079; border-radius: 5px; background: #303b51; color: #edf0f5; font: inherit; font-size: 11px; }
#town-time button:hover { background: #3d4b65; }
#town-time button[aria-pressed="true"] { color: #f5d68e; border-color: #f2c14e; }
@media (max-width: 900px) { #town-time button { min-height: 40px; } }
@media (max-width: 900px) {
  #town-time { order: -1; position: sticky; left: 0; z-index: 1; background: #20293c; }
  #town-time button { max-width: 90px; white-space: normal; line-height: 1.2; }
}