/*
 * Presenter (projector) mode styles.
 *
 * Row sizing: the font is viewport-relative but CAPPED so a very large screen
 * packs more rows/columns instead of blowing the text up. The em-based column
 * sizing in the pairingsPresenter component keys off this resolved font size,
 * so capping the font also lets wide screens add columns. min keeps it legible
 * on a laptop; max keeps density on a 4K projector.
 */
.presenter-row {
    font-size: clamp(1.15rem, 1.5vw, 1.8rem);
    line-height: 1.15;
}

/*
 * Authenticator-style countdown ring: the progress stroke depletes over one
 * page interval and loops. Duration is driven by the `--interval` custom
 * property set inline on the ring element (e.g. `style="--interval: 10s"`).
 * The `pairingsPresenter` Alpine component restarts the animation on each page
 * advance so the ring stays in sync with pagination.
 *
 * stroke-dasharray on the ring is 100.53 ≈ circumference of r=16 (2·π·16),
 * so offsetting from 0 → 100.53 sweeps the full circle.
 *
 * Note: intentionally NOT suppressed under prefers-reduced-motion — this is an
 * unattended projector display where the ring is functional countdown feedback,
 * not decorative motion.
 */
@keyframes presenter-countdown {
    from {
        stroke-dashoffset: 0;
    }
    to {
        stroke-dashoffset: 100.53;
    }
}

.presenter-ring-progress {
    animation: presenter-countdown var(--interval, 10s) linear infinite;
}