/* Layout: a working desk. Control strip (rep, call day, zone) on top, the call queue as the main column, appointments + day stats in a side rail. */
:root{
  --bg:#f5f6f4; --surface:#ffffff; --sunk:#eceeea; --line:#d9ddd6; --fg:#1d2420; --muted:#5d6760;
  --accent:#1f6f5c; --accent-ink:#ffffff; --accent-soft:#dcece6;
  --good:#2f7d3b; --good-soft:#e1f0e2; --warn:#a1640b; --warn-soft:#f6ead3; --bad:#a3392f; --bad-soft:#f5e0dc;
  --f-display:"Archivo","Helvetica Neue",Arial,sans-serif; --f-body:"Public Sans","Segoe UI",Arial,sans-serif; --f-mono:"IBM Plex Mono",Consolas,monospace;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root{
  --bg:#151a17; --surface:#1d2420; --sunk:#232b26; --line:#333d37; --fg:#e7ebe7; --muted:#9aa59d;
  --accent:#5fbf9f; --accent-ink:#0f1512; --accent-soft:#1f3a31;
  --good:#7cc786; --good-soft:#203526; --warn:#e2ab52; --warn-soft:#3a2f1c; --bad:#ec8a7e; --bad-soft:#3d2220; color-scheme:dark}}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg);color:var(--fg);font:14px/1.45 var(--f-body);padding-inline:16px;padding-block:16px 40px}
.wrap{max-width:1240px;margin:0 auto;display:grid;gap:14px}
h1{font:700 22px/1.1 var(--f-display);margin:0;letter-spacing:-.01em;text-wrap:balance}
h2{font:700 13px/1.2 var(--f-display);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0}
a{color:var(--accent)}
code{font:12.5px var(--f-mono);background:var(--sunk);padding:1px 4px;border-radius:4px;overflow-wrap:anywhere}
.top{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px}
.sub{color:var(--muted);font-size:13px}
.strip{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px;display:grid;gap:10px}
.row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.row.spread{justify-content:space-between}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.seg button{border:0;background:var(--surface);color:var(--fg);padding:7px 14px;font:600 13px var(--f-body);cursor:pointer;border-right:1px solid var(--line)}
.seg button:last-child{border-right:0}
.seg button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink)}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.zone{font-size:13px;color:var(--muted)} .zone b{color:var(--fg);font-weight:600}
input,textarea,select{font:inherit;color:var(--fg);background:var(--surface);border:1px solid var(--line);border-radius:7px;padding:7px 9px;max-width:100%}
input[type=search]{min-width:0;flex:1 1 220px}
input[type=checkbox]{width:auto;padding:0}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:14px;align-items:start}
@media (max-width:900px){.layout{grid-template-columns:minmax(0,1fr)}}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:10px;min-width:0}
.panel-h{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.pad{padding:12px}
.tabs{display:flex;gap:4px;flex-wrap:wrap}
.tabs button{border:1px solid transparent;background:none;color:var(--muted);padding:5px 10px;border-radius:999px;font:600 12.5px var(--f-body);cursor:pointer}
.tabs button[aria-pressed="true"]{background:var(--accent-soft);color:var(--fg);border-color:var(--line)}
.count{font-family:var(--f-mono);font-size:12px;color:var(--muted)}
.lead{border-bottom:1px solid var(--line);display:grid}
.lead:last-child{border-bottom:0}
.lead-main{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;align-items:center;padding:9px 12px;cursor:pointer;background:none;border:0;text-align:left;color:inherit;font:inherit;width:100%}
.lead-main:hover{background:var(--sunk)}
.lead-text{min-width:0}
.pri{font:500 13px var(--f-mono);text-align:center;border-radius:6px;padding:4px 0;background:var(--sunk)}
.pri.hi{background:var(--accent-soft)}
.nm{font-weight:600;overflow-wrap:anywhere}
.meta{color:var(--muted);font-size:12.5px;overflow-wrap:anywhere}
.chip{font:600 11.5px var(--f-body);padding:3px 8px;border-radius:999px;white-space:nowrap;background:var(--sunk);color:var(--muted)}
.chip.s-Booked{background:var(--good-soft);color:var(--good)}
.chip.s-Callback,.chip.due{background:var(--warn-soft);color:var(--warn)}
.chip.s-Not-Interested,.chip.s-Do-Not-Call,.chip.s-Bad-Number,.chip.s-Already-a-Merchant{background:var(--bad-soft);color:var(--bad)}
.detail{padding:4px 12px 14px 66px;display:grid;gap:10px}
@media (max-width:560px){.detail{padding-left:12px}}
.phone{font:500 15px var(--f-mono);letter-spacing:.02em}
.btn{display:inline-block;text-decoration:none;border:1px solid var(--line);background:var(--surface);color:var(--fg);border-radius:7px;padding:6px 11px;font:600 12.5px var(--f-body);cursor:pointer}
.btn:hover{background:var(--sunk)}
.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.btn[aria-pressed="true"]{outline:2px solid var(--accent);outline-offset:-2px}
.btn:disabled{opacity:.5;cursor:not-allowed}
.outcomes{display:flex;flex-wrap:wrap;gap:6px}
.fields{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.fields label,.stack label{display:grid;gap:3px;font-size:12px;color:var(--muted)}
label.check{display:flex;gap:6px;align-items:center;font-size:13px;color:var(--fg)}
.stack{display:grid;gap:10px}
.stack p{margin:0;max-width:75ch}
textarea{width:100%;min-height:54px;resize:vertical}
.hist{font-size:12px;color:var(--muted);display:grid;gap:2px}
.more{padding:10px 12px;display:flex;justify-content:center}
.side{display:grid;gap:14px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}
.stat{background:var(--surface);padding:10px 12px}
.stat b{display:block;font:700 22px var(--f-display);font-variant-numeric:tabular-nums}
.stat span{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.appt{padding:9px 12px;border-bottom:1px solid var(--line);display:grid;gap:2px}
.appt:last-child{border-bottom:0}
.when{font:500 12.5px var(--f-mono);color:var(--accent)}
.warn{color:var(--warn);font-size:12px}
.empty{padding:22px 14px;color:var(--muted);text-align:center}
.notice{border-radius:8px;padding:9px 12px;font-size:13px}
.notice.bad{background:var(--bad-soft);color:var(--fg);border:1px solid var(--bad)}
.notice.good{background:var(--good-soft);color:var(--fg);border:1px solid var(--good)}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:18px;background:var(--fg);color:var(--bg);padding:8px 14px;border-radius:8px;font-weight:600;font-size:13px}
.legend{font-size:12px;color:var(--muted);margin:0}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.table-wrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:13px}
th,td{padding:8px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
th{font:600 11.5px var(--f-body);text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
tr.inactive td{color:var(--muted)}
td.actions{display:flex;flex-wrap:wrap;gap:6px}
form.inline{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap}
form.inline input{width:150px}
form.inline input.wide{width:min(560px,60vw)}
.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.grid-2 p{margin:0 0 8px}
.login{min-height:80vh;display:grid;place-items:center}
.login-card{width:min(380px,100%);padding:22px;display:grid;gap:12px}
.login-card label{display:grid;gap:4px;font-size:12.5px;color:var(--muted)}
.check-list{list-style:none;padding:0;margin:0;display:grid;gap:6px}
.ok{color:var(--good);font-weight:600} .no{color:var(--bad);font-weight:600}
@media (prefers-reduced-motion:no-preference){.lead-main{transition:background .12s}}