:root{--purple:#402068;--aubergine:#2A1B3D;--paper:#F9F7FA;--lav:#E9E3F2;--lav2:#D6CCE6;--ink:#1E1A24;--mute:#6B6478;--line:rgba(42,27,61,.14);--ok:#2E6B4F;--okbg:#E3F1E9;--warn:#8A5A12;--warnbg:#F8EEDA;--no:#8B2F2F;--nobg:#F6E4E4;--wait:#6B6478;--waitbg:#F1EEF5;--cold:#402068;--coldbg:#E9E3F2;--warm:#8A4A12;--warmbg:#FBEBDD;--switch:#1F5A73;--switchbg:#DFEEF5;--roster:#2E6B4F;--rosterbg:#E3F1E9}
*{box-sizing:border-box}
html,body{margin:0;background:var(--paper);color:var(--ink);font-family:"Public Sans","Helvetica Neue",Arial,sans-serif;font-size:15px;line-height:1.5}
header{background:var(--aubergine);color:#fff;padding:28px 40px 24px}
.hwrap{max-width:1140px;margin:0 auto;display:flex;flex-wrap:wrap;gap:16px 40px;align-items:flex-end;justify-content:space-between}
header .brand{font-size:12px;color:var(--lav2);margin:0 0 8px}
header h1{font-family:"Libre Baskerville",Georgia,serif;font-weight:700;font-size:26px;margin:0 0 6px;line-height:1.2}
header p{margin:0;color:var(--lav2);font-size:14px;max-width:66ch}
.bar{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.hlink{color:#fff;font-size:13px;text-decoration:underline;text-underline-offset:3px}
.hint{font-size:12px;color:var(--lav2)}
button{font:inherit;font-size:14px;font-weight:500;padding:9px 16px;border-radius:8px;border:1px solid var(--purple);background:var(--purple);color:#fff;cursor:pointer}
button.alt{background:#fff;color:var(--purple)}
button.sm{padding:6px 12px;font-size:13px}
button.ghost{background:none;border-color:transparent;color:var(--purple);padding:6px 8px}
button:disabled{opacity:.5;cursor:default}
button:focus-visible{outline:3px solid var(--lav2);outline-offset:2px}
main{max-width:1140px;margin:0 auto;padding:28px 40px 120px}
section{margin:0 0 40px}
h2{font-family:"Libre Baskerville",Georgia,serif;font-weight:700;font-size:18px;margin:0}
.h2row{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0 0 12px}
.h2row .sub{font-size:13px;color:var(--mute)}
.h2row .spacer{flex:1}
.badge{display:inline-block;min-width:24px;text-align:center;font-family:"Public Sans",sans-serif;font-size:13px;font-weight:500;padding:1px 8px;border-radius:999px;background:var(--warnbg);color:var(--warn);vertical-align:2px;margin-left:4px}
.badge.zero{background:var(--waitbg);color:var(--mute)}
/* needs you */
.queue{display:grid;gap:10px}
.qi{display:grid;grid-template-columns:130px 1fr auto;gap:14px;align-items:center;background:#fff;border:1px solid var(--line);border-left:4px solid var(--warn);border-radius:10px;padding:12px 16px}
.qi.call{border-left-color:var(--roster)}
.qi.file{border-left-color:var(--switch)}
.qi .qt{font-size:12px;font-weight:500;color:var(--warn)}
.qi.call .qt{color:var(--roster)}.qi.file .qt{color:var(--switch)}
.qi .qx{font-size:13.5px;color:var(--mute)}
.qi .qa{display:flex;gap:6px}
.queue .empty{background:#fff;border:1px dashed var(--line);border-radius:10px;padding:16px;color:var(--mute);font-size:14px}
/* kpis */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.kpi{background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 16px}
.kpi .l{font-size:12px;color:var(--mute);margin:0 0 2px}
.kpi .v{font-family:"Libre Baskerville",Georgia,serif;font-size:24px;font-weight:700;color:var(--purple);font-variant-numeric:tabular-nums;line-height:1.1}
.kpi .s{font-size:12px;color:var(--mute);margin-top:4px}
/* lanes */
.lanes{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 12px}
.lane{font:inherit;font-size:13px;padding:6px 12px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--ink);cursor:pointer}
.lane .n{color:var(--mute);margin-left:4px;font-variant-numeric:tabular-nums}
.lane.on{background:var(--aubergine);border-color:var(--aubergine);color:#fff}.lane.on .n{color:var(--lav2)}
.lanedesc{font-size:13px;color:var(--mute);margin:0 0 12px;min-height:20px}
.controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0 0 12px}
select,input[type=search],input[type=text],input[type=time],input[type=number],textarea{font:inherit;font-size:14px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink)}
input[type=search]{min-width:220px}
.count{font-size:13px;color:var(--mute);margin-left:auto}
/* table */
.tablewrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);font-size:14px;vertical-align:middle}
th{font-weight:500;color:var(--mute);font-size:12px;background:var(--lav);cursor:pointer;user-select:none;white-space:nowrap}
th.sorted{color:var(--purple)}
th.ck,td.ck{width:36px;cursor:default;padding-right:0}
td.ck input,th.ck input{width:16px;height:16px;accent-color:var(--purple);cursor:pointer}
tbody tr{cursor:pointer}
tbody tr:hover td{background:#F5F2F8}
tbody tr.sel td{background:var(--lav)}
tbody tr.picked td{background:#F3EEF9}
tr:last-child td{border-bottom:0}
td.num{font-variant-numeric:tabular-nums;text-align:right}
.pill{display:inline-block;font-size:12px;padding:3px 9px;border-radius:999px;background:var(--lav);color:var(--purple);white-space:nowrap}
.pill.ok{background:var(--okbg);color:var(--ok)}.pill.warn{background:var(--warnbg);color:var(--warn)}.pill.no{background:var(--nobg);color:var(--no)}.pill.dim{background:#F1EEF5;color:var(--mute)}.pill.sent{background:#F1EEF5;color:var(--purple)}
.pill.cold{background:var(--coldbg);color:var(--cold)}.pill.warm{background:var(--warmbg);color:var(--warm)}.pill.switch{background:var(--switchbg);color:var(--switch)}.pill.roster{background:var(--rosterbg);color:var(--roster)}
.note{font-size:12px;color:var(--mute);margin:12px 0 0}
/* selection bar */
.selbar{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);background:var(--aubergine);color:#fff;border-radius:14px;padding:12px 14px 12px 20px;display:flex;align-items:center;gap:14px;box-shadow:0 14px 40px rgba(42,27,61,.35);z-index:30;max-width:calc(100% - 40px)}
.selbar[hidden]{display:none}
.selbar .st{font-size:14px}
.selbar .st small{display:block;font-size:12px;color:var(--lav2)}
.selbar button{border-color:#fff;background:#fff;color:var(--purple)}
.selbar button.alt{background:transparent;color:#fff}
/* pipeline */
.rules{font-size:13px;color:var(--mute)}
.st5{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:0 0 14px}
.b{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 14px;position:relative;transition:border-color .2s,box-shadow .2s}
.b.on{border-color:var(--purple);box-shadow:0 0 0 3px var(--lav2)}
.b .n{position:absolute;top:12px;right:14px;font-size:13px;font-weight:500;color:var(--purple);background:var(--lav);border-radius:999px;padding:2px 9px;font-variant-numeric:tabular-nums}
.b .t{font-family:"Libre Baskerville",Georgia,serif;font-weight:700;font-size:15px;margin:0 36px 0 0}
.b .s{font-size:13px;color:var(--mute);line-height:1.4}
.log{background:#fff;border:1px solid var(--line);border-radius:12px;max-height:240px;overflow:auto;margin:0 0 14px}
.row{display:grid;grid-template-columns:190px 1fr auto;gap:14px;align-items:center;padding:9px 16px;border-bottom:1px solid var(--line);font-size:14px}
.row:last-child{border-bottom:0}
.row .who{color:var(--mute)}
.p{font-size:12px;padding:3px 10px;border-radius:999px;white-space:nowrap}
.p.ok{background:var(--okbg);color:var(--ok)}.p.wait{background:var(--waitbg);color:var(--wait)}.p.no{background:var(--nobg);color:var(--no)}.p.route{background:var(--lav);color:var(--purple)}
.log .empty{padding:20px 16px;color:var(--mute);font-size:14px}
.mets{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.k{background:var(--lav);border-radius:10px;padding:10px 16px}
.k .l{font-size:13px;color:var(--mute)}
.k .v{font-family:"Libre Baskerville",Georgia,serif;font-size:26px;font-weight:700;color:var(--purple);font-variant-numeric:tabular-nums;line-height:1.1}
/* results */
.grid2{display:grid;grid-template-columns:1.2fr 1fr;gap:14px}
.chartwrap{position:relative;height:300px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:16px}
.card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:16px 18px}
.card h3{font-size:14px;font-weight:500;margin:0 0 10px}
.card h3+p{font-size:13px;color:var(--mute);margin:-6px 0 12px}
.w{display:grid;grid-template-columns:130px 1fr 32px;gap:10px;align-items:center;font-size:13px;margin:0 0 8px}
.w input[type=range]{width:100%;accent-color:var(--purple)}
.w .wv{text-align:right;font-variant-numeric:tabular-nums;color:var(--mute)}
.vt{width:100%;border:0;margin:14px 0 0}
.vt th,.vt td{padding:6px 0;font-size:13px;background:none;cursor:default}
.vt td.num{color:var(--purple);font-weight:500}
footer{padding:20px 40px;font-size:12px;color:var(--mute);border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
/* side panel */
main,.hwrap{transition:margin-right .25s ease}
@media (min-width:901px){body.po main,body.po .hwrap{margin-right:470px}}
#panel{position:fixed;top:0;right:0;height:100%;width:min(460px,100%);background:#fff;border-left:1px solid var(--line);box-shadow:-12px 0 32px rgba(42,27,61,.14);transform:translateX(102%);transition:transform .25s ease;overflow:auto;z-index:20;padding:22px 26px 40px}
#panel.open{transform:none}
.ph{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin:0 0 4px}
#panel h3{font-family:"Libre Baskerville",Georgia,serif;font-weight:700;font-size:20px;margin:0 0 2px}
.meta{font-size:13px;color:var(--mute);margin:0 0 14px}
.x{background:none;border:0;color:var(--mute);font-size:22px;line-height:1;padding:2px 6px;cursor:pointer}
.x:hover{color:var(--ink)}
#panel h4,.drawer h4,.mbox h4{font-size:12px;font-weight:500;color:var(--mute);text-transform:uppercase;letter-spacing:.04em;margin:20px 0 8px}
.pacts{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 4px}
.first{font-family:"Libre Baskerville",Georgia,serif;font-style:italic;font-size:16px;line-height:1.45;color:var(--purple);margin:0;padding:12px 16px;background:var(--lav);border-radius:10px}
.first small{display:block;font-family:"Public Sans",sans-serif;font-style:normal;font-size:12px;color:var(--mute);margin-top:6px}
.seq{list-style:none;margin:0;padding:0}
.seq li{display:grid;grid-template-columns:52px 1fr auto;gap:10px;padding:9px 0;border-bottom:1px solid var(--line);font-size:14px;align-items:start}
.seq li:last-child{border-bottom:0}
.seq .d{color:var(--purple);font-weight:500}
.seq .w2{color:var(--mute);font-size:13px}
.msg{border:1px solid var(--line);border-radius:10px;padding:10px 14px;margin:0 0 10px;font-size:14px;background:#fff}
.msg.in{background:var(--lav);border-color:transparent}
.msg .from{font-size:12px;color:var(--mute);margin:0 0 4px;display:flex;justify-content:space-between;gap:8px}
.msg p{margin:0 0 6px}.msg p:last-child{margin:0}
.evt{font-size:12.5px;color:var(--mute);text-align:center;margin:8px 0 12px}
.draft{border:1.5px dashed var(--purple);border-radius:10px;padding:12px 14px;margin:6px 0 0;background:#FCFBFD}
.draft .tag{display:inline-block;font-size:12px;padding:2px 9px;border-radius:999px;background:var(--warnbg);color:var(--warn);margin:0 0 8px}
.draft.ok .tag{background:var(--okbg);color:var(--ok)}
.draft.tpl .tag{background:var(--waitbg);color:var(--wait)}
.draft p{margin:0 0 10px;font-size:14px}
.draft .body[contenteditable=true]{outline:2px solid var(--lav2);border-radius:6px;padding:4px 6px;margin:-4px -6px 6px}
.draft .acts{display:flex;gap:8px}
.thread .empty{padding:14px 0;font-size:14px;color:var(--mute)}
/* review drawer */
.drawer{position:fixed;top:0;right:0;height:100%;width:min(620px,100%);background:var(--paper);border-left:1px solid var(--line);box-shadow:-12px 0 32px rgba(42,27,61,.18);transform:translateX(102%);transition:transform .25s ease;z-index:40;display:flex;flex-direction:column}
.drawer.open{transform:none}
.drawer .dh{padding:20px 26px 14px;background:#fff;border-bottom:1px solid var(--line)}
.drawer h3{font-family:"Libre Baskerville",Georgia,serif;font-weight:700;font-size:20px;margin:0 0 4px}
.drawer .dsub{font-size:13px;color:var(--mute);margin:0}
.drawer .dbody{flex:1;overflow:auto;padding:16px 26px}
.drawer .df{padding:14px 26px;background:#fff;border-top:1px solid var(--line);display:flex;align-items:center;gap:12px}
.drawer .df .fs{font-size:13px;color:var(--mute);flex:1}
.rc{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin:0 0 12px}
.rc.skip{opacity:.5}
.rch{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 6px}
.rch strong{font-size:15px}
.rch .m{font-size:13px;color:var(--mute)}
.rch label{margin-left:auto;font-size:13px;color:var(--mute);display:flex;align-items:center;gap:6px;cursor:pointer}
.rc .subj{font-size:13px;color:var(--mute);margin:0 0 6px}
.rc textarea{width:100%;resize:none;line-height:1.5;min-height:120px;overflow:hidden}
.rc .rtag{display:inline-block;font-size:12px;padding:2px 9px;border-radius:999px;background:var(--warmbg);color:var(--warm);margin:6px 0 0}
.rc .hint2{font-size:12px;color:var(--mute);margin:6px 0 0}
/* modal */
.modal{position:fixed;inset:0;background:rgba(42,27,61,.45);z-index:50;display:flex;align-items:center;justify-content:center;padding:20px}
.modal[hidden]{display:none}
.mbox{background:#fff;border-radius:14px;width:min(860px,100%);max-height:calc(100% - 40px);display:flex;flex-direction:column;box-shadow:0 24px 60px rgba(0,0,0,.35)}
.mh{display:flex;align-items:center;gap:12px;padding:18px 24px 12px;border-bottom:1px solid var(--line)}
.mh h3{font-family:"Libre Baskerville",Georgia,serif;font-weight:700;font-size:20px;margin:0;flex:1}
.mb{overflow:auto;padding:16px 24px 24px}
.mf{padding:12px 24px;border-top:1px solid var(--line);display:flex;gap:10px;align-items:center}
.mf .fs{flex:1;font-size:13px;color:var(--mute)}
.tabs{display:flex;gap:4px;flex-wrap:wrap;margin:0 0 14px}
.tab{font:inherit;font-size:13px;padding:6px 12px;border-radius:8px;border:1px solid transparent;background:none;color:var(--mute);cursor:pointer}
.tab.on{background:var(--lav);color:var(--purple)}
.stamp{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--ok);background:var(--okbg);border-radius:8px;padding:8px 12px;margin:0 0 14px}
.stamp.dirty{color:var(--warn);background:var(--warnbg)}
.stamp .spacer{flex:1}
.tgrid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.step{margin:0 0 14px}
.step label{display:block;font-size:13px;font-weight:500;margin:0 0 4px}
.step textarea{width:100%;min-height:96px;resize:vertical;line-height:1.5;font-size:13.5px}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 12px}
.chip{font:inherit;font-size:12px;padding:3px 9px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--purple);cursor:pointer;font-family:ui-monospace,Menlo,monospace}
.preview{background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:12px 14px;font-size:14px}
.preview .from{font-size:12px;color:var(--mute);margin:0 0 6px}
.preview p{margin:0 0 8px}.preview p:last-child{margin:0}
.form{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px}
.form .full{grid-column:1/-1}
.form label{display:block;font-size:13px;font-weight:500;margin:0 0 4px}
.form input,.form select,.form textarea{width:100%}
.form textarea{min-height:80px;resize:vertical}
.form .help{font-size:12px;color:var(--mute);margin:4px 0 0}
.form .match{font-size:13px;color:var(--warm);background:var(--warmbg);border-radius:8px;padding:8px 10px;margin:6px 0 0}
.form .match[hidden]{display:none}
.rgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px}
.rgrid label{display:block;font-size:13px;font-weight:500;margin:0 0 4px}
.rgrid .inline{display:flex;gap:8px;align-items:center}
.rgrid input[type=time],.rgrid input[type=number]{width:110px}
.rgrid textarea{width:100%;min-height:80px}
.rgrid .chk{display:flex;align-items:center;gap:8px;font-weight:400;margin-top:26px}
.rgrid .chk input{accent-color:var(--purple);width:16px;height:16px}
/* entry gate */
body.gated{overflow:hidden}
#gate{position:fixed;inset:0;background:var(--aubergine);z-index:100;display:flex;align-items:center;justify-content:center;padding:20px}
#gate[hidden]{display:none}
.gcard{background:#fff;border-radius:14px;padding:34px 36px 26px;width:min(460px,100%);box-shadow:0 24px 60px rgba(0,0,0,.35)}
.gcard .brand{font-size:12px;color:var(--mute);margin:0 0 10px}
.gcard h1{font-family:"Libre Baskerville",Georgia,serif;font-weight:700;font-size:24px;margin:0 0 8px;line-height:1.2}
.gcard .gsub{font-size:14px;color:var(--mute);margin:0 0 18px}
.gcard input{width:100%;font:inherit;font-size:15px;padding:11px 12px;border:1px solid var(--line);border-radius:8px;margin:0 0 10px}
.gcard input:focus{outline:3px solid var(--lav2);border-color:var(--purple)}
.gcard button{width:100%;padding:11px}
.gerr{font-size:13px;color:var(--no);background:var(--nobg);border-radius:8px;padding:8px 10px;margin:10px 0 0}
.gerr[hidden]{display:none}
.gnote{font-size:12px;color:var(--mute);margin:16px 0 0;text-align:center}
@media (prefers-reduced-motion:reduce){.b,#panel,.drawer{transition:none}}
@media (max-width:900px){.st5,.mets{grid-template-columns:repeat(3,1fr)}.row{grid-template-columns:1fr;gap:4px}.grid2,.tgrid,.form,.rgrid{grid-template-columns:1fr}.qi{grid-template-columns:1fr;gap:6px}}
@media (max-width:640px){header,main,footer{padding-left:20px;padding-right:20px}th:nth-child(6),td:nth-child(6){display:none}}
