/* cabinet-mobile.css v2  phone + narrow CSS viewport (Safari desktop mode safe) */
html, body, #root {
  height: 100%;
  max-width: 100vw;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* Primary: CSS viewport width  works in Chrome/Safari narrow + most phones */
@media (max-width: 920px) {
  .cab-shell, .alice-shell, .sa-alice {
    height: 100dvh !important;
    max-height: 100dvh !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  .cab-atmosphere { display: none !important; }
  .cab-body { grid-template-columns: 1fr !important; min-height: 0 !important; }
  .cab-aside { display: none !important; }
  .cab-header {
    grid-template-columns: 1fr auto !important;
    gap: 8px !important;
    padding: 10px 12px !important;
  }
  .cab-top-tabs {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    gap: 6px !important;
    padding: 0 8px 8px !important;
    justify-content: flex-start !important;
  }

  /* Auth card: full bleed */
  .card-quantum,
  .card-quantum.max-w-md,
  .max-w-md,
  .sa-gate,
  .sa-gate-card {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    border-radius: 0 !important;
    min-height: 100dvh !important;
    box-sizing: border-box !important;
    padding: 18px 16px calc(20px + env(safe-area-inset-bottom, 0px)) !important;
  }
  .cab-shell > .relative.z-\[1\],
  .cab-shell .relative.z-\[1\].grid {
    padding: 0 !important;
    align-items: stretch !important;
  }
  .card-quantum input,
  .card-quantum button,
  .sa-gate input,
  .sa-gate button,
  input[type="text"],
  input[type="password"],
  input[type="email"],
  textarea,
  button {
    font-size: 16px !important;
    min-height: 44px !important;
  }
  .card-quantum label,
  .sa-gate label {
    font-size: 14px !important;
    font-weight: 500 !important;
  }

  /* Chat shell: kill desktop rail (including broken 860px 42vh rule) */
  .alice-shell { flex-direction: column !important; }
  .alice-side,
  .alice-shell.is-collapsed .alice-side {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    max-height: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
  }
  .alice-mobile-bar {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 40 !important;
    width: 100% !important;
    padding: 10px 12px !important;
    padding-top: calc(10px + env(safe-area-inset-top, 0px)) !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
    background: #0c0e12f5 !important;
  }
  .alice-main, .sa-alice-main {
    width: 100% !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
  }
  .alice-chat, .sa-alice .alice-chat, .sa-alice .sa-work {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    min-height: 0 !important;
    width: 100% !important;
  }
  .alice-messages, .sa-alice .alice-messages, .sa-alice .sa-messages {
    flex: 1 1 auto !important;
    min-height: 120px !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    padding: 12px 14px !important;
    font-size: 16px !important;
    line-height: 1.45 !important;
  }
  .alice-composer-wrap {
    width: 100% !important;
    padding: 8px 12px calc(12px + env(safe-area-inset-bottom, 0px)) !important;
    align-items: stretch !important;
    z-index: 30 !important;
  }
  .alice-composer {
    width: 100% !important;
    max-width: none !important;
    border-radius: 18px !important;
  }
  .alice-composer textarea,
  .alice-composer input {
    font-size: 16px !important;
  }

  /* Drawer: when open, side becomes fullscreen overlay */
  .alice-shell.is-drawer-open .alice-side {
    display: flex !important;
    position: fixed !important;
    inset: 0 auto 0 0 !important;
    width: min(88vw, 320px) !important;
    max-width: 320px !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    z-index: 60 !important;
    background: #0c0e12 !important;
    border-right: 1px solid rgba(255,255,255,.1) !important;
    padding: 12px !important;
    overflow: auto !important;
  }
  .alice-drawer-scrim {
    display: block !important;
  }
}

/* Force via html.cab-phone (JS)  Safari Request Desktop Website */
html.cab-phone .cab-atmosphere { display: none !important; }
html.cab-phone .card-quantum,
html.cab-phone .card-quantum.max-w-md,
html.cab-phone .max-w-md,
html.cab-phone .sa-gate,
html.cab-phone .sa-gate-card {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  border-radius: 0 !important;
  min-height: 100dvh !important;
  box-sizing: border-box !important;
  padding: 18px 16px calc(20px + env(safe-area-inset-bottom, 0px)) !important;
}
html.cab-phone .cab-shell .relative.z-\[1\].grid { padding: 0 !important; align-items: stretch !important; }
html.cab-phone .card-quantum input,
html.cab-phone .card-quantum button,
html.cab-phone input[type="text"],
html.cab-phone input[type="password"],
html.cab-phone button {
  font-size: 16px !important;
  min-height: 44px !important;
}
html.cab-phone .alice-shell { flex-direction: column !important; height: 100dvh !important; }
html.cab-phone .alice-side,
html.cab-phone .alice-shell.is-collapsed .alice-side {
  display: none !important;
  width: 0 !important;
  max-height: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  border: 0 !important;
}
html.cab-phone .alice-shell.is-drawer-open .alice-side {
  display: flex !important;
  position: fixed !important;
  inset: 0 auto 0 0 !important;
  width: min(88vw, 320px) !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  z-index: 60 !important;
  background: #0c0e12 !important;
  padding: 12px !important;
  overflow: auto !important;
}
html.cab-phone .alice-mobile-bar {
  display: flex !important;
  width: 100% !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 40 !important;
  padding: 10px 12px !important;
  padding-top: calc(10px + env(safe-area-inset-top, 0px)) !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
  background: #0c0e12f5 !important;
}
html.cab-phone .alice-main,
html.cab-phone .sa-alice-main {
  width: 100% !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
}
html.cab-phone .alice-composer-wrap {
  width: 100% !important;
  padding: 8px 12px calc(12px + env(safe-area-inset-bottom, 0px)) !important;
}
html.cab-phone .alice-composer { width: 100% !important; max-width: none !important; }
/* Gate centering wrapper  full bleed on phone */
@media (max-width: 920px) {
  .cab-shell .grid.place-items-center {
    padding: 0 !important;
    place-items: stretch stretch !important;
    align-items: stretch !important;
  }
}
html.cab-phone .cab-shell .grid.place-items-center {
  padding: 0 !important;
  place-items: stretch stretch !important;
  align-items: stretch !important;
}