/* H5 keeps real reading sizes and touch targets instead of shrinking the desktop UI. */
.detail-retry { margin-left: 14px; }
.account-actions { flex-wrap: wrap; gap: 5px 15px; }
.account-actions a.text-button { display: inline-flex; align-items: center; text-decoration: none; }
.filter-help { margin: 12px 0 0; line-height: 1.7; }
.filter-options-error { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-top: 12px; }
.filter-options-error .form-error { margin: 0; }
.filter-options-error .text-button { min-height: 36px; flex-shrink: 0; }
.filter-grid select[aria-busy="true"] { opacity: .65; }
.province-filter { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.searchable-select { position: relative; min-width: 0; }
.filter-grid .searchable-select input { padding-right: 44px; }
.searchable-select input[aria-busy="true"] { opacity: .65; }
.searchable-select input:disabled { background: #f0f1eb; color: #8a947f; }
.searchable-select-toggle { position: absolute; top: 0; right: 0; bottom: 0; width: 40px; border: 0; border-radius: 0 7px 7px 0; background: transparent; color: var(--muted); font-size: 20px; }
.searchable-select-popup { position: absolute; z-index: 20; top: calc(100% + 5px); left: 0; right: 0; overflow: auto; max-height: 240px; max-height: min(240px, 36dvh); overscroll-behavior: contain; border: 1px solid var(--line); border-radius: 8px; background: var(--white); box-shadow: 0 9px 25px #24342f20; padding: 5px; }
.searchable-select-popup ul { list-style: none; margin: 0; padding: 0; }
.searchable-select-popup [role="option"] { min-height: 40px; padding: 10px 12px; border-radius: 5px; cursor: pointer; overflow-wrap: anywhere; font-size: 13px; }
.searchable-select-popup [role="option"]:hover, .searchable-select-popup .is-active { background: var(--sage); color: var(--ink); }
.searchable-select-popup [aria-selected="true"] { color: var(--accent); font-weight: 600; }
.searchable-select-empty { margin: 0; padding: 12px 9px; color: var(--muted); font-size: 12px; line-height: 1.6; }
@media (max-width: 680px) {
  .searchable-select-popup [role="option"] { min-height: 44px; font-size: 16px; }
}
.index-status { margin: 18px 0; padding: 14px 18px; border: 1px solid var(--line); border-radius: 9px; background: var(--sage); color: var(--green); line-height: 1.7; }
.detail-actions { display: grid; gap: 9px; flex: 0 0 190px; }
.detail-actions p { margin: 0; line-height: 1.6; }
.detail-actions .button { min-height: 44px; }
.card-phone { margin-top: 8px; }
.phone-copy-group { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; max-width: 100%; }
.phone-copy { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 5px 10px; max-width: 100%; min-height: 36px; padding: 5px 9px; border: 1px solid var(--line); border-radius: 7px; background: var(--sage); color: var(--ink); font: inherit; text-align: left; }
.phone-number { overflow-wrap: anywhere; user-select: text; }
.phone-copy-caption { color: var(--accent); font-size: 12px; white-space: nowrap; }
.phone-copy-manual { width: 100%; min-width: 0; font-size: 16px; }
.phone-copy-help { width: 100%; font-size: 12px; color: var(--accent-dark); }
.clipboard-buffer { position: fixed; left: 0; top: 0; width: 1px; height: 1px; padding: 0; border: 0; opacity: 0; pointer-events: none; }
.contact-status-section { display: flex; justify-content: space-between; align-items: center; gap: 16px 24px; padding: 20px 28px; border-bottom: 1px solid var(--line); background: var(--white); }
.contact-status-heading { display: flex; align-items: center; flex-wrap: wrap; gap: 7px 12px; }
.contact-status-heading h3 { font-size: 14px; }
.contact-status-heading p { flex-basis: 100%; margin: 0; }
.contact-status-pill, .card-meta .contact-status-pill { display: inline-flex; align-items: center; padding: 4px 8px; border-radius: 6px; font-size: 12px; line-height: 1.5; }
.contact-uncontacted, .card-meta .contact-uncontacted { background: #f0f1eb; color: #68725c; }
.contact-failed, .card-meta .contact-failed { background: #fff0e8; color: #a54a34; }
.contact-success, .card-meta .contact-success { background: #eaf1e4; color: #3e6638; }
.contact-status-form { display: grid; grid-template-columns: minmax(125px, 1fr) auto; align-items: center; gap: 8px 10px; min-width: 270px; }
.contact-status-form select, .contact-status-form .button { min-height: 44px; }
.contact-status-form .form-error { grid-column: 1 / -1; margin: 0; }
@media (max-width: 680px) {
  .phone-copy { min-height: 44px; }
  input, select, textarea { font-size: 16px; }
  .sidebar { padding-top: 17px; }
  .nav-item { min-height: 46px; font-size: 13px; }
  .account-info strong { font-size: 12px; }
  .account-info span { font-size: 10px; }
  .account-panel .icon-button { min-width: 44px; min-height: 44px; }
  .account-actions .text-button { font-size: 12px; min-height: 40px; }
  .account-actions { gap: 18px; padding-top: 0; }
  .primary-nav { margin-top: 7px; }
  .page-header p:last-child { font-size: 12px; color: #737e69; }
  .page-header .button { min-height: 44px; font-size: 12px; padding: 9px 12px; }
  .section-heading h2, .results-toolbar h2 { font-size: 16px; }
  .section-heading .text-button { font-size: 12px; min-height: 40px; }
  .filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 10px; }
  .search-field { grid-column: 1 / -1; }
  .filter-grid label { font-size: 12px; gap: 7px; color: #5e6b54; }
  .filter-grid input, .filter-grid select { font-size: 16px; min-height: 44px; padding: 10px; }
  .filter-grid .input-icon input { padding-left: 30px; }
  .input-icon > span { font-size: 23px; top: 4px; left: 8px; }
  .income-field { grid-column: 1 / -1; }
  .filter-submit { grid-column: 1 / -1; min-height: 44px; font-size: 14px; }
  .filter-submit span { display: inline; }
  .filter-chip { font-size: 12px; padding: 5px 8px; color: #627451; }
  .result-count { font-size: 12px; color: #69795a; }
  .page-size { font-size: 12px; }
  .page-size select { width: 78px; min-height: 44px; font-size: 12px; }
  .card-title { font-size: 16px; min-height: 32px; }
  .card-sex { font-size: 12px; color: #737e69; }
  .card-title-row { align-items: flex-start; flex-wrap: wrap; gap: 1px 7px; }
  .card-region { font-size: 12px; color: #78846b; margin-top: 6px; }
  .card-meta { gap: 5px; min-height: 26px; }
  .card-meta span { font-size: 12px; padding: 3px 6px; color: #6d7a60; }
  .card-footer { flex-wrap: wrap; gap: 8px; }
  .card-income { font-size: 13px; }
  .card-income small { font-size: 11px; }
  .card-claim { min-height: 44px; font-size: 12px; padding: 9px 12px; margin-left: auto; }
  .status-pill { font-size: 11px; padding: 4px 7px; }
  .card-id { font-size: 10px; }
  .pagination { font-size: 12px; }
  .pagination .button { font-size: 12px; min-height: 44px; }
  .page-footer { font-size: 10px; color: #7c886d; }
  .empty-state p { font-size: 13px; }
  .empty-state .button { min-height: 44px; }
  .form-error, .error-banner { font-size: 13px; }
  .dialog-topbar .icon-button { width: 44px; height: 44px; }
  .detail-identity > p { font-size: 12px; }
  .detail-identity .tag-row { margin-top: 9px; }
  .tag-row span { font-size: 12px; padding: 3px 7px; }
  .detail-hero > .button { min-height: 44px; font-size: 14px; }
  .detail-actions { flex: 0 0 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .detail-actions .button { font-size: 14px; }
  .detail-actions p, #detail-claim[hidden] + #detail-call { grid-column: 1 / -1; }
  .contact-status-section { padding: 18px 17px; flex-wrap: wrap; }
  .contact-status-heading h3 { font-size: 16px; }
  .contact-status-form { width: 100%; min-width: 0; grid-template-columns: minmax(0, 1fr) auto; }
  .contact-status-form select { font-size: 16px; }
  .facts-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 12px; }
  .facts-grid dt { font-size: 12px; color: #758269; }
  .facts-grid dd { font-size: 14px; }
  .detail-section h3, .notes-heading h3 { font-size: 16px; }
  .small { font-size: 12px; }
  .field-list { grid-template-columns: minmax(105px, .8fr) minmax(0, 1.2fr); font-size: 12px; }
  .field-list dt { color: #6f7d61; }
  .field-list dt small { font-size: 10px; color: #7d8c6d; }
  .field-group summary { font-size: 12px; min-height: 44px; padding-top: 12px; padding-bottom: 12px; }
  .notes-panel textarea { font-size: 16px; }
  .note-form-footer .button { font-size: 13px; min-height: 44px; }
  .note-form-footer .small { font-size: 11px; }
  .note time { font-size: 12px; color: #748364; }
  .note p { font-size: 14px; }
  .notes-empty { font-size: 13px; }
  #notes-more { min-height: 44px; font-size: 13px; }
  .login-card > label, .dialog-form > label, .account-form > label { font-size: 13px; }
  .login-card input, .dialog-form input, .account-form input, .account-form select { font-size: 16px; }
  .login-tip { font-size: 12px; }
  .account-row strong { font-size: 14px; }
  .account-row small, .account-row > span { font-size: 12px; }
  .toast { font-size: 13px; }
}
@media (max-width: 420px) {
  .profile-grid { grid-template-columns: 1fr; gap: 17px; }
  .portrait-button { aspect-ratio: 1.45; }
  .card-content { padding: 15px 17px; }
  .card-title-row { flex-wrap: nowrap; align-items: center; }
  .card-title { font-size: 18px; }
  .card-sex { font-size: 13px; }
  .card-meta { margin-top: 12px; }
  .card-footer { margin-top: 14px; padding-top: 12px; }
  .card-income { font-size: 15px; }
  .card-claim { padding-left: 20px; padding-right: 20px; }
  .card-overlay { left: 14px; right: 14px; bottom: 12px; }
  .result-count { max-width: none; }
  .results-toolbar > div { gap: 5px; }
  .skeleton { height: 390px; }
  .page-header { align-items: flex-start; }
  .page-header .button { padding: 9px; flex-shrink: 0; }
  .page-header p:last-child { max-width: 205px; }
}