:root{--ink:#1e1b3a;--muted:#55566b;--line:#d9dbe6;--bg:#f5f6fa;--card:#fff;--accent:#3730a3;--accent-ink:#fff;
--green:#14532d;--green-bg:#dcfce7;--amber:#78350f;--amber-bg:#fef3c7;--grey:#374151;--grey-bg:#e5e7eb;--red:#7f1d1d;--red-bg:#fee2e2;--blue:#1e3a8a;--blue-bg:#dbeafe}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:16px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--ink);background:var(--bg)}
.wrap{max-width:1080px;margin:0 auto;padding:0 16px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#fff;padding:8px;z-index:9}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.top{background:#fff;border-bottom:1px solid var(--line);padding:16px 0}
h1{font-size:1.5rem;margin:0 0 4px;line-height:1.25}
h2{font-size:1.15rem;margin:0 0 8px}h3{font-size:1rem;margin:16px 0 6px}
.what{margin:0 0 8px;color:var(--muted)}
.proto{margin:0;background:var(--amber-bg);color:var(--amber);padding:8px 12px;border-radius:8px;font-size:.9rem}
.tabs{display:flex;gap:4px;margin:16px 0;overflow-x:auto;border-bottom:2px solid var(--line)}
.tabs button{border:0;background:none;padding:10px 14px;font:inherit;font-weight:600;color:var(--muted);cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-2px;white-space:nowrap}
.tabs button[aria-selected=true]{color:var(--accent);border-color:var(--accent)}
:focus-visible{outline:3px solid #f59e0b;outline-offset:2px}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;margin-bottom:16px;min-width:0}
.grid2{display:grid;grid-template-columns:1fr;gap:16px}
@media(min-width:860px){.grid2{grid-template-columns:1fr 1fr}}
.muted{color:var(--muted);font-size:.9rem;margin:0 0 8px}
.field{margin-bottom:12px}.field label,label.inline{display:block;font-weight:600;font-size:.9rem;margin-bottom:4px}
label.inline{display:inline;margin-right:6px}
input,select,textarea{width:100%;font:inherit;padding:9px 10px;border:1px solid #8a8da3;border-radius:8px;background:#fff;color:var(--ink)}
select#filter{width:auto}
textarea{resize:vertical}
.row2{display:grid;grid-template-columns:1fr;gap:0 12px}
@media(min-width:480px){.row2{grid-template-columns:1fr 1fr}}
.field.check{display:flex;gap:8px;align-items:center}.field.check input{width:auto}.field.check label{margin:0}
.err{color:#b91c1c;font-size:.85rem;margin:4px 0 0;min-height:0}.err:empty{display:none}
input[aria-invalid=true],textarea[aria-invalid=true]{border-color:#b91c1c}
.btn{font:inherit;font-weight:600;padding:9px 14px;border-radius:8px;border:1px solid var(--accent);background:#fff;color:var(--accent);cursor:pointer}
.btn.primary{background:var(--accent);color:var(--accent-ink)}
.btn.good{background:#166534;border-color:#166534;color:#fff}
.btn.danger{border-color:#991b1b;color:#991b1b}
.btn:hover{filter:brightness(.95)}
.presets{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.chip{font:inherit;font-size:.85rem;padding:6px 10px;border-radius:999px;border:1px solid var(--line);background:#eef0f8;color:var(--ink);cursor:pointer}
.pipeline{list-style:none;padding:0;margin:0 0 8px;display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.pipeline li{font-size:.8rem;text-align:center;padding:8px 2px;border-radius:8px;background:var(--grey-bg);color:var(--grey);font-weight:600}
.pipeline li.done{background:var(--green-bg);color:var(--green)}.pipeline li.skip{background:#f3f4f6;color:#6b7280;text-decoration:line-through}
.live{margin:6px 0 10px;font-weight:600}
pre{background:#101828;color:#e5e7eb;padding:10px;border-radius:8px;overflow:auto;max-height:260px;font:12.5px/1.45 ui-monospace,Consolas,monospace;white-space:pre-wrap;word-break:break-word}
summary{cursor:pointer;font-weight:600;margin:6px 0}
.notices{list-style:none;padding:0;margin:0}.notices li{background:var(--blue-bg);color:var(--blue);padding:8px 10px;border-radius:8px;margin-bottom:6px;font-size:.9rem}
.notices li.none{background:none;color:var(--muted)}
.bar{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;align-items:center;margin-bottom:8px}
.bar-right{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
table{width:100%;border-collapse:collapse;font-size:.92rem}
th,td{text-align:left;padding:8px;border-bottom:1px solid var(--line);vertical-align:top}
thead th{font-size:.8rem;text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}
td.msg{max-width:280px}
.badge{display:inline-block;padding:2px 9px;border-radius:999px;font-size:.8rem;font-weight:700;white-space:nowrap}
.b-interested{background:var(--green-bg);color:var(--green)}.b-question{background:var(--amber-bg);color:var(--amber)}
.b-out_of_office{background:var(--grey-bg);color:var(--grey)}.b-not_interested{background:#e2e8f0;color:#1e293b}.b-unsubscribe{background:var(--red-bg);color:var(--red)}
tr.sel{background:#eef0ff}
.empty{color:var(--muted);text-align:center;padding:16px}
.kv{display:grid;grid-template-columns:1fr;gap:4px 16px;margin:8px 0}
@media(min-width:600px){.kv{grid-template-columns:140px 1fr}}
.kv dt{font-weight:600;color:var(--muted)}.kv dd{margin:0 0 6px}
blockquote{margin:0;padding:8px 12px;border-left:4px solid var(--line);background:#fafafa;border-radius:4px}
.btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.state{font-weight:700}
.clients{list-style:none;padding:0;margin:0}
.clients li{border:1px solid var(--line);border-radius:10px;padding:10px;margin-bottom:8px}
.clients button{all:unset;cursor:pointer;display:block;width:100%}
.clients li.sel{border-color:var(--accent);background:#eef0ff}
progress{width:100%;height:10px;accent-color:var(--accent)}
.warnbox{background:var(--red-bg);color:var(--red);padding:8px 12px;border-radius:8px;font-weight:600;margin:8px 0}
.phase{margin:14px 0 4px;font-size:.85rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.task{display:grid;grid-template-columns:1fr;gap:4px;border:1px solid var(--line);border-radius:10px;padding:10px;margin-bottom:6px}
.task.Blocked{border-color:#b91c1c;background:#fff5f5}.task.Done .t-title{text-decoration:line-through;color:var(--muted)}
.t-meta{font-size:.85rem;color:var(--muted)}
@media(min-width:700px){.task{grid-template-columns:1fr 150px;align-items:center}}
.flow{list-style:none;padding:0;margin:0 0 16px;display:flex;flex-direction:column;gap:6px}
.flow li{background:#eef0ff;border:1px solid #c7cbf0;border-radius:10px;padding:8px 12px}
.flow li b{display:block}.flow li span{font-size:.85rem;color:var(--muted)}
.flow li:not(:last-child)::after{content:"\2193";display:block;text-align:center;color:var(--accent);font-weight:700;margin-top:4px}
@media(min-width:900px){.flow{flex-direction:row;flex-wrap:wrap}.flow li{flex:1 1 120px}.flow li:not(:last-child)::after{content:"\2192";position:absolute;display:none}}
.tablewrap{overflow-x:auto}
table.map th[scope=row]{font-weight:600}
.foot{color:var(--muted);font-size:.85rem;padding:16px}

/* phones: lead table becomes cards, no horizontal scroll */
@media(max-width:720px){
 #leads-table thead{position:absolute;left:-999px}
 #leads-table,#leads-table tbody,#leads-table tr,#leads-table td{display:block;width:100%}
 #leads-table tr{border:1px solid var(--line);border-radius:10px;padding:8px;margin-bottom:8px}
 #leads-table td{border:0;padding:3px 4px}
 #leads-table td::before{content:attr(data-label);display:block;font-size:.72rem;text-transform:uppercase;color:var(--muted)}
 td.msg{max-width:none}
 table.map thead{display:none}table.map,table.map tbody,table.map tr,table.map th,table.map td{display:block;width:100%}
 table.map tr{border:1px solid var(--line);border-radius:10px;padding:6px;margin-bottom:8px}
 table.map td,table.map th{border:0;padding:2px 4px}
}
