/* Phone task ergonomics. Keep desktop layout and business behavior unchanged. */
@media (max-width: 768px) {
  html body #app .guide-module-rail { display: flex !important; flex-wrap: nowrap !important; overflow-x: auto; }
  html body #app .guide-module-chip { flex: 0 0 auto; min-height: 44px; }
  html body #app .guide-input-shell > button { min-width: 44px !important; min-height: 44px !important; }
  html body #app .guide-chat-eyebrow { display: none; }
  html body #app .guide-chat-heading { min-width: 0; }
  html body #app .guide-chat-header-status { flex-shrink: 0; }
  html body .setup-modal-card input { min-height: 44px !important; font-size: 16px !important; }
  html body .setup-switch-track-btn,
  html body .btn-ghost-preference { min-height: 44px !important; }
  html body #app .mobile-back-button,
  html body #app .guide-chat-back,
  html body #app .review-chat-back,
  html body #app .review-header-action {
    min-width: 44px !important;
    min-height: 44px !important;
    flex-shrink: 0;
  }
  html body #app input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  html body #app textarea, html body #app select {
    font-size: 16px !important;
  }
  html body #app .refined-identity-card {
    display: grid !important;
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 12px !important;
    padding: 18px !important;
  }
  html body #app .refined-identity-card .identity-edit {
    grid-column: 1 / -1;
    justify-self: end;
    min-height: 44px;
  }
  html body #app .refined-identity-card .identity-title-row { flex-wrap: wrap; }
  html body #app .refined-identity-card h1 { overflow-wrap: anywhere; }
  html body #app .resume-more summary { min-height: 44px; }
  html body #app .category-tabs {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    padding: 8px !important;
    max-width: 100%;
    scroll-padding: 8px;
  }
  html body #app .category-tabs .category-tab {
    flex: 0 0 auto !important;
    width: auto !important;
    min-height: 44px !important;
    padding: 10px 14px !important;
    white-space: nowrap;
  }
  html body #app .recommendation-workbench .workbench-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    gap: 8px !important;
  }
  html body #app .recommendation-workbench .workbench-primary-action {
    grid-column: 1 / -1 !important;
    white-space: normal !important;
    min-height: 46px !important;
  }
  html body #app .recommendation-workbench .workbench-actions > button {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;
  }
  html body #app .interview-wrapper .header-stats {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    gap: 8px !important;
  }
  html body #app .interview-wrapper .header-stats .stat-item {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between;
    gap: 12px;
  }
  html body #app .interview-wrapper .header-stats .stat-value { white-space: nowrap; }
  html body #app .interview-wrapper .header-btn-group { width: 100%; }
  html body #app .interview-wrapper .header-btn-group > button { flex: 1; min-height: 44px; }
  html body #app .mobile-accordion-editor { padding-left: 6px !important; padding-right: 6px !important; }
  html body #app .mobile-accordion-editor .m-acc-body { padding: 10px !important; }
  html body #app .mobile-accordion-editor .m-item-card { padding: 10px !important; }
  html body #app .mobile-accordion-editor .m-item-ops button,
  html body #app .mobile-accordion-editor .m-item-head .del {
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
  }
  html body #app .mobile-accordion-editor .m-item-head { flex-wrap: wrap; gap: 8px; }
  html body #app .guide-conversation-workspace {
    display: flex !important;
    flex-direction: column !important;
    overflow-y: auto !important;
  }
  html body #app .guide-conversation-workspace .guide-chat-panel {
    order: -1;
    flex: 0 0 auto;
    min-height: 420px !important;
    height: min(650px, 75dvh);
  }
  html body #app .guide-conversation-workspace .guide-preview-pane {
    flex: 0 0 auto;
    min-height: 460px;
    border-top: 1px solid #e2e8f0;
  }
  html body #app .premium-search-input { min-height: 44px !important; }
  html body #app .focus-link, html body #app .bulk-application-back { min-height: 44px !important; }
}
