/* Helix leads — same family as the IA Feed Explorer: ledger greens, Archivo display, Plex body/data. */
:root{
  --bg:#eceee9; --surface:#fafbf8; --ink:#16201b; --muted:#5a6761; --line:#d4d9d2;
  --accent:#1d6a50; --accent-soft:#dbeae2; --accent-ink:#fff; --hover:#eef3ef;
  --warn:#8d4a10; --warn-soft:#f6ead8; --bad:#9b2c2c; --bad-soft:#f7e3e1; --p1:#5b3fa0; --p1-soft:#ebe5f7;
  --f-display:"Archivo","Helvetica Neue",Arial,sans-serif;
  --f-body:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-data:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,monospace;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root{
  --bg:#0f1412; --surface:#161d1a; --ink:#e3eae6; --muted:#9aa8a1; --line:#2b3631;
  --accent:#5cc39a; --accent-soft:#1b3328; --accent-ink:#0b1410; --hover:#1c2521;
  --warn:#e8ac66; --warn-soft:#33281a; --bad:#f0948a; --bad-soft:#3a1f1d; --p1:#bba6ef; --p1-soft:#2a2340;
  color-scheme:dark;
}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.5 var(--f-body)}
a{color:var(--accent)} a:hover{text-decoration:underline}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.muted{color:var(--muted);font-size:13px}
.warn{color:var(--warn)}
.empty{color:var(--muted);font-style:italic;margin:6px 0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
code{font-family:var(--f-data);font-size:12px}

.top{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:12px 28px;flex-wrap:wrap;padding:10px 20px;background:var(--surface);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none}
.brand:hover{text-decoration:none}
.brand .mark{display:grid;place-items:center;width:30px;height:30px;border-radius:7px;background:var(--accent);color:var(--accent-ink);font:800 16px var(--f-display)}
.brand b{display:block;font:750 17px/1.1 var(--f-display);font-stretch:85%}
.brand small{display:block;font:11px var(--f-data);color:var(--muted)}
.top nav{display:flex;gap:4px;flex-wrap:wrap;flex:1}
.top nav a{padding:7px 12px;border-radius:6px;color:var(--ink);text-decoration:none;font-weight:500}
.top nav a:hover{background:var(--hover)}
.top nav a.on{background:var(--accent-soft);color:var(--accent)}
.who{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}

main{max-width:1400px;margin:0 auto;padding:20px 20px 60px}
.head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:6px 0 16px}
h1{margin:0;font:750 30px/1.1 var(--f-display);font-stretch:85%;letter-spacing:-.01em}
h2{margin:0 0 10px;font:700 16px/1.2 var(--f-display);font-stretch:90%;display:flex;align-items:center;gap:8px}
h3{margin:16px 0 8px;font:600 13px var(--f-body);text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.mt{margin-top:22px}
.lede{margin:6px 0 0;color:var(--muted)}
.count{font:500 12px var(--f-data);color:var(--muted);background:var(--hover);padding:1px 7px;border-radius:999px}
.count.big{font-size:15px;vertical-align:middle}
.back{display:inline-block;margin-bottom:4px;font-size:13px}

.card{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:16px 18px;margin-bottom:16px}
.card.warn{border-color:var(--warn)} .card.warn h2{color:var(--warn)}
.card.start ol{margin:0;padding-left:20px} .card.start li{margin:6px 0}
.grid2{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:16px}
.firmgrid{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
@media (max-width:900px){.grid2,.firmgrid{grid-template-columns:1fr}}

.btn{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:6px 14px;border:1px solid var(--line);background:var(--surface);border-radius:7px;cursor:pointer;color:var(--ink);text-decoration:none;white-space:nowrap}
.btn:hover{background:var(--hover);text-decoration:none}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}
.btn.primary:hover{filter:brightness(1.07)}
button.link{background:none;border:0;padding:0;color:var(--muted);font-size:12px;cursor:pointer;text-decoration:underline}

input,select,textarea{background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:7px 9px;min-height:36px;max-width:100%}
textarea{width:100%;resize:vertical}
label{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:600;color:var(--muted)}
label input,label select,label textarea{font-weight:400;color:var(--ink);font-size:14px}

.filters{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin-bottom:12px}
.filters .grow{flex:1;min-width:200px} .filters .grow input{width:100%}
.inline{display:flex;gap:8px;align-items:flex-end}

.bulkbar{position:sticky;top:58px;z-index:4;display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;padding:10px 14px;margin-bottom:10px;background:var(--accent-soft);border:1px solid var(--accent);border-radius:10px}
.bulkbar[hidden]{display:none}

.tablewrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:10px}
table.leads{width:100%;border-collapse:collapse}
table.leads th{position:sticky;top:0;text-align:left;font:600 11px var(--f-body);text-transform:uppercase;letter-spacing:.05em;color:var(--muted);padding:10px 10px;border-bottom:1px solid var(--line);background:var(--surface)}
table.leads td{padding:10px;border-bottom:1px solid var(--line);vertical-align:top}
table.leads tr:hover td{background:var(--hover)}
table.leads .num{text-align:right;font-family:var(--f-data);font-size:13px;white-space:nowrap}
table.leads td.why{font-size:13px;max-width:320px}
.firmname{font-weight:600;color:var(--ink)}
.pager{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:16px}

.pill{display:inline-block;padding:1px 8px;border-radius:999px;font:600 11px var(--f-body);letter-spacing:.03em;background:var(--hover);color:var(--muted);border:1px solid var(--line);white-space:nowrap}
.pill.p1{background:var(--p1-soft);color:var(--p1);border-color:transparent}
.pill.seg{background:transparent}
.pill.warn{background:var(--warn-soft);color:var(--warn);border-color:transparent}
.score{display:inline-grid;place-items:center;min-width:34px;height:24px;padding:0 6px;border-radius:6px;font:600 13px var(--f-data);
  background:color-mix(in srgb, var(--accent) calc(var(--s) * 0.9%), var(--surface));color:var(--ink)}
.score.big{height:30px;min-width:42px;font-size:16px;vertical-align:middle}

.stage{display:inline-block;padding:2px 9px;border-radius:6px;font:600 12px var(--f-body);background:var(--hover);color:var(--ink);white-space:nowrap}
.s-researching{background:#e4ecf7;color:#234a7c}
.s-contacted{background:#e7e4f7;color:#46348f}
.s-replied{background:#f7efd6;color:#7a5600}
.s-call-booked{background:#f7e3d4;color:#8a3f0c}
.s-teardown-trial-sent{background:#dcefe8;color:#1d5e47}
.s-customer{background:var(--accent);color:var(--accent-ink)}
.s-not-now,.s-not-a-fit{background:transparent;color:var(--muted);border:1px dashed var(--line)}
@media (prefers-color-scheme: dark){
  .s-researching{background:#1c2a3d;color:#9cc0ee} .s-contacted{background:#26203f;color:#bcaef2}
  .s-replied{background:#3a301a;color:#ebc76e} .s-call-booked{background:#3b2618;color:#f0ad7e}
  .s-teardown-trial-sent{background:#183129;color:#86d4b4}
}
.due{font:500 12px var(--f-data)} .due.late{color:var(--bad);font-weight:600}

ul.tasks,ul.feed,ul.stagecounts,ul.pluses{list-style:none;margin:0;padding:0}
ul.tasks li,ul.feed li{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;padding:9px 0;border-bottom:1px solid var(--line)}
ul.tasks li:last-child,ul.feed li:last-child{border-bottom:0}
.meta{margin-left:auto;display:flex;gap:6px;align-items:center;font-size:12px;color:var(--muted)}
ul.stagecounts li{display:flex;justify-content:space-between;align-items:center;padding:6px 0}
ul.stagecounts a:hover{text-decoration:none}
.kind{font:600 11px var(--f-body);text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.k-stage{color:var(--accent)} .k-call,.k-meeting{color:var(--p1)}
.feed .body{white-space:pre-wrap}

.firmhead{align-items:flex-start}
.links{display:flex;gap:14px;margin:8px 0 0;font-weight:500}
.verdict{display:flex;flex-direction:column;align-items:flex-end;gap:6px;text-align:right}
.listname{font:700 14px var(--f-display);padding:4px 10px;border-radius:6px}
.l-core{background:var(--accent);color:var(--accent-ink)} .l-wide{background:var(--accent-soft);color:var(--accent)}
.l-qualified,.l-out{background:var(--warn-soft);color:var(--warn)}
@media (max-width:700px){.verdict{align-items:flex-start;text-align:left}}

.stateform,.contactform,.settingsform{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;align-items:end}
.stateform .wide,.contactform .wide{grid-column:1/-1}
.logform{display:flex;flex-direction:column;gap:10px}
.logform .row{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.logform .wide{flex:1;min-width:200px}

ol.steps{list-style:none;margin:0;padding:0}
ol.steps li{display:flex;gap:10px;padding:9px 0;border-bottom:1px solid var(--line)}
ol.steps li:last-child{border-bottom:0}
ol.steps .tick{flex:none;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;font-weight:700;font-size:12px}
ol.steps .ok .tick{background:var(--accent-soft);color:var(--accent)}
ol.steps .no .tick{background:var(--bad-soft);color:var(--bad)}
ol.steps.plain{list-style:decimal;padding-left:20px} ol.steps.plain li{display:list-item}
ul.pluses li{display:flex;justify-content:space-between;padding:5px 0;border-bottom:1px dashed var(--line)}
ul.pluses b{font-family:var(--f-data);color:var(--accent)}
blockquote{margin:12px 0 0;padding:8px 12px;border-left:3px solid var(--line);color:var(--muted);font-size:13px}

.person{padding:10px 0;border-bottom:1px solid var(--line)}
.person.optout{opacity:.65}
details.add{margin-top:12px} details.add summary{cursor:pointer;font-weight:600;color:var(--accent);margin-bottom:10px}

dl.facts{display:grid;grid-template-columns:1fr auto;gap:6px 16px;margin:0}
dl.facts dt{color:var(--muted)} dl.facts dd{margin:0;text-align:right;font-family:var(--f-data);font-size:13px}
dl.facts.big dd{font-size:18px;font-weight:600}
table.mini{width:100%;border-collapse:collapse;font-size:12px;font-family:var(--f-data)}
table.mini th,table.mini td{padding:4px 6px;border-bottom:1px solid var(--line);text-align:right}
table.mini th:first-child,table.mini td:first-child{text-align:left}

.hint{margin:-6px 0 12px}
.board{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(230px,1fr);gap:12px;overflow-x:auto;padding-bottom:12px}
.col{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:10px;min-height:300px}
.col.over{border-color:var(--accent);background:var(--accent-soft)}
.cards{display:flex;flex-direction:column;gap:8px;min-height:200px}
.kcard{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px;display:flex;flex-direction:column;gap:6px;cursor:grab}
.kcard.dragging{opacity:.5}
.kcard .meta{margin-left:0}

.loginpage{display:grid;place-items:center;min-height:100vh;padding:20px}
.login{width:100%;max-width:380px;display:flex;flex-direction:column;gap:18px;padding:0}
.login .brand{display:flex;align-items:center;gap:10px}
.login .brand .mark{display:grid;place-items:center;width:34px;height:34px;border-radius:8px;background:var(--accent);color:var(--accent-ink);font:800 18px var(--f-display)}
.login .brand b{display:block;font:750 19px/1.1 var(--f-display);font-stretch:85%}
.login .brand small{display:block;font:11px var(--f-data);color:var(--muted)}
.login form{display:flex;flex-direction:column;gap:14px}
.login h1{font-size:24px}
.login .btn{justify-content:center}
.error{margin:0;padding:8px 10px;border-radius:6px;background:var(--bad-soft);color:var(--bad);font-weight:600}

.pill.client{background:var(--accent);color:var(--accent-ink);border-color:transparent}
.pill.src{background:var(--warn-soft);color:var(--warn);border-color:transparent}
.head .actions{display:flex;gap:8px;flex-wrap:wrap}
.formgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.formgrid .wide{grid-column:1/-1}
.row-end{display:flex;justify-content:flex-end;margin-top:16px}

/* phones: brand + user on one row, the menu as one swipeable row underneath */
@media (max-width:760px){
  .top{gap:8px 12px;padding:10px 14px}
  .top nav{order:3;flex:1 0 100%;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .top nav a{white-space:nowrap;padding:8px 10px}
  .who{margin-left:auto}
  .who label{display:none}
  main{padding:14px 14px 48px}
  h1{font-size:24px}
  .filters label{flex:1 1 140px}
  .verdict{align-items:flex-start;text-align:left}
}
