@media (prefers-color-scheme: dark) {
    :root {
        --ink: #e8f2fc;
        --muted: #adc0d3;
        --line: #2b4258;
        --ice: #0b1724;
        --shadow: 0 24px 70px #0006;
    }

    body {
        background: #08131f;
        color: var(--ink);
    }

    .site-header {
        color: #072859;
        background: #f8fcfffa;
        border-bottom: 1px solid #cbdce9;
    }

    .date-chip {
        color: #7ce5bd;
        background: #123c35;
    }

    .day-rail {
        background: #101f30;
        border-color: #2a4258;
    }

    .day-rail button {
        color: var(--ink);
        background: #101f30;
        border-color: #2a4258;
    }

    .day-rail button:hover:not(.active),
    .day-rail button:focus-visible:not(.active) {
        background: #172b3f;
    }

    .section-lead > p:not(.section-kicker):not(.status-note),
    .guide-heading > p:last-child,
    .track-card li p,
    .venue-grid p:not(.mini-label),
    .status-note,
    footer p {
        color: var(--muted);
    }

    .location-pill {
        color: #8fd5ff;
        background: #123149;
    }

    .track-card,
    .venue-grid article {
        background: #101f30;
        border-color: #2a4258;
    }

    .track-card > header,
    .track-card li:not(:last-child) {
        border-color: #2a4258;
    }

    .track-card li.highlight {
        background: linear-gradient(90deg, #12bd8326, transparent);
    }

    .track-card li.break strong,
    .track-card li.break time {
        color: #9bb0c4;
    }

    .venue-number {
        color: #42647d;
    }

    footer {
        background: #0d1b29;
        border-color: #2a4258;
    }

    footer > a,
    .venue-grid a {
        color: #72c8ff;
    }
}

@media (max-width: 680px) {
    .venue-lines p {
        display: grid;
        grid-template-columns: 28px max-content minmax(0, 1fr);
        column-gap: 8px;
    }

    .venue-lines p span {
        width: auto;
    }

    .venue-lines strong {
        margin-right: 0;
        white-space: nowrap;
    }
}

.guide-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.venue-card-copy {
    grid-template-columns: 1fr;
}

@media (max-width: 980px) {
    .guide-cards {
        grid-template-columns: 1fr;
    }
}