@media (max-width: 960px) {
  body.nav-scroll-lock {
    overflow: hidden;
  }

  .app-layout {
    --layout-sidebar-width: 0;
  }

  .side-nav {
    top: 0;
    left: 0;
    bottom: 0;
    width: min(84vw, 320px);
    transform: translateX(calc(-100% - 12px));
    z-index: 120;
    padding: 10px 8px 14px;
    box-shadow: 0 14px 38px rgba(8, 20, 38, 0.28);
  }

  .app-layout.is-nav-open .side-nav {
    transform: translateX(0);
  }

  .side-overlay {
    position: fixed;
    inset: 0;
    display: block;
    background: rgba(9, 17, 31, 0.48);
    backdrop-filter: blur(1px);
    z-index: 110;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
  }

  .app-layout.is-nav-open .side-overlay {
    opacity: 1;
    pointer-events: auto;
  }

  .content-area {
    margin-left: 0;
  }

  .side-footer {
    position: static;
    bottom: auto;
    margin-top: auto;
    padding-top: 12px;
  }

  .app-topbar {
    left: 0;
    right: 0;
    min-height: auto;
    z-index: 80;
    padding: 12px 14px;
  }

  .app-layout .app-topbar {
    position: sticky;
    top: 0;
    left: 0;
  }

  .nav-toggle-icon {
    display: none;
  }

  .app-layout .nav-toggle-icon-collapse,
  .app-layout .nav-toggle-icon-expand {
    display: none;
  }

  .app-layout .nav-toggle-icon-menu {
    display: inline-flex;
  }

  .app-layout.is-nav-open .nav-toggle-icon-menu {
    display: none;
  }

  .app-layout.is-nav-open .nav-toggle-icon-close {
    display: inline-flex;
  }

  .topbar-shell {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }

  .topbar-left {
    align-items: center;
    gap: 10px;
  }

  .topbar-head h2 {
    font-size: 18px;
  }

  .topbar-head p {
    margin-top: 3px;
    font-size: 12px;
  }

  .top-actions {
    justify-content: flex-start;
  }

  .top-actions .btn-split {
    max-width: 100%;
  }

  .top-actions .btn {
    min-height: 38px;
  }

  .container {
    padding: calc(var(--shell-topbar-height) + 12px) 12px 44px;
  }

  .app-layout .container {
    padding-top: 12px;
  }

  .auth-card {
    margin: 20px auto;
  }

  .auth-login-head h2 {
    font-size: 22px !important;
  }

  .auth-method-switch {
    gap: 4px;
    padding: 4px;
  }

  .auth-method-tab {
    padding: 9px 10px;
    font-size: 11px;
  }

  .auth-method-panel {
    padding: 12px;
  }

  .auth-social-grid {
    gap: 8px;
  }

  .auth-social-btn {
    width: 54px;
    height: 54px;
    padding: 13px;
  }

  .hero-card {
    flex-direction: column;
    align-items: flex-start;
  }

  .agent-tile,
  .col6,
  .col4,
  .col8,
  .col3 {
    grid-column: span 12;
  }

  .profile-grid {
    grid-template-columns: 1fr;
  }

  .create-mode-body {
    grid-template-columns: 1fr;
  }

  .create-mode-switch {
    width: 100%;
  }

  .create-mode-pill {
    flex: 1;
    text-align: center;
  }

  .profile-aside {
    order: -1;
  }

  .avatar-preview-shell {
    max-width: 180px;
    margin: 0 auto 10px;
  }

  .avatar-actions-row {
    grid-template-columns: 1fr;
  }

  .avatar-secondary-btn {
    width: 100%;
  }

  .footerbar,
  .wizard-footer,
  .wizard-nav-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .footerbar .row,
  .wizard-footer .row,
  .wizard-nav-actions .row {
    width: 100%;
  }

  .footerbar .btn,
  .wizard-footer .btn,
  .wizard-nav-actions .btn {
    width: 100%;
  }

  .listrow {
    flex-direction: column;
  }

  .facet-toolbar {
    flex-direction: column;
    align-items: stretch;
  }

  .schedule-window-grid {
    grid-template-columns: 1fr;
  }

  .schedule-days-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .facet-groups-container {
    grid-template-columns: 1fr;
  }

  .specialization-preset-inline {
    grid-template-columns: 1fr;
  }

  .harvest-inline-card {
    grid-template-columns: 1fr;
  }

  .harvest-ai-toggle .sub {
    white-space: normal;
  }

  .harvest-variance-scale {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }

  .harvest-variance-scale span,
  .harvest-variance-scale span:nth-child(2),
  .harvest-variance-scale span:last-child {
    text-align: left;
  }

  .stores-policies-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .stores-policy-pill {
    width: 100%;
    min-width: 0;
  }

  .facet-toolbar .row {
    width: 100%;
  }

  .portfolio-toolbar {
    grid-template-columns: 1fr;
  }

  .toolbar-field-sm {
    max-width: none;
  }

  .portfolio-toolbar [data-agents-search] {
    width: 100%;
    height: 40px;
    font-size: 13px;
    border-radius: 12px;
  }

  .portfolio-table-wrap {
    overflow-x: auto;
  }

  .portfolio-table {
    min-width: 680px;
  }

  .content-metrics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .content-hub-layout {
    grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
  }

  .content-right-col {
    grid-column: 2;
  }

  .content-publications-area {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
  }

  .content-agents-panel {
    grid-column: 1;
    grid-row: 1;
    position: static;
    top: auto;
    left: auto;
    width: 100%;
    max-height: none;
    height: auto;
    z-index: auto;
  }

  .content-selected-summary-card {
    grid-column: 1;
    grid-row: 2;
    min-height: auto;
    height: auto;
  }

  .content-selected-head h2 {
    font-size: 24px;
  }

  .content-metrics-grid {
    grid-column: 1;
    grid-row: 1;
  }

  .content-agent-item {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .content-agent-meta {
    max-width: none;
  }

  .content-agent-right {
    grid-column: 2;
    flex-direction: row;
    justify-content: flex-start;
  }

  .content-post-footer {
    flex-direction: column;
    align-items: flex-start;
  }

  .content-post-price {
    margin-left: 0;
  }

  .content-post-card .hd {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .content-post-body h3 {
    font-size: 19px;
  }

}

@media (max-width: 620px) {
  .top-actions {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
  }

  .top-actions .btn,
  .top-actions .btn-split {
    width: 100%;
  }

  .top-actions .btn-split-main {
    flex: 1;
  }

  .schedule-days-grid {
    grid-template-columns: 1fr;
  }

  .stores-policies-row {
    grid-template-columns: 1fr;
  }

  .content-metrics-grid {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    min-height: auto;
  }

  .content-hub-layout {
    grid-template-columns: 1fr;
  }

  .content-publications-area {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
  }

  .content-metrics-grid {
    grid-column: 1;
    grid-row: 1;
  }

  .content-selected-summary-card {
    grid-column: 1;
    grid-row: 2;
  }

  .content-selected-head h2 {
    font-size: 21px;
  }

  .content-selected-stats {
    grid-template-columns: 1fr;
  }

  .content-selected-stats .pill {
    justify-content: flex-start;
  }

  .content-agents-panel {
    grid-column: 1;
    grid-row: 1;
    max-height: none;
    height: auto;
  }

  .avatar-cropper-dialog {
    width: min(100vw - 20px, 560px);
    padding: 12px;
  }

  .avatar-cropper-actions {
    flex-direction: column;
  }

  .avatar-cropper-actions .btn {
    width: 100%;
  }

  .content-post-author-avatar {
    width: 38px;
    height: 38px;
  }

  .content-post-carousel-btn {
    display: none;
  }

  .content-post-actions {
    gap: 8px;
  }

  .content-post-actions-left {
    gap: 8px;
  }

  .content-post-body h3 {
    font-size: 17px;
  }

  .content-posts-feed {
    grid-template-columns: 1fr;
  }
}