/* Analytica Sales Generator — palette per validated dataviz reference */
:root{
  --surface:#fcfcfb; --page:#f9f9f7; --ink:#0b0b0b; --ink2:#52514e; --muted:#898781;
  --line:#e5e4e0; --panel:#ffffff;
  --accent:#2a78d6; --accent-dk:#1c5cab; --accent-soft:#cde2fb;
  --good:#0ca30c; --warning:#fab219; --serious:#ec835a; --critical:#d03b3b;
  --seq-1:#cde2fb; --seq-2:#9ec5f4; --seq-3:#6da7ec; --seq-4:#3987e5; --seq-5:#2a78d6; --seq-6:#1c5cab; --seq-7:#0d366b;
}
@media (prefers-color-scheme: dark){
  :root{
    --surface:#1a1a19; --page:#0d0d0d; --ink:#ffffff; --ink2:#c3c2b7; --muted:#898781;
    --line:#33332f; --panel:#232322;
    --accent:#3987e5; --accent-dk:#86b6ef; --accent-soft:#184f95;
  }
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
body{font:14px/1.5 -apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background:var(--page);color:var(--ink)}
h1,h2,h3{font-weight:650;letter-spacing:-.01em}
button{font:inherit;cursor:pointer;border:0;border-radius:8px;padding:8px 14px;background:var(--accent);color:#fff}
button:hover{background:var(--accent-dk)}
button.ghost{background:transparent;color:var(--ink2);border:1px solid var(--line)}
button.ghost:hover{background:var(--panel);color:var(--ink)}
button.small{padding:4px 10px;font-size:12.5px;border-radius:6px}
button.danger{background:transparent;color:var(--critical);border:1px solid var(--line)}
input,select,textarea{font:inherit;color:var(--ink);background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:8px 10px;width:100%}
textarea{min-height:90px;resize:vertical}
label{display:block;font-size:12.5px;color:var(--ink2);margin-bottom:10px}
label input,label select,label textarea{margin-top:4px}
a{color:var(--accent)}

/* login */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center}
.login-card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:34px;width:340px;box-shadow:0 12px 40px rgba(0,0,0,.08)}
.login-card h1{font-size:22px;margin-bottom:20px}
.login-card h1 span,.brand span{display:block;font-size:12px;font-weight:500;color:var(--accent);letter-spacing:.12em;text-transform:uppercase}
.login-card button{width:100%;margin-top:6px;padding:10px}
.err{color:var(--critical);font-size:13px;margin-top:10px;min-height:18px}

/* shell */
#app{display:grid;grid-template-columns:216px 1fr;min-height:100vh}
aside{border-right:1px solid var(--line);background:var(--surface);padding:22px 14px;display:flex;flex-direction:column;gap:18px;position:sticky;top:0;height:100vh}
.brand{font-size:17px;font-weight:700;padding:0 10px}
nav{display:flex;flex-direction:column;gap:2px;flex:1}
nav a{color:var(--ink2);text-decoration:none;padding:8px 10px;border-radius:8px;font-weight:500}
nav a:hover{background:var(--panel);color:var(--ink)}
nav a.active{background:var(--accent-soft);color:var(--accent-dk)}
@media (prefers-color-scheme: dark){ nav a.active{color:#cde2fb} }
main{padding:28px 32px;max-width:1180px}
.pagehead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px;flex-wrap:wrap}
.pagehead h2{font-size:21px}
.pagehead .actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.pagehead .actions select,.pagehead .actions input{width:auto}

/* tiles & cards */
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:20px}
.tile{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px}
.tile .n{font-size:28px;font-weight:700;letter-spacing:-.02em}
.tile .l{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin-top:2px}
.tile .sub{font-size:12.5px;color:var(--ink2);margin-top:6px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:20px;margin-bottom:18px}
.card h3{font-size:15px;margin-bottom:14px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media (max-width:900px){.grid2{grid-template-columns:1fr}#app{grid-template-columns:1fr}aside{position:static;height:auto;flex-direction:row;align-items:center}nav{flex-direction:row;flex-wrap:wrap}}

/* pipeline bars — single-hue sequential, magnitude job */
.bar-row{display:grid;grid-template-columns:110px 1fr 46px;gap:10px;align-items:center;margin-bottom:8px;font-size:13px}
.bar-row .name{color:var(--ink2)}
.bar-track{height:18px;border-radius:4px;background:transparent;position:relative}
.bar-fill{height:100%;border-radius:4px;min-width:2px;transition:width .3s}
.bar-row .val{text-align:right;font-variant-numeric:tabular-nums;color:var(--ink)}

/* tables */
table{width:100%;border-collapse:collapse;font-size:13.5px}
th{font-size:11.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);text-align:left;padding:8px 10px;border-bottom:1px solid var(--line)}
td{padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:top}
tr:hover td{background:color-mix(in srgb, var(--accent) 4%, transparent)}
.table-wrap{overflow-x:auto}
.score{display:inline-block;min-width:34px;text-align:center;border-radius:6px;padding:1px 6px;font-weight:600;font-variant-numeric:tabular-nums;background:var(--accent-soft);color:var(--accent-dk)}
@media (prefers-color-scheme: dark){ .score{color:#cde2fb} }

/* status badges — status palette, icon + label, never color alone */
.badge{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;border-radius:999px;padding:2px 10px;border:1px solid var(--line);color:var(--ink2)}
.badge::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--muted)}
.badge.new::before{background:var(--accent)}
.badge.qualified::before{background:var(--seq-4)}
.badge.sequenced::before{background:var(--warning)}
.badge.contacted::before{background:var(--seq-6)}
.badge.replied::before{background:var(--serious)}
.badge.meeting::before{background:var(--good)}
.badge.won{color:var(--good);border-color:var(--good)}
.badge.won::before{background:var(--good)}
.badge.lost{color:var(--muted)}
.badge.draft::before{background:var(--muted)}
.badge.approved::before{background:var(--warning)}
.badge.sent::before,.badge.done::before{background:var(--good)}
.badge.failed{color:var(--critical);border-color:var(--critical)}
.badge.failed::before{background:var(--critical)}

/* misc */
.filters{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap}
.filters input,.filters select{width:auto}
.muted{color:var(--muted);font-size:12.5px}
.tag{display:inline-block;background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:1px 8px;font-size:12px;color:var(--ink2);margin:2px 3px 2px 0}
.chips{display:flex;flex-wrap:wrap;gap:4px}
.kvrow{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.kvrow:last-child{border-bottom:0}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;word-break:break-all}
#toast{position:fixed;bottom:24px;right:24px;background:var(--ink);color:var(--page);padding:10px 18px;border-radius:10px;font-size:13.5px;box-shadow:0 8px 30px rgba(0,0,0,.25);z-index:50;max-width:420px}
dialog{border:1px solid var(--line);border-radius:14px;background:var(--panel);color:var(--ink);padding:24px;width:min(560px,92vw);box-shadow:0 20px 60px rgba(0,0,0,.25)}
dialog::backdrop{background:rgba(0,0,0,.35)}
.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.formgrid .full{grid-column:1/-1}
.playbook h3{margin:22px 0 8px;font-size:15px}
.playbook p,.playbook li{color:var(--ink2);font-size:13.5px;margin-bottom:6px}
.playbook ol,.playbook ul{padding-left:20px;margin-bottom:10px}
.playbook strong{color:var(--ink)}
.step-flow{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0 16px}
.step-flow span{background:var(--accent-soft);color:var(--accent-dk);border-radius:8px;padding:6px 12px;font-size:12.5px;font-weight:600}
@media (prefers-color-scheme: dark){ .step-flow span{color:#cde2fb} }