@font-face{font-family:Gotham;src:url('assets/fonts/Gotham-Book.otf') format('opentype');font-weight:400;font-display:swap}
@font-face{font-family:Gotham;src:url('assets/fonts/Gotham-Medium.otf') format('opentype');font-weight:500;font-display:swap}
@font-face{font-family:Gotham;src:url('assets/fonts/Gotham-Bold.otf') format('opentype');font-weight:700;font-display:swap}
@font-face{font-family:Sora;src:url('assets/fonts/Sora-VariableFont_wght.ttf') format('truetype');font-weight:100 900;font-display:swap}

:root{
  --navy:#071027;--panel:#09142c;--panel-2:#0c1932;--line:#27344e;--line-2:#3a4762;
  --text:#edf1f8;--muted:#8a96ad;--faint:#5f6b84;
  --blue:#017efe;--blue-soft:#0c2c5a;--lime:#c6ff34;--danger:#ff7d83;--amber:#ffc25c;
  --radius:6px;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--navy);color:var(--text);font:400 14px/1.5 Sora,Arial,sans-serif;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}
a{color:var(--blue);text-decoration:none}a:hover{text-decoration:underline}
h1,h2,h3{font-family:Gotham,Sora,sans-serif;font-weight:700;letter-spacing:-.01em;margin:0}
::selection{background:var(--blue);color:#fff}
.num{font-variant-numeric:tabular-nums}

/* Shell */
.shell{display:grid;grid-template-columns:220px minmax(0,1fr);min-height:100vh}
.sidebar{border-right:1px solid var(--line);padding:22px 12px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;background:#061027}
.sidebar .logo{width:168px;height:56px;object-fit:contain;margin:0 6px 34px}
.sidebar nav{display:grid;gap:4px}
.sidebar nav a{display:flex;align-items:center;gap:11px;color:#aeb7ca;padding:11px 12px;border-radius:5px;text-decoration:none;font-size:.86rem}
.sidebar nav a:hover{background:var(--panel-2);color:#fff}
.sidebar nav a.active{background:#083d88;color:#fff;box-shadow:inset 3px 0 var(--blue)}
.sidebar nav svg{width:17px;height:17px;flex:none}
.sidebar .foot{margin-top:auto;display:grid;gap:10px;padding:0 6px}
.sidebar .foot small{color:var(--faint);font-size:.7rem;word-break:break-all}
.main{min-width:0}
.topbar{height:76px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px;gap:16px}
.topbar h1{font-size:1.45rem}
.topbar .sub{color:var(--muted);font-size:.75rem;margin-top:2px}
.content{padding:24px 28px 60px;display:grid;gap:18px}
.menu-btn{display:none;background:none;border:0;padding:6px}

/* Controls */
.btn{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border-radius:5px;border:1px solid var(--line-2);background:var(--panel-2);font-size:.78rem;color:#dfe4ee;white-space:nowrap}
.btn:hover{border-color:#56637f}
.btn.primary{background:var(--blue);border-color:var(--blue);color:#fff}
.btn.primary:hover{background:#1689ff}
.btn.danger{color:var(--danger);border-color:#5a3442}
.btn.small{height:30px;padding:0 10px;font-size:.72rem}
.seg{display:inline-flex;border:1px solid var(--line-2);border-radius:5px;overflow:hidden}
.seg button{border:0;background:var(--panel-2);padding:0 12px;height:34px;font-size:.75rem;color:var(--muted)}
.seg button.on{background:var(--blue-soft);color:#fff}
input[type=text],input[type=email],input[type=password],input[type=number],input[type=search],select,textarea{background:var(--panel-2);border:1px solid var(--line-2);border-radius:5px;padding:8px 10px;outline:none;min-height:36px;font-size:.82rem;width:100%}
textarea{min-height:90px;resize:vertical;line-height:1.5}
input:focus,select:focus,textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(1,126,254,.18)}
label.field{display:grid;gap:6px;font-size:.72rem;color:var(--muted)}
.switch{display:inline-flex;align-items:center;gap:10px;background:none;border:0;padding:0;font-size:.8rem}
.switch i{width:40px;height:22px;border-radius:20px;background:#34405a;position:relative;transition:.2s;flex:none}
.switch i:after{content:"";position:absolute;width:16px;height:16px;border-radius:50%;background:#cfd6e4;left:3px;top:3px;transition:.2s}
.switch.on i{background:var(--lime)}
.switch.on i:after{left:21px;background:#142000}

/* Panels */
.panel{border:1px solid #2c3957;background:var(--panel);border-radius:var(--radius);min-width:0}
.panel-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line)}
.panel-head h2{font-size:.95rem}
.panel-head p{margin:3px 0 0;color:var(--muted);font-size:.7rem}
.panel-body{padding:16px 18px}
.grid-2{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(300px,1fr);gap:18px}
.grid-2-even{display:grid;grid-template-columns:1fr 1fr;gap:18px}

/* Automation banner */
.auto-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;border:1px solid #2c3957;background:linear-gradient(90deg,#0a1a3a,var(--panel));border-radius:var(--radius);padding:14px 18px}
.auto-bar.off{background:var(--panel)}
.auto-bar .state{display:flex;align-items:center;gap:14px}
.auto-bar .state strong{font-family:Gotham;font-size:1rem}
.auto-bar .state span{display:block;color:var(--muted);font-size:.72rem}
.capacity{display:flex;gap:22px;flex-wrap:wrap}
.capacity div{display:grid;gap:5px;min-width:150px}
.capacity small{color:var(--muted);font-size:.68rem}
.meter{height:5px;background:#24304a;border-radius:4px;overflow:hidden}
.meter b{display:block;height:100%;background:var(--blue)}

/* Metrics */
.metrics{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));border:1px solid #2c3957;border-radius:var(--radius);background:var(--panel)}
.metrics article{padding:16px 16px 14px;border-right:1px solid var(--line)}
.metrics article:last-child{border-right:0}
.metrics span{display:block;color:var(--muted);font-size:.68rem}
.metrics strong{display:block;font:700 1.75rem/1.1 Gotham;margin:8px 0 4px}
.metrics small{color:var(--blue);font-size:.66rem}
.metrics article.hl strong{color:var(--lime)}

/* Funnel */
.funnel{display:grid;gap:9px}
.funnel-row{display:grid;grid-template-columns:150px minmax(0,1fr) 64px 58px;gap:12px;align-items:center;font-size:.76rem}
.funnel-row .bar{height:22px;background:#111d38;border-radius:3px;overflow:hidden}
.funnel-row .bar b{display:block;height:100%;background:var(--blue);border-radius:3px;min-width:2px}
.funnel-row.win .bar b{background:var(--lime)}
.funnel-row strong{text-align:right;font-family:Gotham}
.funnel-row small{color:var(--muted);text-align:right}

/* Chart */
.chart{width:100%;height:210px;display:block}
.chart text{fill:var(--faint);font-size:10px;font-family:Sora}
.legend{display:flex;gap:16px;font-size:.7rem;color:var(--muted);padding:0 18px 14px}
.legend span{display:inline-flex;align-items:center;gap:6px}
.legend i{width:9px;height:9px;border-radius:2px;display:inline-block}

/* Tables */
.table-wrap{overflow:auto}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:10px 14px;border-top:1px solid var(--line);font-size:.75rem;white-space:nowrap;vertical-align:middle}
thead th{color:var(--muted);font-weight:500;border-top:0;font-size:.68rem;text-transform:uppercase;letter-spacing:.04em}
tbody tr.link{cursor:pointer}tbody tr.link:hover{background:#0d1a36}
td .name{display:block;font-weight:600;color:#fff;max-width:280px;overflow:hidden;text-overflow:ellipsis}
td small{display:block;color:var(--muted);font-size:.68rem}
.empty{padding:34px;text-align:center;color:var(--muted);font-size:.8rem}

/* Badges & scores */
.badge{display:inline-flex;align-items:center;padding:3px 8px;border-radius:4px;font-size:.64rem;font-weight:600;background:#28344f;color:#dfe4ee;white-space:nowrap}
.badge.blue{background:#075ec2;color:#eaf3ff}
.badge.lime{background:var(--lime);color:#142000}
.badge.amber{background:#4a3a14;color:var(--amber)}
.badge.red{background:#4a1f29;color:var(--danger)}
.badge.ghost{background:none;border:1px solid var(--line-2);color:var(--muted)}
.score{font-family:Gotham;font-weight:700}
.score.hi{color:var(--lime)}.score.mid{color:#8fc1ff}.score.lo{color:var(--faint)}
.bant{display:inline-grid;grid-template-columns:repeat(4,14px);gap:3px;align-items:end;height:18px}
.bant i{display:block;background:#2b3854;border-radius:2px;position:relative;height:18px;overflow:hidden}
.bant i b{position:absolute;left:0;right:0;bottom:0;background:var(--lime)}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block;background:#56627b}
.dot.ok{background:var(--lime)}.dot.off{background:#56627b}.dot.err{background:var(--danger)}

/* Filters */
.filters{display:flex;gap:10px;flex-wrap:wrap;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line)}
.filters input[type=search]{width:240px}
.filters select{width:auto}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{border:1px solid var(--line-2);background:none;border-radius:20px;padding:4px 11px;font-size:.7rem;color:var(--muted)}
.chip.on{background:var(--blue-soft);border-color:var(--blue);color:#fff}
.chip b{font-weight:600;color:#fff;margin-left:4px}
.pager{display:flex;justify-content:space-between;align-items:center;padding:12px 18px;border-top:1px solid var(--line);color:var(--muted);font-size:.72rem}

/* Lead detail */
.lead-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;flex-wrap:wrap}
.lead-head h2{font-size:1.5rem}
.lead-head .meta{color:var(--muted);font-size:.78rem;margin-top:6px;display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.actions{display:flex;gap:8px;flex-wrap:wrap}
.scorecards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.scorecard{border:1px solid var(--line);border-radius:5px;padding:12px 14px;background:var(--panel-2)}
.scorecard span{color:var(--muted);font-size:.68rem}
.scorecard strong{display:block;font:700 1.6rem Gotham;margin-top:4px}
.kv{display:grid;grid-template-columns:120px minmax(0,1fr);gap:8px 14px;font-size:.78rem}
.kv dt{color:var(--muted)}.kv dd{margin:0;overflow-wrap:anywhere}
.list{margin:0;padding-left:18px;font-size:.8rem;display:grid;gap:4px}
.bant-rows{display:grid;gap:12px}
.bant-row{display:grid;grid-template-columns:96px 1fr 44px;gap:10px;align-items:center;font-size:.76rem}
.bant-row .meter{height:7px}.bant-row .meter b{background:var(--lime)}
.bant-row p{grid-column:2/4;margin:-6px 0 0;color:var(--muted);font-size:.7rem}
.reasons{display:grid;gap:5px;font-size:.74rem}
.reasons div{display:flex;justify-content:space-between;gap:10px;border-bottom:1px dashed var(--line);padding-bottom:5px}
.reasons b{color:var(--lime);font-weight:600}
.hook{border-left:2px solid var(--lime);padding:6px 12px;color:#dfe4ee;font-size:.82rem;margin:10px 0 0}

.thread{display:grid;gap:10px;max-height:560px;overflow:auto;padding:16px 18px}
.msg{max-width:84%;border-radius:8px;padding:10px 13px;font-size:.8rem;white-space:pre-wrap;overflow-wrap:anywhere;border:1px solid var(--line)}
.msg.out{justify-self:end;background:#0c2c5a;border-color:#174a8c}
.msg.in{justify-self:start;background:var(--panel-2)}
.msg.failed{border-color:#7a3340;opacity:.75}
.msg header{display:flex;gap:8px;font-size:.64rem;color:var(--muted);margin-bottom:5px;white-space:normal}
.msg header b{color:#cfe2ff;font-weight:600}
.compose{display:grid;gap:8px;padding:14px 18px;border-top:1px solid var(--line)}
.compose .row{display:flex;gap:8px}
.compose select{width:140px}
.events{display:grid;font-size:.72rem}
.events div{display:grid;grid-template-columns:110px 1fr;gap:10px;padding:8px 18px;border-top:1px solid var(--line)}
.events time{color:var(--muted)}

/* Kanban */
.kanban{display:grid;grid-template-columns:repeat(6,minmax(220px,1fr));gap:12px;overflow:auto;padding-bottom:6px}
.column{background:var(--panel);border:1px solid #2c3957;border-radius:var(--radius);min-height:300px}
.column h3{font-size:.8rem;padding:12px 14px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between}
.column h3 span{color:var(--muted);font-family:Sora;font-weight:400}
.cards{display:grid;gap:8px;padding:10px}
.card{border:1px solid var(--line);background:var(--panel-2);border-radius:5px;padding:11px 12px;display:grid;gap:7px;font-size:.75rem}
.card a{color:#fff;font-weight:600}
.card small{color:var(--muted)}
.card select{min-height:30px;padding:4px 8px;font-size:.7rem}

/* Forms */
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.form-grid .full{grid-column:1/-1}
.settings{display:grid;gap:18px}
.cadence-table input,.cadence-table select{min-height:32px;padding:5px 8px}
.cadence-table td{padding:6px 8px}
.note{color:var(--muted);font-size:.72rem;line-height:1.6}
.warn{border:1px solid #5a4a20;background:#1d1a10;color:#f2d28d;border-radius:5px;padding:10px 14px;font-size:.75rem;line-height:1.6}
.toast{position:fixed;right:20px;bottom:20px;background:#0f2348;border:1px solid var(--blue);color:#fff;padding:12px 16px;border-radius:6px;font-size:.8rem;z-index:50;max-width:380px;box-shadow:0 18px 50px rgba(0,0,0,.4)}
.toast.err{border-color:var(--danger);background:#2a121a}
.integrations{display:grid;gap:9px;font-size:.76rem}
.integrations div{display:flex;align-items:center;gap:10px;min-width:0}
.integrations small{color:var(--muted);margin-left:auto;font-size:.66rem;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.integrations .jobs{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:8px;color:var(--muted);font-size:.68rem}
.integrations .jobs span{display:inline-flex;align-items:center;gap:5px}
.activity{display:grid}
.activity div{display:grid;grid-template-columns:64px 1fr;gap:10px;padding:9px 18px;border-top:1px solid var(--line);font-size:.74rem}
.activity time{color:var(--faint)}
.activity a{color:#fff}

/* Login */
.login{min-height:100vh;display:grid;grid-template-columns:1.1fr .9fr}
.login aside{background:#0b1026;padding:48px clamp(32px,6vw,96px);display:flex;flex-direction:column;justify-content:space-between;border-right:1px solid var(--line);position:relative;overflow:hidden}
.login aside:after{content:"";position:absolute;width:640px;height:640px;border:1px solid #1f2f58;border-radius:50%;right:-400px;bottom:-260px;box-shadow:0 0 0 90px transparent,0 0 0 91px #172850}
.login aside h1{font-size:clamp(2.4rem,5vw,4.4rem);line-height:.98;letter-spacing:-.04em;max-width:560px}
.login aside p{color:var(--muted);max-width:440px;line-height:1.7}
.login form{display:grid;gap:14px;width:min(380px,100%);margin:auto;padding:32px}
.login form h2{font-size:1.6rem}
.login .err{color:#ffb5b8;font-size:.75rem;min-height:1em}

@media (max-width:1200px){.metrics{grid-template-columns:repeat(4,1fr)}.metrics article:nth-child(4){border-right:0}.metrics article:nth-child(-n+4){border-bottom:1px solid var(--line)}}
@media (max-width:1000px){.grid-2,.grid-2-even{grid-template-columns:1fr}}
@media (max-width:760px){
  .shell{grid-template-columns:1fr}
  .sidebar{position:fixed;left:-240px;width:220px;z-index:40;transition:left .2s}
  .sidebar.open{left:0;box-shadow:20px 0 60px #020613}
  .menu-btn{display:inline-flex}
  .main{overflow-x:hidden}
  .topbar{padding:0 12px 0 8px;height:66px;gap:8px}.topbar h1{font-size:1.05rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:42vw}.topbar .sub{display:none}
  .seg button{padding:0 8px;font-size:.7rem}
  .capacity div{min-width:0;flex:1 1 140px}
  .content{padding:16px 16px 50px}
  .metrics{grid-template-columns:1fr 1fr}.metrics article{border-bottom:1px solid var(--line)}.metrics article:nth-child(2n){border-right:0}
  .funnel-row{grid-template-columns:96px minmax(0,1fr) 46px;font-size:.7rem}.funnel-row small{display:none}
  .scorecards{grid-template-columns:1fr 1fr 1fr}
  .form-grid{grid-template-columns:1fr}
  .filters input[type=search]{width:100%}
  .login{grid-template-columns:1fr}.login aside{min-height:240px;padding:28px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
