@media (max-width: 47.9375rem) {
    :root { --plate-gap: var(--space-four); }

    .toast {
        top: auto;
        bottom: calc(var(--space-four) + env(safe-area-inset-bottom));
        bottom: calc(anchor-size(--band height) + var(--space-four));
        left: var(--space-four);
        right: var(--space-four);
        width: auto;
    }

    .toast[data-open] { width: auto; }
}

@media (max-width: 22.9375rem) {
    :root { --sig-size: var(--space-eight); }

    .grid { grid-template-columns: minmax(0, 1fr); }
    .field { flex-basis: var(--fill); }
    .intro { grid-template-columns: minmax(0, 1fr); }
}

@media (min-width: 78rem) {
    :root {
        --plate-h: calc(
            var(--space-eight)
            + var(--fs-caption) * var(--lh-compact)
            + var(--space-two)
            + var(--fs-display-m) * var(--lh-heading));
        --plate-gap: var(--space-six);
    }

    body {
        grid-template-columns: minmax(0, var(--container-wide));
        grid-template-rows: var(--space-nine) 1fr;
        padding-inline: var(--space-six);
    }

    .intro {
        grid-template-rows: var(--space-eight) auto var(--space-two) auto var(--space-eight);
        margin-block: 0;
    }

    .filters { max-width: var(--container-narrow); }

    .field { min-width: 0; }

    .field > select { font-size: var(--fs-body); }

    .foot {
        position: static;
        margin-top: var(--space-eight);
    }

    .grid {
        grid-template-columns: repeat(var(--track-seven), minmax(0, 1fr));
        column-gap: var(--space-three);
        row-gap: var(--space-two);
    }

    .grid::before {
        content: "";
        grid-row: 1;
        grid-column: 1 / -1;
        align-self: end;
        height: var(--border-w);
        background-color: var(--border-subtle);
    }

    .grid:not(:has(.slot:not([hidden])))::after { grid-row: var(--track-two); }

    .day { display: contents; }

    .day-head {
        grid-row: 1;
        align-self: stretch;
        padding-bottom: 0;
    }

    .slot { margin-bottom: 0; }

    .day:nth-child(1) .day-head, .day:nth-child(1) .slot { grid-column: 1; }
    .day:nth-child(2) .day-head, .day:nth-child(2) .slot { grid-column: var(--track-two); }
    .day:nth-child(3) .day-head, .day:nth-child(3) .slot { grid-column: var(--track-three); }
    .day:nth-child(4) .day-head, .day:nth-child(4) .slot { grid-column: var(--track-four); }
    .day:nth-child(5) .day-head, .day:nth-child(5) .slot { grid-column: var(--track-five); }
    .day:nth-child(6) .day-head, .day:nth-child(6) .slot { grid-column: var(--track-six); }
    .day:nth-child(7) .day-head, .day:nth-child(7) .slot { grid-column: var(--track-seven); }
}

@media (prefers-reduced-motion: reduce) {
    :root[data-ready] .subjects,
    :root[data-ready] .foot,
    :root[data-ready] .intro > :not(.plate) { transition: none; }

    .theme svg { animation: none; }
}