@media (max-width: 640px) {
      .ds-auth-gate {
        padding:
          max(var(--ds-space-4), env(safe-area-inset-top, 0px))
          max(var(--ds-space-4), env(safe-area-inset-right, 0px))
          max(var(--ds-space-4), env(safe-area-inset-bottom, 0px))
          max(var(--ds-space-4), env(safe-area-inset-left, 0px));
      }
      /* Keep sign-in card hug content — do not full-bleed like draft modals */
      .ds-auth-gate .ds-auth-gate-card {
        max-width: min(22rem, calc(100vw - 2rem));
        width: 100%;
      }
      .ds-auth-gate .ds-btn {
        min-height: 2.5rem;
        height: 2.5rem;
      }
      /* 16px to avoid iOS zoom; keep fixed control height */
      .ds-auth-gate-magic-link .ds-auth-gate-email {
        font-size: 16px;
        height: 2.5rem;
        min-height: 2.5rem;
        max-height: 2.5rem;
        padding: 0 0.75rem;
      }

      .ds-modal-layer {
        align-items: stretch;
        /* Safe-area already on body; keep modal inside visual viewport (keyboard) */
        padding:
          max(var(--ds-space-2), env(safe-area-inset-top, 0px))
          max(var(--ds-space-3), env(safe-area-inset-right, 0px))
          max(var(--ds-space-2), env(safe-area-inset-bottom, 0px))
          max(var(--ds-space-3), env(safe-area-inset-left, 0px));
        --ds-modal-max-h: var(--ds-vvh, 100dvh);
      }
      .ds-modal-card {
        max-height: calc(var(--ds-modal-max-h) - 0.5rem);
        max-width: 100%;
        min-width: 0;
        width: 100%;
        border-radius: var(--ds-radius-lg);
      }
      .ds-modal--wide,
      .ds-modal--review,
      .ds-modal--confirm,
      .ds-modal--form {
        max-width: 100%;
      }
      .ds-modal-header {
        flex-shrink: 0;
        padding: var(--ds-space-4) var(--ds-space-4) var(--ds-space-2);
      }
      .ds-modal-body {
        padding: var(--ds-space-4);
        overflow-x: hidden;
      }
      .ds-modal-footer {
        padding:
          var(--ds-space-3)
          var(--ds-space-4)
          max(var(--ds-space-4), env(safe-area-inset-bottom, 0px));
      }
      /* New snapshot: only asset/liability tables scroll horizontally — not date/RE */
      #new-snapshot-modal .ds-modal-card,
      #new-snapshot-modal .ds-modal-body,
      #new-snapshot-modal #draft-editor,
      #new-snapshot-modal .ds-draft-section,
      #new-snapshot-modal #draft-re-panel,
      #new-snapshot-modal #draft-re-body {
        min-width: 0;
        max-width: 100%;
      }
      #new-snapshot-modal .ds-modal-field,
      #new-snapshot-modal #new-date {
        max-width: 100%;
      }
      .ds-modal-footer-actions {
        flex-direction: column-reverse;
        align-items: stretch;
        width: 100%;
      }
      .ds-modal-footer-actions .ds-btn {
        width: 100%;
      }
      .ds-review-stats {
        padding: var(--ds-space-3) var(--ds-space-4) var(--ds-space-4);
      }

}