:root{--bg:#0b1220;--card:#0f1a33;--muted:#93a4c7;--text:#e8eefc;--line:#1c2a4d}
*{box-sizing:border-box;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial}
body{margin:0;background:linear-gradient(180deg,#070c16,#0b1220);color:var(--text)}
a{color:inherit;text-decoration:none}
.wrap{max-width:1200px;margin:0 auto;padding:20px}
.topbar{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:14px 18px;border:1px solid var(--line);background:rgba(15,26,51,.75);border-radius:14px;position:sticky;top:12px;backdrop-filter:blur(10px)}
.brand{display:flex;gap:10px;align-items:center}
.pill{font-size:12px;padding:4px 10px;border:1px solid var(--line);border-radius:999px;color:var(--muted)}
.nav{display:flex;gap:10px;align-items:center}
.btn{display:inline-flex;gap:8px;align-items:center;padding:10px 12px;border:1px solid var(--line);background:rgba(255,255,255,.08);color:var(--text);border-radius:12px;cursor:pointer}
.btn:hover{background:rgba(255,255,255,.12);color:var(--text)}
.grid{display:grid;gap:14px;grid-template-columns:repeat(12,1fr);margin-top:14px}
.card{grid-column:span 12;border:1px solid var(--line);background:rgba(15,26,51,.65);border-radius:16px;padding:14px}
.kpi{display:flex;flex-direction:column;gap:4px}
.kpi .v{font-size:26px;font-weight:700}
.kpi .l{font-size:12px;color:var(--muted)}
@media (min-width:900px){
  .span3{grid-column:span 3}
  .span4{grid-column:span 4}
  .span6{grid-column:span 6}
  .span8{grid-column:span 8}
}
table{width:100%;border-collapse:collapse}
th,td{padding:10px;border-bottom:1px solid var(--line);font-size:13px;text-align:left;vertical-align:top}
th{color:var(--muted);font-weight:600}
.input,select,textarea{width:100%;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--text)}
textarea{resize:vertical}
.row{display:flex;gap:10px;flex-wrap:wrap}
.row>*{flex:1;min-width:200px}
.small{color:var(--muted);font-size:12px}
hr{border:none;border-top:1px solid var(--line);margin:14px 0}
.tag{display:inline-block;padding:3px 8px;border:1px solid var(--line);border-radius:999px;font-size:12px;color:var(--muted)}
.ok{color:#9fe3b0}
.warn{color:#ffd98a}
.bad{color:#ff9aa8}
pre{white-space:pre-wrap;word-break:break-word}


/* Dropdown readability fixes (Chrome/Edge) */
select, option {
  color: var(--text);
  background-color: var(--card);
}
select:focus, .input:focus {
  outline: none;
  box-shadow: 0 0 0 2px rgba(147,164,199,0.25);
}
.input::placeholder {
  color: rgba(147,164,199,0.75);
}


/* Stronger dropdown theme enforcement */
body { color-scheme: dark; }
select {
  color: var(--text) !important;
  background-color: rgba(255,255,255,0.03) !important;
}
select option {
  color: var(--text) !important;
  background-color: var(--card) !important;
}



/* table overflow */
.table-wrap{ overflow-x:auto; }

/* helpers */
.nowrap th, .nowrap td{ white-space:nowrap; }

/* Top ZIP3 table: reclaim width */
#t_zip3_table th, #t_zip3_table td { white-space: nowrap; }
#t_zip3_table th, #t_zip3_table td { padding: 8px 8px; }
#t_zip3_table th:nth-child(1), #t_zip3_table td:nth-child(1) { width: 10%; } /* ZIP3 */
#t_zip3_table th:nth-child(2), #t_zip3_table td:nth-child(2) { width: 12%; } /* Total */
#t_zip3_table th:nth-child(3), #t_zip3_table td:nth-child(3) { width: 14%; } /* Submitted */
#t_zip3_table th:nth-child(4), #t_zip3_table td:nth-child(4) { width: 12%; } /* Sub % */
#t_zip3_table th:nth-child(5), #t_zip3_table td:nth-child(5) { width: 14%; } /* Avg sig */
#t_zip3_table th:nth-child(6), #t_zip3_table td:nth-child(6) { width: 12%; } /* Avg BMI */
#t_zip3_table td { font-variant-numeric: tabular-nums; }

/* Tight tables (fit 5 cols without scroll) */
.table-tight th, .table-tight td{
  white-space: nowrap;
  padding: 8px 8px;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}

/* Leads table compaction */
.leads-table th, .leads-table td { white-space: nowrap; }
.leads-table th, .leads-table td { padding: 9px 8px; font-variant-numeric: tabular-nums; }

/* Leads column alignment (match headings) */
.leads-table td:nth-child(6), .leads-table th:nth-child(6) { text-align: center; } /* Zip */
.leads-table td:nth-child(7), .leads-table th:nth-child(7) { text-align: center; } /* Signal */
.leads-table td:nth-child(8), .leads-table th:nth-child(8) { text-align: center; } /* Outcome */
.leads-table td:nth-child(10), .leads-table th:nth-child(10){ text-align: center; } /* EF value */
/* Click-sort headers */
th.sortable{ cursor:pointer; user-select:none; position:relative; }
th.sortable.asc::after{ content:" ▲"; color:#93a4c7; font-size:12px; }
th.sortable.desc::after{ content:" ▼"; color:#93a4c7; font-size:12px; }

/* Leads: prevent long Doctor/Lead from blowing layout */
.leads-table{ table-layout: fixed; width: 100%; }
.leads-table th, .leads-table td{ overflow: hidden; text-overflow: ellipsis; }

/* allow horizontal scroll on smaller viewports without bleeding outside the card */
.table-card{ overflow-x: auto; }

/* Rebalance widths (checkbox + 11 columns) */
.leads-table th:nth-child(1), .leads-table td:nth-child(1){ width: 42px; text-align:center; } /* select */
.leads-table th:nth-child(2), .leads-table td:nth-child(2){ width: 72px; }   /* ID */
.leads-table th:nth-child(3), .leads-table td:nth-child(3){ width: 140px; }  /* When */
.leads-table th:nth-child(4), .leads-table td:nth-child(4){ width: 90px; }   /* Stage */
.leads-table th:nth-child(5), .leads-table td:nth-child(5){ width: 150px; }  /* Current status */
.leads-table th:nth-child(6), .leads-table td:nth-child(6){ width: 70px; }   /* Zip */
.leads-table th:nth-child(7), .leads-table td:nth-child(7){ width: 70px; }   /* Signal */
.leads-table th:nth-child(8), .leads-table td:nth-child(8){ width: 80px; }   /* Outcome */
.leads-table th:nth-child(9), .leads-table td:nth-child(9){ width: 95px; }   /* EF band */
.leads-table th:nth-child(10), .leads-table td:nth-child(10){ width: 70px; } /* EF value */
.leads-table th:nth-child(11), .leads-table td:nth-child(11){ width: 180px; }/* Doctor */
.leads-table th:nth-child(12), .leads-table td:nth-child(12){ width: 220px; }/* Lead */

html,body{ touch-action: manipulation; }

/* Chart cards: stable fixed-height chart area (prevents resize feedback loops) */
.chart-card{ display:flex; flex-direction:column; }
.chart-area{ position:relative; height:320px; }
.chart-area canvas{ position:absolute; inset:0; width:100% !important; height:100% !important; }