/* Prospects register. Desktop first, usable at 390px. */
.px-app { color: #0f172a; font: 14px/1.45 system-ui, -apple-system, "Segoe UI", sans-serif; }
.px-app h2 { margin: 0; font-size: 1.45rem; font-weight: 650; letter-spacing: -0.02em; }
.px-lead { margin: 0.25rem 0 0; color: #475569; font-size: 0.85rem; max-width: 46rem; }
.px-banner { margin: 0.75rem 0 0; padding: 0.55rem 0.75rem; background: #fff7ed; color: #9a3412; border-radius: 8px; font-size: 0.8rem; }
.px-error { margin: 0.75rem 0 0; padding: 0.75rem; background: #fef2f2; color: #991b1b; border-radius: 8px; }
.px-tabs { display: flex; flex-wrap: wrap; gap: 0.35rem; margin: 0.9rem 0 0.75rem; }
.px-tab { border: 1px solid #cbd5e1; background: #fff; color: #334155; border-radius: 999px; padding: 0.35rem 0.75rem; cursor: pointer; font: inherit; }
.px-tab[aria-selected="true"] { background: #0f766e; border-color: #0f766e; color: #fff; }
.px-count { display: inline-block; min-width: 1.1rem; margin-left: 0.25rem; padding: 0 0.3rem; border-radius: 999px; background: rgba(255,255,255,0.25); font-size: 0.75rem; }
.px-tab:not([aria-selected="true"]) .px-count { background: #e2e8f0; }
.px-filters { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 0.75rem; }
.px-filters label { display: flex; flex-direction: column; gap: 0.15rem; font-size: 0.72rem; color: #64748b; min-width: 8rem; flex: 1 1 8rem; }
.px-filters input, .px-filters select, .px-form input, .px-form select, .px-edit input { border: 1px solid #cbd5e1; border-radius: 8px; padding: 0.4rem 0.5rem; font: inherit; background: #fff; color: inherit; }
.px-map { height: 520px; border-radius: 12px; overflow: hidden; background: #e2e8f0; border: 1px solid #e2e8f0; }
.px-legend { display: flex; gap: 0.9rem; margin: 0.45rem 0 0; font-size: 0.75rem; color: #475569; }
.px-dot { display: inline-block; width: 0.65rem; height: 0.65rem; border-radius: 99px; margin-right: 0.25rem; vertical-align: -1px; }
.px-dot.owned { background: #1d4ed8; }
.px-dot.acquired { background: #0f766e; }
.px-dot.divested { background: #94a3b8; }
.px-dot.empty { background: #cbd5e1; }
.px-summary { margin: 0.75rem 0 0; padding: 0.55rem 0.75rem; background: #f0fdfa; color: #115e59; border-radius: 10px; font-weight: 650; }
.px-chips { display: flex; flex-wrap: wrap; gap: 0.25rem; margin-top: 0.35rem; }
.px-chip { display: inline-block; border-radius: 999px; padding: 0.08rem 0.45rem; font-size: 0.72rem; font-weight: 650; border: 1px solid #e2e8f0; color: #94a3b8; background: #f8fafc; white-space: nowrap; }
.px-chip.on { border-color: #99f6e4; background: #ccfbf1; color: #115e59; }
.px-table tr.px-empty { opacity: 0.55; }
.px-table tr.px-rappel td { background: #f5f3ff; }
.px-table tr.px-rappel td:first-child { box-shadow: inset 4px 0 0 #6d28d9; }
.px-table tr.px-rappel:hover td { background: #ede9fe; }
.px-detail.px-rappel { border-left: 4px solid #6d28d9; background: #f5f3ff; }
.px-match { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem; margin-top: 0.35rem; font-size: 0.75rem; color: #5b21b6; }
.px-match-flag { font-weight: 700; color: #6d28d9; }
.px-match-score { font-weight: 700; }
.px-match-actions { display: inline-flex; gap: 0.25rem; }
.px-match .px-btn { padding: 0.12rem 0.45rem; font-size: 0.72rem; }
.px-data { min-width: 16rem; }
.px-table-wrap { overflow-x: auto; border: 1px solid #e2e8f0; border-radius: 12px; background: #fff; }
.px-table { width: 100%; border-collapse: collapse; }
.px-table th, .px-table td { text-align: left; padding: 0.55rem 0.7rem; border-bottom: 1px solid #f1f5f9; vertical-align: top; }
.px-table th { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: #64748b; background: #f8fafc; }
.px-table tr { cursor: pointer; }
.px-table tr:hover td { background: #f8fafc; }
.px-muted { color: #64748b; }
.px-badge { display: inline-block; border-radius: 999px; padding: 0.05rem 0.45rem; font-size: 0.72rem; font-weight: 650; }
.px-badge.high { background: #ccfbf1; color: #115e59; }
.px-badge.mid { background: #fef3c7; color: #92400e; }
.px-badge.low { background: #fee2e2; color: #991b1b; }
.px-flag { display: inline-block; margin-left: 0.35rem; font-size: 0.72rem; color: #9a3412; }
.px-cards { display: grid; gap: 0.6rem; }
.px-card, .px-detail { background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; padding: 0.8rem 0.9rem; }
.px-card h3, .px-detail h3 { margin: 0 0 0.25rem; font-size: 1rem; }
.px-row-actions, .px-actions { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.55rem; }
.px-app button.px-btn, .px-btn { border: 1px solid #cbd5e1; background: #fff; border-radius: 8px; padding: 0.35rem 0.65rem; font: inherit; cursor: pointer; }
.px-btn.primary { background: #0f766e; border-color: #0f766e; color: #fff; }
.px-btn.danger { color: #991b1b; }
.px-back { margin-bottom: 0.6rem; }
.px-facts { display: grid; gap: 0.45rem; margin-top: 0.7rem; }
.px-fact { display: grid; grid-template-columns: 7rem 1fr; gap: 0.4rem; padding-bottom: 0.4rem; border-bottom: 1px solid #f1f5f9; }
.px-fact a { color: #0f766e; }
.px-section { margin-top: 1rem; }
.px-section h4 { margin: 0 0 0.4rem; font-size: 0.85rem; }
.px-form { display: grid; gap: 0.45rem; margin-top: 0.6rem; }
.px-form label { display: grid; gap: 0.15rem; font-size: 0.75rem; color: #64748b; }
.px-note { font-size: 0.8rem; color: #64748b; }
.px-fallback { padding: 0.8rem; }
.px-fallback button { display: block; width: 100%; text-align: left; margin-top: 0.35rem; }

@media (max-width: 720px) {
  .px-map { height: 280px; }
  .px-filters label { flex: 1 1 100%; }
  .px-table thead { display: none; }
  .px-table, .px-table tbody, .px-table tr, .px-table td { display: block; width: 100%; }
  .px-table tr { border-bottom: 8px solid #f8fafc; }
  .px-table td { border: 0; padding: 0.2rem 0.7rem; }
  .px-table td:first-child { padding-top: 0.65rem; font-weight: 650; }
  .px-table td:last-child { padding-bottom: 0.65rem; }
  .px-fact { grid-template-columns: 1fr; }
}
