/* Firm hub (06): brand pack v2 applied by kind (RECIPES B1 card, B2 list of rows, B9 empty, B10 error, B15 tabs).
   No pack picture exists for this screen, so the layout as built stays and only the look is set here (RECIPES section A).
   Colour, radius, shadow and spacing come from the pack tokens only. Scoped to #view-firm. */
#view-firm { padding: 0 0 var(--v3-end-space); color: var(--al-text); }  /* 72px end space: the last card clears the Alfred pill (A1) */
#view-firm * { box-sizing: border-box; }
#view-firm a { color: var(--al-action); text-decoration: none; cursor: pointer; }
#view-firm a:hover { text-decoration: underline; }

/* title row: heading, today's date at the right, one figures line, the seven tabs */
#view-firm .fo-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; }
#view-firm .fo-head .al-title { margin: 0; }
#view-firm .fo-date { font-size: var(--al-fs-ui); color: var(--al-text-2); padding-bottom: 4px; white-space: nowrap; }
#view-firm .fo-heartbeat { margin: 4px 0 var(--al-gap-card); min-height: 20px; font-size: var(--al-fs-ui); color: var(--al-text-2); }
#view-firm .alf-tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: thin; max-width: 100%; margin-bottom: var(--al-gap-card); }
#view-firm .alf-tab { height: 40px; padding: 0; flex: none; border-radius: 0; background: none; color: var(--al-text-2); font-weight: 500; }
#view-firm .fo-subtabs { margin-bottom: 16px; }

/* every region is a card (B1): the "plain" variant of the foundation is not used on this screen */
#view-firm .al-region, #view-firm .al-region.is-plain { background: var(--al-card);  border-radius: var(--al-r-card); border: 1px solid var(--al-divider); box-shadow: var(--al-shadow-card); min-width: 0; }
#view-firm .al-region-hd, #view-firm .al-region.is-plain .al-region-hd { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; padding: var(--al-pad-card) var(--al-pad-card) var(--al-gap-title); border: 0; }
#view-firm .al-region-body, #view-firm .al-region.is-plain .al-region-body { padding: 0 var(--al-pad-card) var(--al-pad-card); }
#view-firm .al-region-hd .al-label { font-size: var(--al-fs-card); font-weight: 700; color: var(--al-text); }
#view-firm .al-region-hd .al-meta { margin-left: 0; font-size: var(--al-fs-label); color: var(--al-text-2); flex-basis: 100%; }
#view-firm #fo-judgement .al-region-hd .al-meta { flex-basis: auto; }
#view-firm .al-prov { padding: 12px var(--al-pad-card); border-top: 1px solid var(--al-divider); font-size: var(--al-fs-ui); color: var(--al-text); }
#view-firm .al-secondary { font-size: var(--al-fs-label); line-height: 1.5; color: var(--al-text-2); margin: 0; }
#view-firm .al-absent { font-size: var(--al-fs-ui); color: var(--al-text-2); margin: 0; }
#view-firm hr.al-rule { border: 0; border-top: 1px solid var(--al-divider); margin: 16px 0; align-self: stretch; width: 100%; }
#view-firm .al-workspace { gap: var(--al-gap-card); }
#view-firm .al-workspace-col { gap: var(--al-gap-card); min-width: 0; }

/* B2 rows: hairline between, 44 compact / 52 two-line, no mono face anywhere (dates and amounts are body face, tabular) */
#view-firm .al-flow-row { display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 10px 0; margin: 0; border-bottom: 1px solid var(--al-divider); }
#view-firm .al-flow-row + .al-flow-row { margin-top: 0; }
#view-firm .al-flow-row:last-child { border-bottom: 0; }
#view-firm .al-flow.is-compact .al-flow-row { padding: 8px 0; }
#view-firm .al-flow-title { font-size: var(--al-fs-ui); color: var(--al-text); line-height: 1.4; }
#view-firm .al-flow.is-compact .al-flow-title { font-size: var(--al-fs-ui); color: var(--al-text); }
#view-firm .al-flow-meta { font-size: var(--al-fs-label); color: var(--al-text-2); line-height: 1.4; }
#view-firm .al-flow.is-compact .al-flow-meta, #view-firm .al-flow.is-compact .al-flow-aside { font-size: var(--al-fs-label); }
#view-firm .al-flow-aside { font-size: var(--al-fs-label); color: var(--al-text-2); }
#view-firm .al-flow-row .al-flow-key { width: 64px; min-width: 64px; font-family: var(--al-font-ui); font-size: var(--al-fs-label); font-variant-numeric: tabular-nums; color: var(--al-text-2); padding-top: 0; }
#view-firm .al-num, #view-firm .fo-fig { font-family: var(--al-font-ui); font-variant-numeric: tabular-nums; white-space: nowrap; }
#view-firm .fo-fig { font-size: var(--al-fs-ui); font-weight: 500; color: var(--al-text); }
#view-firm .fo-fin-row { align-items: flex-start; }
#view-firm .fo-fin-row .al-flow-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#view-firm .fo-fin-row .al-flow-main { min-width: 0; }
#view-firm [role="button"].al-flow-row { cursor: pointer; border-radius: var(--al-r-control); padding-left: 12px; padding-right: 12px; margin: 0 -12px; }
#view-firm [role="button"].al-flow-row:hover, #view-firm [role="button"].al-flow-row[aria-selected="true"] { background: var(--al-selected); }
#view-firm [role="button"]:focus-visible { outline: none; box-shadow: var(--al-focus); }
#view-firm .al-flow-row[aria-selected="true"] { background: var(--al-selected); box-shadow: none; border-radius: var(--al-r-control); }

/* status marks keep their dot and sentence case */
#view-firm .al-status { font-size: var(--al-fs-label); white-space: normal; }

/* the big count in a card head */
#view-firm .al-region-hd .al-big { margin-left: auto; font-size: 24px; font-weight: 600; font-family: var(--al-font-ui); font-variant-numeric: tabular-nums; }

/* "Why?" and close controls are links, not bare text */
#view-firm .al-why { color: var(--al-action); font-size: var(--al-fs-label); font-weight: 500; cursor: pointer; }
#view-firm .al-why:focus-visible { outline: none; box-shadow: var(--al-focus); border-radius: 4px; }

/* decisions, documents, finance tab */
#view-firm .fo-vote-row { display: flex; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
#view-firm .fo-actions { margin-top: 16px; }
#view-firm .fo-doc-card { margin-bottom: var(--al-gap-card); }
#view-firm .fo-two { display: grid; grid-template-columns: 1fr 1fr; gap: var(--al-gap-card); }
#view-firm .al-sec-title { font-size: var(--al-fs-card); font-weight: 600; margin: 16px 0 8px; }

/* B10: the error is in the region that failed, with its own retry */
#view-firm .fo-error { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; font-size: var(--al-fs-ui); }

/* C10: a selected tab on the page background is the card fill with the card shadow, never a plate the colour of the page */
#view-firm #fo-tabs .alf-tab[aria-selected="true"], #view-firm #fo-entity-switch .alf-tab[aria-selected="true"] { background: none; box-shadow: inset 0 -2px 0 var(--al-brass); color: var(--al-action); font-weight: 700; }

/* rows are plain hairline rows: the old rounded row edge is gone */
#view-firm .al-flow-row { border-radius: 0; background: none; box-shadow: none; }
#view-firm [role="button"].al-flow-row { border-radius: var(--al-r-control); }

#view-firm .al-region > .al-region-body:first-child { padding-top: var(--al-pad-card); }
#view-firm .fo-doc-card .al-region-hd .al-meta { flex-basis: auto; margin-left: auto; color: var(--al-text-2); font-variant-numeric: tabular-nums; }

/* the Why? expansion yields space to the centre but never squeezes the side cards below readable width */
#view-firm .al-workspace.is-expanded { grid-template-columns: minmax(0, 1fr) minmax(0, 1.9fr) minmax(0, 1fr); }

/* the Firm Intelligence Register (kept logic, old markup) sits in one card; its own inline styles now carry pack tokens */
#view-firm #pcc-content > div:first-child { background: var(--al-card); border-radius: var(--al-r-card); border: 1px solid var(--al-divider); box-shadow: var(--al-shadow-card); padding: var(--al-pad-card); min-width: 0; overflow-wrap: anywhere; }
#view-firm #pcc-content summary { cursor: pointer; }

/* the hairline is a straight line under the row text, so a rounded hover plate never curves it */
#view-firm .al-flow-row { position: relative; border-bottom: 0; }
#view-firm .al-flow-row::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--al-divider); }
#view-firm .al-flow-row:last-child::after { display: none; }
#view-firm [role="button"].al-flow-row { padding-left: 12px; padding-right: 12px; margin-left: -12px; margin-right: -12px; }
#view-firm [role="button"].al-flow-row::after { left: 12px; right: 12px; }

/* the page never grows wider than the window: the seven tabs and the entity switcher scroll inside their own strip (B15) */
#view-firm { width: 100%; min-width: 0; max-width: 100%; }
#view-firm #fo-tabbody, #view-firm .alf-tabs { min-width: 0; max-width: 100%; }

/* a long strip never widens the page grid: its width counts as zero until the column gives it room (B15) */
#view-firm .alf-tabs { width: 0; min-width: 100%; }


/* a clickable row inside a compact list keeps its 12px inset (the compact rule is as specific, so this one repeats the ancestor) */
#view-firm .al-flow .al-flow-row[role="button"] { padding-left: 12px; padding-right: 12px; }
#view-firm .fo-ref { white-space: nowrap; }

#view-firm .fo-door { color: var(--al-action); font-weight: 600; margin-left: 4px; }

/* the expanded Why? view is the card's own body: it needs the card padding the replaced head and body carried */
#view-firm .al-workspace.is-expanded #fo-finance-region { padding: var(--al-pad-card); }

/* a strip that continues to the right fades there, so a cut tab is read as "more", not as broken (A1, A20) */
#view-firm .alf-tabs.has-more-right { -webkit-mask-image: linear-gradient(to right, black calc(100% - 96px), transparent); mask-image: linear-gradient(to right, black calc(100% - 96px), transparent); }

/* ── CD round 1 (F-1 to F-12) ─────────────────────────────────────────── */

/* cards in tab bodies: full width, the Alfred pill kept clear by the 88px under the last card */
#view-firm .fo-card { margin-bottom: var(--al-gap-card); }
#view-firm #fo-tabbody > .al-region { margin-bottom: var(--al-gap-card); }
#view-firm .fo-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--al-gap-card); align-items: start; }
#view-firm .fo-split .fo-card { margin-bottom: 0; }
#view-firm .fo-split-dec { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); }
#view-firm #fo-finance-tab-body > .fo-card { margin-bottom: 0; }
@media (max-width: 1099px) { #view-firm .fo-split, #view-firm .fo-split-dec { grid-template-columns: minmax(0, 1fr); } }

/* Decisions: the head carries the one primary; the list is plain rows; the detail card is the selected decision (B7) */
#view-firm .fo-hd-btn { margin-left: auto; align-self: center; }
#view-firm .al-region-hd:has(.fo-hd-btn) { flex-wrap: nowrap; }
#view-firm .fo-dd-title { font-size: var(--al-fs-card); font-weight: 600; margin: 0 0 4px; }
#view-firm .fo-dd-text { font-size: var(--al-fs-read); line-height: 1.5; margin: 12px 0 0; color: var(--al-text); }
#view-firm .fo-vote-row { margin-top: 20px; }
#view-firm .alf-button--quiet { color: var(--al-action); }

/* Documents: the policies as a table (B4): head 44, rows 52, the same four columns in every state */
#view-firm .fo-table { width: 100%; border-collapse: collapse; }
#view-firm .fo-table th { text-align: left; height: 44px; padding: 0 12px; font-size: var(--al-fs-label); font-weight: 600; color: var(--al-text-2); border-bottom: 1px solid var(--al-divider); white-space: nowrap; }
#view-firm .fo-table td { height: 52px; padding: 0 12px; font-size: var(--al-fs-ui); border-bottom: 1px solid var(--al-divider); vertical-align: middle; }
#view-firm .fo-table tr:last-child td { border-bottom: 0; }
#view-firm .fo-table .r { text-align: right; }
#view-firm .fo-table tr.is-past td { color: var(--al-text-2); }
#view-firm .fo-table th:first-child, #view-firm .fo-table td:first-child { padding-left: 0; }
#view-firm .fo-count { margin-left: auto; font-size: var(--al-fs-label); font-weight: 500; color: var(--al-text-2); font-variant-numeric: tabular-nums; font-family: var(--al-font-ui); }
#view-firm .fo-doc-card .al-region-hd { flex-wrap: nowrap; }

/* Finance: notes behind Por que? */
#view-firm .fo-notes { margin: 14px 0 0; padding: 0; list-style: none; font-size: var(--al-fs-label); color: var(--al-text-2); line-height: 1.5; }
#view-firm .fo-notes li + li { margin-top: 4px; }

/* Team: two columns of rows from 1440 */
@media (min-width: 1440px) { #view-firm .fo-team-grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 48px; } }

/* Intelligence: the engine line is the register card's subtitle */
#view-firm .fo-engine { font-size: var(--al-fs-label); color: var(--al-text-2); margin: 4px 0 0; }
#view-firm .fo-card-reg { margin-bottom: var(--al-gap-card); }
#view-firm .fo-card-reg > div:first-child { background: var(--al-card); border-radius: var(--al-r-card); border: 1px solid var(--al-divider); box-shadow: var(--al-shadow-card); padding: var(--al-pad-card); min-width: 0; overflow-wrap: anywhere; }

/* Key dates: the tax sentence is quiet; the 0 carries the attention colour (F-12) */
#view-firm .fo-taxline { margin: 0 0 8px; font-size: var(--al-fs-label); line-height: 1.5; color: var(--al-text-2); }
#view-firm .fo-attn { color: var(--al-attention); font-weight: 600; }

/* F-4: up to 1599px the Overview is two columns; at 1600 and over it keeps three */
@media (max-width: 1599px) {
  #view-firm .al-workspace { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); grid-template-areas: "judg fin" "act fin" "dept keyd"; align-items: start; }
  #view-firm .al-workspace-col { display: contents; }
  #view-firm #fo-judgement { grid-area: judg; }
  #view-firm #fo-activity { grid-area: act; }
  #view-firm #fo-finance-region { grid-area: fin; }
  #view-firm #fo-departments-region { grid-area: dept; }
  #view-firm #fo-keydates { grid-area: keyd; }
  #view-firm .al-workspace.is-expanded { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "fin fin" "judg act" "dept keyd"; }
}

/* round 1, second pass */
#view-firm .fo-pad { padding: var(--al-pad-card); }
#view-firm .fo-card .al-prov { padding-left: 0; padding-right: 0; }
#view-firm .fo-table thead, #view-firm .fo-table thead tr { background: none; }
#view-firm .fo-table th { background: none; color: var(--al-text-2); text-transform: none; letter-spacing: 0; font-size: var(--al-fs-label); font-weight: 600; }
#view-firm .fo-narrow { max-width: 720px; }

/* FR4-1: Finanzas, Honorarios: two columns from 1680 px, one column below */
#view-firm .fo-fees-svc-t { margin: 18px 0 6px; }
@media (min-width: 1680px) {
  #view-firm .fo-fees-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 48px; align-items: start; }
  #view-firm .fo-fees-svc-t { margin-top: 0; }
  #view-firm .fo-narrow:has(.fo-fees-cols) { max-width: none; }
}

/* step 4, area 3 (recipe 04, the Firm drawing version 2): the Overview is a desk. A lead band when something waits, the money beside the departments and the dates, the activity under the money.
   Pack tokens only; the parts (b9, b6, b10, card, avatar) bring their own look. */
#view-firm .fo-heartbeat[hidden] { display: none; }
#view-firm .fo-desk { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: var(--v3-s-5, 24px); align-items: start; }
#view-firm .fo-wide, #view-firm .fo-side { display: flex; flex-direction: column; gap: var(--v3-s-5, 24px); min-width: 0; }
#view-firm .fo-band { display: flex; flex-direction: column; gap: var(--v3-s-2, 8px); margin-bottom: var(--v3-s-5, 24px); }
#view-firm .fo-band-rows { background: var(--v3-card); border: 1px solid var(--v3-line); border-radius: var(--v3-radius-card); overflow: hidden; }
#view-firm .fo-band-rows[hidden] { display: none; }
#view-firm .fo-brow { display: flex; align-items: center; gap: var(--v3-s-4, 16px); width: 100%; min-height: 56px; padding: var(--v3-s-2, 8px) var(--v3-s-4, 16px); background: transparent; border: 0; text-align: left; cursor: pointer; font: inherit; color: var(--v3-text); }
#view-firm .fo-brow + .fo-brow { border-top: 1px solid var(--v3-line); }
#view-firm .fo-brow:hover { background: var(--al-selected); }
#view-firm .fo-brow-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
#view-firm .fo-brow-main b { font-size: var(--v3-fs-body); font-weight: 600; overflow-wrap: anywhere; }
#view-firm .fo-brow-main span, #view-firm .fo-brow-date { font-size: var(--v3-fs-label); color: var(--v3-text-2); }
#view-firm .fo-brow-date { white-space: nowrap; }
#view-firm .fo-dots { display: inline-flex; gap: 4px; flex: none; }
#view-firm .fo-dots i { width: 8px; height: 8px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--v3-navy); }
#view-firm .fo-dots i.on { background: var(--v3-navy); }
#view-firm .fo-sec { display: flex; flex-direction: column; gap: var(--v3-s-3, 12px); }
#view-firm .fo-sec-label { font-size: var(--v3-fs-label); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--v3-text-2); }
#view-firm .fo-quiet { margin: 0; font-size: var(--v3-fs-body); color: var(--v3-text-2); }
#view-firm .fo-note { margin: var(--v3-s-3, 12px) 0 0; font-size: var(--v3-fs-label); color: var(--v3-text-2); }
#view-firm .fo-card .pt-card-body > .fo-quiet { margin-top: var(--v3-s-3, 12px); }
#view-firm .fo-card .pt-rank { cursor: pointer; }
#view-firm .fo-why { margin-top: var(--v3-s-3, 12px); }
#view-firm .fo-ds-attn { font-weight: 400; padding: 0; background: none; border-radius: 0; display: flex; flex-direction: column; gap: var(--v3-s-2, 8px); }
#view-firm .fo-ds-attn p { margin: 0; font-size: var(--v3-fs-body); color: var(--v3-text); }
#view-firm .fo-ds-attn-head { font-weight: 700; color: var(--v3-attention); }
#view-firm .fo-tl-day { display: flex; flex-direction: column; gap: var(--v3-s-2, 8px); }
#view-firm .fo-tl-day + .fo-tl-day { margin-top: var(--v3-s-3, 12px); }
#view-firm .fo-tl-head { font-size: var(--v3-fs-label); font-weight: 700; color: var(--v3-text-2); }
#view-firm .fo-tl-row { display: flex; align-items: center; gap: var(--v3-s-3, 12px); min-height: 32px; font-size: var(--v3-fs-body); }
#view-firm .fo-tl-none { width: 24px; flex: none; }
#view-firm .fo-tl-text { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; min-width: 0; }
#view-firm .fo-tl-text small { font-size: var(--v3-fs-label); color: var(--v3-text-2); }
@media (max-width: 1100px) { #view-firm .fo-desk { grid-template-columns: minmax(0, 1fr); } }
#view-firm .fo-ds-attn p b { display: block; font-weight: 600; }
#view-firm .fo-ds-attn p { color: var(--v3-text); }

/* Finance (recipe 04): company chips, the net revenue at the top, where the money goes, the accounts panel, the balance sheet, the fee questions */
#view-firm .fo-chips { margin-bottom: var(--v3-s-4, 16px); flex-wrap: wrap; }
#view-firm .fo-co { display: flex; flex-direction: column; gap: var(--v3-s-3, 12px); }
#view-firm .fo-viewtabs { margin: var(--v3-s-3, 12px) 0 0; }
#view-firm .fo-h3 { margin: var(--v3-s-4, 16px) 0 var(--v3-s-2, 8px); font-size: var(--v3-fs-sub); font-weight: 700; line-height: 1.35; color: var(--v3-ink); }
#view-firm .fo-split-bar { display: flex; gap: 2px; height: 22px; border-radius: 3px; overflow: hidden; margin: var(--v3-s-2, 8px) 0 var(--v3-s-3, 12px); }
#view-firm .fo-seg, #view-firm .fo-sw { display: block; }
#view-firm .fo-seg.s1, #view-firm .fo-sw.s1 { background: var(--v3-series-1); }
#view-firm .fo-seg.s2, #view-firm .fo-sw.s2 { background: var(--v3-series-2); }
#view-firm .fo-seg.s3, #view-firm .fo-sw.s3 { background: var(--v3-series-3); }
#view-firm .fo-seg.s4, #view-firm .fo-sw.s4 { background: var(--v3-series-4); }
#view-firm .fo-seg.s5, #view-firm .fo-sw.s5 { background: var(--v3-series-5); }
#view-firm .fo-sw { width: 10px; height: 10px; border-radius: 2px; flex: none; }
#view-firm .fo-cat-list { display: flex; flex-direction: column; max-width: 820px; }
#view-firm .fo-cat-row { display: grid; grid-template-columns: 14px minmax(0, 1fr) 120px 60px 20px; gap: var(--v3-s-3, 12px); align-items: center; min-height: 48px; padding: 8px 10px; background: transparent; border: 0; border-bottom: 1px solid var(--v3-line); text-align: left; font: inherit; font-size: var(--v3-fs-body); color: var(--v3-text); cursor: pointer; }
#view-firm .fo-cat-row:hover { background: var(--al-selected); }
#view-firm .fo-cat-row.is-open { background: var(--al-selected); box-shadow: inset 3px 0 0 var(--v3-navy); }
#view-firm .fo-cat-name em { font-style: normal; color: var(--v3-text-2); }
#view-firm .fo-cat-amt { text-align: right; font-variant-numeric: tabular-nums; }
#view-firm .fo-cat-pct { text-align: right; color: var(--v3-text-2); font-variant-numeric: tabular-nums; }
#view-firm .fo-bal { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--v3-s-5, 24px); }
#view-firm .fo-bal-row { display: flex; justify-content: space-between; gap: var(--v3-s-3, 12px); padding: 10px 0; border-bottom: 1px solid var(--v3-line); font-size: var(--v3-fs-body); font-variant-numeric: tabular-nums; }
#view-firm .fo-bal-row.is-cat { font-weight: 700; }
#view-firm .fo-bal-row:not(.is-cat) { padding-left: var(--v3-s-4, 16px); color: var(--v3-text-2); }
#view-firm .fo-svc-top { display: flex; flex-direction: column; gap: 2px; padding: var(--v3-s-3, 12px) 0; }
#view-firm .fo-svc-top span { font-size: var(--v3-fs-label); color: var(--v3-text-2); }
#fo-panel-host .fo-scrim { position: fixed; inset: 0; z-index: 400; background: var(--v3-scrim); }
#fo-panel-host .fo-panel { position: fixed; top: 12px; right: 12px; bottom: 12px; width: min(440px, calc(100vw - 24px)); z-index: 401; display: flex; flex-direction: column; background: var(--v3-card); border-radius: 10px; box-shadow: var(--v3-shadow-layer); font-family: var(--al-font-ui); color: var(--v3-text); }
#fo-panel-host .fo-panel-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding: 22px 24px; border-bottom: 1px solid var(--v3-line); }
#fo-panel-host .fo-panel-head > div { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
#fo-panel-host .fo-panel-sub { font-size: var(--v3-fs-label); color: var(--v3-text-2); }
#fo-panel-host .fo-panel-title { font-size: 20px; font-weight: 800; color: var(--v3-navy); }
#fo-panel-host .fo-panel-amt { font-size: 26px; font-weight: 800; color: var(--v3-navy); font-variant-numeric: tabular-nums; }
#fo-panel-host .fo-panel-body { padding: 12px 24px 24px; overflow: auto; display: flex; flex-direction: column; gap: 4px; }
#fo-panel-host .fo-sec-label { font-size: var(--v3-fs-label); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--v3-text-2); padding: 8px 0; }
#fo-panel-host .fo-panel-gap { margin-top: var(--v3-s-4, 16px); }
#fo-panel-host .fo-acc { display: grid; grid-template-columns: 96px minmax(0, 1fr) 100px; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--v3-line); font-size: var(--v3-fs-body); }
#fo-panel-host .fo-acc-code { font-family: var(--al-font-mono, 'DM Mono', monospace); color: var(--v3-text-2); }
#fo-panel-host .fo-acc span:last-child { text-align: right; font-variant-numeric: tabular-nums; }
#fo-panel-host .fo-quiet, #fo-panel-host .fo-note { margin: 8px 0 0; font-size: var(--v3-fs-label); color: var(--v3-text-2); }
@media (max-width: 1100px) { #view-firm .fo-bal { grid-template-columns: minmax(0, 1fr); } }
/* the turnover bars: length is revenue, so one ink; the label has room for the period; the figure has room for euros */
#view-firm .fo-card .pt-rank { grid-template-columns: minmax(0, 240px) minmax(0, 480px) 88px; justify-content: start; }   /* K9 (Codex r2): the track stops at 480 and the name at 240, as the pack says */
#view-firm .fo-card .pt-rank > i, #view-firm .fo-card .pt-rank > i.s2, #view-firm .fo-card .pt-rank > i.s3, #view-firm .fo-card .pt-rank > i.s4, #view-firm .fo-card .pt-rank > i.s5 { background: var(--v3-series-1); }
#view-firm .fo-card .pt-rank > span { white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.3; }

/* Decisions, Documents, Departments, Team (recipe 04) */
#view-firm .fo-dec { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: var(--v3-s-5, 24px); align-items: start; }
#view-firm .fo-dec .pt-wrow[role="button"] { cursor: pointer; padding-left: var(--v3-s-2, 8px); padding-right: var(--v3-s-2, 8px); border-radius: 6px; }
#view-firm .fo-dec .pt-wrow[aria-selected="true"] { background: var(--al-selected); }
#view-firm .fo-dd { display: flex; flex-direction: column; gap: var(--v3-s-3, 12px); }
#view-firm .fo-dd-title { margin: 0; font-size: 20px; font-weight: 800; color: var(--v3-navy); }
#view-firm .fo-dd-chips { display: flex; flex-wrap: wrap; gap: var(--v3-s-2, 8px); }
#view-firm .fo-dd-text { margin: 0; font-size: var(--v3-fs-body); line-height: 1.5; white-space: pre-wrap; }
#view-firm .fo-dd-count { margin: 0; display: flex; align-items: center; gap: var(--v3-s-2, 8px); font-size: var(--v3-fs-body); color: var(--v3-text-2); }
#view-firm .fo-votes { display: flex; flex-direction: column; }
#view-firm .fo-vote { display: flex; gap: var(--v3-s-3, 12px); align-items: flex-start; padding: var(--v3-s-2, 8px) 0; border-bottom: 1px solid var(--v3-line); }
#view-firm .fo-vote-main { display: flex; flex-wrap: wrap; gap: 2px 8px; min-width: 0; font-size: var(--v3-fs-body); }
#view-firm .fo-vote-main > span { color: var(--v3-text-2); }
#view-firm .fo-vote-comment { flex-basis: 100%; font-size: var(--v3-fs-label); }
#view-firm .fo-vote-field textarea { resize: none; }
#view-firm .fo-vote-row { display: flex; flex-wrap: wrap; gap: var(--v3-s-2, 8px); margin-top: var(--v3-s-2, 8px); }
#view-firm .fo-docs { display: flex; flex-direction: column; gap: var(--v3-s-5, 24px); }
#view-firm .fo-docs .pt-card-body { display: flex; flex-direction: column; gap: var(--v3-s-3, 12px); }
#view-firm .fo-hair { display: flex; flex-direction: column; }
#view-firm .fo-hair-row { display: flex; justify-content: space-between; align-items: center; gap: var(--v3-s-3, 12px); min-height: 44px; padding: 6px 0; border-bottom: 1px solid var(--v3-line); font-size: var(--v3-fs-body); }
#view-firm .fo-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--v3-s-4, 16px); }
#view-firm .fo-tile { display: flex; flex-direction: column; gap: var(--v3-s-2, 8px); padding: var(--v3-s-4, 16px) var(--v3-s-5, 24px); background: var(--v3-card); border: 1px solid var(--v3-line); border-radius: var(--v3-radius-card); }
#view-firm .fo-tile.is-fired { box-shadow: none; background: none; }
#view-firm .fo-tile-head { display: flex; justify-content: space-between; align-items: center; gap: var(--v3-s-3, 12px); }
#view-firm .fo-tile-head b { font-size: var(--v3-fs-card, 17px); font-weight: 700; }
#view-firm .fo-tile-text { margin: 0; font-size: var(--v3-fs-body); color: var(--v3-text); }
#view-firm .fo-tile-link { margin: var(--v3-s-2, 8px) 0 0; }
#view-firm .fo-team-sec + .fo-team-sec { margin-top: var(--v3-s-5, 24px); }
#view-firm .fo-team-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: var(--v3-s-3, 12px); }
#view-firm .fo-person { display: flex; align-items: center; gap: var(--v3-s-3, 12px); min-height: 72px; padding: var(--v3-s-3, 12px) var(--v3-s-4, 16px); background: var(--v3-card); border: 1px solid var(--v3-line); border-radius: var(--v3-radius-card); text-align: left; font: inherit; color: var(--v3-text); cursor: pointer; }
#view-firm .fo-person:hover:not([disabled]) { background: var(--al-selected); }
#view-firm .fo-person[disabled] { cursor: default; }
#view-firm .fo-person-main { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; min-width: 0; }
#view-firm .fo-person-main b { font-weight: 600; font-size: var(--v3-fs-body); }
#view-firm .fo-person-main span { font-size: var(--v3-fs-label); color: var(--v3-text-2); }
#view-firm .fo-person-main .pt-chip-state { color: var(--v3-ink); }
@media (max-width: 1100px) { #view-firm .fo-dec { grid-template-columns: minmax(0, 1fr); } }

/* Intelligence (recipe 04): headline figures, coverage tiles, findings, found money, counterparties, client questions, the folded register */
#view-firm .fo-intel { display: flex; flex-direction: column; gap: var(--v3-s-5, 24px); }
#view-firm .fo-h2 { margin: 0; font-size: var(--v3-fs-section); font-weight: 800; line-height: 1.25; color: var(--v3-navy); }
#view-firm .fo-intel .fo-sec { gap: var(--v3-s-3, 12px); }
#view-firm .fo-finds { display: flex; flex-direction: column; gap: var(--v3-s-3, 12px); }
#view-firm .fo-find { display: flex; flex-direction: column; gap: var(--v3-s-2, 8px); padding: var(--v3-s-4, 16px) var(--v3-s-5, 24px); background: var(--v3-card); border: 1px solid var(--v3-line); border-radius: var(--v3-radius-card); }
#view-firm .fo-find-label { font-size: var(--v3-fs-label); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--v3-text-2); }
#view-firm .fo-find-text { margin: 0; font-size: var(--v3-fs-body); line-height: 1.5; color: var(--v3-text); max-width: 820px; }
#view-firm .fo-find .fo-why { margin-top: 0; }
#view-firm .fo-find [data-fo-why-fb] { margin-top: var(--v3-s-2, 8px); }
#view-firm .fo-find [data-fo-why-fb][hidden] { display: none; }
#view-firm .fo-q { border-bottom: 1px solid var(--v3-line); }
#view-firm .fo-q summary { display: flex; justify-content: space-between; align-items: center; gap: var(--v3-s-3, 12px); min-height: 52px; cursor: pointer; font-size: var(--v3-fs-body); list-style: none; }
#view-firm .fo-q summary::-webkit-details-marker { display: none; }
#view-firm .fo-q-theme { font-weight: 600; }
#view-firm .fo-q-n { color: var(--v3-text-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
#view-firm .fo-q-body { display: flex; flex-direction: column; gap: var(--v3-s-2, 8px); padding: 0 0 var(--v3-s-4, 16px); align-items: flex-start; }
#view-firm .fo-q-ex { margin: 0; font-size: var(--v3-fs-body); font-style: italic; color: var(--v3-text-2); }
#view-firm .fo-more summary { cursor: pointer; font-size: var(--v3-fs-body); font-weight: 600; color: var(--al-action); min-height: 44px; display: flex; align-items: center; }
#view-firm .fo-pager { display: flex; align-items: center; justify-content: space-between; gap: var(--v3-s-3, 12px); margin-top: var(--v3-s-3, 12px); }
#view-firm .fo-engine { margin: 0; }
#view-firm .fo-tile-head { flex-wrap: wrap; }

/* controls: a text link, the Why? fold and a clickable bar keep the pack's 40 px hit area without moving anything */
#view-firm .al-why { padding: 10px 0; margin: -10px 0; }
#view-firm .fo-quiet a, #view-firm .fo-sec a, #view-firm .fo-tile-link a { display: inline-block; padding: 11px 0; margin: -11px 0; }
#view-firm .fo-card .pt-rank[role="button"] { min-height: 40px; }

/* audit r1c (Claude Design, 16 Oct): no box inside a card, notes at 13 px, attention is a chip and a line on white, equal tiles, the lane chart without peach or brass, the date under the axis */
#view-firm .fo-card .pt-b6 { border: 0; padding: 0; background: none; box-shadow: none; }
#view-firm .fo-note, #view-firm .fo-tile .fo-note { font-size: 13px; }
#view-firm .fo-ds-attn { background: none; border: 0; box-shadow: none; padding: 0; }
#view-firm .fo-ds-attn-head .pt-chip-state { font-weight: 700; }
#view-firm .fo-tile.is-fired { background: var(--v3-card); box-shadow: none; }
#view-firm .fo-tiles { grid-auto-rows: auto; align-items: start; }   /* FI-22: a tile is as tall as what it says */
#view-firm .pt-bar.is-late { background: var(--v3-card); box-shadow: inset 0 0 0 1.5px var(--v3-attention); }
#view-firm .pt-bar.is-key { background: var(--v3-attention); top: 4px; height: 18px; }
#view-firm .pt-sw.brass { background: var(--v3-attention); }
#view-firm .pt-sw.is-late { background: var(--v3-card); box-shadow: inset 0 0 0 1.5px var(--v3-attention); }
#view-firm .pt-lane-head, #view-firm .pt-lane { grid-template-columns: 200px minmax(0, 1fr); }
#view-firm .pt-lane > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: var(--v3-s-3, 12px); }
#view-firm .pt-today { left: calc(var(--v3-s-4) + 200px + (100% - 200px - 2 * var(--v3-s-4)) * var(--at)); bottom: 28px; }
#view-firm .pt-today::after { top: auto; bottom: -22px; left: -16px; }
#view-firm .pt-b7 { padding-bottom: 36px; }
#view-firm .fo-tl-row .pt-av + .fo-tl-text, #view-firm .fo-tl-row .fo-tl-text:first-child { margin-left: 0; }

/* FI-18 (CD audit v1.1): the Why? notes are hairline rows, one note a row */
#view-firm .fo-notes li { padding: 10px 0; border-top: 1px solid var(--v3-line); }
#view-firm .fo-notes li + li { margin-top: 0; }

/* eyes round e1: no peach on Firm (FI-6, CD): an attention chip is amber words on white with an amber line; a tile head keeps its chip on the title row */
/* FI3-02 (K7): the state chip is the pack's tinted chip everywhere; the outlined amber pill is gone */
#view-firm .fo-tile-head { flex-wrap: wrap; align-items: flex-start; row-gap: 6px; }
#view-firm .fo-tile-head > .pt-chip-state { flex: none; }
/* FI3-02 (CD, 17 Oct): the insurance warning on Documents is the shared amber line, with no edge and no box */
/* FI3-D2 (CD, 17 Oct): the departments are one open list, rows on the page with a divider, attention first; no box per department */
#view-firm .fo-tiles { display: flex; flex-direction: column; gap: 0; align-items: stretch; }
#view-firm .fo-tile, #view-firm .fo-tile.is-fired { display: grid; grid-template-columns: minmax(170px, 230px) minmax(0, 1fr) auto; align-items: baseline; gap: 4px var(--v3-s-5, 24px); padding: var(--v3-s-4, 16px) 0; background: none; border: 0; border-bottom: 1px solid var(--v3-line, var(--al-divider)); border-radius: 0; box-shadow: none; }
#view-firm .fo-tile-head { display: contents; }
#view-firm .fo-tile-head b { grid-column: 1; }
#view-firm .fo-tile-head .pt-chip-state, #view-firm .fo-tile-head .fo-dept-ok { grid-column: 3; grid-row: 1; justify-self: end; }
#view-firm .fo-dept-ok { font-size: var(--v3-fs-meta); color: var(--v3-text-2); }
#view-firm .fo-tile-text { grid-column: 2; grid-row: 1; }
#view-firm .fo-tile-link, #view-firm .fo-tile-spark { grid-column: 2; margin: 0; }
#view-firm .fo-tile.is-fired .fo-tile-text { font-weight: 600; color: var(--v3-attention); }
#view-firm .fo-tile .fo-note { grid-column: 2; margin: 0; }
/* FI3-D5 (CD, 17 Oct): the policy timeline is history, not an alarm. An expired policy with nothing newer is a quiet dashed outline in the ink of the text (shape, not colour, RULES 19); amber stays for the one expiring soon and for the sentence above the chart */
#view-firm .fo-docs .pt-bar.is-late, #view-firm .fo-docs .pt-sw.is-late { background: transparent; box-shadow: none; border: 1.5px dashed var(--v3-text-2); box-sizing: border-box; }
/* FI3-09 (CD, 17 Oct): a name in the timeline wraps to two lines, with the whole text on hover, and is never cut */
#view-firm .fo-docs .pt-lane > span { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; line-height: 1.25; padding-right: var(--v3-s-2); }
#view-firm .fo-docs .pt-lane-track { min-height: 26px; }
/* FI3-08 (CD, 17 Oct): the Team is an open list, not twenty cards in a grid: a row per person, a divider, two columns of rows from 1440 */
#view-firm .fo-team-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; }
@media (min-width: 1440px) { #view-firm .fo-team-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--v3-s-7, 48px); } }
#view-firm .fo-person { width: 100%; min-height: 64px; padding: var(--v3-s-2, 8px) 0; background: none; border: 0; border-bottom: 1px solid var(--v3-line); border-radius: 0; box-shadow: none; text-align: left; }
#view-firm .fo-person:hover:not([disabled]) { background: var(--al-selected); }
/* FI3-07 (Peter, 18 Oct): Finance keeps three tabs (a two-position switch is wrong for three views) but they must not read as the page's own tabs: a quieter text size and a plate on the selected one instead of the main tabs' underline */
#view-firm .fo-subtabs { gap: var(--v3-s-2, 8px); border-bottom: 0; margin-bottom: var(--v3-s-3, 12px); }
#view-firm .fo-subtabs .alf-tab { height: var(--v3-control-h, 40px); padding: 0 var(--v3-s-3, 12px); border: 0; border-radius: var(--v3-radius-chip, 999px); font-size: var(--v3-fs-meta); font-weight: 500; box-shadow: none; background: transparent; }
#view-firm .fo-subtabs .alf-tab::after { display: none; }
#view-firm .fo-subtabs .alf-tab[aria-selected="true"] { background: var(--al-selected); color: var(--al-action); font-weight: 600; box-shadow: none; border: 0; }
/* FI3-D3 (Peter, 18 Oct): the findings are open reading sections on the page, a divider between them, not a stack of boxed cards; Why stays */
#view-firm .fo-finds { gap: 0; }
#view-firm .fo-find { padding: var(--v3-s-4, 16px) 0; background: none; border: 0; border-bottom: 1px solid var(--v3-line); border-radius: 0; box-shadow: none; }