@font-face { font-family: 'Filson Pro'; src: url('../../fonts/FilsonProBook.woff2') format('woff2'); font-weight: 300; font-style: normal; font-display: swap; }
  @font-face { font-family: 'Filson Pro'; src: url('../../fonts/FilsonProMedium.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
  @font-face { font-family: 'Filson Pro'; src: url('../../fonts/FilsonProBold.woff2') format('woff2'); font-weight: 600; font-style: normal; font-display: swap; }
  @font-face { font-family: 'Filson Pro'; src: url('../../fonts/FilsonProHeavy.woff2') format('woff2'); font-weight: 800; font-style: normal; font-display: swap; }
  @font-face { font-family: 'Filson Pro'; src: url('../../fonts/FilsonProBlack.woff2') format('woff2'); font-weight: 900; font-style: normal; font-display: swap; }

  :root {
    --blue:        var(--color-nav-bg);   /* dark emerald — primary nav bg */
    --teal:        var(--color-accent);   /* emerald — calendar, active tab */
    --gold:        var(--color-highlight);   /* amber gold — accents */
    --gold-light:  var(--gold-100);   /* gold tint bg */
    --gold-dark:   var(--amber-700);   /* gold dark text */
    --sage:        var(--olive-500);   /* earthy olive-moss */
    --sage-light:  var(--olive-100);   /* olive tint bg */
    --sage-dark:   var(--olive-750);   /* olive dark text */
    --terra:       var(--emerald-550);   /* bright teal — type chips */
    --terra-light: var(--color-accent-soft);   /* teal tint bg */
    --terra-dark:  var(--color-accent-text);   /* teal dark text */
    --plum:        var(--color-secondary);   /* plum — buttons, links, labels (darkened for contrast) */
    --plum-light:  var(--color-secondary-soft);   /* plum tint bg */
    --plum-dark:   var(--plum-800);   /* plum dark text */
    --page-bg:     var(--color-page-bg);   /* grey-teal page background */
    --content-bg:  var(--color-surface-subtle);   /* light teal content panels */
    --brown:       var(--gold-725);
    --cream:       var(--color-surface-subtle);   /* light teal (was pale cream) */
    --warm:        var(--color-surface-muted);   /* soft teal (was parchment) */
    --border:      var(--color-border);   /* teal-grey border */
    --text:        var(--color-text);
    --muted:       var(--color-text-muted);
    --hot:         var(--color-danger);
    --warm-c:      var(--amber-450);
    --cold:        var(--blue-400);
    --sidebar:     240px;

    /* Height of the top nav, and of the sub-tab bar that is currently showing
       (0 when none). Set from JS so the sticky columns below can leave room. */
    --nav-h:       88px;
    --subbar-h:    0px;

    /* ── Conversation reader (Alta ▸ Conversations) ──────────────────────
       Speaker colours are fixed by Sara, 2026-07-30, and deliberately do
       NOT track the CRM emerald palette: the reader is meant to read like
       a transcript, not like the CRM chrome. */
    --conv-sara:   var(--blue-650);   /* Sara — navy */
    --conv-alta:   var(--blue-450);   /* Alta — blue */
    --machine:     var(--blue-350);   /* Auto-Alta / Record — muted blue */
    --conv-ink:    var(--blue-850);
    --conv-muted:  var(--blue-475);
    --conv-rule:   var(--grey-150);
    --conv-wash:   var(--grey-40);
    --conv-flag:   var(--amber-490);
  }

  * { box-sizing: border-box; margin: 0; padding: 0; }

  body {
    font-family: 'Filson Pro', sans-serif;
    font-weight: 400;
    background: var(--page-bg);
    color: var(--text);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    zoom: 1.1;   /* global: make the whole CRM a little larger */
  }

  /* ── TOP NAV ── */
  .topnav {
    background: var(--blue);
    height: 88px;
    display: flex;
    align-items: flex-end;
    padding: 0 24px 0;
    gap: var(--phi-navgap, 32px);
    position: sticky;
    top: 0;
    z-index: 300;
  }

  .topnav-logo {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    user-select: none;
    text-decoration: none;
    transition: opacity 0.15s;
    white-space: nowrap;
    flex-shrink: 0;
    align-self: center;
    padding-bottom: 6px;
    min-width: var(--sidebar);
  }
  .topnav-logo:hover { opacity: 0.85; }
  .topnav-logo-wordmark {
    font-family: 'Filson Pro', sans-serif;
    font-weight: 800;
    color: white;
    font-size: 15px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    line-height: 1;
  }
  .topnav-logo-wordmark span {
    color: var(--gold);
  }
  .topnav-logo-sub {
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.5);
    display: block;
    margin-top: 2px;
  }

  .topnav-links {
    display: flex;
    gap: 2px;
    flex: 1;
    align-items: flex-end;
  }

  .topnav-links a {
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    min-width: var(--phi-tabw, 0px);
    box-sizing: border-box;
    text-align: center;
    padding: 10px var(--phi-tabpad, 18px) 10px;
    border-radius: 6px 6px 0 0;
    transition: all 0.15s;
    cursor: pointer;
    border-bottom: 3px solid transparent;
    letter-spacing: 0.02em;
  }

  /* Standardized gradient of greens, light → dark across the tab row */
  #nav-contacts      { background: var(--emerald-110); color: var(--emerald-750); }
  #nav-organizations { background: #b2d5c1; color: var(--emerald-750); }
  #nav-campaigns     { background: #96c6ac; color: #14382a; }
  #nav-sales         { background: #7ab697; color: #0f2f24; }
  #nav-financials    { background: #4f9e79; color: var(--white); }
  #nav-model         { background: #58a17f; color: var(--white); }
  #nav-projects      { background: #438c68; color: var(--white); }
  #nav-home          { background: var(--sage-50); color: #123a28; }
  #nav-lists         { background: #2f7753; color: var(--white); }
  #nav-tools         { background: var(--emerald-625); color: var(--white); }
  #nav-alta          { background: var(--plum-650); color: var(--white); }
  #nav-personal      { background: #4a5b6a; color: var(--white); }
  #nav-members       { background: #5aa981; color: var(--white); }
  #nav-reports       { background: #124d31; color: var(--white); }

  /* HIDDEN 2026-09-08 (Sara: "we never use it, not yet anyway"). The Organizations
     page, its data and everything that links to it are untouched — delete this one
     rule to put the tab back. */
  #nav-organizations { display: none !important; }

  .topnav-links a:hover  { filter: brightness(1.07); transform: scale(1.06); transform-origin: center bottom; }
  .topnav-links a.active { border-bottom-color: white; filter: brightness(1.05); }

  /* When the Projects subtabs are open, other tabs fade to a muted version of
     their own color (still clickable — hover restores full strength) */
  /* While a subtab bar is open the other tabs recede, so the subtabs read as
     the live row. Moving the mouse anywhere near the tab row brings them all
     back — you should never have to guess where a tab is to click it. */
  .topnav-links a { transition: opacity .16s ease; }
  /* THE FRAME (2026-09-15): one rule. While any subtab band is open, the tabs
     that are not the active one recede; hovering the tab row brings them back. */
  body.phi-band-in .topnav-links a:not(.active)       { opacity: .22; }
  body.phi-band-in .topnav-links a:not(.active):hover { opacity: 1; }
  body.phi-band-in .topnav-links:hover a              { opacity: .85; }
  body.phi-band-in .topnav-links a:hover              { opacity: 1; }

  /* ══ THE FRAME — the second green band (2026-09-15) ══════════════════════
     ONE band, #phi-subtabs, on every screen: same height, same colour, full
     width, stuck under the top nav. It holds one group of links per main tab;
     phiBandSync() shows the group for the tab that is open and hides the rest.
     Screens whose tab has no subtabs (Home, Personal) show the band empty so
     nothing below it ever jumps. There is no per-tab show/hide, no per-tab
     alignment routine and no per-tab class on <body> any more. */
  #phi-subtabs { display:flex; align-items:center; background:var(--emerald-600); min-height:37px; width:100%;
    box-sizing:border-box; padding:0; position:sticky; top:var(--phi-stick,97px); z-index:290;
    transition: transform .22s cubic-bezier(.4,0,.2,1); }
  #phi-subtabs > div { display:none; align-items:center; gap:4px; padding:5px 14px 6px; box-sizing:border-box; }
  #phi-subtabs > div.on { display:flex; }
  #phi-subtabs > div.on.phi-band-drop { animation: projSlideDown .6s cubic-bezier(.4,0,.2,1) backwards; }
  #phi-band { min-height:37px; }
  @media print { #phi-subtabs { position: static !important; } #phi-band { display:none !important; } }
  @media (prefers-reduced-motion: reduce) { #phi-subtabs { transition: none; } #phi-subtabs > div.on.phi-band-drop { animation:none; } }
  /* Sara 2026-09-19: the band dropped in while its own alignment was still being
     worked out, so it read as sliding into place. It just appears now. */
  @keyframes projSlideDown { from { opacity: 0; } to { opacity: 1; } }
  #phi-subtabs a { cursor: pointer; font-size: 11.7px; font-weight: 600; letter-spacing: .02em; padding: 6px var(--phi-subpad, 13px); border-radius: 6px; color: var(--white); background: rgba(255,255,255,0.14); transition: background .15s, transform .15s; text-decoration: none; white-space:nowrap; }
  #phi-subtabs a:hover { background: rgba(255,255,255,0.30); transform: scale(1.09); }
  #phi-subtabs a.active { background: var(--white); color: var(--emerald-675); }
  .alta-ask { display:block; width:100%; max-width:420px; background:var(--plum-650); color:var(--white);
    border:none; border-radius:11px; padding:10px 14px; font-family:inherit; font-size:13px;
    font-weight:700; letter-spacing:.01em; cursor:pointer; text-align:center; line-height:1.25;
    box-shadow:0 2px 8px rgba(99,70,106,.28); transition:background .18s, transform .12s, box-shadow .18s; }
  .alta-ask:hover { background:#74537c; box-shadow:0 4px 14px rgba(99,70,106,.34); }
  .alta-ask:active { transform:scale(.99); }
  .alta-ask .ask-roll { position:relative; display:inline-block; min-height:1.25em; }
  /* inside a Home card the space is tight, so she gets one line there */
  .m2-area .alta-ask { font-size:12px; padding:9px 10px; }
  .m2-area .m2-row { padding:3px 0; font-size:11.6px; }
  .alta-ask .ask-roll span { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .alta-ask .ask-roll { max-width:100%; }
  .alta-ask .ask-roll span.out { position:absolute; left:0; right:0; top:0; }
  /* no fill on the way in: if the animation never runs (a background tab), the words still show */
  .alta-ask .ask-fade-in { animation: askIn .3s ease; }
  .alta-ask .ask-fade-out { animation: askOut .18s ease forwards; }
  @keyframes askIn  { from { opacity:0; transform:translateY(.5em); } to { opacity:1; transform:none; } }
  @keyframes askOut { from { opacity:1; transform:none; } to { opacity:0; transform:translateY(-.5em); } }
  @media (prefers-reduced-motion: reduce){ .alta-ask .ask-fade-in, .alta-ask .ask-fade-out { animation:none; } }
  /* Segmented toggles inside the Alta area (Messages view switch, Brain rail) */
  .alta-msgtog { background:var(--white); border:1px solid var(--sage-125); color:var(--muted,var(--emerald-500)); border-radius:7px;
                 padding:5px 12px; font-size:12px; font-weight:700; cursor:pointer; transition:background .12s,color .12s; }
  .alta-msgtog:hover { background:var(--grey-50); }
  .alta-msgtog.on { background:var(--blue,var(--emerald-750)); border-color:var(--blue,var(--emerald-750)); color:var(--white); }
  .alta-ov-strip { display:grid; grid-template-columns:repeat(auto-fit,minmax(168px,1fr)); gap:11px; margin-bottom:6px; }
  .alta-ov-tile { background:var(--white); border:1px solid var(--grey-80); border-left:5px solid var(--plum-650); border-radius:11px;
                  padding:13px 15px; cursor:pointer; transition:transform .12s, box-shadow .12s; }
  .alta-ov-tile:hover { transform:translateY(-2px); box-shadow:0 5px 16px rgba(0,0,0,.09); }
  .alta-ov-n { font-size:29px; font-weight:800; line-height:1.05; color:var(--plum-850); }
  .alta-ov-l { font-size:11.5px; font-weight:700; color:#7a6b80; letter-spacing:.03em; margin-top:3px; }
  .alta-ov-s { font-size:11px; color:var(--plum-400); margin-top:2px; }
  .alta-ov-row { display:flex; align-items:baseline; gap:9px; padding:5px 0; border-bottom:1px dotted var(--grey-80); font-size:12.7px; }
  .alta-ov-row:last-child { border-bottom:none; }
  .alta-ov-row b { color:var(--plum-850); }
  .alta-ov-row .r { margin-left:auto; color:var(--plum-400); font-size:11.5px; white-space:nowrap; }
  .alta-ov-bar { height:7px; border-radius:4px; background:var(--grey-80); overflow:hidden; }
  .alta-ov-bar i { display:block; height:100%; background:var(--plum-650); }

  /* Alta brain in-view section switcher */
  .alta-sub { cursor:pointer; font-size:12.5px; font-weight:600; padding:5px 13px; border-radius:6px; color:var(--white); background:rgba(255,255,255,0.14); text-decoration:none; transition:background .15s, transform .12s; }
  .alta-sub:hover { background:rgba(255,255,255,0.30); transform:scale(1.06); }
  .alta-sub.active { background:var(--white); color:var(--emerald-750); }
  /* Sara 2026-09-20: the Brain screen had its own card, its own headings and its
     own little icon buttons. Same card as the rest of the site now: white, 1px
     #e2e8e6, 13px corners; actions are words, not glyphs. */
  .kb-card { background:var(--white); border:1px solid var(--grey-75); border-radius:13px; padding:14px 16px; margin-bottom:12px; }
  .kb-group { font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--muted); margin:20px 0 8px; }
  .kb-count { font-size:12px; color:var(--muted); margin-bottom:12px; }
  .kb-count a, .kb-more { cursor:pointer; color:var(--plum,var(--plum-650)); }
  .kb-top { display:flex; align-items:center; gap:8px; margin-bottom:6px; flex-wrap:wrap; }
  .kb-name { font-size:14px; color:var(--emerald-750); }
  .kb-sp { flex:1; }
  .kb-act { cursor:pointer; color:var(--plum,var(--plum-650)); font-size:12px; text-decoration:none; }
  .kb-act:hover { text-decoration:underline; }
  .kb-act.del { color:var(--red-550); }
  .kb-body { font-size:13.5px; color:var(--grey-850); line-height:1.62; white-space:pre-wrap; }
  .kb-sub { font-size:12.5px; color:var(--muted); margin-top:6px; line-height:1.55; white-space:pre-wrap; }
  .kb-when { font-size:12.5px; color:var(--grey-800); margin:7px 0; line-height:1.55; }
  .kb-when b { color:var(--amber-600); }
  .kb-more { display:inline-block; font-size:12.5px; margin-top:8px; }
  .kb-warn { font-size:12.5px; color:#8a3b00; background:#fff6f0; border-radius:8px; padding:8px 11px; margin-top:9px; white-space:pre-wrap; line-height:1.55; }
  .kb-foot { font-size:11px; color:var(--muted); margin-top:9px; }
  .kb-tiles { display:flex; flex-wrap:wrap; gap:12px; }
  .kb-tile { width:214px; margin-bottom:0; }
  #brain-lists h4:first-child, #svc-facets h4:first-child, #conv-facets h4:first-child { margin-top:4px; }
  .kb-key { font-family:ui-monospace,Menlo,monospace; font-size:11.5px; color:var(--plum,var(--plum-650)); background:#f3eef4; padding:1px 7px; border-radius:5px; }
  .kb-verify { font-size:10.5px; font-weight:700; color:var(--amber-600); background:#fff1e8; border:1px solid #f0c9ad; padding:1px 7px; border-radius:5px; }
  .kb-retired { opacity:.55; }
  .kb-pill { font-size:11px; padding:1px 8px; border-radius:9px; background:var(--grey-50); color:#3a5a4a; }
  /* ── Conversations filter sidebar (left column of the Conversations view) ── */
  #alta-kb-side { width:238px; flex-shrink:0; border-right:1px solid var(--border); background:var(--grey-50); overflow-y:auto; padding:14px 13px 34px; box-sizing:border-box; }
  #alta-kb-side h4 { font-size:10.5px; letter-spacing:.07em; text-transform:uppercase; color:var(--muted); margin:17px 0 6px; font-weight:700; }
  .cf-search { width:100%; box-sizing:border-box; padding:8px 10px; border:1px solid var(--border); border-radius:8px; font-size:13px; background:var(--white); }
  .cf-sel { width:100%; box-sizing:border-box; padding:6px 8px; border:1px solid var(--border); border-radius:7px; font-size:12.5px; background:var(--white); color:var(--emerald-750); }
  .cf-opt { display:flex; align-items:center; gap:6px; padding:3px 8px; border-radius:6px; font-size:12.5px; color:var(--emerald-725); cursor:pointer; line-height:1.5; }
  .cf-opt:hover { background:var(--sage-75); }
  .cf-opt.on { background:var(--emerald-750); color:var(--white); font-weight:600; }
  .cf-opt.on .cf-n { color:var(--emerald-150); }
  .cf-opt .cf-t { flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .cf-n { font-size:11px; color:var(--muted); flex-shrink:0; font-weight:400; }
  .cf-check { display:flex; align-items:center; gap:7px; font-size:12.5px; color:var(--emerald-725); padding:3px 1px; cursor:pointer; }
  .cf-clear { width:100%; margin-top:20px; background:none; border:1px solid var(--border); border-radius:7px; padding:7px; font-size:12px; color:var(--muted); cursor:pointer; }
  .cf-clear:hover { background:var(--white); color:var(--emerald-750); }
  /* A screen with the left rail: title lined up over the cards, and the list
     allowed to shrink so a long web address cannot widen the whole page. */
  /* The width and the left column of the Alta knowledge screens come from the
     site's own frame now - see the Alta block at the end of css/02. */
  .kb-landed { outline:2px solid var(--plum,var(--plum-650)); outline-offset:3px; transition:outline-color .6s; }
  #alta-kb-list { min-width:0; }
  #alta-kb-list .kb-card { overflow-wrap:anywhere; }
  #alta-kb-side .phi-rail-searchbox { padding:0 0 4px; }
  #alta-kb-side .phi-rail-searchbox input { width:100% !important; box-sizing:border-box !important;
    padding:8px 10px; border:1px solid var(--border); border-radius:8px; font-size:13px; background:var(--white); }
  /* ── Setup: the plan / next-step-up price table on each account card ── */
  .svc-tier { width:100%; border-collapse:collapse; margin-top:9px; font-size:12px; background:var(--white); border:1px solid var(--border); border-radius:8px; overflow:hidden; }
  .svc-tier th { text-align:left; font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); font-weight:700; padding:6px 10px; background:var(--grey-50); border-bottom:1px solid var(--border); }
  .svc-tier td { padding:7px 10px; vertical-align:top; border-top:1px solid var(--grey-50); line-height:1.5; }
  .svc-tier tr.svc-now td { background:var(--white); }
  .svc-tier tr.svc-next td { background:#faf7fb; }
  .svc-when { width:96px; font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; font-weight:700; color:var(--muted); white-space:nowrap; }
  .svc-tier tr.svc-now .svc-when { color:var(--emerald-750); }
  .svc-tier tr.svc-next .svc-when { color:var(--plum-650); }
  .svc-plan { width:132px; font-weight:600; color:var(--emerald-750); }
  .svc-tier tr.svc-next .svc-plan { color:var(--plum-650); }
  .svc-price { width:92px; font-weight:700; color:var(--emerald-750); white-space:nowrap; }
  .svc-tier tr.svc-next .svc-price { color:var(--plum-650); }
  .svc-gets { color:var(--sage-650); }
  .svc-dim { color:var(--sage-300); font-weight:400; }
  .svc-jump { display:inline-block; margin-left:4px; font-size:9.5px; font-weight:700; color:#b05c00; background:var(--gold-25); border-radius:8px; padding:0 5px; letter-spacing:0; text-transform:none; }
  .svc-checked { font-size:11px; color:var(--muted); margin-top:4px; }
  .svc-checked a { color:var(--plum,var(--plum-650)); cursor:pointer; }
  .svc-noprice { margin-top:9px; font-size:12px; color:var(--muted); background:var(--white); border:1px dashed var(--border); border-radius:8px; padding:8px 10px; }
  .svc-noprice a { color:var(--plum,var(--plum-650)); cursor:pointer; }
  .conv-when { width:76px; flex-shrink:0; text-align:right; padding-right:13px; border-right:2px solid var(--sage-50); }
  .conv-when-d { font-size:14.5px; font-weight:700; color:var(--emerald-750); line-height:1.25; }
  .conv-when-y { font-size:11px; color:var(--muted); line-height:1.3; }
  .conv-when-t { font-size:11.5px; color:var(--muted); margin-top:4px; }
  .conv-title { font-size:14px; color:var(--emerald-750); cursor:pointer; }
  .conv-title:hover { color:var(--plum,var(--plum-650)); text-decoration:underline; }
  .conv-del { font-size:11px; color:var(--sage-300); cursor:pointer; padding:2px 8px; border-radius:5px; }
  .conv-del:hover { background:var(--grey-25); color:var(--red-550); }

  /* Subtle header entrance — applied by animateViewHeaders() to prominent
     header text as a page/tab loads. Gentle fade + 7px rise, staggered. */
  @keyframes hdrIn { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }
  .hdr-anim { animation: hdrIn .55s cubic-bezier(.25,.6,.3,1) both; }
  .plan-item-done { opacity:0.65; }
  .plan-check { width:18px;height:18px;border-radius:4px;border:2px solid var(--border);cursor:pointer;flex-shrink:0;margin-top:1px;display:flex;align-items:center;justify-content:center;transition:all 0.15s; }
  .plan-check.checked { background:var(--teal);border-color:var(--teal);color:var(--white); }
  .plan-item-body { flex:1;min-width:0; }
  .plan-title { font-size:13px;font-weight:600;color:var(--text);line-height:1.3; }
  .plan-meta { font-size:11px;color:var(--muted);margin-top:2px; }
  .plan-badge { display:inline-block;padding:1px 7px;border-radius:10px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:0.04em;margin-right:4px; }
  .plan-badge.high { background:var(--grey-100);color:var(--red-550); }
  .plan-badge.medium { background:var(--gold-50);color:var(--gold-550); }
  .plan-badge.low { background:var(--sage-25);color:var(--green-600); }
  .plan-badge.in_progress { background:#e3f0fd;color:#1a5090; }
  .plan-badge.done { background:var(--sage-25);color:var(--green-600); }
  /* Call-list script cell: click text to copy, pencil-to-edit appears on hover */
  .cs-script { position:relative; }
  .cs-text { cursor:pointer; border-radius:6px; transition:background 0.12s; padding:2px 4px; margin:-2px -4px; }
  .cs-text:hover { background:rgba(127,102,128,0.07); }
  .cs-text.copied { background:rgba(26,132,107,0.16); }
  .cs-editbtn { position:absolute; top:2px; right:2px; background:rgba(255,255,255,0.94); border:1px solid var(--border); border-radius:5px; padding:1px 6px; font-size:12px; line-height:1.5; cursor:pointer; opacity:0; transition:opacity 0.12s; z-index:2; }
  .cs-script:hover .cs-editbtn { opacity:1; }
  .plan-item-actions { display:flex;gap:3px;flex-shrink:0;opacity:0;transition:opacity 0.15s; }
  .plan-item:hover .plan-item-actions { opacity:1; }
  .plan-action-btn { background:none;border:1px solid var(--border);border-radius:4px;padding:2px 6px;font-size:11px;cursor:pointer;color:var(--muted);transition:color 0.1s,background 0.1s; }
  .plan-action-btn:hover { color:var(--text);background:var(--content-bg); }
  .plan-action-btn.del:hover { color:var(--red-550);background:var(--grey-25);border-color:var(--red-150); }

  /* ── MAIN LAYOUT ── */
  .main {
    display: flex;
    flex: 1;
  }

  /* ── SIDEBAR ── */
  .sidebar {
    width: var(--sidebar);
    background: var(--cream);
    border-right: 1px solid var(--border);
    padding: 16px 0;
    position: sticky;
    top: calc(68px + var(--subbar-h));
    height: calc(100vh - 68px - var(--subbar-h));
    overflow-y: auto;
    flex-shrink: 0;
  }
  .sidebar .sidebar-label { color: var(--muted); }

  .sidebar-section {
    padding: 0 16px;
    margin-bottom: 24px;
  }

  .sidebar-label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gold-dark);
    padding: 0 8px;
    margin-bottom: 6px;
  }

  .sidebar-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 8px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    color: var(--text);
    cursor: pointer;
    transition: all 0.12s;
    text-decoration: none;
  }

  .sidebar-item:hover {
    background: var(--warm);
  }

  .sidebar-item.active {
    background: var(--blue);
    color: white;
  }

  .sidebar-item .count {
    margin-left: auto;
    font-size: 11px;
    font-weight: 600;
    color: var(--muted);
    background: var(--warm);
    padding: 1px 7px;
    border-radius: 10px;
  }

  .sidebar-item.active .count {
    background: rgba(255,255,255,0.2);
    color: white;
  }

  /* ── TYPE FILTER BUTTONS (colored per type) ── */
  .sidebar-type-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 9px 10px 9px 12px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.12s;
    margin-bottom: 4px;
    border-left: 4px solid transparent;
  }
  .sidebar-type-btn .count {
    font-size: 11px;
    font-weight: 600;
    padding: 1px 7px;
    border-radius: 10px;
    background: rgba(0,0,0,0.1);
    margin-left: auto;
  }
  .sidebar-type-btn.active .count {
    background: rgba(255,255,255,0.25);
    color: white;
  }

  /* ── CONTENT ── */
  .content {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    height: calc(100vh - 88px);
  }

  /* ── CONTACTS VIEW ── */
  #view-contacts {
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow: hidden;
  }
  .contacts-header-bar {
    padding: 20px 32px 14px;
    flex-shrink: 0;
    background: var(--cream);
    border-bottom: 1px solid var(--border);
  }
  .contacts-header-bar .page-header { margin-bottom: 12px; }
  .contacts-table-area {
    flex: 1;
    overflow-y: auto;
    padding: 0 32px;
  }
  .contact-table tr.selected td { background: var(--grey-40) !important; }
  .contact-table tr.bulk-checked td { background: var(--grey-40) !important; }
  .contact-table tr.kb-focused td { outline: 2px solid var(--teal,#2e8b7a); outline-offset: -1px; background: var(--sage-75) !important; }
  .contact-table th.bulk-cb-col, .contact-table td.bulk-cb-col { width:46px;min-width:46px;padding:0 0 0 14px;text-align:center; }
  .contact-table td.bulk-cb-col input[type=checkbox] { cursor:pointer;width:15px;height:15px;accent-color:var(--blue); }
  .contact-table th.bulk-cb-col input[type=checkbox] { cursor:pointer;width:15px;height:15px;accent-color:var(--blue); }
  .contact-table th.star-col, .contact-table td.star-col { width:30px;min-width:30px;padding:0 6px;text-align:center; }

  /* ── QUICK FILTER PRESETS BAR ── */
  .quick-filter-bar {
    display: flex; gap: 6px; flex-wrap: wrap; align-items: center;
    padding: 8px 32px 10px; background: var(--cream);
    border-bottom: 1px solid var(--border); flex-shrink: 0;
  }
  .quick-filter-bar .qf-label {
    font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
    color: var(--muted); margin-right: 4px;
  }
  .qf-pill {
    padding: 4px 12px; border-radius: 20px; font-size: 12px; font-weight: 600;
    cursor: pointer; border: 1.5px solid var(--border); background: white; color: var(--muted);
    transition: all 0.15s; user-select: none; white-space: nowrap;
  }
  .qf-pill:hover { border-color: var(--plum); color: var(--plum); background: var(--plum-light); }
  .qf-pill.active { background: var(--plum); color: white; border-color: var(--plum); }
  .qf-pill.hot-pill.active { background: var(--hot); border-color: var(--hot); }
  .qf-pill.warm-pill.active { background: var(--warm-c); border-color: var(--warm-c); color: var(--white); }
  .qf-clear { font-size: 11px; color: var(--muted); cursor: pointer; margin-left: 4px; text-decoration: underline; }
  .qf-clear:hover { color: var(--plum); }

  /* ── CONTACT CARD GRID VIEW ── */
  #contact-card-grid {
    flex-wrap: wrap; gap: 14px; padding: 12px 6px;
    overflow-y: auto; flex: 1; align-content: flex-start;
  }
  .contact-card {
    width: 210px; background: white; border: 1px solid var(--border); border-radius: 12px;
    padding: 15px 14px; cursor: pointer; display: flex; flex-direction: column; gap: 7px;
    transition: transform 0.12s, box-shadow 0.12s;
  }
  .contact-card:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,0.1); }
  .contact-card .cc-top { display: flex; align-items: center; gap: 10px; }
  .contact-card .cc-avatar {
    width: 40px; height: 40px; border-radius: 50%; flex-shrink: 0;
    background: var(--teal); color: white; display: flex; align-items: center; justify-content: center;
    font-weight: 700; font-size: 15px; overflow: hidden;
  }
  .contact-card .cc-avatar img { width:100%;height:100%;object-fit:cover;border-radius:50%; }
  .contact-card .cc-name { font-weight: 700; font-size: 13px; color: var(--text); line-height: 1.25; }
  .contact-card .cc-sub { font-size: 11px; color: var(--muted); line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 150px; }
  .contact-card .cc-rating { font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 20px; align-self: flex-start; }
  .contact-card .cc-rating.hot  { background: var(--grey-100); color: var(--hot); }
  .contact-card .cc-rating.warm { background: var(--gold-25); color: var(--warm-c); }
  .contact-card .cc-rating.cold { background: #e3eef5; color: var(--cold); }
  .contact-card .cc-meta { font-size: 11px; color: var(--muted); display: flex; align-items: center; gap: 4px; }

  /* View mode toggle */
  .view-mode-toggle { display: flex; border: 1px solid var(--border); border-radius: 6px; overflow: hidden; }
  .view-mode-toggle button {
    padding: 5px 9px; background: white; border: none; cursor: pointer;
    font-size: 13px; color: var(--muted); transition: background 0.12s, color 0.12s;
  }
  .view-mode-toggle button.active { background: var(--teal); color: white; }
  .view-mode-toggle button:hover:not(.active) { background: var(--warm); color: var(--text); }

  /* ── SIDEBAR OUTREACH QUEUE ── */
  .sb-outreach-item {
    display: flex; align-items: center; justify-content: space-between;
    padding: 5px 8px; border-radius: 7px; cursor: pointer; font-size: 13px;
    color: var(--text); margin-bottom: 2px; transition: background 0.12s;
  }
  .sb-outreach-item:hover { background: var(--warm); }
  .sb-outreach-badge {
    border-radius: 20px; padding: 1px 8px; font-size: 11px; font-weight: 700;
    min-width: 24px; text-align: center; background: var(--plum-light); color: var(--plum-dark);
  }
  .sb-outreach-badge.badge-hot  { background: var(--grey-100); color: var(--hot); }
  .sb-outreach-badge.badge-warm { background: var(--gold-25); color: var(--warm-c); }
  .sb-outreach-badge.badge-zero { background: var(--sage-light); color: var(--sage-dark); }

  /* Row right-click context menu */
  @keyframes toastIn { from { opacity:0; transform:translateX(-50%) translateY(8px); } to { opacity:1; transform:translateX(-50%) translateY(0); } }

  /* ── Activity Feed overlay ── */
  #activity-feed-overlay {
    display:none;
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.45);
    z-index:3500;
    align-items:flex-start;
    justify-content:flex-end;
    padding:0;
  }
  #activity-feed-overlay.open { display:flex; }
  #activity-feed-panel {
    background:var(--content-bg);
    width:460px;
    max-width:96vw;
    height:100vh;
    display:flex;
    flex-direction:column;
    box-shadow:-4px 0 32px rgba(0,0,0,.18);
    animation:feedSlideIn .22s ease;
  }
  @keyframes feedSlideIn { from { transform:translateX(30px); opacity:.5; } to { transform:none; opacity:1; } }
  #activity-feed-header {
    background:var(--blue);
    color:white;
    padding:16px 20px;
    display:flex;
    align-items:center;
    gap:12px;
    flex-shrink:0;
  }
  #activity-feed-header h3 { flex:1; font-size:16px; font-weight:700; margin:0; }
  .feed-filter-bar {
    padding:10px 16px;
    background:var(--warm);
    border-bottom:1px solid var(--border);
    display:flex;
    gap:6px;
    flex-wrap:wrap;
    flex-shrink:0;
  }
  .feed-chip {
    padding:3px 11px;
    border-radius:12px;
    font-size:11px;
    font-weight:600;
    cursor:pointer;
    border:1px solid var(--border);
    background:white;
    color:var(--muted);
    transition:all .15s;
  }
  .feed-chip.active { background:var(--blue); color:white; border-color:var(--blue); }
  #activity-feed-list {
    flex:1;
    overflow-y:auto;
    padding:8px 0;
  }
  .feed-entry {
    padding:10px 18px;
    border-bottom:1px solid rgba(0,0,0,.06);
    cursor:pointer;
    transition:background .1s;
  }
  .feed-entry:hover { background:var(--warm); }
  .feed-entry-top { display:flex; align-items:center; gap:8px; margin-bottom:2px; }
  .feed-entry-name { font-size:13px; font-weight:600; color:var(--blue); }
  .feed-entry-type { font-size:10px; font-weight:700; padding:1px 7px; border-radius:8px; text-transform:uppercase; letter-spacing:.04em; }
  .feed-entry-note { font-size:12px; color:var(--text); margin:2px 0; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
  .feed-entry-time { font-size:10px; color:var(--muted); }
  .feed-load-more { text-align:center; padding:14px; font-size:12px; color:var(--plum); cursor:pointer; font-weight:600; }
  .feed-load-more:hover { text-decoration:underline; }

  #row-context-menu {
    position:fixed; z-index:9200; background:white; border:1px solid var(--border);
    border-radius:10px; box-shadow:0 6px 24px rgba(0,0,0,.16); min-width:200px; padding:6px 0;
    font-size:13px; display:none;
  }
  #row-context-menu .rcm-item {
    padding:8px 16px; cursor:pointer; display:flex; align-items:center; gap:10px; color:var(--text);
    white-space:nowrap;
  }
  #row-context-menu .rcm-item:hover { background:var(--warm); }
  #row-context-menu .rcm-divider { height:1px; background:var(--border); margin:4px 0; }
  #row-context-menu .rcm-name {
    font-weight:700; padding:8px 16px 4px; font-size:12px; color:var(--muted);
    text-transform:uppercase; letter-spacing:.04em; cursor:default;
  }
  #row-context-menu .rcm-item.danger { color:var(--red-550); }
  #row-context-menu .rcm-item.snooze-parent { position:relative; }
  #rcm-snooze-submenu {
    display:none;
    position:absolute;
    left:100%;
    top:-4px;
    background:white;
    border:1px solid var(--border);
    border-radius:8px;
    box-shadow:0 4px 16px rgba(0,0,0,.15);
    min-width:150px;
    z-index:10001;
    overflow:hidden;
  }
  #row-context-menu .rcm-item.snooze-parent:hover #rcm-snooze-submenu { display:block; }
  #rcm-snooze-submenu .snooze-opt {
    padding:7px 14px;
    font-size:12px;
    color:var(--text);
    cursor:pointer;
    white-space:nowrap;
  }
  #rcm-snooze-submenu .snooze-opt:hover { background:var(--warm); }
  .rcm-item .snooze-arrow { float:right; opacity:.5; font-size:10px; }

  /* Bulk action bar */
  #bulk-action-bar {
    position:fixed; bottom:0; left:0; right:0;
    background:var(--blue); color:white;
    padding:12px 20px; display:flex; align-items:center; gap:10px; flex-wrap:wrap;
    z-index:1100; box-shadow:0 -3px 16px rgba(0,0,0,0.18);
    transform:translateY(100%); transition:transform 0.2s ease;
  }
  #bulk-action-bar.visible { transform:translateY(0); }
  #bulk-action-bar .bulk-count { font-weight:700; font-size:14px; white-space:nowrap; }
  #bulk-action-bar select, #bulk-action-bar input {
    padding:6px 10px; border-radius:6px; border:none; font-size:13px;
    font-family:inherit; background:rgba(255,255,255,0.15); color:white;
    cursor:pointer; outline:none;
  }
  #bulk-action-bar select option { background:#1a4a64; color:white; }
  #bulk-action-bar .bulk-apply {
    background:white; color:var(--blue); border:none; border-radius:6px;
    padding:7px 16px; font-size:13px; font-weight:700; cursor:pointer;
    font-family:inherit; white-space:nowrap;
  }
  #bulk-action-bar .bulk-apply:hover { background:#f0f8ff; }
  #bulk-action-bar .bulk-clear {
    background:none; border:1px solid rgba(255,255,255,0.4); color:white;
    border-radius:6px; padding:6px 12px; font-size:13px; cursor:pointer;
    font-family:inherit; white-space:nowrap;
  }
  #bulk-action-bar .bulk-divider { width:1px; height:24px; background:rgba(255,255,255,0.3); margin:0 4px; }
  .bulk-chip-row { display:flex; gap:6px; flex-wrap:wrap; }
  .bulk-chip {
    padding:5px 12px; border-radius:20px; border:1px solid rgba(255,255,255,0.4);
    font-size:12px; cursor:pointer; white-space:nowrap; transition:all 0.1s;
    background:rgba(255,255,255,0.1);
  }
  .bulk-chip.selected { background:white; color:var(--blue); border-color:white; font-weight:700; }

  /* ── CAMPAIGNS VIEW — three-column dashboard ── */
  #view-campaigns {
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow: hidden;
  }
  /* Left sidebar */
  .camp-sidebar {
    width: var(--sidebar);
    min-width: var(--sidebar);
    max-width: var(--sidebar);
    flex-shrink: 0;
    background: var(--cream);
    border-right: 1px solid var(--border);
    overflow-y: auto;
    padding: 16px 0;
  }
  .camp-sidebar .sidebar-label { font-size: 10px; font-weight: 700; text-transform: uppercase;
    letter-spacing: .07em; color: var(--muted); padding: 0 14px 8px; }
  .camp-sidebar-item { padding: 5px 10px; font-size: 12px; cursor: pointer; border-radius: 5px;
    margin: 1px 6px; color: var(--text); transition: background .12s; display: flex; align-items: center; gap: 6px; }
  .camp-sidebar-item:hover { background: var(--warm); }
  .camp-sidebar-item.active { background: var(--sage); color: white; font-weight: 600; }
  .camp-sidebar-item .cs-count { font-size: 11px; margin-left: auto; opacity: .7; }
  /* Main table area */
  .camp-main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }
  .camp-header-bar {
    padding: 20px 32px 14px;
    flex-shrink: 0;
    background: var(--cream);
    border-bottom: 1px solid var(--border);
  }

  /* ── ONE STANDARD PAGE HEADER (Sara, 2026-09-08) ──────────────────────────
     Every main screen gets the same top: cream band, same padding, same title
     size, and the same clear space on the right for Alta to stand in — so she
     lands in the same place instead of bouncing from screen to screen.
     Contacts was the screen Sara liked; these are its measurements. */
  .phi-head {
    padding: 20px 32px 14px;
    flex-shrink: 0;
    background: var(--cream);
    border-bottom: 1px solid var(--border);
  }
  .phi-head .page-header { margin-bottom: 12px; }
  .phi-head > h1, .phi-head .page-title {
    font-family: 'Filson Pro', sans-serif; font-weight: 800;
    font-size: 26px; color: var(--blue); margin: 0;
  }
  /* Alta's clear zone: on screens with no right-hand panel, nothing in a header
     runs under where she stands. */
  @media (min-width: 1100px) {
    body.phi-clearzone .phi-head { padding-right: 240px; }
  }

  /* Buttons Sara took off the screens on 2026-09-08: making a thing, printing a
     thing, or deleting a saved view. Her rule — she would ask me to do those
     rather than click a button for them. To put any single one back, delete
     phi-off from that button. To bring them all back, delete this rule. */
  .phi-off { display: none !important; }
  .camp-table-area {
    flex: 1;
    overflow-y: auto;
    padding: 0 32px 24px;
  }
  .camp-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
  .camp-table thead th { background: var(--cream); padding: 9px 14px; font-size: 11px;
    font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--muted);
    border-bottom: 1px solid var(--border); text-align: left; cursor: pointer; white-space: nowrap;
    position: sticky; top: 0; z-index: 2; }
  .camp-table thead th:hover { color: var(--blue); }
  .camp-table tbody tr { border-bottom: 1px solid var(--border); cursor: pointer;
    transition: background .1s; }
  .camp-table tbody tr:hover { background: rgba(21,80,105,.04); }
  .camp-table tbody tr.selected { background: rgba(21,80,105,.08); }
  .camp-table tbody tr.camp-drag-over { outline: 2px solid var(--blue); outline-offset: -2px; }
  .camp-table td { padding: 10px 14px; font-size: 13px; color: var(--text); vertical-align: middle;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  /* Right detail panel */
  .camp-detail-panel {
    width: 420px;
    flex-shrink: 0;
    background: var(--content-bg);
    border-left: 2px solid var(--border);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: background .2s, border-color .2s;
  }
  .camp-detail-panel.active { border-left: 3px solid var(--gold); background: white; }
  .camp-dp-empty { display: flex; align-items: center; justify-content: center;
    height: 100%; color: var(--muted); font-size: 13px; padding: 32px; text-align: center; }
  .camp-dp-header { background: var(--blue); padding: 14px 16px 12px; color: white;
    display: flex; align-items: flex-start; gap: 10px; }
  .camp-dp-name { font-family: 'Filson Pro', sans-serif; font-weight: 800; font-size: 22px;
    flex: 1; line-height: 1.2; word-break: break-word; }
  .camp-dp-body { padding: 16px; }
  .camp-row-selected { background: rgba(21,80,105,.08) !important; }
  .campaign-card-meta { display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin-bottom:10px; }
  .camp-type-badge { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em;
    background:var(--sage); color:white; border-radius:20px; padding:2px 9px; }
  .camp-status-badge { font-size:11px; font-weight:600; border-radius:20px; padding:2px 9px; }
  .camp-status-badge.active   { background:var(--emerald-100); color:var(--green-700); }
  .camp-status-badge.draft    { background:var(--gold-50); color:var(--gold-550); }
  .camp-status-badge.completed{ background:#cce5ff; color:#004085; }
  .camp-status-badge.archived { background:#e2e3e5; color:#383d41; }
  .camp-dates { font-size:11px; color:var(--muted); }
  .campaign-card-actions { display:flex; gap:8px; margin-top:12px; align-items:center; }
  .camp-edit-btn { background:none; border:1px solid var(--border); border-radius:6px; padding:3px 10px;
    font-size:11px; font-weight:600; color:var(--muted); cursor:pointer; font-family:inherit; }
  .camp-edit-btn:hover { border-color:var(--blue); color:var(--blue); }
  /* Campaign detail pane two-column layout */
  .camp-detail-grid { display:grid; grid-template-columns:1fr 230px; flex:1; min-height:0; overflow:hidden; }
  .camp-detail-main { overflow-y:auto; padding:16px 20px; }
  .camp-detail-side { overflow-y:auto; padding:12px 14px; border-left:1px solid var(--border); background:var(--white); }
  .camp-field-row { margin-bottom:14px; }
  .camp-field-label { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.07em;
    color:var(--muted); margin-bottom:4px; }
  .camp-field-val { font-size:13px; color:var(--text); padding:5px 7px; border-radius:6px;
    border:1px solid transparent; cursor:pointer; min-height:28px; display:block;
    transition:border-color .15s; word-break:break-word; }
  .camp-field-val:hover { border-color:var(--border); background:white; }
  .camp-field-input { width:100%; box-sizing:border-box; padding:5px 8px; border:1px solid var(--blue);
    border-radius:6px; font-size:13px; font-family:inherit; color:var(--text); outline:none; }
  .camp-field-select { width:100%; box-sizing:border-box; padding:5px 8px; border:1px solid var(--blue);
    border-radius:6px; font-size:13px; font-family:inherit; color:var(--text); outline:none; background:white; }
  /* Section titles in campaign detail panel — matches contact .detail-section style */
  .camp-dp-section-title {
    font-size: 13px; font-weight: 700; text-transform: uppercase;
    letter-spacing: 0.06em; color: var(--gold-dark);
    padding: 10px 14px 8px 14px;
    border-bottom: 2px solid var(--gold);
    display: flex; align-items: center; justify-content: space-between;
    background: linear-gradient(135deg, var(--content-bg) 0%, var(--grey-50) 100%);
  }
  .camp-dp-section-body {
    padding: 12px 14px 14px 14px;
  }
  .camp-dp-section-card {
    background: white; border: 1px solid var(--border); border-radius: 8px;
    margin-bottom: 8px; overflow: hidden;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  }
  /* Activity log */
  .camp-activity-log { margin-top:0; }
  .camp-activity-title { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.07em;
    color:var(--muted); margin-bottom:10px; }
  .camp-activity-entry { display:flex; gap:10px; margin-bottom:10px; font-size:12px; }
  .camp-activity-dot { width:8px; height:8px; border-radius:50%; background:var(--blue);
    margin-top:3px; flex-shrink:0; }
  .camp-activity-text { flex:1; color:var(--text); line-height:1.5; }
  .camp-activity-time { color:var(--muted); font-size:11px; }
  /* Members side panel */
  .camp-members-title { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.07em;
    color:var(--muted); margin-bottom:10px; }
  .camp-member-item { display:flex; align-items:center; gap:8px; padding:6px 0;
    border-bottom:1px solid var(--border); }
  .camp-member-item:last-child { border-bottom:none; }
  .camp-member-name { flex:1; font-size:13px; font-weight:500; color:var(--blue); cursor:pointer; }
  .camp-member-name:hover { text-decoration:underline; }
  .camp-member-co { font-size:11px; color:var(--muted); }
  .camp-remove-btn { background:none; border:none; color:var(--muted); cursor:pointer; font-size:16px;
    padding:0 2px; line-height:1; }
  .camp-remove-btn:hover { color:var(--red-550); }
  .camp-add-row { display:flex; gap:8px; margin-top:12px; align-items:center; }
  .camp-add-row input { flex:1; padding:6px 10px; border:1px solid var(--border); border-radius:6px;
    font-size:12px; font-family:inherit; outline:none; }
  .camp-add-row input:focus { border-color:var(--blue); }
  .camp-add-dd { position:absolute; top:100%; left:0; right:0; background:white;
    border:1px solid var(--border); border-radius:8px; box-shadow:0 4px 16px rgba(0,0,0,.12);
    max-height:160px; overflow-y:auto; z-index:10; display:none; }
  .camp-add-dd.open { display:block; }
  .camp-add-dd-item { padding:7px 12px; font-size:13px; cursor:pointer; }
  .camp-add-dd-item:hover { background:var(--cream); }
  /* New campaign button */
  .btn-new-camp { background:var(--plum); color:white; border:none; border-radius:8px;
    padding:8px 16px; font-size:13px; font-weight:700; cursor:pointer; font-family:inherit;
    white-space:nowrap; }
  .btn-new-camp:hover { opacity:.9; }
  /* Campaign member table */
  .camp-member-table-wrap { overflow-x:auto; margin-top:8px; }
  .camp-member-tbl { width:100%; border-collapse:collapse; font-size:12px; }
  .camp-member-tbl th { text-align:left; font-size:10px; font-weight:700; text-transform:uppercase;
    letter-spacing:.06em; color:var(--muted); border-bottom:2px solid var(--border);
    padding:6px 8px; white-space:nowrap; cursor:pointer; user-select:none; }
  .camp-member-tbl th:hover { color:var(--text); }
  .camp-member-tbl td { padding:7px 8px; border-bottom:1px solid var(--border); vertical-align:middle; }
  .camp-member-tbl tr:last-child td { border-bottom:none; }
  .camp-member-tbl tr:hover td { background:var(--cream); }
  .cmt-name-cell { display:flex; align-items:center; gap:7px; }
  .cmt-avatar { width:26px; height:26px; border-radius:50%; background:var(--teal); color:var(--white);
    display:flex; align-items:center; justify-content:center; font-size:10px; font-weight:700;
    flex-shrink:0; overflow:hidden; }
  .cmt-name-link { color:var(--blue); cursor:pointer; font-weight:500; }
  .cmt-name-link:hover { text-decoration:underline; }
  .cmt-rsvp { padding:2px 8px; border-radius:10px; font-size:10px; font-weight:700; cursor:pointer;
    border:none; font-family:inherit; }
  .cmt-rsvp.yes  { background:var(--emerald-100); color:var(--green-700); }
  .cmt-rsvp.no   { background:var(--red-100); color:var(--red-700); }
  .cmt-rsvp.maybe { background:var(--gold-50); color:var(--gold-550); }
  .cmt-rsvp.pending { background:var(--cream); color:var(--muted); }
  /* Recruiting funnel stages */
  .cmt-rsvp.applied     { background:#e2e3f3; color:#3a3a7a; }
  .cmt-rsvp.invited     { background:#d8ecf7; color:#155178; }
  .cmt-rsvp.replied,
  .cmt-rsvp.interested  { background:var(--emerald-100); color:var(--green-700); }
  .cmt-rsvp.interviewed { background:#fde9cf; color:#8a4b00; }
  .cmt-rsvp.hired       { background:#cdeccd; color:#0f5d2a; font-weight:800; }
  .cmt-rsvp.declined    { background:var(--red-100); color:var(--red-750); }
  .cmt-notes-cell { max-width:180px; }
  .cmt-notes-val { font-size:11px; color:var(--muted); cursor:pointer; white-space:nowrap;
    overflow:hidden; text-overflow:ellipsis; max-width:160px; display:block; }
  .cmt-notes-val:empty::before { content:'Add note…'; color:var(--border); font-style:italic; }
  .cmt-notes-val:hover { color:var(--blue); }
  .camp-member-tbl-hd { display:flex; align-items:center; justify-content:space-between;
    margin-bottom:4px; }
  .cmt-col-btn { background:none; border:1px solid var(--border); border-radius:6px;
    padding:3px 9px; font-size:11px; color:var(--muted); cursor:pointer; font-family:inherit; }
  .cmt-col-btn:hover { border-color:var(--blue); color:var(--blue); }
  .cmt-col-picker { position:absolute; background:white; border:1px solid var(--border);
    border-radius:8px; box-shadow:0 4px 16px rgba(0,0,0,.12); padding:8px 0; z-index:200;
    min-width:160px; display:none; }
  .cmt-col-picker.open { display:block; }
  .cmt-col-picker-item { display:flex; align-items:center; gap:8px; padding:6px 14px;
    cursor:pointer; font-size:12px; }
  .cmt-col-picker-item:hover { background:var(--cream); }
  .camp-tbl-pager { display:flex; align-items:center; gap:8px; margin-top:10px;
    font-size:12px; color:var(--muted); }
  .camp-tbl-pager button { background:none; border:1px solid var(--border); border-radius:5px;
    padding:3px 10px; font-size:12px; cursor:pointer; font-family:inherit; }
  .camp-tbl-pager button:disabled { opacity:.4; cursor:default; }
  .camp-tbl-pager button:not(:disabled):hover { border-color:var(--blue); color:var(--blue); }

  /* ── TYPES VIEW ── */
  #view-types { flex: 1; padding: 28px 32px; overflow-y: auto; }

  /* ── CONTACT BOTTOM SHEET ── */
  .contact-sheet-backdrop {
    position: fixed;
    top: 88px;
    left: 0; right: 300px; bottom: 0;
    background: rgba(0,0,0,0.28);
    z-index: 250;
    display: none;
    cursor: pointer;
  }
  .contact-sheet-backdrop.open { display: block; }
  .contact-sheet {
    position: absolute;
    top: 0; bottom: 0;
    left: var(--sidebar);
    right: 0;
    background: white;
    border-radius: 0;
    box-shadow: 0 0 60px rgba(0,0,0,0.22);
    overflow: hidden;
    transform: translateX(100%);
    transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1);
    cursor: default;
    display: flex;
    flex-direction: column;
  }
  .contact-sheet.open { transform: translateX(0); }

  .contact-sheet-header {
    background: var(--blue);
    padding: 24px 28px 20px;
    color: white;
    position: relative;
    flex-shrink: 0;
  }
  .contact-sheet-body { padding: 24px 28px; flex: 1; overflow-y: auto; }

  /* ── QUICK ACTIONS BAR ── */
  .sheet-quick-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 20px;
    background: rgba(0,0,0,0.18);
    border-top: 1px solid rgba(255,255,255,0.12);
    flex-shrink: 0;
    flex-wrap: wrap;
  }
  .qa-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    border-radius: 20px;
    border: 1px solid rgba(255,255,255,0.3);
    background: rgba(255,255,255,0.1);
    color: rgba(255,255,255,0.92);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    transition: background 0.15s, border-color 0.15s;
    white-space: nowrap;
  }
  .qa-btn:hover { background: rgba(255,255,255,0.22); border-color: rgba(255,255,255,0.55); }
  .qa-btn.qa-primary { background: rgba(255,255,255,0.22); border-color: rgba(255,255,255,0.5); }

  /* ── CAMPAIGN BOTTOM SHEET ── */
  .campaign-sheet-backdrop {
    position: fixed;
    top: 88px;
    left: 0; right: 300px; bottom: 0;
    background: rgba(0,0,0,0.28);
    z-index: 250;
    display: none;
    cursor: pointer;
  }
  .campaign-sheet-backdrop.open { display: block; }
  .campaign-sheet {
    position: absolute;
    top: 0; bottom: 0;
    left: var(--sidebar);
    right: 0;
    background: white;
    border-radius: 0;
    box-shadow: 0 0 60px rgba(0,0,0,0.22);
    overflow: hidden;
    transform: translateX(100%);
    transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1);
    cursor: default;
    display: flex;
    flex-direction: column;
  }
  .campaign-sheet.open { transform: translateX(0); }
  .campaign-sheet-header {
    background: var(--blue);
    padding: 24px 28px 20px;
    color: white;
    flex-shrink: 0;
    position: relative;
  }
  .campaign-sheet-body { padding: 24px 28px; flex: 1; overflow-y: auto; }

  /* ── CONTACT SHEET BUSINESS CARD HEADER ── */
  .sheet-biz-card {
    display: flex;
    align-items: center;
    gap: 22px;
    flex: 1;
  }
  .sheet-avatar {
    width: 108px; height: 108px;
    border-radius: 50%;
    background: rgba(255,255,255,0.18);
    border: 2px solid rgba(255,255,255,0.35);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    font-family: 'Filson Pro', sans-serif; font-weight: 800;
    font-size: 36px;
    color: white;
    letter-spacing: 0.02em;
    overflow: hidden;
  }
  .sheet-avatar img { width: 100%; height: 100%; object-fit: cover; }
  .sheet-biz-info { flex: 1; min-width: 0; }
  .sheet-biz-info .detail-name { font-size: 34px; margin-bottom: 3px; line-height: 1.1; }
  .sheet-biz-subtitle { font-size: 15px; color: rgba(255,255,255,0.85); margin-bottom: 10px; }
  .subtitle-edit { cursor: text; border-radius: 3px; padding: 1px 3px; margin: -1px -3px; }
  .subtitle-edit:hover { background: rgba(255,255,255,0.15); color: white; }
  .subtitle-empty { font-style: italic; opacity: 0.45; }
  .subtitle-empty:hover { opacity: 0.8; }
  .sheet-biz-meta {
    display: flex; flex-direction: column; gap: 4px;
    font-size: 12.5px;
    color: rgba(255,255,255,0.82);
  }
  .sheet-biz-meta-row { display: flex; align-items: center; gap: 6px; cursor: default; border-radius: 4px; padding: 1px 3px; margin: -1px -3px; }
  .sheet-biz-meta-row.editable-meta:hover { background: rgba(255,255,255,0.1); cursor: text; }
  .sheet-biz-meta-row a { color: rgba(255,255,255,0.9); text-decoration: none; }
  .sheet-biz-meta-row a:hover { text-decoration: underline; color: white; }
  .sheet-biz-meta-icon { font-size: 12px; opacity: 0.7; flex-shrink: 0; }
  /* Inline edit inputs inside the dark header */
  .sheet-biz-meta-row input.inline-edit-input {
    background: rgba(255,255,255,0.18);
    border: 1px solid rgba(255,255,255,0.5);
    color: white;
    border-radius: 4px;
    padding: 2px 6px;
    font-size: 12.5px;
    font-family: inherit;
    outline: none;
    width: 220px;
  }
  .sheet-biz-meta-row input.inline-edit-input::placeholder { color: rgba(255,255,255,0.4); }
  .sheet-close-btn {
    position: absolute; top: 14px; right: 16px;
    background: rgba(255,255,255,0.15);
    border: none; color: white; font-size: 16px;
    width: 30px; height: 30px; border-radius: 50%;
    cursor: pointer; display: flex; align-items: center; justify-content: center;
  }
  .sheet-close-btn:hover { background: rgba(255,255,255,0.28); }

  /* ── SAVED VIEW SELECT ── */
  .view-select {
    height: 36px;
    border: 1px solid var(--blue);
    border-radius: 8px;
    padding: 0 10px;
    font-size: 13px;
    font-family: 'Filson Pro', sans-serif;
    background: white;
    color: var(--blue);
    outline: none;
    cursor: pointer;
    font-weight: 600;
    min-width: 170px;
  }

  /* ── PAGE HEADER ── */
  .page-header {
    display: flex;
    align-items: baseline;
    gap: 16px;
    margin-bottom: 24px;
  }

  .page-title {
    font-family: 'Filson Pro', sans-serif; font-weight: 800;
    font-size: 26px;
    color: var(--blue);
  }

  .page-count {
    font-size: 13px;
    color: var(--muted);
  }

  /* ── FILTER BAR ── */
  .filter-bar {
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
    flex-wrap: wrap;
    align-items: center;
  }

  .search-input {
    flex: 1;
    min-width: 200px;
    max-width: 320px;
    height: 36px;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 0 12px;
    font-size: 13px;
    font-family: 'Filson Pro', sans-serif;
    background: white;
    color: var(--text);
    outline: none;
    transition: border-color 0.15s;
  }

  .search-input:focus {
    border-color: var(--blue);
  }

  .filter-select {
    height: 36px;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 0 10px;
    font-size: 13px;
    font-family: 'Filson Pro', sans-serif;
    background: white;
    color: var(--text);
    outline: none;
    cursor: pointer;
  }

  /* ── CONTACT TABLE ── */
  .contact-table {
    background: white;
    border: 1px solid var(--border);
    border-radius: 12px;
    overflow: clip; /* clip keeps rounded corners but doesn't clip position:absolute children */
  }

  .contact-table table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;        /* visually same as collapse; unlocks row-level shadows */
    table-layout: fixed; /* required for drag-resize to stick */
  }

  .contact-table th {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--muted);
    padding: 12px 16px;
    text-align: left;
    background: var(--cream);
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
    cursor: pointer;
    user-select: none;
    /* Keep the header row visible while scrolling the list */
    position: sticky;
    top: 0;
    z-index: 5;
  }

  .contact-table th:hover {
    color: var(--blue);
  }

  .contact-table td {
    padding: 12px 16px;
    font-size: 14px;
    border-bottom: 1px solid var(--warm);
    vertical-align: middle;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .contact-table tr:last-child td {
    border-bottom: none;
  }

  .contact-table tbody tr {
    transition: transform 0.12s ease, box-shadow 0.12s ease;
    will-change: transform;
  }

  .contact-table tbody tr:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(21,80,105,0.13);
    z-index: 2;
    position: relative;
    cursor: pointer;
  }

  .contact-table tbody tr:hover td {
    background: var(--content-bg);
    cursor: pointer;
  }

  .contact-name {
    font-weight: 700;
    color: var(--blue);
    font-size: 14px;
  }

  .contact-name:hover {
    text-decoration: underline;
  }

  /* ── RATING BADGE ── */
  .badge {
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 10px;
  }

  .badge-hot  { background: var(--grey-100); color: var(--hot); }
  .badge-warm { background: var(--gold-25); color: var(--warm-c); }
  .badge-cold { background: #e6f0f5; color: var(--cold); }
  .badge-none { background: var(--grey-60); color: var(--muted); font-style: italic; }
  .badge[onclick]:hover { opacity: 0.75; transform: scale(1.08); transition: opacity .1s, transform .1s; }

  /* ── DETAIL PANEL ── */
  .detail-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.35);
    z-index: 200;
    animation: fadeIn 0.15s ease;
  }

  .detail-overlay.open {
    display: flex;
    justify-content: flex-end;
  }

  .detail-panel {
    width: 560px;
    max-width: 95vw;
    background: white;
    height: 100vh;
    overflow-y: auto;
    animation: slideIn 0.2s ease;
    display: flex;
    flex-direction: column;
  }

  @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
  @keyframes slideIn { from { transform: translateX(40px); opacity: 0; } to { transform: translateX(0); opacity: 1; } }

  .detail-header {
    background: var(--blue);
    padding: 24px 28px 20px;
    color: white;
    position: sticky;
    top: 0;
    z-index: 10;
  }

  .detail-close {
    position: absolute;
    top: 16px;
    right: 20px;
    background: rgba(255,255,255,0.15);
    border: none;
    color: white;
    width: 28px;
    height: 28px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.12s;
  }

  .detail-close:hover {
    background: rgba(255,255,255,0.25);
  }

  .detail-name {
    font-family: 'Filson Pro', sans-serif; font-weight: 800;
    font-size: 30px;
    margin-bottom: 5px;
    line-height: 1.15;
  }

  .detail-subtitle {
    font-size: 15px;
    opacity: 0.88;
  }

  .detail-body {
    padding: 24px 28px;
    flex: 1;
  }

  .detail-section {
    margin-bottom: 28px;
  }
  /* Compact quick-edit strip at top of body (title + company) */
  .detail-section.qe-strip {
    background: var(--warm);
    border-radius: 8px;
    padding: 10px 14px 8px;
    margin-bottom: 20px;
  }
  .qe-row { display: flex; gap: 20px; flex-wrap: wrap; }
  .qe-field { flex: 1; min-width: 120px; }
  .qe-field label { font-size: 10px; font-weight: 600; letter-spacing: 0.07em; text-transform: uppercase; color: var(--muted); display: block; margin-bottom: 3px; }
  .qe-field .value { font-size: 13px; }

  .detail-section-title {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--gold-dark);
    margin-bottom: 12px;
    padding: 10px 14px 8px 14px;
    border-bottom: 2px solid var(--gold);
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    user-select: none;
  }
  .detail-section-body {
    padding: 0 14px 14px 14px;
  }
  .detail-section-title .section-toggle {
    font-size: 14px;
    font-weight: 400;
    color: var(--muted);
    transition: transform 0.18s;
    flex-shrink: 0;
    margin-left: 8px;
  }
  .detail-section.collapsed .section-toggle { transform: rotate(-90deg); }
  .detail-section.collapsed .detail-section-body { display: none; }
  .detail-section-title .section-add-hint {
    font-size: 10px;
    font-weight: 500;
    color: var(--muted);
    letter-spacing: 0.04em;
    text-transform: none;
    font-style: italic;
    opacity: 0.7;
  }

  /* Roles & Relationships gets a bigger, heavier section title */
  #detail-types-section .detail-section-title {
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: var(--gold-dark);
    border-bottom: 2px solid var(--gold);
  }

  /* ── Dossier section ─────────────────────────────────────── */
  .dossier-field { margin-bottom: 6px; }
  .dossier-field.dossier-empty { margin-bottom: 2px; }
  .dossier-field label {
    display: inline;
    text-decoration: none;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--muted);
    margin-right: 6px;
  }
  .dossier-field:not(.dossier-empty) label { display: block; margin-bottom: 4px; margin-right: 0; }
  .dossier-value {
    font-size: 13px;
    text-decoration: none;
    line-height: 1.55;
    color: var(--text);
    cursor: text;
    border-radius: 5px;
    padding: 5px 7px;
    transition: background 0.12s;
    min-height: 26px;
  }
  .dossier-value:hover { background: var(--warm); }
  .dossier-value.empty {
    display: inline;
    padding: 0;
    min-height: unset;
    font-size: 11px;
    color: var(--muted);
    font-style: italic;
    border-radius: 0;
  }
  .dossier-value.empty:hover { background: none; text-decoration: underline dashed var(--muted); cursor: pointer; }
  .dossier-value textarea {
    width: 100%; border: 1px solid var(--gold); border-radius: 5px;
    padding: 6px 8px; font-size: 13px; font-family: inherit;
    line-height: 1.6; resize: vertical; min-height: 60px;
    background: var(--white); outline: none; color: var(--text);
  }
  .dossier-outreach-row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
  .dossier-priority-badge {
    display: inline-block; padding: 2px 10px; border-radius: 10px;
    font-size: 11px; font-weight: 700;
    background: var(--gold); color: var(--white);
  }
  .dossier-status-badge {
    display: inline-block; padding: 2px 10px; border-radius: 10px;
    font-size: 11px; font-weight: 600;
  }
  .dossier-status-not_started { background: var(--grey-60); color: var(--grey-450); }
  .dossier-status-in_progress { background: var(--gold-50); color: var(--gold-550); }
  .dossier-status-connected    { background: var(--emerald-100); color: var(--green-700); }
  .dossier-status-declined     { background: var(--red-100); color: var(--red-700); }
  .dossier-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 10px;
  }
  .dossier-grid .dossier-field { margin-bottom: 0; }
  .dossier-field-full { margin-bottom: 10px; }

  /* Tagline — the headline of the dossier. Deliberately oversized so the
     most important one-line descriptor stands out from everything else. */
  .dossier-tagline-field { margin-bottom: 14px; }
  .dossier-tagline-value {
    font-size: 20px;
    line-height: 1.3;
    font-weight: 700;
    color: var(--nav-bg, var(--emerald-750));
    padding: 7px 10px;
    min-height: 34px;
  }
  .dossier-tagline-value.empty {
    font-size: 15px;
    font-weight: 500;
    color: var(--muted);
    padding: 0;
    min-height: unset;
  }
  .dossier-tagline-value textarea {
    font-size: 19px;
    font-weight: 700;
    line-height: 1.3;
  }

  .detail-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
  }

  .detail-field label {
    display: block;
    font-size: 11px;
    font-weight: 500;
    color: var(--muted);
    margin-bottom: 3px;
  }

  .detail-field .value {
    font-size: 13px;
    color: var(--text);
    word-break: break-word;
  }

  .detail-field .value a {
    color: var(--blue);
    text-decoration: none;
  }

  .detail-field .value a:hover {
    text-decoration: underline;
  }

  .detail-field.full {
    grid-column: 1 / -1;
  }

  /* ── ACTIVITY ENTRIES ── */
  .activity-entry {
    border-left: 2px solid var(--border);
    padding: 0 0 16px 16px;
    position: relative;
    margin-bottom: 4px;
  }

  .activity-entry:last-child {
    padding-bottom: 0;
  }

  .activity-entry::before {
    content: '';
    position: absolute;
    left: -5px;
    top: 4px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--gold);
    border: 2px solid white;
  }

  .activity-date {
    font-size: 11px;
    font-weight: 600;
    color: var(--muted);
    margin-bottom: 4px;
  }

  .activity-note {
    font-size: 13px;
    line-height: 1.5;
    color: var(--text);
  }

  /* ── ACTIVITY FORM ── */
  .activity-form {
    margin-bottom: 16px;
  }
  .activity-form textarea {
    width: 100%;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 10px 12px;
    font-family: 'Filson Pro', sans-serif;
    font-size: 13px;
    color: var(--text);
    background: white;
    resize: vertical;
    min-height: 72px;
    outline: none;
    box-sizing: border-box;
  }
  .activity-form textarea:focus {
    border-color: var(--blue);
  }
  .activity-form-row {
    display: flex;
    justify-content: flex-end;
    margin-top: 8px;
  }
  .btn-log {
    background: var(--blue);
    color: white;
    border: none;
    border-radius: 6px;
    padding: 7px 18px;
    font-family: 'Filson Pro', sans-serif;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
  }
  .btn-log:hover { opacity: 0.9; }
  .btn-log:disabled { opacity: 0.5; cursor: default; }

  /* ── ACTIVITY TYPE SELECTOR & FILTER ── */
  .act-type-btn {
    padding: 3px 9px; border-radius: 14px; border: 1px solid var(--border);
    background: white; font-size: 11px; cursor: pointer; color: var(--muted);
    transition: all 0.15s; white-space: nowrap;
  }
  .act-type-btn.active {
    background: var(--blue); color: white; border-color: var(--blue);
  }
  .act-filter-chip {
    padding: 2px 8px; border-radius: 12px; border: 1px solid var(--border);
    background: white; font-size: 11px; cursor: pointer; color: var(--muted);
    transition: all 0.15s; white-space: nowrap;
  }
  .act-filter-chip.active {
    background: var(--sage, var(--emerald-375)); color: white; border-color: var(--sage, var(--emerald-375));
  }
  .act-type-badge {
    display: inline-block; font-size: 9px; font-weight: 700; padding: 1px 5px;
    border-radius: 8px; text-transform: uppercase; letter-spacing: .04em; margin-right: 3px;
  }
  .act-type-call    { background: #e3f2fd; color: #1565c0; }
  .act-type-meeting { background: var(--sage-25); color: var(--green-550); }
  .act-type-email   { background: #f3e5f5; color: #7b1fa2; }
  .act-type-note    { background: var(--gold-20); color: #f57f17; }
  .act-type-milestone { background: var(--red-50); color: #c62828; }

  /* ── COMPLETENESS SCORE BAR ── */
  .score-bar-wrap { display:flex; align-items:center; gap:4px; min-width:70px; }
  .score-bar { flex:1; height:5px; background:#e0e0e0; border-radius:3px; overflow:hidden; min-width:36px; }
  .score-bar-fill { height:100%; border-radius:3px; transition:width 0.3s; }

  /* ── PIPELINE BOARD ── */
  #pipeline-overlay {
    display:none; position:fixed; inset:0; background:rgba(0,0,0,.5);
    z-index:3500; align-items:flex-start; justify-content:center; padding-top:48px;
  }
  #pipeline-overlay.open { display:flex; }
  .pipeline-modal {
    background:var(--warm,#f5f3ee); border-radius:14px; width:92vw; max-width:1100px;
    max-height:86vh; display:flex; flex-direction:column; box-shadow:0 12px 48px rgba(0,0,0,.25);
    overflow:hidden;
  }
  .pipeline-header {
    background:var(--nav-bg,var(--emerald-750)); color:white; padding:14px 20px;
    display:flex; align-items:center; gap:10px; flex-shrink:0;
  }
  .pipeline-body {
    display:flex; gap:14px; padding:16px; overflow-x:auto; overflow-y:hidden; flex:1;
  }
  .pipeline-col {
    flex:1; min-width:240px; max-width:340px; display:flex; flex-direction:column; gap:0;
  }
  .pipeline-col-header {
    font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.06em;
    padding:8px 12px; border-radius:8px 8px 0 0; display:flex; align-items:center;
    justify-content:space-between;
  }
  .pipeline-col-body {
    background:rgba(255,255,255,.5); border-radius:0 0 8px 8px; flex:1; overflow-y:auto;
    padding:8px; min-height:200px; border:2px dashed transparent; transition:border-color .15s;
  }
  .pipeline-col-body.drag-over { border-color:var(--blue); background:rgba(30,100,200,.06); }
  .pipeline-card {
    background:white; border-radius:8px; padding:10px 12px; margin-bottom:8px;
    box-shadow:0 1px 4px rgba(0,0,0,.08); cursor:grab; transition:box-shadow .15s;
    border-left:3px solid var(--border);
  }
  .pipeline-card:hover { box-shadow:0 4px 12px rgba(0,0,0,.14); }
  .pipeline-card.dragging { opacity:.45; cursor:grabbing; }
  .pipeline-card-name { font-size:13px; font-weight:600; margin-bottom:2px; }
  .pipeline-card-sub  { font-size:11px; color:var(--muted); margin-bottom:4px; }
  .pipeline-card-last { font-size:10px; color:var(--muted); }

  /* ── TASK ENTRIES ── */
  .task-entry {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    background: var(--cream);
    border-radius: 8px;
    margin-bottom: 8px;
  }

  .task-check {
    width: 16px;
    height: 16px;
    border: 2px solid var(--border);
    border-radius: 4px;
    flex-shrink: 0;
    margin-top: 1px;
    cursor: pointer;
  }

  .inline-select {
    border: 1px solid var(--border);
    border-radius: 6px;
    padding: 3px 8px;
    font-family: 'Filson Pro', sans-serif;
    font-size: 13px;
    color: var(--text);
    background: white;
    cursor: pointer;
    outline: none;
  }
  .inline-select:focus { border-color: var(--blue); }

  .task-title {
    font-size: 13px;
    flex: 1;
    line-height: 1.4;
  }

  .task-due {
    font-size: 11px;
    color: var(--muted);
    white-space: nowrap;
  }

  /* ── TAG CHIPS ── */
  .tags-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 10px;
  }

  .tag-chip {
    font-size: 11px;
    font-weight: 500;
    padding: 3px 8px;
    background: var(--warm);
    color: var(--brown);
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
  }
  .tag-chip-rm {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--muted);
    font-size: 13px;
    line-height: 1;
    padding: 0;
    display: inline-flex;
    align-items: center;
  }
  .tag-chip-rm:hover { color: var(--red-550); }

  /* ── TAG INPUT ── */
  .tag-add-wrap {
    position: relative;
    margin-top: 6px;
  }
  .tag-add-input {
    width: 100%;
    height: 32px;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 0 10px;
    font-size: 12px;
    font-family: 'Filson Pro', sans-serif;
    outline: none;
    box-sizing: border-box;
    background: white;
    color: var(--text);
  }
  .tag-add-input:focus { border-color: var(--blue); }
  .tag-add-dropdown {
    position: absolute;
    top: calc(100% + 2px);
    left: 0; right: 0;
    background: white;
    border: 1px solid var(--border);
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    z-index: 500;
    max-height: 160px;
    overflow-y: auto;
    display: none;
  }
  .tag-add-dropdown.open { display: block; }
  .tag-dd-item {
    padding: 7px 12px;
    font-size: 12px;
    cursor: pointer;
    border-bottom: 1px solid var(--warm);
    color: var(--text);
  }
  .tag-dd-item:last-child { border-bottom: none; }
  .tag-dd-item:hover { background: var(--cream); }
  .tag-dd-create {
    color: var(--blue);
    font-weight: 600;
  }

  /* ── LOADING ── */
  .loading {
    text-align: center;
    padding: 60px;
    color: var(--muted);
    font-size: 14px;
  }

  .empty {
    text-align: center;
    padding: 48px;
    color: var(--muted);
    font-size: 14px;
  }

  /* ── EMAIL SECTION ── */
  .email-note {
    font-size: 12px;
    color: var(--muted);
    font-style: italic;
    padding: 10px 12px;
    background: var(--cream);
    border-radius: 8px;
  }

  /* ── CAMPAIGNS VIEW (legacy card classes — kept for fallback) ── */
  .btn-back { display:inline-flex; align-items:center; gap:6px; font-size:13px; color:var(--blue); cursor:pointer; background:none; border:none; padding:0; font-family:'Filson Pro',sans-serif; margin-bottom:20px; }
  .btn-back:hover { text-decoration:underline; }
  .btn-remove { background:none; border:1px solid var(--border); border-radius:6px; padding:3px 10px; font-size:12px; color:var(--muted); cursor:pointer; font-family:'Filson Pro',sans-serif; }
  .btn-remove:hover { border-color:var(--red-450); color:var(--red-450); }
  .campaign-pill { display:inline-flex; align-items:center; gap:4px; background:var(--blue); color:white; border-radius:20px; padding:3px 10px; font-size:12px; font-weight:500; margin-right:6px; margin-bottom:4px; }
  .campaign-pill button { background:none; border:none; cursor:pointer; color:white; opacity:0.7; font-size:14px; line-height:1; padding:0 0 0 4px; }
  .campaign-pill button:hover { opacity:1; }
  .add-campaign-row { display:flex; gap:8px; align-items:center; margin-top:10px; }

  /* ── TYPES & ROLES VIEW ──────────────────────────────────────────────────────── */
  .type-tabs { display:flex; gap:6px; margin-bottom:20px; }
  .type-tab { padding:6px 16px; border-radius:20px; font-size:13px; font-weight:500; cursor:pointer; border:1px solid var(--border); background:white; color:var(--muted); transition:all 0.15s; font-family:'Filson Pro',sans-serif; }
  .type-tab:hover { border-color:var(--blue); color:var(--blue); }
  .type-tab.active { background:var(--blue); color:white; border-color:var(--blue); }
  .type-list { background:white; border:1px solid var(--border); border-radius:12px; overflow:hidden; }
  .type-row { display:flex; align-items:center; gap:12px; padding:11px 16px; border-bottom:1px solid var(--warm); transition:background 0.1s; }
  .type-row:last-child { border-bottom:none; }
  .type-row:hover { background:var(--cream); }
  .type-row.dragging { opacity:0.35; }
  .type-row.drag-over { background:var(--warm); border-top:2px solid var(--blue); }
  .drag-handle { color:var(--muted); font-size:15px; cursor:grab; flex-shrink:0; line-height:1; user-select:none; opacity:0.5; }
  .drag-handle:hover { opacity:1; }
  .type-rank { font-size:11px; color:var(--muted); font-weight:600; width:22px; flex-shrink:0; text-align:right; }
  .type-contact-name { font-weight:500; color:var(--blue); flex:1; font-size:13px; cursor:pointer; }
  .type-contact-name:hover { text-decoration:underline; }
  .type-contact-company { font-size:12px; color:var(--muted); width:150px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex-shrink:0; }
  .type-stage-select { border:1px solid var(--border); border-radius:6px; padding:3px 8px; font-family:'Filson Pro',sans-serif; font-size:12px; color:var(--text); background:white; cursor:pointer; outline:none; }
  .type-stage-select:focus { border-color:var(--blue); }

  /* type rows in detail panel */
  .type-assign-row { display:flex; align-items:center; gap:8px; padding:8px 0; border-bottom:1px solid var(--warm); }
  .type-assign-row:last-of-type { border-bottom:none; }
  .type-assign-label { font-size:13px; font-weight:500; flex:1; }
  .btn-remove-type { background:none; border:1px solid var(--border); border-radius:6px; padding:2px 8px; font-size:11px; color:var(--muted); cursor:pointer; font-family:'Filson Pro',sans-serif; flex-shrink:0; }
  .btn-remove-type:hover { border-color:var(--red-450); color:var(--red-450); }
  .add-type-row { display:flex; gap:8px; align-items:center; margin-top:10px; }

  /* ── ROLES & RELATIONSHIPS — 4-column horizontal grid ── */
  .roles-grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:14px; }
  .roles-col { display:flex; flex-direction:column; min-width:0; }
  .roles-col-label {
    font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:0.06em;
    color:white; border-radius:4px; padding:5px 8px; margin-bottom:8px;
    text-align:center; white-space:nowrap;
  }
  .roles-col-type .roles-col-label      { background: var(--terra); }
  .roles-col-membership .roles-col-label { background: var(--sage); }
  .roles-col-personal .roles-col-label   { background: var(--blue); }
  .roles-col-industry .roles-col-label   { background: var(--gold); color:var(--gold-dark); }
  /* Keep old .roles-subsection for any legacy uses */
  .roles-subsection { display:flex; align-items:flex-start; gap:8px; margin-bottom:7px; }
  .roles-empty { font-size:12px; color:var(--muted); font-style:italic; padding:2px 0; }

  /* Introduced By / Associated With — compact, bold labels */
  .roles-intro-assoc-row { display:flex; gap:20px; margin-bottom:14px; flex-wrap:wrap; }
  .roles-intro-col  { width:220px; flex-shrink:0; }
  .roles-assoc-col  { flex:1; max-width:360px; }
  .roles-ia-label {
    font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:0.07em;
    color:var(--text); margin-bottom:5px;
  }

  /* Membership & Personal chips */
  .role-chips { display:flex; flex-wrap:wrap; gap:6px; }
  .role-chip { font-size:12px; font-weight:500; padding:7px 13px; border-radius:20px; border:1.5px solid var(--border); background:white; color:var(--muted); cursor:pointer; user-select:none; transition:all 0.15s; }
  .role-chip:hover { border-color:var(--blue); color:var(--blue); }
  .role-chip.active { background:var(--blue); color:white; border-color:var(--blue); }
  .role-chip.inherited { background:rgba(21,80,105,0.1); color:var(--blue); border-color:rgba(21,80,105,0.25); opacity:0.75; }
  .role-chip-add { font-size:14px; font-weight:400; padding:5px 9px; border-radius:20px; border:1.5px dashed var(--border); background:transparent; color:var(--muted); cursor:pointer; user-select:none; transition:all 0.15s; display:inline-flex; align-items:center; }
  .role-chip-add:hover { border-color:var(--blue); color:var(--blue); }
  .role-chip-inline-input { border:1.5px solid var(--blue); border-radius:20px; padding:3px 11px; font-size:12px; font-family:inherit; outline:none; width:110px; color:var(--text); }
  .industry-from-label { font-size:11px; color:var(--muted); margin-top:5px; font-style:italic; }
  .industry-clear-btn { background:none; border:none; color:var(--muted); cursor:pointer; font-size:11px; padding:0; margin-top:5px; text-decoration:underline; display:block; font-family:'Filson Pro',sans-serif; }
  .industry-clear-btn:hover { color:var(--blue); }

  /* (roles-intro-assoc-row now defined above in grid section) */

  /* Introduced By / Associated With contact chips */
  .role-contact-chip { display:inline-flex; align-items:center; gap:6px; background:var(--grey-40); border-radius:20px; padding:4px 10px 4px 12px; font-size:12px; max-width:100%; margin-bottom:4px; }
  .role-contact-chip span { color:var(--blue); cursor:pointer; font-weight:500; }
  .role-contact-chip span:hover { text-decoration:underline; }
  .role-contact-chip button { background:none; border:none; color:var(--muted); cursor:pointer; font-size:13px; padding:0; line-height:1; flex-shrink:0; }
  .role-contact-chip button:hover { color:var(--red-450); }
  .assoc-rel-badge { display:inline-block; background:var(--gold,var(--gold-300)); color:var(--white); border-radius:12px; padding:3px 10px; font-size:12px; font-weight:600; cursor:pointer; letter-spacing:0.02em; white-space:nowrap; transition:opacity .15s; }
  .assoc-rel-badge:hover { opacity:0.8; }
  .assoc-rel-badge.assoc-rel-unset { background:var(--border); color:var(--muted); font-weight:400; }
  .assoc-rel-select { font-size:11px; border:1.5px solid var(--gold,var(--gold-300)); border-radius:12px; padding:1px 5px; color:var(--text); background:var(--content-bg); cursor:pointer; outline:none; }

  /* Role contact search */
  .role-contact-search { position:relative; margin-top:4px; }
  .role-contact-search input { width:100%; padding:5px 10px; border:1px solid var(--border); border-radius:7px; font-size:12px; font-family:inherit; box-sizing:border-box; outline:none; }
  .role-contact-search input:focus { border-color:var(--blue); }
  .role-contact-dd { position:absolute; top:calc(100% + 2px); left:0; right:0; background:white; border:1px solid var(--border); border-radius:7px; box-shadow:0 4px 16px rgba(0,0,0,0.1); max-height:180px; overflow-y:auto; z-index:300; display:none; }
  .role-contact-dd.open { display:block; }
  .role-contact-dd-item { padding:7px 12px; font-size:12px; cursor:pointer; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .role-contact-dd-item:hover { background:var(--cream); }
  /* While a roles lookup is focused, let its dropdown escape the section's
     overflow:hidden (rounded-card clip) AND paint above the next section. */
  .detail-section:focus-within { position:relative; z-index:100; overflow:visible; }



  /* ── COLUMN CONFIGURATOR ── */
  .btn-cols {
    height: 36px;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 0 12px;
    font-family: 'Filson Pro', sans-serif;
    font-size: 13px;
    color: var(--muted);
    background: white;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: all 0.15s;
    white-space: nowrap;
  }
  .btn-cols:hover { border-color: var(--blue); color: var(--blue); }
  .col-modal-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.38);
    z-index: 400;
    align-items: center;
    justify-content: center;
  }
  .col-modal-backdrop.open { display: flex; }
  /* View Builder Modal */
  #view-builder-overlay {
    display:none; position:fixed; inset:0; background:rgba(0,0,0,0.45); z-index:1200;
    align-items:center; justify-content:center;
  }
  #view-builder-overlay.open { display:flex; }
  #view-builder-modal {
    background:white; border-radius:16px; box-shadow:0 20px 60px rgba(0,0,0,0.22);
    width:560px; max-width:95vw; max-height:90vh; overflow-y:auto; padding:28px 28px 24px;
  }
  .vb-title { font-size:18px; font-weight:700; color:var(--gold-dark); margin-bottom:18px; }
  .vb-label { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); margin-bottom:6px; margin-top:16px; }
  .vb-name-input { width:100%; box-sizing:border-box; padding:9px 12px; border:1px solid var(--border); border-radius:8px; font-size:15px; font-family:inherit; color:var(--text); outline:none; }
  .vb-name-input:focus { border-color:var(--blue); }
  /* Tag-input field for view builder */
  .vb-tag-field { display:flex; flex-wrap:wrap; align-items:center; gap:5px; min-height:36px;
    border:1px solid var(--border); border-radius:8px; padding:5px 8px; background:white; cursor:text; }
  .vb-tag-field:focus-within { border-color:var(--blue); }
  .vb-tag { display:inline-flex; align-items:center; gap:4px; background:var(--blue); color:white;
    border-radius:20px; padding:2px 8px 2px 11px; font-size:12px; font-weight:500; }
  .vb-tag-x { background:none; border:none; color:white; cursor:pointer; padding:0; font-size:14px;
    line-height:1; opacity:.7; margin-left:2px; }
  .vb-tag-x:hover { opacity:1; }
  .vb-tag-select { border:none; outline:none; font-size:12px; font-family:inherit; color:var(--muted);
    cursor:pointer; padding:2px 0; background:transparent; flex:1; min-width:120px; }
  /* Rating keeps original chip style — it's only 3 options */
  .vb-chips { display:flex; flex-wrap:wrap; gap:6px; }
  .vb-chip {
    padding:5px 13px; border-radius:20px; border:1px solid var(--border); font-size:12px;
    cursor:pointer; background:white; color:var(--text); transition:all 0.1s; user-select:none;
  }
  .vb-chip.on { background:var(--blue); color:white; border-color:var(--blue); font-weight:600; }
  /* ── Condition-row view builder ── */
  .vb-match-row { display:flex; align-items:center; gap:8px; margin:16px 0 10px; font-size:13px; color:var(--text); flex-wrap:wrap; }
  .vbc-match-select { border:1px solid var(--blue); border-radius:6px; padding:3px 10px; font-size:13px; font-weight:700; color:var(--blue); background:white; cursor:pointer; font-family:inherit; }
  .vbc-row { display:flex; align-items:flex-start; gap:8px; margin-bottom:8px; background:var(--white); border:1px solid var(--border); border-radius:8px; padding:8px 10px; }
  .vbc-field-select { border:1px solid var(--border); border-radius:6px; padding:5px 8px; font-size:12px; font-weight:600; color:var(--text); background:white; cursor:pointer; font-family:inherit; flex-shrink:0; min-width:140px; }
  .vbc-value-area { flex:1; min-width:0; }
  .vbc-tag-field { display:flex; flex-wrap:wrap; align-items:center; gap:5px; min-height:30px; padding:2px 0; }
  .vbc-keyword-input { width:100%; box-sizing:border-box; padding:5px 8px; border:1px solid var(--border); border-radius:6px; font-size:12px; font-family:inherit; color:var(--text); outline:none; }
  .vbc-keyword-input:focus { border-color:var(--blue); }
  .vbc-value-placeholder { font-size:12px; color:var(--muted); padding:5px 4px; font-style:italic; }
  .vbc-remove { background:none; border:none; color:var(--muted); font-size:20px; cursor:pointer; padding:0 2px; line-height:1; flex-shrink:0; align-self:center; }
  .vbc-remove:hover { color:var(--red-550); }
  .vbc-add-btn { display:block; width:100%; padding:8px; margin-top:4px; border:1.5px dashed var(--border); border-radius:8px; background:none; color:var(--blue); font-size:13px; font-weight:600; cursor:pointer; font-family:inherit; text-align:center; transition:all .15s; }
  .vbc-add-btn:hover { background:var(--grey-40); border-color:var(--blue); }
  /* Contact detail — active-only chip row */
  .role-active-row { display:flex; flex-wrap:wrap; gap:5px; align-items:center; }
  /* Base chip — teal (personal relationship) */
  .role-active-chip { display:inline-flex; align-items:center; gap:3px; background:var(--blue);
    color:white; border-radius:20px; padding:3px 6px 3px 11px; font-size:12px; font-weight:500; }
  .role-active-chip .rax { background:none; border:none; color:white; cursor:pointer; padding:0;
    font-size:14px; line-height:1; opacity:.65; }
  .role-active-chip .rax:hover { opacity:1; }
  /* Membership chips — sage */
  .role-active-chip.chip-membership { background:var(--sage); color:white; }
  /* Contact type chips — terracotta */
  .role-active-chip.chip-type { background:var(--terra); color:white; }
  /* Industry chips — gold */
  .role-active-chip.chip-industry { background:var(--gold); color:white; }
  /* Personal chips — teal (default, already handled above) */
  .role-add-btn { display:inline-flex; align-items:center; gap:3px; background:none;
    border:1.5px dashed var(--border); border-radius:20px; padding:3px 11px; font-size:12px;
    color:var(--muted); cursor:pointer; font-family:inherit; transition:all .15s; }
  .role-add-btn:hover { border-color:var(--blue); color:var(--blue); }
  .role-add-dropdown { position:absolute; z-index:200; background:white; border:1px solid var(--border);
    border-radius:10px; box-shadow:0 6px 24px rgba(0,0,0,.14); min-width:180px; max-height:220px;
    overflow-y:auto; padding:4px 0; }
  .role-add-dropdown .rad-item { padding:7px 14px; font-size:13px; cursor:pointer; }
  .role-add-dropdown .rad-item:hover { background:var(--light); color:var(--blue); }
  .vb-footer { display:flex; gap:10px; margin-top:24px; align-items:center; }
  .vb-save { background:var(--blue); color:white; border:none; border-radius:8px; padding:10px 22px; font-size:14px; font-weight:700; cursor:pointer; font-family:inherit; }
  .vb-save:hover { opacity:.9; }
  .vb-cancel { background:none; border:1px solid var(--border); border-radius:8px; padding:10px 16px; font-size:14px; cursor:pointer; font-family:inherit; color:var(--muted); }
  .vb-delete { margin-left:auto; background:none; border:none; color:var(--red-550); font-size:13px; cursor:pointer; padding:0; font-family:inherit; }
  .vb-delete:hover { text-decoration:underline; }
  .vb-section-divider { height:1px; background:var(--border); margin:20px 0 4px; }
  .vb-saved-list { margin-top:8px; }
  .vb-saved-item { display:flex; align-items:center; justify-content:space-between; padding:8px 10px; border-radius:7px; }
  .vb-saved-item:hover { background:var(--grey-40); }
  .vb-saved-item-name { font-size:13px; font-weight:600; color:var(--text); flex:1; }
  .vb-saved-item-edit { background:none; border:1px solid var(--border); border-radius:5px; color:var(--blue); font-size:12px; cursor:pointer; padding:2px 8px; font-weight:500; }
  .vb-saved-item-edit:hover { background:var(--blue); color:white; border-color:var(--blue); }
  .vb-saved-item-del { background:none; border:1px solid var(--border); border-radius:5px; color:var(--muted); font-size:12px; cursor:pointer; padding:2px 8px; }
  .vb-saved-item-del:hover { background:var(--red-550); color:white; border-color:var(--red-550); }

  .col-modal {
    background: white;
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.22);
    width: 640px;
    max-width: 95vw;
    max-height: 85vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }
  .col-modal-hd {
    background: var(--blue);
    color: white;
    padding: 18px 24px 14px;
    position: relative;
    flex-shrink: 0;
  }
  .col-modal-title { font-family: 'Filson Pro', sans-serif; font-weight: 800; font-size: 20px; margin-bottom: 2px; }
  .col-modal-sub   { font-size: 13px; opacity: 0.7; }
  .col-modal-body {
    display: flex;
    gap: 0;
    flex: 1;
    overflow: hidden;
    border-bottom: 1px solid var(--border);
  }
  .col-pane {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }
  .col-pane + .col-pane { border-left: 1px solid var(--border); }
  .col-pane-title {
    padding: 12px 16px 8px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--muted);
    background: var(--cream);
    border-bottom: 1px solid var(--border);
    flex-shrink: 0;
  }
  .col-pane-list { flex: 1; overflow-y: auto; padding: 8px; }
  .col-field-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 10px;
    border-radius: 8px;
    margin-bottom: 4px;
    font-size: 13px;
    cursor: pointer;
    border: 1px solid transparent;
    transition: all 0.1s;
    background: white;
    border-color: var(--border);
  }
  .col-field-item:hover { border-color: var(--blue); color: var(--blue); }
  .col-field-item.drag-over { border-color: var(--blue); background: var(--grey-40); }
  .col-field-item.dragging  { opacity: 0.35; }
  .col-add-btn { margin-left: auto; font-size: 16px; color: var(--muted); font-weight: 300; }
  .col-add-btn:hover { color: var(--blue); }
  .col-rm-btn  { margin-left: auto; font-size: 15px; color: var(--muted); line-height: 1; }
  .col-rm-btn:hover { color: var(--red-450); }
  .col-req-tag { margin-left: auto; font-size: 10px; color: var(--muted); background: var(--warm); border-radius: 4px; padding: 1px 5px; }
  .col-modal-ft {
    padding: 14px 20px;
    display: flex;
    gap: 10px;
    align-items: center;
    flex-shrink: 0;
  }
  .col-modal-ft .btn-log { height: 36px; padding: 0 18px; }
  .col-save-view-btn {
    height: 36px;
    border: 1px solid var(--blue);
    border-radius: 8px;
    padding: 0 14px;
    font-family: 'Filson Pro', sans-serif;
    font-size: 13px;
    color: var(--blue);
    background: white;
    cursor: pointer;
    font-weight: 600;
  }
  .col-save-view-btn:hover { background: var(--blue); color: white; }
  .col-cancel-btn {
    height: 36px;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 0 14px;
    font-family: 'Filson Pro', sans-serif;
    font-size: 13px;
    color: var(--muted);
    background: white;
    cursor: pointer;
    margin-left: auto;
  }
  .col-cancel-btn:hover { border-color: var(--muted); color: var(--text); }
  .col-empty { padding: 20px; text-align: center; color: var(--muted); font-size: 13px; font-style: italic; }
  /* ── SIDEBAR CALENDAR ── */
  .sidebar-cal {
    background: var(--teal);
    color: white;
    padding: 20px 16px 14px;
    cursor: pointer;
    transition: opacity 0.15s;
    text-align: center;
    border-bottom: 1px solid rgba(255,255,255,0.12);
    flex-shrink: 0;
  }
  .sidebar-cal:hover { opacity: 0.88; }
  .sb-cal-num {
    font-family: 'Filson Pro', sans-serif; font-weight: 800;
    font-size: 52px;
    line-height: 1;
    color: white;
    margin-bottom: 2px;
  }
  .sb-cal-month {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.8);
    margin-bottom: 2px;
  }
  .sb-cal-weekday {
    font-size: 12px;
    color: rgba(255,255,255,0.55);
    margin-bottom: 10px;
  }
  .sb-cal-link {
    font-size: 10px;
    color: rgba(255,255,255,0.4);
    letter-spacing: 0.02em;
  }
  .sidebar-divider {
    height: 1px;
    background: var(--border);
    margin: 0;
  }
  /* ── RIGHT PANEL ── */
  .right-panel {
    width: 300px;
    flex-shrink: 0;
    background: var(--content-bg);
    border-left: 2px solid var(--border);
    position: sticky;
    top: calc(68px + var(--subbar-h));
    height: calc(100vh - 68px - var(--subbar-h));
    overflow-y: auto;
    overscroll-behavior: contain; /* don't chain scroll into the page/background */
    display: flex;
    flex-direction: column;
    transition: background 0.2s, border-color 0.2s;
    z-index: 270; /* sits above all sheet backdrops (z-index 250) — always visible and clickable */
  }
  /* Active state — lights up when a contact is open */
  .right-panel.rp-active {
    background: white;
    border-left: 3px solid var(--gold);
  }
  .right-panel.rp-active .rp-section {
    box-shadow: 0 2px 8px rgba(0,0,0,0.09);
  }

  /* ── 3D card depth system ─────────────────────────────── */
  .contact-sheet {
    box-shadow: -8px 0 48px rgba(0,0,0,0.28), -2px 0 12px rgba(0,0,0,0.18), 0 12px 60px rgba(0,0,0,0.15) !important;
    border-left: 1px solid rgba(0,0,0,0.08);
  }
  .org-detail-panel.active, .camp-detail-panel.active {
    box-shadow: -4px 0 32px rgba(0,0,0,0.16), -1px 0 8px rgba(0,0,0,0.10);
  }
  .right-panel.rp-active {
    box-shadow: -3px 0 20px rgba(0,0,0,0.12), -1px 0 6px rgba(0,0,0,0.08);
  }
  .detail-section {
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    margin-bottom: 8px;
    background: var(--white);
    border: 1px solid var(--border);
    overflow: hidden;
  }
  .detail-section-title {
    background: linear-gradient(135deg, var(--content-bg) 0%, var(--grey-50) 100%);
  }
  .report-card {
    box-shadow: 0 2px 8px rgba(0,0,0,0.07), 0 1px 3px rgba(0,0,0,0.05);
    border-radius: 10px;
  }
  .camp-member-item {
    border-radius: 8px;
    transition: box-shadow 0.15s, transform 0.15s;
  }
  .camp-member-item:hover {
    box-shadow: 0 2px 10px rgba(0,0,0,0.10);
    transform: translateY(-1px);
  }
  .rp-calendar-header {
    background: var(--blue);
    color: white;
    padding: 16px;
    cursor: pointer;
    text-decoration: none;
    display: block;
    transition: opacity 0.15s;
    flex-shrink: 0;
  }
  .rp-calendar-header:hover { opacity: 0.88; }
  .rp-cal-date {
    font-family: 'Filson Pro', sans-serif; font-weight: 800;
    font-size: 16px;
    margin-bottom: 2px;
  }
  .rp-cal-day { font-size: 12px; opacity: 0.7; }
  .rp-cal-link { font-size: 11px; opacity: 0.55; margin-top: 8px; }
  .rp-section {
    border-bottom: none;
    flex-shrink: 0;
    background: white;
    margin: 0 12px 10px;
    border-radius: 8px;
    border: 1px solid var(--border);
    overflow: hidden;
    box-shadow: 0 2px 6px rgba(0,0,0,0.07);
  }
  .rp-section:last-child { flex-shrink: 1; margin-bottom: 12px; }
  .rp-section-label {
    padding: 9px 14px 8px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    background: var(--plum);
    color: white;
    border-bottom: none;
  }
  .rp-task-item {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 8px 16px;
    border-bottom: 1px solid var(--warm);
    cursor: pointer;
    transition: background 0.1s;
  }
  .rp-task-item:last-child { border-bottom: none; }
  .rp-task-item:hover { background: var(--cream); }
  .rp-task-dot {
    width: 7px; height: 7px;
    border-radius: 50%;
    background: var(--gold);
    margin-top: 5px;
    flex-shrink: 0;
  }
  .rp-task-text { font-size: 13px; line-height: 1.4; flex: 1; min-width: 0; color: var(--text); }
  .rp-task-meta { font-size: 11px; color: var(--muted); white-space: nowrap; }
  .rp-act-item {
    padding: 8px 16px;
    border-bottom: 1px solid var(--warm);
    cursor: pointer;
    transition: background 0.1s;
  }
  .rp-act-item:last-child { border-bottom: none; }
  .rp-act-item:hover { background: var(--cream); }
  .rp-act-date { font-size: 11px; color: var(--muted); font-weight: 600; margin-bottom: 3px; }
  .rp-act-text { font-size: 13px; color: var(--text); line-height: 1.4; }
  .rp-empty { padding: 10px 16px; font-size: 13px; color: var(--muted); font-style: italic; }

  /* ── SALES VIEW ── */
  .sales-header-bar { display:flex; align-items:center; justify-content:space-between; padding:20px 28px 12px; border-bottom:1px solid var(--border); flex-shrink:0; }
  .btn-add-sale { background:var(--blue); color:var(--white); border:none; border-radius:6px; padding:8px 16px; font-size:13px; font-weight:600; cursor:pointer; }
  .btn-add-sale:hover { background:var(--blue-600); }
  .sales-products-strip { display:flex; gap:14px; padding:16px 28px; overflow-x:auto; border-bottom:1px solid var(--border); flex-shrink:0; }
  .product-card { background:var(--white); border:1px solid var(--border); border-radius:10px; padding:14px 16px; min-width:220px; max-width:260px; flex-shrink:0; box-shadow:0 1px 4px rgba(0,0,0,.06); }
  .product-card-name { font-weight:700; font-size:13px; color:var(--text); margin-bottom:4px; }
  .product-card-sku { font-size:11px; color:var(--muted); margin-bottom:6px; }
  .product-card-price { font-size:18px; font-weight:700; color:var(--blue); }
  .product-card-ship { font-size:11px; color:var(--muted); margin-top:3px; }
  .product-card-btn { margin-top:10px; font-size:11px; color:var(--blue); cursor:pointer; background:none; border:none; padding:0; text-decoration:underline; }
  .sales-list-header { padding:12px 28px 6px; font-size:12px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; border-bottom:1px solid var(--border); display:flex; align-items:center; }
  .sale-payments-detail { padding:0 18px 10px 18px; display:flex; flex-direction:column; gap:4px; }
  .payment-row { display:flex; align-items:center; gap:12px; font-size:12px; color:var(--muted); padding:3px 0; border-bottom:1px dashed var(--border); }
  .payment-row:last-child { border-bottom:none; }
  .payment-date { min-width:90px; }
  .payment-amount { font-weight:600; color:var(--teal); min-width:80px; }
  .payment-notes { flex:1; font-style:italic; }
  .btn-delete-payment { background:none; border:none; cursor:pointer; color:#c00; font-size:12px; padding:0 4px; opacity:0.5; }
  .btn-delete-payment:hover { opacity:1; }
  .btn-edit-sale, .btn-delete-sale { background:none; border:none; cursor:pointer; font-size:14px; padding:2px 4px; opacity:0.5; }
  .btn-edit-sale:hover, .btn-delete-sale:hover { opacity:1; }
  #sales-list-body { flex:1; overflow-y:auto; padding:16px 28px; display:flex; flex-direction:column; gap:10px; }
  .sale-row { background:var(--white); border:1px solid var(--border); border-radius:10px; padding:14px 18px; display:flex; align-items:center; gap:16px; box-shadow:0 1px 4px rgba(0,0,0,.04); }
  .sale-row-info { flex:1; min-width:0; }
  .sale-row-contact { font-weight:700; font-size:14px; color:var(--text); }
  .sale-row-product { font-size:12px; color:var(--muted); margin-top:2px; }
  .sale-row-date { font-size:11px; color:var(--muted); margin-top:2px; }
  .sale-row-amounts { text-align:right; flex-shrink:0; }
  .sale-row-total { font-size:13px; color:var(--muted); }
  .sale-row-paid { font-size:16px; font-weight:700; color:var(--green-550); }
  .sale-row-balance { font-size:12px; color:var(--red-550); font-weight:600; margin-top:2px; }
  .sale-status-badge { display:inline-block; border-radius:12px; font-size:11px; font-weight:700; padding:2px 10px; }
  .status-paid    { background:var(--sage-25); color:var(--green-550); }
  .status-partial { background:var(--gold-25); color:#e65100; }
  .status-pending { background:var(--red-50); color:var(--red-600); }
  .sale-row-actions { display:flex; flex-direction:column; gap:6px; flex-shrink:0; }
  .btn-pay { background:#f0f7ff; color:var(--blue); border:1px solid var(--blue); border-radius:5px; padding:5px 10px; font-size:11px; font-weight:600; cursor:pointer; }
  .btn-pay:hover { background:var(--blue); color:var(--white); }
  /* Sales section inside contact sheet */
  .sales-section-hd { display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
  .contact-sale-card { border:1px solid var(--border); border-radius:8px; padding:12px 14px; margin-bottom:8px; background:var(--white); }
  .contact-sale-card-top { display:flex; align-items:flex-start; justify-content:space-between; }
  .contact-sale-product { font-weight:700; font-size:13px; color:var(--text); }
  .contact-sale-date { font-size:11px; color:var(--muted); margin-top:2px; }
  .contact-sale-right { text-align:right; }
  .contact-sale-paid { font-size:15px; font-weight:700; color:var(--green-550); }
  .contact-sale-balance { font-size:11px; color:var(--red-550); font-weight:600; }
  .contact-sale-payments { margin-top:8px; border-top:1px solid var(--border); padding-top:8px; }
  .payment-line { display:flex; justify-content:space-between; font-size:12px; color:var(--muted); margin-bottom:3px; }
  /* Add Sale / Payment modals */
  .sale-modal-backdrop { position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:3000; display:flex; align-items:center; justify-content:center; }
  .sale-modal { background:var(--white); border-radius:14px; padding:28px 32px; width:420px; max-width:95vw; box-shadow:0 8px 40px rgba(0,0,0,.22); }
  .sale-modal-title { font-family:'Filson Pro',sans-serif;font-weight:800; font-size:20px; color:var(--blue); margin-bottom:20px; }
  .sale-modal label { display:block; font-size:12px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; margin-bottom:4px; margin-top:14px; }
  .sale-modal input, .sale-modal select, .sale-modal textarea { width:100%; border:1px solid var(--border); border-radius:6px; padding:8px 10px; font-size:13px; box-sizing:border-box; }
  .sale-modal-btns { display:flex; gap:10px; margin-top:20px; justify-content:flex-end; }
  .btn-modal-save { background:var(--blue); color:var(--white); border:none; border-radius:6px; padding:9px 20px; font-size:13px; font-weight:700; cursor:pointer; }
  .btn-modal-cancel { background:none; border:1px solid var(--border); border-radius:6px; padding:9px 16px; font-size:13px; cursor:pointer; color:var(--muted); }

  .rp-contact-hd {
    background: var(--blue);
    color: white;
    padding: 16px 16px 14px;
    flex-shrink: 0;
    margin-bottom: 12px;
  }
  .rp-contact-hd-name { font-family: 'Filson Pro', sans-serif; font-weight: 800; font-size: 17px; margin-bottom: 3px; }
  .rp-contact-hd-sub { font-size: 12px; opacity: 0.75; }

  /* ── RIGHT PANEL: PIPELINE FIELDS ── */
  .rp-pipeline-field {
    padding: 9px 16px;
    border-bottom: 1px solid var(--warm);
  }
  .rp-pipeline-field:last-child { border-bottom: none; }
  .rp-pipeline-field label {
    display: block;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: var(--muted);
    margin-bottom: 4px;
  }
  .rp-pipeline-select {
    width: 100%;
    border: 1px solid var(--border);
    border-radius: 5px;
    padding: 6px 8px;
    font-size: 13px;
    font-family: 'Filson Pro', sans-serif;
    background: white;
    color: var(--text);
    outline: none;
    cursor: pointer;
    font-weight: 500;
  }
  .rp-pipeline-select:focus { border-color: var(--blue); }
  .rp-pipeline-val { font-size: 13px; color: var(--text); font-weight: 500; }

  /* ── RIGHT PANEL: CAMPAIGNS ── */
  .rp-campaign-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border-bottom: 1px solid var(--warm);
  }
  .rp-campaign-item:last-child { border-bottom: none; }
  .rp-campaign-name { flex: 1; color: var(--text); font-size: 13px; line-height: 1.3; font-weight: 500; }
  .rp-campaign-remove {
    background: none; border: none;
    color: var(--muted); cursor: pointer;
    font-size: 13px; padding: 0 2px; line-height: 1;
    flex-shrink: 0;
  }
  .rp-campaign-remove:hover { color: var(--red-550); }
  .rp-add-row {
    display: flex; flex-direction: column; gap: 6px;
    padding: 8px 16px 12px;
  }
  .rp-add-row select {
    width: 100%;
    border: 1px solid var(--border);
    border-radius: 5px;
    padding: 6px 8px;
    font-size: 12px;
    font-family: 'Filson Pro', sans-serif;
    outline: none;
    background: white;
    box-sizing: border-box;
  }
  .rp-add-row button {
    width: 100%;
    background: var(--blue); color: white;
    border: none; border-radius: 5px;
    padding: 7px 0; font-size: 12px;
    cursor: pointer; font-weight: 700;
    font-family: 'Filson Pro', sans-serif;
    letter-spacing: 0.03em;
  }
  .rp-add-row button:hover { background: var(--blue-600); }

  /* ── ORGANIZATIONS VIEW ── */
  /* ── ORGANIZATIONS VIEW — two-column dashboard ── */
  #view-organizations {
    display: flex;
    flex-direction: row;
    flex: 1;
    overflow: hidden;
  }
  .org-sidebar {
    width: var(--sidebar);
    min-width: var(--sidebar);
    max-width: var(--sidebar);
    flex-shrink: 0;
    background: white;
    border-right: 1px solid var(--border);
    padding: 20px 0;
    overflow-y: auto;
  }
  .org-main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }
  .org-header-bar {
    padding: 20px 32px 14px;
    flex-shrink: 0;
    background: var(--cream);
    border-bottom: 1px solid var(--border);
  }
  .org-table-area {
    flex: 1;
    overflow-y: auto;
    padding: 0 32px 24px;
  }
  /* Right detail panel */
  .org-detail-panel {
    width: 300px;
    flex-shrink: 0;
    background: var(--content-bg);
    border-left: 2px solid var(--border);
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    transition: background 0.2s, border-color 0.2s;
  }
  .org-detail-panel.active {
    background: white;
    border-left: 3px solid var(--gold);
  }
  .org-dp-empty {
    flex: 1; display: flex; align-items: center; justify-content: center;
    color: var(--muted); font-size: 13px; text-align: center; padding: 32px 20px; font-style: italic;
  }
  .org-dp-header {
    background: var(--gold); color: var(--gold-dark);
    padding: 20px 18px 16px; flex-shrink: 0;
  }
  .org-dp-name { font-size: 17px; font-weight: 700; margin-bottom: 4px; }
  .org-dp-sub  { font-size: 12px; opacity: 0.75; }
  .org-dp-body { padding: 16px; flex: 1; }

  /* ── Projects view ── */
  .proj-cat-btn {
    padding: 7px 10px; font-size: 12px; border-radius: 6px; cursor: pointer;
    color: var(--text); border: 1px solid transparent; font-weight: 500;
    transition: background .15s;
  }
  .proj-cat-btn:hover { background: var(--warm); }
  .proj-cat-btn.active, .proj-cat-btn.active-status { background: var(--plum,var(--plum-550)); color: var(--white); font-weight: 600; }
  .proj-col-header {
    font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em;
    color: var(--muted); padding: 0 4px 10px; display: flex; align-items: center; gap: 6px;
  }
  .proj-col-header .proj-col-count { background: var(--warm); border-radius: 10px; padding: 1px 7px; font-size: 11px; color: var(--text); }
  .proj-card {
    background: white; border: 1px solid var(--border); border-radius: 10px;
    padding: 12px 14px; margin-bottom: 10px; cursor: pointer;
    transition: box-shadow .15s, transform .1s;
    border-left: 4px solid var(--border);
  }
  .proj-card:hover { box-shadow: 0 4px 14px rgba(0,0,0,.1); transform: translateY(-1px); }
  .proj-card.pri-high   { border-left-color: var(--red-550); }
  .proj-card.pri-medium { border-left-color: var(--gold,#c87800); }
  .proj-card.pri-low    { border-left-color: var(--teal,var(--emerald-550)); }
  .proj-card-title { font-size: 13px; font-weight: 600; color: var(--text); margin-bottom: 5px; line-height: 1.4; }
  .proj-card-meta  { font-size: 11px; color: var(--muted); display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
  .proj-card-cat   { background: var(--content-bg); border: 1px solid var(--border); border-radius: 10px; padding: 1px 7px; }
  .proj-card-due.overdue { color: var(--red-550); font-weight: 600; }
  .proj-kanban-col { display: flex; flex-direction: column; }
  .proj-kanban-col-inner { background: var(--content-bg); border-radius: 10px; padding: 12px; min-height: 80px; }
  .org-dp-section-title {
    font-size: 11px; font-weight: 700; text-transform: uppercase;
    letter-spacing: 0.07em; color: var(--gold-dark);
    margin-bottom: 10px; padding-bottom: 6px; border-bottom: 2px solid var(--gold);
  }
  /* Sidebar filter items */
  .org-sf-item {
    display: flex; align-items: center; justify-content: space-between;
    padding: 5px 10px; font-size: 12px; cursor: pointer;
    border-radius: 5px; margin: 1px 6px; transition: background 0.1s;
  }
  .org-sf-item:hover { background: var(--warm); }

  /* Org table row hover — 3D pop matching contact table */
  #org-tbody tr {
    transition: transform 0.12s ease, box-shadow 0.12s ease;
  }
  #org-tbody tr:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(21,80,105,0.13);
    z-index: 2;
    position: relative;
    cursor: pointer;
  }
  #org-tbody tr:hover td { background: var(--content-bg); }
  #org-tbody tr.selected td { background: var(--cream); }
  .org-row-type { font-size: 11px; color: var(--muted); margin-top: 1px; font-style: italic; }
  .org-sf-item.active { background: var(--sage); color: white; font-weight: 600; }
  .org-sf-item .sf-count { font-size: 11px; opacity: 0.6; }
  .org-sf-item.active .sf-count { opacity: 0.8; }
  /* Contact rows inside org detail panel */
  .org-contact-row {
    display: flex; flex-direction: column;
    padding: 8px 10px; margin: 0 -10px;
    border-bottom: 1px solid var(--warm);
    cursor: pointer; transition: background 0.1s; border-radius: 4px;
  }
  .org-contact-row:hover { background: var(--cream); }
  .org-contact-row:last-child { border-bottom: none; }
  .org-contact-name { font-weight: 600; font-size: 13px; color: var(--blue); }
  .org-contact-meta { font-size: 12px; color: var(--muted); margin-top: 2px; }

  /* ── ORG CARD GRID ── */
  #org-card-grid {
    display: none;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 14px;
    padding: 20px 32px;
    overflow-y: auto;
    flex: 1;
    align-content: start;
  }
  .org-card {
    background: white; border: 1px solid var(--border); border-radius: 12px;
    padding: 16px 18px; cursor: pointer;
    transition: box-shadow .15s, transform .1s;
    display: flex; flex-direction: column; gap: 0;
  }
  .org-card:hover { box-shadow: 0 6px 24px rgba(0,0,0,0.13); transform: translateY(-2px); }
  .org-card-logo {
    width: 42px; height: 42px; border-radius: 10px;
    background: var(--gold); display: flex; align-items: center; justify-content: center;
    font-size: 17px; font-weight: 800; color: var(--gold-dark); flex-shrink: 0; margin-bottom: 10px;
  }
  .org-card-name { font-size: 14px; font-weight: 700; color: var(--text); line-height: 1.3; }
  .org-card-type { font-size: 11px; color: var(--muted); margin-top: 2px; font-style: italic; }
  .org-card-meta { font-size: 11px; color: var(--muted); margin-top: 8px; display: flex; flex-wrap: wrap; gap: 5px; align-items: center; }
  .org-card-badge { background: var(--content-bg); border: 1px solid var(--border); border-radius: 10px; padding: 1px 8px; font-size: 11px; font-weight: 500; }
  .org-card-status { border-radius: 10px; padding: 1px 8px; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
  .org-card-status.client   { background: var(--emerald-100); color: #1a5c30; }
  .org-card-status.prospect { background: var(--gold-50); color: #7d5a00; }
  .org-card-status.partner  { background: #d1ecf1; color: #0c5460; }
  .org-card-status.vendor   { background: var(--red-100); color: var(--red-700); }
  .org-card-status.inactive { background: var(--warm); color: var(--muted); }

  /* ── ORG BOTTOM SHEET ── */
  .org-sheet-backdrop {
    position: fixed; top: 88px; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.32); z-index: 260; display: none; cursor: pointer;
  }
  .org-sheet-backdrop.open { display: block; }
  .org-sheet {
    position: absolute; top: 0; bottom: 0;
    left: var(--sidebar); right: 0;
    background: white; box-shadow: -4px 0 40px rgba(0,0,0,0.22);
    overflow: hidden; transform: translateX(100%);
    transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1);
    cursor: default; display: flex; flex-direction: column;
  }
  .org-sheet.open { transform: translateX(0); }
  .org-sheet-header {
    background: #73bda2; color: var(--emerald-775);
    padding: 22px 28px 16px; flex-shrink: 0; position: relative;
  }
  .org-sheet-title { font-size: 22px; font-weight: 800; font-family: 'Filson Pro',sans-serif; line-height: 1.2; margin-bottom: 4px; color: var(--emerald-775); }
  .org-sheet-sub   { font-size: 13px; opacity: 0.75; color: var(--emerald-775); }
  .org-sheet-body  { flex: 1; overflow: hidden; display: flex; }
  .org-sheet-left  { flex: 1; min-width: 0; padding: 22px 26px; overflow-y: auto; border-right: 1px solid var(--border); }
  .org-sheet-right { width: 320px; flex-shrink: 0; padding: 22px 18px; overflow-y: auto; background: var(--content-bg); }
  .org-sheet-section { margin-bottom: 22px; }
  .org-sheet-section-title {
    font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
    color: var(--gold-dark); margin-bottom: 12px; padding: 10px 14px 8px 0; border-bottom: 2px solid var(--gold);
    display: flex; align-items: center; justify-content: space-between;
  }
  .org-sheet-field-table { width: 100%; border-collapse: collapse; font-size: 12px; }
  .org-sheet-field-table td { padding: 5px 0; vertical-align: top; }
  .org-sheet-field-table td:first-child { color: var(--muted); width: 110px; flex-shrink: 0; }
  .org-view-toggle { display: flex; border: 1px solid var(--border); border-radius: 6px; overflow: hidden; }
  .org-view-toggle button { border: none; padding: 5px 10px; background: white; cursor: pointer; font-size: 13px; color: var(--muted); transition: background .1s, color .1s; }
  .org-view-toggle button.active { background: var(--plum); color: white; }

  /* ── SORT INDICATOR ── */
  .sort-arrow { display: inline-block; margin-left: 4px; opacity: 0.5; font-size: 10px; }
  .sort-arrow.asc::after  { content: '↑'; }
  .sort-arrow.desc::after { content: '↓'; }

  /* ── INLINE FIELD EDITING ── */
  .editable-value {
    cursor: pointer;
    display: inline-block;
    min-width: 40px;
    min-height: 16px;
    padding: 2px 5px;
    margin: -2px -5px;
    border-radius: 4px;
    transition: background 0.12s;
    position: relative;
    word-break: break-word;
  }
  .editable-value:hover {
    background: var(--grey-40);
  }
  .editable-value:hover::after {
    content: '✎ edit';
    position: absolute;
    right: -16px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 10px;
    color: var(--blue);
    opacity: 0.55;
  }
  .editable-value.editing { background: transparent; }
  .editable-value input,
  .editable-value textarea {
    width: 100%;
    padding: 4px 6px;
    border: 1.5px solid var(--blue);
    border-radius: 4px;
    font-size: 13px;
    font-family: 'Filson Pro', sans-serif;
    box-sizing: border-box;
    background: white;
    outline: none;
    box-shadow: 0 0 0 3px rgba(21,80,105,0.1);
  }
  .editable-value textarea { min-height: 80px; resize: vertical; }
  .inline-edit-hint {
    display: block;
    font-size: 10px;
    color: var(--muted);
    font-style: italic;
    margin-top: 4px;
    opacity: 0;
    transition: opacity 0.15s;
  }
  .detail-field:hover .inline-edit-hint { opacity: 1; }

  /* ── HEADER NAME EDIT ── */
  .detail-name.editable-header { cursor: pointer; }
  .detail-name.editable-header:hover::after {
    content: ' ✎';
    font-size: 14px;
    opacity: 0.55;
  }
  .header-name-edit-wrap { display: flex; gap: 8px; align-items: center; }
  .header-name-input {
    background: rgba(255,255,255,0.15);
    border: 1.5px solid rgba(255,255,255,0.5);
    border-radius: 4px;
    color: white;
    font-size: 20px;
    font-family: 'Filson Pro', sans-serif; font-weight: 800;
    padding: 3px 8px;
    outline: none;
    width: 150px;
    min-width: 80px;
  }
  .header-name-input::placeholder { color: rgba(255,255,255,0.45); }
  .header-name-input:focus { border-color: white; background: rgba(255,255,255,0.22); }

  /* ── COMPANY TYPEAHEAD ── */
  .company-edit-wrap { position: relative; }
  .company-dd {
    position: absolute;
    top: calc(100% + 2px); left: 0;
    min-width: 240px; max-width: 340px;
    background: white;
    border: 1px solid var(--border);
    border-radius: 6px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    z-index: 200;
    max-height: 200px;
    overflow-y: auto;
    display: none;
  }
  .company-dd.open { display: block; }
  .company-dd-item {
    padding: 7px 12px;
    font-size: 13px;
    cursor: pointer;
    border-bottom: 1px solid var(--warm);
  }
  .company-dd-item:last-child { border-bottom: none; }
  .company-dd-item:hover { background: var(--warm); }
  .company-dd-none {
    padding: 7px 12px;
    font-size: 12px;
    color: var(--muted);
    font-style: italic;
  }
  .company-dd-clear {
    padding: 7px 12px;
    font-size: 12px;
    color: var(--hot);
    cursor: pointer;
    border-top: 1px solid var(--warm);
  }
  .company-dd-clear:hover { background: var(--cream); }

  #camp-count-badge { font-size:12px; color:var(--muted); margin-left:4px; }

  /* ── FINANCE DASHBOARD (3-column) ── */
  #view-sales { flex-direction:row !important; overflow:hidden; height:calc(100vh - 88px); }
  .finance-sidebar { width:220px; flex-shrink:0; background:var(--content-bg); border-right:1px solid var(--border); overflow-y:auto; display:flex; flex-direction:column; }
  .finance-main { flex:1; display:flex; flex-direction:column; overflow:hidden; min-width:0; }
  .finance-right { width:268px; flex-shrink:0; background:var(--content-bg); border-left:1px solid var(--border); overflow-y:auto; }

  /* Finance context panel (transaction detail) */
  .fr-context {
    border-bottom: 2px solid var(--gold);
    background: var(--grey-20);
    padding: 12px 14px;
    display: none;
  }
  .fr-context.active { display: block; }
  .fr-context-header {
    display: flex; align-items: center; gap: 6px;
    margin-bottom: 10px;
  }
  .fr-context-chip {
    font-size: 10px; font-weight: 700; padding: 2px 8px;
    border-radius: 10px; text-transform: uppercase;
  }
  .fr-context-chip.income  { background: var(--emerald-100); color: var(--green-700); }
  .fr-context-chip.expense { background: var(--grey-100); color: var(--red-750); }
  .fr-context-amount {
    font-size: 18px; font-weight: 700; margin-left: auto;
  }
  .fr-context-close {
    background: none; border: none; cursor: pointer;
    color: var(--muted); font-size: 16px; line-height: 1; padding: 0 0 0 4px;
  }
  .fr-context-row {
    display: flex; gap: 6px; margin-bottom: 5px;
    font-size: 12px; line-height: 1.4;
  }
  .fr-context-lbl {
    font-size: 10px; font-weight: 700; text-transform: uppercase;
    color: var(--muted); width: 68px; flex-shrink: 0; padding-top: 1px;
  }
  .fr-context-val { color: var(--text); flex: 1; }
  .fr-context-link {
    color: var(--plum); cursor: pointer; text-decoration: underline;
    background: none; border: none; font: inherit; padding: 0;
  }
  .fr-context-divider { border: none; border-top: 1px solid var(--border); margin: 8px 0; }
  .ldg-row { cursor: pointer; transition: background .1s; }
  .ldg-row:hover { background: rgba(0,0,0,.03); }
  .ldg-row.selected { background: #fffbea !important; outline: 1px solid var(--gold); }

  /* Finance toolbar */
  .finance-toolbar { display:flex; align-items:center; gap:8px; padding:11px 16px 10px; background:var(--content-bg); border-bottom:1px solid var(--border); flex-shrink:0; flex-wrap:wrap; }
  .finance-title { font-size:14px; font-weight:700; color:var(--text); margin-right:4px; white-space:nowrap; }

  /* Finance sidebar nav */
  .fin-nav-item { display:flex; align-items:center; gap:8px; padding:7px 10px; font-size:13px; cursor:pointer; border-radius:6px; margin:2px 6px; color:var(--text); transition:background 0.12s; user-select:none; }
  .fin-nav-item:hover { background:rgba(0,0,0,0.06); }
  .fin-nav-item.active { background:var(--plum-650); color:white; font-weight:600; }
  .fin-nav-icon { font-size:13px; width:16px; text-align:center; }
  .fin-nav-count { margin-left:auto; font-size:11px; opacity:0.65; }
  .fin-saved-item { display:flex; align-items:center; padding:5px 10px 5px 34px; font-size:12px; cursor:pointer; color:var(--muted); border-radius:4px; margin:1px 6px; transition:background 0.1s; }
  .fin-saved-item:hover { color:var(--text); background:rgba(0,0,0,0.05); }
  .fin-saved-item.active { color:var(--teal); font-weight:600; }
  .fin-cat-item { display:flex; align-items:center; justify-content:space-between; padding:5px 10px 5px 10px; font-size:12px; cursor:pointer; color:var(--muted); border-radius:4px; margin:1px 6px; }
  .fin-cat-item:hover { color:var(--text); background:rgba(0,0,0,0.05); }
  .fin-cat-item.active { color:var(--teal); font-weight:600; }

  /* Ledger table */
  .ledger-wrap { flex:1; overflow-y:auto; }
  .ledger-table { width:100%; border-collapse:collapse; font-size:13px; }
  .ledger-table thead th { padding:7px 10px; text-align:left; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; color:var(--muted); background:var(--content-bg); border-bottom:2px solid var(--border); position:sticky; top:0; z-index:2; white-space:nowrap; }
  .ldg-row { border-bottom:1px solid var(--border); cursor:pointer; transition:background 0.1s; }
  .ldg-row:hover { background:rgba(0,0,0,0.03); }
  .ldg-row.ldg-income { border-left:3px solid rgba(35,95,64,0.4); }
  .ldg-row.ldg-expense { border-left:3px solid rgba(192,57,43,0.35); }
  .ldg-date { white-space:nowrap; color:var(--muted); padding:8px 10px; font-size:12px; }
  .ldg-cat { padding:8px 10px; font-weight:600; color:var(--text); }
  .ldg-contact { padding:8px 10px; color:var(--plum); font-size:12px; }
  .ldg-desc { padding:8px 10px; color:var(--muted); font-size:12px; max-width:180px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .ldg-amount { padding:8px 10px; font-weight:700; text-align:right; white-space:nowrap; }
  .ldg-balance { padding:8px 10px; text-align:right; font-size:12px; white-space:nowrap; color:var(--muted); }
  .ldg-recon { padding:8px 6px; width:26px; text-align:center; font-size:13px; }
  .ldg-chip { display:inline-block; font-size:10px; font-weight:700; padding:2px 7px; border-radius:10px; text-transform:uppercase; letter-spacing:0.04em; }
  .ldg-income-chip { background:rgba(35,95,64,0.12); color:var(--teal); }
  .ldg-expense-chip { background:rgba(192,57,43,0.1); color:var(--red-550); }

  /* Finance right panel */
  .fr-section { padding:12px 14px; border-bottom:1px solid var(--border); }
  .fr-label { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:0.07em; color:var(--plum); margin-bottom:8px; }
  .fr-stat { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:5px; }
  .fr-stat-label { font-size:12px; color:var(--muted); }
  .fr-stat-value { font-size:13px; font-weight:700; color:var(--text); }
  .fr-product-row { display:flex; align-items:center; gap:8px; padding:5px 0; border-bottom:1px solid var(--border); font-size:12px; }
  .fr-product-row:last-child { border-bottom:none; }
  .fr-product-name { flex:1; font-weight:600; color:var(--text); }
  .fr-product-price { color:var(--muted); }
  .fr-outstanding-row { display:flex; justify-content:space-between; align-items:center; font-size:12px; padding:5px 0; border-bottom:1px solid var(--border); }
  .fr-outstanding-row:last-child { border-bottom:none; }

  /* New transaction modal type toggle */
  .txn-type-toggle { display:flex; gap:0; border:1px solid var(--border); border-radius:8px; overflow:hidden; margin-bottom:14px; }
  .txn-type-btn { flex:1; padding:8px; font-size:13px; font-weight:600; border:none; background:none; cursor:pointer; font-family:inherit; color:var(--muted); transition:all 0.12s; }
  .txn-type-btn.active { background:var(--teal); color:white; }

  /* ── COLUMN RESIZE HANDLES ── */
  .col-resize-handle { position:absolute; right:0; top:0; bottom:0; width:9px; cursor:col-resize; z-index:3; background:transparent; }
  /* faint persistent divider so columns visibly read as resizable */
  .col-resize-handle::before { content:''; position:absolute; right:3px; top:22%; bottom:22%; width:1px; background:rgba(0,0,0,.18); transition:background .15s, width .15s; }
  .col-resize-handle:hover::before, .col-resize-handle.dragging::before { background:var(--teal); width:2px; }
  th { position:relative; overflow:visible; }
  #contact-pagination { display:flex; }
  .pg-btn-active { background:var(--teal) !important; color:white !important; border-color:var(--teal) !important; }

  /* Keep old filter bar for modals */
  .sales-filter-bar { display:flex; align-items:center; gap:10px; padding:12px 20px; border-bottom:1px solid var(--border); flex-shrink:0; flex-wrap:wrap; }
  .sales-filter-bar .search-input { min-width:200px; flex:1; max-width:320px; }
  .sales-filter-sel { border:1px solid var(--border); border-radius:6px; padding:6px 10px; font-size:13px; font-family:inherit; color:var(--text); background:white; cursor:pointer; }

  /* ── EXPENSES ── */
  .expense-list { flex:1; overflow-y:auto; padding:0 28px 28px; }
  .expense-row { display:flex; align-items:center; gap:12px; padding:12px 16px; background:white; border:1px solid var(--border); border-radius:10px; margin-top:10px; }
  .expense-row:hover { box-shadow:0 2px 8px rgba(0,0,0,0.06); }
  .expense-date { font-size:12px; color:var(--muted); width:80px; flex-shrink:0; }
  .expense-vendor { font-size:14px; font-weight:600; flex:1; }
  .expense-cat { font-size:11px; color:white; background:var(--sage); border-radius:20px; padding:2px 9px; white-space:nowrap; flex-shrink:0; }
  .expense-amount { font-size:15px; font-weight:700; color:var(--hot); width:90px; text-align:right; flex-shrink:0; }
  .expense-tax { font-size:10px; color:var(--sage); font-weight:700; flex-shrink:0; }
  .expense-delete { background:none; border:none; cursor:pointer; color:var(--muted); font-size:16px; flex-shrink:0; }
  .expense-delete:hover { color:var(--hot); }
  .expense-empty { padding:40px; text-align:center; color:var(--muted); font-style:italic; font-size:13px; }
  .btn-add-expense { background:var(--sage); color:var(--white); border:none; border-radius:6px; padding:8px 16px; font-size:13px; font-weight:600; cursor:pointer; }
  .btn-add-expense:hover { opacity:0.88; }

  /* ── REPORTS VIEW ── */
  #sales-subview-reports { flex-direction:column; overflow-y:auto; }
  .reports-header-bar { padding:20px 32px 14px; flex-shrink:0; background:var(--content-bg); border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; }
  .reports-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; padding:24px 32px; }
  @media (max-width:900px) { .reports-grid { grid-template-columns:1fr; } }
  .report-card { background:white; border:1px solid var(--border); border-radius:12px; overflow:hidden; }
  .report-card-header { background:var(--plum); color:white; padding:12px 18px; font-size:13px; font-weight:700; letter-spacing:0.04em; display:flex; align-items:center; justify-content:space-between; }
  .report-card-body { padding:16px 20px; }
  .report-stat-row { display:grid; grid-template-columns:1fr auto; align-items:baseline; padding:6px 0; border-bottom:1px solid var(--warm); font-size:13px; gap:16px; }
  .report-stat-row:last-child { border-bottom:none; }
  .report-stat-label { color:var(--muted); text-align:left; }
  .report-stat-val { font-weight:700; color:var(--text); text-align:left; white-space:nowrap; }
  .report-stat-val.income { color:var(--emerald-550); }
  .report-stat-val.expense { color:var(--hot); }
  .report-stat-val.net.positive { color:var(--emerald-550); }
  .report-stat-val.net.negative { color:var(--hot); }
  .report-month-select { border:1px solid var(--border); border-radius:6px; padding:4px 10px; font-size:12px; font-family:inherit; background:white; color:var(--text); }
  .btn-csv { background:var(--sage); color:white; border:none; border-radius:6px; padding:6px 14px; font-size:12px; font-weight:600; cursor:pointer; font-family:inherit; }
  .btn-csv:hover { opacity:0.85; }
  .receivable-row { display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid var(--warm); font-size:13px; }
  .receivable-row:last-child { border-bottom:none; }
  .receivable-name { flex:1; font-weight:500; color:var(--text); cursor:pointer; }
  .receivable-name:hover { color:var(--plum); text-decoration:underline; }
  .receivable-amt { font-weight:700; color:var(--hot); }
  .expense-cat-row { display:flex; align-items:center; gap:8px; padding:7px 0; border-bottom:1px solid var(--warm); font-size:13px; }
  .expense-cat-row:last-child { border-bottom:none; }
  .expense-cat-bar-wrap { flex:1; background:var(--warm); border-radius:4px; height:7px; overflow:hidden; }
  .expense-cat-bar { height:7px; background:var(--sage); border-radius:4px; transition:width 0.4s; }
  .expense-cat-label { width:160px; font-size:12px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .expense-cat-val { font-weight:700; color:var(--text); width:72px; text-align:left; font-size:12px; }

  /* ── INVOICE MODAL ── */
  .invoice-modal-backdrop { position:fixed; inset:0; background:rgba(0,0,0,0.55); z-index:8000; display:none; align-items:center; justify-content:center; }
  .invoice-modal-backdrop.open { display:flex; }
  .invoice-modal { background:white; border-radius:14px; width:680px; max-width:96vw; max-height:90vh; overflow-y:auto; box-shadow:0 20px 60px rgba(0,0,0,0.25); }
  .invoice-modal-hd { background:var(--blue); color:white; padding:18px 24px; border-radius:14px 14px 0 0; display:flex; align-items:center; justify-content:space-between; }
  .invoice-modal-hd h2 { font-size:15px; font-weight:700; margin:0; }
  .invoice-body { padding:24px; }
  .invoice-preview { border:1px solid var(--border); border-radius:10px; padding:28px 32px; margin-bottom:20px; }
  .invoice-preview-header { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:24px; padding-bottom:16px; border-bottom:2px solid var(--teal); }
  .invoice-org-name { font-size:18px; font-weight:800; color:var(--blue); }
  .invoice-org-sub { font-size:12px; color:var(--muted); margin-top:2px; }
  .invoice-meta { text-align:right; font-size:12px; color:var(--muted); line-height:1.8; }
  .invoice-meta strong { color:var(--text); }
  .invoice-to-section { margin-bottom:20px; }
  .invoice-to-label { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:0.08em; color:var(--muted); margin-bottom:4px; }
  .invoice-to-name { font-size:14px; font-weight:600; color:var(--text); }
  .invoice-line-table { width:100%; border-collapse:collapse; margin-bottom:16px; }
  .invoice-line-table th { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:0.06em; color:var(--muted); padding:8px 0; border-bottom:1px solid var(--border); text-align:left; }
  .invoice-line-table th:last-child, .invoice-line-table td:last-child { text-align:right; }
  .invoice-line-table td { padding:10px 0; font-size:13px; border-bottom:1px solid var(--warm); }
  .invoice-total-row { display:flex; justify-content:flex-end; gap:24px; padding-top:12px; font-size:14px; }
  .invoice-total-label { color:var(--muted); }
  .invoice-total-val { font-weight:700; color:var(--blue); font-size:16px; }
  .invoice-status-badge { display:inline-block; padding:3px 10px; border-radius:20px; font-size:11px; font-weight:700; }
  .invoice-status-badge.paid,    .invoice-status-badge.badge-paid    { background:var(--emerald-50); color:var(--emerald-775); }
  .invoice-status-badge.partial, .invoice-status-badge.badge-partial  { background:var(--gold-100); color:var(--amber-700); }
  .invoice-status-badge.unpaid,  .invoice-status-badge.badge-unpaid  { background:var(--grey-100); color:var(--red-750); }
  .invoice-status-badge.badge-draft    { background:var(--warm); color:var(--muted); }
  .invoice-status-badge.badge-sent     { background:var(--olive-100); color:var(--olive-750); }
  .invoice-status-badge.badge-void     { background:#f0e0e0; color:var(--red-750); }
  .report-big-num { font-size:24px; font-weight:700; color:var(--blue); }
  .report-stat-row.muted { color:var(--muted); font-size:12px; }
  .btn-print-invoice { background:var(--teal); color:white; border:none; border-radius:7px; padding:10px 22px; font-size:14px; font-weight:700; cursor:pointer; font-family:inherit; }
  .btn-print-invoice:hover { opacity:0.88; }

  /* ── NEWSLETTER STATUS ── */
  .newsletter-badge { display:inline-flex; align-items:center; gap:5px; padding:3px 10px; border-radius:20px; font-size:11px; font-weight:700; }
  .newsletter-badge.subscribed   { background:var(--emerald-50); color:var(--emerald-775); }
  .newsletter-badge.unsubscribed { background:var(--grey-100); color:var(--red-750); }
  .newsletter-badge.pending      { background:var(--gold-100); color:var(--amber-700); }
  .newsletter-badge.never_added  { background:var(--warm); color:var(--muted); }
  .newsletter-select { border:1px solid var(--border); border-radius:6px; padding:4px 8px; font-size:12px; font-family:inherit; background:white; color:var(--text); cursor:pointer; margin-left:8px; }

  /* ── NEW CONTACT / EXPENSE MODALS SHARED ── */
  .form-modal-input { width:100%; border:1px solid var(--border); border-radius:6px; padding:8px 10px; font-size:13px; box-sizing:border-box; font-family:inherit; }
  .form-modal-row { display:flex; gap:12px; }
  .form-modal-row > * { flex:1; }

  /* ── LINK / EMAIL COLORS ── */
  a[href^="mailto"], a[href^="http"], .contact-email-link, .contact-link {
    color: var(--plum);
  }
  a[href^="mailto"]:hover, a[href^="http"]:hover { color: var(--plum-dark); }

  /* ── NAV GEAR BUTTON ── */
  .nav-gear-btn {
    margin-left: auto;
    align-self: center;
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.2);
    border-radius: 6px;
    color: rgba(255,255,255,0.8);
    cursor: pointer;
    font-size: 16px;
    padding: 5px 10px;
    transition: all 0.15s;
    line-height: 1;
    flex-shrink: 0;
  }
  .nav-gear-btn:hover {
    background: rgba(255,255,255,0.22);
    color: white;
  }

  /* ── THEME SETTINGS PANEL ── */
  #theme-settings-panel {
    position: fixed;
    top: 0; right: -420px;
    width: 400px;
    height: 100vh;
    background: var(--white);
    box-shadow: -4px 0 24px rgba(0,0,0,0.18);
    z-index: 9000;
    display: flex;
    flex-direction: column;
    transition: right 0.3s cubic-bezier(0.4,0,0.2,1);
    font-family: 'Filson Pro', sans-serif;
  }
  #theme-settings-panel.open { right: 0; }
  .ts-header {
    background: var(--blue);
    color: white;
    padding: 18px 20px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
  }
  .ts-header h2 {
    font-size: 14px; font-weight: 700;
    letter-spacing: 0.06em; text-transform: uppercase;
    margin: 0;
  }
  .ts-close {
    background: rgba(255,255,255,0.15);
    border: none; color: white;
    border-radius: 5px; font-size: 16px;
    width: 28px; height: 28px;
    cursor: pointer; display: flex;
    align-items: center; justify-content: center;
  }
  .ts-close:hover { background: rgba(255,255,255,0.28); }
  .ts-body {
    flex: 1; overflow-y: auto;
    padding: 16px 20px 24px;
  }
  .ts-section-title {
    font-size: 10px; font-weight: 700;
    letter-spacing: 0.08em; text-transform: uppercase;
    color: var(--muted); margin: 18px 0 10px;
    padding-bottom: 5px;
    border-bottom: 1px solid var(--border);
  }
  .ts-section-title:first-child { margin-top: 4px; }
  .ts-row {
    display: flex; align-items: center;
    gap: 8px; margin-bottom: 10px;
  }
  .ts-row-label {
    font-size: 12px; font-weight: 600;
    color: var(--text); min-width: 120px; flex-shrink: 0;
  }
  .ts-swatches {
    display: flex; gap: 5px; flex-wrap: wrap; flex: 1;
  }
  .ts-swatch {
    width: 24px; height: 24px;
    border-radius: 5px; border: 2px solid transparent;
    cursor: pointer; transition: transform 0.1s, border-color 0.1s;
    flex-shrink: 0;
  }
  .ts-swatch:hover { transform: scale(1.15); }
  .ts-swatch.active { border-color: var(--grey-800); transform: scale(1.1); }
  .ts-swatch-custom {
    width: 24px; height: 24px;
    border-radius: 5px; border: 2px dashed var(--grey-300);
    background: white; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    font-size: 12px; color: var(--grey-450); flex-shrink: 0;
    overflow: hidden; padding: 0;
  }
  .ts-swatch-custom input[type=color] {
    opacity: 0; position: absolute;
    width: 24px; height: 24px; cursor: pointer;
  }
  .ts-footer {
    padding: 14px 20px;
    border-top: 1px solid var(--border);
    display: flex; gap: 10px;
    flex-shrink: 0;
  }
  .ts-btn {
    flex: 1; padding: 9px 14px;
    border-radius: 7px; border: none;
    font-size: 13px; font-weight: 700;
    cursor: pointer; transition: opacity 0.15s;
    font-family: inherit;
  }
  .ts-btn:hover { opacity: 0.85; }
  .ts-btn-reset {
    background: var(--warm); color: var(--text);
    border: 1px solid var(--border);
  }
  .ts-btn-apply {
    background: var(--blue); color: white;
  }
  #theme-overlay {
    display: none;
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.2);
    z-index: 8999;
  }
  #theme-overlay.open { display: block; }

  /* ── MAILCHIMP SETTINGS MODAL ──────────────────────────────────────────── */
  #mc-settings-overlay {
    display: none; position: fixed; inset: 0;
    background: rgba(0,0,0,0.35); z-index: 9100;
    align-items: center; justify-content: center;
  }
  #mc-settings-overlay.open { display: flex; }
  #mc-settings-panel {
    background: white; border-radius: 12px;
    width: 480px; max-width: 95vw;
    box-shadow: 0 8px 40px rgba(0,0,0,0.25);
    overflow: hidden;
  }
  .mc-panel-header {
    background: var(--nav); color: white;
    padding: 16px 20px; display: flex; align-items: center; gap: 10px;
  }
  .mc-panel-header h3 { margin: 0; font-size: 15px; font-weight: 700; flex: 1; }
  .mc-panel-body { padding: 20px; }
  .mc-field-group { margin-bottom: 16px; }
  .mc-field-label {
    font-size: 11px; font-weight: 700; text-transform: uppercase;
    color: var(--muted); letter-spacing: .5px; margin-bottom: 5px;
  }
  .mc-field-input {
    width: 100%; box-sizing: border-box;
    padding: 8px 10px; border: 1px solid var(--border);
    border-radius: 6px; font-size: 13px; font-family: inherit;
    outline: none; transition: border .15s;
  }
  .mc-field-input:focus { border-color: var(--blue); }
  .mc-status-bar {
    display: flex; align-items: center; gap: 8px;
    padding: 8px 12px; border-radius: 6px;
    font-size: 12px; font-weight: 600; margin-bottom: 16px;
  }
  .mc-status-bar.ok   { background: var(--emerald-100); color: var(--green-700); }
  .mc-status-bar.warn { background: var(--gold-50); color: var(--gold-550); }
  .mc-status-bar.err  { background: var(--grey-100); color: var(--red-750); }
  .mc-list-select {
    width: 100%; box-sizing: border-box;
    padding: 8px 10px; border: 1px solid var(--border);
    border-radius: 6px; font-size: 13px; font-family: inherit; background: white;
  }
  .mc-panel-footer {
    padding: 14px 20px; background: var(--white);
    border-top: 1px solid var(--border);
    display: flex; gap: 8px; justify-content: flex-end;
  }
  /* Campaign Mailchimp section */
  .mc-camp-section {
    margin-top: 16px; padding-top: 16px;
    border-top: 1px solid var(--border);
  }
  .mc-camp-title {
    font-size: 11px; font-weight: 700; text-transform: uppercase;
    color: var(--muted); letter-spacing: .5px; margin-bottom: 10px;
    display: flex; align-items: center; justify-content: space-between;
  }
  .mc-indicator {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 10px; font-weight: 700; padding: 2px 7px;
    border-radius: 10px; text-transform: none; letter-spacing: 0;
  }
  .mc-indicator.ready   { background: var(--emerald-100); color: var(--green-700); }
  .mc-indicator.offline { background: var(--grey-100); color: var(--red-750); }
  .mc-indicator.nokey   { background: var(--gold-50); color: var(--gold-550); }
  .mc-action-btn {
    width: 100%; padding: 8px 12px; border: none; border-radius: 6px;
    font-size: 12px; font-weight: 600; cursor: pointer;
    display: flex; align-items: center; justify-content: center; gap: 6px;
    margin-bottom: 7px; transition: opacity .15s;
  }
  .mc-action-btn:hover { opacity: .85; }
  .mc-action-btn.primary   { background: var(--plum); color: white; }
  .mc-action-btn.secondary { background: var(--content-bg); color: var(--text); border: 1px solid var(--border); }
  .mc-action-btn.open-mc   { background: #ffe01b; color: var(--grey-850); }
  .mc-email-count { font-size: 11px; color: var(--muted); text-align: center; margin-bottom: 8px; }
  .mc-last-sync { font-size: 10px; color: var(--muted); text-align: center; margin-top: 4px; }

  /* ── COMMAND PALETTE ── */
  #cmd-palette-overlay { display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:9999;align-items:flex-start;justify-content:center;padding-top:80px; }
  #cmd-palette-overlay.open { display:flex; }
  #cmd-palette-box { background:var(--white);border-radius:14px;width:620px;max-width:94vw;box-shadow:0 12px 60px rgba(0,0,0,.35);overflow:hidden;max-height:78vh;display:flex;flex-direction:column; }
  #cmd-input-wrap { display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--grey-60); }
  #cmd-input-wrap .cmd-icon { font-size:18px;color:var(--grey-300); }
  #cmd-input { flex:1;border:none;outline:none;font-size:16px;font-family:'Filson Pro',sans-serif;color:var(--emerald-825);background:transparent; }
  #cmd-input::placeholder { color:var(--grey-250); }
  #cmd-results { flex:1;overflow-y:auto;padding:6px 0; }
  .cmd-group-label { font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#999;padding:10px 18px 4px; }
  .cmd-item { display:flex;align-items:center;gap:12px;padding:9px 18px;cursor:pointer;transition:background .1s;border-left:3px solid transparent; }
  .cmd-item:hover,.cmd-item.cp-active { background:var(--plum-light,var(--grey-80));border-left-color:var(--plum,var(--plum-550)); }
  .cmd-item-avatar { width:30px;height:30px;border-radius:50%;background:var(--plum,var(--plum-550));color:var(--white);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0; }
  .cmd-item-avatar.org-av { background:var(--sage,var(--olive-500));border-radius:7px; }
  .cmd-item-avatar.camp-av { background:var(--terra,var(--emerald-550));border-radius:7px;font-size:14px; }
  .cmd-item-body { flex:1;min-width:0; }
  .cmd-item-name { font-size:13px;font-weight:600;color:var(--emerald-825);white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
  .cmd-item-sub  { font-size:11px;color:var(--grey-450);white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
  .cmd-hint { padding:18px;text-align:center;font-size:13px;color:var(--grey-250); }
  #cmd-footer { border-top:1px solid var(--grey-60);padding:8px 18px;font-size:11px;color:var(--grey-250);display:flex;gap:16px;align-items:center; }
  #cmd-footer kbd { background:#f0ede8;border:1px solid #d0ccc8;border-radius:4px;padding:2px 6px;font-size:10px;font-family:monospace;color:#666; }

  /* ── CSV IMPORT WIZARD ── */
  #import-wizard-overlay { display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:4600;align-items:flex-start;justify-content:center;padding:40px 20px;overflow-y:auto; }
  #import-wizard-overlay.open { display:flex; }
  #import-wizard-box { background:var(--white);border-radius:14px;width:780px;max-width:96vw;box-shadow:0 8px 40px rgba(0,0,0,.22);overflow:hidden; }
  .iw-header { background:var(--blue,var(--emerald-750));color:var(--white);padding:14px 20px;display:flex;align-items:center;gap:14px; }
  .iw-title { font-size:15px;font-weight:700;flex:1; }
  .iw-steps { display:flex;gap:0;padding:0 24px;border-bottom:2px solid var(--border,var(--emerald-250));background:var(--content-bg,var(--sage-75)); }
  .iw-step-tab { padding:10px 18px;font-size:12px;font-weight:600;color:var(--muted,var(--emerald-500));border-bottom:3px solid transparent;margin-bottom:-2px;cursor:default;display:flex;align-items:center;gap:6px; }
  .iw-step-tab.active { color:var(--plum,var(--plum-550));border-bottom-color:var(--plum,var(--plum-550)); }
  .iw-step-tab.done   { color:var(--terra,var(--emerald-550)); }
  .iw-body { padding:22px 24px;min-height:280px; }
  .iw-footer { padding:14px 24px;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:flex-end;gap:10px; }
  .iw-map-row { display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:center;padding:7px 0;border-bottom:1px solid var(--border);font-size:13px; }
  .iw-map-row:last-child { border-bottom:none; }
  .iw-map-col-name { font-weight:600;color:var(--text); }
  .iw-map-sample { font-size:11px;color:var(--muted);margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
  .iw-preview-table { width:100%;border-collapse:collapse;font-size:12px; }
  .iw-preview-table th { background:var(--content-bg);padding:6px 10px;text-align:left;font-weight:700;border-bottom:2px solid var(--border);white-space:nowrap; }
  .iw-preview-table td { padding:5px 10px;border-bottom:1px solid var(--border);vertical-align:top; }
  .iw-progress-bar-wrap { background:var(--grey-60);border-radius:8px;height:10px;margin:12px 0;overflow:hidden; }
  .iw-progress-bar { height:100%;background:var(--terra,var(--emerald-550));border-radius:8px;transition:width .2s; }

  /* ── LAYOUT EDITOR ─────────────────────────────────────────────────────── */
  #layout-editor-overlay {
    display:none; position:fixed; inset:0; background:rgba(0,0,0,.52);
    z-index:5000; align-items:flex-start; justify-content:center;
    padding:32px 20px; overflow-y:auto;
  }
  #layout-editor-overlay.open { display:flex; }
  .le-modal {
    background:white; border-radius:14px; width:100%; max-width:960px;
    box-shadow:0 20px 60px rgba(0,0,0,.3); display:flex; flex-direction:column;
    max-height:calc(100vh - 64px); overflow:hidden;
  }
  .le-header {
    background:var(--blue); color:white; padding:16px 22px 0;
    display:flex; flex-direction:column; gap:0; flex-shrink:0;
  }
  .le-header-top { display:flex; align-items:center; gap:12px; margin-bottom:12px; }
  .le-header-top h2 { font-size:17px; font-weight:800; font-family:'Filson Pro',sans-serif; flex:1; margin:0; }
  .le-header-top .le-close {
    background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.3);
    color:white; border-radius:8px; padding:4px 10px; cursor:pointer; font-size:14px;
  }
  .le-entity-tabs { display:flex; gap:0; }
  .le-entity-tab {
    padding:8px 20px; font-size:13px; font-weight:600; cursor:pointer;
    border:none; background:rgba(255,255,255,.12); color:rgba(255,255,255,.7);
    border-radius:8px 8px 0 0; margin-right:3px; font-family:inherit;
    transition:background .15s, color .15s;
  }
  .le-entity-tab.active { background:white; color:var(--blue); }
  .le-body {
    display:flex; flex:1; overflow:hidden; min-height:0;
  }
  .le-sections-col {
    flex:1; min-width:0; overflow-y:auto; padding:18px 16px;
    background:var(--white); display:flex; flex-direction:column; gap:10px;
  }
  .le-pool-col {
    width:230px; flex-shrink:0; border-left:1px solid var(--border);
    background:white; overflow-y:auto; padding:14px 12px; display:flex;
    flex-direction:column; gap:8px;
  }
  .le-pool-title {
    font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em;
    color:var(--muted); margin-bottom:4px;
  }
  .le-pool-area {
    flex:1; min-height:60px; border:2px dashed var(--border); border-radius:8px;
    padding:8px; display:flex; flex-direction:column; gap:5px;
    transition:background .15s, border-color .15s;
  }
  .le-pool-area.drag-over { background:var(--sage-20); border-color:var(--teal); }
  .le-add-section-btn {
    margin-top:4px; padding:8px; border:1px dashed var(--border);
    border-radius:8px; background:none; cursor:pointer; font-size:12px;
    color:var(--muted); font-family:inherit; transition:background .15s;
  }
  .le-add-section-btn:hover { background:var(--warm); color:var(--text); }
  .le-section-card {
    background:white; border:1px solid var(--border); border-radius:10px;
    overflow:hidden; cursor:default;
    transition:box-shadow .15s, transform .1s;
  }
  .le-section-card.dragging { opacity:.45; }
  .le-section-card.drag-over-top { border-top:3px solid var(--teal); }
  .le-section-card.drag-over-bot { border-bottom:3px solid var(--teal); }
  .le-section-head {
    display:flex; align-items:center; gap:8px;
    padding:9px 12px; background:var(--content-bg);
    border-bottom:1px solid var(--border);
  }
  .le-section-drag { cursor:grab; color:var(--muted); font-size:14px; user-select:none; }
  .le-section-name {
    flex:1; border:none; background:transparent; font-size:13px; font-weight:700;
    color:var(--text); font-family:inherit; outline:none; padding:2px 4px;
    border-radius:4px;
  }
  .le-section-name:focus { background:white; box-shadow:0 0 0 2px var(--teal); }
  .le-cols-toggle {
    display:flex; border:1px solid var(--border); border-radius:6px; overflow:hidden;
  }
  .le-cols-btn {
    padding:3px 8px; font-size:11px; border:none; cursor:pointer;
    background:white; color:var(--muted); font-family:inherit;
    transition:background .1s, color .1s;
  }
  .le-cols-btn.active { background:var(--plum); color:white; }
  .le-section-del {
    background:none; border:none; cursor:pointer; color:var(--muted);
    font-size:15px; padding:2px 4px; border-radius:4px; transition:color .1s;
  }
  .le-section-del:hover { color:var(--red-550); }
  .le-fields-area {
    padding:10px 12px; display:flex; flex-wrap:wrap; gap:6px; min-height:44px;
  }
  .le-fields-area.drag-over { background:var(--sage-20); }
  .le-field-chip {
    display:flex; align-items:center; gap:5px; padding:4px 9px;
    background:var(--warm); border:1px solid var(--border); border-radius:20px;
    font-size:12px; cursor:grab; user-select:none;
    transition:box-shadow .1s, opacity .1s;
  }
  .le-field-chip:hover { box-shadow:0 2px 8px rgba(0,0,0,.12); }
  .le-field-chip.dragging { opacity:.4; }
  .le-field-chip .fc-del {
    background:none; border:none; cursor:pointer; color:var(--muted);
    font-size:11px; padding:0 0 0 2px; line-height:1;
  }
  .le-field-chip .fc-del:hover { color:var(--red-550); }
  .le-footer {
    padding:12px 22px; border-top:1px solid var(--border); display:flex;
    gap:10px; justify-content:flex-end; background:white; flex-shrink:0;
  }
  .le-btn { padding:8px 18px; border-radius:8px; border:none; cursor:pointer; font-size:13px; font-weight:600; font-family:inherit; transition:background .15s; }
  .le-btn-ghost { background:var(--warm); color:var(--text); }
  .le-btn-ghost:hover { background:var(--grey-75); }
  .le-btn-primary { background:var(--blue); color:white; }
  .le-btn-primary:hover { background:var(--teal); }
  .le-btn-danger { background:var(--grey-25); color:var(--red-550); }
  .le-btn-danger:hover { background:var(--grey-100); }
  /* Templates view */
  .tpl-chip { display:inline-block;font-size:11px;font-weight:600;padding:2px 9px;border-radius:20px;background:var(--grey-60);color:var(--grey-700);margin-right:2px; }
  .tpl-btn { background:var(--grey-60);border:1px solid var(--border);border-radius:6px;padding:6px 12px;font-size:12px;font-weight:600;cursor:pointer;white-space:nowrap; }
  .tpl-btn:hover { background:var(--grey-75); }
  .tpl-lbl { display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:600;color:var(--grey-700); }
  .tpl-inp { padding:7px 10px;border:1px solid var(--border);border-radius:6px;font-size:13px;font-weight:400;background:white;width:100%;box-sizing:border-box; }

  /* ── CONVERSATION READER (Alta ▸ Conversations ▸ "read →") ─────────────────
     Lifted from conversation-viewer.html (2026-07-30), reference_library id 4.
     Pane order per Sara: title, brief, the dialogue, then technical detail
     last inside a collapsed fold. */
  #convo-reader-overlay {
    display: none; position: fixed; inset: 0;
    background: rgba(0,0,0,0.45); z-index: 9300;
  }
  #convo-reader-overlay.open { display: block; }
  #convo-reader {
    position: absolute; inset: 0; margin: auto;
    width: 900px; max-width: 96vw; height: 92vh; max-height: 92vh;
    background: var(--conv-wash); color: var(--conv-ink);
    border-radius: 12px; box-shadow: 0 10px 50px rgba(0,0,0,.35);
    display: flex; flex-direction: column; overflow: hidden;
    font-size: 15px; line-height: 1.6;
  }
  #convo-reader-bar {
    flex: 0 0 auto; display: flex; align-items: center; gap: 12px;
    padding: 11px 16px; background: var(--white); border-bottom: 1px solid var(--conv-rule);
  }
  #convo-reader-bar .crb-label {
    font-size: 11.5px; letter-spacing: .13em; text-transform: uppercase;
    color: var(--conv-muted); font-weight: 700;
  }
  #convo-reader-bar .crb-close {
    margin-left: auto; border: 1px solid var(--conv-rule); background: var(--white);
    border-radius: 6px; cursor: pointer; font: inherit; font-size: 13px;
    color: var(--conv-muted); padding: 4px 11px;
  }
  #convo-reader-bar .crb-close:hover { border-color: var(--conv-alta); color: var(--conv-alta); }
  #convo-pane { flex: 1; overflow-y: auto; padding: 34px 0 90px; }
  #convo-pane .wrap { max-width: 720px; margin: 0 auto; padding: 0 40px; }
  #convo-pane h2 {
    font-size: 26px; line-height: 1.25; margin: 0 0 6px; color: var(--conv-sara);
    font-weight: 700; letter-spacing: -.01em;
  }
  #convo-pane .conv-meta {
    font-size: 12.5px; color: var(--conv-muted); letter-spacing: .05em;
    text-transform: uppercase; margin-bottom: 26px;
  }
  #convo-pane .conv-meta b { color: var(--conv-alta); font-weight: 600; }

  #convo-pane .brief {
    background: var(--white); border: 1px solid var(--conv-rule); border-radius: 8px;
    padding: 20px 22px; margin-bottom: 34px;
  }
  #convo-pane .brief .tldr { font-size: 16px; line-height: 1.62; white-space: pre-wrap; }
  #convo-pane .brief section { margin-top: 18px; }
  #convo-pane .brief h3 {
    font-size: 11.5px; letter-spacing: .11em; text-transform: uppercase;
    color: var(--conv-muted); margin: 0 0 7px; font-weight: 700;
  }
  #convo-pane .brief ul { margin: 0; padding-left: 18px; }
  #convo-pane .brief li { margin-bottom: 4px; }
  #convo-pane .brief .open li { color: var(--conv-flag); }

  #convo-pane .band {
    display: flex; align-items: center; gap: 12px; margin: 0 0 22px;
    font-size: 11.5px; letter-spacing: .13em; text-transform: uppercase;
    color: var(--conv-muted); font-weight: 700;
  }
  #convo-pane .band::after { content: ""; flex: 1; height: 1px; background: var(--conv-rule); }

  /* the dialogue */
  #convo-pane .turn { display: flex; gap: 18px; margin-bottom: 24px; align-items: flex-start; }
  #convo-pane .who {
    flex: 0 0 88px; text-align: right; padding-top: 1px;
    font-size: 18px; font-weight: 700; line-height: 1.35; letter-spacing: -.01em;
  }
  #convo-pane .turn.user .who      { color: var(--conv-sara); }
  #convo-pane .turn.assistant .who { color: var(--conv-alta); }
  #convo-pane .turn.machine .who   { color: var(--machine); }
  #convo-pane .said {
    flex: 1; min-width: 0;
    border-left: 2px solid var(--conv-rule); padding-left: 18px;
  }
  #convo-pane .turn.user .said      { border-left-color: var(--conv-sara); }
  #convo-pane .turn.assistant .said { border-left-color: var(--conv-alta); }
  #convo-pane .turn.machine .said   { border-left-color: var(--machine); border-left-style: dashed; }
  #convo-pane .prose { white-space: pre-wrap; word-wrap: break-word; }
  #convo-pane .prose + .inline-fold, #convo-pane .inline-fold + .prose { margin-top: 10px; }
  #convo-pane details.inline-fold { margin: 2px 0; }
  #convo-pane details.inline-fold summary {
    cursor: pointer; list-style: none; display: inline-block;
    font-size: 12px; letter-spacing: .06em; font-weight: 600; color: var(--conv-alta);
    background: var(--white); border: 1px solid var(--conv-rule); border-radius: 20px;
    padding: 3px 12px;
  }
  #convo-pane details.inline-fold summary::-webkit-details-marker { display: none; }
  #convo-pane details.inline-fold summary::before { content: "▸ "; }
  #convo-pane details.inline-fold[open] summary::before { content: "▾ "; }
  #convo-pane details.inline-fold summary:hover { border-color: var(--conv-alta); }
  #convo-pane details.inline-fold .fold-body {
    margin-top: 10px; white-space: pre-wrap; word-wrap: break-word;
    font-family: ui-monospace,"SF Mono",Menlo,Consolas,monospace;
    font-size: 12px; line-height: 1.6; color: var(--blue-700);
    background: var(--white); border: 1px solid var(--conv-rule); border-radius: 8px;
    padding: 14px 16px; max-height: 26em; overflow: auto;
  }
  #convo-pane .prose.clipped { max-height: 19em; overflow: hidden; position: relative; }
  #convo-pane .prose.clipped::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 5em;
    background: linear-gradient(to bottom, rgba(239,244,247,0), var(--conv-wash));
  }
  #convo-pane .more {
    background: none; border: 0; padding: 6px 0 0; margin: 0;
    font: inherit; font-size: 12.5px; font-weight: 600; color: var(--conv-alta); cursor: pointer;
  }
  #convo-pane .more:hover { text-decoration: underline; }
  #convo-pane .note {
    font-size: 13px; color: var(--conv-muted); background: var(--white);
    border: 1px dashed var(--conv-rule); border-radius: 6px;
    padding: 12px 14px; margin-bottom: 26px;
  }

  /* technical detail, last */
  #convo-pane details.tech { margin-top: 46px; border-top: 1px solid var(--conv-rule); padding-top: 22px; }
  #convo-pane details.tech summary {
    cursor: pointer; font-size: 11.5px; letter-spacing: .13em; text-transform: uppercase;
    color: var(--conv-muted); font-weight: 700; list-style: none;
  }
  #convo-pane details.tech summary::-webkit-details-marker { display: none; }
  #convo-pane details.tech summary::before { content: "▸ "; color: var(--conv-alta); }
  #convo-pane details.tech[open] summary::before { content: "▾ "; }
  #convo-pane details.tech .body {
    margin-top: 16px; white-space: pre-wrap; word-wrap: break-word;
    font-family: ui-monospace,"SF Mono",Menlo,Consolas,monospace;
    font-size: 12.5px; line-height: 1.65; color: var(--blue-700);
    background: var(--white); border: 1px solid var(--conv-rule); border-radius: 8px; padding: 18px 20px;
  }
  #convo-pane .empty { color: var(--conv-muted); text-align: center; margin-top: 22vh; font-size: 15px; }

  @media (max-width: 860px) {
    #convo-reader { width: 100vw; max-width: 100vw; height: 100vh; max-height: 100vh; border-radius: 0; }
    #convo-pane .wrap { padding: 0 20px; }
    #convo-pane .turn { flex-direction: column; gap: 4px; }
    #convo-pane .who { text-align: left; flex: none; }
    #convo-pane .said { border-left: 2px solid var(--conv-rule); padding-left: 14px; }
  }

  /* ── PRINT: only the active view's main content, list/template name at top ── */
  @media print {
    @page { margin: 1.4cm; }
    * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
    .topnav, .sidebar, .right-panel,
    #view-templates aside, #view-lists aside,
    #lists-search, #tpl-search,
    #calllist-overlay, #cmd-palette, #pipeline-overlay,
    #bulk-action-bar, #camp-bulk-bar, .bulk-action-bar,
    .camp-sidebar, #camp-detail-panel, #camp-detail-overlay,
    .org-sidebar, .org-detail-panel, .org-sheet, #org-sheet-overlay,
    .finance-sidebar, #finance-right-panel,
    .contacts-header-bar .filter-bar,
    .org-header-bar .filter-bar, #org-quick-filter-bar,
    .camp-header-bar .filter-bar,
    .finance-toolbar,
    .org-view-toggle, .view-mode-toggle,
    #contact-pagination, #org-pagination,
    #detail-overlay, .detail-sheet, .org-sheet, #outlook-compose-panel, #outlook-compose-backdrop,
    [id$="-modal"], .modal, .modal-backdrop,
    #convo-reader-overlay,
    .camp-drag-col, .camp-row-del,
    .toast, #dupe-scanner-modal, #import-wizard-modal, #command-palette,
    .no-print { display: none !important; }
    #view-campaigns { display: block !important; }
    .camp-main { width: 100% !important; flex: 1 !important; }
    .content button, .content select, .content input[type="search"],
    .content .tpl-btn, .content .lst-remove { display: none !important; }
    html, body { height: auto !important; overflow: visible !important; background: var(--white) !important; }
    .main { display: block !important; height: auto !important; overflow: visible !important; }
    .content { display: block !important; overflow: visible !important; padding: 0 !important; }
    [id^="view-"] { overflow: visible !important; height: auto !important; }
    .tpl-card, .lst-card, #lists-calllist-wrap tr, #tasks-calllist-wrap tr { break-inside: avoid; page-break-inside: avoid; }
    .contact-table .bulk-col, .contact-table .star-col { display: none !important; }
    .contact-table table { table-layout: auto !important; }
    tr.contact-row { break-inside: avoid; }
    #contact-card-grid { display: none !important; }
    #view-sales { flex-direction: column !important; overflow: visible !important; height: auto !important; }
    .finance-main { overflow: visible !important; height: auto !important; }
    #print-header { display: block !important; padding: 0 0 12px; border-bottom: 2px solid var(--emerald-750); margin-bottom: 14px; }
    /* Dossier list cards: compact so ~3 fit on a printed page */
    #lists-body .lst-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 8px !important; }
    #lists-body .lst-card { box-shadow: none !important; }
    #lists-body .lst-block p { display: block !important; -webkit-line-clamp: unset !important; overflow: visible !important; }
    #lists-body .lst-foot, #lists-body .lst-remove { display: none !important; }
    #lists-body .lst-pane-l { padding: 9px !important; }
    #lists-body .lst-photo, #lists-body .lst-mono { width: 64px !important; height: 64px !important; margin: 0 auto 5px !important; border-width: 2px !important; }
    #lists-body .lst-mono { font-size: 22px !important; }
    #lists-body .lst-name { font-size: 13.5px !important; }
    #lists-body .lst-role { font-size: 10px !important; margin-top: 1px !important; }
    #lists-body .lst-tags { margin: 4px 0 6px !important; }
    #lists-body .lst-tag { font-size: 8px !important; padding: 1px 6px !important; }
    #lists-body .lst-deets { font-size: 9px !important; line-height: 1.38 !important; padding-top: 5px !important; }
    #lists-body .lst-pane-r { padding: 9px 12px !important; }
    #lists-body .lst-h3 { font-size: 8px !important; }
    #lists-body .lst-tagline { font-size: 10px !important; margin: 0 0 5px !important; padding-left: 8px !important; }
    #lists-body .lst-block { margin-bottom: 5px !important; }
    #lists-body .lst-h { font-size: 8px !important; margin-bottom: 1px !important; }
    #lists-body .lst-block p { font-size: 9px !important; line-height: 1.34 !important; }
  }

/* ── Project brief: the Projects → project homepage layout (model-brief).
   Scoped to .pbrief so it can't leak into the rest of the CRM. Numbers come
   from the model's own database views, so this page and the shared
   /model-brief link can never disagree. ── */
.pbrief{--pb-surface:var(--white);--pb-page:var(--white);--pb-text:var(--grey-900);--pb-text2:#52514e;--pb-muted:#898781;
  --pb-grid:#e6e5de;--pb-baseline:#c3c2b7;--pb-border:rgba(11,11,11,.11);
  --series-1:var(--blue-500);--series-2:#eb6834;--series-3:#1baf7a;--pb-warning:#b8820c;--pb-critical:#d03b3b;
  color:var(--pb-text);background:var(--pb-page);min-height:100%;}
.pbrief h1{font-size:24px;margin:0 0 3px;letter-spacing:-.01em;font-weight:800;}
.pbrief .pb-sub{color:var(--pb-text2);font-size:13px;margin:0;}
.pbrief h3.pb-h{font-size:15px;margin:0 0 2px;font-weight:800;letter-spacing:-.005em;}
.pbrief .pb-note{color:var(--pb-muted);font-size:12.5px;margin:0 0 14px;line-height:1.45;}
.pbrief .pb-sec{background:var(--pb-surface);border:1px solid var(--pb-border);border-radius:10px;padding:18px 20px;margin-bottom:16px;}
.pbrief .pb-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:16px;}
.pbrief .pb-tile{background:var(--pb-surface);border:1px solid var(--pb-border);border-radius:10px;padding:12px 14px;}
.pbrief .pb-lbl{font-size:10.5px;color:var(--pb-muted);text-transform:uppercase;letter-spacing:.05em;font-weight:700;}
.pbrief .pb-val{font-size:21px;margin-top:3px;letter-spacing:-.02em;font-weight:700;font-variant-numeric:tabular-nums;}
.pbrief .pb-fine{font-size:11px;color:var(--pb-text2);margin-top:3px;}
.pbrief .pb-chips{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:0 0 16px;}
.pbrief .pb-chip{font-size:12px;padding:5px 12px;border-radius:99px;border:1px solid var(--pb-border);color:var(--pb-text2);background:var(--pb-surface);cursor:pointer;}
.pbrief .pb-chip.on{background:var(--series-1);border-color:var(--series-1);color:var(--white);font-weight:700;}
.pbrief .pb-legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12.5px;color:var(--pb-text2);margin:0 0 8px;}
.pbrief .pb-legend span{display:inline-flex;align-items:center;gap:6px;}
.pbrief .pb-sw{width:10px;height:10px;border-radius:2px;display:inline-block;}
.pbrief table.pb-t{width:100%;border-collapse:collapse;font-size:12.5px;font-variant-numeric:tabular-nums;}
.pbrief table.pb-t th,.pbrief table.pb-t td{text-align:right;padding:6px 8px;border-bottom:1px solid var(--pb-grid);}
.pbrief table.pb-t th:first-child,.pbrief table.pb-t td:first-child{text-align:left;font-variant-numeric:normal;}
.pbrief table.pb-t th{color:var(--pb-muted);font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.04em;}
.pbrief table.pb-t tbody tr:last-child td{border-bottom:none;}
.pbrief table.pb-t tr.pb-total td{font-weight:800;border-top:1px solid var(--pb-baseline);}
.pbrief table.pb-t tr.pb-plan td{background:rgba(42,120,214,.08);}
.pbrief .pb-zero,.pbrief .pb-dim{color:var(--pb-muted);}
.pbrief .pb-tag{display:inline-block;font-size:10.5px;padding:1px 7px;border-radius:99px;border:1px solid var(--pb-border);color:var(--pb-text2);position:relative;top:-1px;}
.pbrief .pb-empty{border:1px dashed var(--pb-baseline);border-radius:9px;padding:13px 15px;color:var(--pb-muted);font-size:12.5px;line-height:1.55;background:var(--white);}
.pbrief .pb-empty code{background:#f2f1ec;border:1px solid var(--pb-border);border-radius:4px;padding:1px 5px;font-size:11.5px;color:var(--pb-text2);}
.pbrief svg text{font-family:inherit;}
.pbrief .pb-foot{color:var(--pb-muted);font-size:11.5px;margin-top:20px;line-height:1.6;}
#pb-tip{position:fixed;pointer-events:none;opacity:0;transition:opacity .1s;background:var(--white);color:var(--grey-900);
  border:1px solid rgba(11,11,11,.12);border-radius:7px;padding:7px 10px;font-size:12px;
  box-shadow:0 4px 14px rgba(0,0,0,.14);z-index:9999;font-variant-numeric:tabular-nums;}
/* ── MSO / Management Entity view additions (scoped under .pbrief.mso) ── */
.pbrief.mso .mso-btn{background:var(--plum,var(--plum-650));color:var(--white);border:none;border-radius:8px;padding:8px 16px;font-size:12.5px;font-weight:700;cursor:pointer;}
.pbrief.mso .mso-btn:disabled{background:#c8c6bf;cursor:default;}
.pbrief.mso .mso-btn-ghost{background:var(--white);color:var(--pb-text2);border:1px solid var(--pb-border);}
.pbrief.mso .mso-ctl-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px 18px;margin-top:12px;}
.pbrief.mso .mso-ctl label{display:block;font-size:11px;color:var(--pb-muted);font-weight:700;text-transform:uppercase;letter-spacing:.03em;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pbrief.mso .mso-ctl-row{display:flex;align-items:center;gap:10px;}
.pbrief.mso .mso-ctl-row input[type=range]{flex:1;accent-color:var(--blue-500);min-width:90px;}
.pbrief.mso .mso-ctl-val{font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--pb-text);min-width:74px;text-align:right;}
.pbrief.mso .mso-details{margin-top:12px;}
.pbrief.mso .mso-details summary{cursor:pointer;font-size:12.5px;font-weight:700;color:var(--pb-text2);}
.pbrief.mso .mso-proj-list{display:flex;flex-direction:column;gap:6px;margin:4px 0 14px;}
.pbrief.mso .mso-proj-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--white);border:1px solid var(--pb-border);border-radius:9px;padding:7px 12px;}
.pbrief.mso .mso-dot{width:11px;height:11px;border-radius:3px;flex-shrink:0;}
.pbrief.mso .mso-proj-name{font-weight:700;font-size:13px;cursor:pointer;color:var(--plum,var(--plum-650));min-width:150px;}
.pbrief.mso .mso-schip{font-size:11px;padding:3px 10px;text-transform:capitalize;}
.pbrief.mso .mso-open{font-size:11.5px;color:var(--pb-muted);margin-left:auto;}
.pbrief.mso .mso-open input{width:52px;border:1px solid var(--pb-border);border-radius:6px;padding:3px 5px;font-size:12px;text-align:center;font-variant-numeric:tabular-nums;}
.pbrief.mso .mso-flow{stroke-dasharray:5 11;animation:msoDash 1.1s linear infinite;}
@keyframes msoDash{to{stroke-dashoffset:-16;}}
@media (prefers-reduced-motion: reduce){.pbrief.mso .mso-flow{animation:none;}}