html.docs-root {
  height: auto;
  min-height: 100%;
  overflow: auto;
  overscroll-behavior: auto;
  scroll-behavior: smooth;
}

body.docs-page {
  height: auto;
  min-height: 100vh;
  padding: clamp(16px, 4vw, 42px) 12px;
  overflow: visible;
  overscroll-behavior: auto;
}

.docs-window {
  width: min(1120px, 100%);
  margin: 0 auto;
  border: 1px solid #555;
  outline: 2px solid #d8d5cc;
  background: #d7d4cb;
  box-shadow: 7px 9px 0 rgba(35, 35, 30, .18);
}

.docs-title-bar {
  position: sticky;
  z-index: 20;
  top: 0;
  display: grid;
  height: 28px;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 7px;
  padding: 3px 5px;
  border-bottom: 1px solid #555;
  background: #e2e0d9;
}

.docs-window-controls { display: flex; gap: 3px; }

.docs-window-controls a,
.docs-window-controls span {
  display: block;
  width: 12px;
  height: 12px;
  border: 1px solid #555;
  background: #d8d5cc;
  box-shadow: inset 1px 1px #fff, inset -1px -1px #999;
}

.docs-window-controls a:hover,
.docs-window-controls a:focus-visible {
  background: #efede6;
  outline: 1px dotted #111;
  outline-offset: -3px;
}

.docs-title-stripes {
  height: 13px;
  background: repeating-linear-gradient(to bottom, #9e9c95 0, #9e9c95 1px, transparent 1px, transparent 3px);
}

.docs-title-bar p {
  margin: 0;
  font: 8px/1 'Geist Pixel', 'Courier New', monospace;
  letter-spacing: .08em;
  white-space: nowrap;
}

.docs-command-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 1px;
  padding: 1px;
  border-bottom: 1px solid #666;
  background: #77756e;
}

.docs-command-bar span {
  flex: 1 1 180px;
  padding: 6px 9px;
  background: #d8d5cc;
  color: #55534d;
  font: 7px/1.2 'Courier New', Courier, monospace;
  letter-spacing: .05em;
}

.docs-hero {
  padding: clamp(28px, 5vw, 54px);
  border-bottom: 1px solid #77756e;
  background-color: #f1efe8;
  background-image: radial-gradient(#d5d2c9 .6px, transparent .6px);
  background-size: 4px 4px;
}

.docs-kicker {
  margin: 0 0 10px;
  color: #5c5a53;
  font: 8px/1.3 'Geist Pixel', 'Courier New', monospace;
  letter-spacing: .08em;
}

.docs-hero h1 {
  position: static;
  overflow: visible;
  width: auto;
  height: auto;
  margin: 0 0 18px;
  clip: auto;
  color: #171717;
  font: 400 clamp(34px, 7vw, 64px)/1 'Geist Pixel', 'Courier New', monospace;
  letter-spacing: .16em;
}

.docs-lead {
  max-width: 760px;
  margin: 0;
  font: 700 13px/1.65 'Courier New', Courier, monospace;
}

.docs-status {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 1px;
  margin-top: 25px;
  padding: 1px;
  border: 1px solid #77756e;
  background: #77756e;
}

.docs-status strong,
.docs-status p { margin: 0; padding: 11px 12px; background: #e4e1d8; }

.docs-status strong {
  display: grid;
  place-items: center;
  color: #5a574f;
  font: 9px/1.4 'Geist Pixel', 'Courier New', monospace;
  letter-spacing: .06em;
  text-align: center;
}

.docs-status p { font: 10px/1.6 'Courier New', Courier, monospace; }

.docs-deployment {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 1px;
  margin-top: 5px;
  padding: 1px;
  border: 1px solid #77756e;
  background: #77756e;
}

.docs-deployment strong,
.docs-deployment a {
  min-width: 0;
  padding: 9px 11px;
  background: #e4e1d8;
}

.docs-deployment strong {
  color: #5a574f;
  font: 8px/1.4 'Geist Pixel', 'Courier New', monospace;
  text-align: center;
}

.docs-deployment a {
  overflow-wrap: anywhere;
  color: #34234f;
  font: 9px/1.4 'Courier New', Courier, monospace;
}

.docs-facts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  margin: 26px 0 0;
  padding: 1px;
  background: #77756e;
  font-family: 'Courier New', Courier, monospace;
}

.docs-facts div { min-width: 0; padding: 10px; background: #e5e2da; }
.docs-facts dt { margin-bottom: 4px; color: #66635c; font-size: 7px; }
.docs-facts dd { overflow: hidden; margin: 0; font-size: 9px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }

.docs-layout {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  align-items: start;
  background: #f1efe8;
}

.docs-sidebar {
  position: sticky;
  top: 28px;
  max-height: calc(100vh - 28px);
  padding: 22px 14px;
  overflow: auto;
  border-right: 1px solid #77756e;
  background: #d8d5cc;
}

.docs-sidebar-title {
  margin: 0 0 10px;
  color: #56544e;
  font: 9px/1 'Geist Pixel', 'Courier New', monospace;
  letter-spacing: .08em;
}

.docs-sidebar nav { display: grid; gap: 1px; padding: 1px; background: #8b8880; }

.docs-sidebar nav a {
  display: grid;
  grid-template-columns: 28px 1fr;
  align-items: center;
  min-height: 28px;
  padding-right: 7px;
  background: #e5e2da;
  color: #171717;
  font: 8px/1.2 'Courier New', Courier, monospace;
  text-decoration: none;
}

.docs-sidebar nav a span {
  display: grid;
  align-self: stretch;
  place-items: center;
  margin-right: 7px;
  border-right: 1px solid #aaa79f;
  color: #68655e;
}

.docs-sidebar nav a:hover,
.docs-sidebar nav a:focus-visible { background: #f4f2ec; outline: 1px dotted #111; outline-offset: -4px; }

.docs-sidebar-note {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 7px;
  margin-top: 15px;
  padding: 9px;
  border: 1px solid #8b8880;
  background: #e5e2da;
}

.docs-sidebar-note p { margin: 0; color: #5c5a53; font: 7px/1.4 'Courier New', Courier, monospace; }
.docs-status-light { width: 8px; height: 8px; border: 1px solid #34332f; background: #567a52; box-shadow: inset 1px 1px #8fab8a, 1px 1px #fff; }

.docs-content {
  min-width: 0;
  padding: clamp(24px, 5vw, 58px);
  background-color: #f1efe8;
  background-image: radial-gradient(#d5d2c9 .6px, transparent .6px);
  background-size: 4px 4px;
}

.docs-section { scroll-margin-top: 44px; padding: 0 0 48px; }
.docs-section + .docs-section { padding-top: 44px; border-top: 1px solid #aaa79f; }
.docs-section:last-child { padding-bottom: 0; }

.docs-section-heading {
  display: grid;
  grid-template-columns: 34px 1fr;
  align-items: stretch;
  gap: 1px;
  margin-bottom: 22px;
  padding: 1px;
  background: #77756e;
}

.docs-section-heading span,
.docs-section-heading h2 { margin: 0; background: #dedbd3; }
.docs-section-heading span { display: grid; place-items: center; color: #65625b; font: 9px/1 'Courier New', Courier, monospace; }
.docs-section-heading h2 { padding: 10px 12px; font: 400 16px/1.2 'Geist Pixel', 'Courier New', monospace; letter-spacing: .04em; }

.docs-content p,
.docs-content li,
.docs-content td,
.docs-content th,
.docs-content dd { font-family: 'Courier New', Courier, monospace; }
.docs-content p { margin: 0 0 16px; font-size: 11px; line-height: 1.72; }
.docs-content h3 { margin: 26px 0 9px; color: #4f4d47; font: 400 10px/1.3 'Geist Pixel', 'Courier New', monospace; letter-spacing: .06em; text-transform: uppercase; }
.docs-content code { padding: 1px 3px; background: #e1ded5; font: .95em 'Courier New', Courier, monospace; }

.docs-note { display: grid; grid-template-columns: 130px 1fr; gap: 1px; margin-top: 22px; padding: 1px; background: #77756e; }
.docs-note strong,
.docs-note p { margin: 0; padding: 11px; background: #e5e2da; }
.docs-note strong { display: grid; place-items: center; font: 8px/1.3 'Geist Pixel', 'Courier New', monospace; text-align: center; }

.docs-table-wrap { overflow-x: auto; margin: 20px 0; border: 1px solid #77756e; }
.docs-table-wrap table { width: 100%; min-width: 590px; border-collapse: collapse; background: #e9e6de; }
.docs-table-wrap th,
.docs-table-wrap td { padding: 10px; border-right: 1px solid #aaa79f; border-bottom: 1px solid #aaa79f; font-size: 9px; line-height: 1.55; text-align: left; vertical-align: top; }
.docs-table-wrap th { background: #d8d5cc; color: #55534d; font: 700 8px/1.4 'Geist Pixel', 'Courier New', monospace; letter-spacing: .04em; }
.docs-table-wrap tr:last-child td { border-bottom: 0; }
.docs-table-wrap th:last-child,
.docs-table-wrap td:last-child { border-right: 0; }
.docs-numeric td:not(:first-child) { white-space: nowrap; }

.docs-flow { display: grid; gap: 3px; max-width: 620px; margin: 22px auto 30px; }
.docs-flow div { display: grid; grid-template-columns: 155px 1fr; align-items: center; min-height: 44px; border: 1px solid #77756e; background: #e5e2da; }
.docs-flow small { align-self: stretch; display: grid; place-items: center; padding: 8px; border-right: 1px solid #aaa79f; color: #66635c; font: 7px/1.3 'Courier New', Courier, monospace; text-align: center; }
.docs-flow strong { padding: 10px 13px; font: 9px/1.35 'Geist Pixel', 'Courier New', monospace; }
.docs-flow i { color: #77756e; font: normal 12px/1 'Courier New', Courier, monospace; text-align: center; }

.docs-steps { display: grid; gap: 1px; margin: 20px 0; padding: 1px; background: #8b8880; list-style: none; }
.docs-steps li { display: grid; grid-template-columns: 38px 1fr; background: #e5e2da; }
.docs-steps li > span { display: grid; place-items: center; border-right: 1px solid #aaa79f; color: #66635c; }
.docs-steps li > div { padding: 10px 12px; }
.docs-steps strong { display: block; margin-bottom: 4px; font: 9px/1.3 'Geist Pixel', 'Courier New', monospace; }
.docs-steps p { margin: 0; font-size: 9px; }

.docs-grid { display: grid; gap: 10px; margin: 20px 0; }
.docs-grid-two { grid-template-columns: repeat(2, 1fr); }
.docs-grid-three { grid-template-columns: repeat(3, 1fr); }
.docs-card { padding: 14px; border: 1px solid #8b8880; background: #e5e2da; box-shadow: inset 1px 1px #fff; }
.docs-card h3 { margin: 0 0 8px; }
.docs-card p { margin: 0; font-size: 9px; }
.docs-card ul { margin: 0; padding-left: 17px; }
.docs-card li { margin: 4px 0; font-size: 9px; line-height: 1.4; }

.docs-columns { columns: 2; gap: 30px; margin: 15px 0 0; padding-left: 18px; }
.docs-columns li { break-inside: avoid; margin: 5px 0; font-size: 10px; line-height: 1.5; }

.docs-policy-list { display: grid; gap: 1px; margin: 20px 0; padding: 1px; background: #77756e; }
.docs-policy-list > div { display: grid; grid-template-columns: 36px 180px 1fr; align-items: center; background: #e5e2da; }
.docs-policy-list span { display: grid; align-self: stretch; place-items: center; border-right: 1px solid #aaa79f; color: #66635c; font: 8px/1 'Courier New', Courier, monospace; }
.docs-policy-list h3 { margin: 0; padding: 11px; border-right: 1px solid #aaa79f; font-size: 8px; }
.docs-policy-list p { margin: 0; padding: 11px; font-size: 9px; }

.docs-state-machine { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr auto 1fr; align-items: stretch; gap: 4px; margin: 24px 0; }
.docs-state-machine > div { display: grid; align-content: start; min-width: 0; padding: 10px 8px; border: 1px solid #77756e; background: #e5e2da; text-align: center; }
.docs-state-machine span { color: #66635c; font: 6px/1.2 'Courier New', Courier, monospace; }
.docs-state-machine strong { margin: 7px 0; font: 8px/1.2 'Geist Pixel', 'Courier New', monospace; }
.docs-state-machine small { font: 7px/1.35 'Courier New', Courier, monospace; }
.docs-state-machine i { display: grid; place-items: center; color: #77756e; font: normal 10px/1 'Courier New', Courier, monospace; }

.docs-content pre { overflow-x: auto; margin: 12px 0 22px; padding: 14px; border: 1px solid #77756e; background: #302f2b; color: #f2f0ea; box-shadow: inset 2px 2px #171717, inset -1px -1px #777; }
.docs-content pre code { padding: 0; background: transparent; color: inherit; font: 9px/1.7 'Courier New', Courier, monospace; }

.docs-glossary { display: grid; gap: 1px; margin: 0; padding: 1px; background: #77756e; }
.docs-glossary div { display: grid; grid-template-columns: 150px 1fr; background: #e5e2da; }
.docs-glossary dt,
.docs-glossary dd { margin: 0; padding: 10px; font-size: 9px; line-height: 1.5; }
.docs-glossary dt { border-right: 1px solid #aaa79f; font-weight: 700; }

.docs-footer { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 15px; min-height: 42px; padding: 7px 10px; border-top: 1px solid #555; background: #dedbd3; color: #56544e; font: 7px/1.3 'Courier New', Courier, monospace; }
.docs-footer nav { display: flex; gap: 10px; }
.docs-footer a { color: #171717; text-decoration: none; }
.docs-footer a:hover,
.docs-footer a:focus-visible { outline: 1px dotted #111; outline-offset: 2px; }

/* Collection color and hand-built motion layer */
body.docs-page {
  background-color: #ddd9cf;
  background-image:
    linear-gradient(135deg, rgba(57, 115, 95, .08), transparent 28%),
    linear-gradient(315deg, rgba(118, 77, 146, .08), transparent 32%),
    radial-gradient(#c8c3b7 .7px, transparent .7px);
  background-size: auto, auto, 4px 4px;
}

.docs-window-controls a { background: #a8d2bd; border-color: #39735f; }
.docs-window-controls span { background: #d89b78; border-color: #8f4e32; }

.docs-command-bar span:nth-child(1) { border-left: 4px solid #39735f; }
.docs-command-bar span:nth-child(2) { border-left: 4px solid #315d84; }
.docs-command-bar span:nth-child(3) { border-left: 4px solid #765f32; }

.docs-hero-grid {
  display: block;
}

.docs-hero-copy { min-width: 0; }

.docs-signal-rail {
  display: grid;
  grid-template-columns: auto minmax(12px, 1fr) auto minmax(12px, 1fr) auto minmax(12px, 1fr) auto minmax(12px, 1fr) auto;
  align-items: center;
  gap: 5px;
  margin-top: 14px;
  padding: 7px;
  border: 1px solid #77756e;
  background: #d8d5cc;
  box-shadow: inset 1px 1px #fff;
}

.docs-signal-rail span {
  padding: 5px 7px;
  border: 1px solid #55534d;
  background: #f0ede5;
  color: #34332f;
  font: 7px/1 'Geist Pixel', 'Courier New', monospace;
  text-align: center;
  white-space: nowrap;
}

.docs-signal-rail span:nth-of-type(1) { border-color: #39735f; color: #285544; }
.docs-signal-rail span:nth-of-type(2) { border-color: #315d84; color: #315d84; }
.docs-signal-rail span:nth-of-type(3) { border-color: #765f32; color: #765f32; }
.docs-signal-rail span:nth-of-type(4) { border-color: #764d92; color: #633f7c; }
.docs-signal-rail span:nth-of-type(5) { border-color: #8f4e32; color: #7a3e28; }

.docs-signal-rail i {
  position: relative;
  overflow: hidden;
  height: 5px;
  background: repeating-linear-gradient(to right, #9b978e 0 3px, transparent 3px 6px);
}

.docs-signal-rail i::after {
  content: '';
  position: absolute;
  top: 0;
  left: -5px;
  width: 5px;
  height: 5px;
  background: #315d84;
  animation: docs-packet 2.4s steps(8, end) infinite;
}

.docs-signal-rail i:nth-of-type(2)::after { animation-delay: .3s; background: #765f32; }
.docs-signal-rail i:nth-of-type(3)::after { animation-delay: .6s; background: #764d92; }
.docs-signal-rail i:nth-of-type(4)::after { animation-delay: .9s; background: #8f4e32; }

.docs-facts div { border-top: 3px solid #77756e; }
.docs-facts div:nth-child(1) { border-top-color: #39735f; }
.docs-facts div:nth-child(2) { border-top-color: #315d84; }
.docs-facts div:nth-child(3) { border-top-color: #765f32; }
.docs-facts div:nth-child(4) { border-top-color: #764d92; }
.docs-facts div:nth-child(5) { border-top-color: #8f4e32; }
.docs-facts div:nth-child(6) { border-top-color: #567a52; }

.docs-operators {
  margin-top: 15px;
  padding: 8px;
  border: 1px solid #8b8880;
  background: #e5e2da;
}

.docs-operators > p {
  margin: 0 0 7px;
  color: #5c5a53;
  font: 7px/1 'Geist Pixel', 'Courier New', monospace;
  letter-spacing: .06em;
}

.docs-operators > div { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; }
.docs-operators figure { min-width: 0; margin: 0; border: 1px solid #55534d; background: #d8d5cc; box-shadow: 2px 2px 0 rgba(35, 35, 30, .12); animation: docs-id-jitter 7s steps(1, end) infinite; }
.docs-operators figure:nth-child(2) { animation-delay: -2.3s; }
.docs-operators figure:nth-child(3) { animation-delay: -4.6s; }
.docs-operators img { display: block; width: 100%; height: auto; border-bottom: 1px solid #55534d; image-rendering: pixelated; }
.docs-operators figcaption { padding: 4px 2px; color: #55534d; font: 6px/1 'Courier New', Courier, monospace; text-align: center; }
.docs-operators figure:nth-child(1) figcaption { background: #c9ddd4; }
.docs-operators figure:nth-child(2) figcaption { background: #cbd9e3; }
.docs-operators figure:nth-child(3) figcaption { background: #d9cde0; }

.docs-section { --section-accent: #39735f; --section-soft: #c9ddd4; }
.docs-section:nth-of-type(5n + 2) { --section-accent: #315d84; --section-soft: #cbd9e3; }
.docs-section:nth-of-type(5n + 3) { --section-accent: #765f32; --section-soft: #e2d7b8; }
.docs-section:nth-of-type(5n + 4) { --section-accent: #764d92; --section-soft: #d9cde0; }
.docs-section:nth-of-type(5n + 5) { --section-accent: #8f4e32; --section-soft: #e2cbc0; }

.docs-section-heading { background: var(--section-accent); box-shadow: 3px 3px 0 color-mix(in srgb, var(--section-accent) 22%, transparent); }
.docs-section-heading span { background: var(--section-accent); color: #f7f4ec; }
.docs-section-heading h2 { background: linear-gradient(90deg, var(--section-soft), #dedbd3 34%); }
.docs-section .docs-note strong { background: var(--section-soft); color: color-mix(in srgb, var(--section-accent) 82%, #171717); }
.docs-section .docs-card { border-top: 3px solid var(--section-accent); }
.docs-section .docs-steps li > span { background: var(--section-soft); color: var(--section-accent); font-weight: 700; }
.docs-section .docs-policy-list span { background: var(--section-soft); color: var(--section-accent); }

.docs-flow i {
  color: #315d84;
  animation: docs-flow-pulse 1.4s steps(2, end) infinite;
}

.docs-state-machine > div {
  animation: docs-stage-cycle 5s steps(1, end) infinite;
}

.docs-state-machine > div:nth-of-type(2) { animation-delay: 1s; }
.docs-state-machine > div:nth-of-type(3) { animation-delay: 2s; }
.docs-state-machine > div:nth-of-type(4) { animation-delay: 3s; }
.docs-state-machine > div:nth-of-type(5) { animation-delay: 4s; }

.docs-status-light { animation: docs-signal-blink 1.2s steps(2, end) infinite; }

@keyframes docs-signal-blink {
  0%, 49% { opacity: 1; }
  50%, 100% { opacity: .3; }
}

@keyframes docs-packet {
  from { left: -5px; }
  to { left: calc(100% + 5px); }
}

@keyframes docs-id-jitter {
  0%, 89%, 100% { transform: translate(0, 0); }
  90%, 93% { transform: translate(1px, -1px); }
  94%, 97% { transform: translate(-1px, 0); }
}

@keyframes docs-flow-pulse {
  0%, 49% { opacity: .28; }
  50%, 100% { opacity: 1; }
}

@keyframes docs-stage-cycle {
  0%, 19% { background: #d8e5ef; box-shadow: inset 0 0 0 2px #315d84; }
  20%, 100% { background: #e5e2da; box-shadow: none; }
}

@media (max-width: 820px) {
  .docs-facts { grid-template-columns: repeat(2, 1fr); }
  .docs-layout { grid-template-columns: 1fr; }
  .docs-sidebar { position: static; max-height: none; border-right: 0; border-bottom: 1px solid #77756e; }
  .docs-sidebar nav { grid-template-columns: repeat(3, 1fr); }
  .docs-operators { width: 220px; }
  .docs-state-machine { grid-template-columns: 1fr; }
  .docs-state-machine i { min-height: 12px; transform: rotate(90deg); }
}

@media (max-width: 620px) {
  body.docs-page { padding: 8px; }
  .docs-title-bar { grid-template-columns: auto 1fr; }
  .docs-title-bar p { display: none; }
  .docs-hero { padding: 28px 20px; }
  .docs-hero h1 { font-size: 34px; }
  .docs-lead { font-size: 11px; }
  .docs-status { grid-template-columns: 1fr; }
  .docs-status strong { place-items: start; text-align: left; }
  .docs-deployment { grid-template-columns: 1fr; }
  .docs-deployment strong { text-align: left; }
  .docs-signal-rail { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1px; }
  .docs-signal-rail i { display: none; }
  .docs-signal-rail span { overflow: hidden; padding: 6px 2px; font-size: 6px; text-overflow: ellipsis; }
  .docs-facts { grid-template-columns: 1fr 1fr; }
  .docs-sidebar nav { grid-template-columns: repeat(2, 1fr); }
  .docs-content { padding: 28px 18px; }
  .docs-grid-two,
  .docs-grid-three { grid-template-columns: 1fr; }
  .docs-columns { columns: 1; }
  .docs-note { grid-template-columns: 1fr; }
  .docs-note strong { place-items: start; text-align: left; }
  .docs-flow div { grid-template-columns: 110px 1fr; }
  .docs-policy-list > div { grid-template-columns: 34px 1fr; }
  .docs-policy-list h3 { border-right: 0; }
  .docs-policy-list p { grid-column: 2; border-top: 1px solid #aaa79f; }
  .docs-glossary div { grid-template-columns: 1fr; }
  .docs-glossary dt { border-right: 0; border-bottom: 1px solid #aaa79f; }
  .docs-footer { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .docs-signal-rail i::after,
  .docs-operators figure,
  .docs-flow i,
  .docs-state-machine > div,
  .docs-status-light { animation: none; }
}