/* Ephemerent professional polish: shared grid, typography, navigation and restrained motion. */
@layer polish {
/* Scale tokens moved to tokens.css. Redeclaring them here shadowed it:
   polish is a later layer, so these quietly won. */

html {
  scrollbar-gutter: stable;
  text-rendering: optimizeLegibility;
}
body {
  overflow-x: clip;
  font-synthesis: none;
}
h1, h2, h3, h4 { text-wrap: balance; }
p, li { text-wrap: pretty; }
::selection {
  background: color-mix(in srgb, var(--signal, var(--accent, #156054)) 76%, transparent);
  color: var(--bg, var(--paper, #f3f0e8));
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible,
[role="button"]:focus-visible {
  outline: 2px solid var(--accent, var(--signal, #4c8bf5));
  outline-offset: 3px;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
section[id],
header[id],
main[id] { scroll-margin-top: calc(var(--site-nav) + 18px); }
.wrap,
.ewrap,
.nav-inner,
.ebar-in {
  width: min(100%, var(--site-max));
  max-width: var(--site-max);
  padding-inline: var(--site-gutter);
}

.site-grid,
.hero-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: clamp(16px, 2vw, 28px);
}

/* Quiet product surfaces. */
body.space-bg,
.space-bg {
  background: var(--bg, #0c0d0f);
}

/* Shared controls. */
.btn,
.ebtn,
.card,
.price-card,
.chip,
.prov-table,
.auth-card,
.account-plan,
.pipe,
.flow-step,
.proof-stage,
.engine-card {
  border-radius: var(--radius-panel);
}
.btn,
.ebtn,
button,
input,
select { border-radius: var(--radius-control); }
.btn {
  min-height: 44px;
  transition: color var(--motion-control), background var(--motion-control), border-color var(--motion-control), transform var(--motion-control);
}
.btn [aria-hidden="true"],
.ebtn [aria-hidden="true"] {
  display: inline-block;
  transition: transform var(--motion-control) var(--ease);
}

.story-branch-field {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.btn:hover [aria-hidden="true"],
.ebtn:hover [aria-hidden="true"] { transform: translateX(3px); }
.btn-primary {
  background: var(--ink);
  color: var(--bg);
  box-shadow: none;
}
.btn-primary:hover { background: var(--ink-2, var(--ink)); box-shadow: none; }
.btn-ghost { background: transparent; }
.hero .reveal.in,
.ehero .rv.in,
.ap-hero .rv.in {
  opacity: 1;
  transform: none;
  transition: none;
}
.card,
.price-card,
.flow-step,
.account-plan {
  background: var(--panel);
  box-shadow: none;
}
.card-hover:hover { transform: translateY(-1px); box-shadow: none; }

/* Product palette: one signal colour per product. */
body.orrery-page,
body.utility-page {
  --bg: #0c0d0f;
  --bg-2: #101216;
  --panel: #13161a;
  --panel-2: #171b20;
  --line: rgba(225, 231, 238, 0.10);
  --line-strong: rgba(225, 231, 238, 0.22);
  --ink: #f2f4f5;
  --ink-2: #c4cbd1;
  --muted: #929ba3;
  --faint: #77818a;
  --signal: #8eb7d6;
  --teal: var(--signal);
  --teal-lt: var(--signal);
  --violet: var(--signal);
  --violet-lt: var(--signal);
  --brass: var(--signal);
  --brass-lt: var(--signal);
  --display: 'Hanken Grotesk', system-ui, sans-serif;
  --body: 'Hanken Grotesk', system-ui, sans-serif;
}
body.vellum-page {
  --bg: #12110f;
  --bg-2: #171613;
  --panel: #1c1a17;
  --panel-2: #211f1b;
  --line: rgba(239, 231, 214, 0.11);
  --line-strong: rgba(239, 231, 214, 0.24);
  --ink: #f2ede2;
  --ink-2: #c8c0b1;
  --muted: #9a9285;
  --faint: #8a8276;
  --signal: #e5ae4e;
  --teal: var(--signal);
  --teal-lt: var(--signal);
  --violet: var(--signal);
  --violet-lt: var(--signal);
  --brass: var(--signal);
  --brass-lt: var(--signal);
  --display: 'Hanken Grotesk', system-ui, sans-serif;
  --body: 'Hanken Grotesk', system-ui, sans-serif;
  --wf-edge: 229,174,78;
  --wf-hot: 242,237,226;
  --wf-node: 229,174,78;
  --wf-grid: 190,181,164;
}
html[data-theme="hybrid"] body.vellum-page {
  background: var(--bg);
  font-family: 'Hanken Grotesk', system-ui, sans-serif;
}

body.orrery-page .display,
body.vellum-page .display,
body.utility-page .display {
  font-family: 'Hanken Grotesk', system-ui, sans-serif;
  font-weight: 520;
  letter-spacing: -0.045em;
}
html[data-theme="hybrid"] body.vellum-page .display { font-weight: 520; }
body.orrery-page .eyebrow,
body.vellum-page .eyebrow,
body.utility-page .eyebrow { color: var(--signal); }
body.orrery-page .eyebrow::before,
body.vellum-page .eyebrow::before,
body.utility-page .eyebrow::before { background: var(--signal); }

/* Shared navigation and accessible mobile menu. */
.nav,
.ebar {
  min-height: var(--site-nav);
  border-bottom: 1px solid var(--line, var(--rule));
  background: var(--bg, var(--paper));
  /* The glass treatment lives in tokens.css behind @supports and the
     low-power tier; this is the fallback for anyone who gets neither. */
}
.nav-inner,
.ebar-in { min-height: var(--site-nav); padding-block: 0; }
.nav.scrolled,
.ebar.scrolled {
  background: var(--bg, var(--paper));
  border-bottom-color: var(--line, var(--rule));
}
.nav-links,
.enav { gap: clamp(16px, 2vw, 28px); }
.nav-links a,
.enav a {
  position: relative;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  transition: color var(--motion-control);
}
.nav-links a::after,
.enav a::after {
  content: '';
  position: absolute;
  right: 0;
  bottom: 7px;
  left: 0;
  height: 1px;
  background: currentColor;
  opacity: .5;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform var(--motion-control) var(--ease);
}
.nav-links a:hover::after,
.nav-links a:focus-visible::after,
.enav a:hover::after,
.enav a:focus-visible::after,
.nav-links a[aria-current="page"]::after,
.enav a[aria-current="page"]::after { transform: scaleX(1); }
.enav .est::after,
.enav .est-keep::after { display: none; }

body.lab-page .ebar,
body.lab-page .ebar.scrolled {
  background: var(--paper);
}
.menu-toggle {
  display: none;
  min-width: 74px;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid var(--line-strong, var(--rule));
  color: var(--ink);
  background: transparent;
  font: 400 12px/1 var(--mono, monospace);
  letter-spacing: .06em;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  cursor: pointer;
}
.menu-toggle-lines { width: 14px; display: grid; gap: 4px; }
.menu-toggle-lines i { height: 1px; background: currentColor; transition: transform var(--motion-control); }
.menu-open .menu-toggle-lines i:first-child { transform: translateY(2.5px) rotate(45deg); }
.menu-open .menu-toggle-lines i:last-child { transform: translateY(-2.5px) rotate(-45deg); }

/* Entrance motion, including the d1-d4 stagger, is defined in
   tokens.css so the journal and news pages get it too. */
.hero-scroll { animation: none; }

/* Orrery: editorial copy paired with an honest system diagram. */
body.orrery-page .hero {
  min-height: 100svh;
  padding: calc(var(--site-nav) + 72px) 0 72px;
  align-items: center;
  overflow: clip;
  border-bottom: 1px solid var(--line);
}
body.orrery-page .hero-veil,
body.orrery-page .hero-canvas { display: none; }
body.orrery-page .hero-inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 28px;
  align-items: center;
  padding-top: 0;
}
body.orrery-page .hero-copy { grid-column: 1 / span 5; max-width: none; }
body.orrery-page .hero-h1,
body.vellum-page .hero-h1 { font-size: clamp(50px, 6vw, 88px); margin: 22px 0 24px; }
body.orrery-page .hero-providers,
body.vellum-page .hero-providers {
  margin-top: 38px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
  gap: 0;
}
body.orrery-page .prov,
body.vellum-page .prov {
  padding: 4px 10px 4px 0;
  margin-right: 10px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--muted);
}
body.orrery-page .prov-local,
body.vellum-page .prov-local { color: var(--signal); background: transparent; }

.hero-run-diagram {
  grid-column: 7 / -1;
  margin: 0;
  min-width: 0;
  border: 1px solid var(--line-strong);
  background: var(--bg-2);
}
.hero-run-head {
  min-height: 39px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 0 13px;
  border-bottom: 1px solid var(--line);
  color: var(--faint);
  font: 500 10px/1 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.hero-run-head span:first-child { color: var(--signal); }
.hero-run-body {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  gap: 16px;
  padding: clamp(18px, 2.4vw, 30px);
}
.hero-run-node,
.hero-run-branches {
  min-width: 0;
  padding: 15px 16px;
  border-top: 1px solid var(--line-strong);
  background: transparent;
}
.hero-run-node { display: flex; flex-direction: column; gap: 6px; }
.hero-run-node > span,
.hero-run-branches > span {
  color: var(--signal);
  font: 500 10px/1.4 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.hero-run-node strong { font-size: 15px; font-weight: 560; }
.hero-run-node small { color: var(--muted); font: 400 11px/1.5 var(--mono); }
.hero-run-branches { grid-column: 2; grid-row: 1 / span 2; }
.hero-run-branches > div { display: grid; gap: 8px; margin-top: 14px; }
.hero-run-branches article {
  display: grid;
  grid-template-columns: 36px 1fr;
  align-items: center;
  min-height: 48px;
  border: 0;
  border-top: 1px solid var(--line);
  background: transparent;
}
.hero-run-branches article:first-child { border-top-color: var(--line-strong); }
.hero-run-branches b {
  align-self: stretch;
  display: grid;
  place-items: center start;
  border-right: 0;
  color: var(--signal);
  font: 500 10px/1 var(--mono);
}
.hero-run-branches article span { padding: 0; color: var(--ink-2); font-size: 13px; }
.hero-run-decision { grid-column: 1 / -1; border-left: 3px solid var(--signal); }
.hero-run-foot {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 11px 13px;
  border-top: 1px solid var(--line);
  color: var(--faint);
  font: 400 10.5px/1.5 var(--mono);
}

body.orrery-page .loop-section,
body.vellum-page .loop-section,
body.orrery-page .models-section,
body.vellum-page .models-section,
body.orrery-page .pricing-section,
body.vellum-page .pricing-section,
body.vellum-page .review-section { background: var(--bg-2); }

body.orrery-page .section,
body.vellum-page .section {
  border-bottom: 1px solid var(--line);
}

body.orrery-page #nexus,
body.vellum-page #proof { background: var(--bg); }

body.orrery-page #run-loop,
body.vellum-page #review,
body.vellum-page #pipeline { background: var(--bg-2); }

body.orrery-page #safety,
body.vellum-page #architecture { background: var(--panel); }

body.orrery-page .cap-grid,
body.vellum-page .cap-grid,
body.orrery-page .chips,
body.vellum-page .chips {
  gap: 0;
  border-top: 1px solid var(--line);
}

body.orrery-page .cap-grid .card,
body.vellum-page .cap-grid .card,
body.orrery-page .chips .chip,
body.vellum-page .chips .chip {
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding: 24px 20px 28px 0;
}

body.orrery-page .cap-grid .card:hover,
body.vellum-page .cap-grid .card:hover,
body.orrery-page .chips .chip:hover,
body.vellum-page .chips .chip:hover {
  transform: none;
  background: var(--panel-2);
  padding-left: 14px;
}

body.orrery-page .cap-grid .card:nth-child(4n),
body.vellum-page .cap-grid .card:nth-child(4n),
body.orrery-page .chips .chip:nth-child(4n),
body.vellum-page .chips .chip:nth-child(4n) { padding-right: 0; }

body.orrery-page .cap-grid .cap-ic,
body.vellum-page .cap-grid .cap-ic,
body.orrery-page .chip-ic,
body.vellum-page .chip-ic {
  display: block;
  color: var(--signal);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .14em;
}

body.vellum-page .arch-grid {
  gap: 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

body.vellum-page .arch-grid .arch-col {
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding: 28px 24px 30px 0;
}

body.vellum-page .arch-grid .arch-col:last-child {
  border-right: 0;
  padding-right: 0;
}

/* Continuous strips read as a sequence, not a row of feature cards. */
body.orrery-page .pipe,
body.vellum-page .pipe,
body.vellum-page .proof-strip {
  gap: 0;
  border: 0;
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  overflow: visible;
}

body.orrery-page .pipe-step,
body.vellum-page .pipe-step,
body.vellum-page .ps-item {
  min-width: 0;
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  padding: 22px 16px 24px 0;
}

body.orrery-page .pipe-step:last-child,
body.vellum-page .pipe-step:last-child,
body.vellum-page .ps-item:last-child { border-right: 0; padding-right: 0; }
body.orrery-page .pipe-step + .pipe-step,
body.vellum-page .pipe-step + .pipe-step,
body.vellum-page .ps-item + .ps-item { padding-left: 16px; }
body.orrery-page .pipe-n,
body.vellum-page .pipe-n,
body.vellum-page .ps-k { color: var(--signal); }

body.orrery-page .prov-table,
body.vellum-page .prov-table {
  border: 0;
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  overflow: visible;
}
body.orrery-page .prov-row,
body.vellum-page .prov-row { padding-inline: 0; }
body.orrery-page .organization-pricing {
  border: 0;
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  padding-inline: 0;
}
body.orrery-page .compare-wrap { border-right: 0; border-bottom: 1px solid var(--line); border-left: 0; border-radius: 0; }

body.vellum-page .flow {
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line);
}
body.vellum-page .flow-step {
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  padding: 26px 22px 28px 0;
}
body.vellum-page .flow-step:last-of-type { border-right: 0; padding-right: 0; }
body.vellum-page .flow-step + .flow-conn + .flow-step { padding-left: 22px; }
body.vellum-page .flow-conn { width: 22px; background: var(--signal); opacity: .72; }

@media (max-width: 900px) {
  body.orrery-page .pipe-step:nth-child(3n),
  body.vellum-page .pipe-step:nth-child(3n),
  body.vellum-page .ps-item:nth-child(3n) { border-right: 0; padding-right: 0; }
  body.orrery-page .pipe-step:nth-child(3n + 1),
  body.vellum-page .pipe-step:nth-child(3n + 1),
  body.vellum-page .ps-item:nth-child(3n + 1) { padding-left: 0; }
}

@media (max-width: 540px) {
  body.orrery-page .pipe-step:nth-child(3n),
  body.vellum-page .pipe-step:nth-child(3n),
  body.vellum-page .ps-item:nth-child(3n) { border-right: 1px solid var(--line); padding-right: 16px; }
  body.orrery-page .pipe-step:nth-child(2n),
  body.vellum-page .pipe-step:nth-child(2n),
  body.vellum-page .ps-item:nth-child(2n) { border-right: 0; padding-right: 0; }
  body.orrery-page .pipe-step:nth-child(2n + 1),
  body.vellum-page .pipe-step:nth-child(2n + 1),
  body.vellum-page .ps-item:nth-child(2n + 1) { padding-left: 0; }
}
.loop-rail { justify-content: space-between; }
.loop-step { min-width: 120px; }

body.orrery-page .swarm-card { padding: clamp(18px, 2.4vw, 30px); }
.lifecycle-demo-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
  color: var(--faint);
  font: 500 10px/1.4 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
}
.lifecycle-demo-head span:first-child { color: var(--signal); }
.lifecycle-grid {
  display: grid;
  grid-template-columns: minmax(130px, .85fr) 24px minmax(250px, 1.7fr) 24px minmax(160px, 1fr) 24px minmax(145px, .9fr);
  align-items: stretch;
  padding: 32px 0;
}
.lifecycle-panel,
.lifecycle-worktrees {
  min-width: 0;
  min-height: 220px;
  padding: 17px;
  border: 1px solid var(--line);
  border-top-color: var(--line-strong);
  background: var(--panel-2);
  opacity: .55;
  transition: opacity var(--motion-enter), border-color var(--motion-enter), transform var(--motion-enter);
}
.lifecycle-panel {
  display: flex;
  flex-direction: column;
  gap: 8px;
  justify-content: center;
}
.lifecycle-panel.is-active,
.lifecycle-worktrees.is-active { opacity: 1; border-top-color: var(--signal); transform: translateY(-3px); }
.lifecycle-panel.is-complete,
.lifecycle-worktrees.is-complete { opacity: .82; }
.lifecycle-kicker {
  display: block;
  color: var(--signal);
  font: 500 9.5px/1.4 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.lifecycle-panel > strong { color: var(--ink); font-size: 15px; font-weight: 560; line-height: 1.35; }
.lifecycle-panel > small { color: var(--muted); font: 400 10.5px/1.55 var(--mono); }
.lifecycle-worktree-list { display: grid; gap: 8px; margin-top: 16px; }
.lifecycle-worktree-list article {
  display: grid;
  grid-template-columns: 32px minmax(62px, .75fr) 1.25fr;
  align-items: center;
  min-height: 45px;
  border: 1px solid var(--line);
  background: var(--panel);
}
.lifecycle-worktree-list article > * { padding: 0 10px; }
.lifecycle-worktree-list article > span {
  align-self: stretch;
  display: grid;
  place-items: center;
  border-right: 1px solid var(--line);
  color: var(--signal);
  font-size: 10px;
}
.lifecycle-worktree-list strong { font-size: 13px; font-weight: 540; }
.lifecycle-worktree-list small { color: var(--muted); font: 400 10px/1.4 var(--mono); }
.lifecycle-connector { display: grid; place-items: center; overflow: hidden; }
.lifecycle-connector i { width: 100%; height: 1px; background: var(--line-strong); transform: scaleX(.35); transition: transform var(--motion-settle), background var(--motion-settle); }
[data-run-step="1"] .lifecycle-connector:nth-of-type(1) i,
[data-run-step="2"] .lifecycle-connector:nth-of-type(-n+2) i,
[data-run-step="3"] .lifecycle-connector i { transform: scaleX(1); background: var(--signal); }
.lifecycle-verify ul { list-style: none; display: grid; gap: 7px; margin-top: 8px; }
.lifecycle-verify li { display: flex; justify-content: space-between; gap: 8px; padding-top: 7px; border-top: 1px solid var(--line); color: var(--muted); font: 400 9.5px/1.3 var(--mono); }
.lifecycle-verify li b { color: var(--ink-2); font-weight: 500; }
.lifecycle-owner { margin-top: auto; padding-top: 10px; border-top: 1px solid var(--line); color: var(--signal); font: 500 10px/1.4 var(--mono); text-transform: uppercase; }
.lifecycle-transcript { border-top: 1px solid var(--line-strong); }
.lifecycle-transcript-head {
  min-height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border-bottom: 1px solid var(--line);
}
.lifecycle-transcript-head > div:first-child { display: grid; gap: 4px; }
.lifecycle-transcript-head span { color: var(--faint); font: 400 10px/1.2 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.lifecycle-transcript-head strong { color: var(--signal); font: 500 12px/1.2 var(--mono); text-transform: uppercase; }
.lifecycle-controls { display: flex; gap: 8px; }
.lifecycle-controls button {
  min-height: 40px;
  padding: 0 12px;
  border: 1px solid var(--line-strong);
  background: transparent;
  color: var(--ink-2);
  font: 500 10.5px/1 var(--mono);
  cursor: pointer;
}
.lifecycle-controls button:hover { border-color: var(--signal); color: var(--ink); }
.lifecycle-transcript ol { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); }
.lifecycle-transcript li {
  min-width: 0;
  min-height: 140px;
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 10px;
  padding: 16px 14px;
  border-right: 1px solid var(--line);
  border-top: 2px solid transparent;
  opacity: .5;
  transition: opacity var(--motion-enter), border-color var(--motion-enter);
}
.lifecycle-transcript li:last-child { border-right: 0; }
.lifecycle-transcript li[aria-current="step"] { opacity: 1; border-top-color: var(--signal); }
.lifecycle-transcript li > span { color: var(--signal); font-size: 10px; }
.lifecycle-transcript li strong { display: block; margin-bottom: 6px; color: var(--ink-2); font-size: 12px; font-weight: 560; }
.lifecycle-transcript li p { color: var(--muted); font-size: 11px; line-height: 1.5; }
.lifecycle-demo[data-motion="static"] .lifecycle-controls { display: none; }
.artifact-note {
  margin: 14px 0 0;
  color: var(--faint);
  font: 400 11px/1.6 var(--mono);
}

/* Vellum: a visible, scroll-stepped scene occupies the hero. */
body.vellum-page .hero {
  min-height: 150svh;
  display: block;
  overflow: visible;
  border-bottom: 1px solid var(--line);
}
body.vellum-page .hero-inner {
  position: sticky;
  top: var(--site-nav);
  min-height: calc(100svh - var(--site-nav));
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 28px;
  align-items: center;
  padding-top: 36px;
  padding-bottom: 36px;
}
body.vellum-page .hero-copy { grid-column: 1 / span 5; max-width: none; }
body.vellum-page .hero-veil { display: none; }
.vellum-hero-stage {
  grid-column: 7 / -1;
  position: relative;
  min-height: min(66svh, 680px);
  margin: 0;
  border: 1px solid var(--line-strong);
  background: #090806;
  overflow: hidden;
}
body.vellum-page .vellum-hero-stage .hero-canvas {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: .92;
  transition: opacity var(--motion-glide), filter var(--motion-glide);
}
.vellum-cpu-frame {
  position: absolute;
  inset: 40px 0 0;
  width: 100%;
  height: calc(100% - 40px);
  object-fit: cover;
  image-rendering: auto;
  opacity: 0;
  transform: scale(1.015);
  transition: opacity var(--motion-glide), transform var(--motion-glide);
}
.vellum-stage-head {
  position: absolute;
  z-index: 4;
  inset: 0 0 auto;
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 13px;
  border-bottom: 1px solid var(--line);
  background: rgba(9,8,6,.88);
  color: var(--faint);
  font: 500 10px/1 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.vellum-stage-head strong { color: var(--signal); font-weight: 500; }
.vellum-state-rail {
  position: absolute;
  z-index: 4;
  inset: auto 14px 14px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  background: rgba(9,8,6,.90);
  border: 1px solid var(--line-strong);
}
.vellum-state-rail span {
  padding: 10px 11px;
  border-right: 1px solid var(--line);
  color: var(--faint);
  font: 500 10px/1.35 var(--mono);
}
.vellum-state-rail span:last-child { border-right: 0; }
.vellum-stage-receipt {
  position: absolute;
  z-index: 3;
  right: 20px;
  top: 64px;
  width: min(280px, calc(100% - 40px));
  padding: 16px;
  border: 1px solid var(--line-strong);
  background: rgba(9,8,6,.94);
  color: var(--ink-2);
  font: 400 11px/1.7 var(--mono);
  opacity: 0;
  transform: translateY(8px);
  transition: opacity var(--motion-glide), transform var(--motion-glide);
}
.vellum-stage-receipt b { display: block; color: var(--signal); font-weight: 500; margin-bottom: 6px; }
[data-scene-step="0"] .vellum-state-rail span:nth-child(1),
[data-scene-step="1"] .vellum-state-rail span:nth-child(2),
[data-scene-step="2"] .vellum-state-rail span:nth-child(3),
[data-scene-step="3"] .vellum-state-rail span:nth-child(4) { color: var(--signal); box-shadow: inset 0 -2px 0 var(--signal); }
[data-scene-step="0"] .vellum-hero-stage .hero-canvas { opacity: .55; filter: blur(.2px) saturate(.45); }
[data-scene-step="1"] .vellum-hero-stage .hero-canvas { opacity: .95; filter: none; }
[data-scene-step="2"] .vellum-hero-stage .hero-canvas { opacity: 1; filter: contrast(1.08); }
[data-scene-step="2"] .vellum-cpu-frame,
[data-scene-step="3"] .vellum-cpu-frame { opacity: .76; transform: none; }
[data-scene-step="3"] .vellum-hero-stage .hero-canvas { opacity: .22; }
[data-scene-step="3"] .vellum-stage-receipt { opacity: 1; transform: none; }
body.vellum-page .hero-scroll { display: none; }

body.vellum-page .proof-stage,
body.vellum-page .review-stage,
body.vellum-page .engine-view {
  background: #090806;
  box-shadow: none;
  /* These are render viewports: they stay dark in the light face the
     same way a photograph does. Restating ink and ground here makes
     the derived quiet tones resolve against this surface instead of
     the page, so labels over the render stay legible in both faces. */
  --bg: #090806;
  --ink: #f2ede2;
  --red: #ff8a94;
}
body.vellum-page .proof-stage::after,
body.vellum-page .review-stage::after,
body.vellum-page .engine-view::after { display: none; }
body.vellum-page .price-card.featured { box-shadow: none; }

.evidence-document,
.system-anatomy,
.proof-contract {
  border: 1px solid var(--line);
  border-top-color: var(--line-strong);
  background: var(--bg-2);
}
.evidence-document-head,
.system-anatomy-head,
.proof-contract-head {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 0 14px;
  border-bottom: 1px solid var(--line);
  color: var(--faint);
  font: 500 10px/1.4 var(--mono);
  letter-spacing: .09em;
  text-transform: uppercase;
}
.evidence-document-head span:first-child,
.system-anatomy-head span:first-child,
.proof-contract-head span:first-child { color: var(--signal); }
.evidence-row {
  display: grid;
  grid-template-columns: minmax(130px, .8fr) minmax(220px, 1.35fr) minmax(220px, 1.35fr);
  border-bottom: 1px solid var(--line);
}
.evidence-row:last-child { border-bottom: 0; }
.evidence-row > * { min-width: 0; padding: 16px 18px; border-right: 1px solid var(--line); }
.evidence-row > *:last-child { border-right: 0; }
.evidence-row b { color: var(--ink); font-size: 14px; font-weight: 560; }
.evidence-row span { color: var(--muted); font-size: 14px; line-height: 1.55; }
.evidence-row-head > * { color: var(--faint); font: 500 10px/1.4 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.system-anatomy { display: grid; grid-template-columns: repeat(3, 1fr); }
.system-anatomy-head { grid-column: 1 / -1; }
.system-anatomy section { min-width: 0; padding: clamp(22px, 3vw, 34px); border-right: 1px solid var(--line); }
.system-anatomy section:last-child { border-right: 0; }
.system-anatomy section > span { color: var(--signal); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.system-anatomy h3 { margin: 24px 0 12px; font-size: 21px; font-weight: 560; }
.system-anatomy p { min-height: 96px; color: var(--muted); font-size: 14px; line-height: 1.6; }
.system-anatomy ul { list-style: none; margin-top: 22px; border-top: 1px solid var(--line); }
.system-anatomy li { padding: 10px 0; border-bottom: 1px solid var(--line); color: var(--ink-2); font: 400 11.5px/1.5 var(--mono); }
.proof-contract { min-height: 100%; }
.proof-contract > div:not(.proof-contract-head) { display: grid; grid-template-columns: .8fr 1.5fr; border-bottom: 1px solid var(--line); }
.proof-contract > div:not(.proof-contract-head) > * { padding: 15px 16px; }
.proof-contract > div:not(.proof-contract-head) span { color: var(--signal); font: 500 10px/1.4 var(--mono); text-transform: uppercase; }
.proof-contract > div:not(.proof-contract-head) b { border-left: 1px solid var(--line); color: var(--ink-2); font: 400 11.5px/1.5 var(--mono); }
.proof-contract p { margin: 20px; color: var(--muted); font-size: 13px; line-height: 1.6; }

/* Indexed research document. */
body.research-page .research-index-wrap {
  position: sticky;
  top: calc(var(--site-nav) + 24px);
  height: 0;
  z-index: 8;
}
body.research-page .research-index {
  position: relative;
  width: 218px;
  border-top: 1px solid var(--rule);
}
.research-index::after {
  content: '';
  position: absolute;
  left: -1px;
  top: 0;
  width: 2px;
  height: calc(var(--scene-progress, 0) * 100%);
  max-height: 100%;
  background: var(--accent);
}
.research-index a {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 10px;
  padding: 13px 0;
  border-bottom: 1px solid var(--rule);
  color: var(--muted);
  font-size: 13px;
}
.research-index a span { color: var(--accent); font-family: var(--mono); font-size: 10px; }
.research-index a:hover,
.research-index a[aria-current="location"] { color: var(--ink); font-weight: 560; }
.research-index a[aria-current="location"] span { color: var(--ink); }
@media (min-width: 881px) {
  body.research-page .esec > .ewrap { padding-left: calc(var(--site-gutter) + 250px); }
}

/* Workflow utility pages use split, task-oriented compositions. */
body.utility-page .auth-main {
  width: min(100%, var(--site-max));
  margin-inline: auto;
  padding: calc(var(--site-nav) + 72px) var(--site-gutter) 72px;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 28px;
  align-items: start;
}
body.utility-page .auth-main::before {
  content: attr(data-workflow-label);
  grid-column: 1 / span 4;
  min-height: 360px;
  padding-top: 8px;
  border-top: 1px solid var(--line-strong);
  color: var(--signal);
  font: 500 11px/1.5 var(--mono);
  letter-spacing: .14em;
  text-transform: uppercase;
}
body.utility-page .auth-card {
  grid-column: 5 / span 6;
  max-width: none;
  padding: 0 0 48px;
  border: 0;
  border-top: 1px solid var(--line-strong);
  background: transparent;
  box-shadow: none;
}
body.utility-page .auth-card h1 { font-size: clamp(34px, 4vw, 54px); margin: 26px 0 12px; }
body.utility-page .auth-card .sub { max-width: 52ch; }
body.utility-page .auth-input { background: var(--panel); }
body.utility-page .account-plan { border-left: 3px solid var(--signal); }
#cloud-auth-primary { min-height: 320px; }
body.utility-page .auth-main[data-workflow-label="Account / Vellum handoff"] .auth-card { min-height: 680px; }
.connect-status { color: var(--muted); }
.utility-footer {
  border-top: 1px solid var(--line);
  color: var(--faint);
}
.utility-footer-inner {
  width: min(100%, var(--site-max));
  min-height: 88px;
  margin-inline: auto;
  padding: 20px var(--site-gutter);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  font-size: 12px;
}
.utility-footer nav { display: flex; align-items: center; gap: 22px; }
.utility-footer a { min-height: 44px; display: inline-flex; align-items: center; color: var(--muted); }
.utility-footer a:hover { color: var(--ink); }
.error-main {
  width: min(100%, var(--site-max));
  min-height: calc(100svh - 88px);
  margin-inline: auto;
  padding: calc(var(--site-nav) + 100px) var(--site-gutter) 100px;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  align-content: center;
  column-gap: 28px;
}
.error-main > * { grid-column: 3 / span 7; }
.error-code { margin-bottom: 18px; color: var(--signal); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; }
.error-main h1 { margin-bottom: 18px; font-size: clamp(42px, 7vw, 82px); }
.error-main p { max-width: 48ch; color: var(--muted); font-size: 18px; line-height: 1.65; }
.error-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 30px; }
body.lab-page.error-page .error-main h1 {
  max-width: 10ch;
  font-family: var(--serif);
  font-weight: 400;
  line-height: .96;
}
body.lab-page.error-page .error-code { color: var(--accent); }
body.lab-page.error-page .error-actions .ebtn { min-width: 0; }

.legal-layout {
  display: grid;
  grid-template-columns: minmax(150px, 190px) minmax(0, 68ch);
  gap: clamp(34px, 7vw, 96px);
  align-items: start;
}
.legal-layout .legal-body { max-width: none; }
.legal-index {
  position: sticky;
  top: calc(var(--site-nav) + 24px);
  padding-top: 14px;
  border-top: 1px solid var(--rule);
}
.legal-index > span {
  color: var(--faint);
  font: 500 9px/1.4 var(--mono);
  letter-spacing: .13em;
  text-transform: uppercase;
}
.legal-index ol { margin-top: 12px; list-style: none; }
.legal-index li { margin: 0; }
.legal-index a {
  display: block;
  padding: 7px 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}
.legal-index a:hover { color: var(--accent); }
.legal-body h2 { scroll-margin-top: calc(var(--site-nav) + 28px); }

@media (max-width: 820px) {
  .legal-layout { grid-template-columns: 1fr; gap: 32px; }
  .legal-index { position: static; columns: 2; column-gap: 24px; }
  .legal-index > span { display: block; column-span: all; }
  .legal-index ol { column-span: all; columns: 2; }
  .legal-index li { break-inside: avoid; }
}

@media (max-width: 520px) {
  .legal-index,
  .legal-index ol { columns: 1; }
}

/* Tables and data are treated as documents, not dashboard cards. */
.compare-wrap { overflow-x: auto; border-top: 1px solid var(--line-strong); }
.compare { min-width: 760px; }
.compare th,
.compare td { border-radius: 0; }

/* Supporting product documents are led by rules and sequence, not card chrome. */
body.supporting-page .nav {
  background: color-mix(in srgb, var(--bg) 94%, transparent);
}
body.supporting-page .security-grid,
body.supporting-page .product-grid,
body.supporting-page .org-feature-grid {
  gap: 0;
  border-top: 1px solid var(--line-strong);
}
body.supporting-page .security-grid article,
body.supporting-page .product-grid article,
body.supporting-page .org-feature-grid article {
  min-height: 210px;
  padding: 28px 24px 34px;
  border: 0;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}
body.supporting-page .security-grid article:nth-child(3n),
body.supporting-page .product-grid article:last-child,
body.supporting-page .org-feature-grid article:nth-child(even) { border-right: 0; }
body.supporting-page .callout,
body.supporting-page .org-billing-note,
body.supporting-page .org-auth-card {
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body.supporting-page .callout {
  padding: 32px 0;
  border-width: 1px 0;
}
body.supporting-page .org-trust span {
  padding: 7px 0;
  border: 0;
  border-bottom: 1px solid var(--line-strong);
  border-radius: 0;
  background: transparent;
}

@media (max-width: 640px) {
  body.orrery-page .compare-wrap { overflow: visible; border: 0; }
  body.orrery-page .compare,
  body.orrery-page .compare tbody,
  body.orrery-page .compare tr,
  body.orrery-page .compare td { display: block; width: 100%; min-width: 0; }
  body.orrery-page .compare { min-width: 0; }
  body.orrery-page .compare thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
  body.orrery-page .compare tr { padding: 16px 0; border-top: 1px solid var(--line-strong); }
  body.orrery-page .compare td,
  body.orrery-page .compare .col-us {
    display: grid;
    grid-template-columns: minmax(92px, .42fr) minmax(0, 1fr);
    gap: 14px;
    padding: 7px 0;
    border: 0;
    background: transparent;
  }
  body.orrery-page .compare td::before {
    content: attr(data-label);
    color: var(--faint);
    font: 500 9px/1.45 var(--mono);
    letter-spacing: .1em;
    text-transform: uppercase;
  }
  body.supporting-page .security-grid article,
  body.supporting-page .product-grid article,
  body.supporting-page .org-feature-grid article {
    min-height: 0;
    border-right: 0;
  }
}

@media (max-width: 980px) {
  .lifecycle-grid { grid-template-columns: 1fr; gap: 8px; padding-block: 24px; }
  .lifecycle-panel,
  .lifecycle-worktrees { min-height: 0; }
  .lifecycle-connector { min-height: 18px; }
  .lifecycle-connector i { width: 1px; height: 100%; transform: scaleY(.35); }
  [data-run-step="1"] .lifecycle-connector:nth-of-type(1) i,
  [data-run-step="2"] .lifecycle-connector:nth-of-type(-n+2) i,
  [data-run-step="3"] .lifecycle-connector i { transform: scaleY(1); }
  body.orrery-page .hero-copy,
  body.vellum-page .hero-copy { grid-column: 1 / span 6; }
  .hero-run-diagram,
  .vellum-hero-stage { grid-column: 7 / -1; }
  body.vellum-page .hero-h1,
  body.orrery-page .hero-h1 { font-size: clamp(46px, 7vw, 72px); }
}

@media (max-width: 880px) {
  .motion-ready .menu-toggle { display: inline-flex; }
  .motion-ready .nav-links,
  .motion-ready .enav {
    display: none;
    position: absolute;
    inset: calc(var(--site-nav) - 1px) 0 auto;
    min-height: calc(100svh - var(--site-nav));
    padding: 24px var(--site-gutter) 48px;
    border-top: 1px solid var(--line, var(--rule));
    background: var(--bg, var(--paper));
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }
  .motion-ready .menu-open .nav-links,
  .motion-ready .menu-open .enav {
    display: flex;
    animation: menu-panel-in var(--motion-control) var(--ease) both;
  }
  .motion-ready .menu-open .enav a { display: flex; }
  .motion-ready .nav-links a,
  .motion-ready .enav a {
    min-height: 58px;
    border-bottom: 1px solid var(--line, var(--rule));
    font-size: 17px;
  }
  .motion-ready .enav .est { display: block; margin-top: 24px; }
  .menu-lock { overflow: hidden; }

  @keyframes menu-panel-in {
    from { opacity: 0; transform: translateY(-8px); }
    to { opacity: 1; transform: none; }
  }

  body.orrery-page .hero,
  body.vellum-page .hero { min-height: auto; padding-top: calc(var(--site-nav) + 60px); }
  body.vellum-page .hero-inner { position: relative; top: auto; min-height: auto; }
  body.orrery-page .hero-copy,
  body.vellum-page .hero-copy,
  .hero-run-diagram,
  .vellum-hero-stage { grid-column: 1 / -1; }
  .hero-run-diagram,
  .vellum-hero-stage { margin-top: 30px; min-height: 470px; }
  body.orrery-page .hero-scroll { display: none; }

  body.research-page .research-index-wrap { position: relative; top: auto; height: auto; margin-top: 36px; }
  body.research-page .research-index { width: 100%; display: grid; grid-template-columns: 1fr 1fr; }
  body.research-page .research-index a:nth-child(odd) { border-right: 1px solid var(--rule); padding-right: 14px; }
  body.research-page .research-index a:nth-child(even) { padding-left: 14px; }
  body.utility-page .auth-main::before { grid-column: 1 / span 4; }
  body.utility-page .auth-card { grid-column: 5 / -1; }
  .lifecycle-transcript ol { grid-template-columns: 1fr 1fr; }
  .lifecycle-transcript li:nth-child(2) { border-right: 0; }
  .lifecycle-transcript li:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .system-anatomy { grid-template-columns: 1fr; }
  .system-anatomy-head { grid-column: 1; }
  .system-anatomy section { border-right: 0; border-bottom: 1px solid var(--line); }
  .system-anatomy section:last-child { border-bottom: 0; }
  .system-anatomy p { min-height: 0; }
}

@media (max-width: 640px) {
  :root { --site-nav: 64px; }
  .brand-by { display: none; }
  .auth-nav-slot { margin-left: 0; }
  .auth-nav-slot .btn { display: none; }
  .hero-run-diagram,
  .vellum-hero-stage { min-height: 390px; }
  .hero-run-head,
  .hero-run-foot { flex-direction: column; align-items: flex-start; }
  .hero-run-body { grid-template-columns: 1fr; }
  .hero-run-branches { grid-column: 1; grid-row: auto; }
  .hero-run-decision { grid-column: 1; }
  .lifecycle-demo-head,
  .lifecycle-transcript-head { align-items: flex-start; flex-direction: column; padding-block: 14px; }
  .lifecycle-worktree-list article { grid-template-columns: 32px 70px 1fr; }
  .lifecycle-transcript ol { grid-template-columns: 1fr; }
  .lifecycle-transcript li,
  .lifecycle-transcript li:nth-child(2) { border-right: 0; border-bottom: 1px solid var(--line); min-height: 0; }
  .lifecycle-transcript li:last-child { border-bottom: 0; }
  .evidence-document-head,
  .system-anatomy-head,
  .proof-contract-head { min-height: 0; padding-block: 14px; align-items: flex-start; flex-direction: column; }
  .evidence-row { grid-template-columns: 1fr; }
  .evidence-row > * { border-right: 0; padding-block: 9px; }
  .evidence-row > *:first-child { padding-top: 16px; }
  .evidence-row > *:last-child { padding-bottom: 16px; }
  .evidence-row-head { display: none; }
  .vellum-state-rail { grid-template-columns: 1fr 1fr; }
  .vellum-state-rail span:nth-child(2) { border-right: 0; }
  .vellum-state-rail span:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  body.utility-page .auth-main::before {
    grid-column: 1 / -1;
    min-height: 0;
    padding-bottom: 14px;
  }
  body.utility-page .auth-card { grid-column: 1 / -1; }
  body.utility-page .nav-inner > .btn-ghost { display: none; }
  .utility-footer-inner { align-items: flex-start; flex-direction: column; }
  .utility-footer nav { flex-wrap: wrap; }
  .error-main > * { grid-column: 1 / -1; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    /* Not a motion token: this is the kill switch, and the value has to
       be effectively zero. An earlier pass tokenised it to 140ms, which
       quietly turned animation back on for the readers who asked for it
       to stop. */
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
  .reveal, .rv { opacity: 1 !important; transform: none !important; transition: none !important; }
  [data-scene-steps] { --scene-progress: 1; }
  .vellum-cpu-frame { opacity: .76; transform: none; }
  body.vellum-page .vellum-hero-stage .hero-canvas { opacity: .22; }
  .vellum-stage-receipt { opacity: 1; transform: none; }
  .vellum-state-rail span { color: var(--ink-2); }
  .story-branch-field { display: none !important; }
  .nav-links a::after,
  .enav a::after { transition: none; }
}
}