body { font-size: 15px; }
@media (max-width: 576px) {
    /* iOS zooms on focus for inputs under 16px */
    .form-control, .form-select { font-size: 16px; }
}
video.player { width: 100%; max-height: 75vh; background: #000; border-radius: .375rem; }
.badge.t-Person { background: #d63384; }
.badge.t-Vehicle { background: #0d6efd; }
.badge.t-Pet { background: #fd7e14; }
.badge.t-Motion, .badge.t-Face, .badge.t-Package { background: #6c757d; }

/* per-camera activity strip: one cell per hour */
.strip { display: flex; gap: 1px; height: 18px; }
.strip > span { flex: 1; background: #2b3035; border-radius: 1px; }
.strip-label { width: 8.5rem; flex-shrink: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* browse grid: 4 x 15-min chunks per hour */
.chunk { display: inline-block; width: 3.4rem; text-align: center; }
.table td, .table th { vertical-align: middle; }

/* keep the nav on one line at phone width */
.app-nav .nav-link { padding-left: .45rem; padding-right: .45rem; }
@media (max-width: 400px) { .app-nav .nav-link { font-size: .95rem; padding-left: .35rem; padding-right: .35rem; } }