/* Keep these rules after module styles so every mobile field remains readable. */
@media (max-width: 900px) {
  html { -webkit-text-size-adjust: 100%; }
  html.drawer-open { overflow: hidden; overscroll-behavior: none; }
  body.drawer-open {
    position: fixed;
    top: var(--drawer-scroll-top, 0px);
    left: 0;
    right: 0;
    width: 100%;
    overflow: hidden;
    overscroll-behavior: none;
  }
  #sidebar {
    bottom: auto;
    height: 100vh;
    height: 100dvh;
    max-height: 100dvh;
    width: min(290px, calc(100vw - 48px));
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
    padding-top: max(14px, env(safe-area-inset-top));
    padding-bottom: max(20px, env(safe-area-inset-bottom));
    touch-action: pan-y pinch-zoom;
  }
  #sidebar > * { flex-shrink: 0; }
  .drawer-open .drawer-backdrop { touch-action: none; }
  .drawer-open .bottom-nav, .drawer-open #install-launcher, .drawer-open #update-launcher { visibility: hidden; pointer-events: none; }

  /* 16px avoids automatic focus magnification while allowing manual pinch zoom. */
  :root body input, :root body select, :root body textarea,
  :root body [contenteditable="true"] {
    font-size: 16px;
    line-height: 1.5;
  }
  .record-search { min-width: 0; }
  .record-search input { min-height: 44px; }
  .sectionhead:has(.record-search) { flex-wrap: wrap; }
  .sectionhead .record-search { flex: 1 1 220px; max-width: 100%; }
  .workflow-filters > label, .correction-filters > label { min-width: min(170px, 100%); }

  /* An opaque fixed layer avoids Safari's blur/compositing drift after zoom. */
  .bottom-nav {
    position: fixed;
    top: auto;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    margin: 0;
    background: #fff;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    padding-left: max(15px, env(safe-area-inset-left));
    padding-right: max(15px, env(safe-area-inset-right));
    padding-bottom: calc(8px + env(safe-area-inset-bottom));
  }
  .keyboard-open .bottom-nav,
  .keyboard-open #install-launcher,
  .keyboard-open #update-launcher { visibility: hidden; pointer-events: none; }
  header {
    padding-top: env(safe-area-inset-top);
    height: calc(70px + env(safe-area-inset-top));
    padding-left: max(14px, env(safe-area-inset-left));
    padding-right: max(14px, env(safe-area-inset-right));
  }
}
@media (max-width: 600px) {
  header { height: calc(66px + env(safe-area-inset-top)); }
}