:root{
  --bg:#0B1220; --card:#111A2E; --panel:#151F35; --border:rgba(255,255,255,.08);
  --gold:#C9A227; --gold-2:#9C7314; --gold-hi:#ffc752;
  --text:#F8FAFC; --muted:#AAB4C8; --success:#22C55E; --warning:#F59E0B; --danger:#EF4444; --info:#628CA3;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
::selection{background:var(--gold);color:#0B1220}

/* layout shell */
.shell{display:grid;grid-template-columns:248px 1fr;min-height:100vh}
.sidebar{background:linear-gradient(180deg,#0d1526,#0a0f1c);border-right:1px solid var(--border);padding:20px 14px;position:sticky;top:0;height:100vh;overflow:auto}
.brand{display:flex;align-items:center;gap:11px;padding:6px 8px 18px}
.shield{width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,var(--gold),var(--gold-2));display:grid;place-items:center;color:#0B1220;font-weight:800;font-size:14px;box-shadow:0 4px 14px rgba(201,162,39,.25)}
.brand b{font-size:15px;letter-spacing:.2px}
.brand span{display:block;font-size:11px;color:var(--gold-hi);letter-spacing:.14em;text-transform:uppercase}
.nav{display:flex;flex-direction:column;gap:2px;margin-top:6px}
.nav a{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:9px;color:var(--muted);font-size:13.5px;font-weight:500;transition:.15s}
.nav a .ic{width:18px;text-align:center;opacity:.85}
.nav a:hover{background:var(--panel);color:var(--text)}
.nav a.active{background:linear-gradient(135deg,rgba(201,162,39,.18),rgba(156,115,20,.06));color:var(--text);box-shadow:inset 2px 0 0 var(--gold)}
.nav .sec{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:#5b677e;margin:16px 10px 6px}

.main{display:flex;flex-direction:column;min-width:0}
.topbar{display:flex;align-items:center;gap:16px;padding:14px 26px;border-bottom:1px solid var(--border);background:rgba(11,18,32,.7);backdrop-filter:blur(8px);position:sticky;top:0;z-index:20}
.search{flex:1;max-width:520px;position:relative}
.search input{width:100%;background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:10px 14px 10px 38px;color:var(--text);font-size:13.5px}
.search input:focus{outline:none;border-color:var(--gold)}
.search .ic{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--muted)}
.topbar .who{margin-left:auto;display:flex;align-items:center;gap:12px;font-size:13px;color:var(--muted)}
.avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,var(--gold),var(--gold-2));display:grid;place-items:center;color:#0B1220;font-weight:700;font-size:13px}
.content{padding:26px;max-width:1500px;width:100%}

.page-head{display:flex;align-items:center;gap:14px;margin-bottom:22px;flex-wrap:wrap}
.page-head h1{font-size:21px;font-weight:700}
.page-head .sub{color:var(--muted);font-size:13px}
.page-head .spacer{flex:1}

/* cards & grid */
.grid{display:grid;gap:16px}
.kpis{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
.card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:18px}
.card.glow{background:linear-gradient(160deg,#13203a,#101829)}
.kpi .label{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.06em}
.kpi .val{font-size:28px;font-weight:800;margin-top:8px;letter-spacing:-.5px}
.kpi .val.gold{color:var(--gold-hi)}
.kpi .delta{font-size:12px;color:var(--muted);margin-top:4px}

.section-title{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--gold);font-weight:700;margin:26px 0 12px}

/* AI insights panel */
.ai-panel{background:linear-gradient(135deg,rgba(201,162,39,.10),rgba(98,140,163,.05));border:1px solid rgba(201,162,39,.22);border-radius:14px;padding:18px}
.ai-panel .tag{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-hi)}
.ai-panel p{color:var(--muted);font-size:13.5px;margin-top:8px;line-height:1.6}

/* badges */
.badge{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:3px 9px;border-radius:999px;border:1px solid var(--border)}
.badge.hot{color:#ff9a8b;background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.3)}
.badge.warm{color:var(--warning);background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.3)}
.badge.cold{color:var(--info);background:rgba(98,140,163,.12);border-color:rgba(98,140,163,.3)}
.badge.ok{color:var(--success);background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.3)}
.badge.gold{color:var(--gold-hi);background:rgba(201,162,39,.12);border-color:rgba(201,162,39,.3)}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border);background:var(--panel);color:var(--text);padding:9px 15px;border-radius:10px;font-size:13.5px;font-weight:600;cursor:pointer;transition:.15s}
.btn:hover{border-color:var(--gold)}
.btn.primary{background:linear-gradient(135deg,var(--gold),var(--gold-2));color:#0B1220;border:0}
.btn.primary:hover{filter:brightness(1.06)}
.btn.sm{padding:6px 11px;font-size:12px}
.btn.ghost{background:transparent}
.btn.danger{color:#ff9a8b;border-color:rgba(239,68,68,.3)}

/* tables */
.table-wrap{background:var(--card);border:1px solid var(--border);border-radius:14px;overflow:hidden}
table{width:100%;border-collapse:collapse;font-size:13.5px}
thead th{text-align:left;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.06em;padding:13px 16px;border-bottom:1px solid var(--border);font-weight:600}
tbody td{padding:13px 16px;border-bottom:1px solid rgba(255,255,255,.05)}
tbody tr:hover{background:var(--panel)}
tbody tr:last-child td{border-bottom:0}
.score-pill{display:inline-block;min-width:34px;text-align:center;font-weight:700;font-size:12px;padding:3px 8px;border-radius:8px;background:var(--panel);border:1px solid var(--border)}

/* kanban */
.kanban{display:flex;gap:14px;overflow-x:auto;padding-bottom:14px}
.col{flex:0 0 280px;background:var(--card);border:1px solid var(--border);border-radius:14px;display:flex;flex-direction:column;max-height:calc(100vh - 220px)}
.col h3{font-size:13px;font-weight:700;padding:13px 14px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border)}
.col h3 .n{font-size:11px;color:var(--muted);background:var(--panel);padding:2px 8px;border-radius:999px}
.col .drop{padding:10px;display:flex;flex-direction:column;gap:10px;overflow:auto;min-height:60px}
.col.drag-over .drop{background:rgba(201,162,39,.05)}
.lead-card{background:var(--panel);border:1px solid var(--border);border-radius:11px;padding:12px;cursor:grab;transition:.15s}
.lead-card:hover{border-color:var(--gold);transform:translateY(-1px)}
.lead-card.dragging{opacity:.4}
.lead-card .nm{font-weight:600;font-size:13.5px}
.lead-card .meta{color:var(--muted);font-size:11.5px;margin-top:5px;display:flex;gap:8px;flex-wrap:wrap}
.lead-card .foot{display:flex;align-items:center;justify-content:space-between;margin-top:9px}
.quick{display:flex;gap:5px}
.quick a{width:26px;height:26px;border-radius:7px;background:var(--card);border:1px solid var(--border);display:grid;place-items:center;font-size:12px;color:var(--muted)}
.quick a:hover{color:var(--gold-hi);border-color:var(--gold)}

/* lead detail */
.detail-grid{display:grid;grid-template-columns:340px 1fr;gap:20px}
.profile .name{font-size:20px;font-weight:700}
.kv{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.05);font-size:13px}
.kv .k{color:var(--muted)}
.timeline{position:relative;padding-left:22px}
.timeline:before{content:"";position:absolute;left:6px;top:4px;bottom:4px;width:2px;background:var(--border)}
.tl-item{position:relative;padding:10px 0}
.tl-item:before{content:"";position:absolute;left:-19px;top:15px;width:9px;height:9px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 3px rgba(201,162,39,.18)}
.tl-item .h{font-size:13.5px;font-weight:600}
.tl-item .m{font-size:12px;color:var(--muted);margin-top:2px}

/* forms */
.field{margin-bottom:14px}
.field label{display:block;font-size:12px;color:var(--muted);margin-bottom:6px}
.field input,.field select,.field textarea{width:100%;background:var(--panel);border:1px solid var(--border);border-radius:9px;padding:10px 12px;color:var(--text);font-size:13.5px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--gold)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.checks{display:flex;gap:18px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.checks label{display:flex;align-items:center;gap:7px}

/* flash + banner */
.flash{padding:11px 16px;border-radius:10px;margin-bottom:18px;font-size:13.5px;border:1px solid var(--border)}
.flash.success{background:rgba(34,197,94,.1);border-color:rgba(34,197,94,.3);color:var(--success)}
.flash.danger{background:#2a1215;border-color:#5c2b2e;color:#ff8a80}
.imp-banner{background:linear-gradient(90deg,var(--gold),var(--gold-2));color:#0B1220;text-align:center;padding:8px;font-size:13px;font-weight:700}
.imp-banner a{text-decoration:underline}

/* misc */
.muted{color:var(--muted)} .right{margin-left:auto}
.bars{display:flex;flex-direction:column;gap:9px;margin-top:6px}
.bar-row{display:grid;grid-template-columns:120px 1fr 36px;align-items:center;gap:10px;font-size:12.5px}
.bar-track{height:8px;background:var(--panel);border-radius:999px;overflow:hidden}
.bar-fill{height:100%;background:linear-gradient(90deg,var(--gold),var(--gold-2))}
.empty{text-align:center;color:var(--muted);padding:50px 20px}
.modal-bg{position:fixed;inset:0;background:rgba(5,9,17,.6);backdrop-filter:blur(3px);display:none;place-items:center;z-index:50}
.modal-bg.open{display:grid}
.modal{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:24px;width:min(440px,92vw)}
.modal h3{margin-bottom:14px}
@media(max-width:960px){.shell{grid-template-columns:1fr}.sidebar{display:none}.detail-grid{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}}
