:root{
  --ink:#121316; --surface:#1B1D22; --surface-2:#232630;
  --line: rgba(237,238,240,0.07); --text:#EDEEF0; --muted:#8B909B;
}
body{ background:var(--ink); color:var(--text); font-family:'Inter', -apple-system, sans-serif; }
a{ color:#7FA8E8; }

.auth-page{ display:flex; align-items:center; justify-content:center; min-height:100vh; }
.auth-card{ background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:32px; width:100%; max-width:380px; }
.auth-card .form-control{ background:var(--surface-2); border-color:var(--line); color:var(--text); }
.auth-card .form-control:focus{ background:var(--surface-2); color:var(--text); box-shadow:none; border-color:#E8483A; }

.topbar{ display:flex; align-items:center; justify-content:space-between; padding:18px 32px; border-bottom:1px solid var(--line); }
.wordmark{ font-weight:700; font-size:20px; }
.wordmark span{ background:linear-gradient(90deg,#E8483A,#4F8FE0); -webkit-background-clip:text; background-clip:text; color:transparent; }
.container-app{ max-width:1100px; margin:0 auto; padding:28px 32px 70px; }

.toolbar{ display:flex; gap:12px; margin-bottom:20px; }
.toggle-group .btn{ border-color:var(--line); color:var(--muted); }
.toggle-group .btn.active{ background:var(--surface-2); color:var(--text); }

.spectrum{ height:8px; border-radius:5px; background:linear-gradient(90deg,#E8483A,#E8823A,#E8C23A,#4FBA8D,#4F8FE0); margin:4px 0 6px; }
.spectrum-labels{ display:flex; justify-content:space-between; font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:0.07em; margin-bottom:22px; }

.lead-row{ display:flex; align-items:center; background:var(--surface); border-radius:12px; padding:12px 16px; margin-bottom:7px; position:relative; overflow:hidden; cursor:pointer; border:1px solid transparent; }
.lead-row:hover{ border-color:var(--line); }
.lead-row::before{ content:''; position:absolute; left:0; top:0; bottom:0; width:5px; background:var(--rowcolor); }
.lead-avatar{ width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:600; font-size:13px; margin-right:14px; margin-left:8px; flex-shrink:0; background:var(--rowbg); color:var(--rowcolor); }
.lead-name{ font-weight:600; font-size:14.5px; }
.lead-chan{ font-size:10.5px; color:var(--muted); font-weight:400; }
.lead-meta{ font-size:11px; margin-top:2px; color:var(--rowcolor); }
.lead-stats{ display:flex; flex-direction:column; align-items:flex-end; gap:2px; width:120px; flex-shrink:0; }
.lead-stats .value{ font-weight:600; font-size:13.5px; }
.lead-stats .touches, .lead-stats .next{ font-size:10.5px; color:var(--muted); }

.modal-content{ background:var(--surface); color:var(--text); border:1px solid var(--line); }
.modal-header, .modal-footer{ border-color:var(--line); }
.nav-tabs{ border-color:var(--line); }
.nav-tabs .nav-link{ color:var(--muted); border:none; }
.nav-tabs .nav-link.active{ background:none; color:var(--text); border-bottom:2px solid #E8483A; }
.form-control, .form-select{ background:var(--surface-2); border-color:var(--line); color:var(--text); }
.form-control:focus, .form-select:focus{ background:var(--surface-2); color:var(--text); box-shadow:none; border-color:#E8483A; }

.timeline{ position:relative; padding-left:24px; }
.timeline::before{ content:''; position:absolute; left:6px; top:4px; bottom:4px; width:2px; background:var(--line); }
.timeline-item{ position:relative; padding-bottom:18px; }
.timeline-item::before{ content:''; position:absolute; left:-24px; top:3px; width:9px; height:9px; border-radius:50%; background:#E8483A; }
.timeline-item .t-when{ font-size:10.5px; color:var(--muted); }
.timeline-item .t-what{ font-size:13.5px; }