/* Veritura workspace, v5 (2026-10-25): THE FRAME, loaded last. The approved app frame (sales-r97/legitscript/build/prototype/
   app-frame-v5.html) on the workspace's own tokens: a short nav in spaced bands with Settings at the foot, the sub-pages as one row
   of tabs under every page's title, a hover menu on each nav item, the one-time note on an old address, Vera's panel widening. */

/* ---------- the nav: bands, not groups; the lit item is a quiet fill, never a dark pill ---------- */
#nav .navgroup.v5-band + .navgroup.v5-band { margin-top: 14px; }
#nav .navgroup.v5-foot { margin-top: 14px; padding-top: 10px; border-top: 1px solid var(--line-soft, var(--gray-200, #ececef)); }
.shell > .nav .navitems a[data-nav] { height: 32px; border-radius: 8px; gap: 10px; padding: 0 8px 0 10px; font-size: 14px; font-weight: 500; color: var(--ink-2, #3f4148); box-shadow: none; }
.shell > .nav .navitems a[data-nav] svg.i { width: 17px; height: 17px; opacity: 1; color: var(--gray-500, #8a8d95); }
.shell > .nav .navitems a[data-nav]:hover { background: var(--gray-100, #f0f0f2); color: var(--ink, #1c1d1f); }
.shell > .nav .navitems a[data-nav][aria-current] { background: var(--gray-150, #ebebee); color: var(--ink, #1c1d1f); font-weight: 600; box-shadow: none; }
.shell > .nav .navitems a[data-nav][aria-current] svg.i { color: var(--ink-2, #3f4148); }
.shell > .nav .navitems a[data-nav] .count { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; font-size: 12px; font-weight: 500; background: transparent; color: var(--gray-500, #6f727a); }
.shell > .nav .navitems a[data-nav] .count.hot { background: var(--critical-bg, #fef3f2); color: var(--critical-fg, #b42318); }
.shell > .nav .navitems a[data-nav][aria-current] .count { background: transparent; color: var(--ink-2, #3f4148); }
.shell > .nav .navitems a[data-nav][aria-current] .count.hot { background: var(--critical-bg, #fef3f2); color: var(--critical-fg, #b42318); }
:root[data-theme="dark"] .shell > .nav .navitems a[data-nav][aria-current] { background: rgba(255, 255, 255, .09); color: var(--ink); }
:root[data-theme="dark"] .shell > .nav .navitems a[data-nav]:hover { background: rgba(255, 255, 255, .06); }

/* ---------- the header tabs: one row under the title, at the same height on every page ---------- */
.v5-tabs { position: sticky; top: 0; z-index: 6; display: flex; align-items: center; gap: 2px; margin: 18px 0 22px; padding: 0; border-bottom: 1px solid var(--line-soft, var(--gray-200, #ececef)); background: var(--surface, var(--gray-0, #fff)); overflow-x: auto; scrollbar-width: none; }
.v5-tabs::-webkit-scrollbar { display: none; }
.v5-tabs > a[role="tab"] { position: relative; display: inline-flex; align-items: center; gap: 6px; flex: none; height: 38px; padding: 0 10px; color: var(--gray-500, #6f727a); font-size: 14px; font-weight: 500; letter-spacing: -.01em; text-decoration: none; white-space: nowrap; border-radius: 6px 6px 0 0; transition: color .12s; }
.v5-tabs > a[role="tab"]:hover { color: var(--ink, #1c1d1f); }
.v5-tabs > a[role="tab"][aria-selected="true"] { color: var(--ink, #1c1d1f); }
.v5-tabs > a[role="tab"][aria-selected="true"]::after { content: ""; position: absolute; left: 8px; right: 8px; bottom: -1px; height: 2px; border-radius: 2px; background: var(--ink, #1c1d1f); }
.v5-tabs > a[role="tab"]:focus-visible { outline: 2px solid var(--accent, #2457f5); outline-offset: -2px; }
.v5-n { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; font-size: 12px; font-weight: 500; font-variant-numeric: tabular-nums; line-height: 1; }
.v5-n[data-tone="hot"] { background: var(--critical-bg, #fef3f2); color: var(--critical-fg, #b42318); }
.v5-n[data-tone="warm"] { background: var(--attention-bg, #fff6e8); color: var(--attention-fg, #b54708); }
.v5-tabs-r { margin-left: auto; display: flex; align-items: center; gap: 8px; padding-left: 12px; }
.v5-tabs-r:empty { display: none; }
.v5-tabs-r .field { margin: 0; }
.v5-folded { display: none !important; }
/* a page's other tab rows are view switches under the one row: a quiet segmented control */
.page [role="tablist"].v5-seg { display: inline-flex; gap: 2px; width: auto; margin: 0 0 14px; padding: 2px; border: 0; border-radius: 8px; background: var(--gray-100, #f2f2f4); box-shadow: none; }
.page [role="tablist"].v5-seg > [role="tab"] { height: 28px; padding: 0 10px; border: 0; border-radius: 6px; background: none; color: var(--gray-600, #5a5d65); font-size: 13px; font-weight: 500; box-shadow: none; }
.page [role="tablist"].v5-seg > [role="tab"]::after { display: none; }
.page [role="tablist"].v5-seg > [role="tab"][aria-selected="true"] { background: var(--gray-0, #fff); color: var(--ink, #1c1d1f); box-shadow: 0 0 0 1px var(--line-soft, rgba(0, 0, 0, .06)), 0 1px 2px rgba(16, 24, 40, .06); }
:root[data-theme="dark"] .page [role="tablist"].v5-seg { background: rgba(255, 255, 255, .06); }
:root[data-theme="dark"] .page [role="tablist"].v5-seg > [role="tab"][aria-selected="true"] { background: rgba(255, 255, 255, .12); }

/* ---------- the one-time note on an old address ---------- */
.v5-moved { display: flex; align-items: center; gap: 10px; margin: -10px 0 20px; padding: 8px 8px 8px 12px; border-radius: 8px; background: var(--gray-25, #fafafb); box-shadow: inset 0 0 0 1px var(--line-soft, #ececef); color: var(--gray-600, #5a5d65); font-size: 13px; line-height: 20px; }
.v5-moved > svg.i { width: 16px; height: 16px; flex: none; color: var(--gray-500, #8a8d95); }
.v5-moved b { color: var(--ink, #1c1d1f); font-weight: 600; }
.v5-moved-x { margin-left: auto; display: grid; place-items: center; flex: none; width: 32px; height: 32px; border: 0; border-radius: 6px; background: none; color: var(--gray-500, #8a8d95); cursor: pointer; }
.v5-moved-x:hover { background: var(--gray-100, #f0f0f2); color: var(--ink, #1c1d1f); }
.v5-moved-x svg.i { width: 14px; height: 14px; }

/* ---------- the crumb names the tab ---------- */
#crumb .v5-cr { margin: 0 6px; color: var(--gray-400, #a0a3ab); font-weight: 400; }
#crumb .v5-crt { color: var(--gray-600, #5a5d65); font-weight: 500; }

/* ---------- the hover menu on a nav item ---------- */
.v5-fly { position: fixed; z-index: 60; width: 236px; padding: 6px; border-radius: 10px; background: var(--surface, #fff); box-shadow: 0 0 0 1px rgba(0, 0, 0, .08), 0 12px 32px -12px rgba(0, 0, 0, .25); }
.v5-fly[hidden] { display: none; }
.v5-fly-h { padding: 6px 8px 4px; color: var(--gray-500, #8a8d95); font-size: 12px; font-weight: 500; }
.v5-fly a { display: flex; align-items: center; gap: 8px; height: 32px; padding: 0 8px; border-radius: 6px; color: var(--ink-2, #3f4148); font-size: 13px; font-weight: 500; text-decoration: none; }
.v5-fly a:hover, .v5-fly a:focus-visible { background: var(--gray-100, #f2f2f4); color: var(--ink, #1c1d1f); outline: none; }
.v5-fly a[aria-current] { color: var(--ink, #1c1d1f); font-weight: 600; }
.v5-fly a .v5-n { margin-left: auto; }
:root[data-theme="dark"] .v5-fly { background: var(--gray-50, #1c1d21); box-shadow: 0 0 0 1px rgba(255, 255, 255, .1), 0 12px 32px -12px rgba(0, 0, 0, .6); }

/* ---------- a page that lives in Settings ---------- */
.v5-back { display: inline-flex; align-items: center; gap: 4px; margin: 0 0 6px; color: var(--gray-500, #6f727a); font-size: 13px; font-weight: 500; text-decoration: none; flex-basis: 100%; }
.v5-back:hover { color: var(--ink, #1c1d1f); }
.v5-back svg.i { width: 14px; height: 14px; }
.setnav a.v5-setlink { text-decoration: none; }

/* ---------- Vera's panel: wider on demand ---------- */
.v5-vx { display: flex; gap: 2px; margin-left: auto; }
.v5-vbtn { display: grid; place-items: center; width: 28px; height: 28px; border: 0; border-radius: 6px; background: none; color: var(--gray-500, #6f727a); cursor: pointer; }
.v5-vbtn:hover { background: var(--gray-100, #f2f2f4); color: var(--ink, #1c1d1f); }
.v5-vbtn svg.i { width: 15px; height: 15px; }

/* =====================================================================================================================
   STEP 0: THE TELLS, GONE (app-ux/PLAN.md section 5; agent D's census). One status language, no edge bars, no tinted tiles,
   no boxes in boxes, hairlines instead of shadows, one quiet strip of numbers.
   ===================================================================================================================== */

/* ---------- status: an icon and a word, colour only reinforcing (the v4 traffic light) ----------
   green: a solid check (current); amber: a ring with a clock (to check); red: a solid mark (to fix); grey: a ring (neutral) */
:root {
  --v5-ic-ok: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='7' fill='%2317B26A'/%3E%3Cpath d='M5 8.2l2 1.9 4-4.2' fill='none' stroke='white' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --v5-ic-due: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='6.25' fill='none' stroke='%23F79009' stroke-width='1.5'/%3E%3Cpath d='M8 4.9V8l2 1.3' fill='none' stroke='%23F79009' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --v5-ic-fix: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='7' fill='%23F04438'/%3E%3Cpath d='M8 4.6v4' stroke='white' stroke-width='1.6' stroke-linecap='round'/%3E%3Ccircle cx='8' cy='11.1' r='.95' fill='white'/%3E%3C/svg%3E");
  --v5-ic-nil: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='6.25' fill='none' stroke='%23A0A3AB' stroke-width='1.5'/%3E%3C/svg%3E");
}
#view :is(.chip, .vk-chip, .v96-l, .tag, .v73pill, .v75chip):not(.mono):not(.o):not(button):not(a):not([role=button]) {
  display: inline-flex; align-items: center; gap: 6px; height: auto; min-height: 20px; padding: 0 !important; border: 0 !important; border-radius: 0 !important;
  background: none !important; box-shadow: none !important; font-size: 13px; font-weight: 500; line-height: 20px; white-space: nowrap; color: var(--neutral-fg, #4b535c);
}
#view :is(.chip, .vk-chip, .v96-l, .tag, .v73pill, .v75chip):not(.mono):not(.o):not(button):not(a):not([role=button])::after { display: none; }
#view :is(.chip, .vk-chip, .v96-l, .tag, .v73pill, .v75chip):not(.mono):not(.o):not(button):not(a):not([role=button])::before {
  content: ""; display: block; flex: none; width: 14px; height: 14px; margin: 0; border: 0; border-radius: 0; background: var(--v5-ic-nil) center / 14px 14px no-repeat; box-shadow: none; position: static; transform: none;
}
#view :is(.chip, .vk-chip, .v96-l, .tag, .v73pill, .v75chip):not(.mono):not(.o):not(button):not(a):not([role=button]) > svg { display: none; }
#view :is(.chip, .vk-chip, .v96-l, .tag, .v73pill, .v75chip):not(.mono):not(.o):not(button):not(a):not([role=button]):is([data-tone="positive"], [data-tone="ok"], .g, .ok, .green, .good) { color: var(--positive-fg, #15803d); }
#view :is(.chip, .vk-chip, .v96-l, .tag, .v73pill, .v75chip):not(.mono):not(.o):not(button):not(a):not([role=button]):is([data-tone="positive"], [data-tone="ok"], .g, .ok, .green, .good)::before { background-image: var(--v5-ic-ok); }
#view :is(.chip, .vk-chip, .v96-l, .tag, .v73pill, .v75chip):not(.mono):not(.o):not(button):not(a):not([role=button]):is([data-tone="attention"], [data-tone="warn"], .a, .warn, .amber) { color: var(--attention-fg, #b54708); }
#view :is(.chip, .vk-chip, .v96-l, .tag, .v73pill, .v75chip):not(.mono):not(.o):not(button):not(a):not([role=button]):is([data-tone="attention"], [data-tone="warn"], .a, .warn, .amber)::before { background-image: var(--v5-ic-due); }
#view :is(.chip, .vk-chip, .v96-l, .tag, .v73pill, .v75chip):not(.mono):not(.o):not(button):not(a):not([role=button]):is([data-tone="critical"], [data-tone="bad"], .r, .bad, .red) { color: var(--critical-fg, #b42318); }
#view :is(.chip, .vk-chip, .v96-l, .tag, .v73pill, .v75chip):not(.mono):not(.o):not(button):not(a):not([role=button]):is([data-tone="critical"], [data-tone="bad"], .r, .bad, .red)::before { background-image: var(--v5-ic-fix); }
/* an outlined tag (a scope, a code) stays a quiet label, never a status */
#view .tag:is(.o, .mono) { background: var(--gray-50, #f3f4f6) !important; border: 0 !important; box-shadow: none !important; color: var(--gray-700, #343a3f); border-radius: 6px !important; }
#view .tag:is(.o, .mono)::before { display: none; }

/* ---------- no coloured edge bars: a row's status sits in the row ---------- */
#view :is(.r96m-r, .v95-move, .r96m-yday, .qe-hot, .r96n, .r96mdc, .v80r.v81ok, .card.stale, .card.incident.open, .v79agt tbody tr.on, .v88nm li, .vx-law, .nextbar, .notice, .cluster blockquote, .r92i-quote, .r92f-quote, .r92j-q, .r92e-why, .qe-ans, .r92j-rq.is-on, .r92j-ob.is-on, .v95-stages li.v95-wait, .v81need .prep) { border-left-width: 0 !important; }
#view :is(.r96m-r, .v95-move, .r96m-yday, .qe-hot, .r96n, .r96mdc, .card.stale, .card.incident.open, .v79agt tbody tr.on, .r92j-rq.is-on, .r92j-ob.is-on, .v95-stages li.v95-wait) { box-shadow: none !important; }
#view .v81need .prep { box-shadow: inset 0 0 0 1px var(--line-2, var(--gray-200)) !important; }
#view .v80r.v81ok, #view .v80t tr.v81ok td:first-child, #view td.v93-passcell, #view td.two, #view .umatrix .um-g { box-shadow: none !important; }
#view table tbody tr:is([aria-selected="true"], .sel, .on) td:first-child, .tr-rail tr[aria-selected="true"] td:first-child, tbody tr[aria-selected="true"] td:first-child { box-shadow: none !important; }
#view table tbody tr:is([aria-selected="true"], .sel, .on) td { background: var(--gray-50, #f3f4f6); }
#view .vk-lit:is([data-tone="critical"], [data-tone="attention"], [data-tone="positive"]) { box-shadow: var(--k-lit-shadow, none) !important; }
#view .v97pk-m a[aria-current="true"] { box-shadow: none !important; }
/* a cited line in a document keeps its tint; the bar beside it goes */
#view :is(.v93sheet li, .vp-doc.v93vdoc li, .origtext li, .rt-paper li, .rs-doc .orig .ln):is(.mk-r, .mk-a, .mk-g, .mk-b, .k-f, .k-a, .k-g, .k-b, .mk, .hl, .v80u) { box-shadow: none !important; }
.v73pane .vp-doc.v93vdoc li:is(.k-f, .k-a, .k-g, .k-b), .v89l-certcard .v93sheet li:is(.mk-r, .mk-a, .mk-g, .mk-b) { box-shadow: none !important; }
.cmdk li[aria-selected="true"] { box-shadow: none !important; }
/* a notice is a quiet band, not a coloured stripe */
#view .notice { border-radius: 8px; box-shadow: inset 0 0 0 1px var(--line-soft, var(--gray-200)); }

/* ---------- no tinted icon tiles: an icon is an icon ---------- */
#view :is(.v96-tile, .vk-tile, .v96-ph-i, .v96-st-d, .v95-pn, .ktile, .tile) { background: none !important; box-shadow: none !important; border: 0 !important; color: var(--gray-500, #6f727a) !important; }
#view :is(.v96-tile, .vk-tile, .v96-ph-i, .ktile, .tile) svg { color: var(--gray-500, #6f727a) !important; stroke: currentColor; }

/* ---------- the strip of numbers: one quiet row, divided by hairlines, never four boxes ---------- */
#view .v89-strip { gap: 0 !important; border: 1px solid var(--line-soft, var(--gray-200, #e1e4e8)); border-radius: 10px; background: var(--gray-0, #fff); overflow: hidden; box-shadow: none; }
#view .v89-strip > .v89-cell { border: 0 !important; border-radius: 0 !important; box-shadow: none !important; background: none !important; }
#view .v89-strip > .v89-cell + .v89-cell { border-left: 1px solid var(--line-soft, var(--gray-200, #e1e4e8)) !important; }
#view .v89-strip > a.v89-cell:hover, #view .v89-strip > button.v89-cell:hover { background: var(--gray-25, #f8f9fa) !important; }

/* ---------- no boxes in boxes: a box inside a panel is a row of it ---------- */
#view :is(.card, .vk-lit, section.v96-card) :is(.v96-stat, .um-g, .v95-way, .v89-cell, .v96-cred, .v95p-fact, .r96d-link) { border-color: transparent !important; box-shadow: none !important; background: none !important; }
#view .card .card { border: 0 !important; box-shadow: none !important; border-radius: 0 !important; background: none !important; }
#view a.bcard { box-shadow: none !important; }
#view a.bcard:hover { box-shadow: 0 0 0 1px var(--gray-300, #cbd0d6) !important; }

/* ---------- hairlines, not shadows, on panels in the page ---------- */
#view :is(.card, .vk-lit, .v96-card, .v95-move, .section) { box-shadow: none; }

/* ---------- the top bar: the demo's own button is quiet, and only where it makes sense ---------- */
#demoReadOwn { background: var(--gray-0, #fff) !important; color: var(--ink-2, #3f4148) !important; box-shadow: inset 0 0 0 1px var(--line, var(--gray-300, #cbd0d6)) !important; border: 0 !important; font-weight: 500 !important; }
#demoReadOwn:hover { background: var(--gray-25, #f8f9fa) !important; }
#demoReadOwn svg { color: var(--gray-500, #6f727a) !important; }
body:is([data-v5door="telehealth"], [data-v5door="clinic"], [data-v5door="partner"], [data-v5door="brand"]) #demoReadOwn { display: none !important; }
/* Vera is the top bar's panel; her card and the second "Ask a person" leave the nav's foot */
.shell > .nav .v73vera, .shell > .nav #r95askNav { display: none !important; }

/* the board's age mark ("8 d") is a quiet number, not a status */
#view .bage { background: none !important; box-shadow: none !important; padding: 0 !important; color: var(--gray-500, #6f727a); font-weight: 500; }
#view .bage svg { display: none; }

/* =====================================================================================================================
   STEP 2: THE PAGE KIT (next-v5-kit.js V.v5.ui). The approved Partner Record v4 parts as workspace components: one header,
   one strip, section headings, one box of rows, the traffic light, empty states, one quiet line.
   ===================================================================================================================== */
.v5-head { display: flex; align-items: flex-start; gap: 16px; }
.v5-head .v5-head-t { min-width: 0; flex: 1; }
.v5-head h1 { margin: 0; }
.v5-head .v89-head-a { display: flex; gap: 8px; flex: none; padding-top: 2px; }
.v5-sec { display: flex; align-items: baseline; gap: 8px; margin: 32px 0 10px; }
.v5-sec:first-child { margin-top: 0; }
.v5-sec h2 { margin: 0; font-size: 14px; line-height: 22px; font-weight: 600; letter-spacing: -.01em; color: var(--ink, #1c1d1f); }
.v5-sec .v5-c { color: var(--gray-500, #6f727a); font-size: 13px; font-variant-numeric: tabular-nums; }
.v5-sec .v5-sp { flex: 1; }
.v5-sec a.link, .v5-sec .link { font-size: 13px; }
.v5-box { border: 1px solid var(--line-soft, var(--gray-200, #e1e4e8)); border-radius: 10px; background: var(--gray-0, #fff); overflow: hidden; }
.v5-row { display: grid; grid-template-columns: 16px minmax(0, 1fr) auto; gap: 12px; align-items: center; min-height: 52px; padding: 10px 16px; border-top: 1px solid var(--line-soft, var(--gray-200, #e1e4e8)); color: inherit; text-decoration: none; }
.v5-row:first-child { border-top: 0; }
a.v5-row:hover, .v5-row:hover { background: var(--gray-25, #f8f9fa); }
.v5-row.v5-nolead { grid-template-columns: minmax(0, 1fr) auto; }
.v5-row.v5-dated { grid-template-columns: 84px minmax(0, 1fr) auto; }
.v5-rb { min-width: 0; }
.v5-rb b { display: block; font-size: 14px; line-height: 20px; font-weight: 500; color: var(--ink, #1c1d1f); }
.v5-rb small { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: 1px; font-size: 13px; line-height: 19px; color: var(--gray-500, #6f727a); }
.v5-rr { display: flex; align-items: center; gap: 8px; justify-content: flex-end; }
.v5-meta { font-size: 13px; color: var(--gray-500, #6f727a); font-variant-numeric: tabular-nums; white-space: nowrap; }
.v5-date { font-size: 13px; line-height: 20px; color: var(--gray-600, #5a5d65); font-variant-numeric: tabular-nums; white-space: nowrap; }
.v5-date.late { color: var(--critical-fg, #b42318); font-weight: 500; }
.v5-si { display: block; width: 16px; height: 16px; flex: none; background: var(--v5-ic-nil) center / 16px 16px no-repeat; }
.v5-si[data-tone="positive"] { background-image: var(--v5-ic-ok); }
.v5-si[data-tone="attention"] { background-image: var(--v5-ic-due); }
.v5-si[data-tone="critical"] { background-image: var(--v5-ic-fix); }
.v5-st { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; line-height: 20px; font-weight: 500; white-space: nowrap; color: var(--neutral-fg, #4b535c); }
.v5-st .v5-si { width: 14px; height: 14px; background-size: 14px 14px; }
.v5-st[data-tone="positive"] { color: var(--positive-fg, #15803d); }
.v5-st[data-tone="attention"] { color: var(--attention-fg, #b54708); }
.v5-st[data-tone="critical"] { color: var(--critical-fg, #b42318); }
.v5-more { display: block; width: 100%; text-align: center !important; justify-content: center; height: 40px; border: 0; border-top: 1px solid var(--line-soft, var(--gray-200, #e1e4e8)); background: none; color: var(--gray-600, #5a5d65); font: inherit; font-size: 13px; font-weight: 500; cursor: pointer; }
.v5-more:hover { background: var(--gray-25, #f8f9fa); color: var(--ink, #1c1d1f); }
.v5-strip { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); margin: 4px 0 0; border: 1px solid var(--line-soft, var(--gray-200, #e1e4e8)); border-radius: 10px; background: var(--gray-0, #fff); overflow: hidden; }
.v5-cell { display: flex; flex-direction: column; gap: 2px; padding: 12px 16px; color: inherit; text-decoration: none; border-left: 1px solid var(--line-soft, var(--gray-200, #e1e4e8)); }
.v5-cell:first-child { border-left: 0; }
.v5-cell:hover { background: var(--gray-25, #f8f9fa); }
.v5-cl { font-size: 13px; line-height: 18px; color: var(--gray-500, #6f727a); }
.v5-cv { font-size: 20px; line-height: 28px; font-weight: 600; letter-spacing: -.02em; color: var(--ink, #1c1d1f); font-variant-numeric: tabular-nums; }
.v5-cv[data-tone="critical"] { color: var(--critical-fg, #b42318); }
.v5-cv[data-tone="attention"] { color: var(--attention-fg, #b54708); }
.v5-cs { font-size: 12px; line-height: 16px; color: var(--gray-500, #6f727a); }
.v5-empty { padding: 28px 20px; text-align: center; }
.v5-empty b { display: block; font-size: 14px; font-weight: 600; color: var(--ink, #1c1d1f); }
.v5-empty p { margin: 4px auto 12px; max-width: 440px; font-size: 13px; line-height: 19px; color: var(--gray-500, #6f727a); }
.v5-empty p:last-child { margin-bottom: 0; }
.v5-line { margin: 10px 0 0; font-size: 13px; line-height: 19px; color: var(--gray-500, #6f727a); }
.v5-line .link, .v5-line button.link { font-size: 13px; }
/* the agents' one line: who did what overnight, and where to see it */
.v5-agents { display: flex; align-items: center; gap: 12px; margin-top: 32px; padding: 12px 16px; border: 1px solid var(--line-soft, var(--gray-200, #e1e4e8)); border-radius: 10px; font-size: 13px; line-height: 19px; color: var(--gray-600, #5a5d65); }
.v5-agents .v5-avs { display: flex; flex: none; }
.v5-agents .v5-av { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 7px; color: #fff; font-size: 12px; font-weight: 600; box-shadow: 0 0 0 2px var(--gray-0, #fff); }
.v5-agents .v5-av + .v5-av { margin-left: -6px; }
.v5-av.vera { background: #4f46e5; } .v5-av.cato { background: #2e3846; }
.v5-agents b { color: var(--ink, #1c1d1f); font-weight: 500; }
.v5-agents .v5-sp { flex: 1; }

/* ---------- Today (next-v5-today.js) ---------- */
.v5-today .v5-strip { margin-top: 22px; }
.v5-today .v5-blocks > .v5-sec:first-child { margin-top: 32px; }
.v5-row.v5-raw { display: block; padding: 0; }
.v5-row.v5-raw > .card, .v5-row.v5-raw > section { margin: 0 !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; background: none !important; }
.v5-row.v5-raw .card.stale { display: flex; gap: 12px; padding: 12px 16px; }
.v5-row.v5-raw .notice { margin: 0; border-radius: 0; box-shadow: none; background: none; padding: 12px 16px; }
.v5-prx .prx-today .card-h { padding: 12px 16px 0; border: 0; min-height: 0; }
.v5-prx .prx-today .card-h h2 { font-size: 14px; font-weight: 500; }
.v5-prx .prx-today .card-b { padding: 4px 16px 12px; }
.v5-prx .prx-today-a { margin-top: 8px; }
.v5-only { font-style: normal; font-size: 12px; color: var(--gray-500, #6f727a); }
.v5-seen { font-size: 13px; }
.v5-wait { color: var(--gray-600, #5a5d65); }
.v5-row .v5-rb small a { color: var(--accent, #2457f5); }
.v5-row .v5-rb small .mono, .v5-row .v5-rb small code { font-size: 12px; }
.v5-planline { display: flex; align-items: center; gap: 8px; margin: 0 0 16px; padding: 10px 14px; border: 1px solid var(--line-soft, var(--gray-200)); border-radius: 10px; color: var(--gray-600, #5a5d65); }
.v5-planline svg.i { width: 16px; height: 16px; color: var(--gray-500); }
.v5-planline .link { margin-left: auto; }

/* =====================================================================================================================
   STEP 4: THE PAGES (next-v5-pages.js)
   ===================================================================================================================== */
/* every strip of numbers is one quiet row: the kit's tiles and the quality events' tiles join the v89 strip's look */
#view .vk-kpis, #view .qe-tiles { gap: 0 !important; border: 1px solid var(--line-soft, var(--gray-200, #e1e4e8)); border-radius: 10px; background: var(--gray-0, #fff); overflow: hidden; box-shadow: none !important; }
#view .vk-kpis > *, #view .qe-tiles > * { border: 0 !important; border-radius: 0 !important; box-shadow: none !important; background: none !important; }
#view .vk-kpis > * + *, #view .qe-tiles > * + * { border-left: 1px solid var(--line-soft, var(--gray-200, #e1e4e8)) !important; }
#view .vk-kpis > [hidden], #view .v89-strip > [hidden] { display: none !important; }
/* no cover bands: a profile opens on its name */
#view :is(.v96p-cover, .pcover, .v95p-cv, .v94-cover, .v77pf-cover, .vp-cover, .prx-pcover) { display: none !important; }
#view .v95p-ph, #view .v96p-ph { padding-top: 20px; }
#view .v5-head-only { margin-bottom: 0; }

/* Cato, inside Inspection: his own strip, clearly his, on the Checklist */
.v5-cato { margin: 0 0 28px; }
.v5-cato-top { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 14px; align-items: start; padding: 16px 18px; border: 1px solid var(--line-soft, var(--gray-200, #e1e4e8)); border-radius: 10px; background: var(--gray-0, #fff); }
.v5-av.v5-av-lg { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 11px; color: #fff; font-size: 14px; font-weight: 600; }
.v5-cato-t p { margin: 0; font-size: 14px; line-height: 21px; color: var(--ink-2, #3f4148); }
.v5-cato-t p b { color: var(--ink, #1c1d1f); font-weight: 600; }
.v5-cato-t small { display: block; margin-top: 2px; font-size: 13px; line-height: 19px; color: var(--gray-500, #6f727a); }
.v5-cato-a { display: flex; gap: 8px; padding-top: 2px; }
.v5-meter { display: flex; gap: 2px; height: 6px; max-width: 520px; margin-top: 12px; }
.v5-meter i { display: block; min-width: 4px; border-radius: 3px; background: var(--gray-200, #e1e4e8); }
.v5-meter i[data-tone="positive"] { background: #17b26a; }
.v5-meter i[data-k="checked"] { background: #6ccf9e; }
.v5-meter i[data-tone="attention"] { background: #f79009; }
.v5-meter i[data-tone="critical"] { background: #f04438; }
.v5-meter i[data-tone="neutral"] { background: var(--gray-300, #cbd0d6); }
.v5-legend { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 8px; font-size: 12px; line-height: 18px; color: var(--gray-600, #5a5d65); }
.v5-legend span { display: inline-flex; align-items: center; gap: 6px; }
.v5-legend i { width: 8px; height: 8px; border-radius: 2px; background: var(--gray-300); }
.v5-legend [data-tone="positive"] i { background: #17b26a; }
.v5-legend [data-tone="attention"] i { background: #f79009; }
.v5-legend [data-tone="critical"] i { background: #f04438; }
.v5-legend .v5-na { color: var(--gray-500, #8a8d95); }
.v5-cato .v5-sec { margin-top: 20px; }
.v5-catomore { margin-top: 16px; display: grid; gap: 16px; }
/* the hand-over links as rows */
#view .r96d-links.v5-linkrows { border: 1px solid var(--line-soft, var(--gray-200)); border-radius: 10px; box-shadow: none; margin-bottom: 20px; }
#view .r96d-links.v5-linkrows .card-b { padding: 0; display: block !important; }
#view .r96d-links.v5-linkrows .card-b > * { display: flex !important; align-items: center; gap: 12px; margin: 0 !important; padding: 12px 16px !important; border: 0 !important; border-radius: 0 !important; background: none !important; box-shadow: none !important; }
#view .r96d-links.v5-linkrows .card-b > * + * { border-top: 1px solid var(--line-soft, var(--gray-200)) !important; }
/* a title stands alone: no coloured icon tile before it */
#view .v89-titlerow > :is(.vk-tile, .v96-tile, .ktile, .tile, .v89-ti) { display: none !important; }
#view .v89-head:has(.v5-back) { flex-wrap: wrap; }
#view .v89-head > .v5-back { order: -1; width: 100%; flex: 0 0 100%; }
/* Vera's panel: beside the page, wider on demand, or her full page */
#dialog.v5-vera .dialog.v87vera { width: min(600px, 100vw); transition: width .25s cubic-bezier(.2, .8, .2, 1); }
#dialog.v5-vera.v5-wide .dialog.v87vera { width: min(960px, calc(100vw - 48px)); }
#dialog.v5-vera .v87vera > header { position: relative; padding-right: 88px; }
#dialog.v5-vera .v87vera > header .v5-vx { position: absolute; top: 12px; right: 12px; margin: 0; }
@media (max-width: 699px) { #dialog.v5-vera .dialog.v87vera, #dialog.v5-vera.v5-wide .dialog.v87vera { width: 100vw; } #dialog.v5-vera [data-v5-vwide] { display: none; } }

/* =====================================================================================================================
   STEP 5: THE PHONE (390). Same order as the desk; rows stack their action under the words; nothing runs past the edge.
   ===================================================================================================================== */
#demoReadOwnStrip { background: var(--gray-0, #fff) !important; color: var(--ink-2, #3f4148) !important; box-shadow: inset 0 -1px 0 var(--line-soft, var(--gray-200)) !important; font-weight: 500 !important; }
#demoReadOwnStrip svg { color: var(--gray-500) !important; }
body:is([data-v5door="telehealth"], [data-v5door="clinic"], [data-v5door="partner"], [data-v5door="brand"]) #demoReadOwnStrip { display: none !important; }
@media (max-width: 699px) {
  .v5-row { grid-template-columns: 16px minmax(0, 1fr); align-items: start; }
  .v5-row > .v5-si { margin-top: 2px; }
  .v5-row .v5-rr { grid-column: 2; justify-content: flex-start; flex-wrap: wrap; margin-top: 8px; }
  .v5-row .v5-rr .btn { min-height: 44px; }
  .v5-row.v5-nolead .v5-rr { grid-column: 1; }
  .v5-row.v5-dated { grid-template-columns: 64px minmax(0, 1fr); }
  .v5-row.v5-dated .v5-rr { grid-column: 2; margin-top: 4px; }
  a.v5-row { min-height: 44px; }
  .v5-strip { grid-template-columns: 1fr 1fr; }
  .v5-cell { border-left: 0; border-top: 1px solid var(--line-soft, var(--gray-200)); }
  .v5-cell:nth-child(-n+2) { border-top: 0; }
  .v5-cell:nth-child(2n) { border-left: 1px solid var(--line-soft, var(--gray-200)); }
  .v5-head { flex-direction: column; align-items: stretch; gap: 12px; }
  .v5-head .v89-head-a { flex-wrap: wrap; }
  .v5-head .v89-head-a .btn { min-height: 44px; }
  .v5-tabs { margin: 14px -16px 18px; padding: 0 12px; }
  .v5-tabs > a[role="tab"] { height: 44px; }
  .v5-cato-top { grid-template-columns: 36px minmax(0, 1fr); padding: 14px; }
  .v5-cato-a { grid-column: 1 / -1; }
  .v5-cato-a .btn { min-height: 44px; }
  .v5-av.v5-av-lg { width: 36px; height: 36px; }
  .v5-agents { flex-wrap: wrap; }
  .v5-agents .v5-sp { display: none; }
  .v5-moved { margin-top: -6px; }
  .v5-sec { flex-wrap: wrap; }
}

/* the one primary on a page is dark, the approved frame's (app-frame-v5): colour is kept for status */
:root { --v5-pri-bg: #1c1d1f; --v5-pri-hover: #000; --v5-pri-fg: #fff; }
:root[data-theme="dark"] { --v5-pri-bg: #eef1f6; --v5-pri-hover: #fff; --v5-pri-fg: #111a2b; }
.shell .btn.primary, #dialog .btn.primary, .v5-fly .btn.primary, .pal .btn.primary { background: var(--v5-pri-bg) !important; border-color: var(--v5-pri-bg) !important; color: var(--v5-pri-fg) !important; box-shadow: 0 1px 1px rgba(0, 0, 0, .12) !important; }
.shell .btn.primary:hover, #dialog .btn.primary:hover { background: var(--v5-pri-hover) !important; border-color: var(--v5-pri-hover) !important; }
.shell .btn.primary svg, #dialog .btn.primary svg { color: currentColor !important; }
.shell .btn.primary[aria-disabled="true"], .shell .btn.primary:disabled, #dialog .btn.primary[aria-disabled="true"], #dialog .btn.primary:disabled { opacity: .45; }

/* Today's figures, one click under the four blocks */
.v5-figs { margin-top: 12px; }
.v5-figs > summary { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; color: var(--gray-600, #5a5d65); font-size: 13px; font-weight: 500; list-style: none; }
.v5-figs > summary::-webkit-details-marker { display: none; }
.v5-figs > summary:hover { color: var(--ink, #1c1d1f); }
.v5-figs[open] > summary { margin-bottom: 12px; }
.v5-figs .card { margin-bottom: 12px; }
@media (max-width: 699px) { .v5-moved-x { width: 44px; height: 44px; margin: -6px -4px -6px auto; } .page [role="tablist"].v5-seg > [role="tab"] { min-height: 36px; } }
