/* Mobile composition only. Keep the existing themes, markup and event handlers.
   Loaded after the legacy route skins so density rules have one reviewable home. */
@media (max-width: 760px) {
  body:is(.portal-mobile-mode, .ark-mobile-mode, .stock-viewer-mobile-mode, .landing-mobile-mode) {
    --compact-bottom-space: calc(70px + env(safe-area-inset-bottom, 0px));
    font-size: 13px;
  }

  /* Explicit action width prevents the four header buttons overflowing their track. */
  body .ark-mobile-topbar {
    --compact-brand-width: clamp(44px, calc(100vw - 390px), 130px);
    grid-template-columns: var(--compact-brand-width) minmax(0, 1fr) auto !important;
    gap: 4px !important;
    min-height: calc(52px + env(safe-area-inset-top, 0px)) !important;
    height: auto !important;
    padding: env(safe-area-inset-top, 0px) 8px 0 !important;
  }
  body .ark-mobile-topbar-leading,
  body .ark-mobile-topbar > .ark-mobile-brand {
    width: var(--compact-brand-width) !important;
    min-width: 0 !important;
  }
  body .ark-mobile-brand { min-height: 44px !important; }
  body .ark-mobile-brand img { width: 28px !important; height: 28px !important; }
  body .ark-mobile-topbar-copy { min-width: 0 !important; width: auto !important; }
  body .ark-mobile-topbar-copy strong {
    font-size: 13px !important;
    line-height: 1.3 !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }
  body .ark-mobile-topbar-actions {
    width: auto !important;
    min-width: 0 !important;
    gap: 0 !important;
    flex-shrink: 0 !important;
  }
  body .ark-mobile-topbar-actions > :is(a, button) {
    box-sizing: border-box !important;
    flex: 0 0 44px !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 6px !important;
  }
  body .ark-mobile-topbar-actions svg { width: 19px !important; height: 19px !important; }
  body .ark-mobile-topbar-actions .rose-mode-icon { width: 28px !important; height: 28px !important; }

  body :is(.portal-mobile-bottom-nav, .ark-mobile-bottom-nav),
  body.stock-viewer-mobile-mode #stockViewerMobileBottomNav .stock-viewer-mobile-bottom-nav {
    min-height: 56px !important;
    height: auto !important;
    padding-bottom: env(safe-area-inset-bottom, 0px) !important;
  }
  body :is(.portal-mobile-bottom-item, .ark-mobile-bottom-item) {
    position: relative !important;
    min-height: 56px !important;
    padding: 8px 2px 6px !important;
    gap: 3px !important;
    font-size: 10px !important;
    line-height: 1.25 !important;
  }
  body :is(.portal-mobile-bottom-item, .ark-mobile-bottom-item) svg {
    width: 18px !important;
    height: 18px !important;
  }
  body :is(.portal-mobile-bottom-item, .ark-mobile-bottom-item) span {
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  body.portal-mobile-mode :is(#homeScreen, #investorScreen, .v2-route-screen) :is(.investor-main, .v2-page-main),
  body.portal-mobile-mode :is(.personal-main, .favorites-main, .notices-main),
  body.ark-mobile-mode .ark-mobile-main,
  body.stock-viewer-mobile-mode #favoriteViewerScreen .favorite-viewer-main {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 10px 10px var(--compact-bottom-space) !important;
    gap: 10px !important;
  }
  body.portal-mobile-mode #homeScreen :is(.home-product-top-status, .home-product-hero, .home-product-update-status, .home-community-spotlight, .home-ai-evidence, .home-product-steps, .home-product-story, .home-product-report-guide, .home-product-footer, .home-investor-selection, .v2-recommendation-zone, .v2-history-zone),
  body.portal-mobile-mode #investorScreen :is(.investor-market-card, .investor-directory-panel, .investor-directory-card),
  body.portal-mobile-mode :is(.v2-page-hero, .v2-page-card, .personal-page-card),
  body.ark-mobile-mode :is(.ark-mobile-hero, .ark-mobile-route-hero, .ark-mobile-section),
  body.stock-viewer-mobile-mode #favoriteViewerScreen .favorite-viewer-card {
    padding: 12px !important;
    min-width: 0 !important;
    gap: 10px !important;
  }
  body:is(.portal-mobile-mode, .ark-mobile-mode, .stock-viewer-mobile-mode) :is(main, .ark-mobile-main) :is(h1, h2, h3, p) {
    overflow-wrap: anywhere;
  }
  body.portal-mobile-mode :is(.v2-page-hero, .investor-directory-panel) h1,
  body.ark-mobile-mode :is(.ark-mobile-hero, .ark-mobile-route-hero) h1 {
    font-size: 22px !important;
    line-height: 1.3 !important;
    margin-block: 6px !important;
  }
  body.portal-mobile-mode :is(.v2-page-main, .krillione-product-main, .investor-main) h2,
  body.ark-mobile-mode .ark-mobile-section h2 {
    font-size: 17px !important;
    line-height: 1.35 !important;
  }
  body.portal-mobile-mode :is(.v2-page-main, .krillione-product-main, .investor-main) h3 {
    font-size: 14px !important;
    line-height: 1.4 !important;
  }
  body.portal-mobile-mode :is(.v2-page-hero, .v2-page-card, .v2-section-heading, .home-product-section-heading) p,
  body.ark-mobile-mode :is(.ark-mobile-route-hero, .ark-mobile-hero) > p {
    font-size: 13px !important;
    line-height: 1.6 !important;
    margin-block: 6px !important;
  }

  /* Welcome is a full row; each metric gets one third of the available width. */
  body.portal-mobile-mode #homeScreen .home-product-top-status {
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: start !important;
  }
  body.portal-mobile-mode #homeScreen .home-product-status-welcome strong {
    font-size: 14px !important;
    white-space: normal !important;
    overflow: visible !important;
    line-height: 1.4 !important;
  }
  body.portal-mobile-mode #homeScreen .home-product-status-welcome > span { font-size: 10px !important; }
  body.portal-mobile-mode #homeScreen .home-product-status-metrics {
    width: 100% !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }
  body.portal-mobile-mode #homeScreen .home-product-status-metrics > span {
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 7px !important;
  }
  body.portal-mobile-mode #homeScreen .home-product-status-metrics :is(small, b) {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    overflow-wrap: normal !important;
    word-break: keep-all !important;
    line-height: 1.4 !important;
  }
  body.portal-mobile-mode #homeScreen .home-product-status-metrics small { font-size: 10px !important; }
  body.portal-mobile-mode #homeScreen .home-product-status-metrics b { font-size: 12px !important; }
  body.portal-mobile-mode #homeScreen .home-product-hero { min-height: 0 !important; }
  body.portal-mobile-mode #homeScreen .home-product-copy h1 {
    font-size: 23px !important;
    line-height: 1.3 !important;
    letter-spacing: -.035em !important;
    word-break: keep-all !important;
    text-wrap: balance;
  }
  body.portal-mobile-mode #homeScreen .home-product-kicker { font-size: 10px !important; margin-bottom: 8px !important; }
  body.portal-mobile-mode #homeScreen .home-product-summary {
    font-size: 13px !important;
    line-height: 1.6 !important;
    margin-top: 10px !important;
  }
  body.portal-mobile-mode #homeScreen :is(.home-product-actions, .home-product-route-actions) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
    margin-top: 10px !important;
  }
  body.portal-mobile-mode #homeScreen :is(.home-product-actions, .home-product-route-actions) > :is(a, button) {
    width: auto !important;
    min-width: 0 !important;
    min-height: 40px !important;
    padding: 8px !important;
    font-size: 12px !important;
    white-space: normal !important;
    justify-content: center !important;
  }
  body.portal-mobile-mode #homeScreen .home-product-trust-list {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px 12px !important;
    margin-top: 10px !important;
  }
  body.portal-mobile-mode #homeScreen .home-product-trust-list li { font-size: 11px !important; }
  body.portal-mobile-mode #homeScreen .home-product-trust-list li { padding: 4px 7px !important; }
  body.portal-mobile-mode #homeScreen .home-product-mascot-card {
    min-height: 176px !important;
    padding: 12px !important;
  }
  body.portal-mobile-mode #homeScreen .home-product-mascot-card > img {
    width: 145px !important;
    height: 150px !important;
    top: 6px !important;
    right: 4px !important;
  }
  body.portal-mobile-mode #homeScreen .home-product-mascot-card > div:last-child { max-width: 190px !important; }
  body.portal-mobile-mode #homeScreen .home-product-mascot-card strong { font-size: 14px !important; }
  body.portal-mobile-mode #homeScreen .home-product-firm-grid {
    top: 12px !important;
    bottom: auto !important;
    left: 12px !important;
    grid-template-columns: repeat(3, 30px) !important;
    gap: 5px !important;
  }
  body.portal-mobile-mode #homeScreen .home-product-firm-grid span { width: 30px !important; height: 30px !important; }
  body.portal-mobile-mode #homeScreen .home-product-firm-grid img { width: 23px !important; height: 23px !important; }

  /* Filters wrap as groups; no membership action is stranded outside the viewport. */
  body.ark-mobile-mode .ark-mobile-filter-row {
    display: flex !important;
    flex-wrap: wrap !important;
    overflow: visible !important;
    width: 100% !important;
    gap: 6px !important;
    padding: 0 !important;
    margin: 8px 0 0 !important;
  }
  body.ark-mobile-mode .ark-mobile-filter-row > button { flex: 1 1 auto !important; }
  body.ark-mobile-mode .ark-mobile-filter-row button {
    min-height: 38px !important;
    padding: 7px 9px !important;
    font-size: 11px !important;
    white-space: normal !important;
  }
  body.ark-mobile-mode .ark-mobile-filter-row .unified-membership-filter-group {
    display: flex !important;
    flex: 1 1 100% !important;
    min-width: 0 !important;
    width: 100% !important;
    gap: 5px !important;
    margin: 0 !important;
    padding: 4px !important;
  }
  body.ark-mobile-mode .unified-membership-filter-group > button { flex: 1 1 0 !important; min-width: 0 !important; }
  body.ark-mobile-mode .unified-membership-filter-group > .unified-membership-mark { flex: 0 0 34px !important; }
  body.ark-mobile-mode .ark-mobile-search { min-height: 42px !important; margin-top: 10px !important; padding: 7px 10px !important; }
  body.ark-mobile-mode .ark-mobile-search input { min-width: 0 !important; font-size: 16px !important; }
  body.ark-mobile-mode .unified-stocks-investor-picker { gap: 6px !important; margin-block: 8px !important; }
  body.ark-mobile-mode .unified-stocks-investor-picker button { min-height: 44px !important; padding: 6px 10px !important; }
  body.ark-mobile-mode .unified-stocks-investor-picker button img { width: 28px !important; height: 28px !important; }
  body.ark-mobile-mode .ark-mobile-section-head { margin-bottom: 8px !important; }
  body.ark-mobile-mode .ark-mobile-card-list { gap: 8px !important; }
  body.ark-mobile-mode .ark-mobile-stock-card { padding: 10px !important; gap: 6px !important; }
  body.ark-mobile-mode .ark-mobile-stock-identity {
    grid-template-columns: 30px minmax(0, 1fr) auto !important;
    gap: 7px !important;
  }
  body.ark-mobile-mode .ark-mobile-stock-icon { width: 30px !important; height: 30px !important; }
  body.ark-mobile-mode .ark-mobile-stock-identity > span:nth-child(2) { min-width: 0 !important; }
  body.ark-mobile-mode .ark-mobile-stock-identity :is(strong, small) {
    display: block !important;
    white-space: normal !important;
    overflow: visible !important;
    -webkit-line-clamp: unset !important;
    overflow-wrap: anywhere;
    line-height: 1.4 !important;
  }
  body.ark-mobile-mode .ark-mobile-stock-identity strong { font-size: 13px !important; }
  body.ark-mobile-mode .ark-mobile-stock-identity small { font-size: 10px !important; }
  body.ark-mobile-mode .ark-mobile-stock-identity em { grid-column: auto !important; font-size: 10px !important; padding: 4px 6px !important; }
  body.ark-mobile-mode .ark-mobile-stock-reason {
    display: block !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
    overflow: visible !important;
    white-space: normal !important;
    -webkit-line-clamp: unset !important;
  }
  body.ark-mobile-mode .ark-mobile-stock-meta { gap: 4px 8px !important; font-size: 10px !important; }
  body.ark-mobile-mode .ark-mobile-stock-investors { display: flex !important; align-items: center; gap: 6px; }
  body.ark-mobile-mode .ark-mobile-stock-investors .unified-stock-investor-icon,
  body.ark-mobile-mode .ark-mobile-stock-investors img { width: 24px !important; height: 24px !important; }
  body.ark-mobile-mode .ark-mobile-stock-investors .unified-stock-investors {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    width: auto !important;
    height: auto !important;
  }
  body.ark-mobile-mode .ark-mobile-stock-investors .unified-stock-investor-icon {
    position: relative !important;
    inset: auto !important;
    box-sizing: border-box !important;
    flex: 0 0 24px !important;
    padding: 2px !important;
  }
  body.ark-mobile-mode .ark-mobile-stock-investors .unified-stock-investor-icon img {
    width: 100% !important;
    height: 100% !important;
  }
  body.portal-mobile-mode .investor-screen:has(> .portal-mobile-header) {
    padding-top: calc(52px + env(safe-area-inset-top, 0px)) !important;
    row-gap: 0 !important;
  }
  body.portal-mobile-mode .portal-mobile-header { height: auto !important; min-height: 52px !important; }
  body.portal-mobile-mode #marketScreen .v2-page-main > :is(.home-ai-evidence, .v2-page-card, .v2-options-jump) {
    margin-block: 0 !important;
  }
  body.portal-mobile-mode #marketScreen .v2-options-jump { padding: 12px !important; }
  body.portal-mobile-mode #marketScreen .v2-options-jump p { font-size: 13px !important; line-height: 1.6 !important; }
  body.portal-mobile-mode #marketScreen .home-evidence-panel { padding: 12px !important; }
  body.portal-mobile-mode #marketScreen .home-ai-evidence-grid { gap: 10px !important; }
  body.portal-mobile-mode #investorScreen .investor-directory-ark-card {
    padding: 0 !important;
    gap: 10px !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }
  body.portal-mobile-mode #investorScreen .investor-directory-ark-brand {
    grid-template-columns: 44px minmax(0, 1fr) !important;
    gap: 8px !important;
  }
  body.portal-mobile-mode #investorScreen .home-investor-selection-mark { width: 40px !important; height: 40px !important; }
  body.portal-mobile-mode #investorScreen .home-investor-selection-mark img { width: 30px !important; height: 30px !important; }
  body.portal-mobile-mode :is(.investor-directory-ark-rows article, .home-evidence-investor-rows > a) {
    grid-template-columns: minmax(0, 1fr) minmax(85px, auto) !important;
    gap: 6px 10px !important;
    padding: 8px !important;
  }
  body.portal-mobile-mode :is(.investor-directory-ark-rows, .home-evidence-investor-rows) .home-evidence-investor-stock {
    grid-column: 1 / -1 !important;
  }
  body.portal-mobile-mode :is(.investor-directory-ark-rows, .home-evidence-investor-rows) .home-evidence-investor-stock :is(b, small) {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    overflow-wrap: anywhere;
  }
  body.portal-mobile-mode :is(.investor-directory-ark-rows, .home-evidence-investor-rows) article > span:not(.home-evidence-investor-stock) {
    text-align: left !important;
  }
  body.portal-mobile-mode .home-product-provider-evidence { padding: 10px !important; margin-top: 8px !important; }
  body.stock-viewer-mobile-mode #favoriteViewerScreen .ai-report-readable,
  body.stock-viewer-mobile-mode #favoriteViewerScreen .ai-report-readable :is(.stock-viewer-analysis-content, .stock-viewer-ark-expanded-report) {
    gap: 10px !important;
  }
  body.stock-viewer-mobile-mode #favoriteViewerScreen .ai-report-readable :is(.detail-section, .stock-viewer-provider-hero, .stock-viewer-peer-report) {
    padding: 12px !important;
  }
  body.stock-viewer-mobile-mode #favoriteViewerScreen .ai-report-readable :is(p, li) { font-size: 13px !important; }
  body.stock-viewer-mobile-mode #favoriteViewerScreen .ai-report-readable .analysis-chapter-heading { margin-bottom: 10px !important; padding-bottom: 8px !important; }
  body.stock-viewer-mobile-mode #favoriteViewerScreen .ai-report-readable .analysis-chapter-heading > h3 { font-size: 17px !important; }
  body.stock-viewer-mobile-mode #favoriteViewerScreen .ai-report-readable :is(.ai-evidence-block, .ai-decision-condition-grid article, .news-review-line, .analyst-target-item) {
    padding: 10px !important;
  }
  body.stock-viewer-mobile-mode #favoriteViewerScreen .stock-viewer-mobile-topbar {
    --compact-brand-width: 44px;
    grid-template-columns: 44px minmax(0, 1fr) auto !important;
    min-height: calc(52px + env(safe-area-inset-top, 0px)) !important;
    gap: 4px !important;
  }
  body.stock-viewer-mobile-mode #favoriteViewerScreen .stock-viewer-mobile-actions { width: auto !important; gap: 0 !important; }
  body.stock-viewer-mobile-mode #favoriteViewerScreen .stock-viewer-mobile-title { width: auto !important; min-width: 0 !important; gap: 4px !important; }
  body.stock-viewer-mobile-mode #favoriteViewerScreen .stock-viewer-mobile-title :is(img, .ark1440-stock-icon) { width: 22px !important; height: 22px !important; }
  body.stock-viewer-mobile-mode #favoriteViewerScreen .stock-journey-breadcrumb {
    display: flex !important;
    flex-wrap: wrap !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 8px !important;
    gap: 5px !important;
  }
  body.stock-viewer-mobile-mode #favoriteViewerScreen .stock-journey-breadcrumb > p {
    position: static !important;
    flex: 1 1 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 6px !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    line-height: 1.5 !important;
  }
  body.stock-viewer-mobile-mode #favoriteViewerScreen .ai-provider-card { padding: 10px !important; gap: 8px !important; }
  body.stock-viewer-mobile-mode #favoriteViewerScreen .ai-provider-score b { font-size: 26px !important; }
  body.stock-viewer-mobile-mode #favoriteViewerScreen .favorite-viewer-section-head strong { font-size: 16px !important; }

  body.portal-mobile-mode :is(.v2-section-heading, .home-product-update-head) { gap: 8px !important; flex-wrap: wrap !important; }
  body.portal-mobile-mode .v2-heading-title-row { flex-wrap: wrap !important; gap: 6px !important; }
  body.portal-mobile-mode :is(.v2-pick-panel, .v2-page-card, .investor-directory-card) { padding: 12px !important; }
  body.portal-mobile-mode :is(.v2-recommendation-grid, .v2-options-analysis-grid, .v2-guide-grid) { grid-template-columns: minmax(0, 1fr) !important; gap: 10px !important; }
  body.portal-mobile-mode .home-product-update-stages { grid-template-columns: minmax(0, 1fr) !important; gap: 6px !important; }
  body.portal-mobile-mode .home-product-update-stage { padding: 8px !important; }
  body.portal-mobile-mode .home-product-update-stage :is(b, p) { font-size: 12px !important; line-height: 1.5 !important; }
  body:is(.portal-mobile-mode, .ark-mobile-mode, .stock-viewer-mobile-mode) .global-more-sheet {
    max-width: 100% !important;
    max-height: calc(100dvh - 12px - env(safe-area-inset-top, 0px)) !important;
    padding-bottom: env(safe-area-inset-bottom, 0px) !important;
  }
  body .global-more-sheet > header { padding: 12px 16px !important; }
  body .global-more-content { padding: 10px 12px !important; gap: 10px !important; }
  body .global-more-content section { padding: 10px !important; }
  body .global-more-content :is(a, button) { min-height: 44px !important; padding: 8px !important; }
  body .global-more-content strong { font-size: 13px !important; }
  body .global-more-content small { font-size: 11px !important; white-space: normal !important; }
}