/* Purple corner buttons are gone everywhere (Sara 2026-09-15). Create actions
     live on as quiet links under the page title; the growth model saves itself. */
  .m2-actions, .phi-head2-acts { display:none !important; }
  .m2-quiet { display:flex; gap:16px; flex-wrap:wrap; margin:6px 0 0; }
  .m2-quiet a { font-size:12.5px; font-weight:700; color:var(--emerald-600); cursor:pointer; }
  .m2-quiet a:hover { text-decoration:underline; }
  /* The contacts sidebar in the rail's clothes, with the People sections on top. */
  .sidebar { background:var(--content-bg,var(--sage-75)) !important; border-right:1px solid var(--border,var(--emerald-250)) !important; width:216px !important; padding:22px 12px 30px !important; }
  .sidebar .sidebar-cal { display:none !important; }
  .sidebar .sidebar-section { padding:0 !important; margin-bottom:16px; }
  .sidebar .sidebar-label { font-size:10.5px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; color:var(--sage-550) !important; padding:0 9px 6px; }
  .sidebar .sidebar-item { padding:6px 10px; border-radius:7px; font-size:12.5px; font-weight:600; color:#2c4a44; }
  .sidebar .sidebar-item:hover { background:rgba(255,255,255,.6); }
  .sidebar .sidebar-item.active { background:var(--plum-650); color:var(--white); }
  .phi-rail-item.active { background:var(--plum-650) !important; }
  .phi-rail-item.active .phi-rail-link { color:var(--white); }
  .sidebar .sidebar-item .count { background:rgba(0,0,0,.06); color:var(--sage-550); }
  .sidebar .sidebar-item.active .count { background:rgba(255,255,255,.22); color:var(--white); }
  #sidebar-deep-search { padding-right:28px !important; }
  .sidebar .sidebar-section { margin-bottom:16px !important; }
  .sidebar .sidebar-item { justify-content:space-between; }
  .sidebar .sidebar-item > span:first-child { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .sidebar .sidebar-item .count { flex-shrink:0; }
  /* All Contacts and Campaigns lists, in the newer list style (the task table):
     white, quiet uppercase headings, text that wraps instead of being cut off. */
  #view-contacts .contact-table { border-radius:9px; }
  #view-contacts .contact-table th { font-size:10.5px; font-weight:700; letter-spacing:.05em; padding:8px 10px; border-bottom:2px solid var(--border); }
  #view-contacts .contact-table td { padding:7px 10px; font-size:12.5px; line-height:1.45; vertical-align:top; border-bottom:1px solid var(--border); white-space:normal; overflow:hidden; text-overflow:clip; max-width:none; overflow-wrap:anywhere; word-break:break-word; }
  #view-contacts .contact-table td a { overflow-wrap:anywhere; word-break:break-all; }
  #view-contacts .contact-table tr:last-child td { border-bottom:none; }
  #view-contacts .contact-table .contact-name { font-size:12.5px; color:var(--sage-850); }
  #view-contacts .contact-table tbody tr:hover { transform:none; box-shadow:none; }
  #view-contacts .contact-table tbody tr:hover td { background:var(--grey-50); }
  #view-contacts .contact-table th.star-col, #view-contacts .contact-table td.star-col { display:none; }
  #view-contacts .contact-table th.bulk-cb-col, #view-contacts .contact-table td.bulk-cb-col { width:34px; min-width:34px; padding:7px 0 0 10px; }
  #view-contacts .contact-table th[data-col="priority"], #view-contacts .contact-table td.priority-col { display:none; }
  #view-contacts .contacts-table-area { background:var(--white); }
  #view-contacts .contacts-header-bar { background:var(--white); border-bottom:none; }
  .camp-table-area { background:var(--white); }
  /* Sara 2026-09-19: the campaigns list is set in its own box, the same as the contacts
     list, and the toolbar above it sits on the page rather than on a coloured band. */
  .camp-table { border:1px solid var(--border); border-radius:9px; overflow:hidden; background:var(--white); }
  .camp-header-bar { background:var(--white); border-bottom:none; }
  body.phi-dark .camp-header-bar { background:var(--color-page-bg) !important; border-bottom:none !important; }
  body.phi-dark .camp-table { background:var(--color-surface); }
  .camp-table thead th { font-size:10.5px; padding:8px 10px; border-bottom:2px solid var(--border); }
  /* the campaign's name gets the room it needs; the rest share what is left, and
     dragging a column edge still overrides this (that sets the width on the cell) */
  .camp-table thead th[data-col="name"] { width:42%; }
  .camp-table td { padding:7px 10px; font-size:12.5px; line-height:1.45; vertical-align:top; white-space:normal; overflow:hidden; text-overflow:clip; overflow-wrap:anywhere; }
  .camp-table tbody tr:hover { background:var(--grey-50); }
  .camp-table tbody tr td:first-child { display:none; }   /* the drag handle */
  .camp-table thead th:first-child { display:none; }
  .camp-table tbody tr td:last-child { display:none; }    /* the bin */
  .camp-table thead th:last-child { display:none; }
  .camp-table tbody tr td:nth-child(2) { width:34px; }
  /* ── Every left column looks like the Science Library's (Sara 2026-09-15) ── */
  .sidebar, .phi-rail, .camp-sidebar, .finance-sidebar, .org-sidebar, .sci-tree,
  #view-projects > div > aside:first-child, #view-model > div > aside:first-child, #view-lists > div > aside:first-child, #view-sales > div > aside:first-child, #view-templates > div > aside:first-child, #view-reflib > div > aside:first-child, #view-docs > div > aside:first-child, #view-personal > div > aside:first-child, #view-organizations aside.org-sidebar {
    width:266px !important; min-width:230px !important; max-width:266px !important; flex-shrink:0;
    background:var(--white) !important; border-right:1px solid var(--grey-75) !important; padding:52px 10px 40px !important; box-sizing:border-box; overflow-y:auto; }  /* Sara 2026-09-15: the first line sits level with the page title; more air */
  .sidebar .sidebar-label, .phi-rail-label, .camp-sidebar .sidebar-label, .sci-tree-h, .m2-sb-h, .phi-p-side .m2-sb-h,
  #view-projects > div > aside:first-child > div:first-child { font-size:10.5px !important; font-weight:800 !important; letter-spacing:.07em !important; text-transform:uppercase !important; color:var(--sage-400) !important; padding:0 8px 12px !important; margin:0 !important; }
  .sidebar .sidebar-item, .phi-rail-link, .camp-sidebar-item, .proj-cat-btn, .m2-sb-j, .sci-node, #fin-sidebar > div[onclick], #lists-sidebar .sidebar-item {
    display:flex; align-items:center; gap:6px; padding:5px 8px !important; border-radius:7px !important; cursor:pointer;
    font-size:12.6px !important; font-weight:500 !important; color:var(--sage-850) !important; background:transparent; margin:0 !important; line-height:1.35; }
  .phi-rail-item { border-radius:7px; }
  .sidebar .sidebar-item:hover, .phi-rail-item:not(.active):hover, .camp-sidebar-item:hover, .proj-cat-btn:hover, .m2-sb-j:hover, .sci-node:hover, #fin-sidebar > div[onclick]:hover { background:var(--grey-50) !important; }
  .sidebar .sidebar-item.active, .phi-rail-item.active, .camp-sidebar-item.active, .proj-cat-btn.active, .proj-cat-btn.active-status, .sci-node.on { background:var(--plum-650) !important; color:var(--white) !important; font-weight:700 !important; }
  .sidebar .sidebar-item.active, .camp-sidebar-item.active, .proj-cat-btn.active, .sci-node.on { color:var(--white) !important; }
  .phi-rail-item.active .phi-rail-link { color:var(--white) !important; font-weight:700 !important; }
  .sidebar .sidebar-item .count, .camp-sidebar-item .cs-count, .sci-n { margin-left:auto; font-size:11px !important; color:var(--sage-400) !important; background:none !important; padding:0 !important; opacity:1 !important; }
  .sidebar .sidebar-item.active .count, .camp-sidebar-item.active .cs-count, .sci-node.on .sci-n { color:rgba(255,255,255,.8) !important; }
  .sidebar .sidebar-section, .camp-sidebar > div { padding:0 !important; margin-bottom:14px; }
  .m2-sb-p, .phi-p-side .m2-sb-p, #view-projects > div > aside:first-child > div:nth-child(2) { font-size:12px; color:var(--sage-450); line-height:1.5; padding:0 8px 8px; }
  .phi-rail-child { font-size:12.1px !important; padding:4px 8px !important; }
  /* ── the text-size and dark buttons ── */
  /* Sara 2026-09-25: text size and dark mode sit in the top-right corner, mirroring the logo in the top-left (same distance from the top and from the side), above Alta. */
  .topnav { position:relative; }
  .phi-tools { display:flex; gap:4px; align-items:center; position:absolute; top:13px; right:26px; margin:0; padding:0; z-index:30; }
  .phi-tools button { background:rgba(255,255,255,.12); color:var(--white); border:1px solid rgba(255,255,255,.25); border-radius:7px; padding:4px 9px; font-size:11.5px; font-weight:700; font-family:inherit; cursor:pointer; }
  .phi-tools button:hover { background:rgba(255,255,255,.22); }
  /* The page's grey-teal never shows in the middle of a screen (Sara 2026-09-15) */
  .content, .main, #view-model, #view-projects, #fin-main, .ledger-wrap { background:var(--grey-50); }
  .phi-row3 > .m2-card { margin:0; display:flex; flex-direction:column; }
  .phi-row3 > .m2-card > .m2-card-b { flex:1; }
  /* Scrollbars show only while you scroll or hover the list, like the Mac does */
  *::-webkit-scrollbar { width:9px; height:9px; }
  *::-webkit-scrollbar-track { background:transparent; }
  *::-webkit-scrollbar-thumb { background:transparent; border-radius:6px; border:2px solid transparent; background-clip:padding-box; }
  .phi-scrollhover::-webkit-scrollbar-thumb, .phi-scrolling::-webkit-scrollbar-thumb { background:rgba(40,60,55,.28); background-clip:padding-box; }
  .phi-crew-row { align-items:stretch; }
  .phi-crew > div > div:first-child { height:auto !important; aspect-ratio:1 / 1; }
  /* Sara 2026-09-19: with the photo capped it is a landscape crop, so take it
     from the top of the frame - that is where the face is. */
  .phi-crew > div > div:first-child img { object-position:center top !important; }
  .phi-crew { display:flex; flex-direction:column; }
  .phi-crew > div { flex:1; display:flex; flex-direction:column; }
  /* The contact record sits in a box like everything else */
  .contact-sheet { top:12px !important; bottom:12px !important; left:calc(var(--sidebar) + 12px) !important; right:12px !important;
    border-radius:13px !important; border:1px solid var(--border,var(--emerald-250)) !important; border-top:3px solid var(--plum,var(--plum-650)) !important; }
  /* The related-objects rail, right of All Contacts and the Campaigns list */
  .phi-related { width:300px; flex-shrink:0; background:var(--content-bg,var(--sage-75)); border-left:1px solid var(--border,var(--emerald-250));
    position:sticky; top:calc(68px + var(--subbar-h,0px)); height:calc(100vh - 68px - var(--subbar-h,0px)); overflow-y:auto; padding:14px 12px 30px; box-sizing:border-box; }
  .phi-related .mb-rail { position:static; max-height:none; margin-bottom:12px; }
  .phi-rel-more { font-size:11.5px; font-weight:700; color:var(--emerald-600); cursor:pointer; }
  .phi-rel-more:hover { text-decoration:underline; }
  /* Every box lifts a little on hover, like the Home tiles (Sara 2026-09-15) */
  .m2-card, .mb-slab, .m2-tile, .sci-row, .ppl-card, .phi-stat, .mb-card, .mb-kpi, .mb-profile, .mb-diag, .mb-rail, .report-card, .product-card, .rl-card, .kb-card, .m2-pcard, .hsec, .detail-section, .phi-crew, .alta-card, .pers-table, .type-list, .sci-methods, .sci-inline, .mb-ent, .sci-box, .ws-card
    { transition:box-shadow .16s, transform .16s, border-color .16s; }
  .m2-card:hover, .mb-slab:hover, .m2-tile:hover, .sci-row:hover, .ppl-card:hover, .phi-stat:hover, .mb-card:hover, .mb-kpi:hover, .mb-profile:hover, .mb-diag:hover, .mb-rail:hover, .report-card:hover, .product-card:hover, .rl-card:hover, .kb-card:hover, .m2-pcard:hover, .hsec:hover, .detail-section:hover, .phi-crew:hover, .alta-card:hover, .pers-table:hover, .type-list:hover, .sci-methods:hover, .sci-inline:hover, .mb-ent:hover, .sci-box:hover, .ws-card:hover
    { box-shadow:0 8px 22px rgba(0,0,0,.09); transform:translateY(-2px); }
  .phi-alta-cell > .m2-area:hover, .m2-area-wide.od-page:hover { transform:none; }
  .corp-row .corp-t, .out-row .out-row-n { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .corp-row .corp-d, .out-row .out-row-m { flex:0 1 auto; max-width:55%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  /* Every box carries an accent - a top line (the Members page) or a left line (Home) -
     so boxes never blend into each other (Sara 2026-09-15). */
  .m2-card { border-top:3px solid var(--card-ac, var(--emerald-600)) !important; }
  .m2-grid2 > div > .m2-card:nth-of-type(4n+2), .phi-row > .m2-card:nth-of-type(2) { --card-ac:var(--plum-650); }
  .m2-grid2 > div > .m2-card:nth-of-type(4n+3) { --card-ac:var(--amber-450); }
  .m2-grid2 > div > .m2-card:nth-of-type(4n+4) { --card-ac:var(--emerald-625); }
  .out-section .m2-card { --card-ac: var(--out-accent, var(--emerald-600)); }
  .m2-tile, .sci-row, .ppl-card, .alta-card, .report-card, .product-card, .rl-card, .kb-card, .m2-pcard { border-left:4px solid var(--card-ac, var(--emerald-600)) !important; }
  .ppl-card, .alta-card { --card-ac:var(--plum-650); }
  .sci-row { --card-ac:var(--emerald-550); }
  .report-card, .product-card { --card-ac:var(--amber-450); }
  .hsec, .pers-table, .type-list, .sci-methods, .sci-inline, .detail-section, .phi-crew { border-top:3px solid var(--card-ac, var(--emerald-600)) !important; }
  .detail-section { --card-ac:var(--plum-650); }
  .sci-methods, .sci-inline { --card-ac:var(--emerald-550); }
  /* One look for every search box: white, rounded, a small magnifier on the left */
  input[placeholder*="Search"], input[placeholder*="search"] {
    background:var(--white) url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235f7370' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E") no-repeat 11px center / 14px 14px !important;
    border:1px solid var(--border,var(--emerald-250)) !important; border-radius:9px !important; padding:8px 12px 8px 33px !important;
    font-size:13px !important; font-family:inherit !important; color:var(--text) !important; outline:none !important; box-sizing:border-box; }
  input[placeholder*="Search"]:focus, input[placeholder*="search"]:focus { border-color:var(--emerald-600) !important; box-shadow:0 0 0 3px rgba(47,107,82,.12); }
  .mb-search input[placeholder*="Search"] { background:transparent !important; border:none !important; padding:0 !important; box-shadow:none !important; }
  .phi-rail-searchbox{ padding:0 0 12px; }
  .phi-rail-searchbox input{ width:100% !important; box-sizing:border-box !important; margin:0 !important; }
  .phi-noneed{ display:none !important; }   /* Sara 2026-09-16: no upload / new buttons in page headers */
  /* Sara 2026-09-16: no green band behind a subtab's title. Page-template headers sit on the page like every frame page. */
  .phi-p-head:not(.contacts-header-bar):not(.sci-head){ background:transparent !important; border-bottom:none !important; }
  #view-docs, #view-templates, #view-reflib, #alta-kb-block{ background:var(--grey-50); }
  body.phi-dark #view-docs, body.phi-dark #view-templates, body.phi-dark #view-reflib, body.phi-dark #alta-kb-block{ background:var(--color-page-bg); }
  #view-docs .phi-p-head button, #view-reflib .phi-p-head button{ background:var(--white) !important; color:var(--plum-650) !important; border:1px solid #d9d2dc !important; box-shadow:none !important; }
  #view-docs .phi-p-head button:hover, #view-reflib .phi-p-head button:hover{ background:#f4eff6 !important; }

/* ── One line under the page heading (Sara 2026-09-19) ────────────────────── */
/* The heading band ends where its own writing ends, and the space under the subtitle
   is half what it was. Below that line the left column, the toolbar and the right-hand
   rail all start together - phiRelAlignTop sets the two rails to match the toolbar. */
#out-camphead .out-head-strip.phi-p-head { min-height:0 !important; padding-bottom:0 !important; }
#out-campaigns-block .camp-header-bar { padding-top:0 !important; }  /* Sara 2026-09-25: the buttons sit right under the title, as on All Contacts */
#out-campaigns-block .camp-sidebar { padding-top:0; }

/* ── One gap between the left column and the middle column (Sara 2026-09-19) ──
   It was 35px on the campaign list and up to 77px on the subtabs, because some
   screens centre their content inside the column and others do not. Any framed
   column that sits beside a left column now starts 32px after it, everywhere. */
body.phi-has-rail .m2wrap.phi-frame.phi-frame-page,
body.phi-has-rail .m2wrap.phi-frame.phi-frame-dash,
body.phi-has-rail .m2wrap.phi-frame,
body.phi-has-rail .phi-p-side,
body.phi-has-rail .phi-p-m2,
body.phi-has-rail .mb-wrap,
body.phi-has-rail #fin-main.phi-p-side { padding-left:32px !important; }

/* ── Record panels open below the green bar, not behind it (Sara 2026-09-19) ──
   The three slide-over panels were pinned to 88px, the height of the main nav
   before the second band existed, so a record's own title was hidden underneath
   it. They now start where the band ends, the same way the right-hand rail does. */
.contact-sheet-backdrop, .campaign-sheet-backdrop, .org-sheet-backdrop {
  top: var(--phi-sheet-top, 126px) !important;
}

/* the subtab band appears already in place, instead of sliding across (Sara 2026-09-19) */
#phi-subtabs > div { transition:opacity .42s ease; }   /* Sara 2026-09-19: come in more slowly */
#phi-subtabs.phi-band-settling > div { opacity:0 !important; }

/* the bookkeeping table carried its own 20px indent on top of the page gutter */
body.phi-has-rail .phi-p-side > .ledger-table,
body.phi-has-rail .phi-p-side > table.ledger-table { margin-left:0 !important; margin-right:0 !important; }

/* ── Record panels read like the rest of the site (Sara 2026-09-19) ──────────
   They were their own little world: gold uppercase headings on a gradient with a
   2px rule under them, 8px corners and a drop shadow, against cards everywhere
   else that are plain white with a thin border, 13px corners and a sentence-case
   heading. Same shape as .m2-card now. */
.camp-dp-section-card, .detail-section {
  border-radius:13px !important; box-shadow:none !important;
  border:1px solid var(--border) !important; margin-bottom:16px !important; }
.camp-dp-section-title, .detail-section-title {
  font-family:'Filson Pro',-apple-system,Segoe UI,Roboto,sans-serif !important;
  font-size:15.5px !important; font-weight:800 !important; text-transform:none !important;
  letter-spacing:0 !important; color:var(--text) !important;
  background:none !important; border-bottom:none !important; padding:14px 16px 2px !important; }
.camp-dp-section-body { padding:8px 16px 16px !important; }
body.phi-dark .camp-dp-section-title, body.phi-dark .detail-section-title { color:var(--grey-50) !important; }
/* the panel's own header band keeps the nav's green, no stray buttons in it */
.campaign-sheet-header, .contact-sheet-header { border-bottom:none !important; }


/* ══ THE ALTA SUBTABS ON THE SITE'S OWN FRAME (Sara 2026-09-20) ═══════════════
   "the page margins still don't match the project subtabs ... the left hand
   column is more narrow." Messages, Brain, Setup and Sessions had rules of their
   own - a 238px rail that started below the title, a width worked out by hand,
   and a Messages screen with no left column at all and a centred 960px page.
   Every one of them now takes what the Projects subtabs take: the standard left
   column (266px, #fbfcfc, full height, first line level with the title), the
   title in the column beside it, and the page side margins from the frame
   (32px after the rail on the left, the frame's own right margin). Active rows
   are plum, as on every other rail. Nothing here sets a width of its own. */

/* the left column itself - the same rule every other left column gets */
#alta-kb-side, #alta-inbox-list {
  width:auto !important; min-width:0 !important; max-width:none !important;
  background:var(--white) !important; border:none !important; border-right:1px solid var(--grey-75) !important;
  border-radius:0 !important; padding:52px 10px 40px !important; box-sizing:border-box; overflow-y:auto; }

/* Brain, Setup, Sessions: rail full height on the left, title and list beside it */
#alta-kb-block.kb-railed { grid-template-columns:266px minmax(0,1fr); grid-template-rows:auto minmax(0,1fr); }
#alta-kb-block.kb-railed > div:first-child { grid-column:2; grid-row:1; }
#alta-kb-block.kb-railed > #alta-kb-tabs { display:none !important; }
#alta-kb-block.kb-railed > div:last-child { display:contents !important; }   /* it carries an inline display:flex */
#alta-kb-block.kb-railed #alta-kb-side { grid-column:1; grid-row:1 / span 2; }
#alta-kb-block.kb-railed #alta-kb-list { grid-column:2; grid-row:2; padding-top:0 !important; padding-bottom:40px !important; }

/* the rail's rows read like every other rail's rows */
#alta-kb-side h4 { font-size:10.5px !important; font-weight:800 !important; letter-spacing:.07em !important; text-transform:uppercase !important;
  color:var(--sage-400) !important; padding:0 8px 12px !important; margin:18px 0 0 !important; }
#alta-kb-side h4:first-child, #alta-kb-side .phi-rail-searchbox + div h4:first-child { margin-top:4px !important; }
#alta-kb-side .cf-opt { padding:5px 8px !important; border-radius:7px !important; font-size:12.6px !important; font-weight:500 !important;
  color:var(--sage-850) !important; line-height:1.35; }
#alta-kb-side .cf-opt:hover { background:var(--grey-50) !important; }
#alta-kb-side .cf-opt.on { background:var(--plum-650) !important; color:var(--white) !important; font-weight:700 !important; }
#alta-kb-side .cf-opt .cf-n { font-size:11px !important; color:var(--sage-400) !important; }
#alta-kb-side .cf-opt.on .cf-n { color:rgba(255,255,255,.8) !important; }

/* Messages, by person: the conversation list is the left column */
#alta-inbox-block { grid-template-columns:266px minmax(0,1fr); grid-template-rows:auto minmax(0,1fr); }
#alta-inbox-block > #alta-msg-toolbar { grid-column:2; grid-row:1; }
#alta-inbox-block > #alta-inbox-list { grid-column:1; grid-row:1 / span 2; display:flex; flex-direction:column; }
#alta-inbox-block > div:last-child { grid-column:2; grid-row:2; min-height:0;
  margin:0 max(4%, calc((100% - var(--phi-page-w, 960px)) / 2)) 24px 32px; }
#alta-inbox-list > div:nth-child(2) { order:-1; padding:0 0 12px !important; border:none !important; }   /* search first, as on every rail */
#alta-inbox-tabs { display:flex !important; flex-direction:column !important; gap:1px !important; padding:0 !important; }
.am-tab { display:flex; align-items:center; gap:6px; width:100%; text-align:left; cursor:pointer; font-family:inherit;
  background:transparent; border:none; border-radius:7px; padding:5px 8px; font-size:12.6px; font-weight:500; color:var(--sage-850); line-height:1.35; }
.am-tab:hover { background:var(--grey-50); }
.am-tab .am-tab-t { flex:1; }
.am-tab .am-tab-n { font-size:11px; color:var(--sage-400); }
.am-tab.am-tab-on { background:var(--plum-650); color:var(--white); font-weight:700; }
.am-tab.am-tab-on .am-tab-n { color:rgba(255,255,255,.8); }
#alta-inbox-convos { padding:0 !important; }
.am-row { border-bottom:none !important; border-radius:7px !important; padding:6px 8px !important; margin-bottom:1px; box-shadow:none !important; background:transparent !important; }
.am-row:hover { background:var(--grey-50) !important; }
.am-row.am-row-on { background:var(--plum-650) !important; }
.am-row.am-row-on .am-name, .am-row.am-row-on .am-when, .am-row.am-row-on .am-prev { color:var(--white) !important; }
.am-row .am-name { font-size:12.6px !important; }

/* Messages, everything newest first: its own old teal title bar gives way to the page title */
#alta-log-block > div:last-child > div:first-child:not(#alta-msg-toolbar) { display:none !important; }
#alta-log-block #alta-list { padding-top:0 !important; padding-bottom:40px !important; }
#alta-log-block > aside.camp-sidebar { padding-top:52px !important; }

/* dark view */
body.phi-dark #alta-kb-side, body.phi-dark #alta-inbox-list { background:var(--color-surface) !important; border-right-color:var(--color-border) !important; }
body.phi-dark #alta-kb-side .cf-opt, body.phi-dark .am-tab { color:var(--sage-100) !important; }
body.phi-dark #alta-kb-side .cf-opt:hover, body.phi-dark .am-tab:hover, body.phi-dark .am-row:hover { background:var(--color-surface-raised) !important; }
body.phi-dark .am-tab.am-tab-on, body.phi-dark .am-row.am-row-on { background:var(--color-secondary) !important; color:var(--color-text-inverse) !important; }

/* Sara 2026-09-20: "maybe its partly the circles for contacts i don't like."
   A person with a real photograph still shows as a round photo. Where there is
   no photograph, the coloured circle with their initials in it is off - the name
   is right beside it, and the coloured blobs were the loudest thing on a quiet
   page. Deleting the one rule below brings every one of them back. */
.phi-initials { display:none !important; }
/* Sara 2026-09-21: the campaign list had no visible outline where All Contacts has one.
   A collapsed-border table drops its rounded frame, so it keeps its borders separate. */
#camp-table{ border-collapse:separate !important; border-spacing:0; }
/* the title now sits in the content column, on the same white as the table below it */
.camp-main > #out-camphead{ background:var(--white); }
body.phi-dark .camp-main > #out-camphead{ background:transparent; }

/* ── Modal shell ────────────────────────────────────────────────────────────
   Sara 2026-09-23: "Attach File" on a contact did nothing — not even a box.
   The three dialogs built in code (attach a document, edit a payment, the
   Mailchimp one) all use .modal-overlay, and that class had no styling at all,
   so the dialog was being added to the page and then laid out as an invisible
   strip at the very bottom. These rules give it a shell. */
.modal-overlay{
  position:fixed; inset:0; z-index:6000;
  background:rgba(20,32,28,.42);
  display:flex; align-items:center; justify-content:center;
  padding:24px; box-sizing:border-box;
}
.modal-overlay .modal-box{
  background:var(--white); border-radius:12px; width:100%; max-width:520px;
  max-height:88vh; display:flex; flex-direction:column; overflow:hidden;
  box-shadow:0 18px 48px rgba(0,0,0,.28); font-family:inherit;
}
.modal-overlay .modal-header{
  display:flex; align-items:center; gap:10px;
  background:var(--emerald-625); color:var(--white); padding:13px 18px; flex-shrink:0;
}
.modal-overlay .modal-title{ font-size:15px; font-weight:700; flex:1; }
.modal-overlay .modal-close{
  background:none; border:none; color:var(--white); font-size:18px; line-height:1;
  cursor:pointer; opacity:.85; padding:0 2px;
}
.modal-overlay .modal-close:hover{ opacity:1; }
.modal-overlay .modal-body{
  padding:18px; overflow-y:auto; flex:1; font-size:13px; color:var(--sage-850);
}
.modal-overlay .modal-footer{
  padding:13px 18px; border-top:1px solid var(--grey-50); flex-shrink:0;
  display:flex; justify-content:flex-end; gap:10px; background:var(--white);
}
.modal-overlay .form-label{
  display:block; font-size:11px; font-weight:700; text-transform:uppercase;
  letter-spacing:.045em; color:var(--sage-450); margin-bottom:5px;
}
.modal-overlay .form-input{
  width:100%; box-sizing:border-box; padding:8px 10px; border:1px solid var(--sage-125);
  border-radius:7px; font-family:inherit; font-size:13.5px; color:var(--sage-850); background:var(--white);
}
.modal-overlay .form-input:focus{ outline:none; border-color:var(--emerald-600); }
.modal-overlay textarea.form-input{ resize:vertical; min-height:72px; line-height:1.5; }

body.phi-dark .modal-overlay .modal-box{ background:#1e2724; color:var(--grey-75); }
body.phi-dark .modal-overlay .modal-body{ color:var(--grey-75); }
body.phi-dark .modal-overlay .modal-footer{ background:#1a221f; border-top-color:var(--sage-750); }
body.phi-dark .modal-overlay .form-input{ background:#141a18; border-color:var(--sage-750); color:var(--grey-75); }

/* ── Roles & Relationships: nothing runs off the page ───────────────────────
   Sara 2026-09-23: "note how the curved Add+ box is running off the page - fix
   that behaviour anywhere it is." The columns were equal fractions with no
   minimum of zero, so a wide control pushed its column past the card instead of
   wrapping inside it. */
.roles-grid-4{ grid-template-columns:repeat(4,minmax(0,1fr)); }
.roles-col{ min-width:0; }
.roles-col .role-active-row{ flex-wrap:wrap; min-width:0; }
.roles-col select,
.roles-col input,
.roles-col .role-add-btn,
.roles-discipline-slot select,
.roles-discipline-slot input,
.roles-discipline-slot .role-add-btn{
  max-width:100%; box-sizing:border-box;
}
.roles-col-discipline .roles-discipline-slot{ margin-top:0; }
/* the same guard for every other dashed add control on a contact record */
.detail-section select, .detail-section input, .detail-section textarea{
  max-width:100%; box-sizing:border-box;
}
/* the coloured column headings wrap rather than being cut off in a narrow panel */
.roles-col-label{ white-space:normal; overflow-wrap:anywhere; line-height:1.25; }
.roles-grid-4:has(.roles-col-discipline){ grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1.25fr); }

/* Sara 2026-09-25: a contact opened from a People card had its name hidden - the
   panel sat under the top bar (the bar is 300, the panel was 200). */
#detail-overlay{ z-index:320 !important; }
/* Sara 2026-09-25: faces cut off on the People cards. The photo box is short and
   wide, and the picture was pinned to its top edge, so chins went. Taller box,
   and the picture sits a little below its top so the whole face shows. */
/* 2026-09-25 second pass: still cut off - the pictures are square and the box was
   wider than tall, so a third of every picture was always hidden. The box is now
   square too, so the whole picture shows and nothing is cropped. */
.phi-crew .phi-crew-photo{ max-height:none !important; aspect-ratio:1 / 1; height:auto !important; }
.phi-crew-photo img{ object-fit:cover; object-position:center center !important; }

/* Sara 2026-09-25: Home (and every screen) came out taller than the window, so the
   page slid up under the top bar and left empty space at the bottom. The screen was
   sized as "window minus the top bar", which forgot the green subtab band and the
   text-size zoom. Now the page is exactly one window tall and the working area takes
   whatever is left under the two bars. --phi-vh is the window height at the current
   text size, set by phiFitZoom(). */
@media screen {
  html{ overflow: hidden; }
  body{ height: var(--phi-vh, 100vh); min-height: 0 !important; overflow: hidden; }
  body > .main{ min-height: 0; }
  body > .main > .content{ height: auto !important; min-height: 0; }
}

/* Sara 2026-09-25: Discipline / Modality's own column heading had no colour; it takes
   the light green its heading always had under Industry. */
.roles-col-discipline .roles-col-label{ background:var(--green-250) !important; color:var(--emerald-750) !important; }
body.phi-dark .roles-col-discipline .roles-col-label{ background:var(--green-250) !important; color:var(--emerald-750) !important; }