/**
 * ADR-033 — Mobile Experience Optimization (MXO)
 * Global Studio shell helpers. Scoped under .dash-shell / body.studio-mxo.
 * Desktop layouts above ~992px stay intact.
 */

:root {
  --mxo-tap: 48px;
  --mxo-safe-top: env(safe-area-inset-top, 0px);
  --mxo-safe-right: env(safe-area-inset-right, 0px);
  --mxo-safe-bottom: env(safe-area-inset-bottom, 0px);
  --mxo-safe-left: env(safe-area-inset-left, 0px);
  --mxo-bp-phone: 768px;
  --mxo-bp-tablet: 992px;
}

/* Drawer open only — never leave this on or the page cannot scroll */
body.studio-mxo.mxo-lock-scroll {
  overflow: hidden;
}

.dash-shell {
  --mxo-tap: 48px;
}

/* Keep document scrolling on phones (do not clip .dash-shell — overflow-x
   forces overflow-y to auto and can trap the page in an unscrollable shell). */
@media (max-width: 1180px) {
  html,
  body.studio-mxo {
    overflow-x: hidden;
    overflow-y: auto;
    height: auto;
    min-height: 100%;
    overscroll-behavior-y: auto;
  }

  body.studio-mxo.mxo-lock-scroll {
    overflow: hidden;
    height: 100%;
  }

  .dash-shell {
    max-width: 100%;
    overflow: visible;
  }

  .dash-shell .dash-sidebar {
    padding-top: 0;
    padding-bottom: max(1rem, var(--mxo-safe-bottom));
    padding-left: max(0px, var(--mxo-safe-left));
  }

  .dash-shell,
  .dash-shell--studio-funnel,
  .dash-shell--launch-funnel {
    --dash-header-h: 56px;
    --dash-header-content-gap: 8px;
  }

  .dash-shell .dash-topbar {
    padding-top: 0;
    padding-left: max(0.5rem, var(--mxo-safe-left));
    padding-right: max(0.5rem, var(--mxo-safe-right));
    min-height: var(--dash-header-h) !important;
    height: var(--dash-header-h);
    box-sizing: border-box;
  }

  .dash-shell .dash-sidebar-top {
    min-height: var(--dash-header-h) !important;
    height: var(--dash-header-h);
    max-height: var(--dash-header-h);
  }

  .dash-shell .dash-main {
    padding-bottom: max(1rem, var(--mxo-safe-bottom));
    min-width: 0;
    max-width: 100%;
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
  }

  /* Keep workspace heroes / titles clear of the fixed Studio header */
  .dash-shell--studio-funnel .dash-main,
  .dash-shell--studio-formal .dash-main {
    padding-top: calc(max(68px, var(--dash-header-h, 68px)) + var(--mxo-safe-top, 0px) + var(--dash-header-content-gap, 8px)) !important;
  }

  .dash-shell .dash-nav-hamburger {
    min-width: var(--mxo-tap);
    min-height: var(--mxo-tap);
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  /* Keep open/collapse control above the drawer backdrop so Close (X) stays visible + tappable */
  .dash-shell.is-sidebar-open .dash-main > .dash-topbar,
  .dash-shell.is-sidebar-open .dash-main .dash-topbar {
    z-index: 1010 !important;
  }

  .dash-shell.is-sidebar-open .dash-nav-hamburger {
    position: relative;
    z-index: 1011 !important;
    color: #0f172a !important;
    background: #f8fafc !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.18) !important;
  }

  .dash-shell.is-sidebar-open .dash-nav-hamburger-box,
  .dash-shell.is-sidebar-open .dash-nav-hamburger-box::before,
  .dash-shell.is-sidebar-open .dash-nav-hamburger-box::after {
    background: currentColor !important;
  }

  /* Thumb-first nav rows */
  .dash-shell .dash-menu .menu-item,
  .dash-shell .dash-menu a.menu-item,
  .dash-shell .dash-menu-group-toggle {
    min-height: var(--mxo-tap);
    align-items: center;
  }
}

/* —— Compact topbar “More” overflow —— */
.dash-shell .mxo-topbar-more {
  position: relative;
  display: none;
}

.dash-shell .mxo-topbar-more__btn {
  min-width: var(--mxo-tap);
  min-height: var(--mxo-tap);
  border: 0;
  background: transparent;
  color: inherit;
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
  border-radius: 10px;
}

.dash-shell .mxo-topbar-more__btn:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

.dash-shell .mxo-topbar-more__menu {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  min-width: 11rem;
  padding: 0.35rem;
  margin: 0;
  list-style: none;
  background: var(--card-bg, #fff);
  color: var(--text-primary, #0f172a);
  border: 1px solid var(--card-border, rgba(0, 0, 0, 0.08));
  border-radius: 12px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12);
  z-index: 4100;
}

.dash-shell .mxo-topbar-more__menu[hidden] {
  display: none !important;
}

.dash-shell .mxo-topbar-more__menu a,
.dash-shell .mxo-topbar-more__menu button {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  min-height: var(--mxo-tap);
  padding: 0.5rem 0.75rem;
  border: 0;
  background: transparent;
  color: var(--text-primary, #0f172a);
  text-decoration: none;
  font: inherit;
  text-align: left;
  border-radius: 8px;
  cursor: pointer;
}

.dash-shell .mxo-topbar-more__menu a:hover,
.dash-shell .mxo-topbar-more__menu button:hover {
  background: var(--hover, rgba(107, 70, 254, 0.1));
  color: var(--text-primary, #0f172a);
}

@media (max-width: 768px) {
  .dash-shell .mxo-topbar-more {
    display: inline-flex;
    align-items: center;
  }

  /* Collapse secondary topbar actions into More (keep hamburger, user, primary create when space) */
  .dash-shell .topbar-actions .topbar-notification:not(.topbar-deal-messages),
  .dash-shell .topbar-actions .topbar-create {
    display: none !important;
  }

  .dash-shell.mxo-more-has-create .topbar-actions .topbar-create {
    display: none !important;
  }

  .dash-shell .topbar-user-name,
  .dash-shell .topbar-user-caret {
    display: none !important;
  }

  /* Single-row topbar — no wrap, no overlapping chrome */
  .dash-shell .dash-topbar,
  .dash-shell .dash-topbar.dash-topbar--fin {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 4px !important;
    row-gap: 0 !important;
    min-height: var(--dash-header-h) !important;
    height: var(--dash-header-h);
    max-height: var(--dash-header-h);
    overflow: hidden !important;
    padding-left: max(6px, var(--mxo-safe-left)) !important;
    padding-right: max(6px, var(--mxo-safe-right)) !important;
  }

  .dash-shell .dash-topbar-studio-title {
    display: none !important;
  }

  /* Balance: compact currency chip only — stop flex-grow from crushing siblings */
  .dash-shell .dash-topbar > .dash-topbar-balance-cluster {
    flex: 0 1 auto !important;
    min-width: 0 !important;
    max-width: 42% !important;
    gap: 4px !important;
    margin: 0 !important;
  }

  .dash-shell .dash-topbar .dash-topbar-bal-label,
  .dash-shell .dash-topbar .dash-topbar-bal-label__full,
  .dash-shell .dash-topbar .dash-topbar-bal-label__short {
    display: none !important;
  }

  .dash-shell .dash-topbar .dash-topbar-balance-btn {
    min-width: 0 !important;
    max-width: 100%;
    padding: 0 8px !important;
    min-height: 36px !important;
    height: 36px !important;
  }

  .dash-shell .dash-topbar .dash-topbar-bal-value,
  .dash-shell .dash-topbar .dash-topbar-currency-trigger {
    font-size: 11px !important;
    white-space: nowrap;
  }

  .dash-shell .dash-topbar .dash-topbar-currency-code {
    display: none !important;
  }

  /* Theme: icon only */
  .dash-shell .dash-topbar .studio-theme-switcher__trigger {
    min-width: var(--mxo-tap) !important;
    width: var(--mxo-tap) !important;
    min-height: 36px !important;
    height: 36px !important;
    padding: 0 !important;
    gap: 0 !important;
    justify-content: center !important;
  }

  .dash-shell .dash-topbar .studio-theme-switcher__trigger > span:not(:first-child) {
    display: none !important;
  }

  /* Workspace: short label only, tight chip */
  .dash-shell .dash-topbar .studio-workspace-switcher__trigger {
    min-height: 36px !important;
    height: 36px !important;
    padding: 0 8px !important;
    max-width: 88px;
  }

  .dash-shell .dash-topbar .studio-workspace-switcher__label--full {
    display: none !important;
  }

  .dash-shell .dash-topbar .studio-workspace-switcher__label--short {
    display: inline !important;
    font-size: 11px !important;
  }

  .dash-shell .dash-topbar .topbar-actions {
    margin-left: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 2px !important;
    flex: 0 0 auto !important;
    flex-shrink: 0 !important;
    min-width: 0;
    max-width: none;
    overflow: visible;
  }

  .dash-shell .dash-topbar .topbar-user-trigger,
  .dash-shell .dash-topbar .topbar-deal-messages,
  .dash-shell .dash-topbar .mxo-topbar-more__btn,
  .dash-shell .dash-topbar .topbar-avatar {
    min-width: 36px !important;
    width: 36px !important;
    min-height: 36px !important;
    height: 36px !important;
    padding: 0 !important;
  }

  .dash-shell .dash-topbar .topbar-deal-messages {
    display: none !important; /* chat lives in bottom-right dock on phone */
  }

  .dash-shell .dash-main-content,
  .dash-shell #dash-main-content {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: hidden;
    box-sizing: border-box;
  }

  /* Currency dropdown stays on-screen */
  .dash-shell .dash-topbar-currency-dropdown {
    left: auto !important;
    right: 0 !important;
    max-width: min(280px, calc(100vw - 24px));
  }

  /* Workspace / theme menus: fixed under header so taps are not stolen by later topbar siblings */
  .dash-shell .dash-topbar .studio-workspace-switcher.is-open,
  .dash-shell .dash-topbar .studio-theme-switcher.is-open {
    position: relative !important;
    z-index: 4100 !important;
  }

  .dash-shell .dash-topbar .studio-workspace-switcher.is-open .studio-workspace-switcher__menu,
  .dash-shell .dash-topbar .studio-theme-switcher.is-open .studio-theme-switcher__panel {
    position: fixed !important;
    top: calc(var(--dash-header-h, 62px) + env(safe-area-inset-top, 0px) + 6px) !important;
    left: max(12px, env(safe-area-inset-left, 0px)) !important;
    right: max(12px, env(safe-area-inset-right, 0px)) !important;
    width: auto !important;
    max-width: none !important;
    max-height: min(70vh, 440px) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box;
    z-index: 5000 !important;
    background: var(--card-bg, #ffffff) !important;
    color: var(--text-primary, #0f172a) !important;
    border: 1px solid var(--card-border, #e2e8f0) !important;
  }

  .dash-shell .dash-topbar .studio-theme-switcher__panel,
  .dash-shell .dash-topbar .studio-theme-switcher__panel a,
  .dash-shell .dash-topbar .studio-theme-switcher__panel button,
  .dash-shell .dash-topbar .studio-theme-switcher__panel span,
  .dash-shell .dash-topbar .studio-theme-switcher__panel strong,
  .dash-shell .dash-topbar .studio-theme-switcher__panel label,
  .dash-shell .dash-topbar .studio-theme-switcher__panel p,
  .dash-shell .dash-topbar .studio-workspace-switcher__menu,
  .dash-shell .dash-topbar .studio-workspace-switcher__menu a,
  .dash-shell .dash-topbar .studio-workspace-switcher__menu span,
  .dash-shell .dash-topbar .studio-workspace-switcher__menu strong,
  .dash-shell .dash-topbar .mxo-topbar-more__menu,
  .dash-shell .dash-topbar .mxo-topbar-more__menu a,
  .dash-shell .dash-topbar .mxo-topbar-more__menu button {
    color: var(--text-primary, #0f172a) !important;
  }

  .dash-shell .dash-topbar .studio-theme-switcher__option-body span,
  .dash-shell .dash-topbar .studio-theme-switcher__hint,
  .dash-shell .dash-topbar .studio-workspace-switcher__item span {
    color: var(--text-secondary, #64748b) !important;
  }

  /* Closed menus must never keep a fixed full-width hit target */
  .dash-shell .dash-topbar .studio-workspace-switcher__menu[hidden],
  .dash-shell .dash-topbar .studio-theme-switcher__panel[hidden] {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}

/* —— Cards → two-up (scanty lists) —— */
@media (max-width: 768px) {
  .dash-shell .cards,
  .dash-shell .card-grid,
  .dash-shell [data-mxo-cards],
  .dash-shell .dash-card-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0.85rem;
  }

  .dash-shell table.mxo-table,
  .dash-shell .mxo-table-wrap table,
  .dash-shell [data-mxo-table] {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .dash-shell .mxo-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin-inline: -0.25rem;
    padding-inline: 0.25rem;
  }

  /* Tap targets */
  .dash-shell button:not(.dash-nav-hamburger):not(.mxo-topbar-more__btn):not([data-mxo-allow-small]),
  .dash-shell .btn,
  .dash-shell a.btn,
  .dash-shell input[type="submit"],
  .dash-shell input[type="button"] {
    min-height: var(--mxo-tap);
  }

  .dash-shell input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]),
  .dash-shell select,
  .dash-shell textarea {
    min-height: var(--mxo-tap);
    font-size: 16px; /* avoid iOS zoom */
  }

  .dash-shell img {
    max-width: 100%;
    height: auto;
  }

  /* Fluid type — desktop sizes preserved above 992 via media scope */
  .dash-shell .dash-main h1 {
    font-size: clamp(1.35rem, 4.5vw, 1.75rem);
  }

  .dash-shell .dash-main h2 {
    font-size: clamp(1.15rem, 3.5vw, 1.4rem);
  }

  .dash-shell footer,
  .dash-shell .dash-footer,
  .dash-shell [data-mxo-footer] {
    display: block;
  }

  .dash-shell footer .footer-cols,
  .dash-shell [data-mxo-footer-cols] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
  }
}

/* Sticky bar keyboard / visualViewport padding hook */
.dash-shell .mxo-sticky-bar,
body.studio-mxo .mxo-sticky-bar {
  padding-bottom: max(0.5rem, var(--mxo-safe-bottom));
  padding-bottom: max(0.5rem, calc(var(--mxo-safe-bottom) + var(--mxo-vv-offset, 0px)));
}

/* Viewport keyboard class set by mobile.js */
body.studio-mxo.mxo-keyboard-open .mxo-sticky-bar {
  transition: padding-bottom 0.15s ease;
}

/* ═══════════════════════════════════════════════════════════
   ADR-033 Phase 5 — P2 surfaces (PM · Content Builder · Hub)
   Phone-complete pass — no workflow redesign
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  /* —— Product Manager —— */
  .dash-main[data-active-menu="product-manager"] .pmx-fields,
  .dash-main[data-active-menu="product-manager-new"] .pmx-fields,
  .dash-main[data-active-menu="product-manager"] .pmx-product,
  .dash-main[data-active-menu="product-manager"] .pmx-funnel,
  .dash-main[data-active-menu="product-manager"] .pmx-exp,
  .dash-main[data-active-menu="product-manager"] .pmx-meta {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px;
  }

  .dash-main[data-active-menu="product-manager"] .pmx-stats {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px;
  }

  .dash-main[data-active-menu="product-manager"] .pmx-page,
  .dash-main[data-active-menu="product-manager-new"] .pmx-page,
  .dash-main[data-active-menu="product-manager"] .pmd,
  .dash-main[data-active-menu="product-manager"] .pmx {
    max-width: 100% !important;
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box;
  }

  .dash-main[data-active-menu="product-manager"] .pmd-kpis,
  .dash-main[data-active-menu="product-manager"] .pmd-kpi-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0 !important;
  }

  .dash-main[data-active-menu="product-manager"] .pmd,
  .dash-main[data-active-menu="product-manager"] .pmd-main,
  .dash-main[data-active-menu="product-manager"] .pmd-table-card,
  .dash-main[data-active-menu="product-manager"] .pmx-journey,
  .dash-main[data-active-menu="product-manager"] .pmx-card {
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: clip;
  }

  .dash-main[data-active-menu="product-manager"] .pmd-product__name,
  .dash-main[data-active-menu="product-manager"] .pmd-card__title a,
  .dash-main[data-active-menu="product-manager"] .pmx-url,
  .dash-main[data-active-menu="product-manager"] .pmx-offer-card__title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
  }

  .dash-main[data-active-menu="product-manager"] .pmd-hero,
  .dash-main[data-active-menu="product-manager"] .pmx-hero,
  .dash-main[data-active-menu="product-manager"] .pmx-block__head {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .dash-main[data-active-menu="product-manager"] .pmd-hero__actions,
  .dash-main[data-active-menu="product-manager"] .pmx-actions,
  .dash-main[data-active-menu="product-manager"] .pmx-exp__actions,
  .dash-main[data-active-menu="product-manager"] .pmx-conn__item,
  .dash-main[data-active-menu="product-manager"] .pm-list__row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
  }

  .dash-main[data-active-menu="product-manager"] .pmd-hero__actions > *,
  .dash-main[data-active-menu="product-manager"] .pmx-actions > *,
  .dash-main[data-active-menu="product-manager"] .pmx-exp__actions > *,
  .dash-main[data-active-menu="product-manager"] .pmx-btn:not([hidden]),
  .dash-main[data-active-menu="product-manager-new"] .pmx-btn:not([hidden]),
  .dash-main[data-active-menu="product-manager"] .pmd-btn:not([hidden]) {
    flex: 1 1 100% !important;
    min-height: var(--mxo-tap) !important;
    justify-content: center;
    box-sizing: border-box;
  }

  .dash-main[data-active-menu="product-manager"] .pmx-btn[hidden],
  .dash-main[data-active-menu="product-manager-new"] .pmx-btn[hidden],
  .dash-main[data-active-menu="product-manager"] .pmd-btn[hidden],
  .dash-main[data-active-menu="product-manager"] .pmc [hidden] {
    display: none !important;
  }

  .dash-main[data-active-menu="product-manager"] .pmx-stepper {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    gap: 8px !important;
    padding-bottom: 6px;
    max-width: 100%;
  }

  .dash-main[data-active-menu="product-manager"] .pmx-stepper > * {
    flex: 0 0 auto;
    min-width: min(160px, 70vw);
  }

  .dash-main[data-active-menu="product-manager"] .pmx-conn__item-main {
    width: 100%;
  }

  .dash-main[data-active-menu="product-manager"] input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  .dash-main[data-active-menu="product-manager"] select,
  .dash-main[data-active-menu="product-manager"] textarea,
  .dash-main[data-active-menu="product-manager-new"] input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  .dash-main[data-active-menu="product-manager-new"] select,
  .dash-main[data-active-menu="product-manager-new"] textarea {
    min-height: var(--mxo-tap);
    font-size: 16px;
    max-width: 100%;
  }

  /* —— Content Builder —— */
  .dash-main[data-active-menu="content-builder"] .lw-shell,
  .dash-main[data-active-menu="content-builder"] .cbs-layout,
  .dash-main[data-active-menu="content-builder"] .cb-workspace,
  .dash-main[data-active-menu="content-builder"] .ec-layout {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  /* Fulfillment nav → horizontal story/chip rail */
  .dash-main[data-active-menu="content-builder"] .lw-nav {
    position: static !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 6px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
    padding: 10px !important;
    max-width: 100%;
  }

  .dash-main[data-active-menu="content-builder"] .lw-nav__label {
    display: none !important;
  }

  .dash-main[data-active-menu="content-builder"] .lw-nav__link {
    flex: 0 0 auto !important;
    min-height: var(--mxo-tap) !important;
    display: inline-flex !important;
    align-items: center !important;
    padding: 10px 14px !important;
    white-space: nowrap;
    scroll-snap-align: start;
  }

  .dash-main[data-active-menu="content-builder"] .lw-nav__preview {
    display: none !important;
  }

  .dash-main[data-active-menu="content-builder"] .lw-context {
    position: static !important;
    order: 3;
  }

  .dash-main[data-active-menu="content-builder"] .lw-center {
    order: 2;
    min-width: 0;
  }

  .dash-main[data-active-menu="content-builder"] .lw-topbar {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
  }

  .dash-main[data-active-menu="content-builder"] .lw-topbar__actions,
  .dash-main[data-active-menu="content-builder"] .cb-exp__actions,
  .dash-main[data-active-menu="content-builder"] .cb-list__head-actions,
  .dash-main[data-active-menu="content-builder"] .cb-fmap__row-actions,
  .dash-main[data-active-menu="content-builder"] .lw-module__actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
  }

  .dash-main[data-active-menu="content-builder"] .lw-topbar__actions > *,
  .dash-main[data-active-menu="content-builder"] .cb-exp__actions > *,
  .dash-main[data-active-menu="content-builder"] .cb-list__head-actions > *,
  .dash-main[data-active-menu="content-builder"] .cbs-btn,
  .dash-main[data-active-menu="content-builder"] .cb-fmap__row-actions .cbs-btn {
    flex: 1 1 auto;
    min-height: var(--mxo-tap);
    justify-content: center;
  }

  .dash-main[data-active-menu="content-builder"] .cb-exp__grid,
  .dash-main[data-active-menu="content-builder"] .cb-composer__grid,
  .dash-main[data-active-menu="content-builder"] .cbs-info-grid,
  .dash-main[data-active-menu="content-builder"] .cbs-row,
  .dash-main[data-active-menu="content-builder"] .lw-hero {
    grid-template-columns: 1fr !important;
  }

  .dash-main[data-active-menu="content-builder"] .cbw-templates,
  .dash-main[data-active-menu="content-builder"] .cbw-experiences,
  .dash-main[data-active-menu="content-builder"] .cbw-stats,
  .dash-main[data-active-menu="content-builder"] .lw-stat-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .dash-main[data-active-menu="content-builder"] .cb-fmap__row-main,
  .dash-main[data-active-menu="content-builder"] .cb-fmap__delivery,
  .dash-main[data-active-menu="content-builder"] .cb-fmap-launch {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .dash-main[data-active-menu="content-builder"] .cb-fmap__delivery-select {
    max-width: 100% !important;
    width: 100%;
    min-height: var(--mxo-tap);
    font-size: 16px;
  }

  .dash-main[data-active-menu="content-builder"] .cbw-filters,
  .dash-main[data-active-menu="content-builder"] .cbw-chip {
    min-height: 44px;
  }

  .dash-main[data-active-menu="content-builder"] .cbw-filters {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    gap: 6px !important;
  }

  .dash-main[data-active-menu="content-builder"] input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  .dash-main[data-active-menu="content-builder"] select,
  .dash-main[data-active-menu="content-builder"] textarea {
    min-height: var(--mxo-tap);
    font-size: 16px;
    max-width: 100%;
  }

  /* —— Commerce Hub —— */
  .dash-main[data-active-menu="commerce-manager"] .chub-ops,
  .dash-main[data-active-menu="commerce-manager"] .chub-v2 {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: clip !important;
  }

  .dash-main[data-active-menu="commerce-manager"] .chub-v2__mission,
  .dash-main[data-active-menu="commerce-manager"] .chub-v2__split,
  .dash-main[data-active-menu="commerce-manager"] .chub-v2__bottom {
    grid-template-columns: 1fr !important;
  }

  .dash-main[data-active-menu="commerce-manager"] .chub-v2__market-grid {
    grid-template-columns: 1fr 1fr !important;
  }

  .dash-main[data-active-menu="commerce-manager"] .chub-v2__kpi {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .dash-main[data-active-menu="commerce-manager"] .chub-v2__tabs {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
  }

  .dash-main[data-active-menu="commerce-manager"] .chub-v2__tabs a {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .dash-main[data-active-menu="commerce-manager"] .chub-v2__table-wrap {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
  }

  .dash-main[data-active-menu="commerce-manager"] .chub-ops__kpis,
  .dash-main[data-active-menu="commerce-manager"] .chub-ops__product-grid,
  .dash-main[data-active-menu="commerce-manager"] .chub-ops__stat-grid,
  .dash-main[data-active-menu="commerce-manager"] .chub-ops__triptych {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .dash-main[data-active-menu="commerce-manager"] .chub-ops__hero {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .dash-main[data-active-menu="commerce-manager"] .chub-ops__tabs,
  .dash-main[data-active-menu="commerce-manager"] [role="tablist"] {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    gap: 6px !important;
    padding-bottom: 4px;
    max-width: 100%;
  }

  .dash-main[data-active-menu="commerce-manager"] .chub-ops__tabs a {
    flex: 0 0 auto;
    min-height: var(--mxo-tap);
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
  }

  .dash-main[data-active-menu="commerce-manager"] .chub-ops__journey {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
  }

  .dash-main[data-active-menu="commerce-manager"] .chub-ops__card-actions {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
  }

  .dash-main[data-active-menu="commerce-manager"] .chub-ops__btn {
    width: 100%;
    min-height: var(--mxo-tap);
    box-sizing: border-box;
  }

  .dash-main[data-active-menu="commerce-manager"] .chub-ops__table-wrap,
  .dash-main[data-active-menu="commerce-manager"] table {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* —— Business Builder shell mount —— */
  .dash-main[data-active-menu="business-builder-v2"],
  .dash-main[data-active-menu="business-builder-v2"] .bbv2-mount,
  .dash-main[data-active-menu="business-builder-v2"] #bbv2-root {
    max-width: 100% !important;
    width: 100% !important;
    min-width: 0 !important;
    /* Keep fixed FAB/sheet viewport-anchored */
    overflow: visible !important;
  }

  /* Seller dashboard mission / KPI grids */
  .dash-main[data-active-menu="dashboard"] .dmc-grid,
  .dash-main[data-active-menu="dashboard"] .dash-kpi-grid,
  .dash-main[data-active-menu="dashboard"] .mission-grid {
    grid-template-columns: 1fr 1fr !important;
  }

  /* Buyer workspace */
  .dash-main .bdv2-btn {
    min-height: var(--mxo-tap);
  }

  .dash-main .bdv2 [class*="grid"],
  .dash-main .bdv2-grid {
    grid-template-columns: 1fr 1fr !important;
  }

  /* Learning workspace player / curriculum */
  .dash-main .lw-shell,
  .dash-main .learning-workspace {
    max-width: 100%;
  }

  .dash-main .lw-layout,
  .dash-main .lw-player-layout {
    display: flex;
    flex-direction: column;
  }
}

/* ═══════════════════════════════════════════════════════════
   ADR-033 — Complete phone pass (375 / 390 / 414)
   Shell + Mission Control + classic seller dashboard
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  /* Mission Control home */
  .dash-main .dmc--v2 {
    gap: 16px !important;
    margin: 0 0 24px !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box;
  }

  .dash-main .dmc-hello h1 {
    font-size: clamp(1.35rem, 5.5vw, 1.55rem) !important;
    letter-spacing: -0.03em;
  }

  .dash-main .dmc-hello p {
    font-size: 13px !important;
    line-height: 1.45;
  }

  .dash-main .dmc-trust__grid,
  .dash-main .dmc-kpis,
  .dash-main .dmc-create,
  .dash-main .dmc-rail,
  .dash-main .dmc-rail--ws {
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }

  /* My Businesses + My Products: one card per row on phones */
  .dash-main .dmc-prd-grid,
  .dash-main .dmc-biz-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  /* Keep KPI / create as 2-up when space allows */
  .dash-main .dmc-kpis,
  .dash-main .dmc-create {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .dash-main .dmc-card,
  .dash-main .dmc-kpi,
  .dash-main .dmc-status {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .dash-main .dmc-card--create,
  .dash-main .dmc-card--biz,
  .dash-main .dmc-card--create-biz {
    min-height: 0 !important;
  }

  .dash-main .dmc-card,
  .dash-main a.dmc-card {
    min-height: var(--mxo-tap);
  }

  .dash-main .dmc-card__link,
  .dash-main .dmc-zone__head a,
  .dash-main .dmc-ask-abi a,
  .dash-main .dmc-mission a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }

  /* Journey strip: horizontal snap scroll, no page overflow */
  .dash-main .dmc-journey,
  .dash-main .dmc-journey ol,
  .dash-main .dmc-journey ul {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
    padding-bottom: 6px;
    margin-inline: 0;
    max-width: 100%;
  }

  .dash-main .dmc-journey li {
    flex: 0 0 auto;
    min-width: 72px;
    scroll-snap-align: start;
  }

  .dash-main .dmc-hero,
  .dash-main .dmc-mission,
  .dash-main .dmc-coach__grid,
  .dash-main .dmc-bottom,
  .dash-main .dmc-ops-band {
    grid-template-columns: 1fr !important;
  }

  .dash-main .dmc-robot {
    max-width: 140px;
    margin: 0 auto;
  }

  /* Classic / finance dashboard blocks */
  .dash-main[data-active-menu="dashboard"] .stats-row,
  .dash-main[data-active-menu="dashboard"] .seller-stats,
  .dash-main[data-active-menu="dashboard"] .seller-wallet-grid,
  .dash-main[data-active-menu="dashboard"] .exec-os__grid,
  .dash-main .seller-stats,
  .dash-main .seller-wallet-grid,
  .dash-main .seller-paid-offers,
  .dash-main .dash-marketplace-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }

  .dash-main[data-active-menu="dashboard"] .chart-row {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .dash-main .seller-offer-card,
  .dash-main .seller-stat,
  .dash-main .stat-card,
  .dash-main .chart-card {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  .dash-main .seller-stat a,
  .dash-main .seller-stat button,
  .dash-main .card-link {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }

  /* Charts / canvases */
  .dash-main canvas,
  .dash-main .chart-card canvas {
    max-width: 100% !important;
    height: auto !important;
  }

  /* Module heroes / action rows across Studio */
  .dash-main .dash-module-hero__actions,
  .dash-main .ds-actions,
  .dash-main .ds-kpi-row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
  }

  .dash-main .dash-module-hero__actions > *,
  .dash-main .ds-actions > * {
    flex: 1 1 100% !important;
    min-width: 0 !important;
    justify-content: center;
  }

  .dash-main .ds-kpi-row {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    flex-direction: unset;
  }

  .dash-main .ds-stat,
  .dash-main .ds-card,
  .dash-main .ds-hero {
    max-width: 100%;
  }
}

@media (max-width: 390px) {
  .dash-main .dmc-kpis,
  .dash-main .dmc-create,
  .dash-main .dmc-trust__grid,
  .dash-main[data-active-menu="product-manager"] .pmd-kpis,
  .dash-main[data-active-menu="product-manager"] .pmd-kpi-strip,
  .dash-main[data-active-menu="content-builder"] .lw-stat-row {
    grid-template-columns: 1fr 1fr !important;
  }

  .dash-shell .dash-topbar .dash-topbar-currency-code {
    display: none;
  }
}

/* Auth / login (P3 light pass — pages outside .dash-shell) */
body.auth-standalone-page .auth-standalone-shell,
body.al-login-body .al-login-wrap {
  padding-left: max(14px, env(safe-area-inset-left, 0px));
  padding-right: max(14px, env(safe-area-inset-right, 0px));
  padding-bottom: max(16px, env(safe-area-inset-bottom, 0px));
}

body.al-login-body .al-login-wrap {
  max-width: 440px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

@media (max-width: 768px) {
  body.auth-standalone-page .auth-standalone-shell {
    max-width: 100%;
  }

  body.auth-standalone-page input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  body.al-login-body .al-login-input {
    min-height: 48px;
    font-size: 16px;
  }

  body.auth-standalone-page button[type="submit"],
  body.al-login-body .al-login-submit {
    min-height: 48px;
  }
}

/* ── Brand Studio Hybrid v1 (H5 mobile — mockup app chrome) ─ */
@media (max-width: 992px) {
  .dash-shell .cbl-page--hybrid .cbl-hybrid-app {
    padding: 8px 0 10px;
    margin-bottom: 8px;
    border-radius: 0;
  }

  .dash-shell .cbl-page--hybrid .cbl-hybrid-topbar--fs-mock {
    margin: 0 8px 10px;
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap !important;
    overflow: visible !important; /* must not clip Actions dropdown */
    min-height: 48px;
    max-width: calc(100% - 16px);
    box-sizing: border-box;
    position: sticky;
    top: calc(var(--dash-header-h, 56px) + env(safe-area-inset-top, 0px));
    z-index: 180;
  }

  .dash-shell .cbl-fs-topbar__back {
    flex: 0 0 auto;
    white-space: nowrap;
    position: relative;
    z-index: 2;
  }

  .dash-shell .cbl-fs-topbar__funnel {
    min-width: 0 !important;
    max-width: 100%;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    position: relative;
    z-index: 1;
  }

  .dash-shell .cbl-fs-topbar__actions {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    flex-wrap: nowrap !important;
    gap: 4px !important;
    max-width: none;
    overflow: visible !important;
    margin-left: 0 !important;
    position: relative;
    z-index: 3;
  }

  /* Compact editor actions: hide devices always; hide primary buttons once Actions ▾ exists */
  .dash-shell .cbl-fs-topbar__devices {
    display: none !important;
  }

  .dash-shell .cbl-hybrid-topbar--fs-mock.has-fs-topbar-more .cbl-fs-topbar__btn,
  .dash-shell .cbl-hybrid-topbar--fs-mock.has-fs-topbar-more .cbl-fs-topbar__btn--desktop {
    display: none !important;
  }

  .dash-shell .cbl-hybrid-topbar--fs-mock .cbl-fs-topbar__more,
  .dash-shell .cbl-hybrid-topbar--fs-mock.has-fs-topbar-more .cbl-fs-topbar__more {
    display: inline-flex !important;
    align-items: center;
    position: relative;
    z-index: 5;
  }

  .dash-shell .cbl-fs-topbar__more-btn {
    white-space: nowrap;
    min-height: 40px;
    padding: 0 12px !important;
    pointer-events: auto !important;
  }

  /* Fixed menu so sticky parents / overflow never disable taps */
  .dash-shell .cbl-fs-topbar__more-menu {
    position: fixed !important;
    top: calc(var(--dash-header-h, 56px) + env(safe-area-inset-top, 0px) + 56px) !important;
    right: max(10px, var(--mxo-safe-right)) !important;
    left: auto !important;
    z-index: 5200 !important;
    min-width: 14rem;
    max-width: min(92vw, 280px);
    max-height: min(60vh, 420px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    background: var(--card-bg, #fff) !important;
    color: var(--text-primary, #0f172a) !important;
    border: 1px solid var(--card-border, #e2e8f0) !important;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.2) !important;
    pointer-events: auto !important;
  }

  .dash-shell .cbl-fs-topbar__more-item {
    pointer-events: auto !important;
    cursor: pointer !important;
    color: var(--text-primary, #0f172a) !important;
    opacity: 1 !important;
  }

  .dash-shell .cbl-fs-topbar__more-item:active,
  .dash-shell .cbl-fs-topbar__more-item:hover {
    background: var(--hover, rgba(107, 70, 254, 0.1)) !important;
  }

  /* Mode rail: [ Structure ⟩ ] [ Content ▾ ] [ ⟨ Preview ] */
  .dash-shell .cbl-mxo-mode-rail {
    position: sticky;
    top: calc(var(--dash-header-h, 56px) + env(safe-area-inset-top, 0px) + 52px);
    z-index: 190;
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding: 8px max(10px, var(--mxo-safe-right)) 8px max(10px, var(--mxo-safe-left));
    margin: 0;
    background: var(--card-bg, #fff);
    border-bottom: 1px solid var(--card-border, #eef2f7);
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.06);
    grid-column: 1 / -1;
    order: -1;
  }

  .dash-shell .cbl-mxo-mode-rail .cbl-hybrid-edge-toggle,
  .dash-shell .cbl-mxo-mode-rail .cbl-hybrid-edge-toggle--left,
  .dash-shell .cbl-mxo-mode-rail .cbl-hybrid-edge-toggle--right,
  .dash-shell .cbl-v1-builder--hybrid-app.has-mxo-mode-rail .cbl-mxo-mode-rail .cbl-hybrid-edge-toggle--left,
  .dash-shell .cbl-v1-builder--hybrid-app.has-mxo-mode-rail .cbl-mxo-mode-rail .cbl-hybrid-edge-toggle--right,
  .dash-shell .cbl-v1-builder--fs-mock.has-mxo-mode-rail .cbl-mxo-mode-rail .cbl-hybrid-edge-toggle--left,
  .dash-shell .cbl-v1-builder--fs-mock.has-mxo-mode-rail .cbl-mxo-mode-rail .cbl-hybrid-edge-toggle--right,
  .dash-shell .cbl-v1-builder--hybrid-app.has-mxo-mode-rail:not(.is-rail-collapsed) .cbl-mxo-mode-rail .cbl-hybrid-edge-toggle--left,
  .dash-shell .cbl-v1-builder--hybrid-app.has-mxo-mode-rail:not(.is-right-collapsed) .cbl-mxo-mode-rail .cbl-hybrid-edge-toggle--right,
  .dash-shell .cbl-v1-builder--fs-mock.has-mxo-mode-rail:not(.is-rail-collapsed) .cbl-mxo-mode-rail .cbl-hybrid-edge-toggle--left,
  .dash-shell .cbl-v1-builder--fs-mock.has-mxo-mode-rail:not(.is-right-collapsed) .cbl-mxo-mode-rail .cbl-hybrid-edge-toggle--right {
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    margin: 0 !important;
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    flex: 0 0 auto;
    width: var(--mxo-tap) !important;
    min-width: var(--mxo-tap) !important;
    height: var(--mxo-tap) !important;
    min-height: var(--mxo-tap) !important;
    z-index: 1;
  }

  .dash-shell .cbl-mxo-mode-rail {
    display: flex !important;
    visibility: visible !important;
  }

  /* Unsaved draft must stay fully tappable above Back/Actions */
  .dash-shell .cbl-page--hybrid .ade-banner {
    position: relative !important;
    top: auto !important;
    z-index: 1 !important;
    margin: 8px 8px 10px !important;
  }

  /* While recovery banner is open, keep Back/Actions in normal flow so it cannot cover Restore */
  .dash-shell .cbl-page--hybrid:has(.ade-banner) .cbl-hybrid-topbar--fs-mock {
    position: relative !important;
    top: auto !important;
    z-index: 2;
  }

  /* Mode rail is a real builder child — never inherit the stray-sibling display:none */
  .dash-shell .cbl-v1-builder--hybrid-app > .cbl-mxo-mode-rail,
  .dash-shell .cbl-v1-builder--fs-mock > .cbl-mxo-mode-rail {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .dash-shell .cbl-mxo-mode-rail .cbl-fs-tabs-more {
    flex: 1 1 auto;
    min-width: 0;
    width: auto;
  }

  .dash-shell .cbl-mxo-mode-rail .cbl-fs-tabs-more__btn {
    width: 100%;
  }

  /* Original tab strip hosts hidden sources only once dropdown lives in the mode rail */
  .dash-shell .cbl-fs-editor-tabs.is-mxo-rail-hosted {
    display: none !important;
  }

  /* Editor tabs: one Mode dropdown on mobile (Content · Design/Layout · Settings · Advanced) */
  .dash-shell .cbl-fs-editor-tabs.has-fs-tabs-more:not(.is-mxo-rail-hosted) {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center;
    gap: 8px;
    overflow: visible !important;
    padding: 8px 0;
  }

  .dash-shell .cbl-fs-editor-tabs.has-fs-tabs-more > [data-cbl-fs-editor-tab] {
    display: none !important;
  }

  .dash-shell .cbl-fs-tabs-more {
    display: flex;
    align-items: center;
    width: 100%;
    position: relative;
    z-index: 6;
  }

  .dash-shell .cbl-fs-tabs-more__btn {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    min-height: var(--mxo-tap);
    padding: 0 14px;
    border: 1px solid var(--card-border, #e2e8f0);
    border-radius: 12px;
    background: var(--card-bg, #fff);
    color: var(--text-primary, #0f172a);
    font: 700 13px/1.2 ui-sans-serif, system-ui, sans-serif;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
  }

  .dash-shell .cbl-fs-tabs-more__label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .cbl-fs-tabs-more__menu {
    position: fixed !important;
    top: calc(var(--dash-header-h, 56px) + env(safe-area-inset-top, 0px) + 108px) !important;
    left: max(12px, env(safe-area-inset-left, 0px)) !important;
    right: max(12px, env(safe-area-inset-right, 0px)) !important;
    z-index: 5200 !important;
    min-width: 0;
    max-height: min(60vh, 360px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 6px;
    margin: 0;
    border: 1px solid var(--card-border, #e2e8f0);
    border-radius: 14px;
    background: var(--card-bg, #fff) !important;
    color: var(--text-primary, #0f172a) !important;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.2);
    pointer-events: auto !important;
  }

  .cbl-fs-tabs-more__menu[hidden] {
    display: none !important;
  }

  .cbl-fs-tabs-more__item {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 48px;
    padding: 10px 14px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: var(--text-primary, #0f172a) !important;
    font: 650 14px/1.3 ui-sans-serif, system-ui, sans-serif;
    text-align: left;
    cursor: pointer;
    pointer-events: auto !important;
  }

  .cbl-fs-tabs-more__item.is-active {
    background: rgba(107, 70, 254, 0.1);
    color: var(--accent, #6b46fe) !important;
  }

  .cbl-fs-tabs-more__item:active,
  .cbl-fs-tabs-more__item:hover {
    background: var(--hover, rgba(107, 70, 254, 0.08));
  }

  /* Keep structure open/collapse clear of the editor title row */
  .dash-shell .cbl-v1-builder--hybrid-app.has-mxo-mode-rail.is-rail-collapsed > .cbl-v1-main,
  .dash-shell .cbl-v1-builder--fs-mock.has-mxo-mode-rail.is-rail-collapsed > .cbl-v1-main,
  .dash-shell .cbl-v1-builder--hybrid-app.has-mxo-mode-rail.is-right-collapsed > .cbl-v1-main,
  .dash-shell .cbl-v1-builder--fs-mock.has-mxo-mode-rail.is-right-collapsed > .cbl-v1-main {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .dash-shell .cbl-v1-builder--hybrid-app.has-mxo-mode-rail,
  .dash-shell .cbl-v1-builder--fs-mock.has-mxo-mode-rail {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0 !important;
    min-height: calc(100dvh - var(--dash-header-h, 56px) - 72px);
    overflow-x: hidden;
  }

  .dash-shell .cbl-v1-builder--hybrid-app > .cbl-v1-main,
  .dash-shell .cbl-v1-builder--fs-mock > .cbl-v1-main {
    grid-column: 1 !important;
    grid-row: 1 !important;
    order: 1;
    padding: 12px 12px 88px;
    min-width: 0;
    width: 100%;
  }

  /* Collapsed rails stay out of flow; open rails become overlays */
  .dash-shell .cbl-v1-builder--hybrid-app.is-rail-collapsed > .cbl-v1-rail,
  .dash-shell .cbl-v1-builder--fs-mock.is-rail-collapsed > .cbl-v1-rail {
    display: none !important;
  }

  .dash-shell .cbl-v1-builder--hybrid-app:not(.is-rail-collapsed) > .cbl-v1-rail,
  .dash-shell .cbl-v1-builder--fs-mock:not(.is-rail-collapsed) > .cbl-v1-rail {
    position: fixed !important;
    top: calc(var(--dash-header-h, 56px) + env(safe-area-inset-top, 0px));
    left: 0 !important;
    right: auto !important;
    bottom: 0 !important;
    width: min(92vw, 320px) !important;
    max-width: min(92vw, 320px) !important;
    /* Must clip + scroll: hybrid.css uses overflow:visible !important / height:fit-content */
    height: auto !important;
    max-height: calc(100dvh - (var(--dash-header-h, 56px) + env(safe-area-inset-top, 0px))) !important;
    z-index: 95;
    margin: 0 !important;
    padding: 10px 0 max(20px, env(safe-area-inset-bottom, 0px)) !important;
    background: var(--card-bg, #fff) !important;
    color: var(--text-primary, #0f172a) !important;
    border-right: 1px solid var(--card-border, #eef2f7);
    box-shadow: 12px 0 40px rgba(15, 23, 42, 0.18);
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    touch-action: pan-y;
    align-self: stretch !important;
    pointer-events: auto !important;
  }

  /* Mode rail stays above Structure overlay — drawer starts below it (no DOM parking) */
  .dash-shell .cbl-v1-builder--hybrid-app.has-mxo-mode-rail:not(.is-rail-collapsed) > .cbl-v1-rail,
  .dash-shell .cbl-v1-builder--fs-mock.has-mxo-mode-rail:not(.is-rail-collapsed) > .cbl-v1-rail {
    top: calc(var(--dash-header-h, 56px) + env(safe-area-inset-top, 0px) + 52px + 56px) !important;
    max-height: calc(100dvh - (var(--dash-header-h, 56px) + env(safe-area-inset-top, 0px) + 52px + 56px)) !important;
  }

  /* Keep mode rail clickable above the Structure drawer */
  .dash-shell .cbl-v1-builder--hybrid-app.has-mxo-mode-rail:not(.is-rail-collapsed) > .cbl-mxo-mode-rail,
  .dash-shell .cbl-v1-builder--fs-mock.has-mxo-mode-rail:not(.is-rail-collapsed) > .cbl-mxo-mode-rail {
    z-index: 110 !important;
  }

  /* Inner Funnel Structure list must grow and scroll with the drawer */
  .dash-shell .cbl-v1-builder--hybrid-app:not(.is-rail-collapsed) > .cbl-v1-rail .cbl-fs,
  .dash-shell .cbl-v1-builder--fs-mock:not(.is-rail-collapsed) > .cbl-v1-rail .cbl-fs,
  .dash-shell .cbl-v1-builder--hybrid-app:not(.is-rail-collapsed) > .cbl-v1-rail .cbl-fs__panel,
  .dash-shell .cbl-v1-builder--fs-mock:not(.is-rail-collapsed) > .cbl-v1-rail .cbl-fs__panel,
  .dash-shell .cbl-v1-builder--hybrid-app:not(.is-rail-collapsed) > .cbl-v1-rail .cbl-fs__group-body,
  .dash-shell .cbl-v1-builder--fs-mock:not(.is-rail-collapsed) > .cbl-v1-rail .cbl-fs__group-body {
    max-height: none !important;
    overflow: visible !important;
    height: auto !important;
    min-height: 0;
  }

  .dash-shell .cbl-v1-builder--hybrid-app:not(.is-right-collapsed) > .cbl-hybrid-right,
  .dash-shell .cbl-v1-builder--fs-mock:not(.is-right-collapsed) > .cbl-hybrid-right {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    top: auto !important;
    width: 100% !important;
    max-height: min(72vh, 640px);
    z-index: 96;
    margin: 0 !important;
    padding: 12px 12px calc(12px + env(safe-area-inset-bottom, 0px)) !important;
    border-radius: 16px 16px 0 0 !important;
    background: var(--card-bg, #fff) !important;
    color: var(--text-primary, #0f172a) !important;
    border: 1px solid var(--card-border, #eef2f7);
    border-bottom: 0;
    box-shadow: 0 -12px 40px rgba(15, 23, 42, 0.18);
    overflow: auto;
    -webkit-overflow-scrolling: touch;
  }

  .dash-shell .cbl-v1-builder--hybrid-app.is-rail-collapsed > .cbl-v1-main,
  .dash-shell .cbl-v1-builder--fs-mock.is-rail-collapsed > .cbl-v1-main,
  .dash-shell .cbl-v1-builder--hybrid-app.is-right-collapsed > .cbl-v1-main,
  .dash-shell .cbl-v1-builder--fs-mock.is-right-collapsed > .cbl-v1-main {
    padding-left: 12px;
    padding-right: 12px;
  }

  .dash-shell .cbl-hybrid-edge-toggle--left,
  .dash-shell .cbl-hybrid-edge-toggle--right {
    top: calc(var(--dash-header-h, 56px) + env(safe-area-inset-top, 0px) + 64px) !important;
    z-index: 70 !important;
    width: var(--mxo-tap) !important;
    min-width: var(--mxo-tap) !important;
    height: var(--mxo-tap) !important;
    min-height: var(--mxo-tap) !important;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.18);
  }

  /* Page-edge right toggle off — Preview stays in mode rail only; bottom-right is logo + chat */
  .dash-shell .cbl-v1-builder--hybrid-app > .cbl-hybrid-edge-toggle--right,
  .dash-shell .cbl-v1-builder--fs-mock > .cbl-hybrid-edge-toggle--right {
    display: none !important;
  }

  /* Left open/collapse stays visible even when Funnel Structure overlay is open */
  .dash-shell .cbl-v1-builder--hybrid-app:not(.is-rail-collapsed) > .cbl-hybrid-edge-toggle--left,
  .dash-shell .cbl-v1-builder--fs-mock:not(.is-rail-collapsed) > .cbl-hybrid-edge-toggle--left,
  .dash-shell .cbl-v1-builder--hybrid-app.is-rail-collapsed > .cbl-hybrid-edge-toggle--left,
  .dash-shell .cbl-v1-builder--fs-mock.is-rail-collapsed > .cbl-hybrid-edge-toggle--left {
    display: inline-flex !important;
    left: max(10px, var(--mxo-safe-left)) !important;
  }

  .dash-shell .cbl-v1-builder--hybrid-app:not(.is-rail-collapsed) > .cbl-hybrid-edge-toggle--left {
    left: min(92vw, 320px) !important;
    margin-left: -10px;
  }

  .dash-shell .cbl-fs__tabs {
    position: sticky;
    top: 0;
    z-index: 6;
    background: var(--card-bg, #fff);
  }

  .dash-shell .cbl-fs__tab-collapse {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: var(--mxo-tap) !important;
    min-width: var(--mxo-tap) !important;
    height: var(--mxo-tap) !important;
    min-height: var(--mxo-tap) !important;
    font-size: 18px !important;
    border: 1px solid var(--card-border, #e2e8f0) !important;
    border-radius: 10px !important;
    background: var(--card-bg, #fff) !important;
    color: var(--text-primary, #0f172a) !important;
  }

  .dash-shell .cbl-fs-editor-tabs {
    position: sticky;
    top: calc(var(--dash-header-h, 56px) + env(safe-area-inset-top, 0px) + 58px);
    z-index: 90;
    background: var(--card-bg, #fff);
    color: var(--text-primary, #0f172a);
    flex-wrap: nowrap !important;
    overflow: visible !important;
  }

  .dash-shell .cbl-fs-editor-tabs.has-fs-tabs-more > [data-cbl-fs-editor-tab] {
    display: none !important;
  }

  .dash-shell .cbl-fs-editor-tab {
    flex: 0 0 auto !important;
    font-size: 12px !important;
    padding: 10px 14px !important;
    color: var(--text-secondary, #64748b) !important;
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }

  .dash-shell .cbl-fs-editor-tab.is-active {
    color: var(--accent, #6b46fe) !important;
  }

  .dash-shell .cbl-v1-main,
  .dash-shell .cbl-page--hybrid,
  .dash-shell .dash-main-content,
  .dash-shell #dash-main-content {
    color: var(--text-primary, #0f172a);
  }

  .dash-shell .cbl-fs-topbar__more-menu,
  .dash-shell .cbl-fs-topbar__more-item {
    background: var(--card-bg, #fff);
    color: var(--text-primary, #0f172a) !important;
  }

  .dash-shell .cbl-oto-builder__layout {
    grid-template-columns: 1fr !important;
    column-gap: 0 !important;
  }

  .dash-shell .cbl-oto-builder__seam-toggle {
    display: none !important;
  }

  .dash-shell .cbl-oto-builder__preview {
    position: static;
    max-height: none;
  }

  .dash-shell .cbl-panel-header,
  .dash-shell .cbl-fs-editor-chrome {
    padding-left: 0;
    padding-right: 0;
  }

  .dash-shell .cbl-hybrid-lifecycle__compact {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 0 8px 8px;
    font-size: 0.78rem;
    font-weight: 800;
    color: #6b46fe;
  }

  .dash-shell .cbl-hybrid-lifecycle__dots {
    display: inline-flex;
    gap: 6px;
    align-items: center;
  }

  .dash-shell .cbl-hybrid-lifecycle__dots span {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: #e2e8f0;
  }

  .dash-shell .cbl-hybrid-lifecycle__dots span.is-active { background: #6b46fe; }
  .dash-shell .cbl-hybrid-lifecycle__dots span.is-done { background: #c4b5fd; }

  .dash-shell .cbl-hybrid-lifecycle__track {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    gap: 4px;
    padding-bottom: 4px;
    scrollbar-width: none;
  }

  .dash-shell .cbl-hybrid-lifecycle__track::-webkit-scrollbar { display: none; }

  .dash-shell .cbl-hybrid-lifecycle__stage {
    flex: 0 0 auto;
    min-height: var(--mxo-tap);
    padding: 6px 10px;
    gap: 6px;
  }

  .dash-shell .cbl-hybrid-lifecycle__copy small { display: none; }
  .dash-shell .cbl-hybrid-lifecycle__connector { width: 12px; }

  .dash-shell .cbl-hybrid-journey-rail__node {
    min-width: 56px;
    min-height: var(--mxo-tap);
    justify-content: center;
  }

  .dash-shell .cbl-hybrid-journey-rail__label { font-size: 0.65rem; }

  .dash-shell .cbl-hybrid-summary { grid-template-columns: 1fr !important; }
  .dash-shell .cbl-hybrid-goal-grid { grid-template-columns: 1fr 1fr !important; }

  .dash-shell .cbl-strategy-actions {
    position: sticky;
    bottom: calc(12px + var(--mxo-safe-bottom));
    z-index: 8;
    padding: 10px;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid #e9d5ff;
    border-radius: 12px;
  }

  /* Docked Page Progress column: keep advisor in-flow when the right rail is open. */
  .dash-shell .cbl-v1-builder--hybrid-app:not(.is-right-collapsed) > .cbl-hybrid-right > .cbl-hybrid-advisor {
    display: block !important;
    position: static !important;
    max-height: none;
    margin: 0 0 12px;
    border-radius: 16px;
    box-shadow: none;
    overflow: visible;
  }
  /* Collapsed right rail: advisor is a bottom sheet only when .is-open. */
  .dash-shell .cbl-v1-builder--hybrid-app.is-right-collapsed > .cbl-hybrid-right > .cbl-hybrid-advisor {
    display: none;
  }
  .dash-shell .cbl-v1-builder--hybrid-app.is-right-collapsed .cbl-hybrid-advisor.is-open {
    display: block !important;
    position: fixed !important;
    left: 0;
    right: 0;
    bottom: 0;
    top: auto;
    z-index: 80;
    max-height: min(78vh, 640px);
    margin: 0;
    border-radius: 16px 16px 0 0;
    box-shadow: 0 -8px 32px rgba(15, 23, 42, 0.18);
    overflow-y: auto;
    padding-bottom: calc(16px + var(--mxo-safe-bottom));
    -webkit-overflow-scrolling: touch;
  }

  .dash-shell .cbl-hybrid-advisor__scrim {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 79;
    background: rgba(15, 23, 42, 0.45);
  }

  .dash-shell .cbl-hybrid-advisor__scrim.is-open { display: block !important; }

  /* Mobile right edge: logo + chat dock only — no Advisor FAB */
  .dash-shell .cbl-hybrid-advisor-fab {
    display: none !important;
  }

  .dash-shell .cbl-hybrid-advisor__close { display: inline-flex !important; }
}

@media (min-width: 993px) {
  .dash-shell .cbl-hybrid-advisor-fab,
  .dash-shell .cbl-hybrid-advisor__scrim,
  .dash-shell .cbl-hybrid-advisor__close,
  .dash-shell .cbl-hybrid-lifecycle__compact {
    display: none !important;
  }
}

/* Desktop / tablet: mobile dock must not hide chat if JS reparented it on a narrow then wide viewport */
@media (min-width: 769px) {
  .dash-shell .mxo-mobile-dock {
    position: static;
    inset: auto;
    display: contents;
    pointer-events: auto;
    z-index: auto;
  }

  .dash-shell .mxo-mobile-dock__logo {
    display: none !important;
  }

  .dash-shell .mxo-mobile-dock .afripay-ai-assistant {
    position: fixed !important;
    right: max(20px, env(safe-area-inset-right, 0px)) !important;
    bottom: max(20px, env(safe-area-inset-bottom, 0px)) !important;
    z-index: 2200 !important;
  }

  .dash-shell .mxo-mobile-dock .afripay-ai-assistant__launcher {
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 46px !important;
    padding: 0 18px 0 14px !important;
    border-radius: 999px !important;
    gap: 10px !important;
    justify-content: flex-start !important;
  }

  .dash-shell .mxo-mobile-dock .afripay-ai-assistant__launcher > span:not(.afripay-ai-assistant__spark) {
    display: inline !important;
  }
}

@media (max-width: 560px) {
  .dash-shell .cbl-hybrid-goal-grid {
    grid-template-columns: 1fr 1fr !important;
  }

  .dash-shell .cbl-fs-topbar__back {
    font-size: 11px;
  }

  .dash-shell .cbl-fs-editor-title-row h3 {
    font-size: 1.05rem;
  }

  .dash-shell .cbl-input,
  .dash-shell .cbl-field input,
  .dash-shell .cbl-field textarea,
  .dash-shell .cbl-field select {
    font-size: 16px; /* prevent iOS zoom */
  }
}

/* —— Seller / Buyer / Client workspace content (same dash-main) —— */
@media (max-width: 768px) {
  /* Bottom-right: logo + chat icons only (no other FABs on the right) */
  .dash-shell .mxo-mobile-dock {
    position: fixed;
    right: max(12px, var(--mxo-safe-right));
    bottom: max(14px, var(--mxo-safe-bottom));
    z-index: 5200;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
    pointer-events: none;
  }

  .dash-shell .mxo-mobile-dock > * {
    pointer-events: auto;
  }

  .dash-shell .mxo-mobile-dock__logo {
    width: var(--mxo-tap);
    height: var(--mxo-tap);
    border-radius: 14px;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #0b1224;
    border: 1px solid rgba(255, 255, 255, 0.18);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.28);
    text-decoration: none;
    flex: 0 0 auto;
  }

  .dash-shell .mxo-mobile-dock__logo img {
    width: 28px;
    height: 28px;
    object-fit: contain;
    display: block;
  }

  .dash-shell .mxo-mobile-dock .afripay-ai-assistant {
    position: static !important;
    right: auto !important;
    bottom: auto !important;
    z-index: auto !important;
  }

  .dash-shell .mxo-mobile-dock .afripay-ai-assistant__launcher {
    width: var(--mxo-tap) !important;
    min-width: var(--mxo-tap) !important;
    height: var(--mxo-tap) !important;
    min-height: var(--mxo-tap) !important;
    padding: 0 !important;
    border-radius: 14px !important;
    justify-content: center !important;
    gap: 0 !important;
  }

  .dash-shell .mxo-mobile-dock .afripay-ai-assistant__launcher > span:not(.afripay-ai-assistant__spark) {
    display: none !important;
  }

  /* Undocked chat (before JS runs): same bottom-right icon slot */
  .dash-shell > .afripay-ai-assistant {
    right: max(12px, var(--mxo-safe-right)) !important;
    bottom: max(14px, var(--mxo-safe-bottom)) !important;
    z-index: 5190;
  }

  .dash-shell > .afripay-ai-assistant .afripay-ai-assistant__launcher {
    width: var(--mxo-tap) !important;
    min-width: var(--mxo-tap) !important;
    height: var(--mxo-tap) !important;
    min-height: var(--mxo-tap) !important;
    padding: 0 !important;
    border-radius: 14px !important;
    justify-content: center !important;
    gap: 0 !important;
  }

  .dash-shell > .afripay-ai-assistant .afripay-ai-assistant__launcher > span:not(.afripay-ai-assistant__spark) {
    display: none !important;
  }

  .dash-shell .cbl-hybrid-advisor-fab {
    display: none !important;
  }

  .dash-shell .dash-main .cw,
  .dash-shell .dash-main .bdv2,
  .dash-shell .dash-main .buyer-wrap,
  .dash-shell .dash-main .bo-wrap,
  .dash-shell .dash-main .workspace-wrap,
  .dash-shell .dash-main .vault-page,
  .dash-shell .dash-main .ba-wrap,
  .dash-shell .dash-main .bn-wrap,
  .dash-shell .dash-main .bc-wrap,
  .dash-shell .dash-main .bs-wrap,
  .dash-shell .dash-main .bsrch-wrap,
  .dash-shell .dash-main .receipt-wrap,
  .dash-shell .dash-main .inv-wrap {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  .dash-shell .cw-hello h1,
  .dash-shell .bdv2-hello h1 {
    overflow-wrap: anywhere;
  }

  .dash-shell--buyer .cw-kpis,
  .dash-shell--client .cw-kpis,
  .dash-shell--buyer .cw-grid,
  .dash-shell--client .cw-grid,
  .dash-shell--buyer .cw-steps,
  .dash-shell--client .cw-steps,
  .dash-shell--buyer .cw-dl--grid,
  .dash-shell--client .cw-dl--grid {
    grid-template-columns: 1fr 1fr !important;
  }

  .dash-shell .cw-actions,
  .dash-shell .cw-actions--stack {
    display: flex;
    flex-direction: column;
    align-items: stretch;
  }

  .dash-shell .cw-btn,
  .dash-shell .cw-actions a,
  .dash-shell .cw-actions button {
    width: 100%;
    min-height: var(--mxo-tap);
    box-sizing: border-box;
    justify-content: center;
  }

  .dash-shell .bdv2-btn,
  .dash-shell .buyer-actions a,
  .dash-shell .bo-actions a,
  .dash-shell .bo-actions button,
  .dash-shell .workspace-actions a,
  .dash-shell .ba-actions a,
  .dash-shell .ba-actions button,
  .dash-shell .bn-actions a,
  .dash-shell .bn-actions button,
  .dash-shell .bs-actions button,
  .dash-shell .bs-actions a,
  .dash-shell .inv-actions a,
  .dash-shell .inv-actions button,
  .dash-shell .vault-btn {
    min-height: var(--mxo-tap);
  }

  .dash-shell .buyer-library-tools,
  .dash-shell .course-shell,
  .dash-shell .course-header__grid,
  .dash-shell .bs-layout,
  .dash-shell .bs-row,
  .dash-shell .inv-grid,
  .dash-shell .inv-top {
    grid-template-columns: 1fr !important;
  }

  .dash-shell .bo-stats,
  .dash-shell .ba-summary,
  .dash-shell .ba-grid,
  .dash-shell .workspace-grid,
  .dash-shell .workspace-modules {
    grid-template-columns: 1fr 1fr !important;
  }

  .dash-shell input,
  .dash-shell select,
  .dash-shell textarea {
    max-width: 100%;
    box-sizing: border-box;
  }
}

/* ═══════════════════════════════════════════════════════════
   Site-wide dashboard: sparse lists stay two-up on phones.
   Forms, split heroes, editors, and tables stay one column.
   Uses !important so page CSS loaded after this sheet cannot
   collapse KPI / card / quick-link grids back to a single column.
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .dash-shell .dash-main,
  .dash-shell .dash-main-content,
  .dash-shell .dash-content,
  .dash-shell .exec-v2,
  .dash-shell .dmc,
  .dash-shell .chub-v2,
  .dash-shell .bdv2,
  .dash-shell .cw,
  .dash-shell .pmd,
  .dash-shell .pmx,
  .dash-shell .cbw {
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  .dash-shell .dash-stat-grid,
  .dash-shell .dash-mkt-grid,
  .dash-shell .dash-quick-actions,
  .dash-shell .dash-marketplace-grid,
  .dash-shell .dash-kpi-grid,
  .dash-shell .dash-card-grid,
  .dash-shell .cards,
  .dash-shell .card-grid,
  .dash-shell .stats-row,
  .dash-shell .seller-stats,
  .dash-shell .seller-wallet-grid,
  .dash-shell .seller-paid-offers,
  .dash-shell .shortcut-grid,
  .dash-shell .financial-records-grid,
  .dash-shell .wallet-mini-grid,
  .dash-shell .support-topic-grid,
  .dash-shell .support-funnel-stats,
  .dash-shell .escrow-meta-grid,
  .dash-shell .pay-fin-stat-grid,
  .dash-shell .agent-partner-home__kpis,
  .dash-shell .pvc-step-grid,
  .dash-shell .pl-link-access-grid,
  .dash-shell .pm-stats,
  .dash-shell .pm-stat-grid,
  .dash-shell .pmx-stats,
  .dash-shell .pmd-kpis,
  .dash-shell .pmd-kpi-strip,
  .dash-shell .pmd-rail,
  .dash-shell .cb-stats,
  .dash-shell .cb-health,
  .dash-shell .cbw-templates,
  .dash-shell .cbw-experiences,
  .dash-shell .cbw-stats,
  .dash-shell .lw-stat-row,
  .dash-shell .ml-stats,
  .dash-shell .sa-stats,
  .dash-shell .fbv3-list-grid,
  .dash-shell .cbl-stats,
  .dash-shell .cpl-stats,
  .dash-shell .ate-summary__grid,
  .dash-shell .ate-review-grid,
  .dash-shell .pt-module-dd__grid,
  .dash-shell .studio-home__stats,
  .dash-shell .studio-home__quick-grid,
  .dash-shell .bsi-dash__metrics,
  .dash-shell .ds-kpi-row,
  .dash-shell .mission-grid,
  .dash-shell .dmc-grid,
  .dash-shell .dmc-kpis,
  .dash-shell .dmc-create,
  .dash-shell .dmc-trust__grid,
  .dash-shell .dmc-rail,
  .dash-shell .dmc-rail--ws,
  .dash-shell .exec-v2-snapshot,
  .dash-shell .exec-v2-workspaces,
  .dash-shell .exec-v2-growth,
  .dash-shell .exec-v2-launch__groups,
  .dash-shell .exec-v2-operate__snapshot,
  .dash-shell .exec-v2-coach__grid,
  .dash-shell .exec-v2-commerce__grid,
  .dash-shell .chub-v2__kpi,
  .dash-shell .chub-v2__market-grid,
  .dash-shell .chub-v2__today,
  .dash-shell .chub-v2__mini-stats,
  .dash-shell .bdv2-metrics,
  .dash-shell .bdv2-quick,
  .dash-shell .bdv2-products,
  .dash-shell .bdv2-recs,
  .dash-shell .cw-kpis,
  .dash-shell .cw-grid,
  .dash-shell .cw-steps,
  .dash-shell .cw-dl--grid,
  .dash-shell .bo-stats,
  .dash-shell .ba-summary,
  .dash-shell .ba-grid,
  .dash-shell .workspace-grid,
  .dash-shell .workspace-modules,
  .dash-shell .aos-grid,
  .dash-shell .aos-grid--2,
  .dash-shell .aos-grid--3,
  .dash-shell .wlbc-grid,
  .dash-shell .wlbc-grid--2,
  .dash-shell .wlbc-grid--3,
  .dash-shell .bdc-grid,
  .dash-shell .bdc-grid--2,
  .dash-shell .bdc-grid--3,
  .dash-shell .receipt-grid,
  .dash-shell .receipt-grid--2,
  .dash-shell .receipt-grid--3,
  .dash-shell .seller-analytics-grid,
  .dash-shell .seller-analytics-grid--2,
  .dash-shell .seller-analytics-grid--3,
  .dash-shell .cbl-hybrid-goal-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  .dash-shell .dash-stat-grid > *,
  .dash-shell .dash-quick-actions > *,
  .dash-shell .dmc-kpis > *,
  .dash-shell .exec-v2-snapshot > *,
  .dash-shell .exec-v2-workspaces > *,
  .dash-shell .chub-v2__kpi > *,
  .dash-shell .bdv2-metrics > *,
  .dash-shell .cw-kpis > * {
    min-width: 0 !important;
    max-width: 100%;
    box-sizing: border-box;
    overflow-wrap: anywhere;
  }

  /* Keep stacked: forms, split heroes, editors, tables, BB authoring */
  .dash-shell .pmx-fields,
  .dash-shell .pmx-product,
  .dash-shell .pmx-funnel,
  .dash-shell .pmx-exp,
  .dash-shell .pmx-meta,
  .dash-shell .pmd-layout,
  .dash-shell .pmd-lower,
  .dash-shell .cb-exp__grid,
  .dash-shell .cb-composer__grid,
  .dash-shell .cbs-row,
  .dash-shell .lw-hero,
  .dash-shell .chub-v2__mission,
  .dash-shell .chub-v2__split,
  .dash-shell .chub-v2__bottom,
  .dash-shell .dmc-hero,
  .dash-shell .dmc-mission,
  .dash-shell .dmc-coach__grid,
  .dash-shell .dmc-bottom,
  .dash-shell .dmc-ops-band,
  .dash-shell .dmc-prd-grid,
  .dash-shell .dmc-biz-grid,
  .dash-shell .exec-v2-header,
  .dash-shell .exec-v2-ai,
  .dash-shell .exec-v2-enterprise__card,
  .dash-shell .exec-v2-operate__grid,
  .dash-shell .chart-row,
  .dash-shell .studio-home__hero,
  .dash-shell .studio-home__grid,
  .dash-shell .bdv2-hero,
  .dash-shell .bdv2-split,
  .dash-shell .bdv2-hero__card,
  .dash-shell .buyer-library-tools,
  .dash-shell .course-shell,
  .dash-shell .course-header__grid,
  .dash-shell .bs-layout,
  .dash-shell .bs-row,
  .dash-shell .inv-grid,
  .dash-shell .inv-top,
  .dash-shell .escrow-detail-grid,
  .dash-shell .paylink-builder-grid,
  .dash-shell .biz-section-grid,
  .dash-shell .profile-section-grid,
  .dash-shell .cbl-v1-builder--hybrid-app,
  .dash-shell [data-bb-v2],
  .dash-shell .bbv2-shell,
  .dash-shell .business-builder-v2 {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@media (max-width: 360px) {
  .dash-shell .dash-stat-grid,
  .dash-shell .dash-quick-actions,
  .dash-shell .dash-mkt-grid,
  .dash-shell .dash-marketplace-grid,
  .dash-shell .stats-row,
  .dash-shell .dmc-kpis,
  .dash-shell .dmc-create,
  .dash-shell .exec-v2-snapshot,
  .dash-shell .exec-v2-workspaces,
  .dash-shell .chub-v2__kpi,
  .dash-shell .bdv2-metrics,
  .dash-shell .bdv2-quick,
  .dash-shell .cw-kpis,
  .dash-shell .cw-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* ═══════════════════════════════════════════════════════════
   MXO Pass 6 — Compact Brand Studio editor + live funnel pages
   (mobile.css is loaded on pay.php; prior rules were dash-shell only)
   ═══════════════════════════════════════════════════════════ */

/* —— Brand Studio: denser editor chrome + AI sheet —— */
@media (max-width: 768px) {
  .dash-shell .cbl-page,
  .dash-shell .cbl-page--hybrid,
  .dash-shell .cbl-v1-builder,
  .dash-shell .cbl-v1-builder--hybrid-app,
  .dash-shell .cbl-v1-builder--fs-mock,
  .dash-shell .cbl-fs-editor-workspace,
  .dash-shell .cbl-fs-editor-chrome,
  .dash-shell .cbl-fs-outline,
  .dash-shell .cbl-hybrid-center {
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  .dash-shell .cbl-field,
  .dash-shell .cbl-v2-field-group,
  .dash-shell .cbl-offer-hero-media,
  .dash-shell .cbl-ty-offers,
  .dash-shell [data-cbl-offer-section-card],
  .dash-shell .cbl-section-save-bar {
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  .dash-shell .cbl-field {
    padding: 12px !important;
    margin-bottom: 10px;
  }

  .dash-shell .cbl-label {
    font-size: 12.5px;
    line-height: 1.35;
  }

  .dash-shell .cbl-hint {
    font-size: 11px;
    line-height: 1.4;
  }

  .dash-shell .cbl-section-save-bar {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }

  .dash-shell .cbl-section-save-bar .cbl-btn-save,
  .dash-shell .cbl-section-save-bar .cbl-section-save-btn,
  .dash-shell .cbl-btn-save,
  .dash-shell button.cbl-btn-save,
  .dash-shell .cbl-btn-primary,
  .dash-shell a.cbl-btn-primary {
    width: 100%;
    min-height: var(--mxo-tap);
    box-sizing: border-box;
    justify-content: center;
  }

  .dash-shell .cbl-image-stack,
  .dash-shell .cbl-image-stack__item,
  .dash-shell .cbl-image-stack img,
  .dash-shell .cbl-offer-saved-image img,
  .dash-shell [data-cbl-sec-wrap="hero-image"] img,
  .dash-shell .cbl-upzone,
  .dash-shell .cbl-media-block {
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
  }

  .dash-shell .cbl-image-stack img,
  .dash-shell .cbl-offer-saved-image img {
    height: auto;
    display: block;
    border-radius: 10px;
  }

  .dash-shell .cbl-offer-hero-media .cbl-input[type="file"],
  .dash-shell .cbl-field input[type="file"] {
    max-width: 100%;
    font-size: 14px;
  }

  /* AI Text Suggestion → bottom sheet (thumb-friendly) */
  .dash-shell .cbl-ai-modal.is-open,
  .cbl-ai-modal.is-open {
    align-items: flex-end !important;
    justify-content: center !important;
    padding: 0 !important;
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }

  .dash-shell .cbl-ai-dialog,
  .cbl-ai-modal .cbl-ai-dialog {
    width: 100% !important;
    max-width: 100% !important;
    max-height: min(88vh, 640px);
    margin: 0;
    border-radius: 16px 16px 0 0 !important;
    padding: 14px 14px max(14px, env(safe-area-inset-bottom)) !important;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    box-shadow: 0 -12px 40px rgba(15, 23, 42, 0.28) !important;
  }

  .dash-shell .cbl-ai-dialog textarea,
  .cbl-ai-modal .cbl-ai-dialog textarea {
    min-height: 96px;
    font-size: 16px; /* iOS: avoid zoom on focus */
  }

  .dash-shell .cbl-ai-dialog__actions,
  .cbl-ai-modal .cbl-ai-dialog__actions {
    flex-direction: column-reverse;
    align-items: stretch !important;
  }

  .dash-shell .cbl-ai-dialog__actions .cbl-btn-save,
  .dash-shell .cbl-ai-dialog__actions .cbl-btn-outline,
  .cbl-ai-modal .cbl-ai-dialog__actions .cbl-btn-save,
  .cbl-ai-modal .cbl-ai-dialog__actions .cbl-btn-outline {
    width: 100%;
    min-height: var(--mxo-tap);
    justify-content: center;
  }

  .dash-shell .cbl-ai-dialog__actions .cbl-ai-status {
    margin: 0 0 4px !important;
    text-align: center;
  }

  /* Offer / Thank You section cards stack cleanly */
  .dash-shell .cbl-oto-field-panel,
  .dash-shell [data-cbl-oto-field],
  .dash-shell .cbl-bonus-card__bar,
  .dash-shell .cbl-ditem {
    grid-template-columns: 1fr !important;
  }

  .dash-shell .cbl-bonus-card__bar {
    display: flex;
    flex-wrap: wrap;
  }

  /* Coupon: keep code · type · value on one row; Active / Remove on row 2 — no sideways jam */
  .dash-shell .cbl-oe-coupon-row,
  .dash-shell [data-cbl-oe-coupon-row],
  .dash-shell .cbl-v1-builder--hybrid-app.is-fs-outline [data-cbl-fs-outline-body] .cbl-oe-coupon-row,
  .dash-shell .cbl-v1-builder--hybrid-app.is-fs-outline [data-cbl-fs-outline-body] [data-cbl-oe-coupon-row] {
    display: grid !important;
    grid-template-columns: minmax(0, 1.35fr) minmax(4.5rem, 5.75rem) minmax(3.25rem, 4.25rem) !important;
    grid-auto-flow: row !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
  }

  .dash-shell .cbl-oe-coupon-row > .cbl-input:not([type="checkbox"]):not([type="radio"]),
  .dash-shell .cbl-oe-coupon-row > select.cbl-input,
  .dash-shell [data-cbl-oe-coupon-row] > .cbl-input:not([type="checkbox"]):not([type="radio"]),
  .dash-shell [data-cbl-oe-coupon-row] > select.cbl-input {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    font-size: 14px !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  .dash-shell .cbl-oe-coupon-row > .cbl-oe-toggle,
  .dash-shell [data-cbl-oe-coupon-row] > .cbl-oe-toggle {
    grid-column: 1 / 3 !important;
    width: auto !important;
  }

  .dash-shell .cbl-oe-coupon-row > [data-cbl-oe-coupon-remove],
  .dash-shell [data-cbl-oe-coupon-row] > button.cbl-btn-outline,
  .dash-shell [data-cbl-oe-coupon-row] > button {
    grid-column: 3 / 4 !important;
    justify-self: end !important;
    width: auto !important;
    min-width: 0 !important;
    padding: 8px 10px !important;
  }
}

@media (max-width: 390px) {
  .dash-shell .cbl-page--hybrid .cbl-hybrid-topbar--fs-mock {
    margin: 0 6px 8px;
    gap: 6px;
  }

  .dash-shell .cbl-mxo-mode-rail {
    gap: 6px;
    padding-left: max(8px, var(--mxo-safe-left));
    padding-right: max(8px, var(--mxo-safe-right));
  }

  .dash-shell .cbl-field {
    padding: 10px !important;
  }
}

/* —— Live funnel / checkout / thank-you (buyer-facing) —— */
@media (max-width: 768px) {
  html:has(body.pay-funnel-body),
  body.pay-funnel-body,
  body.pay-landing-body,
  body.pay-conversion-v2-layout,
  body.pay-funnel-checkout-aligned,
  body.pay-funnel-thanks-aligned {
    overflow-x: hidden;
    max-width: 100%;
  }

  body.pay-funnel-body .pay-landing-shell,
  body.pay-landing-body .pay-landing-shell,
  body.pay-conversion-v2-layout .pay-landing-shell,
  .funnel-page-shell {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    padding-left: max(12px, env(safe-area-inset-left, 0px));
    padding-right: max(12px, env(safe-area-inset-right, 0px));
    padding-bottom: max(20px, env(safe-area-inset-bottom, 0px));
  }

  /* Offer pages: edge-to-edge shell so hero media can fill the device width */
  body.pay-funnel-body:has(.pco-offer-page) .pay-landing-shell,
  body.pay-funnel-thanks-aligned:has(.pco-offer-page) .pay-landing-shell,
  body:has(.pco-offer-page) .funnel-page-shell {
    padding-left: 0;
    padding-right: 0;
    overflow-x: hidden;
  }

  body.pay-funnel-body img,
  body.pay-landing-body img,
  body.pay-conversion-v2-layout img,
  body.pay-funnel-thanks-aligned img,
  .pay-landing-shell img,
  .pco-wrap img,
  .clv2-hero img,
  .clv2-section img {
    max-width: 100% !important;
    height: auto;
  }

  body.pay-funnel-body .fx-shell--dp01 .dp01-hero__player > img,
  body.pay-landing-body .fx-shell--dp01 .dp01-hero__player > img,
  body.pay-conversion-v2-layout .fx-shell--dp01 .dp01-hero__player > img,
  body.pay-funnel-body .fx-shell--dp01 .dp01-hero__media > img,
  body.pay-landing-body .fx-shell--dp01 .dp01-hero__media > img,
  body.pay-conversion-v2-layout .fx-shell--dp01 .dp01-hero__media > img {
    position: absolute !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
  }
  body.pay-funnel-body .fx-shell--dp01 .dp01-hero__player > img[hidden],
  body.pay-landing-body .fx-shell--dp01 .dp01-hero__player > img[hidden],
  body.pay-conversion-v2-layout .fx-shell--dp01 .dp01-hero__player > img[hidden] {
    display: none !important;
  }
  body.pay-funnel-body .fx-shell--dp01 .dp01-thumbs img,
  body.pay-landing-body .fx-shell--dp01 .dp01-thumbs img {
    width: 118px !important;
    max-width: 118px !important;
    height: 72px !important;
  }
  body.pay-funnel-body .fx-shell--dp01 .dp01-grid,
  body.pay-landing-body .fx-shell--dp01 .dp01-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.pay-funnel-body video,
  body.pay-conversion-v2-layout video,
  .pay-landing-shell video {
    max-width: 100% !important;
    height: auto;
  }

  /* Stack common multi-column funnel layouts */
  body.pay-funnel-body .clv2-hero__grid,
  body.pay-funnel-body .clv2-body__grid,
  body.pay-conversion-v2-layout .clv2-hero__grid,
  body.pay-conversion-v2-layout .clv2-body__grid,
  body.pay-funnel-checkout-aligned .pco-wrap,
  body.pay-funnel-thanks-aligned .pco-wrap,
  .pco-wrap:not(.pco-thanks-wrap) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.pay-funnel-checkout-aligned .pco-wrap,
  body.pay-funnel-thanks-aligned .pco-wrap,
  .pco-wrap {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  body.pay-funnel-checkout-aligned .pco-sticky,
  body.pay-funnel-thanks-aligned .pco-sticky,
  .pco-wrap .pco-sticky {
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Thumb-sized primary actions */
  body.pay-funnel-body a.clv2-btn,
  body.pay-funnel-body .clv2-btn,
  body.pay-funnel-body .clv2-cta,
  body.pay-funnel-body .clv2-mobile-buy a,
  body.pay-funnel-body .clv2-mobile-buy button,
  body.pay-funnel-checkout-aligned .pco-btn-pay,
  body.pay-funnel-checkout-aligned a.pco-btn-pay,
  body.pay-funnel-checkout-aligned .pco-btn-primary,
  body.pay-funnel-thanks-aligned .pco-btn-pay,
  body.pay-funnel-thanks-aligned .pco-btn-primary,
  body.pay-funnel-thanks-aligned .pco-tysb-btn,
  body.pay-funnel-thanks-aligned .oto-focus-btn,
  .pay-landing-shell .btn,
  .pay-landing-shell button[type="submit"] {
    min-height: 48px;
    box-sizing: border-box;
  }

  body.pay-funnel-checkout-aligned .pco-btn-pay,
  body.pay-funnel-checkout-aligned a.pco-btn-pay,
  body.pay-funnel-checkout-aligned .pco-btn-primary,
  body.pay-funnel-thanks-aligned .pco-btn-primary,
  body.pay-funnel-thanks-aligned .pco-tysb-btn,
  body.pay-funnel-thanks-aligned .oto-focus-btn,
  body.pay-funnel-body .clv2-mobile-buy a,
  body.pay-funnel-body .clv2-mobile-buy button {
    width: 100%;
    max-width: 100%;
  }

  /* Forms: readable + no iOS zoom */
  body.pay-funnel-body input,
  body.pay-funnel-body select,
  body.pay-funnel-body textarea,
  body.pay-funnel-checkout-aligned input,
  body.pay-funnel-checkout-aligned select,
  body.pay-funnel-checkout-aligned textarea,
  body.pay-conversion-v2-layout input,
  body.pay-conversion-v2-layout select,
  body.pay-conversion-v2-layout textarea {
    max-width: 100%;
    box-sizing: border-box;
    font-size: 16px;
  }

  body.pay-funnel-body h1,
  body.pay-conversion-v2-layout h1,
  body.pay-funnel-body .clv2-hero__title,
  body.pay-conversion-v2-layout .clv2-hero__title {
    font-size: clamp(1.35rem, 6.2vw, 1.85rem);
    line-height: 1.2;
    overflow-wrap: anywhere;
  }

  body.pay-funnel-body p,
  body.pay-conversion-v2-layout p,
  body.pay-funnel-thanks-aligned p {
    overflow-wrap: break-word;
  }

  /* Offer / OTO pages */
  .pco-offer-page,
  .pco-offer-page .oto-ob-hero,
  .pco-offer-page .oto-ob-hero__media,
  .pco-offer-page .oto-ob-hero__copy,
  .pco-offer-page .pco-ty-left-offer,
  .pco-offer-page .pco-offer-mobile-stack,
  .pco-offer-page .oto-ob-t,
  .pco-offer-page .oto-ob-testimonials {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  .pco-offer-page .oto-ob-hero__panel {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .pco-offer-page img,
  .pco-offer-page video,
  .pco-offer-page iframe,
  .plf-gallery img,
  .plf-gallery video,
  .plf-gallery iframe,
  .plf-slide img,
  .plf-slide video,
  .plf-slide iframe,
  .dp01s-hero-card__media img,
  .dp01s-hero-card__media video,
  .dp01s-hero-card__media iframe {
    display: block !important;
    max-width: 100% !important;
    visibility: visible !important;
  }

  .pco-offer-page .pco-ty-offer-media,
  .pco-offer-page .pco-ty-offer-media--full,
  .pco-offer-page .pco-ty-offer-page-hero-media,
  .pco-offer-page .oto-ob-hero__visual,
  .pco-offer-page .oto-ob-hero__media,
  .pco-offer-page .oto-ob-showcase__media,
  .pco-offer-page .oto-ob-showcase__media-inner,
  .plf-gallery,
  .plf-slider,
  .dp01s-hero-card__media {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    visibility: visible !important;
    overflow: hidden;
  }

  .pco-offer-page .oto-ob-hero__video-wrap,
  .pco-offer-page .pco-ty-offer-page-hero-video,
  .pco-offer-page .pco-ty-offer-media--full:has(iframe),
  .pco-offer-page .pco-ty-offer-media--full:has(video),
  .plf-slider:has(iframe),
  .plf-slider:has(video),
  .dp01s-hero-card__media.is-video {
    position: relative;
    aspect-ratio: 16 / 9;
    height: auto !important;
    padding-bottom: 0 !important;
  }

  .pco-offer-page .oto-ob-hero__video-wrap iframe,
  .pco-offer-page .oto-ob-hero__video-wrap video,
  .pco-offer-page .pco-ty-offer-page-hero-video iframe,
  .pco-offer-page .pco-ty-offer-media iframe,
  .pco-offer-page .pco-ty-offer-media video,
  .plf-slide iframe,
  .plf-slide video,
  .dp01s-hero-card__media iframe,
  .dp01s-hero-card__media video {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
  }

  .pco-offer-page .pco-ty-offer-media img,
  .pco-offer-page .pco-ty-offer-page-hero-media img,
  .pco-offer-page .oto-ob-hero__media img,
  .pco-offer-page .oto-ob-showcase__media img,
  .plf-slide img,
  .dp01s-hero-card__media img {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
  }

  .pco-offer-page .oto-ob-hero__pills {
    grid-template-columns: 1fr !important;
  }

  .pco-offer-page.pco-wrap--split-scroll {
    padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px));
  }

  body.pay-funnel-body:has(.pco-offer-page) .pco-offer-page .pco-sticky,
  body.pay-funnel-thanks-aligned:has(.pco-offer-page) .pco-offer-page .pco-sticky {
    position: static !important;
    top: auto !important;
    left: auto;
    right: auto;
    bottom: auto;
    z-index: auto;
    margin: 0;
    padding: 0;
    max-height: none;
    overflow: visible;
    background: transparent;
    border: 0;
    box-shadow: none;
  }

  /* In-flow CTAs on mobile offer pages (No Thanks sits under final CTA) */
  .pco-offer-page:has(.pco-ty-sidebar--offer-cta) .pco-ty-left-offer .pco-ty-offer-cta[data-cta-placement="left"] {
    display: flex !important;
  }

  .pco-offer-page .pco-ty-sidebar--offer-cta .pco-ty-section--special:not([hidden]) > .pco-ty-offer-cta,
  .pco-offer-page .pco-ty-panel-recovery:not([hidden]) > .pco-ty-offer-cta {
    position: static !important;
    left: auto;
    right: auto;
    bottom: auto;
    z-index: auto;
    width: 100%;
    margin: 0;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
  }

  .pco-offer-page .pco-ty-sidebar--offer-cta .pco-ty-section--special:not([hidden]) > .pco-ty-offer-cta .pco-btn-primary,
  .pco-offer-page .pco-ty-sidebar--offer-cta .pco-ty-section--special:not([hidden]) > .pco-ty-offer-cta a.pco-btn-primary,
  .pco-offer-page .pco-ty-panel-recovery:not([hidden]) > .pco-ty-offer-cta .pco-btn-primary,
  .pco-offer-page .pco-ty-panel-recovery:not([hidden]) > .pco-ty-offer-cta a.pco-btn-primary {
    width: 100%;
    min-height: 52px;
  }

  .pay-flow-nav,
  .pay-flow-steps {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 390px) {
  body.pay-funnel-body .pay-landing-shell,
  body.pay-conversion-v2-layout .pay-landing-shell,
  .funnel-page-shell {
    padding-left: max(10px, env(safe-area-inset-left, 0px));
    padding-right: max(10px, env(safe-area-inset-right, 0px));
  }

  body.pay-funnel-checkout-aligned .pco-card,
  body.pay-funnel-thanks-aligned .pco-card,
  .pco-wrap .pco-card {
    padding: 16px 12px !important;
  }
}

/* Performance Overview: money stacks, counts stay two across */
@media (max-width: 980px) {
  .dash-shell .dmc-kpis--money,
  .dash-main .dmc-kpis--money {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .dash-shell .dmc-kpis--counts,
  .dash-main .dmc-kpis--counts {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .dash-shell .dmc-selling-period,
  .dash-main .dmc-selling-period {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }
}