/* Narrow-screen controls and navigation; desktop layouts retain their existing rules. */
@media (max-width: 850px) {
  .field input, .field select, .field textarea,
  .date-fields .field input, .calendar-toolbar input,
  .g-profile input, .g-composer textarea, .security-card input,
  .maison-discovery .bm-search input, .maison-discovery .bm-search select {
    font-size: 16px;
    min-height: 44px;
  }

  button, .primary, .outline, .danger { min-width: 44px; min-height: 44px; }
  .main-header, .header-actions { min-width: 0; }
  .main-header nav {
    flex-wrap: nowrap;
    overflow-x: auto;
    max-width: 100%;
    min-width: 0;
    padding-bottom: 6px;
    scrollbar-width: thin;
  }
  .main-header nav > * { flex: 0 0 auto; white-space: nowrap; }
  .header-actions { flex-wrap: wrap; }
  .panel-card h2, .panel-strip > span, .g-profile-card h1,
  .g-wishlist h3, .g-saved h3 { overflow-wrap: anywhere; }

  .calendar-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 44px 44px;
    gap: 6px;
  }
  .calendar-layout { grid-template-columns: minmax(0, 1fr); }
  .calendar-scroll { max-height: 450px; min-height: 280px; }
  .booking-editor { border-left: 0; border-top: 1px solid #dfe7ef; max-height: none; }
  .calendar-toolbar input { width: 100%; min-width: 0; }
  .calendar-toolbar button { min-width: 44px; padding: 8px; }
  .calendar-grid {
    grid-template-columns: 140px repeat(14, minmax(64px, 1fr));
    min-width: 1036px;
  }
  .room-label { min-width: 0; padding: 12px 10px; }
  .room-label strong { overflow-wrap: anywhere; }
  .room-label .room-icon { display: none; }
  .colors { flex-wrap: wrap; }
  .colors button { width: 44px; height: 44px; flex: 0 0 44px; }

  .g-nav {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 4px;
    padding: 0 12px;
  }
  .g-nav button { min-width: 0; min-height: 48px; font-size: 14px; padding: 14px 2px; }
  .g-trip-card > div { min-width: 0; overflow-wrap: anywhere; }
  .g-trip-card > span { flex-shrink: 0; }
  .g-chat-booking { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
  .g-title { flex-wrap: wrap; }
  .g-profile, .g-settings > *, .finance-stats > div { min-width: 0; }
  .finance-stats strong { overflow-wrap: anywhere; }

  dialog { padding-top: 44px; }
  .dialog-close { min-width: 44px; min-height: 44px; top: 4px; right: 4px; }
  .amenity-options label { display: inline-flex; min-height: 44px; align-items: center; gap: 8px; }
  .amenity-options input { width: 18px; height: 18px; }
  .mfa-key { display: block; overflow-wrap: anywhere; }
  .site-dns-records > div { grid-template-columns: 30px minmax(0, 1fr); }
}

@media (max-width: 400px) {
  .calendar-toolbar { grid-template-columns: minmax(0, 1fr) 44px 44px; }
  .calendar-toolbar input { grid-column: 1 / -1; }
}
