/* Designer guidance, October 2026. Shared across every authored page. */
:root {
  --fabric-grid-opacity:.25;
  --fabric-grid-color:#5637ff;
  --fabric-grid-image:url("brand/execution-fabric-grid.svg");
  --brand:#5637ff; --brand-dark:#4128cc; --ink:#2b3236; --body:#424a50;
  --muted:#626a70; --line:#d9dee0; --wash:#f8fafa; --lavender:#f2f1ff;
  --violet-900:#120a3d; --violet-800:#1f1266; --accent:#c6f754;
  --space-1:8px; --space-2:16px; --space-3:24px; --space-4:32px;
  --space-6:48px; --space-8:64px; --space-10:80px; --space-12:96px;
  --bs-body-font-family:"Golos Text","Segoe UI",Arial,sans-serif;
  --bs-body-color:var(--body); --bs-link-color:var(--brand);
  --bs-link-hover-color:var(--brand-dark);
}
body { font-family:var(--bs-body-font-family); color:var(--body); font-size:16px; }
main code { font-size:max(12px,.875em); }
main .static-control { background:#5637ff; color:#fff; }
.brand { display:inline-flex; align-items:center; line-height:1; }
.brand-logo { display:block; width:128px; height:auto; max-width:100%; }
.site-footer .brand-logo { width:136px; }
input,button,select,textarea { font-family:inherit; }
h1,h2,h3,h4,h5,h6 { font-family:"Funnel Display","Segoe UI",Arial,sans-serif; }
/* Funnel Display headings share one tracking value, including their text children.
   Navigation labels use Golos Text and retain their separate typography. */
:is(h1,h2,h3,h4,h5,h6):not(.fz-nav-heading,.fz-nav-rail h2),
:is(h1,h2,h3,h4,h5,h6):not(.fz-nav-heading,.fz-nav-rail h2) :is(span,a,button,strong,em) {
  letter-spacing:.001em!important;
}
h3,h4,h5,h6 { font-size: max(1rem,1em); }
.eyebrow { font-size:16px!important; line-height:1.5; letter-spacing:.055em!important; margin-bottom:24px; }
.tiny-label { font-size:12px; line-height:1.5; }
.lead-copy { color:var(--body); }
.text-brand { color:var(--brand); }
.section-space { padding-block:96px; }
.feature-section { padding-block:88px; }
.design-heading-row { align-items:flex-start!important; --bs-gutter-y:0; margin-top:0!important; }
.design-heading-row > :first-child > :is(h1,h2),
.design-heading-row > :nth-child(2) > :first-child { margin-top:0!important; padding-top:0!important; }
.design-section-label { margin-bottom:24px!important; }
.design-heading-row > :nth-child(2) { padding-top:0!important; }

/* One pill treatment for action links, with a lavender secondary action. */
.btn,.design-cta {
  font-family:var(--bs-body-font-family); border-radius:999px!important;
  min-height:56px; padding:16px 32px!important; font-size:16px!important;
  font-weight:500; line-height:1.5; display:inline-flex; align-items:center;
  justify-content:center; text-align:center; gap:8px; max-width:100%;
  white-space:normal; text-decoration:none!important; border:1px solid var(--brand);
  color:#fff; background:var(--brand); box-shadow:none;
  transition:background-color .18s,color .18s,border-color .18s;
}
.btn:hover,.design-cta:hover { color:#fff; background:var(--brand-dark); border-color:var(--brand-dark); }
.btn-outline-brand {
  color:var(--brand); background:#f2f1ff; border-color:var(--brand);
}
.btn-outline-brand:hover { color:var(--brand-dark); background:#e1ddff; border-color:var(--brand-dark); }
.btn-light-brand { color:var(--brand-dark); background:#fff; border-color:#fff; }
.btn-light-brand:hover { color:var(--brand-dark); background:#f2f1ff; border-color:#f2f1ff; }
.site-header .btn { min-height:48px; padding:8px 24px!important; font-size:14px!important; }
.design-cta > [aria-hidden="true"] { display:none; }
a:focus-visible,button:focus-visible,select:focus-visible {
  outline:3px solid #735fff; outline-offset:4px;
}
/* Dark panels: white titles, quiet neutral supporting text, distinct actions. */
.design-dark { color:#bdc3c6; }
.design-dark :is(h1,h2,h3,h4,h5,h6,strong) { color:#fff!important; }
.design-dark :is(p,small,li,dt,dd,label) { color:#bdc3c6!important; }
.design-dark :is(.eyebrow,.canvas-label,.durability-rail,.evidence-bottom,.ledger-note,code) { color:#d9dee0!important; }
.design-dark :is(.graph-num,.graph-status,.flow-number,.flow-tag,.flow-copy small,.identity-num,.console-detail) { color:#bdc3c6!important; }
.design-dark :is(.tiny-label,.ledger-symbol,.ledger-title > span,.decision-paths span,.durability-rail span,.evidence-header span,.evidence-case > span) { color:#d9dee0!important; }
.design-dark.evidence-window figcaption span { color:#d9dee0!important; }
.design-dark :is(.console-top span,.deny-branch) { color:#bdc3c6!important; }
.design-dark :is(.btn,.design-cta) { background:#c6f754!important; color:#120a3d!important; border-color:#c6f754!important; }
.design-dark :is(.btn,.design-cta):hover { background:color-mix(in srgb,#c6f754 85%,#fff)!important; border-color:color-mix(in srgb,#c6f754 85%,#fff)!important; }
.design-secondary { color:#5637ff!important; background:#f2f1ff!important; border-color:#5637ff!important; }
.design-secondary:hover { color:#4128cc!important; background:#e1ddff!important; }
.design-dark :is(.btn-outline-brand,.design-secondary) { background:#fff!important; color:#4128cc!important; border-color:#fff!important; }
.design-dark :is(.btn-outline-brand,.design-secondary):hover { background:#f2f1ff!important; border-color:#f2f1ff!important; }
.design-dark :is(.btn,.design-cta) :is(span,strong) { color:inherit!important; }
.story-number { color:#626a70; }
.story-step .story-detail { color:#626a70; }

/* The adoption rail follows actual document progress, without hiding content. */
.design-home .chapter-nav { background:#eef1f2; border:0; box-shadow:0 8px 16px #120a3d0d; }
.design-home .chapter-nav > .container-xl { max-width:1264px; }
.design-home .chapter-link {
  position:relative; min-height:112px; height:auto; padding:24px;
  display:flex; flex-direction:column; align-items:flex-start; justify-content:center;
  gap:0; background:#eef1f2; color:#2b3236; border:0; border-right:1px solid #d9dee0;
  font-family:"Funnel Display",sans-serif; font-size:20px; line-height:1.25;
}
.design-home .chapter-number { opacity:1; font:400 14px/1.5 "Golos Text",sans-serif; margin-bottom:4px; }
.design-home .chapter-link.active { background:linear-gradient(100deg,#1f1266,#5637ff); color:#fff; }
.design-home .chapter-link:hover:not(.active) { background:#e1ddff; color:#2b3236; }
.design-home .chapter-arrow { display:none; }
.chapter-progress { position:absolute; left:0; right:0; bottom:0; height:6px; background:#d9dee0; }
.chapter-progress-fill { display:block; height:100%; width:var(--chapter-progress,0%); background:#5637ff; }
.chapter-progress-stop { position:absolute; right:0; top:50%; width:14px; height:14px; border-radius:50%; border:2px solid #f8fafa; background:#bdc3c6; transform:translate(50%,-50%); box-shadow:0 0 0 1px #bdc3c6; z-index:1; }
.chapter-link.is-complete .chapter-progress-stop { background:#5637ff; box-shadow:0 0 0 1px #5637ff; }

/* Fit the complete six-stage example without a nested scrollbar. */
.design-home .execution-sticky { max-height:none; overflow:visible; padding-right:0; }
.design-home .execution-console { background:#120a3d; }
.design-home .console-top { padding:8px 16px; font-size:12px; }
.design-home .console-title { padding:8px 16px; align-items:center; }
.design-home .console-title small { font-size:12px; line-height:1.25; }
.design-home .console-title h4 { margin-top:4px; font-size:16px; line-height:1.25; }
.design-home .console-state { font-size:12px; padding:4px 8px; white-space:normal; }
.design-home .execution-graph { padding:8px 16px; }
.design-home .graph-node { padding:4px 8px; min-height:44px; gap:8px; line-height:1.25; background:#ffffff08; border-color:#ffffff26; }
.design-home .graph-node strong { font-size:14px; line-height:1.25; }
.design-home .graph-node small { font-size:12px; line-height:1.25; margin-top:2px; }
.design-home .graph-node.active { background:#735fff26; border-color:#9a8eff99; }
.design-home .graph-node.complete { background:#ffffff0d; border-color:#ffffff40; }
.design-home .graph-num,.design-home .graph-status,.design-home .deny-branch { font-size:12px; line-height:1.25; }
.design-home .graph-num { flex:0 0 20px; }
.design-home .graph-status { font-size:12px; letter-spacing:0; }
.design-home .graph-connector { height:4px; }
.design-home .console-detail { padding:8px 16px; margin:0; min-height:64px; font-size:12px; line-height:1.5; background:#ffffff08; }
.design-home .console-footer { padding:8px 16px; font-size:12px; line-height:1.5; }
.design-home .figure-note { font-size:12px; margin-top:8px; }
.design-home .deny-branch { top:16px; }
@media (min-width:992px) and (max-height:760px) {
  .design-home .execution-sticky { position:static; }
  .design-home .chapter-link { min-height:88px; padding:16px; }
}
@media (max-width:1199px) {
  .design-home .chapter-link { padding:16px; font-size:18px; min-height:104px; }
}
@media (max-width:991px) {
  .design-heading-row { --bs-gutter-y:24px; }
  .design-heading-row > :nth-child(2) { margin-top:24px!important; }
  .design-home .chapter-mobile { padding-block:16px; }
  .design-home .chapter-mobile label { color:#2b3236; font-size:14px; }
  .design-home .chapter-mobile select { color:#5637ff; background-color:#f8fafa; font-size:16px; }
  .design-home .execution-sticky { position:static; }
  .section-space { padding-block:64px; }
}
@media (max-width:767px) {
  .container-xl { padding-left:24px; padding-right:24px; }
  .eyebrow { font-size:16px!important; }
  .section-space,.feature-section { padding-block:56px; }
  .btn,.design-cta { min-height:48px; padding:16px 24px!important; font-size:16px!important; }
  .site-header .btn { font-size:14px!important; }
  .design-home .console-title { flex-wrap:wrap; gap:8px; }
  .design-home .graph-node { flex-wrap:wrap; }
  .design-home .graph-status { font-size:12px; }
  .design-home .policy-branch .graph-node { width:100%; }
  .design-home .deny-branch { position:static; display:block; margin:4px 0 4px 32px; }
  .design-home .deny-branch:before { display:none; }
  .design-home .console-detail { min-height:0; }
}
@media (prefers-reduced-motion:reduce) {
  .btn,.design-cta { transition:none; }
}

/* Compact segmented reading rail, shared across all authored pages. */
.design-section-nav {
  position:sticky; top:var(--header-height); z-index:1030;
  padding-block:16px; background:#fff!important; border:0!important;
  box-shadow:0 8px 16px #120a3d0d;
}
.design-section-nav > .container-xl { max-width:1264px; }
.design-section-nav .design-section-links {
  display:grid!important; grid-template-columns:repeat(var(--section-count),minmax(0,1fr));
  align-items:stretch; gap:0; padding:0; margin:0;
  border-radius:12px; overflow:hidden; background:#eef1f2;
}
.design-section-nav .design-section-links .design-section-tab {
  position:relative; display:flex; flex-direction:row; align-items:center;
  justify-content:flex-start; gap:12px; min-width:0; min-height:68px; height:auto;
  padding:18px 24px 22px; border:0; border-right:1px solid #dfe3e5;
  border-radius:0; background:#eef1f2; color:#2b3236;
  text-align:left; text-decoration:none; white-space:normal;
  font:600 18px/1.3 "Funnel Display",sans-serif;
}
.design-section-nav .design-section-links .design-section-tab:last-child { border-right:0; }
.design-section-nav .design-section-tab .design-section-number {
  display:block; flex:0 0 auto; color:#626a70; opacity:1;
  font:400 18px/1.3 "Golos Text",sans-serif; font-variant-numeric:tabular-nums; margin:0;
}
.design-section-nav .design-section-tab .design-section-label-text {
  min-width:0; color:inherit; font:inherit; margin:0; opacity:1;
}
.design-section-nav .design-section-links .design-section-tab.is-reading {
  background:linear-gradient(100deg,#1f1266,#5637ff); color:#fff; border-right-color:transparent;
}
.design-section-nav .design-section-tab.is-reading .design-section-number { color:#fff; }
.design-section-nav .design-section-links .design-section-tab:hover:not(.is-reading) { background:#e1ddff; color:#2b3236; }
.design-section-nav .design-section-tab .design-section-progress {
  position:absolute; display:block; inset:auto 0 0; height:4px; margin:0; background:#d9dee0;
}
.design-section-nav .design-section-tab .design-section-fill {
  display:block; height:100%; width:var(--section-progress,0%); background:#5637ff; margin:0;
}
.design-section-nav .design-section-tab.is-reading .design-section-progress { background:#5637ff; }
.design-section-nav .design-section-tab.is-reading .design-section-fill { background:#b9aaff; }
.design-section-nav .design-section-tab .design-section-stop { display:none; }
.design-section-nav .design-section-tab:focus-visible { outline:3px solid #5637ff; outline-offset:-5px; z-index:2; }
.design-section-nav .design-section-tab.is-reading:focus-visible { outline-color:#fff; }
.design-section-nav .design-section-mobile { display:none!important; }
[data-section-rail-target] { scroll-margin-top:calc(var(--header-height) + var(--section-rail-height,100px) + 24px)!important; }
@media (max-width:1279.98px) {
  .design-section-nav .design-section-links .design-section-tab { padding-inline:16px; font-size:16px; gap:10px; }
  .design-section-nav .design-section-tab .design-section-number { font-size:16px; }
}
@media (max-width:991.98px) {
  .design-section-nav { padding-block:12px; }
  .design-section-nav > .container-xl { max-width:none; padding-inline:24px; }
  .design-section-nav .design-section-links {
    display:flex!important; overflow-x:auto; overscroll-behavior-x:contain;
    scrollbar-width:thin; scrollbar-color:#bdc3c6 #eef1f2; scroll-padding-inline:16px;
  }
  .design-section-nav .design-section-links .design-section-tab {
    flex:0 0 auto; min-width:168px; max-width:280px; min-height:60px; padding:16px 20px 20px;
  }
}
@media (max-width:575.98px) {
  .design-section-nav .design-section-links .design-section-tab { max-width:256px; padding-inline:16px; }
}
@media print { .design-section-nav { display:none!important; } }
@media (prefers-reduced-motion:reduce) { .design-section-nav * { transition:none!important; } }

/* Additional designer review, October 24: hierarchy and quiet feedback. */
main :is(h1,h2,h3,h4,h5,h6) { color:var(--ink); }
main p { color:var(--body); }
main :is(.hero-note,.figure-note,[class$="-note"]) { color:var(--muted); }
main .ba-cover-pending { color:#626a70; }
main a.design-text-link {
  display:inline-flex; align-items:center; justify-content:flex-start; gap:8px;
  min-height:32px; max-width:100%; padding:4px 0; border:0; border-radius:0;
  background:transparent; box-shadow:none; color:#5637ff;
  font:500 16px/1.5 "Golos Text",sans-serif; text-align:left;
  font-size:16px!important; line-height:1.5!important; white-space:normal;
  text-decoration:none; text-underline-offset:4px;
}
main a.design-text-link:hover { color:#4128cc; text-decoration:underline; }
main a.design-text-link .design-link-arrow {
  display:inline-block; flex:none; font-size:16px; line-height:1;
  transform:rotate(0); transition:transform .22s ease;
}
main a.design-text-link:is(:hover,:focus-visible) .design-link-arrow { transform:rotate(-35deg); }
main .design-dark a.design-text-link { color:#c6f754; }
main .design-dark a.design-text-link:hover { color:color-mix(in srgb,#c6f754 85%,#fff); }
/* Keep related links readable when their former button wrapper was centered. */
main :is([class$="-link-row"],[class$="-walk-links"]) { display:flex; flex-wrap:wrap; gap:16px 32px; }

/* Muted surfaces retain state distinctions without large saturated blocks. */
.design-dark :is(.graph-node,.flow-node,.ledger-list li) { background:#ffffff08; border-color:#ffffff26; }
.design-dark :is(.graph-node.active,.flow-node.is-selected) { background:#735fff26; border-color:#9a8eff99; box-shadow:none; }
.design-dark .flow-node.is-skipped { background:#ffffff05; }
.design-dark .flow-node.is-skipped.is-selected { background:#ffffff0d; border-color:#ffffff40; }
.design-dark .identity-grid { background:#ffffff1a; border-color:#ffffff1a; }
.design-dark .identity-grid li { background:#120a3d; }
.design-dark .console-state { color:#d9dee0; background:#ffffff0d; border-color:#ffffff26; }
.design-dark :is(.console-top,.console-title,.console-footer) { color:#d9dee0; border-color:#ffffff1a; }

/* Whole clickable rows use a subtle fill; nested frames use a moving stroke. */
main .accordion { --bs-accordion-active-bg:#f2f1ff; --bs-accordion-active-color:#4128cc; }
main .accordion-item { transition:background-color .2s ease; }
main .accordion-button { background:transparent; transition:background-color .2s ease; }
main .accordion-item:is(:hover,:focus-within) { background:#5637ff08; }
main .accordion-button:not(.collapsed) { background:#5637ff0a; color:#4128cc; box-shadow:none; }
main .design-clickable { transition:background-color .2s ease,border-color .2s ease; }
main .design-clickable:hover { background-color:#5637ff0a!important; }
main .design-dark .design-clickable:hover { background-color:#ffffff0d!important; }
main .design-hover-frame { position:relative; }
main .design-card-outline {
  position:absolute; inset:-1px; display:block; border-radius:inherit; padding:1px;
  pointer-events:none; z-index:1; opacity:0;
  background:linear-gradient(115deg,#5637ff,#9a8eff,#00a88a,#c6f754,#5637ff);
  background-size:300% 300%;
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor; mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  mask-composite:exclude; transition:opacity .25s ease;
}
main .design-hover-frame:is(:hover,:focus-within) > .design-card-outline {
  opacity:.8; animation:design-border-drift 6s ease-in-out infinite alternate;
}
@keyframes design-border-drift { from { background-position:0% 50%; } to { background-position:100% 50%; } }

/* Motion is limited to existing connectors, in their actual flow direction. */
main .design-flow-connector { position:relative; }
main .design-flow-dot {
  position:absolute; width:4px; height:4px; border-radius:50%; background:#735fff;
  pointer-events:none; left:50%; top:0; opacity:0; transform:translate(-50%,-50%);
}
main .design-dark .design-flow-dot { background:#beb6ff; }
main .design-motion-visible .design-flow-dot { animation:design-flow-down 3.8s ease-in-out infinite; }
main .design-flow-arrow { display:inline-block; }
main .design-flow-arrow.design-motion-visible { animation:design-flow-right 4.5s ease-in-out infinite; }
main .design-flow-arrow.design-flow-down.design-motion-visible { animation-name:design-arrow-down; }
@keyframes design-flow-down { 0%,15% { top:0; opacity:0; } 25% { opacity:.65; } 75% { opacity:.65; } 90%,100% { top:100%; opacity:0; } }
@keyframes design-flow-right { 0%,100% { translate:0 0; opacity:.65; } 50% { translate:3px 0; opacity:1; } }
@keyframes design-arrow-down { 0%,100% { translate:0 0; opacity:.65; } 50% { translate:0 3px; opacity:1; } }
@media (hover:none) {
  main .design-hover-frame:hover > .design-card-outline { opacity:0; animation:none; }
}
@media (prefers-reduced-motion:reduce) {
  main :is(.design-card-outline,.design-flow-dot,.design-flow-arrow,.design-link-arrow) { animation:none!important; transition:none!important; translate:none!important; transform:none!important; }
  main .design-flow-dot { display:none; }
  main .design-hover-frame:is(:hover,:focus-within) > .design-card-outline { opacity:.8; }
}

/* Approved Flowing Grid: opt-in governed-work boundaries, never a global card skin.
   Replace the vector or change the three --fabric-grid-* tokens to revise it. */
main .design-fabric { position:relative; isolation:isolate; }
main .design-fabric > .design-fabric-grid {
  display:block; position:absolute; inset:0; width:auto; height:auto;
  padding:0; margin:0; border:0; border-radius:inherit;
  background:var(--fabric-grid-color); opacity:var(--fabric-grid-opacity);
  -webkit-mask-image:var(--fabric-grid-image); mask-image:var(--fabric-grid-image);
  -webkit-mask-size:cover; mask-size:cover;
  -webkit-mask-position:right top; mask-position:right top;
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
  z-index:-1; pointer-events:none;
}
main .design-fabric > .design-fabric-brand {
  display:block; width:100%; max-width:100%; padding:0; margin:0 0 16px;
  border:0; background:transparent; color:#4128cc;
  font:600 12px/1.5 "Golos Text","Segoe UI",sans-serif;
  letter-spacing:.075em; text-transform:uppercase; overflow-wrap:normal;
}
main .design-fabric-frame > .design-fabric-brand { width:auto; margin:16px 24px; }
main .design-fabric-wrap {
  margin:0 24px; padding:20px 16px 8px; border:1px solid #e1ddff;
  border-radius:10px; background:#f2f1ff;
}
main .design-fabric-wrap > .vo-mini-flow { padding:0; }
main .ph-private-zone.design-fabric > .design-fabric-brand { width:auto; margin:16px 16px 0; }
main .design-fabric-wrap .vo-mini-flow li { border-color:#e1ddff; }
main .design-dark.design-fabric,
main .design-dark .design-fabric { --fabric-grid-color:#b5a7ff; --fabric-grid-opacity:.18; }
main .design-dark.design-fabric > .design-fabric-brand,
main .design-dark .design-fabric > .design-fabric-brand { color:#d9d1ff!important; }

/* The homepage keeps the full signature selected in the design exploration. */
.design-home .runtime-boundary.design-fabric { padding:20px 16px 16px; border-radius:12px; border-color:#d5cdf6; }
main .design-fabric > .design-fabric-brand-hero {
  padding:0 6px 4px; margin:0 0 16px; letter-spacing:normal; text-transform:none;
}
.design-fabric-wordmark { display:block; font-size:11px; font-weight:600; letter-spacing:.13em; margin-bottom:3px; color:#4128cc; }
.design-fabric-title { display:block; font:500 23px/1.2 "Funnel Display","Segoe UI",sans-serif; letter-spacing:-.02em; color:#4128cc; }
.design-fabric-descriptor { display:block; margin-top:5px; font-size:12px; font-weight:400; color:#626a70; }
.design-home .runtime-boundary.design-fabric .runtime-step {
  padding:13px 12px; background:#fff; border:1px solid #e4e5ec;
  border-radius:8px; margin-top:10px;
}
.design-home .runtime-boundary.design-fabric .runtime-step:has(.current) { background:#f9f7ff; border-color:#c5b8ff; }
.design-home .runtime-boundary.design-fabric .runtime-step > div { min-width:0; }
@media (max-width:767px) {
  main .design-fabric-frame > .design-fabric-brand { margin:16px; }
  main .design-fabric-wrap { margin-inline:16px; padding:16px 12px 8px; }
  .design-home .runtime-boundary.design-fabric { padding:18px 10px 12px; }
  .design-home .runtime-boundary.design-fabric .runtime-step { padding:12px 8px; }
}

/* Keep expanded answers clear of the header across every page variant. */
main .accordion .accordion-body { padding-top:24px; }
@media (max-width:767px) {
  main .accordion .accordion-body { padding-top:16px; }
}