@supports (height: 100dvh) {
  .sidebar { height: 100dvh; }
}

.show-sm { display: none !important; }

@media (max-width: 1100px) {
  .grid-aside, .grid-aside--wide, .grid-profile { grid-template-columns: minmax(0, 1fr); }
  .sticky { position: static; }
  .topbar__search { width: 220px; }
}

@media (max-width: 900px) {
  html.nav-lock, html.nav-lock body { overflow: hidden; }

  .sidebar {
    position: fixed;
    left: 0;
    top: 0;
    width: min(var(--sidebar-w), 86vw);
    transform: translateX(-100%);
    transition: transform var(--dur-slow) var(--ease-out);
    padding-bottom: env(safe-area-inset-bottom);
  }
  .app.nav-open .sidebar { transform: none; box-shadow: var(--shadow-3); }
  .app.nav-open .nav-backdrop { display: block; position: fixed; inset: 0; z-index: 35; background: var(--surface-overlay); backdrop-filter: var(--blur-overlay); }
  .nav-item { height: 42px; }

  .menu-toggle { display: inline-flex; }
  .show-sm { display: inline-flex !important; }
  .hide-sm { display: none !important; }

  .topbar { padding: 0 12px; gap: 6px; padding-left: max(12px, env(safe-area-inset-left)); padding-right: max(12px, env(safe-area-inset-right)); }
  .topbar__heading { flex: 1; }
  .topbar__spacer, .topbar__search { display: none; }
  .topbar .btn--sm { width: 36px; height: 36px; padding: 0; }
  .topbar .btn--sm .ic { width: 16px; height: 16px; }

  .content { padding: 16px; }
  .credits { padding: 16px 16px calc(16px + env(safe-area-inset-bottom)); }
  .credits__id { display: block; margin: 4px 0 0; }

  .form-grid, .form-grid--3 { grid-template-columns: 1fr; }
  .toasts { right: 12px; left: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); }
  .toast { width: auto; max-width: none; }

  .input, .select, .textarea, .control input { font-size: 16px; }
  .input--sm, .select--sm { height: 36px; }
  .control--sm { height: 36px; }

  .toolbar { gap: 10px; }
  .toolbar .tabs { min-width: 0; flex-basis: 100%; }
  .toolbar__search { width: 100%; }
  .toolbar .field { flex: 1 1 100%; }

  .map { min-height: 380px; }
  .loc-list { max-height: none; }
}

@media (max-width: 640px) {
  .page-head { align-items: flex-start; flex-direction: column; margin-bottom: 16px; gap: 12px; }
  .page-head h1, .detail-head__title { font-size: 22px; line-height: 1.2; }
  .page-head__actions, .detail-head__actions { width: 100%; }
  .page-head__actions > *, .detail-head__actions > * { flex: 1 1 140px; }
  .page-head__actions form .btn, .detail-head__actions form .btn { width: 100%; }

  .grid-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .stat { padding: 14px; gap: 10px; }
  .stat__value { font-size: 24px; }
  .stat__meta { display: block; margin: 6px 0 0; }

  .card__head { padding: 12px 14px; flex-wrap: wrap; }
  .card__head > .grow { flex-basis: 100%; }
  .card__body { padding: 14px; }
  .card__foot { padding: 12px 14px; flex-wrap: wrap; }
  .card__foot .btn { flex: 1 1 auto; }

  .table th, .table td { padding: 10px; }
  .col-opt { display: none; }

  .tabs { gap: 0; }
  .tab { padding: 0 10px; }

  .suspect-grid { grid-template-columns: 1fr; }
  .gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 12px; gap: 8px; }
  .file { padding: 12px 14px; gap: 10px; flex-wrap: wrap; }
  .file__main { flex-basis: calc(100% - 50px); }
  .file__size { margin-left: 46px; }
  .file__actions { margin-left: auto; }

  .tl { flex-wrap: wrap; gap: 4px 12px; }
  .tl__time { width: auto; flex-basis: 100%; order: -1; padding-left: 21px; }

  .profile .avatar--160 { --size: 120px; }
  .kv__row { font-size: 13px; }

  .map { min-height: 300px; }
  .filters { gap: 10px 14px; }

  .dialog {
    width: 100%;
    max-width: 100%;
    max-height: 92dvh;
    margin: auto 0 0;
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  }
  .dialog__inner { max-height: 92dvh; }
  .dialog__head { padding: 16px 16px 0; }
  .dialog__body { padding: 14px 16px 18px; }
  .dialog__foot { padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); }
  .dialog__foot .btn { flex: 1 1 auto; }
  .lightbox { margin: auto; border-radius: var(--radius-lg); width: auto; }
  .lightbox__img { max-width: calc(100vw - 24px); max-height: 75dvh; }

  .login { padding: 20px 16px 24px; align-content: center; }
  .login__seal { width: 120px; }
  .login__title { font-size: 24px; margin-top: 18px; }
  .login__sub { letter-spacing: .16em; }
  .hairline { margin: 20px 0; }
  .credits--floating { position: static; background: none; padding-bottom: calc(16px + env(safe-area-inset-bottom)); }

  .error-page__code { font-size: 48px; }
  .matrix th:first-child, .matrix td:first-child { padding: 10px 12px; min-width: 160px; }
}

@media (max-width: 340px) {
  .grid-stats { grid-template-columns: 1fr; }
  .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .topbar__crumb { display: none; }
}

@media (pointer: coarse) {
  .icon-btn--sm { width: 36px; height: 36px; }
  .gallery__tools { opacity: 1; }
  .table tbody tr:hover { background: transparent; }
  .check__box { width: 20px; height: 20px; }
  .switch__track { width: 38px; height: 22px; }
  .switch__track::after { width: 18px; height: 18px; }
  .switch input:checked + .switch__track::after { left: 18px; }
  .pin { width: 28px; height: 28px; }
  .pin.is-active { width: 36px; height: 36px; }
}
