/* Veritura workspace, v7 (2026-10-25): THE STANDARD, MEASURED FROM MERCURY.
   Joey on v6.1: "still not on the same level on almost every front ... it must match very well while keeping the depth ... and a
   standard we can carry over so we know what to do for every other page." Every number below was read from Mercury's own pages
   (app-ux/r2/a-craft/ext/mercury-*.measure.json: the dashboard, tasks, transactions, an account, settings) and is written up, with
   the page templates and the rules for words, in app-ux/r3/STANDARD.md. This layer loads after next-v6.css and wins over it.

   Inks        #1E1E2A primary · #363644 secondary (titles of panels, labels, buttons) · #535461 tertiary (nav, chips) ·
               #70707D quaternary (table heads, counts, meta)
   Lines       one hairline rgba(112,115,147,.10); a control's edge .16; a chosen chip's edge .22; one fill .10
   Type        Inter (variable), Mercury's ramp only: 12 meta · 13 labels and table heads · 14 secondary cells · 15 body, nav,
               buttons, panel titles, rows · 19 section headings and a small panel's figure · 28 page titles and a large panel's
               figure · 34 a record's figure. Titles and figures at weight 380, everything else 400, names in a sentence 500.
   Frame       sidebar 220 · top bar 56 with no rule under it · a centred 968 column (a wide table may take the full width)
   Controls    32px: pill buttons (fill .10, primary #5266EB), round icon buttons, radius-8 chips (chosen: indigo tint)
   Panels      home: one hairline, radius 12, padding 24, no shadow · record: raised (no hairline, a two-part soft shadow)
   Rhythm      title 16 under the top bar · actions 28 under the title · panels 24 under the actions · rows of panels 40 apart,
               24 between columns · a table row 53 (two lines 65) */

:root {
  --v6-ink: #1e1e2a; --v6-ink-2: #363644; --v6-ink-3: #535461; --v6-ink-4: #70707d; --v6-ink-5: #a1a1ae;
  --v6-line: rgba(112, 115, 147, .10); --v6-line-2: rgba(112, 115, 147, .16); --v7-line-3: rgba(112, 115, 147, .22);
  --v6-fill: rgba(112, 115, 147, .10); --v6-fill-2: rgba(112, 115, 147, .16);
  --v6-nav: #fbfcfd; --v7-field: #fbfcfd;
  --v6-blue: #5266eb; --v6-blue-2: #4356d6; --v6-link: #465bd1; --v7-tint: rgba(82, 102, 235, .10);
  --v6-green: #036e43; --v6-amber: #b54708; --v6-red: #c0322d;
  --v7-raised: 0 0 2px 0 rgba(175, 178, 206, .56), 0 1px 3px 0 rgba(4, 4, 52, .10);
  --v7-col: 968px; --v7-gutter: 32px;
  --t-title-size: 28px; --t-title-lh: 36px; --t-title-track: 0;
  --t-num-size: 19px; --t-num-lh: 28px;
  --t-heading-size: 19px; --t-heading-lh: 28px;
  --t-body-size: 15px; --t-body-lh: 24px;
  --t-small-size: 13px; --t-small-lh: 20px;
  --t-label-size: 12px; --t-label-lh: 20px;
}
:root[data-theme="dark"] {
  --v6-line: rgba(255, 255, 255, .08); --v6-line-2: rgba(255, 255, 255, .13); --v7-line-3: rgba(255, 255, 255, .2);
  --v6-fill: rgba(255, 255, 255, .07); --v6-fill-2: rgba(255, 255, 255, .11);
  --v6-nav: #131419; --v7-field: #15161c;
  --v6-blue: #6f80f5; --v6-blue-2: #8392f7; --v6-link: #8d9cfa; --v7-tint: rgba(111, 128, 245, .16);
  --v6-green: #4cc472; --v6-red: #ff8a90;
  --v7-raised: 0 0 0 1px rgba(255, 255, 255, .08), 0 1px 3px 0 rgba(0, 0, 0, .4);
}

/* ---------- type: Mercury's ramp ---------- */
#view { font-size: 15px; line-height: 24px; color: var(--v6-ink); }
#view p { line-height: 24px; }
#view small, #view .muted, #view .sub { color: var(--v6-ink-4); }

/* ---------- the sidebar: 220, quiet greys, one lit item ---------- */
@media (min-width: 700px) {
  .shell { grid-template-columns: 220px minmax(0, 1fr); }
  .shell.mini { grid-template-columns: 72px minmax(0, 1fr); }
}
.shell > .nav { background: var(--v6-nav) !important; border-right: 1px solid var(--v6-line) !important; padding: 12px 8px 12px !important; }
.shell > .nav .brand { margin: 0 0 16px !important; padding: 4px 8px !important; height: 32px; display: flex; align-items: center; border-radius: 8px; }
.shell > .nav .brand:hover { background: var(--v6-fill); }
.shell > .nav .brand .bws { display: flex; align-items: center; gap: 10px; min-width: 0; }
.shell > .nav .brand .vk-wsi { width: 24px !important; height: 24px !important; border-radius: 50% !important; font-size: 10px !important; line-height: 24px !important; font-weight: 500 !important; flex: none; }
.shell > .nav .brand b { display: none; }
.shell > .nav .brand #wsNav { font-size: 14px !important; line-height: 20px !important; font-weight: 400 !important; color: var(--v6-ink) !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.shell > .nav .navitems a[data-nav] { height: 30px !important; margin: 0 0 6px !important; padding: 0 8px 0 8px !important; gap: 12px !important; border-radius: 8px !important; font-size: 15px !important; line-height: 24px; font-weight: 400 !important; color: var(--v6-ink-3) !important; }
.shell > .nav .navitems a[data-nav] svg.i { width: 16px !important; height: 16px !important; color: var(--v6-ink-3) !important; }
.shell > .nav .navitems a[data-nav]:hover { background: var(--v6-fill) !important; color: var(--v6-ink) !important; }
.shell > .nav .navitems a[data-nav][aria-current] { background: var(--v6-fill) !important; color: var(--v6-ink) !important; font-weight: 400 !important; }
.shell > .nav .navitems a[data-nav][aria-current] svg.i { color: var(--v6-ink) !important; }
.shell > .nav .navitems a[data-nav] .count { font-size: 12px !important; line-height: 20px; font-weight: 480 !important; letter-spacing: .2px; color: var(--v6-ink-4) !important; background: none !important; min-width: 0; padding: 0; }
.shell > .nav .navitems a[data-nav] .count.hot { color: var(--v6-red) !important; }
/* the bands are divided the way Mercury divides its groups: a hairline across the sidebar */
#nav .navgroup.v5-band + .navgroup.v5-band { margin-top: 10px !important; padding-top: 12px; border-top: 1px solid var(--v6-line); margin-left: -8px; margin-right: -8px; padding-left: 8px; padding-right: 8px; }
#nav .navgroup.v5-foot { margin-top: 10px !important; padding-top: 12px !important; border-top: 1px solid var(--v6-line) !important; margin-left: -8px; margin-right: -8px; padding-left: 8px; padding-right: 8px; }

/* ---------- the top bar: 56, nothing under it ---------- */
.shell .main > header.top { border-bottom: 0 !important; box-shadow: none !important; }
@media (min-width: 700px) {
  .shell .main > header.top { height: 56px; padding: 0 24px 0 12px; }
  header.top > #topSearch span { font-size: 15px !important; color: var(--v6-ink-2) !important; }
  header.top > #topSearch svg.i { width: 16px; height: 16px; color: var(--v6-ink-2) !important; }
  header.top > .v87vbtn { font-size: 15px !important; color: var(--v6-ink-2) !important; }
  header.top > #r95ask svg.i, header.top .v95-bell-b svg.i { color: var(--v6-ink-2); }
}

/* ---------- the page: a centred 968 column; one header ---------- */
#view .page { max-width: calc(var(--v7-col) + 2 * var(--v7-gutter)) !important; margin-left: auto !important; margin-right: auto !important; padding-left: var(--v7-gutter) !important; padding-right: var(--v7-gutter) !important; padding-top: 16px !important; }
#view .page[data-v7w="wide"] { max-width: none !important; padding-left: 24px !important; padding-right: 24px !important; }
#view .page > :is(.phead, .v89-head) { min-height: 36px !important; }
#view .page > :is(.phead, .v89-head) h1, #view .page > :is(.phead, .v89-head) .v89-titlerow h1, #view .v6-hello h1 { font-size: 28px !important; line-height: 36px !important; font-weight: 380 !important; letter-spacing: 0 !important; color: var(--v6-ink) !important; }
#view .page > :is(.phead, .v89-head) :is(p, .v89-purpose) { margin-top: 4px !important; font-size: 15px !important; line-height: 24px !important; color: var(--v6-ink-3) !important; }
#view .page > :is(.phead, .v89-head) .vk-hsub { font-size: 15px !important; line-height: 24px !important; color: var(--v6-ink-4) !important; }

/* sub-pages: Mercury's chips (Tasks › Incomplete, Completed), 28 under the title */
#view .v5-tabs { height: auto !important; margin: 24px 0 24px !important; padding: 0 !important; gap: 8px !important; border: 0 !important; background: none !important; flex-wrap: wrap; }
#view .v5-tabs > a[role="tab"] { height: 32px !important; padding: 0 12px !important; border: 1px solid var(--v6-line-2) !important; border-radius: 8px !important; background: var(--v7-field) !important; font-size: 15px !important; line-height: 24px; font-weight: 400 !important; color: var(--v6-ink-3) !important; display: inline-flex; align-items: center; gap: 8px; }
#view .v5-tabs > a[role="tab"]:hover { color: var(--v6-ink) !important; border-color: var(--v7-line-3) !important; }
#view .v5-tabs > a[role="tab"][aria-selected="true"] { background: var(--v7-tint) !important; border-color: transparent !important; color: var(--v6-ink) !important; font-weight: 400 !important; }
#view .v5-tabs > a[role="tab"]::after { display: none !important; }
#view .v5-tabs .v5-n { font-size: 12px !important; line-height: 20px; font-weight: 480; letter-spacing: .2px; }
#view .v5-tabs.v5-stuck { background: var(--v6-page) !important; }

/* ---------- controls: 32px ---------- */
.shell .btn, #dialog .btn { height: 32px !important; padding: 0 16px !important; font-size: 15px !important; line-height: 24px; font-weight: 400 !important; color: var(--v6-ink-2) !important; background: var(--v6-fill) !important; gap: 8px !important; }
.shell .btn:has(svg.i), #dialog .btn:has(svg.i) { padding-left: 12px !important; }
.shell .btn svg.i, #dialog .btn svg.i { width: 16px !important; height: 16px !important; }
.shell .btn:hover, #dialog .btn:hover { background: var(--v6-fill-2) !important; color: var(--v6-ink) !important; }
.shell .btn.primary, #dialog .btn.primary { background: var(--v6-blue) !important; color: #fff !important; }
.shell .btn.primary:hover, #dialog .btn.primary:hover { background: var(--v6-blue-2) !important; color: #fff !important; }
.shell .btn.ghost, #dialog .btn.ghost { background: transparent !important; color: var(--v6-ink-2) !important; }
.shell .btn.ghost:hover, #dialog .btn.ghost:hover { background: var(--v6-fill) !important; }
.shell .btn.sm, #dialog .btn.sm { height: 28px !important; padding: 0 12px !important; font-size: 14px !important; }
#view a.link, #view .link, #view .v6-pf a { color: var(--v6-link) !important; }
#view :is(input[type="text"], input[type="search"], input[type="email"], input[type="date"], input[type="number"], input:not([type]), select, textarea):not(.v89r-search input) { border: 1px solid var(--v6-line-2) !important; border-radius: 8px !important; background: var(--v7-field); font-size: 15px; color: var(--v6-ink); box-shadow: none !important; }
/* a segmented control: Mercury's track (Banking, Payroll, Books) */
#view .v6-tabs { padding: 0 !important; gap: 0 !important; border-radius: 8px !important; background: var(--v6-fill) !important; }
#view .v6-tabs button { height: 32px !important; padding: 0 12px !important; border-radius: 8px !important; font-size: 14px !important; color: var(--v6-ink-3) !important; border: 1px solid transparent !important; }
#view .v6-tabs button[aria-pressed="true"] { background: #fff !important; border-color: var(--v7-line-3) !important; box-shadow: none !important; color: var(--v6-ink) !important; }
:root[data-theme="dark"] #view .v6-tabs button[aria-pressed="true"] { background: var(--v6-surface) !important; }

/* ---------- sections and panels ---------- */
#view .page .card > .card-h h2, #view .page .card > .card-h h3, #view .v5-sec h2 { font-size: 19px !important; line-height: 28px !important; font-weight: 400 !important; letter-spacing: 0 !important; color: var(--v6-ink) !important; }
#view .page .card > .card-h .sub, #view .page .card > .card-h .n { font-size: 15px !important; line-height: 24px !important; color: var(--v6-ink-4) !important; }
#view .page .card { margin-bottom: 40px; }
/* a panel: the home grid and side columns are bordered; a record's summary is raised */
#view :is(.v6-panel, aside.stack > .card, .vk-split-side > .card, .vk-split-side > section, .g-main > aside .card, .r92e-grid > aside .card), #view .page .vk-lit { border: 1px solid var(--v6-line) !important; border-radius: 12px !important; padding: 24px !important; box-shadow: none !important; }
#view .v6-panel.v7-raised, #view .page .vk-lit.v7-raised { border-color: transparent !important; box-shadow: var(--v7-raised) !important; }
#view .vk-lit-t, #view .vk-lit h3 { font-size: 15px !important; line-height: 24px !important; font-weight: 400 !important; color: var(--v6-ink-2) !important; }

/* ---------- tables sit on the page ---------- */
#view table th { height: 36px; padding: 8px 16px !important; font-size: 13px !important; line-height: 20px !important; letter-spacing: .1px !important; font-weight: 400 !important; color: var(--v6-ink-4) !important; border-bottom: 1px solid var(--v6-line) !important; }
#view table td { padding: 14px 16px !important; font-size: 15px !important; line-height: 24px !important; color: var(--v6-ink-2); border-bottom: 1px solid var(--v6-line) !important; }
#view table :is(th, td):first-child { padding-left: 0 !important; }
#view table :is(th, td):last-child { padding-right: 0 !important; }
#view table td .l1, #view table td b { font-weight: 400 !important; color: var(--v6-ink) !important; }
#view table td :is(.l2, small, .muted) { font-size: 14px !important; line-height: 20px !important; color: var(--v6-ink-3) !important; }
#view table tbody tr[data-go]:hover td, #view table tbody tr[tabindex]:hover td { background: var(--v6-fill) !important; }

/* ---------- figures in a row (Transactions: "Net change this month") ---------- */
#view :is(.v89-strip, .vk-kpis, .qe-tiles, .v75kpis) { gap: 16px 48px !important; margin-bottom: 40px !important; }
#view :is(.v89-strip .lab, .vk-kpi-l, .v75k-l, .qe-tiles span) { font-size: 14px !important; line-height: 20px !important; color: var(--v6-ink-3) !important; }
#view :is(.v89-strip .num, .vk-kpi-v, .v75k-v, .qe-tiles b) { font-size: 19px !important; line-height: 28px !important; font-weight: 400 !important; letter-spacing: -.03em !important; color: var(--v6-ink) !important; }
#view :is(.v89-strip .sub, .vk-kpi-s, .v75k-s) { font-size: 13px !important; line-height: 20px !important; color: var(--v6-ink-4) !important; }

/* ---------- the agents' marks: Vera reads and verifies (a V that is a tick), Cato inspects (a lens with a tick). Agents are
   rounded squares; people are circles. ---------- */
.vv-av, #view .v5-av.vera, .v7-vera {
  background: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2032%2032%22%3E%3Cdefs%3E%3ClinearGradient%20id=%22a%22%20x1=%220%22%20y1=%220%22%20x2=%221%22%20y2=%221%22%3E%3Cstop%20offset=%220%22%20stop-color=%22%237d8cf8%22/%3E%3Cstop%20offset=%221%22%20stop-color=%22%234338ca%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect%20width=%2232%22%20height=%2232%22%20rx=%229%22%20fill=%22url(%23a)%22/%3E%3Cpath%20d=%22M9.6%2012.2l5%208.9%207.9-13.1%22%20fill=%22none%22%20stroke=%22%23fff%22%20stroke-width=%222.7%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22/%3E%3Cpath%20d=%22M9.3%205.6l.75%201.75%201.75.75-1.75.75-.75%201.75-.75-1.75-1.75-.75%201.75-.75z%22%20fill=%22%23fff%22/%3E%3C/svg%3E") center / cover no-repeat !important;
  color: transparent !important; font-size: 0 !important; text-indent: -999px; overflow: hidden; border-radius: 28% !important; box-shadow: none !important; border: 0 !important;
}
#view .v5-av.cato, .v7-cato {
  background: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2032%2032%22%3E%3Cdefs%3E%3ClinearGradient%20id=%22a%22%20x1=%220%22%20y1=%220%22%20x2=%221%22%20y2=%221%22%3E%3Cstop%20offset=%220%22%20stop-color=%22%2337a3a0%22/%3E%3Cstop%20offset=%221%22%20stop-color=%22%231e4f63%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect%20width=%2232%22%20height=%2232%22%20rx=%229%22%20fill=%22url(%23a)%22/%3E%3Ccircle%20cx=%2214.2%22%20cy=%2214.2%22%20r=%226.2%22%20fill=%22none%22%20stroke=%22%23fff%22%20stroke-width=%222.5%22/%3E%3Cpath%20d=%22M18.9%2018.9l4.6%204.6%22%20stroke=%22%23fff%22%20stroke-width=%222.7%22%20stroke-linecap=%22round%22/%3E%3Cpath%20d=%22M11.6%2014.3l1.8%201.8%203.3-3.5%22%20fill=%22none%22%20stroke=%22%23fff%22%20stroke-width=%221.9%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22/%3E%3C/svg%3E") center / cover no-repeat !important;
  color: transparent !important; font-size: 0 !important; text-indent: -999px; overflow: hidden; border-radius: 28% !important; box-shadow: none !important; border: 0 !important;
}
header.top > .v87vbtn .vv-av { width: 22px !important; height: 22px !important; }

/* ---------- the phone keeps its own spacing ---------- */
@media (max-width: 699px) {
  #view .page { padding-left: 16px !important; padding-right: 16px !important; }
  #view .v5-tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  #view .v5-tabs > a[role="tab"] { flex: none; min-height: 40px; }
}

/* =====================================================================================================================
   THE HOME (Today on every door): Mercury's dashboard composition in the 968 column
   ===================================================================================================================== */
#view .v7-home .v6-hello { min-height: 36px !important; }
#view .v6-quick { margin: 28px 0 24px !important; gap: 12px !important; }
#view .v6-quick .btn.ghost { padding: 0 8px !important; }
#view .v6-grid { gap: 24px !important; margin-bottom: 40px !important; }
#view .v6-grid > .v6-panel { padding: 24px !important; }
/* a panel's head: its title in the secondary ink at the body size, never bold (Mercury: "Accounts", "Bill Pay") */
#view .v6-ph { min-height: 32px !important; margin-bottom: 4px !important; }
#view .v6-ph h2 { font-size: 15px !important; line-height: 24px !important; font-weight: 400 !important; color: var(--v6-ink-2) !important; letter-spacing: 0 !important; }
#view .v6-ph .v6-c { font-size: 15px !important; line-height: 24px; color: var(--v6-ink-4) !important; }
/* a large panel's figure (Mercury balance) and a small panel's (Credit Card) */
#view .v6-fig { font-size: 28px !important; line-height: 36px !important; font-weight: 380 !important; letter-spacing: -.03em !important; color: var(--v6-ink) !important; }
#view .v6-fig small { font-size: 15px !important; line-height: 24px; letter-spacing: 0 !important; color: var(--v6-ink-3) !important; margin-left: 8px !important; font-weight: 400; }
#view .v7-sm .v6-fig { font-size: 19px !important; line-height: 28px !important; font-weight: 400 !important; }
#view .v6-fig[data-tone="critical"] { color: var(--v6-red) !important; }
#view .v6-fig[data-tone="attention"] { color: var(--v6-amber) !important; }
#view .v6-figline { margin-top: 0 !important; font-size: 15px !important; line-height: 24px !important; color: var(--v6-ink-3) !important; }
/* label and value lines: Mercury's Accounts list (15/24, label secondary, value primary) */
#view .v6-kv li > :is(a, div) { min-height: 32px !important; }
#view .v6-kv span { font-size: 15px !important; line-height: 24px !important; color: var(--v6-ink-2) !important; }
#view .v6-kv b { font-size: 15px !important; line-height: 24px !important; font-weight: 400 !important; color: var(--v6-ink) !important; }
#view .v6-kv b[data-tone="critical"] { color: var(--v6-red) !important; }
#view .v6-kv b[data-tone="attention"] { color: var(--v6-amber) !important; }
#view .v6-kv + .v6-kv { margin-top: 0; }
#view .v6-bar { height: 8px !important; border-radius: 4px !important; margin-top: 12px !important; background: var(--v6-fill-2) !important; }
/* Mercury's columns: a label over its value (Bill Pay: Outstanding, Overdue, Due soon); a rule under them */
#view .v6-figs, #view .v6-cols { display: grid !important; gap: 16px !important; margin-top: 16px !important; padding-bottom: 15px; border-bottom: 1px solid var(--v6-line); }
#view .v7-cols4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
#view .v7-cols3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
#view .v6-figs span, #view .v6-cols span, #view .v6-figbtn span { font-size: 13px !important; line-height: 20px !important; letter-spacing: .1px; color: var(--v6-ink-2) !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#view .v6-figs b, #view .v6-cols b, #view .v6-figbtn b { font-size: 15px !important; line-height: 24px !important; font-weight: 400 !important; color: var(--v6-ink) !important; }
#view .v6-figbtn { min-width: 0; border-radius: 6px; }
#view .v6-figbtn[aria-pressed="true"] b { color: var(--v6-link) !important; }
#view .v6-figbtn[aria-pressed="true"] span { color: var(--v6-ink) !important; }
#view .v6-cols + .v6-kv, #view .v6-figs + .v6-kv { margin-top: 8px !important; padding-top: 0 !important; border-top: 0 !important; }
/* a panel's foot: a link with its chevron (Mercury: "View >") */
#view .v6-pf { padding-top: 16px !important; }
#view .v6-pf a, #view .v6-pf .link, #view .v6-pf-row .link { font-size: 15px !important; line-height: 24px; display: inline-flex; align-items: center; gap: 4px; }
#view .v6-pf svg.i, #view .v6-pf-row svg.i { width: 14px; height: 14px; }
#view .v6-pf-row { border-top: 1px solid var(--v6-line); margin: 0 -24px !important; padding: 16px 24px 0 !important; }
#view .v6-note, #view .v6-note a, #view .v6-note .link { font-size: 15px !important; line-height: 24px; color: var(--v6-ink-4) !important; }
#view .v6-note a:hover, #view .v6-note .link:hover { color: var(--v6-link) !important; }
/* Needs you: Mercury's Tasks rows, one line each */
#view .v7-tasks { margin: 8px -24px 0; }
#view .v7-task { display: grid; grid-template-columns: 16px minmax(0, 1fr) auto; align-items: center; gap: 16px; min-height: 56px; padding: 0 24px; border-top: 1px solid var(--v6-line); color: inherit; text-decoration: none; }
#view a.v7-task:hover { background: var(--v6-fill); }
#view .v7-tt { display: flex; align-items: baseline; gap: 12px; min-width: 0; white-space: nowrap; overflow: hidden; }
#view .v7-tt b { flex: none; max-width: 60%; overflow: hidden; text-overflow: ellipsis; font-size: 15px; line-height: 24px; font-weight: 400; color: var(--v6-ink); }
#view .v7-tt span { min-width: 0; overflow: hidden; text-overflow: ellipsis; font-size: 15px; line-height: 24px; color: var(--v6-ink-4); }
#view .v7-tt span .mono, #view .v7-tt span a { color: inherit; font-size: inherit; text-decoration: none; }
#view .v7-task .v6-go { font-size: 15px; line-height: 24px; color: var(--v6-link); white-space: nowrap; }
#view .v7-task .v6-acts .btn { font-size: 15px !important; }
/* the chain: five columns with their meters */
#view .v6-stages { gap: 12px !important; margin-top: 16px !important; }
#view .v6-stage { padding: 0 !important; }
#view .v6-stage span { font-size: 13px !important; line-height: 20px !important; letter-spacing: .1px; color: var(--v6-ink-2) !important; }
#view .v6-stage b { font-size: 19px !important; line-height: 28px !important; font-weight: 400 !important; color: var(--v6-ink) !important; }
#view .v6-stage.wait b { color: var(--v6-amber) !important; }
#view .v6-stage .v6-meter { height: 8px !important; border-radius: 4px !important; margin-top: 8px !important; background: var(--v6-fill-2) !important; }
#view .v6-stage .v6-meter i { background: var(--v6-blue) !important; border-radius: 4px !important; }
#view .v6-stage.wait .v6-meter i { background: #f79009 !important; }
#view .v6-stages + .v6-kv { margin-top: 16px !important; padding-top: 8px; border-top: 1px solid var(--v6-line); }
#view .v6-chart { height: 132px !important; margin-top: 12px !important; }
#view .v6-chart .ln { stroke: var(--v6-blue) !important; stroke-width: 1.5 !important; }
#view .v6-axis { font-size: 12px !important; line-height: 20px !important; color: var(--v6-ink-4) !important; }
/* Coming up and the agents in a third of the column */
#view .v7-sm .v6-list { margin: 4px -24px 0 !important; }
#view .v7-sm .v6-li { padding: 10px 24px !important; gap: 12px !important; }
#view .v7-sm .v6-li.v6-dated { grid-template-columns: 52px minmax(0, 1fr) !important; }
#view .v7-sm .v6-li.v6-dated .v6-go { display: none; }
#view .v6-li b { font-size: 15px !important; line-height: 24px !important; font-weight: 400 !important; color: var(--v6-ink) !important; }
#view .v6-li small { font-size: 13px !important; line-height: 20px !important; color: var(--v6-ink-4) !important; }
#view .v6-li .v6-date { font-size: 13px !important; line-height: 24px !important; color: var(--v6-ink-3) !important; }
#view .v6-who { grid-template-columns: 32px minmax(0, 1fr) auto !important; }
#view .v6-who .v5-av { width: 32px !important; height: 32px !important; }
#view .v6-who b { font-size: 15px !important; line-height: 24px !important; font-weight: 400 !important; }
#view .v6-who small { font-size: 13px !important; line-height: 20px !important; }
#view .v6-agent .v6-kv { margin: 8px 0 0 !important; }
#view .v6-agents .v6-agent + .v6-agent { margin-top: 16px !important; padding-top: 16px !important; }
/* an open section (Mercury's "Recent transactions"): a 19/28 heading, then the table on the page */
#view .v7-sec { margin: 0 0 40px; }
#view .v7-sec-h { display: flex; align-items: center; gap: 16px; margin: 0 0 12px; }
#view .v7-sec-h h2 { margin: 0; font-size: 19px; line-height: 28px; font-weight: 400; color: var(--v6-ink); }
#view .v7-sec-h a { font-size: 15px; color: var(--v6-link); text-decoration: none; display: inline-flex; align-items: center; gap: 4px; }
#view .v7-sec .v6-table { width: 100% !important; margin: 0 !important; }
#view .v7-sec .v6-table th { padding: 8px 8px !important; font-size: 12px !important; letter-spacing: .2px !important; }
#view .v7-sec .v6-table td { padding: 14px 8px !important; }
#view .v7-sec .v6-table :is(th, td):first-child { padding-left: 8px !important; }
#view .v6-table .v6-td-d { width: 104px; font-size: 14px !important; color: var(--v6-ink) !important; }
#view .v6-table .v6-td-r { font-size: 14px !important; color: var(--v6-ink-3) !important; }
#view .v6-ev { font-weight: 400 !important; font-size: 15px; gap: 12px !important; }
#view .v6-evi { width: 28px !important; height: 28px !important; }
@media (max-width: 1099px) { #view .v6-grid > .v6-panel { grid-column: span 12 !important; } }
@media (max-width: 699px) {
  #view .v7-tt { flex-direction: column; gap: 0; white-space: normal; }
  #view .v7-tt b { max-width: 100%; white-space: nowrap; }
  #view .v7-tt span { white-space: nowrap; }
  #view .v7-task { padding: 10px 16px; } #view .v7-tasks { margin: 8px -16px 0; }
  #view .v6-pf-row { margin: 0 -16px !important; padding: 16px 16px 0 !important; }
  #view .v7-cols4 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

/* ---------- Vera's own page carries her mark beside her name ---------- */
#view .v7-mark-lg { display: inline-block; width: 32px; height: 32px; margin-right: 12px; vertical-align: -5px; flex: none; }
/* the workspace's name in the sidebar, with the demo said by a badge (Mercury: "Mercury Demo" with its "Pro") */
.shell > .nav .brand .v7-badge { margin-left: 6px; padding: 0 6px; height: 20px; border-radius: 6px; background: var(--v6-ink); color: #fff; font-size: 12px; line-height: 20px; font-weight: 480; letter-spacing: .2px; flex: none; }
.shell > .nav .brand .v7-wsrow { display: flex; align-items: center; min-width: 0; }
.shell > .nav .brand .v7-wsname { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.shell > .nav .brand #wsNav { overflow: visible !important; }
#view .v6-pf a, #view .v6-pf .link { white-space: nowrap; }
#view .v6-quick .btn.ghost { color: var(--v6-link) !important; gap: 4px !important; }
#view .v6-quick .btn.ghost svg.i { width: 14px !important; height: 14px !important; }
#view .v7-inlist { margin: 12px -24px 0 !important; }
#view .v7-inlist .v6-li { padding: 10px 24px !important; }
#view .v6-memo { font-size: 15px !important; line-height: 24px !important; color: var(--v6-ink-3) !important; margin-top: 12px !important; -webkit-line-clamp: 2 !important; }
#view .v7-sec .v6-table .v5-st { white-space: nowrap; }
#view .v6-quick [data-demo-read] { margin-left: auto; }

/* ---------- on the ramp: the older small print and figures that sat between its steps ---------- */
#view :is(.vk-meta, .vk-cite, .v87ln, .vcite .num, .vcite b.num) { font-size: 12px !important; line-height: 20px !important; }
#view .vk-kpi b { font-size: 19px !important; line-height: 28px !important; font-weight: 400 !important; letter-spacing: -.03em; }
#view :is(.v97-rc-next, .v97-rc-next b) { font-size: 14px !important; line-height: 20px !important; }
#view .v6-prof-t b { font-size: 15px !important; line-height: 24px !important; }
#view .v6-hello .v89-head-a .btn.ghost { color: var(--v6-link) !important; gap: 4px !important; padding: 0 8px !important; }
#view .v6-hello .v89-head-a .btn.ghost svg.i { width: 14px !important; height: 14px !important; }
@media (max-width: 699px) { #view .v6-hello [data-demo-read] { display: none; } }
/* every page's title, a record's too, at Mercury's 28/36 and weight 380 */
#view .page h1 { font-weight: 380 !important; letter-spacing: 0 !important; }
#view .page > :is(.phead, .v89-head, .v84-head, .vk-head) h1 { font-size: 28px !important; line-height: 36px !important; }
.shell > .nav .brand .v7-badge { color: var(--v6-page) !important; }
@media (max-width: 699px) {
  #view .v6-quick { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none; margin-left: -16px !important; margin-right: -16px !important; padding: 0 16px; }
  #view .v6-quick .btn { flex: none; }
}

/* =====================================================================================================================
   v7.1 (2026-10-26): MERCURY'S OWN PARTS ON THE HOME, measured on demo.mercury.com: a list row is a 28px circle, its name and its
   value, 44 apart; a summary panel is three labelled columns over a rule and one bottom row with "View"; a list ends "+N View all";
   a panel's head carries a 32px round button. Names and numbers only.
   ===================================================================================================================== */
#view .v71 .v6-grid { margin-bottom: 40px !important; }
#view .v7-p { display: flex !important; flex-direction: column; }
#view .v7-p .v6-ph { margin-bottom: 8px !important; }
#view .v7-ib { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--v6-fill); color: var(--v6-ink-2); text-decoration: none; flex: none; }
#view .v7-ib:hover { background: var(--v6-fill-2); color: var(--v6-ink); }
#view .v7-ib svg.i { width: 16px; height: 16px; }
/* the figure and the line under it (Mercury balance: "$5,216,471.18", then "Last 30 days") */
#view .v7-bal .v7-fig { font-size: 28px !important; line-height: 36px !important; font-weight: 380 !important; }
#view .v7-mov .v7-fig, #view .v7-sum .v7-fig { font-size: 19px !important; line-height: 28px !important; font-weight: 400 !important; }
#view .v7-sub { margin: 4px 0 0; font-size: 15px; line-height: 24px; color: var(--v6-ink-2); }
#view .v7-chart { margin: 16px -24px -24px; position: relative; flex: 1; display: flex; flex-direction: column; justify-content: flex-end; min-height: 200px; }
#view .v7-chart .v6-chart { height: 168px !important; margin: 0 !important; }
#view .v7-chart .v6-axis { padding: 4px 24px 12px; margin: 0 !important; }
#view .v7-seg button { height: 28px !important; padding: 0 10px !important; font-size: 13px !important; }
/* a list row */
#view .v7-ilist { display: flex; flex-direction: column; gap: 16px; margin: 8px 0 0; }
#view .v7-ir { display: flex; align-items: center; gap: 12px; min-height: 28px; color: inherit; text-decoration: none; background: none; border: 0; padding: 0; font: inherit; text-align: left; cursor: pointer; border-radius: 6px; }
#view a.v7-ir:hover .v7-in, #view button.v7-ir:hover .v7-in { color: var(--v6-ink); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--v6-line-2); }
#view .v7-in { flex: 1; min-width: 0; font-size: 15px; line-height: 24px; color: var(--v6-ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#view .v7-iv { flex: none; font-size: 15px; line-height: 24px; font-weight: 400; color: var(--v6-ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
#view .v7-iv[data-tone="critical"] { color: var(--v6-red); } #view .v7-iv[data-tone="attention"] { color: var(--v6-amber); }
#view .v7-ir .v6-acts { flex: none; gap: 12px; }
#view .v7-ir .v6-acts .btn { height: auto !important; padding: 0 !important; background: none !important; font-size: 15px !important; color: var(--v6-link) !important; }
#view .v7-ir .v6-acts .btn.ghost { color: var(--v6-ink-3) !important; }
#view .v7-ir .v6-acts .btn svg.i { display: none; }
#view .v7-more { margin-top: 0; width: 100%; }
#view .v7-more .v7-in { color: var(--v6-ink-2); }
/* the circles: a tinted icon, initials, a date, a count */
#view .v7-circ, #view .v7-av, #view .v7-date { width: 28px; height: 28px; border-radius: 50%; flex: none; display: inline-grid; place-items: center; background: var(--v6-fill); color: var(--v6-ink-2); }
#view .v7-circ svg.i { width: 14px; height: 14px; }
#view .v7-circ[data-tone="critical"] { background: rgba(240, 68, 56, .12); color: var(--v6-red); }
#view .v7-circ[data-tone="attention"] { background: rgba(247, 144, 9, .14); color: var(--v6-amber); }
#view .v7-circ[data-tone="positive"] { background: rgba(23, 178, 106, .12); color: var(--v6-green); }
#view .v7-circ-n { font-size: 12px; line-height: 20px; font-weight: 480; letter-spacing: .2px; background: var(--v6-fill-2); }
#view .v7-av { font-size: 12px; line-height: 20px; font-weight: 480; letter-spacing: .2px; color: var(--v6-ink-2); }
/* v7.4: the dark avatar darkens its tint under the initials (an inset shade), so the initials stay white at full contrast */
:root[data-theme="dark"] #view .v7-av { box-shadow: inset 0 0 0 28px rgba(18, 18, 26, .62); color: #fff; }
:root[data-theme="dark"] #view .v7-avs .v7-av { box-shadow: inset 0 0 0 28px rgba(18, 18, 26, .62), 0 0 0 2px var(--v6-page); }
#view .v7-date b { font-size: 12px; line-height: 20px; font-weight: 480; color: var(--v6-ink-2); }
#view .v7-date i { display: none; }
#view .v7-date.late { background: rgba(240, 68, 56, .12); } #view .v7-date.late b { color: var(--v6-red); }
#view .v7-agent { width: 28px !important; height: 28px !important; flex: none; }
/* a summary panel (Bill Pay): columns over a rule, then the bottom row */
#view .v7-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 8px 0 15px; border-bottom: 1px solid var(--v6-line); }
#view .v7-cols > :is(a, div) { display: flex; flex-direction: column; min-width: 0; color: inherit; text-decoration: none; }
#view .v7-cols span { font-size: 13px; line-height: 20px; letter-spacing: .1px; color: var(--v6-ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#view .v7-cols b { font-size: 15px; line-height: 24px; font-weight: 400; color: var(--v6-ink); font-variant-numeric: tabular-nums; }
#view .v7-cols b[data-tone="critical"] { color: var(--v6-red); } #view .v7-cols b[data-tone="attention"] { color: var(--v6-amber); }
#view .v7-cols a:hover b { color: var(--v6-link); }
#view .v7-bottom { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 16px; }
#view .v7-bottom > div { display: flex; flex-direction: column; min-width: 0; }
#view .v7-bottom span { font-size: 13px; line-height: 20px; letter-spacing: .1px; color: var(--v6-ink-2); }
#view .v7-bottom b { font-size: 15px; line-height: 24px; font-weight: 400; color: var(--v6-ink); white-space: nowrap; }
#view .v7-bottom b[data-tone="critical"] { color: var(--v6-red); } #view .v7-bottom b[data-tone="attention"] { color: var(--v6-amber); }
#view .v7-bottom .btn { flex: none; }
#view .v7-view { display: inline-flex; align-items: center; gap: 4px; font-size: 15px; line-height: 24px; color: var(--v6-link); text-decoration: none; white-space: nowrap; flex: none; }
#view .v7-view svg.i { width: 14px; height: 14px; }
#view .v7-cols + .v7-bottom { margin-top: auto; }
/* a movement panel (Money in): the figure, a rule, a label, the list, a rule, the bottom row */
#view .v7-rule { border: 0; border-top: 1px solid var(--v6-line); margin: 16px 0; }
#view .v7-lab { margin: 0 0 4px; font-size: 15px; line-height: 24px; color: var(--v6-ink-2); }
#view .v7-mov .v7-bottom { padding-top: 0; margin-top: 0; }
#view .v7-mov .v7-rule:last-of-type { margin-top: auto; padding-top: 0; }
#view .v7-mov .v7-ilist { margin-top: 12px; }
#view .v7-p > .v7-cols:last-child { border-bottom: 0; padding-bottom: 0; }
#view .v7-p > .v7-rule + .v7-cols { padding-top: 0; }
#view .v7-legend { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 8px; font-size: 12px; line-height: 20px; color: var(--v6-ink-3); }
#view .v7-legend i { display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin-right: 6px; vertical-align: 1px; }
#view .v7-note { margin: 16px 0 0; font-size: 13px; line-height: 20px; color: var(--v6-ink-4); }
#view .v7-note .link { font-size: 13px !important; }
/* the section (Money movement, Transactions) and its chips */
#view .v71 > .v7-sec > .v6-grid { margin-bottom: 0 !important; }
#view .v7-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }
#view .v7-chips button { height: 32px; padding: 0 12px; border: 1px solid var(--v6-line-2); border-radius: 8px; background: var(--v7-field); font: inherit; font-size: 15px; line-height: 24px; color: var(--v6-ink-3); cursor: pointer; }
#view .v7-chips button:hover { color: var(--v6-ink); }
#view .v7-chips button[aria-pressed="true"] { background: var(--v7-tint); border-color: transparent; color: var(--v6-ink); }
#view .v71 .v6-table td { padding: 12px 8px !important; }
#view .v71 .v6-table .v6-ev { display: inline-flex; align-items: center; gap: 12px; }
#view .v71 .v6-table .v6-td-d { font-size: 14px !important; color: var(--v6-ink) !important; }
@media (max-width: 699px) {
  #view .v7-chart { margin: 16px -16px -16px; } #view .v7-chart .v6-axis { padding: 4px 16px 12px; }
  #view .v7-chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  #view .v7-chips button { flex: none; }
}
#view .v7-p:not(.v7-sum):not(.v7-mov) > .v7-rule { margin-top: auto; }
#view .v7-iv { font-variant-numeric: normal; letter-spacing: 0; }

/* =====================================================================================================================
   v7.2 (2026-10-26): the rest of Mercury's home parts, from the design file (app-ux/r3/design/mercury-home.spec.json)
   ===================================================================================================================== */
/* the balance panel's second line: "Last 30 days" at the left, the movement at the right (Mercury: "↗ $1.8M  ↘ -$474K") */
#view .v7-subrow { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 4px; }
#view .v7-subrow .v7-sub { margin: 0; }
#view .v7-trends { display: inline-flex; gap: 16px; }
#view .v7-trend { display: inline-flex; align-items: center; gap: 4px; font-size: 15px; line-height: 24px; color: var(--v6-ink-2); font-variant-numeric: tabular-nums; }
#view .v7-trend svg.i { width: 14px; height: 14px; }
#view .v7-trend.up svg.i { color: #036e43; transform: rotate(-45deg); }
#view .v7-trend.at { color: var(--v6-amber); }
/* Credit Card's bar and legend (bar 8 tall on the 16% fill, the blue its share; legend 12/20 with dots, a count at the right) */
#view .v7-cc .v7-fig { margin-top: 0; }
#view .v7-ccbar { height: 8px; margin-top: 16px; border-radius: 4px; background: var(--v6-fill-2); overflow: hidden; }
#view .v7-ccbar i { display: block; height: 100%; border-radius: 4px; background: var(--v6-blue); }
#view .v7-cclegend { display: flex; align-items: center; gap: 12px; margin-top: 8px; padding-bottom: 15px; border-bottom: 1px solid var(--v6-line); font-size: 12px; line-height: 20px; letter-spacing: .2px; color: var(--v6-ink-3); }
#view .v7-cclegend i { display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin-left: 6px; }
#view .v7-cclegend span { display: inline-flex; align-items: center; }
#view .v7-cclegend i.a { background: var(--v6-blue); } #view .v7-cclegend i.o { background: rgba(82, 102, 235, .35); }
#view .v7-cclegend .v7-sp { flex: 1; }
#view .v7-cc .v7-bottom { align-items: center; }
/* Invoicing's two columns */
#view .v7-inv .v7-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
/* the section's period beside its heading (Mercury: "Money movement  ‹ Oct 2026 ›") */
#view .v7-period { font-size: 15px; line-height: 24px; color: var(--v6-ink-2); margin-left: 8px; }
/* the memos table: counts right-aligned and tabular, as Mercury's amounts */
#view .v72 .v6-table th.r, #view .v72 .v6-table td.r { text-align: right; }
#view .v72 .v6-table .v7-num { font-variant-numeric: tabular-nums; color: var(--v6-ink); }
#view .v72 .v6-table .v7-av { margin-right: 0; }
/* the sidebar's bookmarks (Mercury: "Bookmarks", each item with its figure under the name) */
.shell > .nav .v7-bm { margin: 10px -8px 0; padding: 12px 8px 0; border-top: 1px solid var(--v6-line); }
.shell > .nav .v7-bm-h { margin: 0 0 8px; padding: 0 8px; font-size: 12px; line-height: 20px; font-weight: 480; letter-spacing: .2px; color: var(--v6-ink-4); }
.shell > .nav .v7-bm-i { display: flex; align-items: flex-start; gap: 12px; padding: 4px 8px; margin: 0 0 6px; border-radius: 8px; color: var(--v6-ink-3); text-decoration: none; }
.shell > .nav .v7-bm-i:hover { background: var(--v6-fill); }
.shell > .nav .v7-bm-i svg.i { width: 16px; height: 16px; margin-top: 4px; flex: none; color: var(--v6-ink-3); fill: none; stroke: currentColor; stroke-width: 1.6; }
.shell > .nav .v7-bm-i span { display: flex; flex-direction: column; min-width: 0; }
.shell > .nav .v7-bm-i b { font-size: 15px; line-height: 24px; font-weight: 400; color: var(--v6-ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.shell > .nav .v7-bm-i small { font-size: 13px; line-height: 20px; color: var(--v6-ink-4); }
.shell.mini > .nav .v7-bm { display: none; }
@media (max-width: 699px) { .shell > .nav .v7-bm { display: none; } }

/* ---------- v7.2: the vertical rhythm inside each panel, set to Mercury's measured offsets (design file, panel top = 0) ----------
   balance  title line 24 → figure 36 at +49 → its line at +93 → the chart to the bottom
   list     header 32 (title centred) → the first row at +73 → rows 44 apart
   summary  header 32 → columns at +81 (label 20, value 24, 15 under, a rule) → bottom row pinned at +164; the panel is 232 tall
   card     title line 24 → figure 28 at +48 → bar at +89 → legend at +105 → a rule at +141 → bottom row at +164 */
#view .v7-bal .v6-ph { height: 24px !important; min-height: 24px !important; margin-bottom: 0 !important; overflow: visible; }
#view .v7-bal .v7-fig { margin-top: 1px !important; }
#view .v7-bal .v7-sub, #view .v7-bal .v7-subrow { margin-top: 8px !important; }
#view .v7-bal .v7-subrow .v7-sub { margin-top: 0 !important; }
#view .v6-grid > .v7-p:not(.v7-bal) .v6-ph { margin-bottom: 0 !important; }
#view .v6-grid > .v7-p .v7-ilist:first-of-type { margin-top: 17px; }
#view .v7-sum { min-height: 232px; }
#view .v7-sum .v7-cols { margin-top: 25px; padding-top: 0; }
#view .v7-cc .v6-ph { height: 24px !important; min-height: 24px !important; overflow: visible; }
#view .v7-cc .v7-fig { margin-top: 0 !important; }
#view .v7-cc .v7-ccbar { margin-top: 12px; }
#view .v7-sum .v7-bottom { padding-top: 0; margin-top: auto; min-height: 44px; }
#view .v7-mov .v7-bottom span { font-size: 15px; line-height: 24px; letter-spacing: 0; }
#view .v7-mov .v6-ph { height: 24px !important; min-height: 24px !important; }
#view .v7-mov .v7-fig { margin-top: 2px !important; }
/* the round buttons in the secondary ink */
#view .v7-ib { color: var(--v6-ink-2) !important; }
/* values and figures stay in ink as Mercury's amounts do; only what is critical (a recall, a missing record) turns red. A row's
   status is carried by its circle */
#view .v7-iv[data-tone="attention"], #view .v7-cols b[data-tone="attention"], #view .v7-bottom b[data-tone="attention"] { color: var(--v6-ink) !important; }
#view .v6-fig[data-tone="attention"] { color: var(--v6-ink) !important; }
#view .v7-trend.at { color: var(--v6-ink-2); }
/* the table: 51 tall rows, the date 14/20, the name in the secondary ink */
#view .v7-sec .v6-table td { padding: 13px 8px !important; }
#view .v7-sec .v6-table .v6-td-d { font-size: 14px !important; line-height: 20px !important; }
#view .v7-sec .v6-table .v6-ev { color: var(--v6-ink-2) !important; }
#view .v71 .v7-bal { min-height: 350px; }
#view .v71 .v6-quick { margin-top: 26px !important; }
#view .v6-grid > .v7-p .v6-ph + .v7-ilist { margin-top: 17px; }
#view .v7-ccbar-seg { display: flex; }
#view .v7-ccbar-seg i { border-radius: 0; }
#view .v7-ccbar-seg i.r { background: rgba(82, 102, 235, .55); }
#view .v7-ccbar-seg i.h { background: #f04438; }
#view .v7-cclegend i.h { background: #f04438; }
#view .v7-p .v6-ph > :is(.v7-ib) + .v7-ib { margin-left: 4px; }
#view .v7-cclegend { align-items: flex-start !important; line-height: 20px; }
#view .v7-cclegend > span { height: 20px; line-height: 20px; }
#view .v7-list > .v7-rule { margin-top: 16px !important; }
@media (max-width: 699px) {
  #view .v7-sec .v6-table :is(th.r, td.r) { display: none; }   /* a phone keeps the date, the name and the state */
  #view .v7-sec { overflow-x: auto; }
  #view .v7-cclegend { flex-wrap: wrap; }
}

/* =====================================================================================================================
   v7.3 (2026-10-26): MONEY, AS MERCURY SETS IT: dollars in the figure's size, the cents at 73% and raised to the top of the digits
   (its balance: "$5,216,471" then ".18"); a share in green where Mercury shows money in. The partner's Earnings.
   ===================================================================================================================== */
#view .v7-money { font-variant-numeric: tabular-nums; white-space: nowrap; }
#view .v7-cents { font-size: .73em; vertical-align: text-top; letter-spacing: 0; }
#view .v7-fig-money { letter-spacing: -.03em; }
#view .v7-pct { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; margin-right: 8px; border: 1px solid var(--v6-line-2); border-radius: 4px; font-size: 12px; line-height: 20px; color: var(--v6-ink-2); letter-spacing: .2px; }
#view .pos, #view .v7-band b.pos, #view td.pos { color: #036e43 !important; }
:root[data-theme="dark"] #view .pos, :root[data-theme="dark"] #view .v7-band b.pos, :root[data-theme="dark"] #view td.pos { color: #4cc472 !important; }
/* the figures band (Transactions: "Net change this month", "Money in", "Money out"): a hairline above and below, label over value */
#view .v7-band { display: flex; flex-wrap: wrap; gap: 8px 48px; margin: 24px 0 40px; padding: 12px 0; border-top: 1px solid var(--v6-line); border-bottom: 1px solid var(--v6-line); }
#view .v7-band > div { display: flex; flex-direction: column; min-width: 0; }
#view .v7-band > div > span { font-size: 14px; line-height: 20px; color: var(--v6-ink-3); }
#view .v7-band b .v7-money { font-size: inherit; color: inherit; }
#view .v7-band b { font-size: 19px; line-height: 28px; font-weight: 400; letter-spacing: -.03em; color: var(--v6-ink); }
#view .v7-earnchart { margin: 0 0 8px; }
#view .v7-earnchart .v6-chart { height: 180px !important; }
#view .v7-avs { display: inline-flex; align-items: center; gap: 0; }
#view .v7-avs .v7-av { margin-right: -6px; box-shadow: 0 0 0 2px var(--v6-page); }
#view .v7-avs > span:last-child { margin-left: 18px; }
#view .v7-spark { display: inline-flex; align-items: flex-end; gap: 2px; height: 20px; }
#view .v7-spark i { display: block; width: 3px; border-radius: 1px; background: rgba(82, 102, 235, .45); }
@media (max-width: 699px) { #view .v7-band { gap: 8px 24px; } }

/* ---------- v7.3: the consultant's lists and its memo record (Mercury's list and account templates) ---------- */
#view .v7-firm { display: inline-flex; flex-direction: column; min-width: 0; }
#view .v7-firm b { font-size: 15px; line-height: 24px; font-weight: 400; color: var(--v6-ink-2); }
#view .v7-firm small { font-size: 13px; line-height: 20px; color: var(--v6-ink-4); }
#view a.v7-rowlink { color: inherit; text-decoration: none; }
#view a.v7-rowlink:hover b { color: var(--v6-link); }
#view .v7-fp { font-family: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; color: var(--v6-ink-3); letter-spacing: 0; }
#view .v7-advlist .v6-table td { padding: 13px 8px !important; }
#view .v7-advlist .v6-table :is(th, td):first-child { padding-left: 8px !important; }
#view .v7-advlist .v7-band { margin-top: 24px; }
/* the memo as a record: two raised panels, 574 and 370, 24 apart */
#view .v7m-grid { display: grid; grid-template-columns: minmax(0, 574fr) minmax(0, 370fr); gap: 24px; margin: 24px 0 40px; }
#view .v7m-panel { display: flex; flex-direction: column; min-height: 268px; border-radius: 12px; background: var(--v6-surface); box-shadow: var(--v7-raised); overflow: hidden; }
#view .v7m-main .v7m-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 24px 24px 0; }
#view .v7m-lab, #view .v7m-props span, #view .v7m-row span { font-size: 13px; line-height: 20px; letter-spacing: .1px; color: var(--v6-ink-4); }
#view .v7m-fig { font-size: 34px; line-height: 44px; font-weight: 380; letter-spacing: -1.02px; color: var(--v6-ink); margin-top: 6px; }
#view .v7m-fig small { font-size: 15px; line-height: 24px; letter-spacing: 0; color: var(--v6-ink-3); margin-left: 8px; font-weight: 400; }
#view .v7m-acts { display: flex; gap: 8px; }
#view .v7m-props { display: flex; flex-wrap: wrap; gap: 8px 40px; padding: 22px 24px 24px; }
#view .v7m-props > div { display: flex; flex-direction: column; }
#view .v7m-props b { font-size: 14px; line-height: 20px; font-weight: 400; color: var(--v6-ink-2); margin-top: 4px; }
#view .v7m-foot { margin-top: auto; display: flex; align-items: center; min-height: 56px; padding: 0 24px; border-top: 1px solid var(--v6-line); }
#view .v7m-foot a { display: inline-flex; align-items: center; gap: 4px; font-size: 15px; line-height: 24px; color: var(--v6-link); text-decoration: none; }
#view .v7m-foot a svg.i { width: 14px; height: 14px; }
#view .v7m-limits { font-size: 13px; line-height: 20px; color: var(--v6-ink-4); }
#view .v7m-side { padding-top: 16px; }
#view .v7m-row { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; min-height: 40px; padding: 8px 24px; }
#view .v7m-row b { font-size: 15px; line-height: 24px; font-weight: 400; color: var(--v6-ink-2); text-align: right; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#view .v7m-said .v7m-row { padding: 12px 0; border-top: 1px solid var(--v6-line); align-items: flex-start; }
#view .v7m-said .v7m-row:first-child { border-top: 0; }
#view .v7m-said .v7m-row span { flex: 0 0 200px; font-size: 15px; line-height: 24px; color: var(--v6-ink); letter-spacing: 0; }
#view .v7m-said .v7m-row b { white-space: normal; text-align: left; flex: 1; }
@media (max-width: 899px) { #view .v7m-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 699px) { #view .v7m-said .v7m-row { flex-direction: column; gap: 4px; } #view .v7m-said .v7m-row span { flex: none; } }

/* v7.4 (2026-10-26): the consultant's deadline tables on a phone keep the date, the client's circle, what is due and its state */
@media (max-width: 699px) {
  #view .v7-sec .v6-table.v7-tbl :is(th, td), #view .v6-table.v7-tbl :is(th, td) { display: table-cell; }   /* beats the generic phone hides (next-v6 3rd column, v7 th.r/td.r); each table names its own */
  #view .v6-table.v7-tbl th.v7-ph-hide, #view .v6-table.v7-tbl td.v7-ph-hide, #view .v7-ph-hide { display: none !important; }
}