/* ============================================================================
   dcrm.css — the DCRM shell's shared design system, extracted verbatim from
   crm/index.html's main <style> block (the first move of the multi-page split).
   Every DCRM page links this; page-specific styles stay in their page.
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background: #EDF1F7; color: #1a1a18; font-size: 13px; }
/* No pull-to-refresh / overscroll bounce in the shell either — a reload here
   would drop the LO out of their drilled-down Tours view. */
html, body { overscroll-behavior: none; }

/* ── LO Picker (identity is shared with the Tour app via localStorage['lo_name']) ── */
.lo-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.6); z-index:9000; align-items:center; justify-content:center; }
.lo-overlay.show { display:flex; }
.lo-box { background:#fff; border-radius:14px; padding:2rem; max-width:360px; width:90%; text-align:center; }
.lo-box h2 { font-size:17px; font-weight:600; margin-bottom:1rem; color:#1a1a18; }
.lo-input { width:100%; font-size:15px; padding:10px 12px; border:1.5px solid #1B4F9A; border-radius:8px; outline:none; margin-bottom:1rem; font-family:inherit; }
.lo-btn { width:100%; padding:11px; background:#1B4F9A; color:#fff; border:none; border-radius:8px; font-size:15px; font-weight:600; cursor:pointer; font-family:inherit; }
.lo-btn:hover { background:#163F7A; }
.lo-btn-secondary { width:100%; padding:10px; background:#fff; color:#555; border:1.5px solid #ccc; border-radius:8px; font-size:14px; font-weight:600; cursor:pointer; font-family:inherit; margin-top:8px; }
.lo-btn-secondary:hover { background:#f5f5f3; border-color:#999; }

/* ── My Agents (CRM pipeline) — ported verbatim from index.html ─────────────── */
#agents-overlay{background:#EDF1F7;}
.ag-hd{position:sticky;top:0;z-index:2;background:#153F7C;color:#fff;padding:calc(env(safe-area-inset-top,0px) + 12px) 14px 10px;display:flex;align-items:center;gap:12px;}
.ag-hd h2{flex:1;margin:0;font-size:17px;font-weight:800;}
.ag-hd .ag-lo-tag{font-size:11px;font-weight:600;opacity:.85;cursor:pointer;white-space:nowrap;}
.ag-hd .ag-close{width:34px;height:34px;border:0;border-radius:9px;background:rgba(255,255,255,.15);color:#fff;font-size:15px;cursor:pointer;text-decoration:none;display:grid;place-items:center;}
.ag-tabs{display:flex;gap:6px;padding:10px 12px;}
.ag-tab{flex:1;border:1px solid #D5DEEC;background:#fff;color:#61708C;font:inherit;font-size:12.5px;font-weight:700;padding:8px;border-radius:9px;cursor:pointer;}
.ag-tab.active{background:#2E6BD6;border-color:#2E6BD6;color:#fff;}
.ag-searchbar{padding:0 12px 8px;}
.ag-searchbar input{width:100%;font:inherit;font-size:14px;padding:10px 12px;border:1px solid #D5DEEC;border-radius:10px;background:#fff;}
.ag-count{padding:2px 14px 8px;font-size:11.5px;color:#61708C;font-weight:600;}
.ag-list{padding:0 12px 40px;display:flex;flex-direction:column;gap:8px;}
.ag-row{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:#fff;border:1px solid #E4EAF2;border-radius:14px;padding:12px 14px;cursor:pointer;font:inherit;box-shadow:0 1px 3px rgba(20,30,55,.05);}
.ag-row:active{background:#f3f6fb;}
.ag-row-main{flex:1;min-width:0;}
.ag-name{font-size:15px;font-weight:800;color:#141E33;display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.ag-sub{font-size:12px;color:#61708C;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ag-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;}
.ag-chip{font-size:11px;font-weight:700;color:#4a5a76;background:#EEF2F8;border-radius:999px;padding:3px 9px;}
.ag-chip.touch{background:#E7EFFC;color:#2357b8;}
.ag-rating{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;border-radius:999px;padding:2px 8px;}
.ag-rating.hot{background:#FDE4E1;color:#C0392B;}
.ag-rating.warm{background:#FCF2DD;color:#9a6a12;}
.ag-rating.cool{background:#E1F0FB;color:#1f6aa8;}
.ag-due{font-size:11px;font-weight:800;border-radius:999px;padding:3px 9px;background:#E4F7EF;color:#0f7a56;}
.ag-due.over{background:#FDE4E1;color:#C0392B;}
.ag-row-arrow{color:#B5C0D4;font-size:22px;}
.ag-empty{padding:2rem;text-align:center;color:#8894a8;font-size:14px;}
.ag-empty-sm{padding:.5rem 0;color:#8894a8;font-size:12.5px;}
#ag-detail{display:none;padding:0 0 60px;}
.ag-back{margin:12px;border:1px solid #E4EAF2;background:#fff;border-radius:9px;padding:8px 14px;font:inherit;font-size:13px;font-weight:600;color:#2357b8;cursor:pointer;}
.ag-dhead{display:flex;gap:14px;align-items:flex-start;padding:4px 16px 14px;}
.ag-davatar{width:52px;height:52px;border-radius:50%;flex-shrink:0;background:linear-gradient(135deg,#2E6BD6,#0F9E6E);color:#fff;font-size:22px;font-weight:800;display:grid;place-items:center;}
.ag-dname{font-size:19px;font-weight:800;color:#141E33;}
.ag-dsub{font-size:12.5px;color:#61708C;margin-top:1px;}
.ag-dstats{font-size:12px;color:#4a5a76;margin-top:6px;font-weight:600;}
.ag-actions{display:flex;gap:8px;padding:0 16px 14px;}
.ag-act{flex:1;text-align:center;text-decoration:none;font-size:13px;font-weight:700;padding:11px;border-radius:11px;background:#fff;border:1px solid #D5DEEC;color:#2357b8;}
.ag-act.email{background:#2E6BD6;border-color:#2E6BD6;color:#fff;}
.ag-sec{background:#fff;border-top:1px solid #E4EAF2;border-bottom:1px solid #E4EAF2;margin-bottom:10px;padding:14px 16px;}
.ag-sec h4{margin:0 0 12px;font-size:12px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#8894a8;}
.ag-steps{display:flex;gap:6px;flex-wrap:wrap;}
.ag-step{width:38px;height:44px;border-radius:9px;background:#F1F4F9;border:1px solid #E4EAF2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;}
.ag-step-ic{font-size:14px;line-height:1;}
.ag-step-n{font-size:9px;font-weight:700;color:#94A2BC;}
.ag-step.done{background:#E4F7EF;border-color:#B7E6D2;}
.ag-next{margin-top:14px;}
.ag-next-label{font-size:13px;color:#141E33;margin-bottom:10px;}
.ag-log-btn{width:100%;border:0;border-radius:11px;background:#0F9E6E;color:#fff;font:inherit;font-size:14px;font-weight:800;padding:12px;cursor:pointer;}
.ag-log-btn:active{background:#0c7f59;}
.ag-ev{font-size:12.5px;color:#3a4761;padding:6px 0;border-bottom:1px solid #F0F3F8;}
.ag-ev-d{font-family:ui-monospace,Menlo,monospace;font-size:11.5px;color:#61708C;}
.ag-ev-st{font-size:10.5px;color:#C0392B;text-transform:uppercase;font-weight:700;margin-left:4px;}
.ag-visit{background:#F7F9FC;border:1px solid #EDF1F7;border-radius:10px;padding:10px 12px;margin-bottom:8px;}
.ag-visit-hd{font-size:12.5px;font-weight:700;color:#141E33;display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.ag-visit-lo{font-size:10.5px;color:#61708C;background:#EEF2F8;border-radius:999px;padding:2px 7px;font-weight:600;}
.ag-note{font-size:13px;color:#3a4761;margin-top:6px;white-space:pre-wrap;line-height:1.4;}
.ag-photos{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px;}
.ag-photo{width:72px;height:72px;object-fit:cover;border-radius:8px;border:1px solid #E4EAF2;}
.ag-hist{font-size:12.5px;color:#3a4761;padding:8px 0;border-bottom:1px solid #F0F3F8;}
.ag-hist-lo{font-size:10.5px;color:#61708C;background:#EEF2F8;border-radius:999px;padding:2px 7px;font-weight:600;margin-left:4px;}
/* ── Stage filters / work-queue / progress meter / add-contact ─────────────── */
.ag-add{font:inherit;font-size:12.5px;font-weight:700;border:1px solid rgba(255,255,255,.5);color:#fff;background:rgba(255,255,255,.12);border-radius:9px;padding:6px 10px;cursor:pointer;white-space:nowrap;}
.ag-add:active{background:rgba(255,255,255,.26);}
.ag-filters{display:flex;gap:6px;flex-wrap:wrap;padding:0 12px 8px;}
.ag-fchip{font:inherit;font-size:11.5px;font-weight:700;border:1px solid #D5DEEC;background:#fff;color:#61708C;border-radius:999px;padding:5px 11px;cursor:pointer;}
.ag-fchip.on{background:#2E6BD6;border-color:#2E6BD6;color:#fff;}
.ag-fchip[disabled]{opacity:.45;cursor:not-allowed;}
/* ── ROSTER (MLS source of truth) ── visually distinct from Campaigns on purpose:
   this data is read-only reference, not people you're working. ── */
.rs-scale{font-size:12px;font-weight:700;color:#B9CDE9;}
/* Roster top toolbar: title + search + scale in a blue sticky bar, matching the
   tour planner's top bar (#1B4F9A). */
/* Blue toolbar (like the tour planner). Grid: title on the left, a full-width
   search filling the rest, and the stats line on a second row aligned to the
   search's left edge. */
.dsec-hd.rs-toolbar{display:grid;grid-template-columns:auto 1fr;column-gap:14px;row-gap:8px;
  align-items:center;background:#1B4F9A;border-bottom:none;}
.dsec-hd.rs-toolbar h2{grid-column:1;grid-row:1;margin:0;white-space:nowrap;color:#fff;}
.rs-toolsearch{grid-column:2;grid-row:1;width:100%;max-width:none;box-sizing:border-box;
  font:inherit;font-size:14px;padding:9px 14px;border:1px solid #D5DEEC;border-radius:9px;background:#fff;}
.rs-toolsearch:focus{outline:none;border-color:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.25);}
/* Stats line: second row, under the search (col 2), styled like the tour
   planner's day summary. */
.rs-toolstats{grid-column:2;grid-row:2;}
.rs-toolstats:empty{display:none;}
.rs-toolstats .dash-headline{margin:0;padding:0;border:none;gap:3px 12px;}
.rs-toolstats .dh-stat{font-size:11.5px;color:#C8D8F0;padding-right:14px;}
.rs-toolstats .dh-stat b{font-size:12.5px;color:#fff;font-weight:800;}
.rs-toolstats .dh-stat:not(:last-child)::after{content:'·';right:4px;color:rgba(255,255,255,.4);}
.rs-hint{padding:26px 16px;text-align:center;color:#8894a8;font-size:13px;line-height:1.7;}
.rs-hint span{font-size:11.5px;color:#a6b0c0;}
.rs-grouphd{padding:10px 15px 6px;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#8894a8;}
.rs-row{display:flex;align-items:center;gap:10px;padding:9px 15px;border-bottom:1px solid #EEF2F7;cursor:pointer;user-select:none;}
.rs-row:hover{background:#F7FAFF;}
.rs-row .nm{font-weight:700;color:#26303f;font-size:13.5px;}
.rs-row .sub{font-size:11.5px;color:#8894a8;margin-top:2px;}
.rs-row .rs-grow{flex:1;min-width:0;}
.rs-row .rs-grow>div{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.rs-office{cursor:pointer;}
.rs-office:hover{background:#F7FAFF;}
.rs-badge{font-size:10.5px;font-weight:800;padding:3px 8px;border-radius:999px;background:#EEF3FB;color:#4A6DA8;white-space:nowrap;}
.rs-back{font:inherit;font-size:12px;font-weight:700;color:#2E6BD6;background:none;border:none;cursor:pointer;padding:10px 15px 4px;}
.rs-blast{margin:10px 14px;padding:12px 14px;border:1px solid #D5DEEC;border-radius:12px;background:#F7FAFF;}
.rs-blast h4{margin:0 0 8px;font-size:13px;color:#26303f;}
.rs-blast .rs-stats{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:#61708C;}
.rs-blast .rs-stats b{color:#26303f;}
.rs-warn{margin-top:8px;font-size:11.5px;color:#b26b00;}
/* Office view: identity panel left, people right — the shape of Paragon's User
   Roster, which is how LOs already read this data. Collapses to one column on
   narrow screens so the table still owns the width it needs. */
/* Office view: stack the compact identity card on top, people table full-width
   below — so the table gets the whole width and stays tidy (not squeezed beside
   the panel). */
.rs-officewrap{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:8px 0 20px;}
.rs-officewrap .rs-idcard{width:100%;max-width:420px;box-sizing:border-box;}
.rs-idcard{border:1px solid #D5DEEC;border-radius:12px;background:#F7FAFF;padding:11px 13px;}
.rs-oname{font-weight:800;font-size:14px;color:#26303f;line-height:1.3;}
.rs-ocode{font-size:11px;font-weight:700;color:#8894a8;margin-top:2px;}
.rs-oaddr{font-size:12px;color:#61708C;margin-top:8px;line-height:1.55;}
.rs-obroker{margin-top:10px;font-size:12.5px;font-weight:700;color:#26303f;}
.rs-obroker span{display:block;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#8894a8;margin-bottom:2px;}
.rs-ocount{margin-top:11px;padding-top:10px;border-top:1px solid #D5DEEC;font-size:12px;color:#61708C;}
.rs-ocount b{color:#26303f;}
.rs-missing{margin-top:8px;font-size:11px;color:#a6b0c0;font-style:italic;}
.rs-people{width:100%;min-width:0;overflow-x:auto;}
.rs-table{width:100%;border-collapse:collapse;font-size:12.5px;}
.rs-table th{text-align:left;font-size:10.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#8894a8;padding:6px 10px;border-bottom:1px solid #D5DEEC;white-space:nowrap;}
.rs-table td{padding:7px 10px;border-bottom:1px solid #EEF2F7;color:#61708C;vertical-align:top;}
.rs-table td.nm{font-weight:700;color:#26303f;white-space:nowrap;}
.rs-shared{display:block;font-size:11px;color:#b26b00;}
.rs-noemail{color:#b26b00;}
.rs-link{color:#2E6BD6;cursor:pointer;}
.rs-link:hover{text-decoration:underline;}
.rs-srcnote{padding:2px 15px 10px;font-size:11.5px;color:#8894a8;}
.rs-srcnote.rs-empty{font-style:italic;color:#a6b0c0;}
.rs-idcard a{color:#2E6BD6;text-decoration:none;}
.rs-idcard a:hover{text-decoration:underline;}
/* ══════════ Agent dashboard ══════════ */
/* Hero band — identity + headline production facts, high contrast on a color field. */
/* Hero + cards left-justify and size to their content (as narrow as needed),
   rather than stretching across the pane. */
.rs-hero{display:flex;justify-content:space-between;align-items:center;gap:48px;flex-wrap:wrap;
  width:fit-content;max-width:100%;
  background:linear-gradient(120deg,#213E6B,#2E6BD6);color:#fff;
  border-radius:14px;padding:16px 22px;margin:6px 0 16px;box-shadow:0 2px 8px rgba(22,40,80,.18);}
.rs-hero-name{font-size:22px;font-weight:800;letter-spacing:-.01em;}
.rs-hero-sub{font-size:13px;margin-top:3px;color:#D6E3F7;}
.rs-hero-sub a{color:#fff;cursor:pointer;border-bottom:1px solid rgba(255,255,255,.5);}
.rs-hero-stats{display:flex;gap:9px;flex-wrap:wrap;}
.rs-chip{background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.22);
  border-radius:10px;padding:7px 13px;text-align:center;min-width:72px;}
.rs-chip .v{font-size:16px;font-weight:800;line-height:1.05;}
.rs-chip .l{font-size:9px;text-transform:uppercase;letter-spacing:.05em;color:#CDDDF3;margin-top:3px;}

/* Three cards: Contact | Production | Office. align-items:start = natural heights. */
.rs-cards{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:14px;align-items:start;}
.rs-card{background:#fff;border:1px solid #E1E8F2;border-radius:12px;
  box-shadow:0 1px 3px rgba(22,32,46,.06);padding:13px 16px;}
.rs-card-h{margin:0 0 10px;padding-bottom:8px;border-bottom:1px solid #EEF2F8;
  font-size:10.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:#16202E;}
.rs-line{font-size:13px;color:#26303f;line-height:1.35;padding:3px 0;}
.rs-line a{color:#2E6BD6;text-decoration:none;cursor:pointer;}
.rs-line a:hover{text-decoration:underline;}
.rs-line.rs-strong{font-size:15px;font-weight:800;color:#16202E;}
.rs-line.rs-muted{color:#6B7A90;}
.rs-k{display:inline-block;min-width:50px;color:#16202E;font-size:11.5px;}
.rs-subblock{margin-top:8px;padding-top:8px;border-top:1px solid #F1F4F9;}
/* Broker block — green highlight (Head Broker, matching the office table). */
.rs-brokerbox{margin:8px -16px -13px;padding:9px 16px 11px;background:#E4F6E9;border-top:1px solid #CDE9D5;border-radius:0 0 12px 12px;}
.rs-brokerbox .rs-k{color:#5a7d66;}

/* Production table inside its card — 4 equal, evenly distributed columns. */
/* Sized to content (as narrow as the widest cell allows) rather than a fixed
   width, so the Production card hugs its own numbers. */
.rs-ptab{width:auto;border-collapse:collapse;font-variant-numeric:tabular-nums;}
.rs-ptab th,.rs-ptab td{text-align:center;padding-left:10px;padding-right:10px;}
.rs-ptab th:first-child,.rs-ptab td:first-child{padding-left:0;}
.rs-ptab th:last-child,.rs-ptab td:last-child{padding-right:0;}
.rs-ptab th{font-size:9.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
  color:#16202E;padding:0 8px 6px;border-bottom:1px solid #E1E8F2;}
.rs-ptab td{padding:5px 8px;font-size:12.5px;color:#26303f;border-bottom:1px solid #F3F6FB;}
.rs-ptab tbody tr:last-child td{border-bottom:none;}
.rs-pyear{font-weight:800;color:#16202E;}
.rs-pu{color:#6B7A90;}
.rs-pv{font-weight:600;color:#16202E;}
.rs-pr{color:#9AA7B8;}
.rs-pzero td{color:#B7C0CE;}
.rs-pzero .rs-pv{font-weight:600;color:#B7C0CE;}

/* Sections with a clear header + rule. */
/* Visit log table. The timestamp column is the anchor: fixed width, tabular figures, and
   sorted descending by default, so the newest visit is always the first row. */
.vw-c-stamp{white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:600;color:#22303f;}
.vw-c-note{max-width:340px;color:#22303f;}
.vw-c-photos{white-space:nowrap;}
.vw-c-photos img{width:38px;height:38px;object-fit:cover;border-radius:4px;border:1px solid #d7deea;
                 vertical-align:middle;margin-left:3px;}
.vw-none{font-size:12px;color:#9aa5b4;font-style:italic;}
.ap-feed{display:flex;flex-direction:column;gap:10px;padding:4px 2px;}
.ap-feed-item{border-left:2px solid #d7deea;padding-left:10px;}
.ap-feed-meta{font-size:11px;color:#7a869a;margin-bottom:3px;}
.ap-feed-note{font-size:13px;color:#22303f;white-space:pre-wrap;}
.ap-feed-photo{max-width:150px;max-height:150px;border-radius:6px;display:block;border:1px solid #d7deea;}
/* Each activity source (Open houses, Your visits, Campaign) and the office
   roster are their own white card, sized to their table (as narrow as the
   content) and left-justified. */
.rs-section,#rs-officeroster{margin-top:14px;background:#fff;border:1px solid #E1E8F2;border-radius:12px;
  box-shadow:0 1px 3px rgba(22,32,46,.06);padding:13px 16px;width:fit-content;max-width:100%;box-sizing:border-box;}
.rs-sec-h{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:800;color:#16202E;
  text-transform:uppercase;letter-spacing:.03em;padding-bottom:8px;border-bottom:2px solid #E1E8F2;margin-bottom:10px;}
.rs-count{background:#2E6BD6;color:#fff;font-size:11px;font-weight:800;border-radius:999px;padding:1px 9px;}
.rs-sec-sub{font-size:11.5px;font-weight:600;color:#9AA7B8;text-transform:none;letter-spacing:0;}
.rs-sec-note{font-size:12.5px;color:#5B6B82;padding:2px 0 6px;}
.rs-sec-note.rs-empty{color:#9AA7B8;font-style:italic;}
.rs-sec-note b{color:#16202E;}

/* Data tables — striped, tight rows, sortable sticky header.
   Uniform table-box: only as wide as its columns need (scrolls sideways past the
   container), a capped height (~a screenful) so a long table scrolls inside its own
   box instead of running off the page, on a rounded white card. Shared shape with the
   Funnel results box (.fnl-tablewrap). */
.rs-tablewrap{overflow:auto;border:1px solid #E1E8F2;border-radius:12px;background:#fff;width:fit-content;max-width:100%;max-height:calc(100vh - 210px);}
/* bounded scroll region for long sections (career sold, office roster) so they don't
   fill the viewport; overflow + sticky header inherited from above. */
.rs-tablewrap.rs-scroll{max-height:360px;}
.rs-dtable{width:auto;border-collapse:collapse;font-size:12.5px;}
.rs-dtable thead th{position:sticky;top:0;background:#CBD8EA;text-align:left;
  font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#1B2B41;
  padding:6px 8px;border-bottom:1px solid #A6BAD6;white-space:nowrap;z-index:1;}
.rs-dtable td{padding:3px 8px;color:#3A4759;border-bottom:1px solid #EFF3F9;white-space:nowrap;line-height:1.4;}
/* breathing room on the last column so its content (e.g. email) isn't jammed against the
   table edge / vertical scrollbar — mirrors the left margin of the first column. */
.rs-dtable th:last-child,.rs-dtable td:last-child{padding-right:18px;}
#rs-officeroster .rs-dtable th:last-child,#rs-officeroster .rs-dtable td:last-child{padding-right:18px;}
.rs-dtable tbody tr:nth-child(even){background:#F8FAFD;}
.rs-dtable tbody tr:hover{background:#EDF4FF;}
/* Type shading (after the zebra so it wins at equal specificity): Head Broker
   green, any non-Salesperson role yellow. */
.rs-dtable tbody tr.rs-rt-broker{background:#E4F6E9;}
.rs-dtable tbody tr.rs-rt-broker:hover{background:#D5EFDD;}
.rs-dtable tbody tr.rs-rt-other{background:#FCF6DA;}
.rs-dtable tbody tr.rs-rt-other:hover{background:#F5EDC5;}
/* The office aggregate row — whole-office totals, pinned above the Head Broker.
   White ground for maximum contrast against the zebra/tinted rows below it. */
.rs-dtable tbody tr.rs-rt-office{background:#fff;box-shadow:inset 0 -2px 0 #C4D6F2;}
.rs-dtable tbody tr.rs-rt-office:hover{background:#F4F8FF;}
/* Reading rule: a horizontal divider every N agent rows in the office roster,
   matching the office row's under-line. */
#rs-officeroster .rs-dtable tbody tr.rs-rule{box-shadow:inset 0 -2px 0 #C4D6F2;}
.rs-dtable td.rs-officecell{color:#1B3E78;}
/* Office roster: thin vertical divider between every column, with a bold border
   bracketing the production block (before Best Rank .rs-bl, after 2023 .rs-br). */
#rs-officeroster .rs-dtable th,#rs-officeroster .rs-dtable td{border-right:1px solid #E6ECF4;}
#rs-officeroster .rs-dtable th:last-child,#rs-officeroster .rs-dtable td:last-child{border-right:none;}
#rs-officeroster .rs-dtable th.rs-bl,#rs-officeroster .rs-dtable td.rs-bl{border-left:2px solid #AEBBCE;}
#rs-officeroster .rs-dtable th.rs-br,#rs-officeroster .rs-dtable td.rs-br{border-right:2px solid #AEBBCE;}
/* Content-width box (matches the Funnel results box): the roster is only as wide as
   its columns, scrolling sideways inside its own bordered card when that exceeds the
   container rather than filling the pane. The base .rs-tablewrap caps its height. */
#rs-officeroster{width:fit-content;max-width:100%;}
/* Tighter cells so all 11 columns fit without a scroll on a normal-width sheet;
   the extra padding-bottom keeps the horizontal scrollbar (when it does appear on
   a narrow window) off the last data row. */
#rs-officeroster .rs-dtable th,#rs-officeroster .rs-dtable td{padding:3px 6px;}
#rs-officeroster .rs-tablewrap{padding-bottom:12px;max-height:440px;}
th.rs-ohk,td.rs-ohk{width:30px;text-align:center;padding-left:9px;padding-right:5px;}
td.rs-ohk input,th.rs-ohk input{cursor:pointer;width:15px;height:15px;margin:0;vertical-align:middle;}
.rs-oh-foot{display:flex;align-items:center;gap:16px;padding:12px 6px 6px;}
.rs-oh-addbtn{padding:8px 16px;border:0;border-radius:9px;background:#2E6BD6;color:#fff;font:inherit;font-weight:800;font-size:13px;cursor:pointer;}
.rs-oh-addbtn:hover:not(:disabled){background:#255cbf;}
.rs-oh-addbtn:disabled{opacity:.4;cursor:not-allowed;}
.rs-oh-link{color:#2E6BD6;font-size:12.5px;font-weight:700;cursor:pointer;}
.rs-oh-link:hover{text-decoration:underline;}
.rs-oh-hint{color:#8894a8;font-size:12.5px;font-weight:600;}
.rs-dtable td.nm{font-weight:700;color:#16202E;}
.rs-dtable .rs-num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;}
.rs-dtable thead th.rs-num{text-align:right;}   /* numeric headings sit over their values */
.rs-dtable td.rs-strong2{font-weight:700;color:#16202E;}
.rs-dtable td a{color:#2E6BD6;text-decoration:none;}
.rs-dtable td a:hover{text-decoration:underline;}
/* Sortable headers */
.rs-dtable th.rs-sortable{cursor:pointer;user-select:none;}
.rs-dtable th.rs-sortable:hover{background:#E4EDF7;color:#16202E;}
.rs-dtable th.on{color:#2E6BD6;}
.rs-sarr{font-size:8px;margin-left:4px;vertical-align:middle;}
.rs-sarr:empty{margin-left:0;}

/* ── Roster: search-autocomplete + a single full-width main pane holding the
   merged office+agent view. ── */
#sec-roster,#sec-ma,#sec-agent{display:flex;flex-direction:column;height:100vh;overflow:hidden;}
#sec-roster .ta-body,#sec-ma .ta-body,#sec-agent .ta-body{flex:1;min-height:0;padding:0;max-width:none;}
.rs-mainpane{height:100%;overflow-y:auto;background:#EDF1F7;padding:14px 16px 48px 4px;}
.rs-detail-empty{padding:70px 24px;text-align:center;color:#9AA7B8;font-size:14px;}
/* Content is left-justified and only as wide as it needs. */
.rs-detail-inner{max-width:none;}   /* let the office roster fit its full width; the cards row stays capped below */

/* Autocomplete dropdown under the search box. */
.rs-searchwrap{flex:1;max-width:680px;position:relative;}
.rs-ac{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:120;background:#fff;
  border:1px solid #D5DEEC;border-radius:10px;box-shadow:0 8px 28px rgba(16,26,45,.22);
  max-height:60vh;overflow-y:auto;padding:4px 0;}
.rs-ac-hd{font-size:9.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#9AA7B8;padding:8px 14px 4px;}
.rs-ac-item{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:6px 14px;cursor:pointer;}
.rs-ac-item:hover{background:#EEF4FE;}
.rs-ac-nm{font-size:13.5px;font-weight:700;color:#16202E;white-space:nowrap;}
.rs-ac-sub{font-size:11.5px;color:#8894a8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.rs-ac-empty{padding:12px 14px;color:#8894a8;font-size:13px;}

/* Merged view: office card (left) + agent column (right), roster below. */
.rs-oa-top{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-start;margin-bottom:6px;max-width:1250px;}
#rs-oa-officecol{flex:0 0 auto;margin-left:auto;}  /* always right-justified — same spot on the agent page and the office page, so it never hops */
#rs-oa-agentcol{flex:0 1 auto;}
.rs-oa-agentwrap{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-start;}
.rs-oa-office{width:fit-content;box-sizing:border-box;}
.rs-oa-agent{min-width:300px;box-sizing:border-box;}
.rs-oa-prod{width:auto;box-sizing:border-box;}
.rs-agentname{font-size:16px;font-weight:800;color:#16202E;}
/* Unified agent page — Agent + Office content-width, side by side, left-justified; then
   full-width sections; Production-by-year & Sold-career share a paired row. */
.ap-detail .ap-toprow{display:flex;flex-wrap:wrap;gap:14px;align-items:stretch;justify-content:flex-start;margin-bottom:14px;}
.ap-card{width:fit-content;max-width:440px;box-sizing:border-box;}
.ap-agentcard{min-width:290px;}
.ap-statsrow{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 14px;}
/* Notes & photos timeline (bottom of the agent page): note text or photo thumbnail + a
   time/LO/location meta line, newest first. */
.ap-timeline{display:flex;flex-direction:column;gap:10px;}
.ap-tl-item{border-left:3px solid #d7e0ee;padding:2px 0 2px 12px;}
.ap-tl-note{font-size:13.5px;color:#26303f;line-height:1.4;white-space:pre-wrap;}
.ap-tl-meta{font-size:11px;color:#8894a8;font-weight:600;margin-top:3px;}
.ap-tl-photo{max-width:180px;max-height:180px;border-radius:8px;border:1px solid #e4eaf2;display:block;}
.ap-tl-photoitem{border-left-color:#159c6e;}
/* Agent-page CRM overlay (the LO's editable layer). */
.ap-crm-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;}
.ap-crm-col{display:flex;flex-direction:column;gap:8px;}
.ap-crm-h{font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#8CA0BE;}
.ap-crm-none{font-size:12px;color:#9AAAC2;}
.ap-crm-fld{display:flex;align-items:center;gap:8px;font-size:12.5px;} .ap-crm-fld span{min-width:80px;color:#5a6b86;font-weight:600;}
.ap-crm-fld input,#ap-crm textarea{flex:1;font:inherit;font-size:12.5px;padding:5px 8px;border:1px solid #D5DEEC;border-radius:7px;}
#ap-crm textarea{min-height:56px;resize:vertical;width:100%;box-sizing:border-box;}
.ap-crm-add{align-self:flex-start;border:1px solid #2E6BD6;background:#EEF4FE;color:#2E6BD6;font:inherit;font-size:12px;font-weight:700;border-radius:7px;padding:5px 11px;cursor:pointer;}
.ap-crm-add:hover{background:#2E6BD6;color:#fff;}
.ap-crm-notes{display:flex;flex-direction:column;gap:7px;margin-top:2px;}
.ap-crm-note{border-left:3px solid #d7e0ee;padding:1px 0 1px 9px;font-size:12.5px;color:#26303f;}
.ap-crm-nm{font-size:10.5px;color:#8894a8;font-weight:600;margin-top:2px;}
.ap-crm-enr{border:1px solid #E4EAF2;border-radius:8px;padding:8px 10px;background:#FAFCFE;}
.ap-crm-enr b{font-size:12.5px;color:#16202E;}
.ap-crm-em{display:flex;align-items:center;gap:6px;font-size:11px;color:#8894a8;margin-top:4px;flex-wrap:wrap;}
.ap-crm-mark{border:1px solid #1F9E56;background:#E7F5EC;color:#1B7F45;font:inherit;font-size:11px;font-weight:700;border-radius:6px;padding:3px 8px;cursor:pointer;}
.ap-crm-mark:hover{background:#1F9E56;color:#fff;}
.ap-crm-rm{border:0;background:none;color:#C0455B;font:inherit;font-size:11px;cursor:pointer;padding:0;}
.ap-crm-assign{display:flex;gap:7px;margin-top:6px;} .ap-crm-assign select{flex:1;font:inherit;font-size:12px;padding:4px 6px;border:1px solid #D5DEEC;border-radius:7px;}
/* Unified activity feed — log controls, scope toggle, per-kind accents. */
.ap-act-log{margin-bottom:12px;}
.ap-act .ap-act-body{width:100%;box-sizing:border-box;min-height:52px;resize:vertical;font:inherit;font-size:13px;padding:8px 10px;border:1px solid #D5DEEC;border-radius:9px;}
.ap-act-btns{display:flex;flex-wrap:wrap;gap:7px;margin-top:8px;}
.ap-act-b{border:1px solid #C9D6E8;background:#fff;color:#26303f;font:inherit;font-size:12.5px;font-weight:600;border-radius:8px;padding:6px 11px;cursor:pointer;}
.ap-act-b:hover{background:#EEF4FE;border-color:#2E6BD6;color:#2E6BD6;}
.ap-act-scope{display:flex;align-items:center;gap:6px;margin-bottom:12px;}
.ap-act-sclbl{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#8CA0BE;margin-right:2px;}
.ap-act-sc{border:1px solid #C9D6E8;background:#fff;color:#5a6b86;font:inherit;font-size:12px;font-weight:700;padding:4px 12px;cursor:pointer;}
.ap-act-sc:first-of-type{border-radius:8px 0 0 8px;} .ap-act-sc:last-of-type{border-radius:0 8px 8px 0;border-left:0;} .ap-act-sc:not(:first-of-type):not(:last-of-type){border-left:0;}
.ap-act-sc.on{background:#2E6BD6;border-color:#2E6BD6;color:#fff;}
.ap-act-k-call{border-left-color:#C9871C;} .ap-act-k-text{border-left-color:#7A5AF8;} .ap-act-k-email{border-left-color:#2E6BD6;}
.ap-act-k-visit{border-left-color:#159C6E;} .ap-act-k-note{border-left-color:#8CA0BE;} .ap-act-k-cadence{border-left-color:#1F9E56;}
.ap-act-photo{position:relative;} .ap-act-photo input{position:absolute;left:-9999px;}
.ap-act-feed .ap-tl-item{position:relative;padding-right:26px;}
.ap-act-del{position:absolute;top:3px;right:2px;border:0;background:none;color:#C1CBDA;cursor:pointer;font-size:12px;line-height:1;padding:3px 6px;border-radius:6px;}
.ap-act-del:hover{background:#FBE9E7;color:#C0455B;}
/* Cadence worklist (Calls/Text/Email/Visits pillar pages) */
.wl-host{margin:0 0 18px;}
.wl-sec{background:#fff;border:1px solid #E4EAF2;border-radius:12px;padding:14px 16px;}
.wl-h{font-size:15px;font-weight:800;color:#16202E;display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:6px;}
.wl-count{background:#2E6BD6;color:#fff;font-size:12px;font-weight:800;border-radius:10px;padding:1px 9px;}
.wl-sub{font-size:12px;font-weight:600;color:#8CA0BE;}
.wl-empty,.wl-loading{font-size:13px;color:#8894a8;padding:6px 0;}
.wl-grp{margin-top:12px;}
.wl-grp-h{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:#2E6BD6;margin-bottom:4px;padding-bottom:4px;border-bottom:1px solid #EEF2F8;}
.wl-grp-n{color:#8CA0BE;}
.wl-rw{border-bottom:1px solid #F4F7FB;}
.wl-rw .wl-row{border-bottom:0;}
.wl-row{display:flex;align-items:center;gap:12px;padding:7px 0;border-bottom:1px solid #F4F7FB;}
.wl-done{flex:none;width:26px;height:26px;border-radius:7px;border:1px solid #1F9E56;background:#E7F5EC;color:#1B7F45;font-size:14px;font-weight:800;cursor:pointer;line-height:1;}
.wl-done:hover{background:#1F9E56;color:#fff;}
.wl-name{font-weight:700;color:#16202E;font-size:13.5px;min-width:150px;}
.wl-contact{color:#2E6BD6;font-size:13px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.wl-send{flex:none;font:inherit;font-size:12px;font-weight:800;padding:5px 12px;border-radius:7px;border:1px solid transparent;cursor:pointer;white-space:nowrap;}
.wl-send.sms{background:#159C6E;color:#fff;} .wl-send.sms:hover{background:#0F7E58;}
.wl-send.mail{background:#2E6BD6;color:#fff;} .wl-send.mail:hover{background:#255ab4;}
.wl-send.graph{background:#2E6BD6;color:#fff;} .wl-send.graph:hover{background:#255ab4;}
.wl-send.graph:disabled{opacity:.6;cursor:default;}
.wl-send.copy{background:#fff;color:#2E6BD6;border-color:#C7D6EA;} .wl-send.copy:hover{background:#EFF4FC;}
.wl-send.sent{background:#EAF0F8;color:#61708C;border-color:#D5DEEC;}
.wl-m365{margin:2px 0 12px;padding:10px 14px;border-radius:9px;background:#F4F8FF;border:1px solid #DCE7F7;
  font-size:13px;color:#40506B;display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.wl-m365.on{background:#EFFaf5;border-color:#BFE6D5;color:#146c4e;}
.wl-m365 a{color:#2E6BD6;font-weight:700;text-decoration:none;} .wl-m365 a:hover{text-decoration:underline;}
.wl-m365-btn{margin-left:auto;font:inherit;font-size:12.5px;font-weight:800;padding:6px 14px;border-radius:7px;
  border:1px solid #C7D6EA;background:#fff;color:#2E6BD6;cursor:pointer;white-space:nowrap;}
.wl-m365-btn.on{background:#2E6BD6;color:#fff;border-color:#2E6BD6;}
.wl-m365-btn:hover{filter:brightness(.96);}
.wl-due{font-size:11.5px;color:#8894a8;white-space:nowrap;}
.wl-msg{font-size:12px;color:#4A5A72;padding:0 0 8px 38px;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.wl-msg.none{color:#A6B2C4;font-style:italic;}
.cw-livehd{font-size:15px;font-weight:800;color:#16202E;margin:4px 0 10px;}
.cw-livesub{font-size:12px;font-weight:600;color:#8CA0BE;}
.ap-officecard{min-width:290px;}   /* identical frame to the agent card */
.ap-detail .ap-pair{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-start;justify-content:flex-start;}
/* each table sizes to its own content (no forced shrink, no wrap), left-justified; wraps to a
   new row only when both won't fit. */
.ap-detail .ap-pair-col{flex:0 0 auto;max-width:100%;}
.ap-detail .ap-pair .rs-section{width:fit-content;max-width:100%;}
.ap-detail .rs-section{margin-top:0;}
/* Production & sold — two sortable views (Annual / All deals) flipped by a header chip; each
   is a content-width rs-dtable that scrolls internally at ~15 rows. */
/* one conjoined segmented toggle, LEFT-justified (right after the subtitle) so it stays put
   when the table width changes between views instead of jumping with the right edge. */
.ps-chips{display:inline-flex;border:1px solid #C9D9F0;border-radius:999px;overflow:hidden;}
.ps-chip{border:0;background:#fff;color:#1B3E78;font:inherit;font-weight:700;
  font-size:11.5px;padding:3px 14px;cursor:pointer;}
.ps-chip+.ps-chip{border-left:1px solid #C9D9F0;}
.ps-chip:hover{background:#F3F8FF;}
.ps-chip.on{background:#2E6BD6;color:#fff;}
/* keep the header on one tight line (title · count · toggle) and drop the deal-count subtitle
   onto its own line below, so the long text doesn't stretch the card width. */
.ps-sech{flex-wrap:wrap;row-gap:0;}
.ps-subline{flex-basis:100%;margin:1px 0 0;line-height:1.05;}
.ps-section.ps-mode-annual .ps-detail{display:none;}
.ps-section.ps-mode-detail .ps-annual{display:none;}
/* teams in the roster: a badge + a chip filter that separates individuals from teams */
.ap-teambadge{display:inline-block;margin-left:5px;padding:0 5px;border-radius:5px;font-size:9px;
  font-weight:800;letter-spacing:.03em;background:#EDE7FB;color:#6B4FBB;vertical-align:1px;}
.ros-chips{margin-left:10px;}
#rs-officeroster.ros-agents tbody tr.ap-team{display:none;}
#rs-officeroster.ros-teams tbody tr:not(.rs-rt-office):not(.ap-team){display:none;}
.ps-annual .rs-tablewrap, .ps-detail .rs-tablewrap, .cb-scroll .rs-tablewrap{max-height:420px;}   /* ~15 rows, then scroll */
.ps-sub2{color:#8798AD;font-style:italic;font-size:11px;padding:5px 2px 0;}
/* Massachusetts agent card */
.ma-agent{width:360px;box-sizing:border-box;}
.ma-agenthd{display:flex;gap:12px;align-items:flex-start;margin-bottom:8px;}
.ma-photo{width:64px;height:64px;object-fit:cover;border-radius:8px;flex:0 0 auto;background:#EDF1F7;}
.ma-prod{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 10px;}
.ma-pstat{flex:1 1 auto;min-width:96px;background:#F4F7FB;border:1px solid #E1E8F0;border-radius:8px;padding:8px 12px;}
.ma-pstat b{display:block;font-size:17px;color:#12213A;line-height:1.15;}
.ma-pstat span{font-size:11px;color:#5A6B82;text-transform:uppercase;letter-spacing:.04em;}
.ma-tier{display:inline-block;vertical-align:middle;font-size:10px;font-weight:800;letter-spacing:.05em;
  padding:2px 7px;border-radius:10px;line-height:1.4;}
.ma-tier-hot{background:#FDE2E1;color:#B42318;}
.ma-tier-warm{background:#FEF0C7;color:#B54708;}
.ma-tier-active{background:#E1EFFE;color:#1849A9;}
.ma-year{border:1px solid #E1E8F0;border-radius:8px;margin-bottom:6px;background:#fff;overflow:hidden;}
.ma-year[open]{background:#FBFCFE;}
.ma-year-sum{list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;
  padding:9px 12px;font-size:13px;user-select:none;}
.ma-year-sum::-webkit-details-marker{display:none;}
.ma-year-sum::before{content:'+';font-weight:800;color:#8595AB;width:12px;flex:0 0 12px;text-align:center;}
.ma-year[open] .ma-year-sum::before{content:'\2212';}
.ma-year-y{font-weight:800;color:#16202E;min-width:44px;}
.ma-year-stat{color:#3D4C60;}
.ma-year-stat b{color:#12213A;}
.ma-year .rs-tablewrap{border-top:1px solid #E1E8F0;margin:0;}
.rs-agentchips{display:flex;flex-wrap:nowrap;gap:7px;margin:9px 0;}
.rs-achip{background:#fff;border:1px solid #CBD8EA;border-radius:9px;padding:5px 9px;text-align:center;min-width:56px;box-shadow:0 1px 2px rgba(20,30,51,.05);}
.rs-achip .v{font-size:14px;font-weight:800;color:#16202E;line-height:1.05;}
.rs-achip .l{font-size:8.5px;text-transform:uppercase;letter-spacing:.04em;color:#16202E;margin-top:2px;}
.rs-agentprod{margin-top:10px;padding-top:9px;border-top:1px solid #F1F4F9;}
/* Selected agent's row in the roster. */
/* The agent being viewed is highlighted GREEN — the same green as their Head
   Broker row — so "this is the agent" reads at a glance in the office roster. */
#rs-officeroster tr.rs-selrow{box-shadow:inset 3px 0 0 #2E9E5B;}
#rs-officeroster tr.rs-selrow td{background:#E4F6E9 !important;font-weight:600;}

@media (max-width:900px){
  .rs-oa-office,.rs-oa-agent{width:100%;}
}

@media (max-width:900px){
  .rs-hero{flex-direction:column;align-items:flex-start;}
}
@media (max-width:860px){
  .rs-officewrap{flex-direction:column;}
  .rs-idcard{flex:1 1 auto;width:100%;box-sizing:border-box;}
}
.ag-summary{display:flex;gap:12px;padding:0 14px 8px;font-size:11.5px;font-weight:700;color:#61708C;}
.ag-summary .over{color:#C0392B;}
.ag-meter{display:flex;gap:2px;margin-top:8px;}
.ag-seg{flex:1;height:6px;border-radius:3px;background:#E4EAF2;}
.ag-seg.on{background:#2E6BD6;}
.ag-seg.done{background:#0F9E6E;}
.ag-cta{font:inherit;font-size:11px;font-weight:800;color:#2357b8;background:#E7EFFC;border-radius:999px;padding:4px 10px;}
.ag-chip.oh{background:#FCF2DD;color:#9a6a12;}
.ag-modal{display:none;position:fixed;inset:0;z-index:1200;background:rgba(0,0,0,.5);align-items:center;justify-content:center;padding:20px;}
.ag-modal.show{display:flex;}
.ag-modal-box{background:#fff;border-radius:14px;padding:20px;width:100%;max-width:360px;}
.ag-modal-box h3{font-size:16px;font-weight:800;color:#141E33;margin-bottom:14px;}
.ag-modal-in{width:100%;font:inherit;font-size:14px;padding:10px 12px;border:1px solid #D5DEEC;border-radius:9px;margin-bottom:9px;outline:none;}
.ag-modal-in:focus{border-color:#2E6BD6;}
.ag-modal-err{color:#C0392B;font-size:12px;font-weight:600;min-height:16px;margin-bottom:6px;}
.ag-modal-actions{display:flex;gap:8px;margin-top:4px;}
.ag-modal-cancel{flex:1;font:inherit;font-size:14px;font-weight:700;padding:10px;border:1px solid #D5DEEC;background:#fff;color:#61708C;border-radius:9px;cursor:pointer;}
.ag-modal-save{flex:2;font:inherit;font-size:14px;font-weight:800;padding:10px;border:0;background:#0F9E6E;color:#fff;border-radius:9px;cursor:pointer;}
.ag-modal-save:disabled{opacity:.6;cursor:default;}
@media(min-width:721px){ #ag-list,.ag-tabs,.ag-searchbar,.ag-filters,.ag-summary,.ag-count,#ag-detail{max-width:720px;margin-left:auto;margin-right:auto;} }
/* ── Touch-schedule editor (lives in the Schedule section) ───────────────── */
.ta-body{padding:12px 18px 22px;max-width:720px;}   /* no-wrap floor for the touch fields — tighter wraps them */
.ta-note{font-size:12.5px;color:#455168;margin-bottom:14px;line-height:1.5;}
/* ── Cadence steps — a LARGE channel icon is the hero on the far left of each step, so the
      touch type is unmistakable at a glance (the icon, not colour, carries identity). A clean
      white panel beside it holds the editor. ──────────────────────────────────────────── */
.ta-cards{display:flex;flex-direction:column;align-items:flex-start;gap:8px;max-height:calc(100vh - 230px);overflow-y:auto;padding:2px;}
.ta-cards-empty{padding:26px;text-align:center;color:#5A6B84;background:#fff;border:1px dashed #C2D0E4;border-radius:10px;}
.cad-step{--tc-color:#5B6B84;flex:0 0 auto;display:flex;gap:9px;align-items:stretch;}
.cad-step.cad-off{opacity:.58;}
/* channel colours — the icon differentiates; colour is a supporting accent */
.tc-email{--tc-color:#12A3A8;}    /* teal    */
.tc-call{--tc-color:#E67E22;}     /* orange  */
.tc-text{--tc-color:#2AA65A;}     /* green   */
.tc-arrival{--tc-color:#8E44D4;}  /* purple  */
.tc-note{--tc-color:#6B7688;}     /* slate   */
.tc-invite{--tc-color:#E0567F;}   /* rose    */
.tc-inperson{--tc-color:#3B7DE0;} /* blue    */
/* the big icon badge — the hero, large enough to recognise instantly */
.cad-stepno{flex:none;font-size:20px;font-weight:800;color:#0B1220;min-width:24px;text-align:center;line-height:1;
  font-variant-numeric:tabular-nums;}
/* the editor panel */
.cad-panel{flex:0 0 auto;min-width:0;background:#fff;border:1px solid #C4D0E2;border-left:3px solid var(--tc-color);
  border-radius:5px;overflow:hidden;}
.cad-phead{display:flex;align-items:flex-end;flex-wrap:nowrap;gap:6px 9px;padding:5px 10px 7px;
  background:color-mix(in srgb, var(--tc-color) 14%, #ffffff);
  border-bottom:1px solid color-mix(in srgb, var(--tc-color) 30%, #ffffff);}
.cad-when-inline{display:flex;align-items:center;gap:6px;}
.cad-when-inline>select{width:120px;flex:none;font-weight:600;}
.cad-when-inline .cad-day{width:50px;flex:none;text-align:center;}
.cad-dayunit{font-size:12px;color:#63728C;font-weight:700;}
.cad-toggle{display:inline-flex;align-items:center;gap:6px;cursor:pointer;user-select:none;flex:none;}
.cad-toggle input{position:absolute;opacity:0;width:0;height:0;}
.cad-sw{width:32px;height:18px;border-radius:18px;background:#C4D0E2;position:relative;transition:background .15s;flex:none;}
.cad-sw::after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:#fff;
  transition:transform .15s;box-shadow:0 1px 1px rgba(0,0,0,.25);}
.cad-toggle input:checked + .cad-sw{background:var(--tc-color);}
.cad-toggle input:checked + .cad-sw::after{transform:translateX(14px);}
.cad-tlabel{font-size:11px;font-weight:800;color:#63728C;min-width:30px;}
.cad-toggle input:checked ~ .cad-tlabel{color:var(--tc-color);}
.cad-move{display:flex;gap:3px;}
.cad-move button,.cad-del{width:25px;height:25px;border:1px solid #CBD6E8;background:#fff;border-radius:4px;cursor:pointer;
  font-size:10px;color:#5A6B84;padding:0;line-height:1;}
.cad-move button:hover:not(:disabled){background:#EEF3FB;border-color:#B6C6E2;}
.cad-move button:disabled{opacity:.35;cursor:default;}
/* delete stays with the header cluster (tools touch); a small gap + red keeps it distinct */
.cad-del{margin-left:12px;color:#C0392B;border-color:#E7C6C1;}
.cad-del:hover{background:#F8E4E1;border-color:#D89A92;}
/* form — one tight row of content-sized fields */
.tc-field{display:flex;flex-direction:column;gap:3px;min-width:0;}
.tc-field>label{font-size:9.5px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;color:#41506A;white-space:nowrap;}
.tc-sublabel{font-weight:600;text-transform:none;letter-spacing:0;color:#8896AD;}
.tc-field .ta-in{padding:5px 8px;font-size:12.5px;font-weight:500;border:1px solid #AEBDD6;border-radius:4px;color:#141E33;background:#fff;}
.tc-field .ta-in:focus{border-color:var(--tc-color);box-shadow:0 0 0 2px color-mix(in srgb, var(--tc-color) 20%, transparent);}
/* Each field only as wide as its content, left-justified, no stretch. The selects are
   JS-sized to their WIDEST option (sizeCadenceSelects) — native selects size to the
   current value, not the widest — plus a trailing pad so nothing crowds the right edge. */
.cad-f-chan,.cad-f-who,.cad-f-purpose{flex:0 0 auto;}
.cad-phead select.ta-in{width:auto;}   /* JS sets the exact px width; never stretch to 100% */
/* The Activity dropdown is the touch's channel, so it wears the channel colour — the same
   --tc-color the badge uses — with square bottom corners, reading as a tab on the row. */
.cad-f-chan select.ta-in{background:var(--tc-color);color:#fff;font-weight:800;
  border-color:var(--tc-color);border-radius:5px 5px 0 0;}
.cad-f-chan select.ta-in option{background:#fff;color:#141E33;font-weight:500;}
.cad-f-topic{flex:0 1 210px;}
/* message — tight, sharp actionable block */
.cad-msgbtn{align-self:flex-end;flex:none;}
/* Compose row: a left-floated button with the message preview wrapping around it. */
.cad-scriptrow{padding:8px 12px 9px;border-top:1px solid #EEF1F6;width:0;min-width:100%;box-sizing:border-box;}
.cad-scriptrow::after{content:'';display:block;clear:both;}
.cad-csbtn{float:right;margin:1px 0 6px 12px;}
/* Button floats to the far right; subject + body are both left-justified at the same
   left margin. Subject flows to the left of the button; body clears below it. */
.cad-pv-subj{font-size:13px;font-weight:800;color:#16233b;line-height:1.5;padding-top:4px;}
.cad-pv-body{clear:both;font-size:12.5px;line-height:1.5;color:#54617A;margin-top:3px;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;}  /* teaser only — Compose to see/edit the full message */
.cad-pv-empty{font-size:12.5px;line-height:1.5;color:#8595AC;font-style:italic;padding-top:5px;}
.tc-msgbar{margin:0 10px;padding:8px 0 9px;border-top:1px solid #E9EFF7;}
/* Shaded like the card's header bar (light channel tint), not the fully-saturated
   colour of the left icon rail. Active (open/has content) inverts to a clean white. */
.tc-msgtoggle{display:inline-flex;align-items:center;gap:7px;font:inherit;font-size:12.5px;font-weight:800;
  color:color-mix(in srgb, var(--tc-color) 82%, #000000);
  background:color-mix(in srgb, var(--tc-color) 16%, #ffffff);
  border:1px solid color-mix(in srgb, var(--tc-color) 32%, #ffffff);border-radius:4px;padding:6px 13px;cursor:pointer;}
.tc-msgtoggle:hover{background:color-mix(in srgb, var(--tc-color) 24%, #ffffff);}
/* Selected (drawer open) → invert to the saturated channel fill. */
.tc-msgtoggle.open{color:#fff;background:var(--tc-color);border:1px solid var(--tc-color);}
.tc-msgtoggle.open:hover{background:var(--tc-color);filter:brightness(1.05);}
.tc-msgtoggle .tc-caret{transition:transform .15s;display:inline-block;font-size:10px;}
.tc-msgtoggle.open .tc-caret{transform:rotate(90deg);}
.tc-msgbody{margin:0 10px;padding:11px 0 12px;border-top:1px solid #E9EFF7;}
@media (max-width:640px){ .cad-f-purpose,.cad-f-topic{flex-basis:100%;} }
/* Touch table: same density + styling as the funnel results table. */
.ta-editor-inner{width:100%;}
.ta-tablewrap{overflow-x:hidden;overflow-y:auto;border:1px solid #E1E8F2;border-radius:12px;background:#fff;width:100%;box-sizing:border-box;max-height:calc(100vh - 250px);}
.ta-table{border-collapse:collapse;table-layout:fixed;width:100%;min-width:0;font-size:12.5px;}
.ta-table th{text-align:left;white-space:nowrap;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#1B2B41;padding:6px 8px;border-bottom:1px solid #A6BAD6;background:#CBD8EA;position:sticky;top:0;z-index:1;}
.ta-table td{padding:3px 8px;color:#3A4759;border-bottom:1px solid #EFF3F9;line-height:1.4;vertical-align:middle;}
.ta-table tbody tr:nth-child(even) td{background:#F8FAFD;}
.ta-table tbody tr:hover td{background:#EDF4FF;}
.ta-table tbody tr:last-child td{border-bottom:none;}
.ta-table tr.off td{opacity:.5;}
.ta-in{width:100%;font:inherit;font-size:12.5px;padding:3px 6px;border:1px solid #D5DEEC;border-radius:6px;background:#fff;color:#141E33;box-sizing:border-box;}
.ta-in:focus{border-color:#2E6BD6;outline:none;}
.ta-off{text-align:center;-moz-appearance:textfield;}
.ta-off::-webkit-outer-spin-button,.ta-off::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.ta-pos{font-weight:800;color:#2E6BD6;text-align:center;font-size:12px;font-variant-numeric:tabular-nums;}
.ta-on{text-align:center;}
.c-pos{width:28px;} .c-anchor{width:100px;} .c-off{width:56px;} .c-what{width:100px;} .c-who{width:64px;} .c-purpose{width:156px;} .c-on{width:40px;} .c-ctrl{width:120px;}
.ta-ctrls{white-space:nowrap;}
.ta-ctrls button{width:22px;height:22px;border:1px solid #D5DEEC;background:#fff;border-radius:5px;cursor:pointer;font-size:10px;color:#61708C;padding:0;margin-left:2px;vertical-align:middle;}
.ta-ctrls button:first-child{margin-left:0;}
.ta-ctrls button:disabled{opacity:.35;cursor:default;}
.ta-ctrls .ta-del{color:#C0392B;font-weight:800;}
/* Cadence name + Save, in the page body (not the top toolbar) */
.cad-namebar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;max-width:900px;margin-bottom:12px;}
.cad-namebar-lbl{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#5A6B84;}
.cad-nm{flex:0 1 340px;min-width:200px;font:inherit;font-size:15px;font-weight:700;padding:8px 12px;
  border:1.5px solid #C2D0E4;border-radius:7px;color:#16233b;background:#fff;}
.cad-nm:focus{border-color:#159C6E;outline:none;}
.ta-save-bar{display:flex;align-items:center;gap:8px;width:100%;box-sizing:border-box;padding:8px 0 0;}
.ta-addrow{margin-right:auto;font:inherit;font-size:13px;font-weight:700;padding:8px 14px;border:1px solid #D5DEEC;background:#fff;color:#2E6BD6;border-radius:8px;cursor:pointer;}
.ta-addrow:hover{border-color:#2E6BD6;background:#F4F8FF;}
.ta-save{flex:0 0 auto;font:inherit;font-size:13.5px;font-weight:800;padding:9px 18px;border:0;background:#159C6E;color:#fff;border-radius:9px;cursor:pointer;}
.ta-save:hover{background:#0F7E58;}
.ta-save:disabled{opacity:.6;cursor:default;}
.ta-msg{font-size:13px;font-weight:600;min-height:18px;padding:4px 0 16px;}
.ta-msg.err{color:#C0392B;} .ta-msg.ok{color:#0f7a56;}
/* Per-step message composer (✎ toggle → content sub-row) */
.ta-compose{color:#61708C;font-size:11px;}
.ta-compose.has{color:#159C6E;border-color:#9FD9C4;background:#EFFaf5;}
.ta-compose.on{color:#fff;background:#2E6BD6;border-color:#2E6BD6;}
.ta-crow>td{background:#F6F9FE;border-top:0;padding:0 10px 12px;}
.ta-crow.off{opacity:.55;}
.ta-content{padding:10px 2px 2px;}
.ta-content-none{color:#61708C;font-size:12.5px;font-style:italic;padding:12px 2px;}
.ta-clabel{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:11px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;color:#61708C;margin-bottom:4px;}
.ta-tok{display:inline-flex;gap:4px;flex-wrap:wrap;}
.ta-tokbtn{font:inherit;font-size:10.5px;font-weight:700;letter-spacing:0;text-transform:none;padding:2px 8px;border:1px solid #C7D6EA;border-radius:20px;background:#fff;color:#2E6BD6;cursor:pointer;}
.ta-tokbtn:hover{background:#2E6BD6;color:#fff;border-color:#2E6BD6;}
/* A just-clicked chip: force the default look until the pointer leaves, so Firefox's
   stuck :hover doesn't keep it lit alongside the chip you're actually hovering. */
.ta-tokbtn.tok-tapped,.ta-tokbtn.tok-tapped:hover{background:#fff;color:#2E6BD6;border-color:#C7D6EA;}
.ta-cin,.ta-carea{width:100%;font:inherit;font-size:13px;padding:7px 9px;border:1px solid #D5DEEC;border-radius:7px;background:#fff;color:#141E33;box-sizing:border-box;}
.ta-cin:focus,.ta-carea:focus{border-color:#2E6BD6;outline:none;}
.ta-carea{resize:vertical;line-height:1.45;}
/* Merge-token highlight: a mirror div behind a transparent field paints a channel-tinted
   background behind each {{token}}; the field's own text sits on top. See taHighlightInit. */
.ta-hlwrap{position:relative;}
.ta-hlwrap>.ta-cin,.ta-hlwrap>.ta-carea{position:relative;background:transparent;z-index:1;}
.ta-hlback{position:absolute;inset:0;z-index:0;margin:0;color:transparent;background:#fff;pointer-events:none;
  user-select:none;overflow:hidden;border-color:transparent!important;box-shadow:none;
  white-space:pre-wrap;overflow-wrap:break-word;}
.ta-hlback.ta-hlback-input{white-space:pre;}
.ta-hltok{border-radius:3px;color:transparent;background:color-mix(in srgb, var(--tc-color) 24%, #ffffff);}
/* Merge-token highlight in the card preview (visible text, channel-tinted). */
.cad-tok{border-radius:3px;padding:0 2px;background:color-mix(in srgb, var(--tc-color) 24%, #ffffff);}
.ta-chint{font-size:11.5px;color:#8595AC;padding:4px 2px 0;font-variant-numeric:tabular-nums;}
.ta-htmlsec{margin-top:12px;padding-top:11px;border-top:1px dashed #DCE4F0;}
.ta-htmlhd{margin-bottom:2px;}
.ta-htmlsub{font-size:11.5px;font-weight:600;color:#8896AD;margin:0 0 8px;}
/* Template/warehouse picker bar in the composers — tints to the touch's channel
   colour (amber call · teal email · green text) via the card's --tc-color. */
.ta-scriptbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px;padding:8px 10px;border-radius:8px;
  background:color-mix(in srgb, var(--tc-color) 9%, #ffffff);
  border:1px solid color-mix(in srgb, var(--tc-color) 28%, #ffffff);}
.ta-scriptlbl{font-size:11px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;color:color-mix(in srgb, var(--tc-color) 78%, #000000);}
.ta-scriptsel{font:inherit;font-size:12.5px;padding:5px 8px;border-radius:6px;background:#fff;color:#141E33;
  border:1px solid color-mix(in srgb, var(--tc-color) 42%, #ffffff);}
.ta-scriptsave{font:inherit;font-size:12px;font-weight:700;padding:6px 11px;border-radius:7px;background:#fff;cursor:pointer;
  border:1px solid color-mix(in srgb, var(--tc-color) 42%, #ffffff);color:color-mix(in srgb, var(--tc-color) 78%, #000000);}
.ta-scriptsave:hover{background:color-mix(in srgb, var(--tc-color) 13%, #ffffff);}
.ta-scriptmanage{margin-left:auto;font-size:12px;font-weight:700;text-decoration:none;color:color-mix(in srgb, var(--tc-color) 78%, #000000);}
.ta-scriptmanage:hover{text-decoration:underline;}
.ta-design{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.ta-designbtn{font:inherit;font-size:12.5px;font-weight:800;padding:7px 14px;border-radius:8px;border:1px solid #C7D6EA;background:#fff;color:#2E6BD6;cursor:pointer;}
.ta-designbtn:hover{background:#2E6BD6;color:#fff;border-color:#2E6BD6;}
.ta-designbtn.has{background:#EFFaf5;border-color:#9FD9C4;color:#159C6E;}
.ta-designbtn.has:hover{background:#159C6E;color:#fff;border-color:#159C6E;}
.ta-designst{font-size:12px;color:#61708C;}
/* Full-screen Unlayer designer overlay */
.unlay-modal{position:fixed;inset:0;z-index:4000;background:#EDF1F7;display:flex;flex-direction:column;}
.unlay-modal[hidden]{display:none;}   /* a class display: rule otherwise beats the [hidden] UA style */
.unlay-head{flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px;background:#16233B;color:#fff;}
.unlay-title{font-size:15px;font-weight:800;}
.unlay-step{font-weight:500;color:#9DB0CE;font-size:13px;margin-left:6px;}
.unlay-actions{display:flex;gap:10px;}
.unlay-cancel,.unlay-save{font:inherit;font-size:13.5px;font-weight:800;padding:8px 18px;border-radius:8px;border:0;cursor:pointer;}
.unlay-cancel{background:transparent;color:#C6D3E8;border:1px solid #3A4A67;}
.unlay-cancel:hover{background:#22314e;}
.unlay-save{background:#159C6E;color:#fff;} .unlay-save:hover{background:#0F7E58;}
.unlay-tpl{background:transparent;color:#C6D3E8;border:1px solid #3A4A67;}
.unlay-tpl:hover{background:#22314e;}
.unlay-editor{flex:1;min-height:0;}
.unlay-editor iframe{border:0;width:100%;height:100%;}
.unlay-picker{flex:1;min-height:0;overflow-y:auto;padding:26px 30px 40px;}
.unlay-pk-head{font-size:16px;font-weight:800;color:#16233b;margin-bottom:16px;}
.unlay-pk-head span{font-weight:500;color:#8595AC;font-size:13.5px;}
.unlay-pk-grid{max-width:920px;}
.unlay-pk-loading{padding:20px 2px;color:#61708C;font-weight:600;}
.unlay-pk-sec{font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#8595AC;margin:22px 0 10px;}
.unlay-pk-sec:first-child{margin-top:0;}
.unlay-pk-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px;}
.unlay-pk-card{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left;position:relative;
  background:#fff;border:1px solid #DCE4EF;border-radius:12px;padding:18px 18px 16px;cursor:pointer;font:inherit;
  transition:border-color .12s,box-shadow .12s,transform .05s;}
.unlay-pk-card:hover{border-color:#2E6BD6;box-shadow:0 4px 16px rgba(46,107,214,.14);transform:translateY(-1px);}
.unlay-pk-card.blank{background:#F6F9FE;border-style:dashed;}
.unlay-pk-card.saved{padding:0;}
.unlay-pk-open{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left;
  background:none;border:0;cursor:pointer;font:inherit;padding:18px 18px 16px;width:100%;}
.unlay-pk-del{position:absolute;top:8px;right:8px;width:24px;height:24px;border-radius:6px;border:1px solid #E7C6C1;
  background:#fff;color:#C0392B;font-size:11px;font-weight:800;cursor:pointer;line-height:1;opacity:0;transition:opacity .12s;}
.unlay-pk-card.saved:hover .unlay-pk-del{opacity:1;}
.unlay-pk-del:hover{background:#F8E4E1;}
.unlay-pk-em{font-size:26px;line-height:1;margin-bottom:4px;}
.unlay-pk-nm{font-size:14.5px;font-weight:800;color:#16233b;}
.unlay-pk-ds{font-size:12.5px;color:#61708C;line-height:1.35;}
.unlay-loading{padding:40px;text-align:center;color:#61708C;font-size:14px;font-weight:600;}
.unlay-err{color:#C0392B;}
/* Guide — rendered LO training doc */
.gd-sub{color:#61708C;font-size:13px;font-weight:600;margin-left:10px;}
.gd-wrap{padding:22px 26px 60px;overflow-y:auto;}
.gd-body{max-width:780px;margin:0 auto;color:#25324A;font-size:15px;line-height:1.6;}
.gd-loading{padding:40px;text-align:center;color:#61708C;font-weight:600;}
/* About poster. Capped at the page's natural width so it never blows up past legibility on a
   wide monitor, and centred with room to breathe — it reads as a printed sheet, not a banner. */
.ab-wrap{padding:22px 26px 60px;overflow:auto;display:flex;justify-content:center;}
.ab-poster{width:100%;max-width:1600px;height:auto;display:block;
  border:1px solid #DCE6F4;border-radius:12px;box-shadow:0 2px 14px rgba(11,27,43,.09);background:#EEF3FA;}
/* The section has no header bar, so the link floats over the top-right of the poster area. */
.ab-wrap{position:relative;}
.ab-open{position:absolute;top:8px;right:26px;font-size:13px;font-weight:700;color:#2E6BD6;
  text-decoration:none;white-space:nowrap;background:#EDF1F7;padding:4px 8px;border-radius:7px;}
.ab-open:hover{text-decoration:underline;}
.gd-err{color:#C0392B;}
.gd-body h1{font-size:26px;font-weight:800;color:#12203A;margin:6px 0 14px;line-height:1.2;}
.gd-body h2{font-size:20px;font-weight:800;color:#1B4F9A;margin:32px 0 10px;padding-bottom:6px;border-bottom:2px solid #E7EDF6;}
.gd-body h3{font-size:16.5px;font-weight:800;color:#16233B;margin:22px 0 8px;}
.gd-body h4{font-size:14.5px;font-weight:800;color:#2E3D57;margin:18px 0 6px;}
.gd-body p{margin:10px 0;}
.gd-body ul,.gd-body ol{margin:10px 0;padding-left:24px;}
.gd-body li{margin:5px 0;}
.gd-body a{color:#2E6BD6;text-decoration:none;} .gd-body a:hover{text-decoration:underline;}
.gd-body strong{color:#12203A;font-weight:800;}
.gd-body code{background:#EEF2F8;border:1px solid #E0E7F1;border-radius:5px;padding:1px 5px;font-size:.9em;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#1B4F9A;}
.gd-body hr{border:0;border-top:1px solid #E7EDF6;margin:26px 0;}
.gd-body blockquote{margin:16px 0;padding:12px 18px;background:#F4F8FF;border-left:4px solid #2E6BD6;border-radius:0 8px 8px 0;color:#40506B;}
.gd-body blockquote p{margin:6px 0;}
.gd-pre{background:#16233B;color:#DCE6F5;border-radius:10px;padding:14px 16px;overflow-x:auto;margin:14px 0;font-size:13px;line-height:1.5;}
.gd-pre code{background:none;border:0;color:inherit;padding:0;font-size:13px;}
.gd-tablewrap{overflow-x:auto;margin:14px 0;}
.gd-table{border-collapse:collapse;width:100%;font-size:14px;}
.gd-table th{background:#F0F4FA;text-align:left;font-weight:800;color:#16233B;padding:8px 12px;border:1px solid #E0E7F1;}
.gd-table td{padding:8px 12px;border:1px solid #E7EDF6;vertical-align:top;}
.gd-table tr:nth-child(even) td{background:#FAFCFF;}
.gd-body a.gd-dl{display:inline-block;margin:6px 0 2px;padding:9px 16px;background:#2E6BD6;color:#fff;
  font-weight:800;font-size:14px;border-radius:8px;text-decoration:none;}
.gd-body a.gd-dl:hover{background:#255ab4;text-decoration:none;}
/* ── DCRM app shell (desktop-first: left sidebar + main content) ──────────── */
.dcrm-shell{display:flex;min-height:100vh;align-items:stretch;}
/* height:100vh with the default overflow:visible meant any item past the fold was simply cut
   off — not scrolled, unreachable. On a 950px-tall window that was About, Guide and Settings;
   at 800px it took Agents and Dashboard too. The menu has to be able to reach its own bottom. */
.dcrm-side{width:176px;flex-shrink:0;background:#153F7C;color:#fff;display:flex;flex-direction:column;gap:1px;padding:8px 9px;position:sticky;top:0;height:100vh;align-self:flex-start;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.28) transparent;}
.side-top{display:flex;align-items:center;gap:8px;padding:2px 4px 8px;}
.side-brand{flex:1;font-size:19px;font-weight:800;letter-spacing:.04em;padding:0 6px;white-space:nowrap;overflow:hidden;line-height:1.1;}
.side-brand small{display:block;font-size:8.5px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;opacity:.7;margin-top:2px;}
.side-toggle{width:30px;height:30px;flex-shrink:0;border:0;border-radius:8px;background:rgba(255,255,255,.14);color:#fff;font-size:15px;line-height:1;cursor:pointer;}
.side-toggle:hover{background:rgba(255,255,255,.26);}
.side-nav{display:flex;align-items:center;gap:9px;width:100%;text-align:left;background:transparent;border:0;color:rgba(255,255,255,.82);font:inherit;font-size:14px;font-weight:600;padding:4px 12px;border-radius:8px;cursor:pointer;text-decoration:none;}
.side-nav:hover{background:rgba(255,255,255,.1);color:#fff;}
/* The leading emoji is a bare text node — no element to select — so the icon is sized by
   scaling the BUTTON's font and scaling the label span back down. 1.5x icon (14->21px),
   label stays at 14px. line-height is pinned so the taller glyph doesn't stretch rows. */
.side-nav{font-size:18px;line-height:1.15;}
.side-nav span{font-size:13px;line-height:1.2;}
.side-nav.active{background:#2E6BD6;color:#fff;}
/* Sub-menu items (Call Scripts / Templates / Text Templates) slide out under their
   channel when that channel — or the sub-item itself — is the active section. */
.side-sub{max-height:0;padding-top:0;padding-bottom:0;margin:0;opacity:0;overflow:hidden;pointer-events:none;
  font-size:13px;font-weight:600;color:rgba(255,255,255,.72);
  transition:max-height .18s ease,opacity .14s ease,padding .18s ease;}
.side-sub.show{max-height:34px;padding:4px 12px 4px 30px;opacity:1;pointer-events:auto;}
.side-sub.show::before{content:'';position:absolute;left:20px;width:6px;height:1px;background:rgba(255,255,255,.35);}
.side-sub{position:relative;}
/* Data ingestion page */
.ing-wrap{padding:18px;max-width:600px;display:flex;flex-direction:column;gap:14px;}
.ing-card{background:#fff;border:1px solid #E4EAF2;border-radius:12px;padding:16px 18px;}
.ing-card h3{font-size:14px;font-weight:800;color:#141E33;margin:0 0 5px;}
.ing-note{font-size:13px;color:#61708C;line-height:1.45;margin-bottom:8px;}
.ing-in{width:100%;font:inherit;font-size:14px;padding:10px 12px;border:1px solid #D5DEEC;border-radius:9px;margin-bottom:9px;box-sizing:border-box;}
/* Contact-list upload tool */
.up-card{grid-column:1/-1;}
.up-drop{display:flex;flex-direction:column;align-items:center;gap:7px;justify-content:center;border:2px dashed #C3D2E8;border-radius:12px;padding:32px 18px;cursor:pointer;color:#61708C;background:#F7FAFF;text-align:center;transition:border-color .12s,background .12s;}
.up-drop:hover,.up-drop.dragging{border-color:#2E6BD6;background:#EEF5FF;}
.up-drop.dragging{border-style:solid;}
.up-drop-ico{font-size:30px;line-height:1;}
.up-drop-main{font-size:15px;font-weight:700;color:#33415A;}
.up-drop-sub{font-size:12.5px;color:#8894a8;}
.up-browse{margin-top:6px;border:1px solid #2E6BD6;background:#2E6BD6;color:#fff;font:inherit;font-weight:700;font-size:13px;border-radius:8px;padding:8px 18px;cursor:pointer;}
.up-browse:hover{background:#255cbf;}
.up-drop input{display:none;}
.up-map{margin-top:14px;display:flex;flex-wrap:wrap;gap:10px;}
.up-map .up-mapf{flex:0 0 190px;}   /* size to content, per the fit-content table rule */
.up-mapf{display:flex;flex-direction:column;gap:3px;}
.up-mapf label{font-size:10.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#8894a8;}
.up-mapf.req label{color:#2E6BD6;}
.up-mapf select{font:inherit;font-size:13px;padding:7px 9px;border:1px solid #D5DEEC;border-radius:8px;background:#fff;}
.up-mapf select.unset{border-color:#E0A93F;background:#FFFBF2;}
.up-prevwrap{margin-top:14px;}
/* THE BOX. The table is width:100% + table-layout:fixed, so nothing inside can push it past
   the page edge; #up-body is sized to the remaining window height by upSizeBody() and is the
   one scroll container, both axes. */
#up-uptable{width:auto;}   /* content width until a file is staged */
#ing-uphome.up-wide #up-uptable{table-layout:fixed;width:100%;}
#up-uptable td.up-cell{padding:0;background:#fff;white-space:normal;}
#up-uptable tbody tr:hover td.up-cell{background:#fff;}   /* no hover tint on the shell cell */
#up-body{overflow:auto;padding:12px 14px;}
#up-lists{margin-top:16px;}
.up-pager{display:inline-flex;align-items:center;gap:8px;margin:0;}
/* Staged: the drop zone has done its job — shrink it to a single control so the sample is
   the page, not a giant empty dashed box above one. */
#ing-uphome.up-wide .up-drop{padding:6px 10px;min-height:0;border-style:solid;background:transparent;
  display:flex;align-items:center;gap:10px;}
#ing-uphome.up-wide .up-drop-ico,#ing-uphome.up-wide .up-drop-main{display:none;}
#ing-uphome.up-wide .up-drop-sub{font-size:11.5px;margin:0;}
#ing-uphome.up-wide .up-browse{margin:0;padding:5px 12px;font-size:12px;}
.up-prev thead th{position:sticky;top:0;z-index:1;}   /* header stays while the sample scrolls */
.up-prev{border-collapse:collapse;font-size:11.5px;white-space:nowrap;}
.up-prev th{background:#EEF3FA;color:#16202E;font-weight:800;text-transform:uppercase;font-size:9.5px;letter-spacing:.04em;padding:5px 9px;text-align:left;border-bottom:1px solid #D5DFEC;}
.up-prev td{padding:4px 9px;color:#3A4759;border-bottom:1px solid #EFF3F9;}
.up-actions{display:flex;align-items:center;gap:12px;margin-top:13px;}
.up-import{padding:9px 18px;border:0;border-radius:9px;background:#1F9E56;color:#fff;font:inherit;font-weight:800;font-size:13.5px;cursor:pointer;}
.up-import:disabled{opacity:.45;cursor:not-allowed;}
.up-prov{font-size:11.5px;color:#8894a8;}
#up-uptable .ing-note{margin:0;font-weight:700;}
/* Header bands match the results/Target tables beside it (.fnl-table thead) */
#up-uptable thead th,#up-liststable thead th{font-size:10px;letter-spacing:.04em;text-transform:uppercase;padding:6px 8px;}
.up-listrow{display:flex;align-items:center;gap:12px;border:1px solid #E4EAF2;border-radius:9px;padding:9px 13px;background:#fff;}
.up-listrow b{color:#141E33;} .up-listrow .up-lct{color:#2E6BD6;font-weight:800;} .up-listrow .up-lmeta{color:#8894a8;font-size:12px;flex:1;}
.up-del{border:0;background:transparent;color:#B5322F;font:inherit;font-weight:700;font-size:12px;cursor:pointer;}
.ing-in:focus{border-color:#2E6BD6;outline:none;}
/* Same button the Visit Log uses for "Add to Target" (.rs-oh-addbtn) — one flat blue primary at
   13px/800, radius 9. It used to be kelly green at 14px, sitting next to a primary-blue Test and
   a purple Explore: three saturated hues shouting at each other in one row, which is what made
   the panel look like cut paper. One accent, and the secondary action steps back. */
.ing-run{font:inherit;font-size:13px;font-weight:800;padding:8px 16px;border:0;
  background:#2E6BD6;color:#fff;border-radius:9px;cursor:pointer;}
.ing-run:hover:not(:disabled){background:#255cbf;}
.ing-run:disabled{opacity:.4;cursor:not-allowed;}
.scrape-row{display:flex;align-items:center;gap:12px;padding:8px 0;border-top:1px solid #eef1f6;}
.scrape-row:first-of-type{border-top:0;padding-top:4px;}
.scrape-info{flex:1;min-width:0;}
.scrape-info b{display:block;font-size:14px;color:#153F7C;}
.scrape-info span{display:block;font-size:12px;color:#61708C;}
/* Test is a read-only dry run — it should not compete with the action that actually imports. */
.scrape-test{background:#fff;color:#2E6BD6;border:1px solid #C3D3EA;font-weight:700;}
.scrape-test:hover:not(:disabled){background:#EEF4FE;border-color:#2E6BD6;}
.scrape-sel{font:inherit;font-size:13px;padding:8px 10px;border:1px solid #cfd8e6;border-radius:8px;background:#fff;color:#233;max-width:190px;}
/* Explore writes nothing either, but it is the only control in its row, so it stays primary. */
.scrape-result{font-size:12px;color:#3a4a63;margin-top:8px;}
.scrape-result pre{background:#f4f7fb;border:1px solid #e4eaf2;border-radius:8px;padding:8px;overflow:auto;max-height:160px;font-size:11px;margin:6px 0 0;}
.ing-msg{font-size:13px;font-weight:600;min-height:18px;margin-top:10px;}
.ing-msg.err{color:#C0392B;} .ing-msg.ok{color:#0f7a56;}
.ing-step{display:flex;justify-content:space-between;align-items:center;font-size:12.5px;color:#3a4761;padding:5px 0;border-bottom:1px solid #F0F3F8;}
.ing-badge{display:inline-block;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;padding:2px 9px;border-radius:999px;}
.ing-badge.ok{background:#E4F7EF;color:#0f7a56;} .ing-badge.running{background:#E7EFFC;color:#2357b8;}
.ing-badge.failed,.ing-badge.skipped{background:#FDE4E1;color:#C0392B;} .ing-badge.unknown{background:#EEF2F8;color:#61708C;}
.side-botstart{margin-top:auto;}   /* first item of the bottom group — pushes it + the rest down */
.side-div{height:1px;background:rgba(255,255,255,.32);margin:5px 12px;flex:none;}
.side-lo{background:rgba(255,255,255,.1);border:0;color:#fff;font:inherit;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:6px 12px;border-radius:8px;cursor:pointer;text-align:left;}
.side-lo small{display:block;font-size:13px;font-weight:700;text-transform:none;letter-spacing:0;margin-top:3px;}
/* Data-freshness stamp posted up from the Tours iframe. */
.side-updated{font-size:10.5px;color:rgba(255,255,255,.5);padding:4px 12px 2px;line-height:1.3;}
.side-updated.stale{color:#ffcc00;font-weight:700;}
.side-updated:empty{display:none;}
.dcrm-main{flex:1;min-width:0;background:#EDF1F7;}
/* Standalone deep-link (/roster, /campaigns, …): hide the menu, main takes over. */
.dcrm-shell.app-standalone .dcrm-side{display:none!important;}
.dcrm-shell.app-standalone .dcrm-main{margin-left:0!important;}
/* Embedded profile mode (?embed=1) — the roster page rendered inside the Funnel's
   agent drawer. Drop the roster search toolbar/stats: the drawer isn't a place to
   search the roster, it's one agent's profile. Just the detail pane remains. */
.dcrm-shell.app-embed .dsec-hd{display:none!important;}
.dcrm-shell.app-embed #sec-roster .ta-body{padding:16px 0 0;}
/* `hidden` is absolute: a hidden section must never show, even when a section has
   its own id-level display rule (e.g. #sec-roster{display:flex}) that would other-
   wise out-specify this. Without !important the roster toolbar leaked across tabs. */
.dsec[hidden]{display:none !important;}
.dsec-hd{position:sticky;top:0;z-index:2;background:#EDF1F7;padding:16px 18px 12px;border-bottom:1px solid #E4EAF2;}
.dsec-hd h2{font-size:18px;font-weight:800;color:#141E33;margin:0;}
/* ── Dashboard ── one gap value (14px) drives all spacing between blocks. */
.dash-body{padding:16px 18px 40px;}
.dash-intro{font-size:12px;font-weight:800;letter-spacing:.06em;color:#8A97A8;margin-bottom:10px;}
/* Headline role-count strip above the tiles. */
.dash-headline{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid #DCE4EF;}
.dh-stat{font-size:15px;color:#5B6B82;white-space:nowrap;position:relative;padding-right:16px;}
.dh-stat:not(:last-child)::after{content:'–';position:absolute;right:2px;color:#C2CCDA;}
.dh-stat b{font-size:19px;font-weight:800;color:#16202E;letter-spacing:-.01em;}
/* Top row: 4 KPI tiles (grid, always one row) + a compact state card on the
   right — deterministic columns so nothing wraps oddly. */
.dash-top{display:grid;grid-template-columns:minmax(0,1fr) 210px;gap:14px;margin-bottom:14px;align-items:stretch;}
.dash-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;}
.dwh-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:16px;max-width:720px;}
.dwh-col{display:flex;flex-direction:column;align-items:flex-start;margin-bottom:24px;}
.dwh-col>.dwh-sec{margin-top:0;flex:0 0 auto;}   /* never squeezed below its declared columns */
.dwh-col>.dwh-sec+.dwh-sec{margin-top:14px;}   /* each card keeps all four rounded corners */
.dwh-col>.dwh-sec+.dwh-sec.dwh-flush{margin-top:0;}   /* the terminal trio butts together, corners intact */
.dwh-sec{padding:0;overflow:hidden;}                              /* the table is the card */
.dwh-sec .rs-tablewrap{max-height:none;border:none;border-radius:0;}
/* Agents runs to 100+ rows once the bands are open — bound it to 25 and let it scroll in
   place, the way the office roster does. 31px header + 25 x 26px rows. */
.dwh-sec.dwh-agents .rs-tablewrap{max-height:681px;overflow-y:auto;}                          /* the whole inventory, not a screenful */
.dwh-tbl{width:auto;}                                   /* fit content — as narrow as possible */
.dwh-tbl th,.dwh-tbl td{white-space:nowrap;}            /* never wrap */
.dwh-tbl td{border-bottom:none;}                        /* the shade bands do the separating */
.dwh-tbl thead th,.dwh-tbl tr.dwh-rehead th{font-size:13px;color:#1B2B41;padding:7px 6px;}
.dwh-tbl tr.dwh-rehead th{background:#CBD8EA;text-align:left;font-weight:800;letter-spacing:.04em;
  text-transform:uppercase;border-top:1px solid #A6BAD6;border-bottom:1px solid #A6BAD6;white-space:nowrap;}
.dwh-tbl td{padding:4px 4px;}
/* Column gutters are the only slack in a 10-column numeric table, and they were carrying ~85px
   of pure air — enough to force a horizontal scrollbar on any window under ~1080px. Tabular
   figures are already visually separated by their alignment; they don't need 16px as well. */
.dwh-tbl .dwh-r{text-align:right;font-variant-numeric:tabular-nums;padding-left:9px;}
.dwh-tbl .dwh-lbl{color:#41506A;font-weight:600;padding-right:6px;}
/* The notice table wears the warehouse look without joining its shared colgroup —
   its columns are its own, so dwhSyncCols must not size them. */
.dwh-notice{width:auto;}
.dwh-notice th,.dwh-notice td{white-space:nowrap;}
.dwh-notice td{border-bottom:none;padding:4px 4px;}
.dwh-notice thead th{font-size:13px;color:#1B2B41;padding:7px 6px;}
.dwh-notice .dwh-r{text-align:right;font-variant-numeric:tabular-nums;padding-left:14px;}
.dwh-notice .dwh-lbl{color:#41506A;font-weight:600;padding-right:6px;}
.dwh-tbl .dwh-n{color:#141E33;font-weight:800;font-variant-numeric:tabular-nums;padding-right:6px;text-align:right;}
.dwh-tbl .dwh-tot{font-weight:800;color:#141E33;padding-left:10px;padding-right:10px;border-left:1px solid #C7D2E2;}  /* the roll-up, fenced off from the states */
.dwh-tbl thead th.dwh-flr,.dwh-tbl tr.dwh-rehead th.dwh-flr{color:#1B2B41;font-size:13px;font-weight:800;}   /* column rule must not restyle the heading */
.dwh-tbl .dwh-flr{text-align:center;font-variant-numeric:tabular-nums;color:#5B6B85;font-weight:600;font-size:11px;padding-right:8px;border-right:1px solid #E4EAF2;}  /* oldest record held — depth, not volume */
/* A table is already as wide as its contents need. The scrollbars came from the wrapper clamping
   it to the pane and scrolling the overflow — so for these cards, don't clamp. The CARD has to be
   unclamped too, not just the wrapper: leave .rs-section's max-width:100% in place and the card
   stays pane-width while the table runs past it. With both free, overflow:hidden costs nothing
   and goes back to doing its real job — clipping the table's square corners to the card radius. */
.dwh-sec{max-width:none;overflow:hidden;}
.dwh-sec .rs-tablewrap{max-width:none;overflow:visible;}
.dwh-tbl tr.dwh-oh td{background:#E5F0FC;}   /* open house — an event, dated, act today */
.dwh-tbl tr.dwh-ok td{background:#E3F5E8;}   /* coming soon — not on the market yet */
.dwh-tbl tr.dwh-sub td{background:#FCF5C8;}  /* for sale, seeking a buyer */
.dwh-tbl tr.dwh-eq2 td{background:#FBE7CB;}  /* under contract, backups still accepted */
.dwh-tbl tr.dwh-eq td{background:#F7DAD2;}   /* under agreement — buyer locked in */
.dwh-tbl .dwh-exp{width:15px;height:15px;margin-right:6px;padding:0;border:1px solid rgba(20,30,51,.22);border-radius:3px;background:rgba(255,255,255,.7);color:#41506A;font:700 11px/1 ui-monospace,monospace;cursor:pointer;vertical-align:middle;}
.dwh-tbl .dwh-exp:hover{background:#fff;border-color:rgba(20,30,51,.42);}
.dwh-tbl .dwh-expall{border-color:rgba(46,107,214,.45);background:#fff;color:#2E6BD6;}
.dwh-tbl tr.dwh-kid .dwh-lbl{padding-left:27px;font-weight:500;color:#5B6B85;}   /* indented under its parent */
.dwh-tbl tr.dwh-kid td{filter:brightness(1.03);}                                 /* same family, one step back */
.dwh-tbl tr.dwh-kid .dwh-tot{font-weight:600;color:#41506A;}
.dwh-tbl tr.dwh-srcbreak td{border-top:1px solid #C7D2E2;}   /* NH | MA | pooled */
.dwh-tbl thead .dwh-pct{font-weight:400;}   /* share of the terminal pool, stated plainly */
/* Zebra by data-row number: nth-child counted the section headings and sub-total rows too,
   so the alternation slipped and a colour repeated after every heading. */
.dwh-tbl tbody tr.dwh-zebra td{background:#F8FAFD;}
/* When a parent is open its children run on beneath it, so the next numbered line needs a
   rule to show where one band ends and the next begins. Only when it actually follows a
   child — a collapsed list is already legible without it. */
.dwh-tbl tr.dwh-kid:not([hidden]) + tr.dwh-par td{border-top:1px solid #C7D2E2;}
.dwh-tbl tr.dwh-sum td{background:#fff;font-weight:800;color:#141E33;border-top:1px solid #C7D2E2;padding:5px 5px 9px;}
.dwh-tbl tr.dwh-sum .dwh-lbl{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:#5B6B85;}
.dwh-tbl tr.dwh-sum .dwh-tot{color:#2E6BD6;}
/* Sum/grand rows set their own td padding (5px), pushing their totals 13px right of the body
   totals — every number in the column shares one right margin. */
.dwh-tbl tr.dwh-sum td.dwh-tot{padding-right:18px;}   /* every roll-up figure reads blue */
.dwh-tbl tr.dwh-grand td{border-top:1px solid #C7D2E2;border-bottom:2px solid #C7D2E2;color:#141E33;font-size:13px;padding-top:9px;padding-bottom:9px;}
/* A real empty row, so the blank line belongs to neither neighbour — padding the sub-total
   just made that row look fat, and padding the grand total put the rule above the gap. */
.dwh-tbl tr.dwh-spacer td{padding:9px 0;line-height:0;font-size:0;border:0 !important;background:transparent;}   /* state columns black; label + TOTAL stay blue below */   /* its own section heading already sets it apart */
.dwh-tbl tr.dwh-grand .dwh-lbl,.dwh-tbl tr.dwh-grand .dwh-tot{color:#2E6BD6;}
.dwh-tbl tr.dwh-grand .dwh-lbl{font-size:11px;}
.dwh-tbl tr.dwh-grand .dwh-tot{font-size:15px;}
.dwh-tbl tr.dwh-solo .dwh-tot{color:#2E6BD6;}   /* a card whose only total IS its grand total */
.dwh-tbl .dwh-z{color:#CBD3DF;}                          /* muted dot for zero */
.dwh-tbl .dwh-grp td{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:#2E6BD6;padding:12px 5px 3px;border-bottom:none;}
@media (max-width:820px){ .dwh-tiles{grid-template-columns:1fr;} }
.dash-tile{background:linear-gradient(135deg,#213E6B,#2E6BD6);color:#fff;border-radius:12px;padding:15px 16px;box-shadow:0 2px 8px rgba(22,40,80,.18);}
.dash-v{font-size:26px;font-weight:800;letter-spacing:-.01em;line-height:1;}
.dash-l{font-size:12px;font-weight:700;margin-top:6px;color:#EAF1FB;}
.dash-s{font-size:10.5px;color:#B9CDE9;margin-top:4px;}
.dash-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
/* All three white boxes share one card style. */
.dash-card,.dash-statebox{background:#fff;border:1px solid #E1E8F2;border-radius:12px;box-shadow:0 1px 3px rgba(22,32,46,.06);padding:12px 16px;}
.dash-card .rs-card-h,.dash-statebox .rs-card-h{margin:0 0 8px;display:flex;align-items:center;justify-content:space-between;}
.dash-hc{font-size:9.5px;font-weight:700;color:#9AA7B8;letter-spacing:.03em;}
/* Scroll region inside a leader card — shows ~12 rows, scrolls to the full 100. */
.dash-scroll{max-height:520px;overflow-y:auto;margin:0 -6px;padding:0 6px;}
.dash-tbl{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;}
.dash-tbl td{padding:5px 4px;font-size:12.5px;color:#26303f;border-bottom:1px solid #F3F6FB;vertical-align:middle;}
.dash-tbl tr:last-child td{border-bottom:none;}
.dash-rank{width:18px;color:#9AA7B8;font-weight:800;font-size:11px;text-align:right;padding-right:8px;}
.dash-nm{font-weight:700;color:#16202E;cursor:pointer;line-height:1.25;padding-right:10px;}
.dash-nm:hover{color:#2E6BD6;}
.dash-sub{display:block;font-size:10.5px;font-weight:500;color:#8A97A8;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:260px;}
.dash-num{text-align:right;font-weight:700;color:#16202E;white-space:nowrap;padding-left:8px;}
.dash-num.dash-u{font-weight:500;color:#8A97A8;width:46px;}
.dash-st{font-weight:800;color:#26303f;width:30px;font-size:12px;}
.dash-bar{width:100%;padding:0 8px;}
.dash-bar>span{display:block;height:10px;border-radius:3px;background:linear-gradient(90deg,#2E6BD6,#6AA0EC);}
/* Market-by-year chart + momentum + tour (dashboard additions) */
.dash-chartcard{margin-bottom:14px;}
.dash-chart{width:100%;height:auto;display:block;}
.dash-motbl .dash-mo{width:44%;padding:0 8px;}
.dash-mobar{display:block;height:9px;border-radius:3px;}
.dash-mobar.up{background:linear-gradient(90deg,#0F9E6E,#3FC79A);}
.dash-mobar.down{background:linear-gradient(90deg,#D98A6A,#C0453B);}
.dash-num.mo-up{color:#0F7A56;} .dash-num.mo-down{color:#B23B2F;}
.dash-stops{display:inline-block;background:#E7F3ED;color:#0F7A56;font-weight:700;border-radius:20px;padding:1px 8px;font-size:11.5px;}
@media (max-width:820px){ .dash-grid{grid-template-columns:1fr;} .dash-statebox{flex:1 1 100%;} }
.dsec-stub{padding:70px 24px;text-align:center;color:#8894a8;}
/* Biz Cards — the card sits in a bordered display frame; the card itself keeps the
   standard 3.5×2 business-card proportion. */
.bc-frame{width:max-content;margin:22px;padding:18px;background:#fff;border:1px solid #D5DEEC;border-radius:14px;box-shadow:0 2px 10px rgba(20,40,80,.08);}
.bc-img{display:block;width:600px;max-width:100%;border:1px solid #E4EAF2;border-radius:6px;}
.dsec-stub .big{font-size:44px;margin-bottom:14px;opacity:.5;}
.dsec-stub h3{font-size:17px;font-weight:800;color:#141E33;margin-bottom:8px;}
.dsec-stub p{font-size:14px;line-height:1.55;max-width:46ch;margin:0 auto;}
/* Settings uses the SAME card the Visit Log and roster panels use — .rs-section with an
   .rs-sec-h header bar — instead of its own airy style. It was the one page in the app with big
   rounded cards, floating labels and three different column widths (520 / 700 / 900), so it read
   as a different product. One width, one card, one header. */

/* ── Settings / Users forms: a table. Label cells are width="1%" so they shrink to the label;
      the field cell takes what is left. Input widths are size="" attributes. ── */
.set-tbl{border-collapse:collapse;}
.set-tbl td{padding:3px 8px 3px 0;vertical-align:middle;white-space:nowrap;}
.set-tbl td:first-child,.set-tbl td.set-gap2{text-align:right;font-size:11px;font-weight:800;
  letter-spacing:.04em;text-transform:uppercase;color:#8CA0BE;}
.set-tbl td.set-gap2{padding-left:26px;border-left:1px solid #DCE6F4;}
.set-tbl tr.set-sep td{padding-top:14px;}
.set-tbl .ing-in{width:auto;}
.set-page{padding:10px 16px 26px;display:flex;flex-direction:column;max-width:900px;}
.set-page .rs-section{margin-top:10px;width:100%;box-sizing:border-box;overflow:hidden;padding:10px 14px;}
.set-page .rs-section:first-child{margin-top:0;}
.set-body{padding:2px 0 4px;display:flex;flex-direction:column;gap:5px;}
/* A label/value/action line — the dense equivalent of the old .set-row card. */
.set-line{display:flex;align-items:center;gap:12px;padding:5px 0;border-bottom:1px solid #EFF3F9;}
.set-line:last-child{border-bottom:none;}
.set-line>div{flex:1;min-width:0;}
.set-line b{font-size:13px;color:#16202E;}
.set-line .set-v{font-size:12.5px;color:#61708C;margin-top:2px;}
.set-lbl{font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#8894a8;margin:2px 0 -2px;}
/* Fields size to their content rather than stretching the card. */
.set-body .ing-in{width:auto;min-width:210px;max-width:100%;margin-bottom:0;font-size:12.5px;padding:5px 9px;}
/* A select is measured to its widest option (sizeSelectToWidest), so the shared
   minimum above must not hold it open past its content. */
.set-body select.ing-in{min-width:0;}
.set-form{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;}
/* Explicit rows, in the order the fields were asked for: name, contact, address, links, and
   the login pair last. flex-wrap alone put whatever happened to fit on each line. */
.set-rows{flex-direction:column;align-items:stretch;gap:10px;}
.set-row2,.set-row1{display:flex;gap:10px;align-items:flex-end;}
.set-row2>.set-f{flex:1 1 200px;}
.set-row1>.set-f{flex:1 1 100%;}
.set-gap{height:8px;}
.mb-2col td>.set-row1{margin-bottom:10px;}
.mb-2col td>.set-row1:last-child{margin-bottom:0;}
.mb-2col td>.set-row1>.set-f>label{flex-basis:118px;}
/* Two stacked columns side by side: identity on the left, the two naming fields to its right. */
/* One header, not two. The card's title bar and the table's column row were two separate
   grey bands stacked on each other; same colour, no rule between, so they read as a single
   header block with the column labels as its second line. */
#usr-wrap .rs-sec-h{margin-bottom:0;border-bottom:none;padding-bottom:8px;}
#usr-wrap .rs-dtable thead th{background:#DCE7F5;border-bottom:1px solid #BFD1E7;
  padding-top:4px;padding-bottom:7px;}
/* The table has to span the card or the merged header band stops short of the right edge
   and leaves a notch where the title bar continues past it. */
#usr-tbl{width:100%;}
#usr-tbl th:last-child,#usr-tbl td:last-child{text-align:right;}
.set-rows .ing-in{box-sizing:border-box;min-width:0;}
/* A field is a label AND a box. Placeholders vanish the moment the field is filled, which left
   a row of identical boxes reading "Dave  Costa  BigDave  Owner" with nothing saying which was
   which — fine on an empty form, useless on a populated one. */
/* Label left, box right, on one baseline — a fixed label column so every field starts at the
   same x and the form reads as a record rather than a stack of captions. */
.set-f{display:flex;flex-direction:row;align-items:center;gap:12px;}
.set-f>label{flex:0 0 168px;text-align:right;font-size:11px;font-weight:800;letter-spacing:.04em;
  text-transform:uppercase;color:#8CA0BE;line-height:1.25;}
/* Boxes size to what they hold. A first-name box the width of a URL box is the tell that
   nobody chose either of them. */
.set-f>.ing-in,.set-f>select{flex:0 0 auto;min-width:0;}
/* Scoped to .set-rows so these beat `.set-body .ing-in{width:auto}`, which was silently
   winning on specificity and leaving every box at the browser's default input width. */
.set-rows .ing-in.w-s  {width:195px;}
.set-rows .ing-in.w-xs {width:120px;}
.set-rows .ing-in.w-m  {width:225px;}
.set-rows .ing-in.w-l  {width:315px;}
.set-rows .ing-in.w-xl {width:560px;}
.set-rows{max-width:760px;}
.set-page .ing-in:disabled{background:#EDF1F7;color:#6B7B93;cursor:not-allowed;}
.set-f-wide{flex:1 1 300px;}
.set-f-wide .ing-in{width:100%;box-sizing:border-box;}
/* White cards, white fields, white buttons on a near-white page — nothing read as a control.
   Each tool gets a tinted header band (the same blue-grey as a table head), fields get a fill so
   they look like fields, and the action that commits the tool is solid, not an outline. */
.set-page .rs-sec-h{background:#DCE7F5;margin:-10px -14px 8px;padding:7px 14px;
  border-bottom:1px solid #BFD1E7;border-radius:11px 11px 0 0;}
.set-page .ing-in{background:#F1F6FC;border:1px solid #BCCEE5;color:#16202E;}
.set-page .ing-in::placeholder{color:#8CA0BE;}
.set-page .ing-in:focus{background:#fff;border-color:#2E6BD6;box-shadow:0 0 0 3px rgba(46,107,214,.16);}
.set-page select.ing-in{cursor:pointer;}
/* Secondary action — bordered, but coloured so it reads as clickable. */
.set-page .ag-fchip{font-size:12px;padding:6px 13px;border-color:#BCCEE5;color:#2E6BD6;font-weight:700;}
.set-page .ag-fchip:hover{background:#EEF4FE;border-color:#2E6BD6;}
/* Primary action — the one that commits this tool. */
.set-page .set-go{background:#2E6BD6;border-color:#2E6BD6;color:#fff;}
.set-page .set-go:hover{background:#2559B4;border-color:#2559B4;color:#fff;}
.set-lbl{color:#5B6B82;}
/* The admin blocks still use .ing-card internally. Inside a .rs-section that would be a card
   drawn inside a card, so flatten it to a plain divided body here. */
.set-page .ing-card{border:none;border-radius:0;padding:8px 0;border-top:1px solid #EFF3F9;}
.set-page .rs-section>.ing-card:first-of-type{border-top:none;}
.set-page .ing-card h3{font-size:12.5px;}
.set-page .ing-card .ing-in{width:auto;min-width:250px;max-width:100%;font-size:12.5px;padding:5px 9px;margin-bottom:6px;}
.set-link{cursor:pointer;font:inherit;text-align:left;width:100%;color:inherit;}
.set-link:hover{border-color:#2E6BD6;}
/* Blue toolbar, styled like the Open House tour top bar (#1B4F9A shell, #163F7A
   controls, white-on-active chips). */
/* Cadence toolbar = the shared mb-chrome framework (/css/mb-chrome.css) + these few
   DCRM-specific bits: align the bar's content over the 760px card column, widen the
   name field, and style the "default" tag on the active-cadence chip. */
.cad-toolbar .mb-bar-inner{max-width:724px;}   /* 760 body − 2×18px padding */
.cad-name-input{flex:0 1 300px;min-width:180px;}
/* Cadence tabs are ASSETS you open, not tool buttons — so they get their own identity:
   an icon, metadata badges, a lighter card surface, and a lifted white card when open. */
#cad-tabs{gap:8px;padding-top:2px;}
.cad-tab{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 10px;
  font:inherit;font-size:13px;font-weight:700;line-height:1.15;color:#d8e4f6;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.20);border-radius:10px;
  cursor:pointer;transition:background .12s,border-color .12s,transform .05s;}
.cad-tab:hover{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.38);}
.cad-tab-ic{font-size:15px;line-height:1;opacity:.9;}
.cad-tab-nm{white-space:nowrap;}
.cad-tab-badge{min-width:20px;height:19px;padding:0 6px;border-radius:10px;background:rgba(255,255,255,.18);
  color:#fff;font-size:11px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;
  font-variant-numeric:tabular-nums;}
.cad-tab-def{font-size:8.5px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:#9DB6DE;}
.cad-tab.on{background:#fff;color:#16233b;border-color:#fff;box-shadow:0 4px 14px rgba(0,10,40,.30);transform:translateY(-1px);}
.cad-tab.on .cad-tab-ic{opacity:1;}
.cad-tab.on .cad-tab-badge{background:#E7EEF8;color:#2E4468;}
.cad-tab.on .cad-tab-def{color:#8595AC;}
.cad-tabs-empty{font-size:12px;color:rgba(255,255,255,.82);}
/* Tours section = the tour planner in an iframe (so the menu persists) */
#sec-tours{height:100vh;}
.tours-frame{width:100%;height:100%;border:0;display:block;}
/* Collapsible / pinnable sidebar (desktop). Collapsed = a 58px icon rail that
   never goes away and expands on hover; pinned/expanded = full width. */
@media(min-width:721px){
  /* overflow-x only. A blanket overflow:hidden here clipped the labels during the width
     transition (which is what it was for) but also killed vertical scrolling, so on a collapsed
     rail the wheel did nothing and up to 13 items below the fold could not be reached at all. */
  .dcrm-shell.side-collapsed .dcrm-side{position:fixed;left:0;top:0;height:100vh;width:58px;z-index:60;overflow-x:hidden;overflow-y:auto;transition:width .16s ease;}
  .dcrm-shell.side-collapsed .dcrm-main{margin-left:58px;}
  .dcrm-shell.side-collapsed .dcrm-side .side-brand,
  .dcrm-shell.side-collapsed .dcrm-side .side-nav span,
  .dcrm-shell.side-collapsed .dcrm-side .side-updated,
  .dcrm-shell.side-collapsed .dcrm-side .side-lo{display:none;}
  .dcrm-shell.side-collapsed .dcrm-side .side-top{justify-content:center;padding:4px 0 10px;}
  .dcrm-shell.side-collapsed .dcrm-side .side-nav{justify-content:center;gap:0;padding:11px 0;}
  .dcrm-shell.side-collapsed .dcrm-side:hover{width:176px;box-shadow:4px 0 22px rgba(0,0,0,.30);}
  .dcrm-shell.side-collapsed .dcrm-side:hover .side-brand,
  .dcrm-shell.side-collapsed .dcrm-side:hover .side-lo{display:block;}
  .dcrm-shell.side-collapsed .dcrm-side:hover .side-nav span{display:inline;}
  .dcrm-shell.side-collapsed .dcrm-side:hover .side-top{justify-content:flex-start;padding:4px 4px 14px;}
  .dcrm-shell.side-collapsed .dcrm-side:hover .side-nav{justify-content:flex-start;gap:11px;padding:10px 12px;}
}
/* The legacy phone bottom-bar transformation is gone: phones live in /m and the
   floating 🚌 menu is the app's one navigation. A phone that explicitly asks
   for the desktop site gets the real desktop layout, unmodified. */
/* Visits — the 7-day intent lists. Day band = the house table band; rows = standard ramp. */
#vw-commit{padding:14px 22px 0;display:flex;flex-direction:column;gap:14px;align-items:flex-start;}
.vwd{width:max-content;max-width:100%;}
.vwd-h{background:#CBD8EA;color:#1B2B41;font-size:13px;font-weight:800;border-radius:8px 8px 0 0;padding:7px 12px;display:flex;gap:14px;align-items:center;}
.vwd-open{margin-left:auto;padding:4px 12px;font-size:12px;}
.vwd-n{font-weight:700;color:#41639B;font-size:12px;}
.vwd-p{display:flex;gap:14px;align-items:baseline;padding:5px 12px;border-bottom:1px solid #EFF3F9;background:#fff;font-size:12.5px;color:#3A4759;white-space:nowrap;}
.vwd-p:nth-child(even){background:#F8FAFD;}
.vwd-p:last-child{border-radius:0 0 8px 8px;}
.vwd-time{color:#5B6B85;font-variant-numeric:tabular-nums;}
.vwd-addr{font-weight:700;color:#16202E;}
.vwd-agent{color:#1F9E56;font-weight:700;}
.vwd-none{background:#fff;color:#8894a8;font-size:12px;padding:6px 12px;border-radius:0 0 8px 8px;}
.vwc-warn{color:#B5322F;font-weight:700;font-size:11.5px;}
.vwd-chk{align-self:center;width:14px;height:14px;accent-color:#1AA872;}
/* day-plan additions: call badge, stop number, drive separators */
.vwd-nn{font-weight:800;color:#2E6BD6;min-width:18px;text-align:right;}
.vwd-badge{color:#B26A00;font-weight:800;font-size:11px;}
.vwd-call{opacity:.85;}
.vwd-drive{background:#fff;color:#8894a8;font-size:10.5px;padding:1px 12px 1px 44px;border-bottom:1px solid #EFF3F9;}
