/* New Year around the world */
.zones { margin-top: 2.5rem; }
.zones h2 { font-size: 1rem; font-weight: 600; color: #1a1a1a; letter-spacing: normal; text-transform: none; margin-bottom: 0.5rem; }
.zones-intro { font-size: 0.875rem; color: #888; line-height: 1.75; margin-bottom: 1rem; }
.zones-note { font-size: 0.75rem; color: #aaa; margin-bottom: 0.5rem; }
.zones-table { background: #fff; border: 1.5px solid #eee; border-radius: 10px; overflow: hidden; text-align: left; }
.zones-table ol { list-style: none; }
.zones-head,
.zone-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 4.25rem 7.5rem 6.5rem;
    column-gap: 0.75rem;
    align-items: center;
    padding: 0.55rem 0.9rem;
    font-size: 0.85rem;
}
.zones-head { font-size: 0.65rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; color: #aaa; border-bottom: 1px solid #f0f0ee; }
.zone-row + .zone-row { border-top: 1px solid #f0f0ee; }
.zone-place { color: #1a1a1a; font-weight: 500; }
.zone-place small { color: #aaa; font-weight: 400; font-size: 0.75rem; }
.zone-you { display: block; font-size: 0.65rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; color: #999; }
.zone-offset,
.zone-time { color: #777; font-variant-numeric: tabular-nums; }
.zone-status,
.zones-head span:last-child { text-align: right; }
.zone-status { color: #555; font-variant-numeric: tabular-nums; white-space: nowrap; }
.zone-row.is-celebrating .zone-status { color: #1a1a1a; font-weight: 600; }
.zone-row.is-user { background: #f6f6f3; box-shadow: inset 3px 0 0 #1a1a1a; }
@media (max-width: 480px) {
    .zones-head { display: none; }
    .zone-row {
        grid-template-columns: auto minmax(0, 1fr) auto;
        grid-template-areas: "place place status" "offset time time";
        row-gap: 0.15rem;
        column-gap: 0.6rem;
    }
    .zone-place { grid-area: place; }
    .zone-status { grid-area: status; }
    .zone-offset { grid-area: offset; font-size: 0.75rem; }
    .zone-time { grid-area: time; font-size: 0.75rem; }
}