.mobile-menu-toggle, .chat-back { display: none; }
@media (max-width: 650px) {
  body { font-size: 15px; }
  .sidebar { padding: 14px 18px; background: #fff; }
  .sidebar .brand { font-size: 25px; }
  .sidebar nav {
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 30;
    display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px;
    margin: 0; padding: 8px 8px calc(8px + env(safe-area-inset-bottom));
    background: #fff; border-top: 1px solid var(--line);
    box-shadow: 0 -4px 22px #1823280a;
  }
  .sidebar nav a { display: none; position: relative; }
  .sidebar nav a[data-page="overview"],
  .sidebar nav a[data-page="conversations"],
  .sidebar nav a[data-page="leads"] {
    display: flex; flex-direction: column; justify-content: center;
    gap: 4px; padding: 7px 2px; font-size: 12px; min-height: 52px;
  }
  .sidebar nav a > span { display: block; font-size: 20px; }
  .sidebar nav b { position: absolute; top: 4px; right: 4px; margin: 0; }
  .mobile-menu-toggle {
    display: block; border: 0; border-radius: 7px;
    background: #f2f5f1; color: var(--green); font-weight: 600; min-height: 52px;
  }
  .mobile-menu-open .sidebar nav {
    grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: 75dvh; overflow: auto;
  }
  .mobile-menu-open .sidebar nav a {
    display: flex; flex-direction: row; gap: 8px; min-height: 48px; white-space: normal;
  }
  main { padding-bottom: 90px; }
  .content { padding: 18px 14px; }
  .topbar { height: auto; min-height: 48px; padding: 9px 16px; gap: 8px; }
  .top-right { flex-wrap: wrap; justify-content: flex-end; }
  .page-heading { gap: 10px; margin-bottom: 18px; }
  .page-heading h1 { font-size: 25px; }
  .page-heading p { line-height: 1.5; }
  input, textarea, select { font-size: 16px; }
  button, .primary, .secondary, .danger { min-height: 44px; }
  input, select { min-height: 44px; max-width: 100%; }
  .toolbar { display: grid; gap: 10px; }
  .filters { display: flex; overflow: auto; gap: 4px; }
  .filters button { flex: 1; white-space: nowrap; padding: 8px; font-size: 13px; }
  .split { display: block; }
  .conversation-list { max-height: none; border: 0; }
  .conversation-item { padding: 17px 15px; min-height: 96px; }
  .conversation-item p { font-size: 14px; line-height: 1.5; }
  .conversation-item strong { font-size: 15px; }
  #chat-pane { display: none; }
  .mobile-chat-open #chat-pane { display: block; }
  .mobile-chat-open .conversation-list,
  .mobile-chat-open .toolbar,
  .mobile-chat-open .page-heading { display: none; }
  .chat-back { display: inline-flex; padding: 6px 10px; font-size: 13px; }
  .chat-head {
    display: flex; gap: 10px; align-items: center; padding: 12px;
    position: sticky; top: 0; z-index: 3; background: white;
    border-bottom: 1px solid var(--line);
  }
  .chat-head > div { flex: 1; min-width: 0; }
  .chat-head h3 { overflow-wrap: anywhere; }
  #chat-mode { width: 100%; font-size: 14px; }
  .chat-messages {
    height: 45dvh; min-height: 210px; max-height: 600px;
    padding: 14px 10px; background: #f4f7f4;
  }
  .bubble { font-size: 15px; max-width: 94%; overflow-wrap: anywhere; }
  .bubble small { font-size: 11px; }
  .chat-compose { padding: 12px; }
  .chat-compose textarea { min-height: 84px; font-size: 16px; }
  .chat-compose .actions { flex-wrap: wrap; gap: 10px; }
  .chat-compose .actions small { flex-basis: 100%; }
  .chat-compose button { width: 100%; }
  .handoff-summary { padding: 12px; max-height: 130px; font-size: 13px; }
  .card, .card-body, .card-head, .row-body { min-width: 0; }
  .stats { gap: 8px; }
  .stat { padding: 13px; }
  .table-wrap { overflow-x: auto; }
  .business-picker { margin: 14px 0 0; max-width: none; }
  .business-picker select { width: 100%; }
  dialog { max-width: calc(100vw - 24px); padding: 20px; }
  .mobile-chat-open #global-banner,
  .mobile-chat-open footer,
  .mobile-chat-open #page > .muted { display: none; }
  .mobile-chat-open .sidebar { display: block; height: 0; padding: 0; border: 0; }
  .mobile-chat-open .sidebar > :not(nav) { display: none; }
  .mobile-chat-open .content { padding: 0; }
  .mobile-chat-open .split { border: 0; border-radius: 0; margin: 0; }
  .mobile-chat-open #chat-pane {
    display: flex; flex-direction: column;
    height: calc(100dvh - 132px - env(safe-area-inset-bottom));
  }
  .mobile-chat-open .chat-head,
  .mobile-chat-open .chat-compose,
  .mobile-chat-open .reply-owner { flex-shrink: 0; }
  .mobile-chat-open .handoff-summary { max-height: 85px; flex-shrink: 0; }
  .mobile-chat-open .chat-messages { height: auto; min-height: 80px; flex: 1; }
  .mobile-chat-open .chat-compose textarea { min-height: 52px; height: 62px; }
}