/* Shared paper-doc styles for the RiverSync PRD set (master + per-app). */
:root{
  --ink:#1C2126; --ink-2:#4A545E; --ink-3:#66737F;
  --hairline:#E4E9EE; --hairline-strong:#D2DAE1;
  --accent:#3679AC; --accent-soft:#E8F1F8;
}
*{box-sizing:border-box;}
html,body{margin:0; padding:0;}
body{background:#EFF2F5; font-family:var(--rs-font-sans, Roboto, sans-serif); color:var(--ink);
  font-size:14px; line-height:1.55; padding:48px 16px; -webkit-font-smoothing:antialiased;}
/* A4 — 210mm x 297mm @ 96dpi = 794 x 1123px. Each .page is one sheet. */
.page{width:794px; max-width:100%; min-height:1123px; margin:0 auto 32px; background:#fff; border-radius:3px;
  box-shadow:0 2px 12px rgba(0,0,0,.08); padding:72px;}

.doc-head{display:flex; align-items:flex-start; justify-content:space-between; gap:24px; margin-bottom:24px;}
.doc-head img{height:22px; display:block;}
.doc-meta{text-align:right; font-size:11px; color:var(--ink-3); line-height:1.6;}
.doc-meta b{color:var(--ink); font-weight:600;}
.mono{font-family:var(--rs-font-mono, ui-monospace, monospace); font-size:11px; letter-spacing:.03em;}
.doc-meta .mono{font-size:10.5px;}

.docnav{display:flex; gap:6px; flex-wrap:wrap; margin:0 0 28px;}
.docnav a{font-size:10.5px; font-weight:600; letter-spacing:.04em; text-decoration:none;
  padding:3px 10px; border-radius:999px; border:1px solid var(--hairline-strong); color:var(--ink-2); white-space:nowrap;}
.docnav a:hover{border-color:var(--accent); color:var(--accent);}
.docnav a.is-current{background:var(--ink); border-color:var(--ink); color:#fff; pointer-events:none;}

/* tree doc-nav — rendered by docs-nav.js from the central registry */
.docnav--tree{flex-direction:column; flex-wrap:nowrap; gap:0; border:1px solid var(--hairline); border-radius:3px; overflow:hidden;}
.docnav__row{display:flex; align-items:center; gap:6px; flex-wrap:wrap; padding:7px 10px;}
.docnav__row--fam{background:#F6F8FA; border-bottom:1px solid var(--hairline); padding-top:0; padding-bottom:0;}
.docnav__row--fam a{border:0; padding:3px 8px; border-radius:2px;}
.docnav__home{color:var(--ink) !important; font-weight:700 !important; text-transform:uppercase; font-size:10px !important; letter-spacing:.07em !important;}
.docnav__home::before{content:"← "; color:var(--ink-3);}
.docnav__fam{text-transform:uppercase; font-size:10px !important; letter-spacing:.07em !important; color:var(--ink-3) !important;}
a.docnav__fam:hover{color:var(--accent) !important;}
.docnav a.docnav__fam.is-current{background:none; border:0; color:var(--ink) !important; pointer-events:none;
  box-shadow:inset 0 -2px 0 var(--accent); border-radius:0; padding-bottom:5px;}
.docnav__cnt{font-family:var(--rs-font-mono, ui-monospace, monospace); font-size:9px; font-weight:600; color:var(--ink-3);
  background:#fff; border:1px solid var(--hairline-strong); border-radius:2px; padding:0 5px; margin-left:3px; vertical-align:1px;}
.docnav__fam.is-current .docnav__cnt{border-color:var(--hairline-strong);}
.docnav__row--docs{padding:0; gap:0;}
.docnav__row--docs > a{border:0; border-radius:0; padding:8px 13px;}
.docnav__row--docs > a:hover{background:var(--accent-soft);}
.docnav__row--docs > a.is-current{background:var(--ink); color:#fff !important; border-color:var(--hairline);}
/* groups — a sub-hierarchy inside the documents row */
.docnav__grpchip{display:inline-flex; align-items:center; background:#F1F4F7;
  box-shadow:inset 0 0 0 1px var(--hairline-strong); border-radius:0;}
.docnav__grpchip:hover{box-shadow:inset 0 0 0 1px var(--accent);}
.docnav__grpic{width:11px; height:11px; margin-right:6px; flex:none; background:currentColor;
  opacity:.7; -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 5h6l2 2h10a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 5h6l2 2h10a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1z'/%3E%3C/svg%3E") center/contain no-repeat;}
.docnav__grp{display:inline-flex; align-items:stretch; background:var(--accent-soft);
  box-shadow:inset 0 0 0 1px var(--accent); border-radius:0;}
.docnav__grp a{border-radius:0;}
.docnav__grplabel{display:inline-flex; align-items:center; color:var(--accent) !important;
  font-weight:700 !important; text-transform:uppercase; font-size:10px !important; letter-spacing:.06em !important;
  padding:8px 12px !important;}
.docnav__grplabel.is-current{background:var(--ink); color:#fff !important;}
.docnav__grpdoc{position:relative; padding:8px 13px; font-size:10.5px;}
.docnav__grpdoc::before{content:""; position:absolute; left:0; top:7px; bottom:7px; width:1px; background:#C9DDEE;}
.docnav__grpdoc:hover{background:#DCEAF6;}
.docnav__grpdoc.is-current{background:var(--ink); color:#fff !important;}
.docnav__grpdoc.is-current::before{display:none;}

/* row 3 — cross-system links for the current document (its own bar) */
.docnav__row--x{padding:0; gap:0; border-top:1px solid var(--hairline); background:#FBFCFD;}
.docnav__xlabel{font-size:9px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink-3); padding:0 12px 0 13px; align-self:center;}
.docnav__xlink{color:var(--accent) !important; border:0 !important; border-left:1px solid var(--hairline) !important;
  border-radius:0 !important; padding:7px 13px; display:flex; align-items:center; font-size:10.5px;}
.docnav__xlink:hover{background:var(--accent-soft);}
.docnav__xdoc{font-weight:700; letter-spacing:0; margin-left:4px;}

h1{font-size:26px; font-weight:600; letter-spacing:-.01em; line-height:1.25; margin:0 0 10px;}
.lead{font-size:14.5px; color:var(--ink-2); margin:0 0 8px; text-wrap:pretty;}
.status-row{display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin:16px 0 0;}
/* Canonical DS v2 Badge (components/core/badge/badge.card.html): 2px radius,
   soft tint + tinted text, sentence case — NOT a pill, NOT uppercase. Mirrors
   .rs-badge (tokens/app-ui.css). Centralized here = every doc family inherits. */
.status-chip{display:inline-flex; align-items:center; gap:5px; height:20px; padding:0 8px;
  border-radius:2px; font-size:11.5px; font-weight:600; line-height:1; white-space:nowrap;
  background:#EBEFF3; color:var(--ink-2); border:1px solid transparent;}
.status-chip--draft{color:#9C7A1E; background:#FAF1D8; border-color:#E8D295;}
.status-chip--stub{color:#66737F; background:#F1F4F7; border-color:transparent;}
.status-chip--ok{color:#3F8A45; background:#E7F2E8; border-color:#C4E0C7;}

.inherit{display:flex; gap:10px; align-items:flex-start; margin:18px 0 0; padding:12px 14px;
  background:var(--accent-soft); border:1px solid #C9DDEE; border-radius:3px; font-size:12.5px; color:var(--ink-2); text-wrap:pretty;}
.inherit b{color:var(--ink);}

h2{font-size:15px; font-weight:600; margin:34px 0 6px; padding-top:14px; border-top:1px solid var(--hairline);
  display:flex; align-items:baseline; gap:10px;}
h2 .sn{font-family:var(--rs-font-mono, ui-monospace, monospace); font-size:11px; font-weight:600; color:var(--accent);}
h2 + p{margin-top:2px;}
p{margin:8px 0; text-wrap:pretty;}
.note{font-size:12.5px; color:var(--ink-3);}
a{color:var(--accent);}

.req{display:flex; gap:14px; align-items:flex-start; padding:9px 0; border-bottom:1px solid var(--hairline); break-inside:avoid;}
.req:last-of-type{border-bottom:0;}
.req__id{flex:none; white-space:nowrap; font-family:var(--rs-font-mono, ui-monospace, monospace); font-size:10.5px; font-weight:600;
  letter-spacing:.04em; color:var(--accent); background:var(--accent-soft); border:1px solid #C9DDEE;
  border-radius:2px; padding:2px 7px; margin-top:1px;}
.req p{margin:0; font-size:13.5px;}
.req b{font-weight:600;}

table{width:100%; border-collapse:collapse; font-size:12.5px; margin:12px 0 4px;}
th{text-align:left; font-size:10px; font-weight:700; letter-spacing:.07em; text-transform:uppercase;
  color:var(--ink-3); padding:6px 12px 6px 0; border-bottom:1px solid var(--hairline-strong);}
td{padding:8px 12px 8px 0; border-bottom:1px solid var(--hairline); vertical-align:top;}
tr{break-inside:avoid;}
td b{font-weight:600;}
td .sub{display:block; font-size:11.5px; color:var(--ink-3); margin-top:1px;}
/* keep a narrow label column on one line (e.g. the access-model "Layer" column) */
table.firstcol-nowrap td:first-child{white-space:nowrap;}
/* Platform policy: a table never spills past the page margin. mono cells wrap
   onto multiple lines at their token separators, so long ID / event lists fit
   the column; individual tokens (PRD-001, account.riversync.com, event names)
   carry no internal spaces and so stay whole, breaking only as a last resort if
   a single token is itself wider than its column. Force a short ID column to a
   single line with .mono--nowrap where wrapping would read worse. */
td.mono{white-space:normal; overflow-wrap:break-word;}
td.mono--nowrap{white-space:nowrap;}

/* ---- SPEC-APP navigation & menu-visibility sections ------------------
   A faithful sidebar-rail mock + a role × menu-item visibility matrix per
   tenant type. App identity uses the design system's type-2 surface-pill
   hues (mirrored here so the paper doc stays self-contained). */
.app-pill{display:inline-flex; align-items:center; gap:5px; font-family:var(--rs-font-mono, ui-monospace, monospace);
  font-size:9.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  padding:2px 8px; border-radius:999px; border:1px solid; white-space:nowrap; vertical-align:middle;}
.app-pill--account{color:#5B6671; background:#EEF1F4; border-color:#D8DEE4;}
.app-pill--portal{color:#0B86B8; background:#E2F3FB; border-color:#BCE4F4;}
.app-pill--partners{color:#317C68; background:#E4F4EF; border-color:#BFE4D9;}
.app-pill--pipeline{color:#8F6710; background:#FBF1DC; border-color:#EAD3A2;}
.app-pill--admin{color:#5F4F92; background:#EFECF6; border-color:#D6CCE9;}
.app-pill--field{color:#B5292F; background:#FDEAEA; border-color:#F4C9CA;}

/* ---- Canonical DS surface pill (badge type 2) -----------------------
   The design system's compact uppercase app pill — rs-adminpill base +
   one hue modifier per app (account/portal/partners/pipeline/admin/field).
   Mirrored here with the exact DS hues so paper docs stay self-contained
   while carrying the real DS class names + brand colors. Prefer these over
   the legacy .app-pill in new/edited docs (see docs/CLAUDE.md badge spec). */
.rs-adminpill{display:inline-flex; align-items:center; gap:5px; font-family:var(--rs-font-mono, ui-monospace, monospace);
  font-size:9.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  padding:2px 8px; border-radius:999px; border:1px solid; white-space:nowrap; vertical-align:middle;
  color:#5F4F92; background:#EFECF6; border-color:#D6CCE9;}            /* admin · purple (base hue) */
.rs-accountpill{color:#5B6671; background:#EEF1F4; border-color:#D8DEE4;}   /* account · calm neutral */
.rs-hubpill{color:#0B86B8; background:#E2F3FB; border-color:#BCE4F4;}       /* portal · cyan ("River") */
.rs-partnerspill{color:#317C68; background:#E4F4EF; border-color:#BFE4D9;}  /* partners · teal */
.rs-opspill{color:#8F6710; background:#FBF1DC; border-color:#EAD3A2;}       /* pipeline · orange-gold */
.rs-fieldpill{color:#B5292F; background:#FDEAEA; border-color:#F4C9CA;}     /* field · red ("Sync") */

.navlayout{display:grid; grid-template-columns:230px 1fr; gap:20px; align-items:start; margin:14px 0 6px; break-inside:avoid;}
.navrail{border:1px solid var(--hairline-strong); border-radius:4px; overflow:hidden; background:#fff;}
.navrail__top{display:flex; align-items:center; gap:8px; padding:9px 12px; border-bottom:1px solid var(--hairline); background:#F6F8FA;}
.navrail__grp{padding:7px 0 5px;}
.navrail__grp + .navrail__grp{border-top:1px solid var(--hairline);}
.navrail__lbl{font-size:8.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3); padding:2px 14px 4px;}
.navrail__item{display:flex; align-items:center; gap:9px; padding:6px 14px; font-size:12px; color:var(--ink);}
.navrail__item .dot{width:5px; height:5px; border-radius:1px; background:var(--ink-3); flex:none; opacity:.5;}
.navrail__item.is-active{color:var(--accent); font-weight:600; box-shadow:inset 3px 0 0 var(--accent); background:var(--accent-soft);}
.navrail__item.is-active .dot{background:var(--accent); opacity:1;}
.navrail__item.is-gated .dot{background:#C99A2E; opacity:1;}
.navrail__item.is-sub{padding-left:30px; font-size:11.5px; color:var(--ink-2);}
.navrail__item.is-sub .dot{opacity:.3;}
.navrail__lock{margin-left:auto; font-size:8px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:#9C7A1E; white-space:nowrap;}
.navrail__cnt{margin-left:auto; font-family:var(--rs-font-mono, ui-monospace, monospace); font-size:9px; color:var(--ink-3);
  background:#F1F4F7; border:1px solid var(--hairline-strong); border-radius:2px; padding:0 5px;}
.navcap{font-size:12.5px; color:var(--ink-2); text-wrap:pretty;}
.navcap p{margin:0 0 9px;}
.navcap p:last-child{margin-bottom:0;}
.navcap b{color:var(--ink); font-weight:600;}

/* visibility tokens */
.vt{display:inline-block; min-width:48px; text-align:center; font-size:9px; font-weight:700; letter-spacing:.03em;
  text-transform:uppercase; padding:2px 6px; border-radius:2px; border:1px solid;}
.vt--full{color:#2C638F; background:var(--accent-soft); border-color:#C9DDEE;}
.vt--read{color:#4A545E; background:#F1F4F7; border-color:#D2DAE1;}
.vt--locked{color:#9C7A1E; background:#FAF1D8; border-color:#EBD9A4;}
.vt--none{color:#AEB8C1; background:transparent; border:1px solid transparent; font-weight:600;}
.vislegend{display:flex; gap:7px 16px; flex-wrap:wrap; margin:11px 0 2px; font-size:11px; color:var(--ink-3); align-items:center;}
.vislegend span{display:inline-flex; align-items:center; gap:6px;}

table.vismatrix{table-layout:fixed;}
table.vismatrix td, table.vismatrix th{text-align:center; padding:7px 6px; vertical-align:middle;}
table.vismatrix td:first-child, table.vismatrix th:first-child{text-align:left; padding-left:0; padding-right:10px;}
table.vismatrix th{padding-top:6px; padding-bottom:6px;}
table.vismatrix tr.grp td{background:#F6F8FA; font-size:9px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink-3); text-align:left; padding:5px 0 5px 10px;}
table.vismatrix td:first-child b{font-weight:600; font-size:12.5px;}
table.vismatrix td:first-child .ix{display:block; font-size:10.5px; color:var(--ink-3); font-family:var(--rs-font-mono, ui-monospace, monospace);}

.proposed-note{display:flex; gap:9px; align-items:flex-start; margin:14px 0 2px; padding:10px 13px;
  background:#FAF1D8; border:1px solid #EBD9A4; border-radius:3px; font-size:12px; color:#6f5613; text-wrap:pretty; break-inside:avoid;}
.proposed-note b{color:#5a4710; font-weight:700;}

.tsub{display:flex; align-items:center; gap:10px; margin:24px 0 3px; padding-top:14px; border-top:1px dashed var(--hairline-strong);
  font-size:13.5px; font-weight:600; color:var(--ink); flex-wrap:wrap;}
.tsub .role-note{font-weight:400; font-size:11.5px; color:var(--ink-3);}

ul{margin:8px 0; padding-left:20px;}
li{margin:5px 0; font-size:13.5px; text-wrap:pretty; break-inside:avoid;}

.foot{margin-top:40px; padding-top:12px; border-top:1px solid var(--hairline);
  display:flex; justify-content:space-between; font-size:10.5px; color:var(--ink-3);}

@media print{
  body{background:none; padding:0; font-size:12.5px;}
  .page{width:auto; max-width:none; min-height:0; margin:0; padding:0; box-shadow:none; border-radius:0;}
  .page + .page{break-before:page;}
  .docnav{display:none;}
  h2{break-after:avoid;}
  .req,tr,li{break-inside:avoid;}
  .req__id,.status-chip--draft,.status-chip--stub,.status-chip--ok,.app-pill,.rs-adminpill,.vt,.navrail__item.is-active,
  .navrail__top,.navrail__grp + .navrail__grp,table.vismatrix tr.grp td,.proposed-note{print-color-adjust:exact; -webkit-print-color-adjust:exact;}
  .navlayout{grid-template-columns:210px 1fr;}
  a{color:var(--ink); text-decoration:none;}
}
@page{size:A4; margin:0.75in;}