/* ==========================================================================
   JurisAgent — pages/platform.css
   Page-specific styles for /platform and /practice-areas.
   Loaded AFTER site.css. Uses only site.css tokens. Prefixes:
     .pf-*  Platform page
     .pr-*  Practice-areas page
   Content is always visible without JS; motion lives in the guarded
   prefers-reduced-motion block at the end of each section.
   ========================================================================== */

/* --- Page tokens (light / dark) -------------------------------------- */
:root {
  --plat-agents-bg: #F1F3F2;      /* agents stratum, gradient bottom */
  --plat-crew-halo: #F5F5F1;      /* ring around crew discs (matches stratum) */
  --plat-gate-bg: #F6E6DF;        /* attorney-gate stratum, gradient bottom */
  --plat-seal-bg: #F8EBE5;        /* disc behind the strata seal */
  --plat-out-bg: #15171C;         /* "output" stratum (ink block) */
  --plat-out-line: #15171C;
  --plat-panel: #FDFBF6;          /* panels inside app mockups */
  --plat-rail: #F9F5EC;           /* workspace right rail */
  --plat-agent-out: rgba(222,229,237,.45); /* agent output callout */
  --plat-atty-wash: rgba(241,221,215,.55); /* attorney column wash */
  --plat-row-atty: rgba(241,221,215,.35);  /* attorney audit row */
  --plat-flag-bg: #FCF4E3;        /* flagged mini form */
  --plat-shared-top: #EEF2F6;     /* shared-facts box, gradient top */
  --plat-src-hl: rgba(203,215,230,.6);     /* highlighted line on source page (paper) */
  --plat-page-shadow: 0 1px 0 rgba(0,0,0,.03), 0 18px 40px -26px rgba(21,23,28,.45);
  /* on night bands (dark in both themes) */
  --plat-on-night-fill: #15171C;  /* dark text on light fills inside night bands */
  --plat-filter-line: rgba(237,231,218,.18);
  --plat-bulk-bg: rgba(169,189,214,.1);
  --plat-bulk-line: rgba(169,189,214,.4);
  --plat-chain-line: rgba(169,189,214,.5);
  --plat-gate-halo: rgba(229,143,134,.18);
}
:root[data-theme="dark"] {
  --plat-agents-bg: #1A2029;
  --plat-crew-halo: #1A1E25;
  --plat-gate-bg: #2A1B1C;
  --plat-seal-bg: #2C1D1E;
  --plat-out-bg: #0B0C0F;
  --plat-out-line: #2D2E34;
  --plat-panel: #1F2126;
  --plat-rail: #17191D;
  --plat-agent-out: rgba(147,179,218,.08);
  --plat-atty-wash: rgba(229,143,134,.1);
  --plat-row-atty: rgba(229,143,134,.07);
  --plat-flag-bg: #2A2215;
  --plat-shared-top: #1C2532;
  --plat-src-hl: rgba(170,192,220,.55);
  --plat-page-shadow: 0 1px 0 rgba(0,0,0,.2), 0 22px 44px -24px rgba(0,0,0,.85);
  --plat-on-night-fill: #111216;
  --plat-filter-line: rgba(236,232,225,.16);
  --plat-bulk-bg: rgba(169,195,226,.08);
  --plat-bulk-line: rgba(169,195,226,.35);
  --plat-chain-line: rgba(169,195,226,.45);
  --plat-gate-halo: rgba(229,143,134,.16);
}


/* ==========================================================================
   PLATFORM (/platform)
   ========================================================================== */

/* --- Hero ------------------------------------------------------------- */
.pf-h1 { max-width: 14ch; }
.pf-hero-grid {
  display: grid; grid-template-columns: minmax(0, 4.4fr) minmax(0, 7.6fr);
  gap: clamp(32px, 4.5vw, 80px); margin-top: clamp(36px, 4.4vw, 60px); align-items: start;
}
.pf-hero-copy { border-top: 1px solid var(--rule-ink); padding-top: 4px; }
.pf-hero-copy .lede { margin-top: 22px; }
.pf-toc { margin-top: 40px; border-top: 1px solid var(--rule); display: grid; grid-template-columns: 1fr 1fr; column-gap: 20px; }
.pf-toc li { border-bottom: 1px solid var(--rule); }
.pf-toc a { display: flex; align-items: baseline; gap: 10px; padding: 10px 0; font-size: 14.5px; color: var(--ink-2); text-decoration: none; }
.pf-toc a .mono { font-size: 10.5px; letter-spacing: .08em; color: var(--accent); min-width: 34px; }
.pf-toc a:hover { color: var(--accent); }

/* Fig. 1 — the platform, in section (strata diagram) */
.pf-strata { margin: 0; position: relative; }
.pf-strata-h {
  display: flex; justify-content: space-between; gap: 12px; padding: 9px 0;
  border-top: 3px double var(--rule-ink); border-bottom: 1px solid var(--rule-ink);
  font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3);
}
.pf-strata-h span:first-child { color: var(--accent); }
.pf-strata-body { position: relative; padding: 22px 64px 0 0; }
.pf-stratum {
  position: relative; display: grid; grid-template-columns: 74px minmax(0, 1fr); gap: 16px; align-items: center;
  padding: 16px 18px; background: var(--card); border: 1px solid var(--rule-strong); border-radius: var(--r);
  box-shadow: var(--shadow-sm);
}
.pf-s-k { font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); align-self: start; padding-top: 6px; }
.pf-s-main { display: grid; gap: 3px; min-width: 0; }
.pf-s-t { font: 400 25px/1.1 var(--serif); }
.pf-s-d { font-size: 13.5px; color: var(--ink-3); }
.pf-s-chips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; }
.pf-s-agents { background: linear-gradient(180deg, var(--card), var(--plat-agents-bg)); border-color: var(--agent-line); }
.pf-s-agents .pf-s-k { color: var(--agent); }
.pf-crew { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; margin-top: 12px; position: relative; }
.pf-crew::before { content: ""; position: absolute; left: 7%; right: 7%; top: 15px; border-top: 1px dashed var(--agent-line); }
.pf-crew > span { display: flex; flex-direction: column; align-items: center; gap: 6px; position: relative; }
.pf-crew .mg { box-shadow: 0 0 0 4px var(--plat-crew-halo); }
.pf-crew small { font: 500 9.5px/1 var(--mono); letter-spacing: .04em; text-transform: uppercase; color: var(--agent); }
.pf-s-gate { border-color: var(--accent-line); background: linear-gradient(180deg, var(--accent-wash), var(--plat-gate-bg)); padding-right: 120px; }
.pf-s-gate .pf-s-k { color: var(--accent); }
.pf-gate-btns { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.pf-seal-strata {
  position: absolute; right: 16px; top: 50%; width: 92px; height: 92px; margin-top: -46px;
  transform: rotate(-12deg); background: radial-gradient(circle, var(--plat-seal-bg) 60%, transparent 61%); border-radius: 50%;
}
.pf-s-out { background: var(--plat-out-bg); color: var(--night-text); border-color: var(--plat-out-line); }
.pf-s-out .pf-s-k { color: var(--night-muted); padding-top: 4px; }
.pf-s-out .pf-s-d { color: var(--night-text-2); }
.pf-conn { position: relative; height: 34px; margin-left: 110px; }
.pf-conn::before { content: ""; position: absolute; left: 0; top: 2px; bottom: 6px; border-left: 1.5px dashed var(--agent-2); }
.pf-conn::after { content: ""; position: absolute; left: -4px; bottom: 3px; width: 7px; height: 7px; border-right: 1.5px solid var(--agent-2); border-bottom: 1.5px solid var(--agent-2); transform: rotate(45deg); }
.pf-conn span { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--agent); }
.pf-conn-atty::before { border-left-color: var(--accent); border-left-style: solid; }
.pf-conn-atty::after { border-color: var(--accent); }
.pf-conn-atty span { color: var(--accent); }
/* Audit rail on the right edge, spanning every layer */
.pf-rail { position: absolute; right: 0; top: 22px; bottom: 0; width: 40px; border-left: 1px solid var(--rule-ink); display: flex; justify-content: center; }
.pf-rail::before { content: ""; position: absolute; left: -4px; top: 0; bottom: 0; width: 7px; background: radial-gradient(circle, var(--rule-ink) 2.4px, transparent 3px) 0 0 / 7px 26px repeat-y; }
.pf-rail span { writing-mode: vertical-rl; font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); padding: 18px 0; white-space: nowrap; }

/* --- § 01 Workspace mockup ------------------------------------------- */
.pf-ws { margin: var(--stack) 0 0; }
.pf-ws-body { display: grid; grid-template-columns: 200px minmax(0, 1fr) 280px; min-height: 520px; }
.pf-ws-nav { border-right: 1px solid var(--rule); padding: 16px 10px; background: var(--app-side); display: flex; flex-direction: column; gap: 1px; }
.pf-nav-i { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 7px 9px; border-radius: 6px; font-size: 13px; color: var(--ink-3); }
.pf-nav-i i { font: normal 10.5px/1 var(--mono); color: var(--muted); }
.pf-nav-i.is-on { background: var(--card); color: var(--ink); font-weight: 500; box-shadow: inset 0 0 0 1px var(--rule); }
.pf-nav-pb { font-size: 12px; line-height: 1.3; }
.pf-ws-main { padding: 18px 22px 22px; min-width: 0; }
.pf-ws-main .matter-head .pa { vertical-align: 0; margin-right: 4px; }
.pf-ws-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 18px; }
.pf-panel { border: 1px solid var(--rule); border-radius: var(--r); padding: 12px 14px; background: var(--plat-panel); min-width: 0; }
.pf-panel-h { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding-bottom: 9px; margin-bottom: 4px; border-bottom: 1px solid var(--rule-ink); font-weight: 600; font-size: 13px; }
.pf-party { display: flex; gap: 10px; align-items: center; padding: 9px 0; border-bottom: 1px dashed var(--rule); }
.pf-party:last-child { border-bottom: 0; }
.pf-party b { font-weight: 500; display: block; }
.pf-party small { color: var(--muted); font-size: 12px; }
.pf-av { width: 30px; height: 30px; border-radius: 50%; background: var(--paper-3); display: grid; place-items: center; font: 500 10px/1 var(--mono); color: var(--ink-3); flex: none; }
.pf-forms { display: grid; grid-template-columns: 1fr 1fr; column-gap: 14px; }
.pf-forms li { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 7px 0; border-bottom: 1px dashed var(--rule); }
.pf-forms b { font-weight: 500; font-size: 12.5px; }
.pf-forms .pill { font-size: 9.5px; padding: 4px 6px; }
.pf-bar { max-width: none; margin: 8px 0 6px; }
.pf-bar i { width: 87.5%; }
.pf-docs li, .pf-drafts li { display: flex; align-items: center; gap: 8px; padding: 7px 0; border-bottom: 1px dashed var(--rule); font-size: 13px; }
.pf-docs li:last-child, .pf-drafts li:last-child { border-bottom: 0; }
.pf-docs .pill { margin-left: auto; }
.pf-docs .is-miss { color: var(--ink-3); }
.pf-docs .is-miss .ico { color: var(--muted); }
.pf-drafts li > div { flex: 1; min-width: 0; }
.pf-drafts b { font-weight: 500; display: block; }
.pf-drafts small { font-size: 10.5px; color: var(--muted); }
.pf-drafts .ico { color: var(--agent); }
.pf-ws-rail { border-left: 1px solid var(--rule); padding: 18px 16px; background: var(--plat-rail); display: flex; flex-direction: column; min-width: 0; }
.pf-mini-feed li { display: grid; grid-template-columns: 22px 1fr auto; gap: 9px; align-items: start; padding: 9px 0; border-bottom: 1px solid var(--rule-soft); font-size: 12.5px; line-height: 1.4; }
.pf-mini-feed time { font-size: 10.5px; color: var(--muted); }
.pf-mini-feed b { font-weight: 600; }
.pf-rail-h2 { margin-top: 16px; }
.pf-dl li { display: grid; grid-template-columns: 52px 1fr; column-gap: 8px; padding: 9px 0; border-bottom: 1px solid var(--rule-soft); font-size: 12.5px; align-items: baseline; }
.pf-dl .mono { font-size: 10.5px; color: var(--agent); }
.pf-dl b { font-weight: 500; }
.pf-dl .countdown { grid-column: 2; margin-top: 6px; }
.pf-rail-approval { margin-top: auto; padding: 12px; border-radius: var(--r); border: 1px solid var(--accent-line); background: linear-gradient(180deg, var(--accent-wash), var(--accent-wash-2)); display: grid; gap: 4px; }
.pf-rail-approval b { font: 400 19px/1.2 var(--serif); }
.pf-rail-btns { display: flex; gap: 6px; margin-top: 6px; }
.pf-rail-btns .btn-ui { height: 28px; padding: 0 10px; font-size: 12px; }
.pf-ws-notes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin-top: 28px; border-top: 1px solid var(--rule-ink); }
.pf-ws-notes li { display: grid; grid-template-columns: 28px 1fr; gap: 8px; padding-top: 16px; font-size: 14.5px; color: var(--ink-3); }
.pf-ws-notes b { color: var(--ink); font-weight: 600; }
.pf-cap { margin-top: 18px; }

/* --- § 02 Agent dossier ---------------------------------------------- */
.pf-dossier { margin-top: var(--stack); border-top: 1px solid var(--rule-ink); }
.pf-agent { display: grid; grid-template-columns: minmax(0, 4.4fr) minmax(0, 7.6fr); gap: 32px; }
.pf-agent { padding: 26px 0; border-bottom: 1px solid var(--rule-strong); position: relative; }
.pf-agent::before { content: ""; position: absolute; left: 0; top: -1px; height: 1px; width: 0; background: var(--agent); transition: width .5s var(--ease); }
.pf-agent:hover::before { width: 100%; }
.pf-agent-h { display: grid; grid-template-columns: 40px minmax(0, 1fr); column-gap: 10px; align-content: start; }
.pf-agent-n { font-size: 12px; color: var(--muted); padding-top: 10px; }
.pf-agent-name { font-family: var(--serif); font-size: clamp(26px, 2.4vw, 34px); line-height: 1.1; display: flex; align-items: center; gap: 14px; }
.pf-agent-tag, .pf-agent-out { grid-column: 2; }
.pf-agent-tag { margin-top: 10px; color: var(--ink-2); font-size: 16px; max-width: 40ch; }
.pf-agent-out { margin-top: 14px; font-size: 12px; line-height: 1.55; color: var(--ink-3); padding: 9px 12px; border-left: 2px solid var(--agent-line); background: var(--plat-agent-out); border-radius: 0 6px 6px 0; }
.pf-agent-out .pill { margin-left: 4px; }
.pf-agent-dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; align-self: start; border-left: 1px solid var(--rule); }
.pf-agent-dl > div { padding: 4px 20px 0; border-right: 1px solid var(--rule); }
.pf-agent-dl > div:last-child { border-right: 0; }
.pf-agent-dl dt { font: 500 10.5px/1.2 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--agent); display: flex; align-items: center; gap: 7px; }
.pf-agent-dl dt::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.pf-agent-dl dd { margin: 10px 0 0; font-size: 15px; line-height: 1.55; color: var(--ink-2); }
.pf-agent-dl .pf-atty dt { color: var(--accent); }
.pf-agent-dl .pf-atty dt::before { border-radius: 2px; transform: rotate(45deg); }
.pf-agent-dl .pf-atty dd { color: var(--ink); }
.pf-agent-dl > .pf-atty { background: linear-gradient(180deg, var(--plat-atty-wash), transparent); border-radius: 0 0 0 0; padding-top: 12px; padding-bottom: 14px; margin-top: -8px; }
.pf-agent-atty { background: linear-gradient(90deg, var(--accent-tint), transparent 75%); border-bottom-color: var(--rule-ink); }
.pf-agent-atty .pf-agent-n { font: 22px/1 var(--serif); color: var(--accent); padding: 6px 0 0 6px; }
.pf-agent-atty .pf-agent-dl dt { color: var(--accent); }
.pf-agent-atty::before { background: var(--accent); }

/* --- § 03 Handoff flow ------------------------------------------------ */
.pf-flow { margin: var(--stack) 0 0; }
.pf-flow-h { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 0; border-top: 3px double var(--rule-ink); border-bottom: 1px solid var(--rule-ink); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); }
.pf-flow-track { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0; margin-top: 30px; }
.pf-node { position: relative; padding: 0 18px 0 0; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.pf-node::before { content: ""; position: absolute; left: 30px; right: 0; top: 17px; border-top: 1.5px dashed var(--agent-2); }
.pf-node:last-child::before { display: none; }
.pf-node-gate::before { border-top: 1.5px solid var(--accent); }
.pf-node-dot { position: relative; z-index: 1; padding-right: 8px; background: var(--paper); margin-bottom: 14px; }
.pf-node-dot .mg { width: 34px; height: 34px; }
.pf-node-gate .pf-node-dot .mg { box-shadow: 0 0 0 5px var(--accent-tint); }
.pf-out-mark { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--ink); color: var(--paper); }
.pf-node-k { font-size: 10.5px; letter-spacing: .08em; color: var(--muted); }
.pf-node-t { font: 400 25px/1.1 var(--serif); }
.pf-node p { font-size: 14.5px; color: var(--ink-3); line-height: 1.5; min-height: 4.5em; }
.pf-node .src-chip, .pf-node .pill { margin-top: 6px; }
.pf-node-gate .pf-node-t { color: var(--accent); }
.pf-node-gate { padding-left: 14px; margin-left: -14px; padding-top: 14px; margin-top: -14px; padding-bottom: 14px; border-radius: 12px; background: linear-gradient(180deg, var(--accent-wash), transparent); }
.pf-node-gate .pf-node-dot { background: var(--accent-wash); }
.pf-node-gate::before { left: 44px; top: 31px; }

/* --- § 04 Approval queue (dark) -------------------------------------- */
.pf-filters { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.pf-filter { font: 500 11px/1 var(--mono); padding: 6px 10px; border-radius: 99px; border: 1px solid var(--plat-filter-line); color: var(--night-text-2); }
.pf-filter.is-on { background: var(--night-text); color: var(--plat-on-night-fill); border-color: var(--night-text); }
.pf-bulk { display: grid; grid-template-columns: 22px 1fr auto; gap: 12px; align-items: center; padding: 12px; border-radius: var(--r); background: var(--plat-bulk-bg); border: 1px dashed var(--plat-bulk-line); font-size: 13.5px; margin-bottom: 8px; }
.pf-bulk b { font-weight: 500; }
.pf-check { width: 20px; height: 20px; border-radius: 5px; border: 1.5px solid var(--night-muted); display: grid; place-items: center; }
.pf-check.is-on { background: var(--accent-on-dark); border-color: var(--accent-on-dark); color: var(--plat-on-night-fill); }
.pf-check .ico { width: 12px; height: 12px; }
.pf-sendback { margin-top: 10px; padding: 14px 16px; border-radius: var(--r); background: var(--doc-bg); box-shadow: inset 0 0 0 1px var(--doc-line); color: var(--ink); }
.pf-sb-k { color: var(--accent); letter-spacing: .08em; text-transform: uppercase; }
.pf-sendback p { margin-top: 6px; font: 17px/1.5 var(--serif); padding: 8px 10px; border: 1px solid var(--rule-strong); border-radius: 7px; background: var(--card); }
.pf-sb-foot { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 10px; }
.pf-sb-foot .muted { color: var(--muted); }
.pf-sb-btns { display: flex; gap: 6px; }
.pf-sendback .btn-ui-ghost { background: transparent; color: var(--ink); border-color: var(--rule-strong); }

.pf-approvals .seal-loop { width: 108px; height: 108px; left: -54px; top: -70px; }

/* --- § 05 Source linking --------------------------------------------- */
.pf-receipt { margin: var(--stack) 0 0; display: grid; grid-template-columns: minmax(0, 6fr) auto minmax(0, 5fr); gap: clamp(14px, 2vw, 28px); align-items: center; }
.pf-rc-doc { padding: 22px 26px 24px; font: 19px/1.6 var(--serif); }
.pf-rc-doc p + p { margin-top: 12px; }
.pf-rc-doc .doc-re { margin-bottom: 12px; }
.pf-hot { background: var(--agent-tint-2); box-shadow: 0 0 0 2px var(--agent-2); }
.pf-rc-missing { font: 13.5px/1.5 var(--sans) !important; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding-top: 12px; border-top: 1px dashed var(--rule); margin-top: 16px !important; }
.pf-nosrc { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--warn-ink); background: var(--warn-tint); border: 1px solid var(--warn-line); padding: 3px 6px; border-radius: 4px; }
.pf-unsrc { background: var(--warn-tint); border-bottom: 1.5px dashed var(--warn); padding: 0 3px; color: var(--ink-2); font: 16px/1.4 var(--serif); }
.pf-rc-link { display: flex; flex-direction: column; align-items: center; gap: 6px; color: var(--agent); }
.pf-rc-link svg { width: 72px; height: 16px; }
.pf-rc-src { transform: rotate(1.2deg); }
.pf-page { overflow: hidden; margin: 18px; padding: 22px 22px 26px; background: var(--paper-obj); color: var(--ink); border: 1px solid var(--rule); box-shadow: var(--plat-page-shadow); }
.pf-page-h { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding-bottom: 10px; border-bottom: 2px solid var(--rule-ink); font: 400 18px/1.2 var(--serif); }
.pf-page-h .mono { font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--accent); align-self: center; }
.pf-page-lines { display: grid; gap: 7px; margin: 12px 0; }
.pf-page-lines i { display: block; height: 5px; border-radius: 2px; background: var(--paper-obj-line); }
.pf-page-lines .w70 { width: 70%; } .pf-page-lines .w55 { width: 55%; } .pf-page-lines .w80 { width: 80%; }
.pf-page-row { display: grid; grid-template-columns: 96px 1fr auto; gap: 10px; align-items: baseline; padding: 8px 6px; border-bottom: 1px dotted var(--rule-strong); font-size: 13px; }
.pf-page-row .mono { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.pf-page-row b { font: 500 12.5px/1.3 var(--mono); }
.pf-page-hl { background: var(--plat-src-hl); outline: 2px solid var(--agent-2); outline-offset: -1px; border-radius: 3px; }
.pf-page-row .pf-hl-tag { color: var(--on-agent); letter-spacing: .06em; }
.pf-hl-tag { font-style: normal; font-size: 9.5px; background: var(--agent-fill); color: var(--on-agent); padding: 3px 6px; border-radius: 3px; }
.pf-page-sig { display: flex; gap: 24px; margin-top: 20px; }
.pf-page-sig span { flex: 1; height: 26px; border-bottom: 1px solid var(--ink-3); position: relative; }
.pf-page-sig span::after { content: ""; position: absolute; left: 10%; bottom: 4px; width: 60%; height: 14px; border-bottom: 1.5px solid var(--ink-3); border-radius: 0 0 60% 40%; transform: skewX(-20deg); opacity: .7; }
.pf-src-kinds { margin-top: 48px; border-top: 1px solid var(--rule-ink); }
.pf-kind { padding-top: 22px; }
.pf-kind .h4 { margin-top: 14px; }
.pf-kind p { margin-top: 8px; color: var(--ink-3); font-size: 15.5px; max-width: 36ch; }

/* --- § 06 Playbooks --------------------------------------------------- */
.pf-split { margin-top: var(--stack); }
.pf-flush { margin-top: 0; }
.pf-list { margin-top: 28px; border-top: 1px solid var(--rule-strong); }
.pf-list li { display: grid; grid-template-columns: 104px 1fr; gap: 16px; padding: 15px 0; border-bottom: 1px solid var(--rule-strong); font-size: 16px; color: var(--ink-2); }
.pf-list-k { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); padding-top: 4px; }
.pf-rules { margin-top: 6px; }
.pf-rules li { display: grid; grid-template-columns: 44px 1fr auto; gap: 12px; align-items: baseline; padding: 11px 4px; border-bottom: 1px solid var(--rule-soft); font-size: 13.5px; }
.pf-rules li > .mono { font-size: 10.5px; color: var(--muted); }
.pf-rules b { font-weight: 500; }
.pf-rules .chip { color: var(--agent); background: var(--agent-tint); border-color: var(--agent-line); }
.pf-rule-new { background: linear-gradient(90deg, var(--accent-tint), transparent); border-radius: 6px; }
.pf-rule-new > .mono { color: var(--accent) !important; }
.pf-pb-check { margin-top: 16px; padding: 12px 14px; border: 1px solid var(--rule); border-radius: var(--r); background: var(--plat-panel); }
.pf-pb-check ul { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 16px; margin-top: 10px; }
.pf-pb-check li { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.pf-pb-check .is-open { color: var(--warn-ink); font-weight: 500; }
.pf-box { width: 13px; height: 13px; border: 1.5px solid var(--warn); border-radius: 3px; flex: none; }

/* --- § 07 Audit log --------------------------------------------------- */
.pf-log { margin-top: var(--stack); }
.pf-log .pad { padding: 20px 22px 14px; }
.pf-log-ph { flex-wrap: wrap; }
.pf-log-act { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.pf-log-t td { vertical-align: middle; }
.pf-log-t td:first-child { color: var(--muted); font-size: 12px; white-space: nowrap; }
.pf-log-t td:nth-child(3) { color: var(--agent); font-size: 12px; }
.pf-actor { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.pf-actor .mg-gate .ico { width: 10px; height: 10px; }
.pf-row-atty td:nth-child(3) { color: var(--accent); font-weight: 500; }
.pf-row-atty td { background: var(--plat-row-atty); }
.pf-row-final td { background: var(--accent-tint); border-bottom-color: var(--accent-line); }
.pf-row-final td:last-child { color: var(--accent); }
.pf-audit-facts { margin-top: 40px; border-top: 1px solid var(--rule-ink); }
.pf-audit-facts > div { padding-top: 18px; }
.pf-audit-facts p { margin-top: 10px; font: 400 22px/1.25 var(--serif); color: var(--ink); max-width: 18ch; }

/* --- § 08 Integrations ------------------------------------------------ */
.pf-int { margin-top: var(--stack); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--rule-ink); }
.pf-int-i { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 14px; align-items: start; padding: 22px 22px 22px 0; border-bottom: 1px solid var(--rule-strong); }
.pf-int-i:nth-child(even) { padding-left: 22px; padding-right: 0; border-left: 1px solid var(--rule-strong); }
.pf-int-i .ico-lg { margin-top: 4px; }
.pf-int-i p { margin-top: 6px; font-size: 15px; color: var(--ink-3); }


/* ==========================================================================
   PRACTICE AREAS (/practice-areas)
   ========================================================================== */

/* --- Hero: contents index -------------------------------------------- */
.pr-hero-grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: clamp(32px, 5vw, 96px); align-items: start; }
.pr-hero-grid .h1 { max-width: 13ch; }
.pr-index { position: relative; background: var(--card); border: 1px solid var(--rule-strong); border-radius: 4px; padding: 26px 28px 20px; box-shadow: var(--shadow); }
.pr-index::before { content: ""; position: absolute; inset: 6px; border: 1px solid var(--rule); border-radius: 2px; pointer-events: none; }
.pr-index-h { display: flex; justify-content: space-between; gap: 12px; font: 500 10.5px/1.2 var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); border-top: 3px double var(--rule-ink); border-bottom: 1px solid var(--rule-ink); padding: 8px 0; }
.pr-index-h span:first-child { color: var(--accent); }
.pr-index-grp { margin-top: 16px; font: 500 10px/1.2 var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.pr-index ol { margin-top: 4px; }
.pr-index a { position: relative; z-index: 1; display: grid; grid-template-columns: 40px auto minmax(12px, 1fr) auto; align-items: baseline; gap: 10px; padding: 9px 0; text-decoration: none; border-bottom: 1px solid var(--rule); }
.pr-index a:hover .pr-ix-t { color: var(--accent); }
.pr-ix-n { font: 18px/1 var(--serif); color: var(--accent); }
.pr-ix-t { font: 400 clamp(22px, 2vw, 27px)/1.15 var(--serif); display: inline-flex; align-items: center; gap: 10px; transition: color .2s; }
.pr-ix-t .pa { transform: translateY(-3px); }
.pr-ix-dots { border-bottom: 1.5px dotted var(--rule-strong); transform: translateY(-5px); }
.pr-ix-d { font: 500 10.5px/1 var(--mono); letter-spacing: .06em; color: var(--ink-3); white-space: nowrap; display: inline-flex; align-items: center; gap: 6px; }
.pr-ix-d .ico { color: var(--accent); transition: transform .25s var(--ease); }
.pr-index a:hover .pr-ix-d .ico { transform: translateX(3px); }
.pr-index-note { position: relative; margin-top: 14px; font: 15px/1.4 var(--serif); color: var(--muted); }

/* --- § 01 Deep practice cards ---------------------------------------- */
.pr-deep { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 2vw, 24px); margin-top: var(--stack); }
.pr-card { display: flex; flex-direction: column; background: var(--card); border: 1px solid var(--rule-strong); border-radius: var(--r-lg); overflow: hidden; transition: border-color .25s, transform .25s var(--ease), box-shadow .25s; }
.pr-card:hover { border-color: var(--rule-ink); transform: translateY(-3px); box-shadow: var(--shadow); }
.pr-card-band { height: 4px; background: var(--pa-imm); }
.pr-card-fam .pr-card-band { background: var(--pa-fam); }
.pr-card-crim .pr-card-band { background: var(--pa-crim); }
.pr-vis { margin: 18px 18px 0; padding: 14px; height: 236px; border: 1px solid var(--rule); border-radius: var(--r); background: var(--paper); position: relative; overflow: hidden; font-size: 12.5px; }
.pr-vis-h { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 10px; }
.pr-vis-h .app-sample { font-size: 9px; padding: 3px 5px; }
.pr-card-body { padding: 22px 24px 26px; display: flex; flex-direction: column; flex: 1; }
.pr-card-k { font: 500 11px/1.2 var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--accent); display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.pr-card .h3 { margin-top: 12px; font-size: clamp(28px, 2.5vw, 36px); }
.pr-card-body > p { margin-top: 12px; color: var(--ink-2); font-size: 15.5px; }
.pr-card .flow { margin-top: 18px; }
.pr-card .flow li { font-size: 14px; padding: 9px 0; }
.pr-card .form-chips { margin-top: 16px; }
.pr-card .form-chips li { font-size: 10.5px; padding: 6px 7px; }
.pr-card .link-arrow { margin-top: auto; padding-top: 26px; align-self: flex-start; border-bottom: 0; }
.pr-card .link-arrow span { border-bottom: 1px solid var(--accent); padding-bottom: 3px; }
/* mini visuals inside cards */
.pr-forms { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.pr-forms-foot { display: flex; justify-content: space-between; gap: 8px; margin-top: 14px; padding-top: 10px; border-top: 1px dashed var(--rule-strong); color: var(--ink-3); }
.pr-form { border: 1px solid var(--rule); border-radius: 6px; background: var(--card); padding: 8px; display: grid; gap: 6px; }
.pr-form b { font: 500 11.5px/1 var(--mono); }
.pr-form i { display: block; height: 3px; border-radius: 2px; background: var(--paper-3); }
.pr-form i:nth-of-type(2) { width: 70%; }
.pr-form .pill { justify-self: start; font-size: 9px; padding: 3px 5px; }
.pr-form.is-flag { border-color: var(--warn-line); background: var(--plat-flag-bg); }
.pr-sched li { display: grid; grid-template-columns: 1fr auto; gap: 8px; padding: 7px 2px; border-bottom: 1px solid var(--rule-soft); }
.pr-sched .mono { font-size: 11.5px; }
.pr-sched .is-flag { background: var(--warn-tint); border-radius: 5px; padding-left: 6px; padding-right: 6px; color: var(--warn-ink); }
.pr-vis .wave { height: 40px; }
.pr-vis .transcript li { grid-template-columns: 62px 1fr; font-size: 12px; padding: 7px 6px; }
.pr-vis .transcript .spk { display: none; }

/* --- § 02 Also on the platform (workflow cards) ---------------------- */
.pr-wfs { margin-top: var(--stack); border-top: 1px solid var(--rule-ink); }
.pr-wf { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 4.5vw, 80px); align-items: start; padding: clamp(40px, 5vw, 72px) 0; border-bottom: 1px solid var(--rule-strong); }
.pr-wf:last-child { border-bottom: 0; padding-bottom: 0; }
.pr-wf-flip > .pr-wf-copy { order: 2; }
.pr-wf-k { display: flex; align-items: center; gap: 10px; font: 500 11px/1.2 var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--accent); }
.pr-wf-copy .h3 { margin-top: 12px; }
.pr-wf-copy > p { margin-top: 14px; color: var(--ink-2); }
.pr-wf-copy .flow { margin-top: 20px; }
.pr-watch { display: flex; gap: 10px; align-items: flex-start; margin-top: 18px; padding: 12px 14px; border-radius: var(--r); background: var(--agent-tint); border: 1px solid var(--agent-line); font-size: 14px; color: var(--ink-2); }
.pr-watch .mg { margin-top: 1px; }
.pr-watch b { font-weight: 600; color: var(--agent); }
.pr-wf .app .pad { padding: 18px 20px 20px; }
.pr-status { display: grid; gap: 0; }
.pr-status li { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 10px 2px; border-bottom: 1px solid var(--rule-soft); }
.pr-status li .ico { color: var(--agent); }
.pr-status b { font-weight: 500; }
.pr-status small { display: block; font: 10.5px/1.4 var(--mono); color: var(--muted); }
.pr-two { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 14px; }
.pr-box { border: 1px solid var(--rule); border-radius: var(--r); padding: 10px 12px; background: var(--plat-panel); }
.pr-box-h { font: 500 10px/1.2 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin-bottom: 6px; }
.pr-box li { display: flex; align-items: center; gap: 8px; padding: 4px 0; font-size: 12.5px; }
.pr-box .pf-box { width: 12px; height: 12px; border-color: var(--rule-strong); }
.pr-total { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 12px; padding: 10px 12px; border-top: 1px solid var(--rule-ink); font-size: 13px; }
.pr-total b { font: 400 22px/1 var(--serif); }
.pr-sol { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 12px; padding: 10px 12px; border-radius: 8px; background: var(--accent-tint); border: 1px solid var(--accent-line); font-size: 13px; }
.pr-sol .mono { color: var(--accent); }
/* Employment timeline */
.pr-etl { position: relative; margin: 6px 0 0 8px; padding-left: 22px; border-left: 1.5px solid var(--rule-ink); }
.pr-etl li { position: relative; display: grid; grid-template-columns: 92px minmax(0, 1fr) auto; gap: 10px; align-items: baseline; padding: 8px 0; font-size: 13px; border-bottom: 1px dashed var(--rule); }
.pr-etl li::before { content: ""; position: absolute; left: -28.5px; top: 13px; width: 10px; height: 10px; border-radius: 50%; background: var(--card); border: 1.5px solid var(--agent); }
.pr-etl li.is-key::before { background: var(--accent); border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-tint); }
.pr-etl time { font: 500 11px/1 var(--mono); color: var(--muted); }
.pr-window { margin-top: 14px; padding: 12px 14px; border: 1px solid var(--rule); border-radius: var(--r); background: var(--plat-panel); }
.pr-window-h { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: 13px; }
.pr-window-h b { font-weight: 600; }
.pr-window .countdown { max-width: none; height: 5px; }
.pr-window-n { display: flex; justify-content: space-between; margin-top: 6px; font: 10.5px/1 var(--mono); color: var(--muted); }

/* --- § 03 Multi-practice --------------------------------------------- */
.pr-multi { margin-top: var(--stack); }
.pr-client { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; }
.pr-matter { border: 1px solid var(--rule); border-radius: var(--r); padding: 14px; background: var(--plat-panel); position: relative; }
.pr-matter::before { content: ""; position: absolute; left: -1px; top: 12px; bottom: 12px; width: 3px; border-radius: 3px; background: var(--pa-imm); }
.pr-matter-fam::before { background: var(--pa-fam); }
.pr-matter-h { font: 400 20px/1.2 var(--serif); margin-top: 4px; }
.pr-matter ul { margin-top: 10px; }
.pr-matter li { display: flex; justify-content: space-between; gap: 8px; padding: 6px 0; border-top: 1px dashed var(--rule); font-size: 12.5px; }
.pr-matter li .pill { font-size: 9.5px; }
.pr-shared { margin-top: 14px; border: 1px solid var(--agent-line); border-radius: var(--r); background: linear-gradient(180deg, var(--plat-shared-top), var(--card)); padding: 12px 14px; }
.pr-shared-h { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; font: 500 10.5px/1.2 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--agent); }
.pr-shared li { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--rule-soft); font-size: 13px; }
.pr-shared li:last-child { border-bottom: 0; }
.pr-shared .ico { color: var(--agent); }
.pr-uses { display: inline-flex; gap: 4px; }
.pr-uses .pa { width: 10px; height: 10px; }
.pr-wall { display: flex; gap: 10px; align-items: center; margin-top: 12px; font-size: 12.5px; color: var(--ink-3); }
.pr-wall .ico { color: var(--accent); }
.pr-points { margin-top: 26px; border-top: 1px solid var(--rule-strong); }
.pr-points li { display: grid; grid-template-columns: 40px 1fr; gap: 12px; padding: 16px 0; border-bottom: 1px solid var(--rule-strong); }
.pr-points .pr-pn { font: 26px/1 var(--serif); color: var(--accent); }
.pr-points b { display: block; font: 400 24px/1.15 var(--serif); }
.pr-points p { margin-top: 4px; font-size: 15px; color: var(--ink-3); }

/* --- § 04 Dark: one rule across practices ---------------------------- */
.pr-gates { margin-top: var(--stack); border-top: 1px solid var(--night-rule); }
.pr-gate { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 4fr) minmax(0, 1fr) minmax(0, 3fr); gap: 20px; align-items: center; padding: 16px 0; border-bottom: 1px solid var(--night-rule); }
.pr-gate-p { font: 400 clamp(22px, 2.1vw, 30px)/1.1 var(--serif); color: var(--night-text); display: flex; align-items: center; gap: 12px; }
.pr-gate-w { font-size: 14.5px; color: var(--night-text-2); }
.pr-gate-chain { display: flex; align-items: center; gap: 4px; position: relative; }
.pr-gate-chain::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; border-top: 1px dashed var(--plat-chain-line); }
.pr-gate-chain .mg { position: relative; background: var(--agent-on-dark); color: var(--plat-on-night-fill); width: 24px; height: 24px; font-size: 8.5px; box-shadow: 0 0 0 3px var(--band); }
.pr-gate-end { display: flex; align-items: center; gap: 12px; color: var(--accent-on-dark); font: 500 12px/1.2 var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.pr-gate-end .mg { background: var(--accent-on-dark); color: var(--plat-on-night-fill); box-shadow: 0 0 0 4px var(--plat-gate-halo); }
.pr-gate-end .mg .ico { width: 12px; height: 12px; }
.pr-dark-foot { display: flex; justify-content: space-between; align-items: center; gap: 32px; margin-top: 36px; }
.pr-dark-foot .footnote { max-width: 60ch; }
.pr-seal-dark { width: 120px; height: 120px; flex: none; color: var(--accent-on-dark); transform: rotate(-12deg); }

/* --- § 05 Deadlines by practice (ledger tweaks) ---------------------- */
.pr-dl .ledger-name { font-size: clamp(22px, 2vw, 28px); }
.pr-dl .ledger-name .pa { width: 10px; height: 10px; transform: translateY(-3px); }
.pr-dl .ledger-out { border-left-color: var(--agent-line); }


/* ==========================================================================
   Motion (progressive enhancement; content visible without it)
   ========================================================================== */
@media (prefers-reduced-motion: no-preference) {
  .js .pf-stratum, .js .pf-conn { animation: rise .7s var(--ease) both; }
  .js .pf-strata-body > :nth-child(1) { animation-delay: .1s; }
  .js .pf-strata-body > :nth-child(2) { animation-delay: .25s; }
  .js .pf-strata-body > :nth-child(3) { animation-delay: .35s; }
  .js .pf-strata-body > :nth-child(4) { animation-delay: .5s; }
  .js .pf-strata-body > :nth-child(5) { animation-delay: .6s; }
  .js .pf-strata-body > :nth-child(6) { animation-delay: .75s; }
  .js .pf-strata-body > :nth-child(7) { animation-delay: .85s; }
  .js .pf-seal-strata { animation: pf-stamp .7s cubic-bezier(.3,1.6,.5,1) 1.1s both; }
  .pf-crew .mg { transition: transform .3s var(--ease); }
  .pf-crew > span:hover .mg { transform: translateY(-3px); }
}
@keyframes pf-stamp { from { opacity: 0; transform: rotate(-36deg) scale(1.6); } to { transform: rotate(-12deg); } }


/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1180px) {
  .pf-hero-grid { grid-template-columns: minmax(0, 1fr); }
  .pf-hero-copy { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 48px; }
  .pf-hero-copy > :not(.pf-toc) { grid-column: 1; }
  .pf-hero-copy .pf-toc { grid-column: 2; grid-row: 1 / span 3; margin-top: 22px; grid-template-columns: 1fr; }
  .pf-strata { max-width: 760px; }
  .pf-ws-body { grid-template-columns: 180px minmax(0, 1fr); }
  .pf-ws-rail { grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--rule); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 20px; }
  .pf-ws-rail > .pf-panel-h:first-child { grid-column: 1; grid-row: 1; }
  .pf-mini-feed { grid-column: 1; grid-row: 2; }
  .pf-rail-h2 { grid-column: 2; grid-row: 1; margin-top: 0; }
  .pf-dl { grid-column: 2; grid-row: 2; }
  .pf-rail-approval { grid-column: 3; grid-row: 1 / span 2; margin-top: 0; align-self: start; }
  .pf-flow-track { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 40px; }
  .pf-node:nth-child(3)::before { display: none; }
  .pr-deep { grid-template-columns: minmax(0, 1fr); }
  .pr-card { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
  .pr-card-band { grid-column: 1 / -1; }
  .pr-vis { margin: 22px 0 22px 22px; height: auto; min-height: 220px; }
  .pr-gate { grid-template-columns: minmax(0, 3fr) minmax(0, 4fr) minmax(0, 3fr); }
  .pr-gate-chain { display: none; }
}

@media (max-width: 980px) {
  .pf-receipt { grid-template-columns: minmax(0, 1fr); max-width: 680px; }
  .pf-rc-link { flex-direction: row; justify-content: center; }
  .pf-rc-link svg { transform: rotate(90deg); width: 40px; }
  .pf-rc-src { transform: none; }
  .pf-agent { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .pf-agent-dl { border-left: 0; margin-left: 50px; }
  .pf-agent-dl > div:first-child { padding-left: 0; }
  .pf-ws-notes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pf-audit-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 20px; }
  .pr-hero-grid { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .pr-index { max-width: 640px; margin-top: 8px; }
  .pr-wf, .pr-wf-flip { grid-template-columns: minmax(0, 1fr); }
  .pr-wf-flip > .pr-wf-copy { order: 0; }
  .pr-wf .app { max-width: 720px; }
  .pr-multi.split { grid-template-columns: minmax(0, 1fr); }
  .pr-dark-foot { flex-direction: column; align-items: flex-start; gap: 20px; }
}

@media (max-width: 720px) {
  .pf-h1 { font-size: clamp(2.6rem, 12vw, 4.2rem); }
  .pf-hero-copy { display: block; }
  .pf-hero-copy .pf-toc { margin-top: 32px; }
  .pf-strata-body { padding-right: 34px; }
  .pf-rail { width: 22px; }
  .pf-rail span { font-size: 9px; letter-spacing: .1em; }
  .pf-stratum { grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 14px; }
  .pf-s-k { padding-top: 0; }
  .pf-s-t { font-size: 22px; }
  .pf-crew { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 2px; }
  .pf-crew::before { top: 12px; }
  .pf-crew .mg { width: 24px; height: 24px; font-size: 8px; box-shadow: 0 0 0 3px var(--plat-crew-halo); }
  .pf-crew small { display: none; }
  .pf-s-gate { padding-right: 14px; }
  .pf-seal-strata { width: 64px; height: 64px; top: 10px; right: 10px; margin-top: 0; }
  .pf-conn { margin-left: 24px; }

  .pf-ws-body { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .pf-ws-nav { display: none; }
  .pf-ws-main { padding: 14px; }
  .pf-ws-main .matter-head .pill { display: none; }
  .pf-ws-grid { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .pf-ws-rail { display: flex; padding: 14px; }
  .pf-rail-h2 { margin-top: 16px; }
  .pf-rail-approval { margin-top: 14px; }
  .pf-ws-notes { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .pf-ws-notes li { padding: 12px 0; border-bottom: 1px solid var(--rule); }

  .pf-agent-dl { grid-template-columns: minmax(0, 1fr); margin-left: 0; border-top: 1px solid var(--rule); }
  .pf-agent-dl > div { padding: 12px 0; border-right: 0; border-bottom: 1px dashed var(--rule); display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 10px; align-items: baseline; }
  .pf-agent-dl > div:last-child { border-bottom: 0; }
  .pf-agent-dl dd { margin: 0; font-size: 14.5px; }
  .pf-agent-h { grid-template-columns: 30px minmax(0, 1fr); }
  .pf-agent-name { font-size: 26px; gap: 10px; }
  .pf-agent-name .mg { width: 26px; height: 26px; font-size: 9px; }

  .pf-flow-track { grid-template-columns: minmax(0, 1fr); row-gap: 0; margin-top: 20px; }
  .pf-node { display: grid; grid-template-columns: 46px minmax(0, 1fr); column-gap: 12px; row-gap: 4px; padding: 0 0 26px; }
  .pf-node > :not(.pf-node-dot) { grid-column: 2; }
  .pf-node-dot { grid-row: 1 / span 5; margin: 0; padding: 0; background: none; }
  .pf-node::before, .pf-node:nth-child(3)::before { display: block; left: 17px; right: auto; top: 40px; bottom: 0; border-top: 0; border-left: 1.5px dashed var(--agent-2); }
  .pf-node-gate::before { border-left: 1.5px solid var(--accent); left: 31px; top: 54px; }
  .pf-node:last-child::before { display: none; }
  .pf-node p { min-height: 0; }
  .pf-node-gate { margin-left: -14px; padding-left: 14px; }
  .pf-flow-h { flex-wrap: wrap; }

  .pf-bulk { grid-template-columns: 22px minmax(0, 1fr); }
  .pf-bulk .btn-ui { grid-column: 2; justify-self: start; }
  .pf-rc-doc { padding: 18px; font-size: 17px; }
  .pf-page { margin: 12px; padding: 16px; }
  .pf-page-row { grid-template-columns: minmax(0, 1fr) auto; }
  .pf-page-row .mono { grid-column: 1 / -1; }
  .pf-src-kinds { margin-top: 32px; }
  .pf-list li { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .pf-rules li { grid-template-columns: 40px minmax(0, 1fr); }
  .pf-rules .chip { grid-column: 2; justify-self: start; }
  .pf-pb-check ul { grid-template-columns: minmax(0, 1fr); }
  .pf-log .pad { padding: 14px; }
  .pf-log-t th:nth-child(5), .pf-log-t td:nth-child(5) { display: none; }
  .pf-log-t .pf-actor { white-space: normal; }
  .pf-actor-n { display: none; }
  .pf-page-row .pf-hl-tag { justify-self: start; }
  .pf-approvals .seal-loop { display: none; }
  .pf-s-gate .pf-s-d { padding-right: 72px; }
  .pf-hero-copy .pf-toc { grid-template-columns: 1fr 1fr; column-gap: 14px; }
  .pf-toc a { font-size: 13.5px; gap: 6px; }
  .pf-toc a .mono { min-width: 30px; }
  .pf-audit-facts p { font-size: 20px; }
  .pf-int { grid-template-columns: minmax(0, 1fr); }
  .pf-int-i, .pf-int-i:nth-child(even) { padding: 18px 0; border-left: 0; grid-template-columns: 24px minmax(0, 1fr); }
  .pf-int-i .pill { grid-column: 2; justify-self: start; }

  .pr-index { padding: 20px 18px 16px; }
  .pr-index a { grid-template-columns: 34px minmax(0, 1fr) auto; }
  .pr-ix-dots { display: none; }
  .pr-ix-t { font-size: 22px; }
  .pr-card { display: flex; }
  .pr-vis { margin: 16px 16px 0; min-height: 0; }
  .pr-card-body { padding: 20px 18px 22px; }
  .pr-forms { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pr-forms-foot { display: none; }
  .pr-two, .pr-client { grid-template-columns: minmax(0, 1fr); }
  .pr-chrono th:nth-child(2), .pr-chrono td:nth-child(2) { display: none; }
  .pr-wf .app .pad { padding: 14px; }
  .pr-etl li { grid-template-columns: minmax(0, 1fr) auto; }
  .pr-etl time { grid-column: 1 / -1; }
  .pr-status li { grid-template-columns: 20px minmax(0, 1fr); }
  .pr-status .pill { grid-column: 2; justify-self: start; }
  .pr-gate { grid-template-columns: minmax(0, 1fr); gap: 8px; padding: 18px 0; }
  .pr-seal-dark { width: 88px; height: 88px; }
}

@media (max-width: 400px) {
  .pf-forms { grid-template-columns: minmax(0, 1fr); }
  .pf-filters .pf-filter:nth-child(n+4) { display: none; }
}