:root{--bg:#f7f6f2;--surface:#f9f8f5;--surface2:#fbfbf9;--offset:#f3f0ec;--dynamic:#e6e4df;--border:#d4d1ca;--divider:#dcd9d5;--text:#28251d;--muted:#7a7974;--teal:#01696f;--teal-soft:#cedcd8;--green:#437a22;--green-soft:#d4dfcc;--amber:#964219;--amber-soft:#ddcfc6;--red:#a12c7b;--red-soft:#e0ced7;--blue:#006494;--blue-soft:#c6d8e4;--purple:#7a39bb;--purple-soft:#dacfde;--r-sm:6px;--r-md:8px;--r-lg:12px;--shadow:0 1px 2px rgb(40 37 29 / 6%)}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:14px/1.4 'General Sans',Arial,sans-serif}
button,select,textarea,input{font:inherit;color:inherit}
.wrap{max-width:1380px;margin:auto;padding:28px 16px 64px}
h1{font-size:22px;margin:0}
.sub{margin:4px 0 0;color:var(--muted);font-size:12px}
.top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.date{border:1px solid var(--border);background:var(--surface);padding:7px 9px;border-radius:var(--r-md);font-size:10px;color:var(--muted)}

/* controls */
.controls{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.ctl{display:flex;flex-direction:column;gap:3px}
.ctl label{font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.ctl input,.ctl select{border:1px solid var(--border);border-radius:var(--r-sm);padding:7px 9px;background:var(--surface2);font-size:12px;font-weight:600}
.ctl select{min-width:150px}
.ctl .go{border:1px solid var(--teal);background:var(--teal);color:#f9f8f4;border-radius:var(--r-sm);padding:8px 14px;font-weight:700;cursor:pointer}

/* banners */
.banner{border-radius:var(--r-md);padding:9px 12px;margin-bottom:10px;font-size:12px;border:1px solid}
.banner.err{background:var(--red-soft);border-color:var(--red);color:var(--red)}
.banner.warn{background:var(--amber-soft);border-color:var(--amber);color:var(--amber)}
.banner.info{background:var(--blue-soft);border-color:var(--blue);color:var(--blue)}
.banner a{color:inherit;font-weight:700}

.exec-strip{display:flex;align-items:stretch;border:1px solid var(--border);background:var(--surface);border-radius:var(--r-md);margin-bottom:10px;overflow:hidden;white-space:nowrap}
.exec-main{background:var(--teal);color:#f9f8f4;padding:9px 13px;min-width:205px}
.exec-label{font-size:9px;text-transform:uppercase;letter-spacing:.06em;font-weight:700;opacity:.8}
.exec-main b{font-size:21px;line-height:1;display:block;margin-top:2px}
.exec-mini{padding:9px 13px;border-right:1px solid var(--divider);min-width:150px}
.label{display:block;color:var(--muted);font-size:8px;font-weight:700;letter-spacing:.05em;text-transform:uppercase}
.exec-mini b{font-size:15px;display:block;margin-top:2px}
.exec-mini.green b{color:var(--green)}.exec-mini.amber b{color:var(--amber)}.exec-mini.red b{color:var(--red)}
.exec-mini small{display:block;color:var(--muted);font-size:9px;margin-top:1px}
.exec-note{flex:1;display:flex;align-items:center;padding:9px 13px;color:var(--muted);font-size:10px;border-left:1px solid var(--divider)}

.agent-overview{display:grid;grid-template-columns:1.12fr .88fr;gap:10px;margin-bottom:14px}
.panel{border:1px solid var(--divider);border-radius:var(--r-md);background:var(--surface);overflow:hidden;min-width:0}
.panel-head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 11px;background:var(--surface2);border-bottom:1px solid var(--divider)}
.panel-title{font-size:12px;font-weight:700}
.panel-note{font-size:9px;color:var(--muted)}
.agent-summary-cols,.agent-summary-row{display:grid;grid-template-columns:1fr .7fr 1fr 1fr .8fr .8fr;gap:8px;align-items:center;padding:7px 10px}
.agent-summary-cols{color:var(--muted);font-size:8px;text-transform:uppercase;letter-spacing:.05em;font-weight:700;border-bottom:1px solid var(--divider);background:var(--surface2)}
.agent-summary-row{font-size:10px;border-bottom:1px solid var(--divider)}
.agent-summary-row:last-child{border:0}
.right{text-align:right}
.amt{color:var(--green);font-weight:700}
.ftu{color:var(--amber);font-weight:700}
.filter-wrap{padding:11px}
.filter-stats{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.filter-stat{border:1px solid var(--divider);border-radius:var(--r-sm);padding:7px;background:var(--surface2)}
.filter-stat span{display:block;color:var(--muted);font-size:8px;text-transform:uppercase;font-weight:700}
.filter-stat b{font-size:15px;display:block;margin-top:1px}
.filter-stat b.green{color:var(--green)}
.legend{display:flex;gap:13px;align-items:center;flex-wrap:wrap;border:1px solid var(--border);background:var(--offset);border-radius:var(--r-md);padding:8px 10px;margin-bottom:10px;font-size:10px;color:var(--muted)}
.legend b{color:var(--text)}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:4px}
.g{background:var(--green)}.a{background:var(--amber)}.r{background:var(--red)}

.queue{display:flex;flex-direction:column;gap:7px}
.client{border:1px solid var(--divider);background:var(--surface);border-radius:var(--r-md);overflow:hidden;box-shadow:var(--shadow)}
.client summary{list-style:none;cursor:pointer}
.client summary::-webkit-details-marker{display:none}
.client-line{display:grid;grid-template-columns:20px 60px 90px 90px 84px 108px 116px 108px 70px 55px;align-items:center;gap:6px;padding:9px 10px;white-space:nowrap}
.client[open] .chevron{transform:rotate(90deg)}
.chevron{color:var(--teal);font-size:15px;transition:transform .2s}
.time{font-size:13px;font-weight:700}
.brand,.agent,.id,.stage,.plan,.actual{font-size:10px}
.value{font-weight:700}
.badge{display:inline-block;padding:2px 6px;border-radius:999px;font-size:9px;font-weight:700;background:var(--dynamic);color:var(--muted)}
.badge.pending{background:var(--amber-soft);color:var(--amber)}
.badge.done{background:var(--green-soft);color:var(--green)}
.badge.rescheduled{background:var(--blue-soft);color:var(--blue)}
.badge.cancelled{background:var(--red-soft);color:var(--red)}
.plan b,.actual b{font-size:12px}
.plan.ftu b{color:var(--amber)}.plan.upsale b{color:var(--green)}
.plan.none b{color:var(--muted);font-weight:600}
.money-type{display:block;font-size:8px;margin-top:1px;font-weight:700}
.money-type.ftu{color:var(--amber)}.money-type.upsale{color:var(--green)}
.actual.hit b{color:var(--green)}.actual.pending b{color:var(--muted)}.actual.partial b{color:var(--amber)}
.actual-note{display:block;font-size:8px;font-weight:700}
.hit .actual-note{color:var(--green)}.pending .actual-note{color:var(--muted)}.partial .actual-note{color:var(--amber)}
.moneyflag{font-size:10px;color:var(--muted)}
.moneyflag.invested{color:var(--green);font-weight:700}
.expand{font-size:10px;font-weight:700;color:var(--teal);text-align:right}

/* detail */
.details{border-top:1px solid var(--divider);background:var(--surface2)}
.detail-loading{padding:22px;text-align:center;color:var(--muted);font-size:12px}
.risk-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px}
.risk-card{border:1px solid var(--border);border-radius:var(--r-md);padding:9px 10px;background:var(--surface);font-size:11px}
.risk-card b{display:block;font-size:12px}
.risk-card small{display:block;color:var(--muted);margin-top:2px}
.risk-card.jrisk{background:var(--amber-soft);border-color:var(--amber)}.risk-card.jrisk b{color:var(--amber)}
.risk-card.lrisk{background:var(--red-soft);border-color:var(--red)}.risk-card.lrisk b{color:var(--red)}
.journey{padding:15px 16px 20px;border-top:1px solid var(--divider);border-bottom:1px solid var(--divider);background:var(--surface)}
.journey-top{display:flex;justify-content:space-between;gap:12px;align-items:start;flex-wrap:wrap}
.journey-kicker{font-size:9px;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);font-weight:700}
.journey-title{font-size:16px;font-weight:700;margin-top:2px}
.journey-title span{color:var(--teal)}
.journey-track{height:12px;border-radius:999px;background:var(--dynamic);position:relative;margin:20px 10px 9px;overflow:hidden}
.journey-done{position:absolute;left:0;top:0;bottom:0;background:var(--green);border-radius:999px}
.journey-labels{display:grid;grid-template-columns:repeat(5,1fr);font-size:10px;gap:4px}
.journey-labels span{font-weight:700;text-align:center}
.journey-labels span.done{color:var(--green)}
.journey-labels span.current{color:var(--teal)}
.journey-labels small{display:block;font-size:8px;color:var(--muted);font-weight:400}
.detail-header{display:grid;grid-template-columns:100px 1fr 190px;gap:12px;align-items:start;padding:12px}
.detail-client{font-size:14px;font-weight:700}
.chips{display:flex;gap:5px;flex-wrap:wrap;margin-top:3px}
.chip{padding:2px 6px;border-radius:999px;font-size:9px;font-weight:700;background:var(--dynamic);color:var(--muted)}
.chip.status{background:var(--teal-soft);color:var(--teal)}
.chip.dep{background:var(--green-soft);color:var(--green)}
.chip.nodep{background:var(--amber-soft);color:var(--amber)}
.call-time{font-size:16px;font-weight:700}
.call-time small{display:block;color:var(--muted);font-size:9px;font-weight:400}
.actual-call{border-left:1px solid var(--divider);padding-left:12px;font-size:11px}
.actual-call small{display:block;color:var(--muted);font-size:9px;text-transform:uppercase}
.actual-call b{display:block;margin-top:2px}
.detail-two{display:grid;grid-template-columns:1.1fr 1fr;gap:12px;padding:0 12px 12px}
.section{border:1px solid var(--divider);border-radius:var(--r-md);background:var(--surface);padding:10px;min-width:0}
.section-title{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700;margin-bottom:7px}
.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.metric small{display:block;font-size:8px;color:var(--muted);text-transform:uppercase}
.metric b{display:block;font-size:11px;margin-top:2px}
.metric b.green{color:var(--green)}.metric b.red{color:var(--red)}
.scroll-list{height:96px;overflow-y:auto;border:1px solid var(--divider);border-radius:var(--r-sm);padding:5px 7px;margin-top:8px;font-size:10px}
.pos-row{display:grid;grid-template-columns:1.3fr 1fr .8fr;gap:5px;padding:3px 0;border-bottom:1px solid var(--divider)}
.pos-row:last-child{border:0}
.pos-row b{color:var(--green)}
.pos-row b.neg{color:var(--red)}
.history-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:0 12px 12px}
.history-scroll{height:130px;overflow-y:auto;border:1px solid var(--divider);border-radius:var(--r-sm);background:var(--surface);font-size:9px}
.hrow{display:grid;gap:5px;padding:5px 7px;border-bottom:1px solid var(--divider)}
.hrow.head{position:sticky;top:0;background:var(--surface2);font-size:8px;color:var(--muted);font-weight:700;text-transform:uppercase}
.hrow:last-child{border:0}
.hrow.appts{grid-template-columns:1fr .8fr .9fr}
.hrow.calls{grid-template-columns:.9fr 1.3fr .8fr}
.notes{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:0 12px 14px}
.notebox{border-radius:var(--r-md);padding:10px;font-size:11px;background:var(--blue-soft);border:1px solid var(--blue)}
.notetitle{display:flex;justify-content:space-between;gap:6px;font-size:9px;text-transform:uppercase;letter-spacing:.05em;font-weight:700;margin-bottom:5px}
.comment-scroll{height:150px;overflow-y:auto;border:1px solid var(--divider);border-radius:var(--r-sm);background:var(--surface);padding:5px;font-size:9px}
.comment{padding:4px 0;border-bottom:1px solid var(--divider)}
.comment:last-child{border:0}
.comment small{display:block;color:var(--muted);margin-top:1px}
.empty{color:var(--muted);font-size:10px;padding:6px 2px}

/* inline target editor */
.target-edit{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:10px 12px 14px}
.target-edit input[type=number]{width:110px;padding:6px 8px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface2)}
.target-edit input[type=text]{flex:1;min-width:160px;padding:6px 8px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface2)}
.target-edit select{padding:6px 8px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface2);font-weight:700}
.target-edit .save{padding:7px 12px;border:1px solid var(--teal);background:var(--teal);color:#f9f8f4;border-radius:var(--r-sm);font-weight:700;cursor:pointer}
.target-edit .saved{color:var(--green);font-size:10px;font-weight:700}
.target-edit .tlabel{font-size:8px;font-weight:700;text-transform:uppercase;color:var(--muted)}

.recap{margin-top:18px;border:1px solid var(--border);background:var(--surface);border-radius:var(--r-lg);overflow:hidden}
.recap-head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 13px;background:var(--surface2);border-bottom:1px solid var(--divider)}
.recap-title{font-size:13px;font-weight:700}
.recap-note{font-size:10px;color:var(--muted)}
.recap-grid{display:grid;grid-template-columns:1.55fr repeat(4,1fr)}
.recap-main{padding:13px;background:var(--teal);color:#f9f8f4}
.recap-main .label,.recap-main small{color:#f9f8f4;opacity:.8}
.recap-main b{display:block;font-size:25px;line-height:1;margin-top:4px}
.recap-cell{padding:13px;border-right:1px solid var(--divider)}
.recap-cell:last-child{border:0}
.recap-cell b{font-size:18px;display:block;margin-top:3px}
.recap-cell small{display:block;margin-top:3px;font-size:9px;color:var(--muted)}
.recap-cell.green b{color:var(--green)}.recap-cell.amber b{color:var(--amber)}.recap-cell.red b{color:var(--red)}
.recap-table{border-top:1px solid var(--divider);max-height:200px;overflow-y:auto}
.recap-row{display:grid;grid-template-columns:1fr 110px 110px 110px 110px;gap:8px;padding:8px 13px;border-bottom:1px solid var(--divider);font-size:10px;align-items:center}
.recap-row.head{position:sticky;top:0;background:var(--surface2);font-size:8px;color:var(--muted);font-weight:700;text-transform:uppercase}
.recap-row:last-child{border:0}
.recap-row b{color:var(--green)}
.recap-row .part{color:var(--amber)}

.footer-note{margin-top:22px;color:var(--muted);font-size:10px;line-height:1.6}

@media(max-width:1120px){
  .exec-strip{overflow-x:auto}.exec-note{display:none}
  .agent-overview{grid-template-columns:1fr}
  .client-line{grid-template-columns:20px 55px 84px 84px 108px 116px 108px 1fr 55px}
  .hide-lg{display:none}
  .recap-grid{grid-template-columns:repeat(3,1fr)}.recap-main{grid-column:span 3}
  .recap-table{overflow-x:auto}.recap-row{min-width:620px}
}
@media(max-width:760px){
  .client-line{grid-template-columns:20px 52px 1fr 96px 96px 48px}
  .hide-md{display:none}
  .risk-grid,.detail-header,.detail-two,.history-grid,.notes{grid-template-columns:1fr}
  .metric-grid{grid-template-columns:repeat(2,1fr)}
  .recap-grid{grid-template-columns:1fr 1fr}.recap-main{grid-column:span 2}
}
