/* Small-screen containment. Wider layouts keep their original dimensions. */
@media (max-width: 850px) {
  .workspace > aside, .travel-shell > aside {
    position: relative;
    max-width: 100%;
    padding-right: 2.75rem;
    scroll-padding-inline: 1.25rem 2.75rem;
    box-shadow: inset -24px 0 18px -22px rgba(18, 43, 64, .65);
  }
  .workspace > aside > button, .travel-shell > aside > button { flex: 0 0 auto; white-space: nowrap; }
  .workspace > aside > .trip-mini { display: block; flex: 0 0 auto; padding: 0; margin: 0; border: 0; }
  .workspace > aside > .trip-mini > :not([data-all]) { display: none; }
  .workspace [data-all] { padding: .9rem; white-space: nowrap; }
}

@media (max-width: 600px) {
  header { height: 64px; padding: 0 .75rem; gap: .6rem; }
  header nav { display: none; }
  .logo-wrap { min-width: 0; flex: 1; }
  .logo-wrap img { display: block; width: 108px; height: 42px; }
  .header-right { flex: 0 0 auto; gap: .4rem; min-width: 0; }
  .account-button { max-width: 74px; padding: .55rem .65rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  [data-logout] { padding: .62rem .7rem; white-space: nowrap; }

  .auth-shell { display: block; min-height: 100vh; background: #fff; }
  .brand-panel { display: block; padding: 12px 18px 0; min-height: 62px; background: #fff; }
  .brand-panel::after, .brand-panel > div { display: none; }
  .brand-panel img { display: block; width: 132px; height: 50px; object-fit: contain; object-position: left center; }
  .auth-card { min-height: 0; padding: 20px 22px 28px; justify-content: flex-start; }
  .auth-card form { margin: 1.4rem 0; }

  .page-title, .section-head, .studio-head { min-width: 0; gap: .8rem; flex-wrap: wrap; }
  .page-title > *, .section-head > *, .studio-head > * { min-width: 0; }
  .page, .workspace, .workspace > .studio, .travel-shell, .travel-shell > .studio { min-width: 0; width: 100%; }
  .actions { max-width: 100%; flex-wrap: wrap; }
  .record-list article, .wishlist-list article { min-width: 0; }
  .record-list article > *, .wishlist-list article > * { min-width: 0; }
  .provider-search, .provider-search input, .travel-grid, .travel-grid > *, .timeline article > * { min-width: 0; max-width: 100%; }

  [data-geocode-form] input::placeholder { font-size: .78rem; }
  .wishlist-list article { grid-template-columns: auto minmax(0, 1fr); }
  .place-title { align-items: flex-start; flex-wrap: wrap; }
  .session-list > div { display: grid; grid-template-columns: minmax(0, 1fr); }
  .session-list time { overflow-wrap: anywhere; }
  .account-modal { width: 100%; max-height: none; overflow: visible; }

  dialog { width: calc(100vw - 1.5rem); max-width: calc(100vw - 1.5rem); max-height: calc(100dvh - 1.5rem); margin: auto; overflow: hidden; }
  dialog > .modal-card { width: 100%; max-height: calc(100dvh - 1.5rem); padding: 1.25rem; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; }
  .modal-head { gap: .75rem; }
  .modal-head > div { min-width: 0; }
  .modal-head h2 { overflow-wrap: anywhere; }
}
