/* ============================================================
   Saptha — small additive mobile refinements.
   The app's OWN stylesheet already lays out the header, nav and
   card grids responsively (grid-based, many breakpoints). So this
   file stays intentionally MINIMAL and must never re-lay-out the
   header/nav/grids — that only fights the existing rules.
   ============================================================ */

/* Media never forces the viewport wider than the screen. */
img,
video,
canvas,
svg {
  max-width: 100%;
}

/* Phones: give the report/detail modals room instead of a tiny centred box. */
@media (max-width: 680px) {

  .ref-acct-modal>section,
  .ref-preview-panel,
  .ref-sr-modal-panel,
  .ref-export-dialog,
  .ref-acct-chooser-card {
    width: 96vw !important;
    max-width: 96vw !important;
    max-height: 92dvh !important;
  }
}

/* Wide content scrolls inside its own box, never the page. */
.ref-xlsp-tablewrap {
  overflow-x: auto;
}

/* Profile menu footer: lock + sign-out side by side. */
.ref-profile-foot {
  display: flex;
  gap: 8px;
}

.ref-profile-foot>button {
  flex: 1;
}

.ref-profile-foot .ref-profile-lock {
  color: var(--ref-ink, #e7e9ee);
}