/* team-clients.css — the styles of the Team Clients tab (Client Renewals, New Client Lifecycle, Files, Notifications Center).
   Moved out of index.html on 2026-10-05 (sustained-load programme Wave 4) and linked from the
   SAME position its <style> block held, so the cascade order is unchanged. index.html is fetched
   fresh on every navigation; a file can come back as 304 Not Modified. Edit it here. */
/* Design tokens recycled from the BD Admin Portal (pipeline-dashboard.html), scoped to this tab. */
#tab-team-clients{
  --tc-bg:#f0f2f5;--tc-surface:#fff;--tc-surface-2:#fafafa;--tc-hov:#f4f5f6;
  --tc-brand:#0f6cbd;--tc-brand-h:#115ea3;--tc-brand-bg:#ebf3fb;--tc-brand-lt:#cce0f5;
  --tc-crit:#bc2f32;--tc-crit-bg:#fde7e9;--tc-warn:#7d4200;--tc-warn-px:#c47d00;--tc-warn-bg:#fff8e0;--tc-warn-bdr:#f5d97e;--tc-ok:#107c10;--tc-ok-bg:#dff6dd;
  --tc-t1:#242424;--tc-t2:#424242;--tc-t3:#616161;--tc-t4:#8a8a8a;--tc-t5:#c0c0c0;
  --tc-bdr:#d1d1d1;--tc-bdr2:#e8e8e8;--tc-r:6px;--tc-rl:10px;
  --tc-sh:0 1px 2px rgba(0,0,0,.07),0 2px 5px rgba(0,0,0,.05);--tc-shm:0 2px 8px rgba(0,0,0,.09),0 4px 16px rgba(0,0,0,.06);
  /* Figtree is Monday.com's own typeface (loaded from Google Fonts in <head>).
     Everything on this tab inherits it, so the board reads as the real thing. */
  --tc-font:Figtree,-apple-system,'Segoe UI',system-ui,Roboto,sans-serif;

  /* ── Monday.com design tokens ──────────────────────────────────────────────
     Sampled from the firm's live "Client Renewals" / "New Client Lifecycle"
     boards so this tab mirrors them. Status/avatar hues are Monday's own
     published palette values, not approximations. */
  --mn-text:#323338;--mn-text-2:#676879;--mn-text-3:#9699a6;--mn-placeholder:#c5c7d0;
  --mn-line:#e6e9ef;--mn-line-2:#d0d4e4;
  --mn-surface:#fff;--mn-hover:#f5f6f8;--mn-shell:#f6f7fb;
  --mn-primary:#0073ea;--mn-primary-h:#0060b9;--mn-link:#1f76c2;--mn-selected:#cce5ff;
  --mn-green:#00c875;--mn-orange:#fdab3d;--mn-red:#e2445c;--mn-grey:#c4c4c4;
  --mn-dark-grey:#808080;--mn-blue:#579bfc;--mn-dark-blue:#0086c0;--mn-purple:#a25ddc;
  --mn-yellow:#ffcb00;--mn-timeline:#333333;
  /* Row metrics sampled from the live board — deliberately tight so a full
     book of clients fits without scrolling. --mn-cell-fs drives every cell,
     status pill and date so density stays consistent if this is retuned. */
  --mn-row-h:29px;--mn-cell-fs:12.5px;--mn-av:24px;
  font-family:var(--tc-font);background:var(--tc-bg);color:var(--tc-t1);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;min-height:calc(100vh - 100px)}
:where(#tab-team-clients) *,:where(#tab-team-clients) *::before,:where(#tab-team-clients) *::after{box-sizing:border-box}
#tab-team-clients button{font-family:inherit;cursor:pointer}
/* Board width. The 1780px cap this replaced was inherited from the Meeting
   Tracker shell and predates the column set: the Client Renewals renders ~2.6k px of
   columns, so on a 2560-wide monitor ~750px of real columns were pushed off the
   right while ~390px of empty shell sat on each side (owner report 2026-08-24).
   Still centred, still capped — just capped above the table's own width rather
   than well below it. The `calc` wins on anything narrower, so laptops and
   phones are unaffected. */
/* No bottom padding. The board owns its own scroll box and is sized to end at
   the fold (_fitBoardHeight in team-clients.js), so an 80px tail below it was
   the ONLY thing left making the window scrollable — 76px of travel that put
   every wheel outside the rows onto the page instead of the table, and left a
   band of grey under the board that belonged to nothing (owner report
   2026-08-31). With it gone the tab fits the window and the board is the only
   thing that scrolls. */
#tab-team-clients .tc2-page{width:calc(100% - 32px);max-width:2800px;margin:0 auto;padding:18px 0 0}
#tab-team-clients .tc2-pghead{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:16px}
#tab-team-clients .tc2-h1{font-size:22px;font-weight:700;letter-spacing:-.025em;color:var(--tc-t1)}
#tab-team-clients .tc2-sub{font-size:12px;color:var(--tc-t3);margin-top:3px}
#tab-team-clients .tc2-seg{display:inline-flex;background:var(--tc-surface-2);border:1px solid var(--tc-bdr);border-radius:8px;padding:2px;gap:2px}
#tab-team-clients .tc2-seg-btn{display:inline-flex;align-items:center;gap:5px;padding:6px 14px;border:none;background:transparent;color:var(--tc-t3);font-size:12.5px;font-weight:600;border-radius:6px;transition:background .12s,color .12s}
#tab-team-clients .tc2-seg-btn:hover{color:var(--tc-t1)}
#tab-team-clients .tc2-seg-btn.active{background:var(--tc-surface);color:var(--tc-brand);box-shadow:var(--tc-sh)}
#tab-team-clients .tc2-kpi-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px}
#tab-team-clients .tc2-kpi{background:var(--tc-surface);border:1px solid var(--tc-bdr2);border-radius:var(--tc-rl);padding:14px 18px;box-shadow:var(--tc-sh);position:relative;overflow:hidden}
#tab-team-clients .tc2-kpi-band{height:3px;position:absolute;top:0;left:0;right:0;border-radius:var(--tc-rl) var(--tc-rl) 0 0;background:var(--tc-brand)}
#tab-team-clients .tc2-kpi.k-warn .tc2-kpi-band{background:var(--tc-warn-px)}
#tab-team-clients .tc2-kpi.k-crit .tc2-kpi-band{background:var(--tc-crit)}
#tab-team-clients .tc2-kpi.k-ok .tc2-kpi-band{background:var(--tc-ok)}
#tab-team-clients .tc2-kpi-n{font-size:10.5px;font-weight:600;color:var(--tc-t4);text-transform:uppercase;letter-spacing:.065em;margin-bottom:7px}
#tab-team-clients .tc2-kpi-v{font-size:28px;font-weight:700;letter-spacing:-.05em;line-height:1;margin-bottom:4px;font-variant-numeric:tabular-nums;color:var(--tc-brand)}
#tab-team-clients .tc2-kpi.k-warn .tc2-kpi-v{color:var(--tc-warn-px)}
#tab-team-clients .tc2-kpi.k-crit .tc2-kpi-v{color:var(--tc-crit)}
#tab-team-clients .tc2-kpi.k-ok .tc2-kpi-v{color:var(--tc-ok)}
#tab-team-clients .tc2-kpi-d{font-size:11px;color:var(--tc-t4)}
@media(max-width:860px){#tab-team-clients .tc2-kpi-row{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){#tab-team-clients .tc2-kpi-row{grid-template-columns:1fr}}
#tab-team-clients .tc2-toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
#tab-team-clients .tc2-search{height:34px;padding:0 12px;border:1px solid var(--tc-bdr);border-radius:var(--tc-r);font-size:13px;min-width:220px;font-family:inherit;background:var(--tc-surface);color:var(--tc-t1);box-shadow:var(--tc-sh)}
#tab-team-clients .tc2-filter{height:34px;padding:0 8px;border:1px solid var(--tc-bdr);border-radius:var(--tc-r);font-size:12.5px;background:var(--tc-surface);color:var(--tc-t2);font-family:inherit;box-shadow:var(--tc-sh)}
#tab-team-clients .tc2-sp{flex:1}
#tab-team-clients .tc2-btn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 14px;border-radius:var(--tc-r);border:1px solid var(--tc-bdr);background:var(--tc-surface);color:var(--tc-t2);font-size:12px;font-weight:600;box-shadow:var(--tc-sh);transition:background .12s}
#tab-team-clients .tc2-btn:hover{background:var(--tc-hov)}
#tab-team-clients .tc2-btn-brand{background:var(--tc-brand);border-color:var(--tc-brand);color:#fff}
#tab-team-clients .tc2-btn-brand:hover{background:var(--tc-brand-h)}
#tab-team-clients .tc2-btn-crit{background:var(--tc-crit);border-color:var(--tc-crit);color:#fff}
#tab-team-clients .tc2-btn-crit:hover{filter:brightness(.92)}
#tab-team-clients .tc2-btn-ok{background:var(--tc-ok);border-color:var(--tc-ok);color:#fff}
#tab-team-clients .tc2-btn-ok:hover{filter:brightness(.92)}
#tab-team-clients .tc2-modal-actions button:disabled{opacity:.5;cursor:not-allowed;filter:none}
#tab-team-clients .tc2-colmenu{position:relative;display:inline-block}
#tab-team-clients .tc2-colmenu-panel{position:absolute;right:0;top:38px;z-index:50;background:var(--tc-surface);border:1px solid var(--tc-bdr);border-radius:var(--tc-r);box-shadow:var(--tc-shm);padding:8px 6px;min-width:190px}
#tab-team-clients .tc2-colmenu-hd{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--tc-t4);padding:2px 8px 6px}
#tab-team-clients .tc2-colmenu-stamp{font-size:11px;color:var(--tc-t4);padding:0 8px 7px;margin-top:-3px}
#tab-team-clients .tc2-colmenu-item{display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:5px;font-size:12.5px;color:var(--tc-t2);cursor:pointer}
#tab-team-clients .tc2-colmenu-item:hover{background:var(--tc-hov)}
#tab-team-clients .tc2-colmenu-item input{cursor:pointer}
#tab-team-clients .tc2-sc-sub{font-size:11px;color:var(--tc-t4);margin-top:3px;line-height:1.5}
#tab-team-clients .tc2-files-cell{white-space:nowrap}
#tab-team-clients .tc2-files-up{display:inline-flex;align-items:center;justify-content:center;height:26px;width:28px;border:1px solid var(--tc-bdr);background:var(--tc-surface);border-radius:5px;font-size:13px;cursor:pointer;color:var(--tc-t3)}
#tab-team-clients .tc2-files-up:hover{border-color:var(--tc-brand);color:var(--tc-brand)}
#tab-team-clients .tc2-files-btn{height:26px;padding:0 9px;margin-left:4px;border:1px solid var(--tc-bdr);background:var(--tc-surface);border-radius:5px;font-size:11.5px;font-weight:600;color:var(--tc-t3);cursor:pointer}
#tab-team-clients .tc2-files-btn:hover{border-color:var(--tc-brand);color:var(--tc-brand)}
#tab-team-clients .tc2-card{background:var(--tc-surface);border:1px solid var(--tc-bdr2);border-radius:var(--tc-rl);overflow:hidden;box-shadow:var(--tc-sh);margin-bottom:12px}
#tab-team-clients .tc2-card-hd{display:flex;align-items:center;gap:10px;padding:11px 14px;border-bottom:1px solid var(--tc-bdr2);background:var(--tc-surface-2)}
#tab-team-clients .tc2-card-title{font-size:13px;font-weight:700;color:var(--tc-t1)}
#tab-team-clients .tc2-card-badge{font-size:11px;font-weight:700;color:var(--tc-brand);background:var(--tc-brand-bg);border-radius:10px;padding:1px 9px}
#tab-team-clients .tc2-tbl-wrap{overflow-x:auto}
/* ── New Client Lifecycle — bounded scroll box ──────────────────────────────────────
 * This table is 13 columns wide and runs to 100+ rows. Left page-length, its
 * horizontal scrollbar sat at the very bottom of the table — below the fold — so
 * reaching it meant scrolling past every row. Capping the height keeps that
 * scrollbar at the bottom of the visible box at all times, and the header row
 * sticks so columns stay labelled while rows scroll. Same approach as
 * .mt-table-wrap (the Meeting Tracker's wide grid).
 *
 * Scoped to this panel on purpose: Client Renewals, History and the Monthly Changes
 * Report share .tc2-tbl-wrap but are narrower, and bounding them would add an
 * inner scroll area they don't need.
 *
 * Keep the cap comfortably under 100vh minus the sticky topbar + tab-nav (~99px),
 * or the box's bottom edge — and with it the scrollbar — can never be scrolled
 * into view, which is the whole bug this fixes.
 */
/* Deliberately NO scrollbar-width/scrollbar-color here: Chromium ignores every
   ::-webkit-scrollbar rule on an element that sets either standard property, which
   would silently drop both the 12px sizing below and the bottom-bar hide further
   down. .mt-table-wrap styles scrollbars the same webkit-only way. Firefox has no
   ::-webkit-scrollbar, so it just renders its default bars - which still work. */
#tab-team-clients #tc2-panel-incoming .tc2-tbl-wrap{
  max-height:min(68vh,780px);overflow:auto;overscroll-behavior-x:contain;scrollbar-gutter:stable}
#tab-team-clients #tc2-panel-incoming .tc2-tbl-wrap::-webkit-scrollbar{width:12px;height:12px}
#tab-team-clients #tc2-panel-incoming .tc2-tbl-wrap::-webkit-scrollbar-track{background:var(--tc-surface-2)}
#tab-team-clients #tc2-panel-incoming .tc2-tbl-wrap::-webkit-scrollbar-thumb{background:#c3cade;border-radius:8px;border:3px solid var(--tc-surface-2)}
#tab-team-clients #tc2-panel-incoming .tc2-tbl-wrap::-webkit-scrollbar-thumb:hover{background:#94a3c0}
/* th background (--tc-surface-2) is an opaque hex, which sticky needs - rows pass
   underneath. border-collapse:collapse drops a sticky cell's own border-bottom, so
   the header rule is redrawn as a shadow instead (same trick as .ops-table th). */
#tab-team-clients #tc2-panel-incoming .tc2-tbl thead th{position:sticky;top:0;z-index:3;border-bottom:none;box-shadow:0 1px 0 var(--tc-bdr2)}
/* Touch: the table is dragged sideways directly, so the cap only adds a nested
   scroll area that fights the page. Dropping the cap lets the box grow to its
   content, which leaves horizontal scrolling only - the pre-existing behaviour. */
@media(max-width:640px){#tab-team-clients #tc2-panel-incoming .tc2-tbl-wrap{max-height:none}}
#tab-team-clients .tc2-tbl{width:100%;border-collapse:collapse;font-size:12.5px}
#tab-team-clients .tc2-tbl th{padding:9px 10px 9px 12px;text-align:left;font-size:10px;font-weight:600;color:var(--tc-t4);text-transform:uppercase;letter-spacing:.065em;background:var(--tc-surface-2);border-bottom:1px solid var(--tc-bdr2);white-space:nowrap}
#tab-team-clients .tc2-tbl th.tc2-so{cursor:pointer;user-select:none}
#tab-team-clients .tc2-tbl th.tc2-so:hover{color:var(--tc-t2)}
#tab-team-clients .tc2-tbl th .tc2-arw{opacity:.4;font-size:9px;margin-left:3px}
#tab-team-clients .tc2-tbl th.tc2-so-active .tc2-arw{opacity:1;color:var(--tc-brand)}
#tab-team-clients .tc2-tbl td{padding:9px 10px 9px 12px;border-bottom:1px solid var(--tc-bdr2);vertical-align:middle;color:var(--tc-t2)}
#tab-team-clients .tc2-tbl tr:last-child td{border-bottom:none}
#tab-team-clients .tc2-tbl tbody tr{transition:background .1s}
#tab-team-clients .tc2-tbl tbody tr:hover td{background:var(--tc-hov)}
#tab-team-clients .tc2-cn{font-weight:600;color:var(--tc-t1)}
#tab-team-clients .tc2-cn a{color:var(--tc-brand);text-decoration:none}
#tab-team-clients .tc2-cn a:hover{text-decoration:underline}
#tab-team-clients .tc2-sec{color:var(--tc-t4);font-size:12px}
#tab-team-clients .tc2-muted{color:var(--tc-t5)}
#tab-team-clients .tc2-detail{font-size:12px;color:var(--tc-t3);line-height:1.45;max-width:420px}
#tab-team-clients .tc2-actions{white-space:nowrap;text-align:right}
#tab-team-clients .tc2-mini{height:26px;padding:0 9px;border:1px solid var(--tc-bdr);background:var(--tc-surface);border-radius:5px;font-size:11.5px;font-weight:600;color:var(--tc-t3);margin-left:4px}
#tab-team-clients .tc2-mini:hover{border-color:var(--tc-brand);color:var(--tc-brand)}
#tab-team-clients .tc2-mini-danger:hover{border-color:var(--tc-crit);color:var(--tc-crit)}
#tab-team-clients .tc2-mini-ok{border-color:var(--tc-ok);color:var(--tc-ok)}
#tab-team-clients .tc2-mini-ok:hover{background:var(--tc-ok-bg)}
#tab-team-clients .tc2-badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:700;white-space:nowrap}
#tab-team-clients .tc2-b-intake{background:var(--tc-brand-bg);color:var(--tc-brand)}
#tab-team-clients .tc2-b-conflict{background:var(--tc-warn-bg);color:var(--tc-warn)}
#tab-team-clients .tc2-b-score{background:#ecfdf3;color:#166534}
#tab-team-clients .tc2-b-monday{background:#eef2ff;color:#4338ca;margin-left:6px}
#tab-team-clients .tc2-rd-field{height:28px;padding:0 8px;border:1px solid var(--tc-bdr);border-radius:5px;font-size:12px;font-family:inherit;background:var(--tc-surface);color:var(--tc-t1);width:140px;text-align:left;cursor:pointer}
#tab-team-clients .tc2-rd-field:hover{border-color:var(--tc-brand)}
#tab-team-clients .tc2-rd-field.tc2-rd-m2m{color:var(--tc-brand);font-weight:700}
#tab-team-clients .tc2-scope{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:700;white-space:nowrap}
#tab-team-clients .tc2-scope-lob{background:#e8f1fb;color:#1f4e79}
#tab-team-clients .tc2-scope-def{background:#eaf4e4;color:#375623}
#tab-team-clients .tc2-scope-both{background:#fff1df;color:#7a3f10}
#tab-team-clients .tc2-scope-none{background:#f3f4f6;color:#64748b}
#tab-team-clients .tc2-scope-btn{border:none;background:transparent;padding:0;cursor:pointer;font:inherit}
#tab-team-clients .tc2-scope-btn:hover .tc2-scope{outline:1px dashed var(--tc-brand)}
#tab-team-clients .tc2-rd-input{height:28px;padding:0 6px;border:1px solid var(--tc-bdr);border-radius:5px;font-size:12px;font-family:inherit;background:var(--tc-surface);color:var(--tc-t1);width:140px}
#tab-team-clients .tc2-rd-past{color:var(--tc-crit);font-weight:700}
#tab-team-clients .tc2-rd-soon{color:var(--tc-warn-px);font-weight:700}
/* Meeting-Tracker-style status select (Monday-style colored pill + tinted caret) */
#tab-team-clients .tc2-mt{-webkit-appearance:none;appearance:none;background-repeat:no-repeat;background-position:right 8px center;background-color:#eef1f5;color:#64748b;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5'%3E%3Cpath fill='%23000' fill-opacity='.3' d='M0 0l4 5 4-5z'/%3E%3C/svg%3E");display:inline-block;height:26px;min-width:120px;border:none;border-radius:6px;font-family:inherit;font-weight:700;font-size:11.5px;text-align:center;text-align-last:center;cursor:pointer;padding:0 22px 0 10px;transition:filter .12s}
#tab-team-clients .tc2-mt:hover{filter:brightness(1.06)}
#tab-team-clients .tc2-mt:focus{outline:2px solid var(--tc-brand);outline-offset:-2px}
#tab-team-clients .tc2-note-btn{height:26px;width:30px;border:1px solid var(--tc-bdr);background:var(--tc-surface);border-radius:5px;font-size:12px;cursor:pointer;opacity:.6;margin-left:4px}
#tab-team-clients .tc2-note-btn.has{opacity:1;border-color:var(--tc-brand);background:var(--tc-brand-bg)}
#tab-team-clients .tc2-empty,#tab-team-clients .tc2-loading{padding:28px;text-align:center;color:var(--tc-t3);font-size:13px}
/* New Client Lifecycle — Microsoft Fluent 2 (neutral cards + tables, no colored stage board) */
#tab-team-clients .tc2-lc-board{display:flex;flex-direction:column;gap:12px}
#tab-team-clients #tc2-lc-board .tc2-cn{white-space:nowrap;min-width:220px}
#tab-team-clients td.tc2-lc-arrow{width:24px;padding:8px 2px 8px 8px}
#tab-team-clients .tc2-lc-toggle{width:16px;height:16px;border:1px solid var(--tc-bdr);border-radius:4px;background:var(--tc-surface);color:var(--tc-t4);cursor:pointer;font-size:8px;line-height:1;display:inline-flex;align-items:center;justify-content:center;transition:transform .15s}
#tab-team-clients .tc2-lc-toggle:hover{border-color:var(--tc-brand);color:var(--tc-brand)}
#tab-team-clients tr.tc2-lc-expanded .tc2-lc-toggle{transform:rotate(90deg);border-color:var(--tc-brand);color:var(--tc-brand)}
#tab-team-clients .tc2-staffers{display:flex;flex-direction:column;gap:4px}
#tab-team-clients .tc2-staff{display:flex;align-items:center;gap:6px;white-space:nowrap;font-size:12px;color:var(--tc-t2)}
#tab-team-clients .tc2-role{display:inline-block;min-width:48px;text-align:center;padding:1px 6px;border-radius:8px;font-size:9.5px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
#tab-team-clients .tc2-role-evp{background:#e8f1fb;color:#1f4e79}
#tab-team-clients .tc2-role-lob{background:#fff1df;color:#7a3f10}
#tab-team-clients .tc2-role-pol{background:#eaf4e4;color:#375623}
#tab-team-clients tr.tc2-lc-detail-row>td{background:var(--tc-surface-2);border-left:3px solid var(--tc-brand);padding:12px 16px 14px 44px}
#tab-team-clients .tc2-detail-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px 22px}
#tab-team-clients .tc2-detail-grid .lbl{display:block;font-size:10px;font-weight:800;color:var(--tc-t4);text-transform:uppercase;letter-spacing:.05em;margin-bottom:2px}
#tab-team-clients .tc2-detail-grid .val{font-size:12.5px;color:var(--tc-t2);line-height:1.45;overflow-wrap:anywhere}
#tab-team-clients .tc2-detail-notes{grid-column:1/-1}
#tab-team-clients .tc2-detail-meta{grid-column:1/-1;font-size:11px;color:var(--tc-t5);border-top:1px dashed var(--tc-bdr2);padding-top:8px;margin-top:2px}
/* New Client Lifecycle — unified sortable table (single .tc2-card, like Client Renewals) */
#tab-team-clients th.tc2-lc-arrow-th{width:24px;padding:9px 2px 9px 8px}
#tab-team-clients .tc2-tbl td.tc2-staffcol{white-space:nowrap;max-width:170px;overflow:hidden;text-overflow:ellipsis}
#tab-team-clients .tc2-lc-date{width:132px}
/* New Client Lifecycle' Type/Bid/Proposal pills only — smaller than the shared .tc2-mt
   base (which Client Renewals's Renewal Status pill still uses) since three of these
   colored pills sit side by side on one row and were overcrowding it. */
#tab-team-clients #tc2-lc-table .tc2-mt{min-width:84px;height:22px;font-size:10px;padding:0 18px 0 8px;background-position:right 6px center;border-radius:5px}
/* Type pill: shorter labels than Bid/Proposal (Signed, No Bid, Prospective…) so
   let it shrink below the shared 84px floor instead of stretching to match. */
#tab-team-clients #tc2-lc-table .tc2-mt-type{min-width:58px}
/* Staffers cell — three role rows with chips + add dropdown (now only shown in the
   expandable detail row; the main row shows compact read-only text instead) */
#tab-team-clients .tc2-sc-wrap{display:flex;flex-direction:column;gap:5px;min-width:0}
#tab-team-clients .tc2-sc-row{display:flex;align-items:flex-start;gap:6px;flex-wrap:wrap}
#tab-team-clients .tc2-sc-label{flex-shrink:0;min-width:52px;text-align:center;padding:2px 6px;border-radius:8px;font-size:9.5px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;margin-top:2px}
#tab-team-clients .tc2-sc-label.evp{background:#e8f1fb;color:#1f4e79}
#tab-team-clients .tc2-sc-label.lob{background:#fff1df;color:#7a3f10}
#tab-team-clients .tc2-sc-label.pol{background:#eaf4e4;color:#375623}
#tab-team-clients .tc2-sc-items{display:flex;flex-wrap:wrap;gap:4px;align-items:center;flex:1}
#tab-team-clients .tc2-sc-chip{display:inline-flex;align-items:center;gap:4px;background:var(--tc-surface-2);border:1px solid var(--tc-bdr2);border-radius:12px;padding:1px 4px 1px 8px;font-size:11.5px;color:var(--tc-t2)}
#tab-team-clients .tc2-sc-x{border:none;background:transparent;color:var(--tc-t4);cursor:pointer;font-size:12px;line-height:1;padding:0 2px}
#tab-team-clients .tc2-sc-x:hover{color:var(--tc-crit)}
#tab-team-clients .tc2-sc-add{height:22px;border:1px dashed var(--tc-bdr);border-radius:10px;background:var(--tc-surface);color:var(--tc-t4);font-family:inherit;font-size:11px;cursor:pointer;padding:0 4px}
#tab-team-clients .tc2-sc-note{font-size:11px;color:var(--tc-t4);font-style:italic;margin-top:2px}
#tab-team-clients .tc2-ref-input{height:28px;padding:0 8px;border:1px solid var(--tc-bdr);border-radius:5px;font-size:12px;font-family:inherit;background:var(--tc-surface);color:var(--tc-t1);min-width:120px;max-width:170px;width:100%}
/* Staffing editor relocated into the expandable detail row */
#tab-team-clients .tc2-detail-staff{grid-column:1/-1;border-bottom:1px dashed var(--tc-bdr2);padding-bottom:10px;margin-bottom:2px}
#tab-team-clients .tc2-detail-staff>.lbl{display:block;font-size:10px;font-weight:800;color:var(--tc-t4);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px}
#tab-team-clients .tc2-detail-staff .tc2-sc-wrap{flex-direction:row;flex-wrap:wrap;gap:8px 22px}
#tab-team-clients .tc2-detail-staff .tc2-sc-row{flex:1 1 240px;min-width:220px}
/* Renewal-drafting link cell */
#tab-team-clients .tc2-link-a{color:var(--tc-brand);text-decoration:none;font-weight:600;font-size:12px}
#tab-team-clients .tc2-link-a:hover{text-decoration:underline}
#tab-team-clients .tc2-link-edit{border:none;background:transparent;color:var(--tc-t4);cursor:pointer;font-size:11px;margin-left:4px}
#tab-team-clients .tc2-link-add{height:26px;padding:0 9px;border:1px dashed var(--tc-bdr);background:var(--tc-surface);border-radius:5px;font-size:11.5px;color:var(--tc-brand);cursor:pointer;font-family:inherit;font-weight:600}
#tab-team-clients .tc2-link-add:hover{border-color:var(--tc-brand);border-style:solid}
#tab-team-clients .tc2-links-wrap{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
#tab-team-clients .tc2-link-chip{display:inline-flex;align-items:center;gap:3px;height:22px;padding:0 7px;border:1px solid var(--tc-bdr);background:var(--tc-surface);border-radius:11px;font-size:11px;font-weight:600;color:var(--tc-brand);text-decoration:none;white-space:nowrap}
#tab-team-clients .tc2-link-chip:hover{border-color:var(--tc-brand);background:var(--tc-brand-bg,#eef4fc)}
#tab-team-clients .tc2-link-hint{font-size:12px;color:var(--tc-t3);margin:0 0 12px}
/* Terminate (red X) */
#tab-team-clients .tc2-term{height:26px;width:28px;border:1px solid var(--tc-crit-bdr,#f1bbbb);background:var(--tc-surface);color:var(--tc-crit);border-radius:5px;font-size:13px;font-weight:800;cursor:pointer;margin-left:4px;line-height:1}
#tab-team-clients .tc2-term:hover{background:var(--tc-crit-bg)}
#tab-team-clients .tc2-hist-badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:700}
#tab-team-clients .tc2-hist-grace{background:var(--tc-warn-bg);color:var(--tc-warn)}
#tab-team-clients .tc2-hist-ended{background:#f3f4f6;color:#64748b}
#tab-team-clients .tc2-hist-signed{background:var(--tc-ok-bg);color:var(--tc-ok)}
/* Modals */
/* ── Shared compose window (Send to Client / Send to Me) ──────────────────
   Uses this app's REAL theme tokens: --text, --text-muted, --surface,
   --surface-2, --line, --line-2, --accent. An earlier version invented
   --fg/--bdr2, which do not exist here, so every fallback resolved to a
   near-black on the dark panel and the whole window was unreadable. If you add
   a colour, take it from styles.css -- do not guess a name and rely on the
   fallback.

   The email body itself renders on white whatever the page theme is. It is a
   preview of an email; showing it dark would show the sender something the
   reader never sees. */
.pmail-ov{position:fixed;inset:0;background:rgba(5,8,18,.72);backdrop-filter:blur(8px);z-index:10000;display:flex;align-items:center;justify-content:center;padding:18px}
.pmail-modal{display:flex;flex-direction:column;width:min(1120px,100%);max-height:min(94vh,940px);background:linear-gradient(180deg,#162035,#111c30);border:1px solid var(--line-2);border-radius:16px;box-shadow:var(--shadow);color:var(--text);overflow:hidden}
.pmail-hd{padding:16px 20px 12px;border-bottom:1px solid var(--line);position:relative}
.pmail-modal h3{margin:0 0 3px;font-size:17px;color:var(--text)}
.pmail-sub{margin:0;font-size:12.5px;line-height:1.5;color:var(--text-muted)}
.pmail-x{display:none}
.pmail-bd{display:grid;grid-template-columns:270px minmax(0,1fr);gap:0;flex:1;min-height:0}
.pmail-bd.no-picker{grid-template-columns:minmax(0,1fr)}

/* Left column: what goes in the email */
.pmail-pick{display:flex;flex-direction:column;min-height:0;border-right:1px solid var(--line);background:rgba(0,0,0,.14)}
.pmail-bd.no-picker .pmail-pick{display:none}
.pmail-pick-hd{padding:12px 14px 8px;border-bottom:1px solid var(--line)}
.pmail-pick-hd .pmail-lbl{display:block;margin-bottom:6px}
.pmail-pick-count{font-size:11.5px;color:var(--text-muted)}
.pmail-pick-all{margin-left:auto;background:none;border:0;padding:0;font-size:11.5px;font-weight:700;color:var(--accent);cursor:pointer;font-family:inherit}
.pmail-pick-list{flex:1;overflow-y:auto;padding:8px}
.pmail-pick-item{display:flex;gap:9px;align-items:flex-start;padding:8px 9px;margin-bottom:5px;border:1px solid var(--line);border-radius:8px;cursor:pointer;font-size:12.5px;line-height:1.4;color:var(--text-muted)}
.pmail-pick-item:hover{background:var(--hover)}
.pmail-pick-item.on{border-color:var(--gold-brd);background:var(--gold-soft);color:var(--text)}
.pmail-pick-item input{margin:2px 0 0;accent-color:var(--accent);flex:0 0 auto}
.pmail-pick-empty{padding:14px;font-size:12px;font-style:italic;color:var(--text-muted)}
.pmail-opts{flex:none;padding:10px;border-top:1px solid var(--line);background:rgba(0,0,0,.1)}
.pmail-opt{display:flex;gap:9px;align-items:flex-start;padding:9px 10px;border:1px solid var(--line);border-radius:8px;cursor:pointer}
.pmail-opt:hover{background:var(--hover)}
.pmail-opt.on{border-color:var(--gold-brd);background:var(--gold-soft)}
.pmail-opt input{margin:2px 0 0;accent-color:var(--accent);flex:0 0 auto}
.pmail-opt-tx{display:block;min-width:0}
.pmail-opt-tx strong{display:block;font-size:12.5px;font-weight:700;line-height:1.35;color:var(--text)}
.pmail-opt-tx em{display:block;margin-top:3px;font-size:11px;font-style:normal;line-height:1.45;color:var(--text-muted)}
.pmail-persp{padding:10px 12px;border-top:1px solid var(--line)}
.pmail-persp textarea{width:100%;box-sizing:border-box;padding:7px 9px;border:1px solid var(--line-2);border-radius:7px;background:var(--surface);color:var(--text);font-size:12px;font-family:inherit;line-height:1.5;resize:vertical}
.pmail-persp textarea::placeholder{color:var(--text-muted)}
.pmail-tplsel{padding:5px 9px;border:1px solid var(--line-2);border-radius:7px;background:var(--surface);color:var(--text);font-size:12.5px;font-family:inherit;max-width:280px}

/* Right column: the email */
.pmail-main{display:flex;flex-direction:column;min-height:0;padding:14px 16px}
.pmail-addr{display:flex;flex-direction:column;gap:6px;margin-bottom:10px;padding:9px 11px;border:1px solid var(--line);border-radius:9px;background:var(--surface-2)}
.pmail-row{display:flex;align-items:flex-start;gap:10px;min-height:24px}
.pmail-lbl{flex:0 0 58px;padding-top:4px;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted)}
.pmail-chips{display:flex;flex-wrap:wrap;gap:5px;align-items:center;min-height:22px}
.pmail-chip{display:inline-flex;align-items:center;gap:7px;padding:3px 10px;border:1px solid var(--line-2);border-radius:999px;background:var(--surface);font-size:12px;color:var(--text)}
.pmail-chip.locked{border-style:dashed;color:var(--text-muted)}
.pmail-chip button{border:0;background:none;padding:0;cursor:pointer;color:var(--text-muted);font-size:14px;line-height:1}
.pmail-chip button:hover{color:var(--crit)}
.pmail-chip-empty{font-size:12px;font-style:italic;color:var(--text-muted)}
.pmail-addcc{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.pmail-inp,.pmail-addcc input{padding:5px 9px;border:1px solid var(--line-2);border-radius:7px;background:var(--surface);color:var(--text);font-size:12.5px;font-family:inherit}
.pmail-addcc input{min-width:230px}
.pmail-inp{width:100%}
.pmail-inp::placeholder,.pmail-addcc input::placeholder{color:var(--text-muted)}
.pmail-mini{padding:5px 11px;border:1px solid var(--line-2);border-radius:7px;background:var(--surface);color:var(--text);font-size:12px;cursor:pointer;font-family:inherit}
.pmail-mini:hover{border-color:var(--accent);color:var(--accent)}
.pmail-field{margin-bottom:9px}
.pmail-field label{display:block;margin-bottom:4px;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted)}

/* Toolbar: every control must be legible, this is the bit that was invisible. */
.pmail-tools{display:flex;flex-wrap:wrap;align-items:center;gap:4px;padding:6px 8px;border:1px solid var(--line-2);border-bottom:0;border-radius:9px 9px 0 0;background:var(--surface-2)}
.pmail-tools select{height:27px;padding:0 6px;border:1px solid var(--line-2);border-radius:6px;background:var(--surface);color:var(--text);font-size:11.5px;font-family:inherit;width:auto}
.pmail-tbtn{min-width:29px;height:27px;padding:0 8px;border:1px solid transparent;border-radius:6px;background:none;color:var(--text);font-size:12.5px;cursor:pointer;font-family:inherit}
.pmail-tbtn.wide{min-width:0;font-size:11px;color:var(--text-muted)}
.pmail-tbtn:hover{border-color:var(--line-2);background:var(--hover);color:var(--accent)}
.pmail-tsep{width:1px;height:18px;margin:0 4px;background:var(--line-2)}
.pmail-edited{margin-left:auto;font-size:11px;font-weight:700;color:var(--amber)}
.pmail-frame{flex:1;min-height:0;border:1px solid var(--line-2);border-radius:0 0 9px 9px;overflow:hidden;background:#fff}
.pmail-body{height:100%;min-height:220px;overflow:auto;padding:0;background:#fff;color:#1a1a1a;outline:0}
.pmail-body:focus{box-shadow:inset 0 0 0 2px rgba(217,183,95,.45)}
.pmail-err{margin-top:8px;font-size:12.5px;color:var(--crit)}

.pmail-ft{display:flex;justify-content:flex-end;gap:9px;padding:12px 20px 14px;border-top:1px solid var(--line);background:rgba(22,32,58,.97);flex-wrap:wrap}
.pmail-ft .pmail-note{margin-right:auto;align-self:center;font-size:11.5px;color:var(--text-muted)}
.pmail-ft button{height:38px;padding:0 17px;border-radius:9px;font-weight:700;font-size:13px;cursor:pointer;font-family:inherit;border:1px solid var(--line-2);background:var(--surface);color:var(--text)}
.pmail-ft button:hover{border-color:var(--accent);color:var(--accent)}
.pmail-send{border-color:transparent!important;background:var(--accent)!important;color:#0f1525!important}
.pmail-send:hover{background:var(--accent-h)!important;color:#0f1525!important}
.pmail-ft button:disabled{opacity:.5;cursor:not-allowed}
@media (max-width:860px){
  .pmail-bd{grid-template-columns:minmax(0,1fr);overflow-y:auto}
  .pmail-pick{border-right:0;border-bottom:1px solid var(--line);max-height:190px}
  .pmail-addcc input{min-width:0;flex:1}
}
@media (max-width:767px){
  /* Phones: the window fills the screen and becomes the ONE scroll surface,
     with the title bar and the Cancel/Send row pinned in place. Before this,
     the modal was a fixed-height box and everything inside it (the picker,
     the toolbar, the editor) fought over that fixed space — and the moment
     the on-screen keyboard opened (the instant you tapped Subject or the
     body to edit it), the box had even less room, Cancel and Send were
     pushed below the visible screen, and there was no way to scroll down to
     them: the window could not be closed or sent from a phone at all. Now
     the window itself is the thing that scrolls, so however tall the
     content gets, dragging a finger up always reaches the footer — and it
     is pinned there anyway, so no scrolling should even be needed. */
  .pmail-ov{padding:0;align-items:stretch;justify-content:stretch}
  .pmail-modal{
    width:100%;max-width:100%;height:100vh;height:100dvh;max-height:none;
    border-radius:0;overflow-y:auto;-webkit-overflow-scrolling:touch;
  }
  .pmail-hd{position:sticky;top:0;z-index:3;background:#162035;padding-right:46px}
  .pmail-x{
    display:flex;align-items:center;justify-content:center;
    position:absolute;top:10px;right:12px;width:32px;height:32px;
    border:1px solid var(--line-2);border-radius:999px;background:var(--surface);
    color:var(--text);font-size:20px;line-height:1;cursor:pointer;
  }
  .pmail-bd{flex:none;overflow-y:visible}
  /* .pmail-pick also holds the extras checkboxes and the JAG Perspective box
     (not just the opportunity checklist), so only the CHECKLIST itself gets
     a capped, independently-scrolling height — capping .pmail-pick as a
     whole would bury the Perspective textarea inside that same small
     scroll pocket. .pmail-pick-list relied on `flex:1` to fill whatever
     room its parent had, which worked in the old fixed-height flex chain;
     .pmail-bd is no longer flex-grown to a definite size here, so that
     chain is broken and flex:1 resolves to nothing, collapsing the list to
     zero height. An explicit max-height sidesteps that instead. */
  .pmail-pick{display:block;max-height:none;overflow-y:visible}
  .pmail-pick-list{flex:none;max-height:170px;overflow-y:auto}
  .pmail-main{flex:none}
  .pmail-frame{flex:none;height:280px}
  .pmail-ft{
    position:sticky;bottom:0;z-index:3;
    padding-bottom:calc(14px + env(safe-area-inset-bottom,0px));
  }
}


#tab-team-clients .tc2-ov{position:fixed;inset:0;background:rgba(20,30,50,.45);z-index:9999;display:flex;align-items:center;justify-content:center;padding:20px}
#tab-team-clients .tc2-modal{background:var(--tc-surface);border-radius:var(--tc-rl);max-width:560px;width:100%;max-height:90vh;overflow:auto;box-shadow:var(--tc-shm);padding:22px;color:var(--tc-t1)}
#tab-team-clients .tc2-modal.wide{max-width:660px}
#tab-team-clients .tc2-modal h3{margin:0 0 14px;font-size:17px;color:var(--tc-t1)}
#tab-team-clients .tc2-field{margin-bottom:12px}
#tab-team-clients .tc2-field label{display:block;font-size:12px;font-weight:600;color:var(--tc-t2);margin-bottom:4px}
#tab-team-clients .tc2-field input,#tab-team-clients .tc2-field select,#tab-team-clients .tc2-field textarea{width:100%;padding:8px 10px;border:1px solid var(--tc-bdr);border-radius:var(--tc-r);font-size:13px;font-family:inherit;box-sizing:border-box;background:var(--tc-surface);color:var(--tc-t1)}
#tab-team-clients .tc2-field textarea{min-height:80px;resize:vertical}
#tab-team-clients .tc2-grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
#tab-team-clients .tc2-modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px;flex-wrap:wrap}
#tab-team-clients .tc2-modal-actions button{height:38px;padding:0 16px;border-radius:var(--tc-r);font-weight:700;font-size:13px;cursor:pointer;font-family:inherit}
#tab-team-clients .tc2-save{background:var(--tc-brand);border:none;color:#fff}
#tab-team-clients .tc2-conflict{background:var(--tc-warn-bg);border:1px solid var(--tc-warn-bdr);color:var(--tc-warn)}
#tab-team-clients .tc2-cancel{background:var(--tc-surface);border:1px solid var(--tc-bdr);color:var(--tc-t2)}
#tab-team-clients .tc2-err{color:var(--tc-crit);font-size:12px;min-height:16px;margin-top:4px}
#tab-team-clients .tc2-modal-state{font-size:13px;padding:8px 0;min-height:20px;color:var(--tc-t3)}
/* Hand-off compose window. The To row is chips rather than an input on purpose:
   the server re-derives the address for a fixed-recipient hand-off, so an
   editable field would promise an edit that never takes effect. */
#tab-team-clients .tc2-cmp-addr{border:1px solid var(--tc-bdr2);border-radius:var(--tc-r);padding:8px 10px;margin-bottom:12px;background:var(--tc-surface-2)}
#tab-team-clients .tc2-cmp-row{display:flex;align-items:flex-start;gap:8px;padding:3px 0}
#tab-team-clients .tc2-cmp-lbl{flex:0 0 26px;font-size:11px;font-weight:700;color:var(--tc-t4);text-transform:uppercase;letter-spacing:.06em;padding-top:5px}
#tab-team-clients .tc2-cmp-chips{display:flex;flex-wrap:wrap;gap:5px;flex:1 1 auto;min-width:0}
#tab-team-clients .tc2-cmp-chip{display:inline-flex;align-items:center;gap:5px;max-width:100%;background:var(--tc-surface);border:1px solid var(--tc-bdr);border-radius:11px;padding:2px 4px 2px 8px;font-size:11.5px;color:var(--tc-t2)}
#tab-team-clients .tc2-cmp-chip.is-locked{background:#eef2f8;border-color:#d3ddec;color:#3f5878;padding-right:8px}
#tab-team-clients .tc2-cmp-chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#tab-team-clients .tc2-cmp-chip button{border:none;background:none;cursor:pointer;color:var(--tc-t4);font-size:13px;line-height:1;padding:0 2px}
#tab-team-clients .tc2-cmp-chip button:hover{color:var(--tc-crit)}
#tab-team-clients .tc2-cmp-none{font-size:11.5px;color:var(--tc-t4);padding-top:5px}
#tab-team-clients .tc2-cmp-addcc{display:flex;gap:6px;flex:1 1 auto;align-items:center}
#tab-team-clients .tc2-cmp-addcc input{flex:1 1 auto;min-width:0;height:28px;padding:0 8px;border:1px solid var(--tc-bdr);border-radius:5px;font-size:12px;font-family:inherit;background:var(--tc-surface);color:var(--tc-t1)}
#tab-team-clients .tc2-cmp-addcc .tc2-mini{margin-left:0}
/* Rich-text message. Cambria here matches what the email actually renders in, so
   the editor is a preview rather than an approximation. */
#tab-team-clients .tc2-cmp-tools{display:flex;flex-wrap:wrap;align-items:center;gap:4px;padding:6px 8px;border:1px solid var(--tc-bdr);border-bottom:none;border-radius:var(--tc-r) var(--tc-r) 0 0;background:var(--tc-surface-2)}
#tab-team-clients .tc2-cmp-tools select{height:26px;padding:0 4px;border:1px solid var(--tc-bdr);border-radius:5px;font-size:11.5px;font-family:inherit;background:var(--tc-surface);color:var(--tc-t2);width:auto}
#tab-team-clients .tc2-cmp-font{min-width:104px}
#tab-team-clients .tc2-cmp-size{min-width:80px}
#tab-team-clients .tc2-cmp-tbtn{height:26px;min-width:28px;padding:0 7px;border:1px solid var(--tc-bdr);background:var(--tc-surface);border-radius:5px;font-size:12px;color:var(--tc-t2);cursor:pointer;font-family:inherit;line-height:1}
#tab-team-clients .tc2-cmp-tbtn:hover{background:var(--tc-hov);color:var(--tc-t1)}
#tab-team-clients .tc2-cmp-tsep{width:1px;height:18px;background:var(--tc-bdr);margin:0 2px}
#tab-team-clients .tc2-cmp-tbtn.wide{min-width:0;padding:0 9px;white-space:nowrap}
/* ── The email, drawn as the email ─────────────────────────────────────────
   Owner request 2026-08-26: the window must show what actually sends, in the
   shape it sends in. Everything from here to .tc2-cmp-locknote is a deliberate
   copy of clientShell() in functions/_shared/client-mail.js — the BD Trips
   layout every Client Renewals / New Client Lifecycle email uses since
   2026-10-21: a white page, a small grey eyebrow, the client as a bold heading,
   the message, a two-column details table, one blue button and a grey footnote,
   in a 560px column. Fixed hex values rather than theme tokens on purpose: an
   email has no dark mode, and painting the preview in Pulse's theme is
   precisely how it stopped resembling the thing it was previewing. */
#tab-team-clients .tc2-cmp-mail{border:1px solid var(--tc-bdr);border-top:none;border-radius:0 0 var(--tc-r) var(--tc-r);background:#fff;padding:0 0 18px;max-height:52vh;overflow:auto;font-family:Figtree,'Segoe UI',Arial,sans-serif}
/* The subject, shown the way a mail client shows it — above the email, not in it. */
#tab-team-clients .tc2-cmp-mailsubj{margin:0 0 18px;padding:9px 16px;background:#f6f7fb;border-bottom:1px solid #e6e9ef;font-size:13px;color:#323338;font-weight:600;word-break:break-word}
#tab-team-clients .tc2-cmp-mailsubj::before{content:'Subject: ';color:#676879;font-weight:400}
#tab-team-clients .tc2-cmp-brandwrap{max-width:560px;margin:0 auto;padding:0 20px}
#tab-team-clients .tc2-cmp-brand{padding:0}
#tab-team-clients .tc2-cmp-brand-s{font-size:16px;font-weight:700;letter-spacing:.05em;color:#676879;line-height:1.35;margin:0 0 6px}
#tab-team-clients .tc2-cmp-brand-n{font-size:24px;font-weight:700;color:#323338;line-height:1.25;margin:0 0 10px}
#tab-team-clients .tc2-cmp-mailbd{max-width:560px;margin:0 auto;padding:0 20px}
/* The editable middle. Sits flush in the email with no frame of its own until it
   is focused, so it reads as part of the document rather than a form field. */
/* The box the typed message sits in, labelled with who wrote it — a copy of
   staffMessageHtml() in client-mail.js (owner request 2026-10-22: a staffer's
   message must be labelled with their name, bold, and plainly theirs). */
#tab-team-clients .tc2-cmp-msgbox{margin:0 0 22px;padding:12px 16px;background:#f6f7fb;border-left:4px solid #0073ea}
#tab-team-clients .tc2-cmp-msgbox.is-green{border-left-color:#00854d}
#tab-team-clients .tc2-cmp-msgfrom{margin:0 0 6px;font-size:13px;font-weight:700;color:#323338;line-height:1.4}
#tab-team-clients .tc2-cmp-editor{min-height:110px;padding:8px 10px;margin:0 -10px;border:1px dashed transparent;border-radius:6px;background:transparent;color:#323338;font-family:Figtree,'Segoe UI',Arial,sans-serif;font-size:14px;font-weight:600;line-height:1.6;outline:none}
#tab-team-clients .tc2-cmp-editor:hover{border-color:#dbe3ee}
#tab-team-clients .tc2-cmp-editor:focus{border-color:var(--tc-brand);border-style:solid;box-shadow:0 0 0 2px rgba(0,115,234,.12);background:#fff}
#tab-team-clients .tc2-cmp-editor p{margin:0 0 10px}
#tab-team-clients .tc2-cmp-editor ul,#tab-team-clients .tc2-cmp-editor ol{margin:0 0 10px;padding-left:22px}
#tab-team-clients .tc2-cmp-editor a{color:#0073ea}
/* The server-built rows below the message. Not editable, and they must not look
   editable — but they are shown, because the whole point is that the sender can
   see the link is going out. */
#tab-team-clients .tc2-cmp-mailtbl{width:100%;border-collapse:collapse;margin:0 0 22px}
#tab-team-clients .tc2-cmp-mailtbl-l{padding:6px 14px 6px 0;color:#676879;font-size:13px;width:34%;vertical-align:top}
#tab-team-clients .tc2-cmp-mailtbl-v{padding:6px 0;color:#323338;font-size:13px;font-weight:600;vertical-align:top;word-break:break-word}
#tab-team-clients .tc2-cmp-mailtbl-v a{color:#0073ea;text-decoration:underline}
#tab-team-clients .tc2-cmp-mailcta{margin:0 0 4px}
#tab-team-clients .tc2-cmp-mailcta span{display:inline-block;background:#0073ea;color:#fff;border-radius:5px;padding:11px 20px;font-size:14px;font-weight:600}
#tab-team-clients .tc2-cmp-mailcta.is-green span{background:#00854d}
#tab-team-clients .tc2-cmp-mailfoot{font-size:11.5px;color:#9699a6;margin:18px 0 0;line-height:1.5}
#tab-team-clients .tc2-cmp-locknote{max-width:560px;margin:12px auto 0;font-size:11px;line-height:1.5;color:var(--tc-t4)}
/* ── The compose window, wide (owner request 2026-10-21) ────────────────────
   Stacked in one 660px column, the window was taller than the screen: the email
   preview pushed Attachments and Send off the bottom, and every hand-off meant
   scrolling the window several times before it could be sent. On a desktop
   screen it is now two columns — who it goes to, the subject and the
   attachments on the left, the email on the right — and the preview is sized to
   what is left of the screen, so everything including Send is visible the
   moment it opens. Phones and narrow windows keep the single column. */
@media (min-width:1000px){
  #tab-team-clients .tc2-modal.tc2-cmp-modal{max-width:1280px;max-height:94vh;display:grid;column-gap:24px;align-content:start;
    grid-template-columns:minmax(300px,380px) minmax(0,1fr);
    grid-template-areas:"title title" "sub sub" "addr mail" "subj mail" "att mail" "rest mail" "err err" "state state" "act act";
    grid-template-rows:auto auto auto auto auto 1fr auto auto auto}
  #tab-team-clients .tc2-cmp-modal > h3{grid-area:title}
  #tab-team-clients .tc2-cmp-modal > #tc2-compose-sub{grid-area:sub}
  #tab-team-clients .tc2-cmp-modal > .tc2-cmp-addr{grid-area:addr}
  #tab-team-clients .tc2-cmp-modal > .tc2-cmp-f-subj{grid-area:subj}
  #tab-team-clients .tc2-cmp-modal > .tc2-cmp-f-att{grid-area:att}
  #tab-team-clients .tc2-cmp-modal > .tc2-cmp-f-mail{grid-area:mail;margin-bottom:0;min-width:0}
  #tab-team-clients .tc2-cmp-modal > #tc2-compose-err{grid-area:err}
  #tab-team-clients .tc2-cmp-modal > #tc2-compose-state{grid-area:state}
  #tab-team-clients .tc2-cmp-modal > .tc2-modal-actions{grid-area:act}
  /* The preview takes whatever height the screen has left after the title, the
     toolbar and the buttons — never so much that Send drops out of view. */
  #tab-team-clients .tc2-cmp-modal .tc2-cmp-mail{max-height:max(280px,calc(94vh - 250px))}
}
#tab-team-clients .tc2-cmp-attbar{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}
#tab-team-clients .tc2-cmp-att{display:flex;align-items:center;gap:8px;padding:6px 8px;border:1px solid var(--tc-bdr2);border-radius:5px;margin-bottom:5px;font-size:12px;background:var(--tc-surface)}
#tab-team-clients .tc2-cmp-att.is-auto{background:var(--tc-surface-2);color:var(--tc-t3)}
#tab-team-clients .tc2-cmp-att-name{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#tab-team-clients .tc2-cmp-att-meta{flex:0 0 auto;font-size:11px;color:var(--tc-t4)}
#tab-team-clients .tc2-cmp-pick{display:flex;align-items:center;gap:8px;padding:5px 8px;border-bottom:1px solid var(--tc-bdr2);font-size:12px;cursor:pointer}
#tab-team-clients .tc2-cmp-pick:hover{background:var(--tc-hov)}
#tab-team-clients #tc2-compose-picker{margin-top:8px;border:1px solid var(--tc-bdr2);border-radius:5px;max-height:180px;overflow:auto}
@media (max-width:640px){
  #tab-team-clients .tc2-cmp-row{flex-wrap:wrap}
  #tab-team-clients #tc2-compose-body{min-height:150px}
}
/* Monthly report */
#tab-team-clients .tc2-rep-tbl{width:100%;border-collapse:collapse;font-size:12.5px}
#tab-team-clients .tc2-rep-tbl th{text-align:left;padding:8px 9px;background:var(--tc-surface-2);border-bottom:1.5px solid var(--tc-bdr2);font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--tc-t4)}
#tab-team-clients .tc2-rep-tbl td{padding:7px 9px;border-bottom:1px solid var(--tc-bdr2);vertical-align:top;color:var(--tc-t2)}
#tab-team-clients .tc2-rep-month-row td{background:var(--tc-brand);color:#fff;font-weight:800;font-size:11px;text-transform:uppercase;letter-spacing:.04em}
#tab-team-clients .tc2-rep-section-row td{background:var(--tc-brand-bg);color:var(--tc-brand-h);font-weight:800;font-size:11px;text-transform:uppercase;letter-spacing:.04em}
#tab-team-clients .tc2-rep-meta{font-size:12px;color:var(--tc-t4);margin-top:8px}
@media(max-width:640px){#tab-team-clients .tc2-grid2{grid-template-columns:1fr}#tab-team-clients .tc2-search{min-width:150px;flex:1}}
/* Per-client discussion panel — same slide-in-from-right shape/interaction as
   the Claude side panel (.pa-panel), re-themed with this tab's own (light
   Fluent 2) colors instead of that panel's dark glass. */
#tab-team-clients .tc2-chat-ov{justify-content:flex-end;padding:0;align-items:stretch}
#tab-team-clients .tc2-chat-panel{width:min(420px,100vw);height:100%;background:var(--tc-surface);box-shadow:var(--tc-shm);display:flex;flex-direction:column;transform:translateX(102%);transition:transform .22s ease}
#tab-team-clients .tc2-chat-ov.open .tc2-chat-panel{transform:translateX(0)}
#tab-team-clients .tc2-chat-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:16px 18px;border-bottom:1px solid var(--tc-bdr2);background:var(--tc-surface-2)}
#tab-team-clients .tc2-chat-title{font-size:15px;font-weight:700;color:var(--tc-t1)}
#tab-team-clients .tc2-chat-sub{font-size:11.5px;color:var(--tc-t3);margin-top:3px;max-width:300px;line-height:1.4}
#tab-team-clients .tc2-chat-close{border:none;background:transparent;color:var(--tc-t4);font-size:16px;cursor:pointer;line-height:1;padding:4px}
#tab-team-clients .tc2-chat-close:hover{color:var(--tc-crit)}
#tab-team-clients .tc2-chat-msgs{flex:1;overflow-y:auto;padding:16px 18px;display:flex;flex-direction:column;gap:12px;background:var(--tc-bg)}
#tab-team-clients .tc2-chat-msg{display:flex;flex-direction:column;align-items:flex-start;max-width:88%}
#tab-team-clients .tc2-chat-msg.own{align-items:flex-end;align-self:flex-end}
#tab-team-clients .tc2-chat-meta{font-size:10.5px;color:var(--tc-t4);margin-bottom:3px;padding:0 2px}
#tab-team-clients .tc2-chat-bubble{background:var(--tc-surface);border:1px solid var(--tc-bdr2);border-radius:12px;padding:8px 12px;font-size:13px;color:var(--tc-t1);line-height:1.45;box-shadow:var(--tc-sh);overflow-wrap:anywhere;white-space:pre-wrap}
#tab-team-clients .tc2-chat-msg.own .tc2-chat-bubble{background:var(--tc-brand);border-color:var(--tc-brand);color:#fff}
#tab-team-clients .tc2-chat-composer{display:flex;gap:8px;padding:12px 14px;border-top:1px solid var(--tc-bdr2);background:var(--tc-surface)}
#tab-team-clients .tc2-chat-input{flex:1;resize:none;border:1px solid var(--tc-bdr);border-radius:var(--tc-r);padding:8px 10px;font-family:inherit;font-size:13px;background:var(--tc-surface);color:var(--tc-t1)}
#tab-team-clients .tc2-chat-input:focus{outline:2px solid var(--tc-brand);outline-offset:-1px}
#tab-team-clients .tc2-chat-send{align-self:flex-end;height:36px;padding:0 16px;border:none;border-radius:var(--tc-r);background:var(--tc-brand);color:#fff;font-weight:700;font-size:12.5px;cursor:pointer}
#tab-team-clients .tc2-chat-send:hover{background:var(--tc-brand-h)}
#tab-team-clients .tc2-chat-send:disabled{opacity:.5;cursor:default}
@media(max-width:480px){#tab-team-clients .tc2-chat-panel{width:100vw}}

/* ═══════════════════════════════════════════════════════════════════════════
 * MONDAY.COM BOARD MIRROR  (.mnb-*)
 * ---------------------------------------------------------------------------
 * The Client Renewals is a visual mirror of the firm's Monday.com "Client Renewals"
 * board, so the team sees the same thing in both tools while the two-way sync
 * (see docs/monday-sync.md) is stood up. Everything here is measured against
 * that board: 36px rows, 1px #e6e9ef grid, full-bleed status cells, circular
 * person avatars, sticky checkbox + Client columns, colored group bar.
 *
 * Kept in its own .mnb- namespace rather than restyling .tc2-* because the
 * modals, History tab and Monthly Report still use the Fluent 2 look and
 * should not inherit board styling.
 * ═══════════════════════════════════════════════════════════════════════════ */
.mnb-board .mnb{background:var(--mn-surface);color:var(--mn-text);font-size:13px}
.mnb-board .mnb-page{padding:0 0 60px}

/* ── Board header: title, view tabs, toolbar ─────────────────────────────── */
/* The header band and the toolbar read as one bordered card above the board.
   They sit in different parents, so they're joined by matching side margins
   with the shared edge suppressed. */
.mnb-board .mnb-head{padding:14px 18px 12px;margin:10px 16px 0;background:var(--mn-surface);border:1px solid var(--mn-line-2);border-bottom:none;border-radius:10px 10px 0 0;box-shadow:0 1px 2px rgba(50,51,56,.05)}
.mnb-board .mnb-sub{font-size:12px;color:var(--mn-text-2);margin-top:2px}
/* ── Board header (#tab-team-clients only), redesigned 2026-10-21 ─────────
   The Meeting Tracker's 2026-10-18 shape: row 1 is WHERE you are (the title
   is the board switcher, the tracking numbers sit beside it as one slim line,
   Views ▾ on the right), row 2 — each board's .mnb-toolbar — is what you can
   DO (New client ▾, search, Filters ▾, Tools ▾, refresh). About 20 visible
   controls became 8 and the band ~70px shorter.
   Scoped to this tab on purpose: the same .mnb-* rules dress the Request Form
   Tracker, which must not move. Menus are .tch-* so nothing here can leak into
   the Meeting Tracker's .mt-menu either.
   Collapsing (.tc2-head-off on the page wrapper, tcToggleHead) now hides only
   the numbers: the switcher and Views stay, so the way to the other board,
   Notifications, Report and Activity can never go missing (owner 2026-09-25). */
#tab-team-clients .mnb-head{padding:10px 14px 9px 16px}
#tab-team-clients .tch-row{display:flex;align-items:center;gap:6px 14px;flex-wrap:wrap;min-height:36px}
#tab-team-clients .tch-menu{position:relative;display:inline-flex;align-items:stretch}
#tab-team-clients .tch-menu.tc2-colmenu{display:inline-flex}
#tab-team-clients .tch-title{margin:0;font:inherit;display:flex}
#tab-team-clients .tch-board-btn{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 8px;margin-left:-8px;border:0;border-radius:8px;background:transparent;color:var(--mn-text);font-family:inherit;font-size:20px;font-weight:700;letter-spacing:-.2px;line-height:1;white-space:nowrap;cursor:pointer}
#tab-team-clients .tch-board-btn:hover,#tab-team-clients .tch-menu.open .tch-board-btn{background:var(--mn-hover)}
#tab-team-clients .tch-chev{width:14px;height:14px;flex-shrink:0;color:var(--mn-text-3);transition:transform .15s ease}
#tab-team-clients .tch-board-btn .tch-chev{width:17px;height:17px}
#tab-team-clients .tch-menu.open > :is(button,.tch-title) .tch-chev{transform:rotate(180deg)}
#tab-team-clients .tch-ico{width:15px;height:15px;flex-shrink:0;color:var(--mn-text-2)}

/* The tracking numbers: one line of buttons. Pressing one narrows the board to
   those clients (tcKpiPick); the pressed one is tinted in its own colour. The
   first number shows everything again and is never drawn pressed. Number
   colours are the darker shades of the board palette, so each passes text
   contrast on white at this size (the palette's own red and green do not). */
#tab-team-clients .mnb-kpis{display:flex;align-items:center;flex-wrap:wrap;gap:2px;flex:1 1 auto;min-width:0;margin:0;padding-left:12px;border-left:1px solid var(--mn-line-2)}
#tab-team-clients .mnb-kpis:empty{display:none}
#tab-team-clients .mnb-kpi{display:inline-flex;align-items:baseline;gap:5px;height:30px;padding:0 10px;border:1px solid transparent;border-radius:999px;background:transparent;font-family:inherit;white-space:nowrap;cursor:pointer;transition:background .12s ease,border-color .12s ease}
#tab-team-clients .mnb-kpi:hover{background:var(--mn-hover)}
#tab-team-clients .mnb-kpi-v{font-size:16px;font-weight:700;line-height:28px;font-variant-numeric:tabular-nums;color:var(--mn-primary)}
#tab-team-clients .mnb-kpi-n{font-size:13px;color:var(--mn-text-2)}
#tab-team-clients .mnb-kpi.k-warn .mnb-kpi-v{color:#a35f00}
#tab-team-clients .mnb-kpi.k-crit .mnb-kpi-v{color:#c62a43}
#tab-team-clients .mnb-kpi.k-ok .mnb-kpi-v{color:#08784a}
#tab-team-clients .mnb-kpi[aria-pressed="true"]{background:#eaf3fe;border-color:#b9d7fb}
#tab-team-clients .mnb-kpi.k-warn[aria-pressed="true"]{background:#fff4e3;border-color:#f3c98b}
#tab-team-clients .mnb-kpi.k-crit[aria-pressed="true"]{background:#fdecef;border-color:#f2b3bd}
#tab-team-clients .mnb-kpi.k-ok[aria-pressed="true"]{background:#e7f7ef;border-color:#a9dfc4}
#tab-team-clients .mnb-kpi[aria-pressed="true"] .mnb-kpi-n{color:var(--mn-text);font-weight:600}

#tab-team-clients .tch-row-end{display:flex;align-items:center;gap:6px;margin-left:auto}
#tab-team-clients .tch-btn{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 8px 0 10px;box-sizing:border-box;border:1px solid var(--mn-line-2);border-radius:6px;background:var(--mn-surface);color:var(--mn-text);font-family:inherit;font-size:13px;font-weight:500;line-height:1;white-space:nowrap;cursor:pointer;box-shadow:0 1px 2px rgba(16,24,40,.05);transition:background .12s ease}
#tab-team-clients .tch-btn:hover{background:var(--mn-hover)}
#tab-team-clients .tch-menu.open > .tch-btn{background:#eef0f4}
#tab-team-clients .tch-refresh{width:30px;padding:0;justify-content:center;font-size:15px;color:var(--mn-text-2)}
#tab-team-clients .tch-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;box-sizing:border-box;border-radius:999px;background:var(--mn-primary);color:#fff;font-size:11px;font-weight:700;font-variant-numeric:tabular-nums}
#tab-team-clients .tch-badge[hidden]{display:none}
#tab-team-clients .tch-filters-btn.has-active .tch-ico{color:var(--mn-primary)}

#tab-team-clients .mnb-head-toggle{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;box-sizing:border-box;border:1px solid var(--mn-line-2);border-radius:6px;background:var(--mn-surface);color:var(--mn-text-2);font-family:inherit;font-size:12px;line-height:1;white-space:nowrap;cursor:pointer}
#tab-team-clients .mnb-head-toggle:hover{background:var(--mn-hover);color:var(--mn-text)}
#tab-team-clients .mnb-ht-show{display:none}
#tab-team-clients .tc2-page.tc2-head-off .mnb-kpis{display:none}
#tab-team-clients .tc2-page.tc2-head-off .mnb-head-toggle{width:auto;padding:0 9px}
#tab-team-clients .tc2-page.tc2-head-off .mnb-ht-hide{display:none}
#tab-team-clients .tc2-page.tc2-head-off .mnb-ht-show{display:inline}

/* Menus */
#tab-team-clients .tch-drop{display:none;position:absolute;top:calc(100% + 6px);left:0;z-index:60;min-width:240px;padding:6px;box-sizing:border-box;border:1px solid var(--mn-line);border-radius:12px;background:#fff;box-shadow:0 12px 32px rgba(16,24,40,.14),0 2px 6px rgba(16,24,40,.06);text-align:left}
#tab-team-clients .tch-menu.open .tch-drop{display:block}
#tab-team-clients .tch-drop-right,#tab-team-clients .tch-drop.tch-drop-flip{left:auto;right:0}
#tab-team-clients .tch-menu-hd{padding:8px 10px 4px;color:var(--mn-text-2);font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase}
#tab-team-clients .tch-item{display:flex;align-items:center;gap:10px;width:100%;min-height:34px;padding:7px 10px;box-sizing:border-box;border:0;border-radius:8px;background:transparent;color:var(--mn-text);font-family:inherit;font-size:13px;font-weight:500;text-align:left;cursor:pointer}
#tab-team-clients .tch-item:hover{background:var(--mn-hover)}
#tab-team-clients .tch-item.active{background:#eaf3fe;color:#0b4f9c;font-weight:600}
#tab-team-clients .tch-item.active::after{content:'✓';margin-left:auto;padding-left:8px;color:var(--mn-primary)}
#tab-team-clients .tch-mi-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
#tab-team-clients .tch-mi-txt small{color:var(--mn-text-2);font-size:11.5px;font-weight:400}
#tab-team-clients .tch-item.active .tch-mi-txt small{color:#4f73a6}
#tab-team-clients :is(.tch-board-btn,.tch-btn,.tch-item,.mnb-kpi,.mnb-head-toggle,.tch-fp-tab,.tch-fp-clear):focus-visible{outline:2px solid var(--mn-primary);outline-offset:1px}
#tab-team-clients .tch-item:focus-visible{outline-offset:-2px}

/* New client ▾ — the split button now hosts a menu, so it can no longer clip
   its children; the two halves round their own outer corners instead. */
#tab-team-clients .mnb-new{overflow:visible;margin-right:2px}
#tab-team-clients .mnb-new-main{border-radius:6px 0 0 6px}
#tab-team-clients .mnb-new-caret{border-radius:0 6px 6px 0;cursor:pointer}

/* Filters ▾ — a panel: Filters | Columns tabs, then a footer that says what
   is narrowing the board and clears it. The column list is the same element
   (#tc2-colmenu-panel / #tc2-lc-colmenu-panel) the old Hide button opened,
   drawn flat inside the pane rather than as its own floating box. */
#tab-team-clients .tch-filters-drop{width:320px;padding:0;overflow:hidden}
#tab-team-clients .tch-fp-tabs{display:flex;gap:2px;padding:4px 10px 0;border-bottom:1px solid var(--mn-line)}
#tab-team-clients .tch-fp-tab{position:relative;padding:10px 8px 11px;border:0;background:none;color:var(--mn-text-2);font-family:inherit;font-size:13px;font-weight:500;cursor:pointer}
#tab-team-clients .tch-fp-tab:hover{color:var(--mn-text)}
#tab-team-clients .tch-fp-tab.on{color:var(--mn-text);font-weight:600}
#tab-team-clients .tch-fp-tab.on::after{content:'';position:absolute;left:6px;right:6px;bottom:-1px;height:2px;border-radius:2px;background:var(--mn-primary)}
#tab-team-clients .tch-fp-pane{max-height:min(460px,62vh);overflow:auto;overscroll-behavior:contain;padding:14px 16px 10px}
#tab-team-clients .tch-fp-pane[hidden]{display:none}
#tab-team-clients .tch-fp-sec{display:block}
#tab-team-clients .tch-fp-sec + .tch-fp-sec{margin-top:14px}
#tab-team-clients .tch-fp-label{display:block;margin-bottom:6px;color:var(--mn-text);font-size:12px;font-weight:600}
#tab-team-clients .tch-fp-sec .mnb-sel{width:100%;max-width:none;height:32px;color:var(--mn-text)}
#tab-team-clients .tch-fp-pane .tc2-colmenu-panel{position:static;min-width:0;padding:0;border:0;border-radius:0;box-shadow:none;background:transparent}
#tab-team-clients .tch-fp-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 12px 9px 16px;border-top:1px solid var(--mn-line);background:#fafbfc}
#tab-team-clients .tch-fp-summary{color:var(--mn-text-2);font-size:12px;min-width:0}
#tab-team-clients .tch-fp-clear{flex-shrink:0;height:28px;padding:0 10px;border:0;border-radius:6px;background:transparent;color:#0b4f9c;font-family:inherit;font-size:12.5px;font-weight:600;cursor:pointer}
#tab-team-clients .tch-fp-clear:hover{background:#eaf3fe}

/* Row 2 */
#tab-team-clients .mnb-toolbar{gap:8px;padding:8px 14px}
#tab-team-clients .mnb-toolbar .mnb-search-wrap{flex:0 1 280px;min-width:160px;height:30px;box-sizing:border-box}
#tab-team-clients .mnb-toolbar .mnb-search{width:100%;min-width:0}
#tab-team-clients .mnb-toolbar .tch-refresh{margin-left:auto}

/* Phones: menus open as a sheet along the bottom of the screen, like the
   Meeting Tracker's. */
@media(max-width:599px){
  #tab-team-clients .tch-drop,#tab-team-clients .tch-filters-drop{position:fixed;top:auto;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom,0px));width:auto;min-width:0;max-height:72vh;overflow:auto;z-index:1200}
  #tab-team-clients .tch-filters-drop{display:none;flex-direction:column}
  #tab-team-clients .tch-menu.open .tch-filters-drop{display:flex}
  #tab-team-clients .tch-filters-drop .tch-fp-pane{max-height:none;flex:1 1 auto}
}

.mnb-board .mnb-toolbar{display:flex;align-items:center;gap:6px 8px;padding:9px 14px;flex-wrap:wrap;margin:0 16px 10px;background:var(--mn-surface);border:1px solid var(--mn-line-2);border-top:1px solid var(--mn-line);border-radius:0 0 10px 10px;box-shadow:0 1px 2px rgba(50,51,56,.05)}
.mnb-board .mnb-tb{display:inline-flex;align-items:center;gap:5px;height:30px;padding:0 9px;border:1px solid var(--mn-line);background:var(--mn-surface);border-radius:5px;font-size:13px;color:var(--mn-text-2);white-space:nowrap}
.mnb-board .mnb-tb:hover{background:var(--mn-hover);color:var(--mn-text);border-color:var(--mn-line-2)}
.mnb-board .mnb-tb.on{background:var(--mn-selected);color:var(--mn-text)}
.mnb-board .mnb-tb-ico{font-size:13px;opacity:.75}
/* Monday's primary split-button */
.mnb-board .mnb-new{display:inline-flex;align-items:stretch;border-radius:4px;overflow:hidden;margin-right:6px}
.mnb-board .mnb-new-main{border:none;background:var(--mn-primary);color:#fff;height:30px;padding:0 13px;font-size:13px;font-weight:400;font-family:inherit}
.mnb-board .mnb-new-main:hover{background:var(--mn-primary-h)}
.mnb-board .mnb-new-caret{border:none;border-left:1px solid rgba(255,255,255,.28);background:var(--mn-primary);color:#fff;width:25px;font-size:10px}
.mnb-board .mnb-new-caret:hover{background:var(--mn-primary-h)}
.mnb-board .mnb-search-wrap{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 9px;border:1px solid var(--mn-line);background:var(--mn-surface);border-radius:5px}
.mnb-board .mnb-search-wrap:hover,#tab-team-clients .mnb-search-wrap:focus-within{background:var(--mn-hover)}
.mnb-board .mnb-search{border:none;background:transparent;font-family:inherit;font-size:13px;color:var(--mn-text);width:140px;outline:none}
.mnb-board .mnb-search::placeholder{color:var(--mn-text-2)}
.mnb-board .mnb-sel{height:30px;border:1px solid var(--mn-line);background:var(--mn-surface);font-family:inherit;font-size:13px;color:var(--mn-text-2);border-radius:5px;padding:0 6px;max-width:180px}
.mnb-board .mnb-sel:hover{background:var(--mn-hover);border-color:var(--mn-line-2)}
.mnb-board .mnb-spacer{flex:1}

/* ── Group section ───────────────────────────────────────────────────────── */
/* ── Top horizontal scrollbar ────────────────────────────────────────────────
 * A scroll container's own horizontal bar only ever sits on its bottom edge,
 * so with a tall board you must travel to the bottom to pan sideways. This is
 * a proxy: an empty overflow-x box above the board whose spacer is held at the
 * board's scrollWidth, with scrollLeft mirrored both ways by _wireTopScroll().
 * The pure-CSS alternative (rotateX(180deg) on the box, un-flipped inside)
 * creates a containing block and breaks the sticky headers.
 * Hidden until the sync is live, so it never shows an inert bar. */
.mnb-board .mnb-hbar{display:none;height:24px;overflow-x:scroll;overflow-y:hidden;margin:0 16px 4px}
.mnb-board .mnb-hbar > div{height:1px}
.mnb-board .mnb-hbar::-webkit-scrollbar{height:24px}
.mnb-board .mnb-hbar::-webkit-scrollbar-track{background:#f1f3f8;border-radius:10px}
.mnb-board .mnb-hbar::-webkit-scrollbar-thumb{background:#98a1ba;border-radius:10px;border:4px solid #f1f3f8;min-width:40px}
.mnb-board .mnb-hbar::-webkit-scrollbar-thumb:hover{background:#7d87a3}


#tab-team-clients .tc2-colmenu-modes{display:flex;gap:3px;padding:4px;margin:-4px -2px 4px;background:var(--mn-hover);border-radius:6px}
#tab-team-clients .tc2-colmenu-mode{flex:1;border:none;background:transparent;border-radius:5px;padding:5px 6px;font-family:inherit;font-size:11.5px;font-weight:600;color:var(--mn-text-2)}
#tab-team-clients .tc2-colmenu-mode.on{background:#fff;color:var(--mn-primary);box-shadow:0 1px 2px rgba(50,51,56,.12)}
#tab-team-clients .tc2-colmenu-team{margin-left:auto;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--mn-primary);background:#e5f0fb;border-radius:3px;padding:1px 4px}
#tab-team-clients .tc2-colmenu-item{justify-content:flex-start}

/* ── Updates box + open-client affordance ────────────────────────────────────
   Monday puts the conversation in its own narrow column as a small bordered
   box carrying the thread count, and reveals an expand control on row hover. */
.mnb-board td.mnb-upd{padding:0;text-align:center}
.mnb-board .mnb-updbox{display:inline-flex;align-items:center;justify-content:center;gap:2px;height:20px;min-width:26px;padding:0 5px;border:1px solid var(--mn-line-2);border-radius:4px;background:var(--mn-surface);color:var(--mn-text-3)}
.mnb-board .mnb-updbox:hover{border-color:var(--mn-primary);color:var(--mn-primary)}
.mnb-board .mnb-updbox.has{color:var(--mn-primary);border-color:#c9dfff;background:#f0f7ff}
.mnb-board .mnb-updbox svg{display:block;width:12px;height:12px}
.mnb-board .mnb-updbox-n{font-size:10px;font-weight:700;line-height:1}
.mnb-board .mnb-open{border:none;background:transparent;color:var(--mn-text-3);font-size:12px;padding:1px 4px;border-radius:3px;flex:none;opacity:0;margin-left:auto}
.mnb-board .mnb-tbl tbody tr:hover .mnb-open{opacity:1}
.mnb-board .mnb-open:hover{background:var(--mn-line);color:var(--mn-primary)}

/* ── Client panel tabs (Updates · Files · Activity) ─────────────────────────── */
#tab-team-clients .tc2-panel-tabs{display:flex;gap:2px;padding:0 14px;border-bottom:1px solid var(--tc-bdr2);background:var(--tc-surface)}
#tab-team-clients .tc2-panel-tab{border:none;background:transparent;padding:9px 10px;font-family:inherit;font-size:12.5px;color:var(--tc-t3);border-bottom:2px solid transparent;margin-bottom:-1px}
#tab-team-clients .tc2-panel-tab:hover{color:var(--tc-t1)}
#tab-team-clients .tc2-panel-tab.active{color:var(--tc-brand);font-weight:700;border-bottom-color:var(--tc-brand)}
#tab-team-clients .tc2-panel-body{flex:1;overflow-y:auto;padding:14px 16px;background:var(--tc-bg)}
#tab-team-clients .tc2-panel-empty{padding:24px 6px;text-align:center;color:var(--tc-t3);font-size:12.5px}
#tab-team-clients .tc2-panel-upload{display:inline-flex;align-items:center;height:30px;padding:0 12px;border-radius:6px;background:var(--tc-brand);color:#fff;font-size:12.5px;font-weight:700;cursor:pointer;margin-bottom:10px}
#tab-team-clients .tc2-panel-files{display:flex;flex-direction:column;gap:6px}
#tab-team-clients .tc2-panel-file{display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 8px;padding:8px 10px;background:var(--tc-surface);border:1px solid var(--tc-bdr2);border-radius:6px}
#tab-team-clients .tc2-panel-file a{grid-column:1;color:var(--tc-brand);text-decoration:none;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#tab-team-clients .tc2-panel-file-meta{grid-column:1;font-size:11px;color:var(--tc-t4)}
#tab-team-clients .tc2-panel-file-del{grid-column:2;grid-row:1 / span 2;border:none;background:transparent;color:var(--tc-t4);font-size:12px;line-height:1;height:24px;min-width:24px;padding:0;border-radius:4px;cursor:pointer}
#tab-team-clients .tc2-panel-file-del:hover{background:#ffe3e6;color:#d83a52}
/* Per-stage timing table at the top of the Activity tab (see _stageBreakdownHtml).
   Read-only, three columns: stage · working days · the span it covers. */
#tab-team-clients .tc2-panel-stages{border:1px solid var(--tc-bdr2);border-radius:6px;background:var(--tc-surface);padding:4px 0;margin-bottom:12px}
#tab-team-clients .tc2-panel-stages-hd{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:5px 10px 7px;font-size:12px;font-weight:700;color:var(--tc-t1);border-bottom:1px solid var(--tc-bdr2)}
#tab-team-clients .tc2-panel-stages-hd span{font-weight:400;font-size:10.5px;color:var(--tc-t4);white-space:nowrap}
#tab-team-clients .tc2-panel-stage{display:grid;grid-template-columns:1fr auto minmax(0,auto);align-items:baseline;gap:10px;padding:5px 10px;font-size:12px;color:var(--tc-t2)}
#tab-team-clients .tc2-panel-stage b{font-variant-numeric:tabular-nums;font-feature-settings:"tnum";font-size:13px;color:var(--tc-t1);text-align:right;min-width:2.2em}
#tab-team-clients .tc2-panel-stage em{font-style:normal;font-size:11px;color:var(--tc-t4);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#tab-team-clients .tc2-panel-stage.is-open b{color:var(--tc-brand)}
#tab-team-clients .tc2-panel-stage.is-total{border-top:1px solid var(--tc-bdr2);margin-top:2px;padding-top:7px;font-weight:700;color:var(--tc-t1)}
#tab-team-clients .tc2-panel-act{padding:8px 10px;background:var(--tc-surface);border:1px solid var(--tc-bdr2);border-radius:6px;margin-bottom:6px}
#tab-team-clients .tc2-panel-act-hd{display:flex;justify-content:space-between;gap:8px;font-size:12.5px;color:var(--tc-t1)}
#tab-team-clients .tc2-panel-act-hd span{color:var(--tc-t4);font-size:11px;white-space:nowrap}
#tab-team-clients .tc2-panel-act-detail{font-size:12px;color:var(--tc-t3);margin-top:3px;overflow-wrap:anywhere}
#tab-team-clients .tc2-panel-act-by{font-size:11px;color:var(--tc-t4);margin-top:3px}
/* Automated-email cards in the Updates feed, styled apart from human messages. */
#tab-team-clients .tc2-auto{align-self:stretch;background:var(--tc-surface);border:1px solid var(--tc-bdr2);border-left:3px solid #a25ddc;border-radius:8px;padding:9px 11px;font-size:12px;color:var(--tc-t2)}
#tab-team-clients .tc2-auto-hd{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-bottom:5px}
#tab-team-clients .tc2-auto-tag{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:#7e3b8a;background:#f4ebfb;border-radius:3px;padding:1px 5px}
#tab-team-clients .tc2-auto-hd span:last-child{font-size:10.5px;color:var(--tc-t4)}
#tab-team-clients .tc2-auto-kind{font-weight:700;color:var(--tc-t1);text-decoration:underline;margin-bottom:3px}
#tab-team-clients .tc2-auto-subject{font-weight:600;color:var(--tc-t1);margin-bottom:4px}
#tab-team-clients .tc2-auto-row{font-size:11.5px;margin-bottom:2px;overflow-wrap:anywhere}
#tab-team-clients .tc2-auto-body{margin-top:5px;padding-top:5px;border-top:1px solid var(--tc-bdr2);color:var(--tc-t3);overflow-wrap:anywhere}

/* ── Inline editing ──────────────────────────────────────────────────────────
   Double-clicking a name swaps it for a field in place, replacing the old
   pencil button. The dotted underline only appears on row hover so the grid
   stays quiet at rest. */
.mnb-board .mnb-editable{cursor:text}
.mnb-board .mnb-tbl tbody tr:hover .mnb-editable{text-decoration:underline dotted var(--mn-line-2);text-underline-offset:3px}
.mnb-board .mnb-inline-input{width:100%;min-width:80px;height:20px;border:1px solid var(--mn-primary);border-radius:3px;padding:0 4px;font-family:inherit;font-size:var(--mn-cell-fs);color:var(--mn-text);background:#fff;outline:none;box-shadow:0 0 0 2px rgba(0,115,234,.15)}
.mnb-board .mnb-subcount{display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:var(--mn-line);color:var(--mn-text-2);font-size:10px;font-weight:700;flex:none}
.mnb-board .mnb-expand.open{color:var(--mn-primary);opacity:1}

/* ── Subitems ────────────────────────────────────────────────────────────────
   A nested grid under an expanded client, mirroring Monday's subitems. It sits
   outside the parent colgroup on purpose, so it reads as a child table rather
   than more columns of the same board. */
.mnb-board .mnb-subrow > td{background:#f7f9fc;padding:0;border-bottom:1px solid var(--mn-line)}
.mnb-board .mnb-tbl tbody tr.mnb-subrow:hover > td{background:#f7f9fc}
.mnb-board .mnb-sub-wrap{padding:8px 10px 10px 34px}
.mnb-board .mnb-sub-tbl{border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--mn-line-2);border-radius:6px;overflow:hidden;table-layout:fixed;width:1080px;min-width:1080px}
.mnb-board .mnb-sub-tbl th{height:26px;padding:0 8px;font-size:11.5px;font-weight:600;color:var(--mn-text-2);text-align:center;white-space:nowrap;background:#eef1f7;border-bottom:1px solid var(--mn-line);border-right:1px solid var(--mn-line)}
.mnb-board .mnb-sub-tbl th:first-child{text-align:left}
.mnb-board .mnb-sub-tbl td{height:var(--mn-row-h);padding:0 8px;font-size:var(--mn-cell-fs);border-bottom:1px solid var(--mn-line);border-right:1px solid var(--mn-line);vertical-align:middle;background:#fff;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.mnb-board .mnb-sub-tbl tbody tr:last-child td{border-bottom:none}
.mnb-board .mnb-sub-tbl tbody tr:hover td{background:var(--mn-hover)}
.mnb-board .mnb-sub-tbl .mnb-sub-col-name,.mnb-board .mnb-sub-name{width:220px;text-align:left}
.mnb-board .mnb-sub-tbl .mnb-sub-col-owner{width:110px}
.mnb-board .mnb-sub-tbl .mnb-sub-col-status{width:150px}
/* The Link column absorbs the space formerly used by Approved. */
.mnb-board .mnb-sub-tbl .mnb-sub-col-link{width:280px}
.mnb-board .mnb-sub-tbl .mnb-sub-col-due{width:180px}
.mnb-board .mnb-sub-tbl .mnb-sub-col-updated{width:100px}
.mnb-board .mnb-sub-tbl .mnb-sub-col-act{width:40px}
.mnb-board .mnb-sub-meta{font-size:11px;color:var(--mn-text-3);text-align:center}
.mnb-board .mnb-sub-empty{text-align:center;color:var(--mn-text-2);height:34px}
.mnb-board .mnb-sub-wrap .mnb-add{margin-top:5px}
/* Completed renewal cycles — the second nested grid, under a client's subitems.
   monday keeps these as top-level rows in its "Client Renewed" group; Pulse
   nests them so one client stays one row. Own column widths (summing to the
   same 1080px) because eight columns at the subitem widths would overflow. */
.mnb-board .mnb-hist-hd{display:flex;align-items:center;gap:7px;margin:12px 0 5px;font-size:11.5px;font-weight:600;color:var(--mn-text-2);text-transform:uppercase;letter-spacing:.03em}
.mnb-board .mnb-hist-note{text-transform:none;letter-spacing:0;font-weight:400;color:var(--mn-text-3);font-size:11px}
.mnb-board .mnb-hist-tbl .mnb-hist-col-name{width:200px}
.mnb-board .mnb-hist-tbl .mnb-hist-col-status{width:150px}
.mnb-board .mnb-hist-tbl .mnb-hist-col-life{width:160px}
.mnb-board .mnb-hist-tbl .mnb-hist-col-date{width:130px}
.mnb-board .mnb-hist-tbl .mnb-hist-col-link{width:180px}
.mnb-board .mnb-hist-tbl .mnb-hist-col-updated{width:90px}
/* Has this cycle reached monday yet? The push is debounced and budget-capped,
   so "saved in Pulse" and "on the board" are briefly different states. */
.mnb-board .mnb-hist-synced{color:var(--mn-green,#00c875);font-weight:700;margin-right:5px}
.mnb-board .mnb-hist-pending{color:var(--mn-text-3);margin-right:5px}
.mnb-board .mnb-histcount{display:inline-flex;align-items:center;gap:2px;height:16px;padding:0 5px;border-radius:8px;background:rgba(0,200,117,.14);color:#0a7a4b;font-size:10px;font-weight:700;flex:none}
.mnb-board .mnb-add-hist{margin-top:8px;display:inline-block}

/* Floating selection action bar */
.mnb-selbar{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);z-index:10040;display:flex;align-items:center;gap:6px;padding:8px 10px 8px 14px;background:#fff;border:1px solid var(--mn-line-2);border-radius:10px;box-shadow:0 8px 28px rgba(50,51,56,.24);font-size:13px;color:var(--mn-text)}
.mnb-selbar-count{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 6px;border-radius:6px;background:var(--mn-primary);color:#fff;font-weight:700}
.mnb-selbar-label{margin-right:4px;white-space:nowrap}
.mnb-selbar-sep{width:1px;height:22px;background:var(--mn-line);margin:0 2px}
.mnb-selbar-btn{display:inline-flex;align-items:center;gap:5px;height:30px;padding:0 10px;border:none;background:transparent;border-radius:6px;font-family:inherit;font-size:13px;color:var(--mn-text-2);white-space:nowrap}
.mnb-selbar-btn:hover{background:var(--mn-hover);color:var(--mn-text)}
.mnb-selbar-btn span{font-size:14px;opacity:.8}
@media(max-width:640px){.mnb-selbar{left:8px;right:8px;transform:none;justify-content:center;flex-wrap:wrap}}

/* .mnb-kpi-d is still used by the Request Form Tracker's row count. The
   Team Clients tracking numbers are styled with the board header above.*/
.mnb-board .mnb-kpi-d{font-size:12px;color:var(--mn-text-2);white-space:nowrap}
.mnb-board .mnb-group{padding:3px 0 0 16px}
.mnb-board .mnb-group-hd{display:flex;align-items:center;gap:6px;margin-bottom:6px}
.mnb-board .mnb-group-caret{border:none;background:transparent;font-size:10px;line-height:1;padding:3px;border-radius:3px}
.mnb-board .mnb-group-name{font-size:14px;font-weight:700;letter-spacing:-.1px}
.mnb-board .mnb-group-count{font-size:12px;color:var(--mn-text-2);font-weight:400}

/* ── The grid ────────────────────────────────────────────────────────────── */
/* The board scrolls inside its own box rather than with the page. A scroll
   container's horizontal bar always sits on its bottom edge, so letting the
   page own the scroll pushed that bar below the fold — you had to scroll past
   every row to reach it. Capping the height keeps both bars on screen at all
   times, and the sticky headers stay pinned while rows move under them. */
.mnb-board .mnb-scroll{overflow:auto;max-height:calc(100vh - 340px);min-height:280px;margin:0 16px;padding-right:4px;overscroll-behavior-x:contain;scrollbar-gutter:stable}
/* Deliberately no scrollbar-width/scrollbar-color: Chromium drops every
   ::-webkit-scrollbar rule on an element that sets either standard property,
   which would silently undo the sizing below. Firefox keeps its default bars. */
.mnb-board .mnb-scroll::-webkit-scrollbar{height:24px;width:24px}
.mnb-board .mnb-scroll::-webkit-scrollbar-track{background:#f1f3f8;border-radius:8px}
.mnb-board .mnb-scroll::-webkit-scrollbar-thumb{background:#98a1ba;border-radius:10px;border:4px solid #f1f3f8;min-height:40px}
.mnb-board .mnb-scroll::-webkit-scrollbar-thumb:hover{background:#7d87a3}
.mnb-board .mnb-scroll::-webkit-scrollbar-corner{background:#f1f3f8}
/* ── Team Clients: scrollbars you can actually see ───────────────────────────
 * The 24px bars declared just above were DEAD CODE on this tab, and had been
 * since the "slim professional scrollbars" pass: styles.css ends with a global
 * `:where(:not(#tab-staff-portal):not(#tab-staff-portal *)){scrollbar-width:thin}`,
 * and Chromium DROPS every ::-webkit-scrollbar rule on any element carrying a
 * non-auto standard scrollbar property. So this board rendered Chromium's 10px
 * thin bar while the byte-identical rules kept working on the Request Form
 * Tracker — which lives inside #tab-staff-portal, the one subtree that global
 * rule excludes. That is why the same CSS looked right there and wrong here.
 * `scrollbar-width:auto` on .mnb-hbar is what puts THAT element back on the
 * webkit path: it is load-bearing, not decoration, and deleting it silently
 * reverts every size below it.
 *
 * The board box goes the other way. It paints no scrollbar of its own on either
 * axis (owner request 2026-08-31) — the proxy above the grid is the only bar on
 * the tab. `scrollbar-width:none` is the standard way to say that and works in
 * Firefox as well; the ::-webkit-scrollbar 0 beside it covers Safari before
 * 18.2, which has no `scrollbar-width`. Note what that means for the global
 * thin rule: leaving it in force here would paint Chromium's 10px bar back,
 * because a non-auto standard property is exactly what disables the webkit
 * override. Either value works — what must never happen is inheriting `thin`.
 *
 * `overflow:scroll` stays. This is a HIDDEN bar, never a non-scrolling box: the
 * proxy pans the board by writing scrollLeft and the tab-wide wheel handler
 * drives scrollTop, and `overflow:hidden` would silently ignore both. It also
 * keeps clientWidth stable, so the grid does not jump when a column is toggled.
 *
 * Scoped to #tab-team-clients on purpose — the same .mnb-* rules dress the
 * Request Form Tracker, which must not move.
 */
#tab-team-clients .mnb-scroll{overflow:scroll;min-height:160px;scrollbar-width:none;scrollbar-color:auto}
#tab-team-clients .mnb-scroll::-webkit-scrollbar{height:0;width:0}
#tab-team-clients .mnb-hbar{height:16px;scrollbar-width:auto;scrollbar-color:auto}
#tab-team-clients .mnb-hbar::-webkit-scrollbar{height:16px}
#tab-team-clients .mnb-hbar::-webkit-scrollbar-track{background:#f1f3f8;border-radius:0;box-shadow:inset 0 0 0 1px #e4e8f1}
#tab-team-clients .mnb-hbar::-webkit-scrollbar-thumb{background:#b4bccd;border-radius:2px;border:2px solid #f1f3f8;min-width:48px}
#tab-team-clients .mnb-hbar::-webkit-scrollbar-thumb:hover{background:#9aa4ba}
/* The History and Monthly Changes Report tables are hit by the same global rule. */
#tab-team-clients .tc2-tbl-wrap{scrollbar-width:auto;scrollbar-color:auto}
/* Phones keep the page-length board (the cap above is lifted there), so the
   inline height _fitBoardHeight writes is cleared below 860px too. */
@media(max-width:860px){#tab-team-clients .mnb-scroll{max-height:none;min-height:0;overflow:auto}}
.mnb-board table.mnb-tbl{border-collapse:separate;border-spacing:0;font-size:13px;table-layout:fixed}

/* Header row — Monday uses normal-case 14px secondary text, not uppercase micro-caps. */
.mnb-board .mnb-tbl thead th{height:30px;padding:0 7px;font-size:12.5px;font-weight:400;color:var(--mn-text-2);text-align:center;white-space:nowrap;background:var(--mn-surface);border-bottom:1px solid var(--mn-line);border-right:1px solid var(--mn-line);position:sticky;top:0;z-index:4;user-select:none}
.mnb-board .mnb-tbl thead th.mnb-th-sort{cursor:pointer}
.mnb-board .mnb-tbl thead th.mnb-th-sort:hover{color:var(--mn-text);background:var(--mn-hover)}
.mnb-board .mnb-tbl thead th .mnb-arw{font-size:9px;opacity:0;margin-left:3px}
.mnb-board .mnb-tbl thead th.mnb-sorted .mnb-arw{opacity:1;color:var(--mn-primary)}
.mnb-board .mnb-th-ico{font-size:10px;opacity:.5;margin-left:4px}

.mnb-board .mnb-tbl td{height:var(--mn-row-h);padding:0 5px;font-size:var(--mn-cell-fs);border-bottom:1px solid var(--mn-line);border-right:1px solid var(--mn-line);vertical-align:middle;color:var(--mn-text);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;background:var(--mn-surface)}
.mnb-board .mnb-tbl tbody tr:hover td{background:var(--mn-hover)}
.mnb-board .mnb-tbl tbody tr:hover td.mnb-status{background-clip:padding-box}

/* Sticky left stack: colored group bar → checkbox → Client.
   The bar and checkbox carry max-width as well as width. Their sum is hard-coded
   as the Client column's sticky offset below (left:40px) AND as TBL_STICKY_W in
   team-clients.js, which grows the data columns to fill a wide screen and must
   leave these two alone. Change one of the three and change all three. */
.mnb-board .mnb-c-bar,#tab-team-clients .mnb-tbl th.mnb-c-bar{width:6px;min-width:6px;max-width:6px;padding:0;border-right:none;position:sticky;left:0;z-index:2}
.mnb-board .mnb-tbl tbody td.mnb-c-bar{background:var(--mn-group)}
.mnb-board .mnb-tbl tbody tr:hover td.mnb-c-bar{background:var(--mn-group)}
.mnb-board .mnb-c-chk,#tab-team-clients .mnb-tbl th.mnb-c-chk{width:34px;min-width:34px;max-width:34px;padding:0;text-align:center;position:sticky;left:6px;z-index:2;border-right:none}
/* The sticky Client column casts a shadow to its right so the columns
   scrolling underneath visibly pass behind it rather than being clipped. */
.mnb-board .mnb-c-name,#tab-team-clients .mnb-tbl th.mnb-c-name{position:sticky;left:40px;z-index:3;text-align:left;box-shadow:4px 0 7px -3px rgba(50,51,56,.22),1px 0 0 var(--mn-line)}
/* Bigger, clearer document glyph for the Signed Proposal column. */
.mnb-board .mnb-file-chip{display:inline-flex;align-items:center;gap:4px;color:var(--mn-link)}
.mnb-board .mnb-file-chip svg{display:block}
.mnb-board .mnb-file-n{font-size:12px;font-weight:700}
.mnb-board .mnb-tbl thead th.mnb-c-bar,#tab-team-clients .mnb-tbl thead th.mnb-c-bar,#tab-team-clients .mnb-tbl thead th.mnb-c-chk,#tab-team-clients .mnb-tbl thead th.mnb-c-name{z-index:6}

.mnb-board .mnb-chk{width:16px;height:16px;border:1px solid var(--mn-line-2);border-radius:3px;background:#fff;cursor:pointer;appearance:none;-webkit-appearance:none;vertical-align:middle}
.mnb-board .mnb-chk:hover{border-color:var(--mn-primary)}
.mnb-board .mnb-chk:checked{background:var(--mn-primary);border-color:var(--mn-primary)}

/* Client cell: expand chevron + name + updates bubble. */
.mnb-board .mnb-name-wrap{display:flex;align-items:center;gap:6px;min-width:0}
.mnb-board .mnb-expand{border:none;background:transparent;color:var(--mn-text-3);font-size:9px;padding:2px;border-radius:3px;line-height:1;flex:none;opacity:0}
.mnb-board .mnb-tbl tbody tr:hover .mnb-expand{opacity:1}
.mnb-board .mnb-expand:hover{background:var(--mn-line);color:var(--mn-text)}
.mnb-board .mnb-name{font-size:13px;color:var(--mn-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.mnb-board .mnb-name a{color:var(--mn-text);text-decoration:none}
.mnb-board .mnb-name a:hover{color:var(--mn-link);text-decoration:underline}
.mnb-board .mnb-rename{border:none;background:transparent;color:var(--mn-text-3);font-size:11px;padding:2px 3px;border-radius:3px;flex:none;opacity:0}
.mnb-board .mnb-tbl tbody tr:hover .mnb-rename{opacity:1}
.mnb-board .mnb-rename:hover{background:var(--mn-line);color:var(--mn-primary)}
.mnb-board .mnb-bubble{display:inline-flex;align-items:center;gap:2px;border:none;background:transparent;color:var(--mn-text-3);font-size:12px;padding:1px 4px;border-radius:11px;flex:none}
.mnb-board .mnb-bubble:hover{background:var(--mn-line);color:var(--mn-primary)}
.mnb-board .mnb-bubble.has{color:var(--mn-primary)}

/* Full-bleed status cell — the color IS the cell, edge to edge (Monday's signature). */
.mnb-board td.mnb-status{padding:0;position:relative}
/* RF's date/link cells are buttons that open the shared MT popouts. */
.mnb-board button.mnb-date{display:inline-flex;align-items:center;justify-content:center;gap:4px;width:100%;height:var(--mn-row-h);border:0;background:transparent;cursor:pointer;font:inherit}
.mnb-board button.mnb-date:hover{background:rgba(0,0,0,.03)}
.mnb-board button.mnb-cellbtn{width:100%;height:var(--mn-row-h);border:0;background:transparent;cursor:pointer;font:inherit}
.mnb-board button.mnb-cellbtn:hover{background:rgba(0,0,0,.03)}
.rf-cmte-pill{flex:none;height:18px;padding:0 7px;margin-left:6px;border:1px solid var(--mn-line-2);border-radius:9px;background:#fff;color:var(--mn-text-2);font:600 10px/1 inherit;cursor:pointer}
.rf-cmte-pill:hover{background:var(--mn-hover)}
.rf-name-input{width:100%;box-sizing:border-box}
.mnb-board .mnb-status-btn{display:block;width:100%;height:var(--mn-row-h);border:none;font-family:inherit;font-size:var(--mn-cell-fs);font-weight:500;color:#fff;text-align:center;padding:0 6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:filter .1s}
.mnb-board .mnb-status-btn:hover{filter:brightness(1.06)}
.mnb-board .mnb-status-btn:focus-visible{outline:2px solid var(--mn-text);outline-offset:-2px}
/* Display-only status pill (Client Renewals "Document Status" mirrors monday's
   read-only subitem rollup, so it has no picker). A <span>, so it needs the
   line-height the button got for free, and must not hint at being clickable. */
.mnb-board span.mnb-status-btn.is-readonly{line-height:var(--mn-row-h);cursor:default}
.mnb-board span.mnb-status-btn.is-readonly:hover{filter:none}
/* Person avatars */
.mnb-board .mnb-people{display:flex;align-items:center;justify-content:center;gap:0}
.mnb-board .mnb-av{box-sizing:border-box;width:var(--mn-av);height:var(--mn-av);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:500;color:#fff;letter-spacing:.2px;flex:none;border:2px solid var(--mn-surface);margin-left:-6px;cursor:default}
.mnb-board .mnb-av:first-child{margin-left:0}
/* Four or more people on one account: tighten the overlap so every set of
   initials still fits the column rather than pushing the cell wider. */
.mnb-board .mnb-people-tight .mnb-av{margin-left:-9px}
.mnb-board .mnb-people-tight .mnb-av:first-child{margin-left:0}
/* Hover card naming everyone in a people cell. pointer-events:none is
   load-bearing — the card is read-only and must never sit between the cursor
   and the cell button that opens the people picker. */
.mnb-board .mnb-av-pop{position:fixed;z-index:10015;display:none;pointer-events:none;background:var(--mn-surface);border:1px solid var(--mn-line-2);border-radius:8px;box-shadow:0 6px 20px rgba(50,51,56,.2);padding:6px;max-width:280px}
.mnb-board .mnb-av-pop.on{display:block}
.mnb-board .mnb-av-pop-row{display:flex;align-items:center;gap:8px;padding:3px 6px}
.mnb-board .mnb-av-pop-row .mnb-av{width:22px;height:22px;font-size:9px;border:none;margin:0;flex:none}
.mnb-board .mnb-av-pop-name{font-size:12.5px;color:var(--mn-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mnb-board .mnb-av-empty{box-sizing:border-box;width:var(--mn-av);height:var(--mn-av);border-radius:50%;border:1px solid var(--mn-line-2);display:inline-flex;align-items:center;justify-content:center;color:var(--mn-placeholder);background:transparent}
.mnb-board .mnb-bubble svg{display:block}
.mnb-board .mnb-people-btn{border:none;background:transparent;padding:0;display:flex;align-items:center;justify-content:center;width:100%;border-radius:4px}
.mnb-board .mnb-people-btn:hover{background:rgba(0,0,0,.03)}
.mnb-board .mnb-people-locked{display:flex;align-items:center;justify-content:center;width:100%;cursor:help}

/* Stage metrics (Days w/ Drafting … Days Since Started, Days in Stage). These
   mirror monday FORMULA columns: display-only, so the cell is deliberately a
   bare <td> with no button, no hover ring and no pointer — nothing here is
   clickable. tabular-nums keeps the digits column-aligned as the numbers grow. */
.mnb-board .mnb-num{text-align:right;padding:0 10px;font-variant-numeric:tabular-nums;font-feature-settings:"tnum";color:var(--mn-text);white-space:nowrap}
.mnb-board .mnb-num-empty{color:var(--mn-placeholder)}

/* Dates — Monday shows "Wed, Sep 30, 2026" centered, muted, with a hover ring. */
.mnb-board .mnb-date{display:flex;align-items:center;justify-content:center;gap:4px;width:100%;height:var(--mn-row-h);border:none;background:transparent;font-family:inherit;font-size:var(--mn-cell-fs);color:var(--mn-link);padding:0 4px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.mnb-board .mnb-date:hover{background:rgba(0,0,0,.03)}
.mnb-board .mnb-date.is-past{color:var(--mn-red);font-weight:600}
.mnb-board .mnb-date.is-soon{color:#b26b00;font-weight:600}
.mnb-board .mnb-date.is-empty{color:var(--mn-placeholder)}
.mnb-board .mnb-date-m2m{font-weight:700;color:var(--mn-primary)}
/* M2M is its own column now (2026-08-22): the date column is always a date.
   Reads as an em dash when off, so "not month-to-month" looks answered
   rather than blank. */
.mnb-board .mnb-m2m{display:block;width:100%;height:var(--mn-row-h);border:none;background:transparent;font-size:var(--mn-cell-fs);font-weight:600;color:var(--mn-text-3);text-align:center;letter-spacing:.02em}
.mnb-board .mnb-m2m:hover{background:var(--mn-hover)}
.mnb-board .mnb-m2m.is-on{color:#fff;background:var(--mn-primary);font-weight:700}
.mnb-board .mnb-m2m.is-on:hover{filter:brightness(1.07)}

/* Timeline — dark rounded bar spanning the cell */
.mnb-board td.mnb-tl{padding:0 6px}
.mnb-board .mnb-tl-bar{display:flex;align-items:center;justify-content:center;width:100%;height:19px;border:none;border-radius:10px;background:var(--mn-timeline);color:#fff;font-family:inherit;font-size:11.5px;padding:0 8px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.mnb-board .mnb-tl-bar:hover{filter:brightness(1.25)}
.mnb-board .mnb-tl-empty{display:flex;align-items:center;justify-content:center;width:100%;height:24px;border:none;border-radius:12px;background:#eceff5;color:var(--mn-placeholder);font-family:inherit;font-size:12px}
.mnb-board .mnb-tl-empty:hover{background:#e2e6ee}

/* Link / file / connect-board cells */
.mnb-board .mnb-cellbtn{display:flex;align-items:center;justify-content:center;gap:4px;width:100%;height:var(--mn-row-h);border:none;background:transparent;font-family:inherit;font-size:var(--mn-cell-fs);color:var(--mn-link);padding:0 6px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.mnb-board .mnb-cellbtn:hover{background:rgba(0,0,0,.03)}
.mnb-board .mnb-cellbtn.is-empty{color:var(--mn-placeholder)}
.mnb-board .mnb-linkcell{display:flex;align-items:center;gap:2px;width:100%;height:var(--mn-row-h);padding:0 4px 0 6px;overflow:hidden}
.mnb-board .mnb-linkcell-a{flex:1 1 auto;min-width:0;font-size:var(--mn-cell-fs);color:var(--mn-link);text-decoration:none;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.mnb-board .mnb-linkcell-a:hover,.mnb-board .mnb-linkcell-a:focus-visible{text-decoration:underline}
.mnb-board .mnb-linkcell-edit{flex:0 0 auto;border:none;background:transparent;color:var(--mn-text-2);font-size:11px;line-height:1;height:20px;min-width:20px;padding:0;border-radius:4px;opacity:.4;transition:opacity .1s}
.mnb-board tr:hover .mnb-linkcell-edit,.mnb-board .mnb-linkcell-edit:focus-visible{opacity:1}
.mnb-board .mnb-linkcell-edit:hover{background:var(--mn-line);color:var(--mn-text)}
.mnb-board .mnb-conn{display:inline-flex;align-items:center;max-width:100%;padding:2px 8px;border-radius:4px;background:#e5f4ff;color:var(--mn-link);font-size:13px;border-left:3px solid var(--mn-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mnb-board .mnb-file-chip{display:inline-flex;align-items:center;gap:4px;font-size:13px;color:var(--mn-text-2)}

/* Row actions (Chat · Edit · ✕) — revealed on hover like Monday's row menu. */
.mnb-board td.mnb-act{text-align:center}
.mnb-board .mnb-actions{display:inline-flex;align-items:center;gap:2px;opacity:.25;transition:opacity .1s}
.mnb-board .mnb-tbl tbody tr:hover .mnb-actions{opacity:1}
.mnb-board .mnb-abtn{border:none;background:transparent;color:var(--mn-text-2);font-size:12px;height:26px;min-width:26px;padding:0 6px;border-radius:4px;line-height:1}
.mnb-board .mnb-abtn:hover{background:var(--mn-line);color:var(--mn-text)}
.mnb-board .mnb-abtn.danger:hover{background:#ffe3e6;color:var(--mn-red)}

/* Add-row + empty state */
.mnb-board .mnb-addrow td{height:36px;color:var(--mn-text-3);border-right:none;border-bottom:1px solid var(--mn-line)}
.mnb-board .mnb-add{border:none;background:transparent;color:var(--mn-text-3);font-size:14px;padding:0 6px;border-radius:4px}
.mnb-board .mnb-add:hover{color:var(--mn-primary)}
.mnb-board .mnb-empty td{height:120px;text-align:center;color:var(--mn-text-2);font-size:14px}

/* ── Staff-portal overrides for the shared board layer ────────────────────────
 * The Request Form Tracker reuses .mnb-board inside #tab-staff-portal, whose
 * generic `#tab-staff-portal thead th / td / tbody tr` rules carry an ID and so
 * outrank the class-scoped board rules (1,0,2 beats 0,2,2). These restate the
 * board's own values at matching specificity; without them the grid inherits
 * the portal's navy uppercase header, zebra striping and 10px cell padding. */
#tab-staff-portal .mnb-board .mnb-tbl thead th{background:var(--mn-surface);color:var(--mn-text-2);height:30px;padding:0 8px;text-align:center;font-size:13px;font-weight:400;text-transform:none;letter-spacing:normal;border-bottom:1px solid var(--mn-line);border-right:1px solid var(--mn-line)}
#tab-staff-portal .mnb-board .mnb-tbl thead th.mnb-c-name{text-align:left}
#tab-staff-portal .mnb-board .mnb-tbl td{padding:0 5px;vertical-align:middle;line-height:normal;height:var(--mn-row-h)}
#tab-staff-portal .mnb-board .mnb-tbl tbody tr{border-bottom:none;background:transparent}
#tab-staff-portal .mnb-board .mnb-tbl tbody tr:nth-child(even){background:transparent}
#tab-staff-portal .mnb-board .mnb-tbl tbody tr:hover td{background:var(--mn-hover)}
#tab-staff-portal .mnb-board .mnb-tbl{border-collapse:separate;min-width:0}
/* The RF board owns its scroll box inside the MT pane's flex column. */
#tab-staff-portal .mnb-board .mnb-scroll{max-height:calc(100vh - 260px)}

/* Terminated: a bare red prohibition mark beside the client name, no chip
   behind it. It replaced a pink text badge that spelled the status (and once
   the end date) out — see _termBadge2. No background and no padding on purpose:
   at 13px this has to read as a mark on the row, not as a second status pill
   competing with the real full-bleed ones two columns over. flex:none because
   the name beside it is the one item in .mnb-name-wrap allowed to shrink, and
   line-height:0 keeps the inline SVG from adding a descender that would push
   the 29px row taller. No margin either: it sits immediately right of the name
   and takes the wrapper's own 6px gap, the same as every other chip in there. */
.mnb-board .mnb-term{display:inline-flex;align-items:center;line-height:0;color:var(--mn-red);flex:none}

/* ── New Client Lifecycle board: one section per Type of Client ───────────────── */
/* Each section is its own <table> with a repeated header, exactly how Monday
   renders groups. Sections sit in one .mnb-scroll so they scroll together and
   the shared fixed colgroup keeps every section's columns aligned. */
/* No padding on the scroller itself: a sticky cell pins at the scroller's padding
   edge, so a left gutter here let the scrolled columns slide through the gap
   beside the pinned colour bar. The section titles take the indent instead. */
.mnb-board #tc2-lc-board{padding-left:0}
.mnb-board #tc2-lc-groups > .mnb-group{padding-left:0;margin-bottom:22px}
.mnb-board #tc2-lc-groups > .mnb-group > .mnb-group-hd{padding-left:24px}
.mnb-board .mnb-note{padding:28px 24px;color:var(--mn-text-2);font-size:14px}
/* Group summary strip — Monday's stacked distribution bar under each group. */
.mnb-board .mnb-sumrow td{height:22px;padding:0 6px;border-bottom:none;border-right:none;background:var(--mn-surface)}
.mnb-board .mnb-tbl tbody tr.mnb-sumrow:hover td{background:var(--mn-surface)}
.mnb-board .mnb-sumbar{display:flex;width:100%;height:8px;border-radius:4px;overflow:hidden;background:var(--mn-line)}
.mnb-board .mnb-sumbar i{display:block;height:100%}
/* Free-text cell (Referrer if External) */
.mnb-board .mnb-textcell{width:100%;height:var(--mn-row-h);border:none;background:transparent;font-family:inherit;font-size:var(--mn-cell-fs);color:var(--mn-text);padding:0 8px;text-align:center}
.mnb-board .mnb-textcell:hover{background:rgba(0,0,0,.03)}
.mnb-board .mnb-textcell:focus{outline:2px solid var(--mn-primary);outline-offset:-2px;background:#fff}
.mnb-board .mnb-textcell::placeholder{color:var(--mn-placeholder)}
/* Internal Conflict Check Sent? — Monday checkbox column */
/* display:block, never the button's default inline-block: an EMPTY inline-block
   sits on the text baseline and the cell reserves descender room beneath it, so
   every row with an unticked box grew ~5px taller than its neighbours and the
   status pills showed a white band above and below (2026-09-25). */
.mnb-board .mnb-check{display:block;width:100%;height:var(--mn-row-h);border:none;background:transparent;font-size:13px;font-weight:700;color:var(--mn-green);line-height:1}
.mnb-board .mnb-check:hover{background:rgba(0,0,0,.03)}
.mnb-board .mnb-abtn.ok{color:var(--mn-green)}
.mnb-board .mnb-abtn.ok:hover{background:#d8f7e8}
/* Expanded detail row keeps the Fluent detail grid, just seated in the new grid */
.mnb-board .mnb-tbl tr.tc2-lc-detail-row > td{padding:12px 16px;background:var(--mn-hover);white-space:normal}
/* Cell editors — compact, anchored Monday-style popovers rather than page-level
   modal dialogs. One reusable shell hosts people, status, calendar and link
   editors so every interaction opens against the cell that launched it. */
.mnb-board .mnb-pop{position:fixed;z-index:10020;width:286px;background:#fff;border:1px solid #d0d4e4;border-radius:8px;box-shadow:0 6px 20px rgba(50,51,56,.2);padding:10px;color:var(--mn-text);font-size:12.5px}
.mnb-board .mnb-pop::before{content:"";position:absolute;left:calc(50% - 7px);top:-7px;width:13px;height:13px;background:#fff;border-left:1px solid #d0d4e4;border-top:1px solid #d0d4e4;transform:rotate(45deg)}
.mnb-board .mnb-pop[data-side="top"]::before{top:auto;bottom:-7px;transform:rotate(225deg)}
.mnb-board .mnb-pop-title{position:relative;font-size:14px;font-weight:600;margin:0 0 8px}
.mnb-board .mnb-pop-label{display:block;font-size:11px;color:var(--mn-text-2);margin:7px 0 3px}
.mnb-board .mnb-pop-input{width:100%;height:30px;border:1px solid #c3c6d4;border-radius:4px;padding:0 8px;font:inherit;color:var(--mn-text);outline:none;background:#fff}
.mnb-board .mnb-pop-input:focus{border-color:var(--mn-primary);box-shadow:0 0 0 1px var(--mn-primary)}
.mnb-board .mnb-pop-search{position:relative;margin-bottom:9px}
.mnb-board .mnb-pop-search .mnb-pop-input{padding-left:28px}
.mnb-board .mnb-pop-search-ico{position:absolute;left:9px;top:7px;color:var(--mn-text-3);font-size:12px;z-index:1}
.mnb-board .mnb-pop-section{font-size:11px;color:var(--mn-text-2);margin:6px 0 4px}
.mnb-board .mnb-pop-foot{margin:9px -10px -10px;padding:7px 10px;border-radius:0 0 8px 8px;background:#d7ebff;color:var(--mn-text-2);font-size:11px}

/* People picker */
.mnb-board .mnb-person-chips{display:flex;flex-wrap:wrap;gap:4px;min-height:4px;margin-bottom:8px}
.mnb-board .mnb-person-chip{display:inline-flex;align-items:center;gap:4px;height:26px;border:1px solid #c9dfff;border-radius:4px;background:#e7f2ff;padding:0 5px 0 2px;max-width:100%}
.mnb-board .mnb-person-chip .mnb-av{width:20px;height:20px;font-size:8px;border-width:1px;margin:0}
.mnb-board .mnb-person-chip-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:205px}
.mnb-board .mnb-person-chip-x{border:none;background:transparent;color:var(--mn-text-2);padding:0 1px;font-size:13px;line-height:1}
.mnb-board .mnb-person-results{max-height:178px;overflow-y:auto}
.mnb-board .mnb-person-option{display:flex;align-items:center;gap:7px;width:100%;min-height:34px;border:none;background:transparent;border-radius:4px;padding:3px 5px;text-align:left;color:var(--mn-text)}
.mnb-board .mnb-person-option:hover,#tab-team-clients .mnb-person-option.is-selected{background:#e7f2ff}
.mnb-board .mnb-person-option .mnb-av{width:22px;height:22px;font-size:8.5px;border:none;margin:0}
.mnb-board .mnb-person-option-copy{min-width:0;line-height:1.2}
.mnb-board .mnb-person-option-name{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mnb-board .mnb-person-option-role{display:block;color:var(--mn-text-2);font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Primary/Secondary slots in the Lobbyist & EVP people picker — the active slot
   is the one a clicked name gets assigned to (see _isSlottedPicker). */
.mnb-board .mnb-slot-row{display:flex;gap:6px;margin-bottom:8px}
.mnb-board .mnb-slot{position:relative;flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:2px;border:1px solid var(--mn-line-2);border-radius:6px;background:var(--mn-surface);padding:5px 18px 5px 7px;text-align:left;color:var(--mn-text)}
.mnb-board .mnb-slot:hover{background:var(--mn-hover)}
.mnb-board .mnb-slot.is-active{border-color:var(--mn-primary);background:#e7f2ff;box-shadow:0 0 0 2px rgba(0,115,234,.15)}
.mnb-board .mnb-slot-label{font-size:9px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--mn-text-2)}
.mnb-board .mnb-slot.is-active .mnb-slot-label{color:var(--mn-primary)}
.mnb-board .mnb-slot-value{display:flex;align-items:center;gap:5px;min-width:0;max-width:100%}
.mnb-board .mnb-slot-value .mnb-av{flex:0 0 auto;width:20px;height:20px;font-size:8px;border:none;margin:0}
.mnb-board .mnb-slot-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
.mnb-board .mnb-slot-none{color:var(--mn-text-3);font-size:12px;font-style:italic}
.mnb-board .mnb-slot-x{position:absolute;top:3px;right:3px;color:var(--mn-text-3);font-size:13px;line-height:1;padding:0 3px;border-radius:3px}
.mnb-board .mnb-slot-x:hover{background:#ffe0e3;color:var(--mn-red)}
.mnb-board .mnb-person-slot-tag{flex:0 0 auto;margin-left:auto;font-size:8.5px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--mn-primary);background:#e7f2ff;border:1px solid #c9dfff;border-radius:3px;padding:1px 4px}
.mnb-board .mnb-person-empty{padding:14px 5px;color:var(--mn-text-2);text-align:center}

/* Status / scope palette */
.mnb-board .mnb-label-grid{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:2px 5px 9px}
.mnb-board .mnb-label-choice{height:25px;border:none;border-radius:1px;color:#fff;font-size:11px;font-weight:500;padding:0 6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mnb-board .mnb-label-choice:hover{filter:brightness(1.08);outline:2px solid rgba(50,51,56,.16)}
.mnb-board .mnb-label-choice.is-current{outline:2px solid var(--mn-text);outline-offset:1px}
/* A step this user may not pick (see _draftStatusLock): still listed, so the
   workflow reads whole and it is obvious who owns the step, but not selectable. */
.mnb-board .mnb-label-choice.is-locked{opacity:.42;cursor:not-allowed}
.mnb-board .mnb-label-choice.is-locked:hover{filter:none;outline:none}
.mnb-board .mnb-label-edit{border-top:1px solid var(--mn-line-2);padding-top:8px;text-align:center;color:var(--mn-placeholder);font-size:11px}

/* Date picker */
.mnb-board .mnb-pop.is-calendar{width:238px;padding:8px}
.mnb-board .mnb-cal-top{position:relative;display:flex;align-items:center;justify-content:space-between;margin-bottom:7px}
.mnb-board .mnb-cal-today{height:25px;border:1px solid var(--mn-line-2);border-radius:4px;background:#fff;color:var(--mn-text-2);font-size:11px;padding:0 8px}
.mnb-board .mnb-cal-lock{font-size:13px;color:var(--mn-text-2)}
.mnb-board .mnb-cal-top-right{display:inline-flex;align-items:center;gap:7px}

/* "Who will send the renewal?" — the picker shown when a renewal is approved,
   and the read-only board cell that records the answer. */
.mnb-board .mnb-pop.is-sender{width:212px;padding:10px}
.mnb-board .mnb-sender-list{display:flex;flex-direction:column;gap:2px;max-height:264px;overflow:auto}
.mnb-board .mnb-sender-group{margin:6px 0 2px;font-size:10px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--mn-text-3)}
.mnb-board .mnb-sender-opt{height:27px;border:1px solid transparent;border-radius:4px;background:transparent;color:var(--mn-text);font-family:inherit;font-size:12px;text-align:left;padding:0 7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mnb-board .mnb-sender-opt:hover{background:var(--mn-hover)}
.mnb-board .mnb-sender-opt.is-on{background:var(--mn-selected);border-color:var(--mn-primary);font-weight:600}
.mnb-board .mnb-sender-note{margin-top:8px;padding-top:7px;border-top:1px solid var(--mn-line);color:var(--mn-text-2);font-size:10.5px;line-height:1.35}
.mnb-board .mnb-sender-cell{display:inline-flex;align-items:center;gap:5px;max-width:100%;min-width:0}
.mnb-board .mnb-sender-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:var(--mn-cell-fs)}
.mnb-board .mnb-cal-clear{height:25px;border:1px solid var(--mn-line-2);border-radius:4px;background:#fff;color:var(--mn-red);font-size:11px;padding:0 8px}
.mnb-board .mnb-cal-clear:hover{background:var(--mn-hover)}
.mnb-board .mnb-cal-input{height:29px;margin-bottom:7px}
.mnb-board .mnb-cal-nav{display:grid;grid-template-columns:1fr auto auto;gap:4px;align-items:center;margin-bottom:4px}
.mnb-board .mnb-cal-month{font-size:12px;font-weight:500;padding-left:3px}
.mnb-board .mnb-cal-navbtn{width:25px;height:25px;border:none;border-radius:4px;background:transparent;color:var(--mn-text-2)}
.mnb-board .mnb-cal-navbtn:hover{background:var(--mn-hover)}
.mnb-board .mnb-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;text-align:center}
.mnb-board .mnb-cal-dow{height:23px;line-height:23px;color:var(--mn-text-2);font-size:10px}
.mnb-board .mnb-cal-day{height:27px;border:none;border-radius:3px;background:transparent;color:var(--mn-text);font-size:11px;padding:0}
.mnb-board .mnb-cal-day:hover{background:var(--mn-hover)}
.mnb-board .mnb-cal-day.is-other{color:var(--mn-placeholder)}
.mnb-board .mnb-cal-day.is-selected{background:var(--mn-primary);color:#fff;font-weight:600}
.mnb-board .mnb-cal-note{margin:7px -8px -8px;padding:7px 8px;border-top:1px solid var(--mn-line);color:var(--mn-text-2);font-size:10.5px;line-height:1.3}
.mnb-board .mnb-cal-m2m{width:100%;height:26px;margin-top:7px;border:1px solid var(--mn-line-2);border-radius:4px;background:#fff;color:var(--mn-primary);font-size:11px}

/* Link editor */
.mnb-board .mnb-pop.is-link{width:248px;padding:12px}
.mnb-board .mnb-link-state{height:15px;margin-top:5px;color:var(--mn-text-2);font-size:10.5px;text-align:right}
.mnb-board .mnb-pop-linkrow{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:5px;min-height:15px}
.mnb-board .mnb-pop-linkrow .mnb-link-state{margin-top:0}
.mnb-board .mnb-pop-open{font-size:11px;color:var(--mn-link);text-decoration:none;white-space:nowrap}
.mnb-board .mnb-pop-open:hover{text-decoration:underline}
.mnb-board .mnb-pop-open[hidden]{display:none}

/* Tablet / small-laptop: reclaim the 16px card insets, which cost ~64px of
   column width on exactly the screens that have the least to spare. Scoped to
   #tab-team-clients on purpose — the same .mnb-* rules dress the Request Form
   Tracker, which must not move. */
@media(max-width:1024px){
  #tab-team-clients .tc2-page{width:calc(100% - 12px)}
  #tab-team-clients .mnb-head,#tab-team-clients .mnb-toolbar{margin-left:10px;margin-right:10px}
  #tab-team-clients .mnb-hbar{margin-left:10px;margin-right:10px}
  #tab-team-clients .mnb-scroll{margin-left:10px;margin-right:10px}
  #tab-team-clients .mnb-group{padding-left:10px}
}
@media(max-width:760px){
  #tab-team-clients .tc2-page{width:100%}
  #tab-team-clients .mnb-head,#tab-team-clients .mnb-toolbar{padding-left:12px;padding-right:12px}
  #tab-team-clients .mnb-group{padding-left:12px}
  #tab-team-clients .mnb-scroll{padding-right:12px}
  /* Phones scroll the board sideways with the Client column pinned (the sticky
     left stack above). Rows go TALLER, not tighter: every cell here is a tap
     target opening a picker, and 29px is a miss at thumb size. Momentum
     scrolling makes the sideways drag feel native on iOS. */
  #tab-team-clients .tc2-page{--mn-row-h:38px}
  #tab-team-clients .mnb-scroll{-webkit-overflow-scrolling:touch}
  #tab-team-clients .mnb-head,#tab-team-clients .mnb-toolbar{margin-left:8px;margin-right:8px}
  #tab-team-clients .mnb-hbar,#tab-team-clients .mnb-scroll{margin-left:8px;margin-right:8px}
}

/* ── Client Folder column (New Client Lifecycle, owner request 2026-10-22) ──
   While a new prospect's SharePoint folder is being built, the Pulse logo FILLS
   in brand colour from left to right as the steps complete, and a light sweeps
   across it so it reads as working, not stuck. The logo is used as a STENCIL
   (mask) rather than an <img>: the file is white lettering for the dark top bar
   and is invisible on this light board. */
.tc-pf{display:flex;align-items:center;gap:8px;height:100%;min-height:34px;padding:0 10px;white-space:nowrap}
.tc-pf-logo{position:relative;flex:none;width:64px;height:24px}
.tc-pf-base,.tc-pf-ink,.tc-pf-sweep{position:absolute;top:0;left:0;width:64px;height:24px;
  -webkit-mask:url(/pulse-logo-transparent.png) center/contain no-repeat;mask:url(/pulse-logo-transparent.png) center/contain no-repeat}
.tc-pf-base{background:#d6dce6}
.tc-pf-fill{position:absolute;top:0;bottom:0;left:0;overflow:hidden;transition:width .8s ease}
.tc-pf-ink{background:linear-gradient(90deg,#13c4cc 0%,#1f6fb0 55%,#1f3a68 100%)}
.tc-pf-sweep{pointer-events:none;
  background:linear-gradient(90deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.85) 50%,rgba(255,255,255,0) 100%) no-repeat;
  background-size:45% 100%;background-position:-60% 0;animation:tc-pf-sweep 1.6s linear infinite}
@keyframes tc-pf-sweep{from{background-position:-60% 0}to{background-position:160% 0}}
.tc-pf-txt{font-size:11.5px;font-variant-numeric:tabular-nums;opacity:.72}
.tc-pf-note{margin-left:6px;font-size:11px;opacity:.65}
.tc-pf-fail{color:#b4471f}
@media (prefers-reduced-motion: reduce){.tc-pf-sweep{animation:none;display:none}.tc-pf-fill{transition:none}}