/* Responsive presentation only. Desktop rules at min-width 1200px stay in styles.css. */

.mobile-bottom-nav,
.shell-agent-toggle,
.shell-drawer-scrim,
.shell-sheet-bar,
.mobile-more-layer { display:none; }

@media (min-width:768px) and (max-width:1199.98px) {
  html,body { overflow-x:clip; }
  .dashboard { display:grid; grid-template-columns:72px minmax(0,1fr); overflow-x:clip; }
  .dashboard-mobile-header { display:none; }
  .dashboard-sidebar {
    width:72px;
    position:sticky;
    top:0;
    left:auto;
    transform:none;
    padding:16px 8px 12px;
    z-index:12;
  }
  .dashboard-brand-row { flex-direction:column; justify-content:center; padding:0; gap:6px; }
  .dashboard-brand-row .brand > span:not(.brand-mark),
  .dashboard-compose span,
  .dashboard-sidebar-section h2,
  .dashboard-nav-item em,
  .dashboard-profile > div { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
  .dashboard-brand-row > button { display:grid; width:32px; height:32px; color:#c8c3d4; }
  .dashboard-profile > button { display:none; }
  .dashboard-compose { width:44px; min-height:40px; margin:16px auto 0; padding:0; }
  .dashboard-nav-item { justify-content:center; padding:0; gap:0; }
  .dashboard-nav-item span { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
  .dashboard-profile { grid-template-columns:34px; justify-content:center; padding-left:0; padding-right:0; }
  .dashboard-content { min-width:0; padding:12px 12px 16px; }
  .workspace-header { display:flex; flex-wrap:wrap; height:auto; min-height:56px; }
  .workspace-zone-command { flex:1 1 220px; }
  .workspace-zone-command .workspace-search { width:100%; max-width:none; }
  .workspace-account div,
  .workspace-account > svg { display:none; }
  .mailbox-stage { grid-template-columns:minmax(0,1fr); }
  .mailbox-rail {
    display:flex;
    position:fixed;
    top:0;
    right:0;
    bottom:0;
    width:min(320px,86vw);
    min-width:0;
    max-width:320px;
    z-index:45;
    transform:translateX(105%);
    transition:transform .25s ease;
    overflow:auto;
    background:var(--canvas);
    padding:12px;
    box-shadow:-12px 0 40px rgba(8,8,33,.16);
  }
  .dashboard[data-sheet="agent"] .mailbox-rail,
  .dashboard[data-sheet="calendar"] .mailbox-rail,
  .dashboard[data-sheet="notes"] .mailbox-rail { transform:none; }
  .mailbox-notes-pane { display:none; }
  .mailbox-rail.shell-notes .mailbox-notes-pane { display:flex; min-height:0; max-height:none; }
  .shell-agent-toggle {
    width:36px;
    height:36px;
    display:grid;
    place-items:center;
    border:1px solid var(--agent-border);
    border-radius:var(--radius-sm);
    background:var(--agent-soft);
    color:var(--agent);
  }
  .dashboard[data-sheet="agent"] .shell-drawer-scrim,
  .dashboard[data-sheet="calendar"] .shell-drawer-scrim,
  .dashboard[data-sheet="notes"] .shell-drawer-scrim {
    display:block;
    position:fixed;
    inset:0;
    z-index:44;
    border:0;
    background:#08082155;
  }
  .shell-sheet-bar {
    display:flex;
    align-items:center;
    gap:8px;
    min-height:44px;
    margin-bottom:8px;
  }
  .shell-sheet-bar button {
    width:32px;
    height:32px;
    display:grid;
    place-items:center;
    border:0;
    border-radius:8px;
    background:transparent;
    color:#4a4652;
  }
  .shell-sheet-bar strong { font-size:14px; color:#171424; }
  .compose-dock { right:12px !important; }
  .compose-window {
    width:min(640px,calc(100vw - 96px));
    min-width:0;
    max-width:calc(100vw - 96px);
    height:min(640px,calc(100vh - 32px));
  }
  .compose-window.expanded {
    width:min(900px,calc(100vw - 48px));
    min-width:0;
    max-width:calc(100vw - 48px);
    height:min(78vh,calc(100vh - 32px));
  }

  .dashboard:has(.dashboard-sidebar.expanded) { grid-template-columns:228px minmax(0,1fr); }
  .dashboard-sidebar.expanded {
    width:228px;
    padding:var(--space-4) var(--space-3) var(--space-3);
  }
  .dashboard-sidebar.expanded .dashboard-brand-row { flex-direction:row; justify-content:space-between; padding:0 6px 2px; }
  .dashboard-sidebar.expanded .dashboard-brand-row .brand > span:not(.brand-mark),
  .dashboard-sidebar.expanded .dashboard-compose span,
  .dashboard-sidebar.expanded .dashboard-sidebar-section h2,
  .dashboard-sidebar.expanded .dashboard-nav-item span,
  .dashboard-sidebar.expanded .dashboard-profile > div {
    position:static;
    width:auto;
    height:auto;
    clip:auto;
    overflow:visible;
    margin:0;
    white-space:nowrap;
  }
  .dashboard-sidebar.expanded .dashboard-nav-item em {
    position:static;
    width:auto;
    min-width:18px;
    height:18px;
    clip:auto;
    overflow:visible;
    margin-left:auto;
    padding:0 6px;
  }
  .dashboard-sidebar.expanded .dashboard-sidebar-section h2 { margin:0 0 var(--space-2); padding:0 var(--space-2); }
  .dashboard-sidebar.expanded .dashboard-compose {
    width:calc(100% - 8px);
    margin:var(--space-4) var(--space-1) 0;
    padding:0 var(--space-4);
  }
  .dashboard-sidebar.expanded .dashboard-nav-item { justify-content:flex-start; padding:0 var(--space-3); gap:var(--space-3); }
  .dashboard-sidebar.expanded .dashboard-nav-item span { position:static; width:auto; height:auto; clip:auto; overflow:visible; flex:1; min-width:0; }
  .dashboard-sidebar.expanded .dashboard-profile {
    grid-template-columns:34px minmax(0,1fr) 31px 31px;
    padding-left:5px;
    padding-right:5px;
  }
  .dashboard-sidebar.expanded .dashboard-profile > button { display:grid; }
}

@media (min-width:1200px) {
  .dashboard { grid-template-columns:72px minmax(0,1fr); }
  .dashboard:has(.dashboard-sidebar.expanded) { grid-template-columns:228px minmax(0,1fr); }
  .dashboard-sidebar {
    width:72px;
    padding:16px 8px 12px;
  }
  .dashboard-brand-row { flex-direction:column; justify-content:center; padding:0; gap:6px; }
  .dashboard-brand-row .brand > span:not(.brand-mark),
  .dashboard-compose span,
  .dashboard-sidebar-section h2,
  .dashboard-nav-item em,
  .dashboard-profile > div { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
  .dashboard-brand-row > button { display:grid; width:32px; height:32px; color:#c8c3d4; }
  .dashboard-profile > button { display:none; }
  .dashboard-compose { width:44px; min-height:40px; margin:16px auto 0; padding:0; }
  .dashboard-nav-item { justify-content:center; padding:0; gap:0; }
  .dashboard-nav-item span { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
  .dashboard-profile { grid-template-columns:34px; justify-content:center; padding-left:0; padding-right:0; }
  .dashboard-sidebar.expanded {
    width:228px;
    padding:var(--space-4) var(--space-3) var(--space-3);
  }
  .dashboard-sidebar.expanded .dashboard-brand-row { flex-direction:row; justify-content:space-between; padding:0 6px 2px; }
  .dashboard-sidebar.expanded .dashboard-brand-row .brand > span:not(.brand-mark),
  .dashboard-sidebar.expanded .dashboard-compose span,
  .dashboard-sidebar.expanded .dashboard-sidebar-section h2,
  .dashboard-sidebar.expanded .dashboard-nav-item span,
  .dashboard-sidebar.expanded .dashboard-profile > div {
    position:static;
    width:auto;
    height:auto;
    clip:auto;
    overflow:visible;
    margin:0;
    white-space:nowrap;
  }
  .dashboard-sidebar.expanded .dashboard-nav-item em {
    position:static;
    width:auto;
    min-width:18px;
    height:18px;
    clip:auto;
    overflow:visible;
    margin-left:auto;
    padding:0 6px;
  }
  .dashboard-sidebar.expanded .dashboard-sidebar-section h2 { margin:0 0 var(--space-2); padding:0 var(--space-2); }
  .dashboard-sidebar.expanded .dashboard-compose {
    width:calc(100% - 8px);
    margin:var(--space-4) var(--space-1) 0;
    padding:0 var(--space-4);
  }
  .dashboard-sidebar.expanded .dashboard-nav-item { justify-content:flex-start; padding:0 var(--space-3); gap:var(--space-3); }
  .dashboard-sidebar.expanded .dashboard-nav-item span { position:static; width:auto; height:auto; clip:auto; overflow:visible; flex:1; min-width:0; }
  .dashboard-sidebar.expanded .dashboard-profile {
    grid-template-columns:34px minmax(0,1fr) 31px 31px;
    padding-left:5px;
    padding-right:5px;
  }
  .dashboard-sidebar.expanded .dashboard-profile > button { display:grid; }
}

@media (max-width:767.98px) {
  html,body { overflow-x:clip; }
  .dashboard { display:block; min-height:100vh; overflow-x:clip; }
  .dashboard-mobile-header {
    height:56px;
    padding:0 16px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    position:sticky;
    top:0;
    z-index:40;
    border-bottom:1px solid var(--line);
    background:#fffefd;
  }
  .dashboard-mobile-header .brand { font-size:18px; gap:8px; }
  .dashboard-mobile-header .brand-mark { width:30px; height:28px; }
  .dashboard-mobile-header > button { width:32px; height:32px; }
  .dashboard-sidebar {
    width:min(320px,86vw);
    height:100vh;
    max-height:100vh;
    position:fixed;
    top:0;
    left:0;
    z-index:70;
    transform:translateX(-105%);
    transition:transform .25s ease;
  }
  .dashboard-sidebar.open { transform:translateX(0); }
  .dashboard-brand-row > button { display:grid; }
  .dashboard-scrim { display:block; position:fixed; inset:0; z-index:65; border:0; background:#08082155; }
  .dashboard-content {
    min-width:0;
    padding:0 0 calc(76px + env(safe-area-inset-bottom));
  }
  .dashboard-content > *:not(.mailbox-workspace) { padding:16px 16px 0; }
  .dashboard-content h1 { font-size:28px; letter-spacing:-0.03em; overflow-wrap:anywhere; }
  .human-handoff-page { max-width:none; margin:0; padding:0; }
  .handoff-page-title,
  .human-handoff-head h1.handoff-page-title { white-space:normal; font-size:22px; }
  .handoff-toolbar-row { align-items:stretch; flex-direction:column; }
  .handoff-toolbar-row .handoff-btn.primary { align-self:flex-start; }
  .human-handoff-card-body {
    grid-template-areas:"avatar identity" "scope scope" "actions actions";
    grid-template-columns:32px minmax(0,1fr);
    row-gap:8px;
  }
  .human-handoff-card-actions { justify-self:start; }
  .handoff-drawer,.handoff-test-modal,.people-drawer { width:100%; max-width:100%; }

  .mailbox-workspace { gap:0; }
  .workspace-header {
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:8px;
    min-height:0;
    margin:12px 16px 8px;
    padding:0;
    background:transparent;
    border-radius:0;
  }
  .workspace-zone-command { padding:0; }
  .workspace-zone-command .workspace-search { width:100%; max-width:none; height:42px; }
  .workspace-search-kbd,.workspace-search kbd { display:none; }
  .workspace-zone-account { display:none; }
  .workspace-zone-actions { width:100%; padding:0; justify-content:space-between; }
  .mailbox-shell { margin-top:0; border-radius:0; }
  .mailbox-stage { display:block; }
  .mailbox-main-column { min-width:0; }
  .mailbox-list-bar { min-height:40px; padding:0 8px; }
  .mailbox-pagination-range { font-size:11px; }
  .mailbox-categories {
    display:flex;
    flex-wrap:nowrap;
    overflow-x:auto;
    white-space:nowrap;
    scrollbar-width:none;
  }
  .mailbox-categories::-webkit-scrollbar { display:none; }
  .mailbox-categories button { flex:0 0 auto; }
  .mailbox-filters { grid-template-columns:1fr; }
  .mailbox-selection-bar { display:flex; flex-wrap:wrap; }
  .mailbox-selection-actions { overflow-x:auto; flex-wrap:nowrap; max-width:100%; }
  .mailbox-rows { max-height:none; }
  .mailbox-row {
    height:auto;
    min-height:66px;
    max-height:none;
    padding:9px 12px;
    grid-template-columns:30px minmax(0,1fr) auto;
    grid-template-rows:auto auto auto;
    column-gap:10px;
    row-gap:1px;
    align-items:center;
    overflow:hidden;
  }
  .mailbox-check { position:absolute; width:1px; height:1px; margin:0; overflow:hidden; opacity:0; }
  .mailbox-rows.selecting .mailbox-row { grid-template-columns:16px 30px minmax(0,1fr) auto; }
  .mailbox-rows.selecting .mailbox-check {
    position:static;
    width:16px;
    height:16px;
    opacity:1;
    grid-column:1;
    grid-row:1 / span 3;
  }
  .mailbox-avatar { grid-column:1; grid-row:1 / span 3; align-self:center; width:30px; height:30px; }
  .mailbox-rows.selecting .mailbox-avatar { grid-column:2; }
  .mailbox-sender-wrap { grid-column:2; grid-row:1; align-self:end; }
  .mailbox-rows.selecting .mailbox-sender-wrap { grid-column:3; }
  .mailbox-sender { font-size:12px; font-weight:600; }
  .mailbox-subject-line {
    grid-column:2;
    grid-row:2;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    white-space:normal;
    overflow:hidden;
  }
  .mailbox-rows.selecting .mailbox-subject-line { grid-column:3; }
  .mailbox-subject { font-size:11.5px; font-weight:550; }
  .mailbox-preview { display:block; max-width:100%; font-size:10.5px; white-space:nowrap; }
  .mailbox-preview-sep { display:none; }
  .mailbox-row-labels {
    grid-column:2;
    grid-row:3;
    min-width:0;
    justify-content:flex-start;
    overflow:hidden;
  }
  .mailbox-rows.selecting .mailbox-row-labels { grid-column:3; }
  .mailbox-row-labels:empty { display:none; }
  .mailbox-attachment-icon.empty { display:none; }
  .mailbox-attachment-icon { grid-column:3; grid-row:2; width:16px; height:16px; }
  .mailbox-rows.selecting .mailbox-attachment-icon { grid-column:4; }
  .mailbox-row-rail { grid-column:3; grid-row:1; height:auto; align-self:start; }
  .mailbox-rows.selecting .mailbox-row-rail { grid-column:4; }
  .mailbox-time { font-size:9.5px; opacity:1; }
  .mailbox-row:hover .mailbox-time,
  .mailbox-row:focus-within .mailbox-time,
  .mailbox-row.selected .mailbox-time { opacity:1; }
  .mailbox-hover-actions { display:none; }
  .mailbox-star { grid-column:3; grid-row:3; width:28px; height:28px; align-self:end; }
  .mailbox-rows.selecting .mailbox-star { grid-column:4; }

  .mailbox-rail { display:none; }
  .dashboard[data-sheet="agent"] .mailbox-rail,
  .dashboard[data-sheet="calendar"] .mailbox-rail,
  .dashboard[data-sheet="notes"] .mailbox-rail {
    display:flex;
    position:fixed;
    top:56px;
    left:0;
    right:0;
    bottom:calc(64px + env(safe-area-inset-bottom));
    width:auto;
    min-width:0;
    max-width:none;
    z-index:35;
    transform:none;
    overflow:auto;
    background:var(--canvas);
    padding:12px 16px 16px;
  }
  .dashboard[data-sheet="agent"] .mailbox-main-column,
  .dashboard[data-sheet="agent"] .workspace-header,
  .dashboard[data-sheet="calendar"] .mailbox-main-column,
  .dashboard[data-sheet="calendar"] .workspace-header,
  .dashboard[data-sheet="notes"] .mailbox-main-column,
  .dashboard[data-sheet="notes"] .workspace-header { display:none; }
  .mailbox-notes-pane { display:none; min-height:0; max-height:none; }
  .mailbox-rail.shell-notes .agent-panel { display:none; }
  .mailbox-rail.shell-notes .mailbox-notes-pane { display:flex; width:100%; }
  .shell-sheet-bar {
    display:flex;
    align-items:center;
    gap:8px;
    min-height:40px;
    margin:0 0 8px;
  }
  .shell-sheet-bar button {
    width:32px;
    height:32px;
    display:grid;
    place-items:center;
    border:0;
    border-radius:8px;
    background:transparent;
    color:#4a4652;
  }
  .shell-sheet-bar strong { font:650 16px/1.2 "DM Sans"; color:#171424; }
  .agent-panel { overflow:visible; }
  .mail-detail-toolbar { overflow-x:auto; }

  .mobile-bottom-nav {
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:50;
    height:calc(64px + env(safe-area-inset-bottom));
    padding:4px 6px env(safe-area-inset-bottom);
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    align-items:center;
    background:#fff;
    border-top:1px solid var(--line);
  }
  .mobile-bottom-nav button {
    min-width:0;
    min-height:44px;
    padding:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:2px;
    border:0;
    background:transparent;
    color:#6f6b76;
    font-size:10px;
    font-weight:600;
  }
  .mobile-bottom-nav button.active { color:var(--coral); }
  .mobile-bottom-plus {
    width:36px;
    height:28px;
    display:grid;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(180deg,#ff806d 0%,#ff5c55 100%);
    box-shadow:0 4px 14px rgba(255,88,72,.24);
  }
  .mobile-bottom-compose { color:#c95945; }
  body.compose-open .mobile-bottom-nav { display:none; }

  .mobile-more-layer {
    position:fixed;
    inset:0;
    z-index:60;
    display:flex;
    align-items:flex-end;
  }
  .mobile-more-scrim { position:absolute; inset:0; border:0; background:#08082155; }
  .mobile-more-sheet {
    position:relative;
    width:100%;
    max-height:min(78vh,640px);
    overflow:auto;
    padding:8px 16px calc(16px + env(safe-area-inset-bottom));
    border-radius:16px 16px 0 0;
    background:#fff;
    box-shadow:0 -12px 40px rgba(8,8,33,.16);
  }
  .mobile-more-head,.mobile-more-account,.mobile-more-sheet > button {
    display:flex;
    align-items:center;
  }
  .mobile-more-head { justify-content:space-between; min-height:44px; }
  .mobile-more-head strong { font-size:16px; color:#171424; }
  .mobile-more-head button,.mobile-more-account button {
    border:0;
    background:transparent;
    color:#6f6b76;
    font-size:12px;
    font-weight:600;
  }
  .mobile-more-account {
    gap:10px;
    margin-bottom:8px;
    padding-bottom:10px;
    border-bottom:1px solid var(--line);
  }
  .mobile-more-account > span {
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border-radius:11px;
    background:linear-gradient(180deg,#ff9a82,#ff6f57);
    color:#2a2038;
    font-size:11px;
    font-weight:700;
  }
  .mobile-more-account div { min-width:0; flex:1; display:grid; }
  .mobile-more-account strong,.mobile-more-account small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .mobile-more-account strong { font-size:13px; color:#171424; }
  .mobile-more-account small { color:#8d8792; font-size:11px; }
  .mobile-more-sheet > p {
    margin:12px 0 4px;
    color:#97929a;
    font-size:10px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
  }
  .mobile-more-sheet > button {
    width:100%;
    min-height:42px;
    gap:10px;
    border:0;
    border-radius:10px;
    background:transparent;
    color:#3d3948;
    font-size:14px;
    font-weight:600;
    text-align:left;
  }
  .mobile-more-sheet > button:hover { background:#faf5f2; }

  .compose-dock {
    position:fixed;
    inset:0;
    right:0 !important;
    bottom:0;
    width:100%;
    z-index:80;
    align-items:stretch;
  }
  .compose-dock-expanded { width:100%; height:100%; }
  .compose-window,
  .compose-window.docked,
  .compose-window.expanded {
    position:fixed;
    inset:0;
    left:0;
    top:0;
    right:0;
    bottom:0;
    transform:none;
    width:100%;
    min-width:0;
    max-width:none;
    height:100dvh;
    border-radius:0;
    z-index:80;
  }
  .dashboard-notice { left:16px; right:16px; bottom:calc(76px + env(safe-area-inset-bottom)); }
}

@media (max-width:1199.98px) {
  .mailbox-rail.shell-calendar .agent-panel-hello,
  .mailbox-rail.shell-calendar .agent-stat-grid,
  .mailbox-rail.shell-calendar .agent-quick,
  .mailbox-rail.shell-calendar .agent-attention-block,
  .mailbox-rail.shell-calendar .agent-deadlines,
  .mailbox-rail.shell-calendar .agent-panel-note,
  .mailbox-rail.shell-calendar .agent-loading-block,
  .mailbox-rail.shell-calendar .agent-caught-up,
  .mailbox-rail.shell-calendar .agent-ready-card,
  .mailbox-rail.shell-calendar .agent-email-context,
  .mailbox-rail.shell-calendar .agent-insight,
  .mailbox-rail.shell-calendar .mailbox-notes-pane,
  .mailbox-rail.shell-agent .mailbox-notes-pane { display:none; }
  .mailbox-rail.shell-notes .agent-panel { display:none; }
}