/* Generated by scripts/build_public_docs.py from docs-site/render/tes-public.css. Edit the source, not this copy. */
/* Presentation for the generated TES public pages. Source asset read by
   scripts/build_public_docs.py and published as the generated copy
   docs-site/public/assets/tes-public.css (ADR-0018 HTMX shell contract). */

    .lang-fallback {
      margin: 2rem 0;
      padding: 1rem 1.25rem;
      border: 1px solid var(--line, #ccc);
      border-radius: 8px;
      font-size: 0.95rem;
    }

    :root {
      color-scheme: light;
      --paper: #f0f7f4;
      --paper-deep: #dcebea;
      --ink: #161215;
      --ink-soft: #3a302c;
      --ink-faint: #8b7d78;
      --rule: #b8cfca;
      --rule-soft: #d2e3df;
      --accent: #2f7f84;
      --accent-deep: #235f63;
      --accent-soft: #99e1d9;
      --warn: #b86a3a;
      --mono-bg: #161215;
      --mono-fg: #f0f7f4;
      --mono-muted: #b7c9c5;
      --font-display: "Fraunces", ui-serif, Georgia, "Times New Roman", serif;
      --font-body: "Newsreader", ui-serif, Georgia, "Times New Roman", serif;
      --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
      --col-margin: 220px;
      --col-content: 760px;
      --col-aside: 280px;
      --gap: 32px;
      --speed-fast: 180ms;
      --speed-base: 320ms;
      --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
    }

    *, *::before, *::after { box-sizing: border-box; }
    html, body { margin: 0; padding: 0; }
    html { scroll-behavior: smooth; }
    body {
      background: var(--paper);
      color: var(--ink);
      font-family: var(--font-body);
      font-size: 17px;
      font-weight: 400;
      line-height: 1.65;
      text-rendering: optimizeLegibility;
      -webkit-font-smoothing: antialiased;
    }
    body::before {
      background:
        radial-gradient(1200px 600px at 100% -10%, rgba(194, 65, 12, 0.06), transparent 60%),
        radial-gradient(800px 400px at -10% 30%, rgba(154, 52, 18, 0.04), transparent 60%);
      content: "";
      inset: 0;
      pointer-events: none;
      position: fixed;
      z-index: 0;
    }
    body.nav-open { overflow: hidden; }
    img, picture, svg { display: block; max-width: 100%; }
    button {
      background: none;
      border: 0;
      color: inherit;
      cursor: pointer;
      font: inherit;
      padding: 0;
    }
    a {
      color: var(--accent);
      text-decoration: none;
      text-decoration-color: transparent;
      text-decoration-thickness: 1px;
      text-underline-offset: 3px;
      transition: text-decoration-color var(--speed-fast) var(--ease);
    }
    a:hover { text-decoration: underline; }
    :focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
    code {
      background: var(--paper-deep);
      border: 1px solid var(--rule-soft);
      border-radius: 3px;
      font-family: var(--font-mono);
      font-size: .86em;
      padding: 1px 5px;
      white-space: nowrap;
    }
    code.flash-fry-stamp { background: #15100f; border-color: rgba(219, 151, 48, .72); box-shadow: inset 0 0 0 1px rgba(255, 218, 135, .08); color: #ffd47a; font-weight: 800; letter-spacing: .015em; }

    .skip {
      background: var(--ink);
      color: var(--paper);
      font-family: var(--font-mono);
      font-size: 12px;
      left: 12px;
      padding: 8px 12px;
      position: absolute;
      top: -100px;
      z-index: 100;
    }
    .skip:focus { top: 12px; }
    .visually-hidden { clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }
    .layout, .page {
      display: grid;
      grid-template-columns: var(--col-margin) minmax(0, 1fr);
      min-height: 100vh;
      position: relative;
      z-index: 1;
    }
    .rail {
      border-right: 1px solid var(--rule-soft);
      display: flex;
      flex-direction: column;
      height: 100vh;
      position: sticky;
      top: 0;
    }
    .nav-bar {
      align-items: center;
      border-bottom: 1px solid var(--rule-soft);
      display: flex;
      flex-shrink: 0;
      gap: 16px;
      justify-content: space-between;
      padding: 24px 24px 20px;
    }
    .nav-toggle { display: none; }
    .rail-inner {
      flex: 1;
      overflow-y: auto;
      padding: 24px 24px 32px;
    }
    .rail-inner::-webkit-scrollbar { width: 6px; }
    .rail-inner::-webkit-scrollbar-thumb { background: var(--rule); border-radius: 3px; }
    .scrim {
      background: rgba(26, 24, 20, .32);
      inset: 64px 0 0;
      opacity: 0;
      pointer-events: none;
      position: fixed;
      transition: opacity var(--speed-base) var(--ease);
      z-index: 50;
    }
    .scrim.is-open {
      opacity: 1;
      pointer-events: auto;
    }
    .stage {
      max-width: calc(var(--col-content) + var(--col-aside) + var(--gap));
      padding: 56px 64px 96px;
      position: relative;
      width: 100%;
    }

    .brand { flex: 1; min-width: 0; }
    .brand-mark {
      align-items: baseline;
      color: var(--ink);
      display: inline-flex;
      font-family: var(--font-display);
      font-size: 19px;
      font-weight: 500;
      gap: 6px;
      letter-spacing: -.01em;
      line-height: 1;
    }
    .brand-mark em { color: var(--accent); font-style: normal; }
    .brand-meta {
      color: var(--ink-faint);
      display: block;
      font-family: var(--font-mono);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: .08em;
      margin-top: 6px;
      text-transform: uppercase;
      white-space: nowrap;
    }
    .toc { padding-top: 8px; }
    .toc-title {
      color: var(--ink-faint);
      font-family: var(--font-mono);
      font-size: 10px;
      letter-spacing: .14em;
      margin: 0 0 16px;
      text-transform: uppercase;
    }
    .toc ul { list-style: none; margin: 0; padding: 0; }
    .toc li { position: relative; }
    .toc a {
      align-items: baseline;
      color: var(--ink-soft);
      display: flex;
      font-family: var(--font-body);
      font-size: 14px;
      gap: 12px;
      line-height: 1.4;
      padding: 7px 0 7px 16px;
      position: relative;
      transition: color var(--speed-fast) var(--ease), padding-left var(--speed-fast) var(--ease);
    }
    .toc a::before {
      background: var(--accent);
      content: "";
      height: 0;
      left: 0;
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      transition: height var(--speed-fast) var(--ease);
      width: 2px;
    }
    .toc a:hover {
      color: var(--ink);
      padding-left: 22px;
      text-decoration: none;
    }
    .toc a[aria-current="true"] {
      color: var(--ink);
      font-weight: 500;
    }
    .toc a[aria-current="true"]::before { height: 18px; }
    .toc-num {
      color: var(--ink-faint);
      font-family: var(--font-mono);
      font-size: 11px;
      font-weight: 500;
      letter-spacing: .04em;
      min-width: 22px;
    }
    .toc a[aria-current="true"] .toc-num { color: var(--accent); }
    .toc-text { color: inherit; font-family: inherit; font-size: inherit; }

    .lang-section { display: none; }
    .lang-section.is-active { display: block; }
    .language-row {
      align-items: center;
      display: flex;
      flex-wrap: wrap;
      gap: 15px;
      margin-bottom: 34px;
    }
    .language-row::before {
      background: var(--accent);
      content: "";
      height: 1px;
      width: 46px;
    }
    .lang-btn {
      color: var(--ink-faint);
      font-family: var(--font-mono);
      font-size: 11px;
      font-weight: 500;
      letter-spacing: .16em;
      text-transform: uppercase;
    }
    .lang-btn[aria-pressed="true"] { color: var(--accent); }
    .lang-btn + .lang-btn::before {
      color: var(--ink-faint);
      content: "·";
      margin-right: 15px;
    }
    .language-mark {
      color: var(--accent);
      font-family: var(--font-mono);
      font-size: 11px;
      letter-spacing: .18em;
      text-transform: uppercase;
    }
    .masthead {
      border-bottom: 1px solid var(--rule);
      margin: 0 0 56px;
      padding: 0 0 40px;
    }
    .eyebrow {
      color: var(--accent);
      font-family: var(--font-mono);
      font-size: 11px;
      font-weight: 500;
      letter-spacing: .2em;
      margin: 0 0 30px;
      text-transform: uppercase;
    }
    .display-h1 {
      font-family: var(--font-display);
      font-size: clamp(48px, 6vw, 84px);
      font-variation-settings: "opsz" 144, "wght" 400, "SOFT" 50;
      letter-spacing: -.025em;
      line-height: .96;
      margin: 0 0 24px;
      max-width: 940px;
    }
    .display-h1 em {
      color: var(--accent);
      font-style: italic;
      font-variation-settings: "opsz" 144, "wght" 350, "SOFT" 80;
    }
    .lead {
      color: var(--ink-soft);
      font-family: var(--font-body);
      font-size: 21px;
      font-weight: 300;
      line-height: 1.5;
      margin: 0;
      max-width: 640px;
    }
    h2, h3 {
      font-family: var(--font-display);
      font-weight: 450;
      letter-spacing: -.015em;
      line-height: 1.1;
      margin: 0;
    }

    .hero-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      margin-top: 34px;
    }
    .btn {
      border: 1px solid var(--ink);
      color: var(--ink);
      display: inline-flex;
      font-family: var(--font-mono);
      font-size: 11px;
      font-weight: 700;
      justify-content: center;
      letter-spacing: .16em;
      min-width: 150px;
      padding: 13px 18px;
      text-transform: uppercase;
    }
    .btn-primary {
      background: var(--ink);
      border-color: var(--ink);
      color: var(--paper);
    }
    .hero-facts {
      border-bottom: 1px solid var(--rule-soft);
      border-top: 1px solid var(--rule-soft);
      display: grid;
      gap: 24px;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      margin-top: 48px;
      padding: 24px 0;
    }
    .hero-fact span {
      color: var(--ink-faint);
      display: block;
      font-family: var(--font-mono);
      font-size: 10px;
      letter-spacing: .14em;
      margin-bottom: 7px;
      text-transform: uppercase;
    }
    .hero-fact strong { font-size: 18px; font-weight: 600; }
    .hero-visual {
      margin: 34px 0 36px;
    }
    .hero-visual img {
      display: block;
      width: 100%;
    }

    .chapter {
      margin: 0 0 64px;
      position: relative;
      scroll-margin-top: 92px;
    }
    .chapter-head {
      align-items: baseline;
      border-top: 1px solid var(--rule);
      display: grid;
      gap: 24px;
      grid-template-columns: 60px minmax(0, 1fr);
      margin: 0 0 24px;
      padding-top: 28px;
    }
    .chapter-num {
      color: var(--accent);
      font-family: var(--font-mono);
      font-size: 13px;
      font-weight: 500;
      letter-spacing: .04em;
    }
    .chapter h2 {
      font-size: clamp(28px, 3vw, 38px);
      font-variation-settings: "opsz" 96, "wght" 450;
    }
    .chapter-body {
      display: grid;
      gap: var(--gap);
      grid-template-columns: minmax(0, 1fr);
      padding-left: 84px;
    }
    .chapter-body > p,
    .chapter-body > ol,
    .chapter-body > ul,
    .chapter-body > .note,
    .chapter-body > .side-note {
      max-width: var(--col-content);
    }
    .chapter-body .lede {
      color: var(--ink);
      font-size: 17px;
      margin: 0;
    }
    .public-manual .chapter:first-of-type .lede::first-letter {
      color: var(--accent);
      float: left;
      font-family: var(--font-display);
      font-size: 64px;
      font-variation-settings: "opsz" 144, "wght" 500;
      line-height: .85;
      margin: 6px 10px -2px 0;
    }
    .chapter-body ol,
    .chapter-body ul {
      list-style: none;
      margin: 0;
      padding: 0;
    }
    .chapter-body ol { counter-reset: step; }
    .chapter-body ol li {
      counter-increment: step;
      margin: 0 0 14px;
      padding-left: 38px;
      position: relative;
    }
    .chapter-body ol li::before {
      color: var(--accent);
      content: counter(step, decimal-leading-zero);
      font-family: var(--font-mono);
      font-size: 12px;
      font-weight: 500;
      left: 0;
      letter-spacing: .04em;
      position: absolute;
      top: 4px;
    }
    .chapter-body ul li {
      margin: 0 0 8px;
      padding-left: 22px;
      position: relative;
    }
    .chapter-body ul li::before {
      background: var(--accent);
      content: "";
      height: 1px;
      left: 0;
      position: absolute;
      top: .85em;
      width: 12px;
    }
    .note {
      border-left: 3px solid var(--warn);
      color: var(--ink-soft);
      margin: 0 0 24px;
      padding: 8px 0 8px 18px;
    }
    .side-note {
      border-left: 3px solid var(--accent);
      margin: 4px 0 24px;
      padding: 14px 0 14px 22px;
    }
    .side-note-title {
      color: var(--accent);
      font-family: var(--font-mono);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: .16em;
      margin: 0 0 6px;
      text-transform: uppercase;
    }
    .side-note p { margin: 0; }
    .card-grid {
      display: grid;
      gap: 18px;
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
      margin: 0 0 24px;
      max-width: calc(var(--col-content) + 120px);
    }
    .info-card {
      border-top: 3px solid var(--accent);
      padding: 16px 0 0;
    }
    .info-card h3 { font-size: 22px; margin-bottom: 8px; }
    .info-card p { color: var(--ink-soft); margin: 0; }
    .source-map {
      display: grid;
      gap: 28px;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      margin: 0 0 28px;
      max-width: calc(var(--col-content) + var(--col-aside));
    }
    .source-group {
      border-top: 1px solid var(--rule);
      padding-top: 18px;
    }
    .source-group h3 {
      font-size: 24px;
      margin: 0 0 8px;
    }
    .source-group > p {
      color: var(--ink-soft);
      font-size: 17px;
      line-height: 1.45;
      margin: 0 0 16px;
    }
    .source-group ul {
      list-style: none;
      margin: 0;
      padding: 0;
    }
    .source-group li {
      border-bottom: 1px solid var(--rule-soft);
      margin: 0;
      padding: 12px 0;
    }
    .chapter-body .source-group li {
      padding-left: 0;
    }
    .chapter-body .source-group li::before {
      content: none;
    }
    .source-link {
      color: var(--ink);
      display: inline-block;
      font-weight: 650;
      text-decoration: none;
    }
    .source-link::after {
      color: var(--accent);
      content: " ->";
      font-family: var(--font-mono);
      font-size: .72em;
      white-space: nowrap;
    }
    .source-link:hover {
      color: var(--accent);
      text-decoration: none;
    }
    .source-link-body,
    .source-link-meta {
      color: var(--ink-soft);
      display: block;
      font-size: 15px;
      line-height: 1.42;
      margin-top: 3px;
    }
    .source-link-meta {
      color: var(--ink-faint);
      font-family: var(--font-mono);
      font-size: 10px;
      letter-spacing: .12em;
      text-transform: uppercase;
    }
    .table-wrap {
      margin: 0 0 24px;
      max-width: calc(var(--col-content) + var(--col-aside));
      overflow-x: auto;
    }
    table { border-collapse: collapse; width: 100%; }
    th {
      border-bottom: 2px solid var(--ink);
      font-family: var(--font-mono);
      font-size: 12px;
      letter-spacing: .08em;
      padding: 10px 16px 10px 0;
      text-align: left;
      text-transform: uppercase;
    }
    td {
      border-bottom: 1px solid var(--rule-soft);
      padding: 14px 16px 14px 0;
      vertical-align: top;
    }
    td:first-child { white-space: nowrap; width: 1%; }
    .pre-wrap {
      background: var(--mono-bg);
      color: var(--mono-fg);
      margin: 0 0 24px;
      max-width: calc(var(--col-content) + var(--col-aside));
      overflow: hidden;
      position: relative;
    }
    .pre-wrap::before {
      color: var(--accent-soft);
      content: attr(data-label);
      display: block;
      font-family: var(--font-mono);
      font-size: 10px;
      letter-spacing: .16em;
      padding: 14px 64px 0 18px;
      text-transform: uppercase;
    }
    .copy-btn {
      border: 1px solid rgba(240, 247, 244, .34);
      color: var(--mono-fg);
      font-family: var(--font-mono);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: .12em;
      padding: 7px 10px;
      text-transform: uppercase;
      transition: background var(--speed-fast) var(--ease), color var(--speed-fast) var(--ease);
    }
    .copy-btn:hover,
    .copy-btn:focus-visible {
      background: var(--mono-fg);
      color: var(--mono-bg);
      text-decoration: none;
    }
    .code-copy-btn { align-items: center; border-color: rgba(240, 247, 244, .26); display: inline-flex; height: 34px; justify-content: center; padding: 0; position: absolute; right: 14px; top: 12px; width: 34px; z-index: 2; }
    .code-copy-btn svg { fill: none; height: 17px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; width: 17px; }
    .code-copy-btn.is-copied { background: var(--mono-fg); color: var(--mono-bg); }
    pre {
      font-family: var(--font-mono);
      font-size: 13px;
      line-height: 1.65;
      margin: 0;
      overflow-x: auto;
      padding: 14px 64px 18px 18px;
      white-space: pre-wrap;
    }
    pre code { background: transparent; border: 0; color: inherit; padding: 0; white-space: inherit; }
    .link-grid {
      display: grid;
      gap: 10px;
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
      margin: 0 0 24px;
      max-width: calc(var(--col-content) + 120px);
    }
    .doc-link {
      border: 1px solid var(--rule-soft);
      color: var(--ink);
      display: block;
      padding: 14px 16px;
    }
    .doc-link::after {
      color: var(--accent);
      content: " ->";
      font-family: var(--font-mono);
      font-size: .78em;
      white-space: nowrap;
    }
    body[data-view="landing"] #doc-view,
    #doc-view[hidden] {
      display: none;
    }
    body[data-view="doc"] .lang-section,
    body[data-view="doc"] .footer {
      display: none;
    }
    #doc-view {
      margin: 0 auto;
      max-width: calc(var(--col-content) + var(--col-aside) + var(--gap));
    }
    .doc-topbar {
      align-items: center;
      border-bottom: 1px solid var(--rule);
      display: flex;
      gap: 24px;
      justify-content: space-between;
      margin-bottom: 46px;
      padding-bottom: 20px;
    }
    .doc-back {
      align-items: center;
      color: var(--ink);
      display: inline-flex;
      font-family: var(--font-mono);
      font-size: 11px;
      gap: 8px;
      letter-spacing: .16em;
      text-transform: uppercase;
    }
    .doc-back:hover {
      color: var(--accent);
      text-decoration: none;
    }
    .doc-meta {
      color: var(--ink-faint);
      display: flex;
      flex-wrap: wrap;
      font-family: var(--font-mono);
      font-size: 11px;
      gap: 10px;
      letter-spacing: .16em;
      text-transform: uppercase;
    }
    .doc-source {
      color: var(--ink-faint);
      font-family: var(--font-mono);
      font-size: 10px;
      letter-spacing: .16em;
      margin: 0 0 28px;
      text-transform: uppercase;
    }
    #doc-content {
      counter-reset: doc-h2;
    }
    #doc-content h1 {
      font-family: var(--font-display);
      font-size: clamp(48px, 6vw, 72px);
      font-weight: 400;
      letter-spacing: -.025em;
      line-height: .98;
      margin: 0 0 22px;
      max-width: 880px;
    }
    #doc-content > .doc-lede {
      color: var(--ink-soft);
      font-size: 22px;
      font-weight: 300;
      line-height: 1.5;
      margin: 0 0 48px;
      max-width: 760px;
    }
    #doc-content h2 {
      border-top: 1px solid var(--rule);
      counter-increment: doc-h2;
      font-family: var(--font-display);
      font-size: clamp(30px, 3.2vw, 42px);
      font-weight: 450;
      letter-spacing: -.015em;
      line-height: 1.1;
      margin: 52px 0 20px;
      padding-top: 28px;
    }
    #doc-content h2::before {
      color: var(--accent);
      content: "§ " counter(doc-h2, decimal-leading-zero) "  ";
      font-family: var(--font-mono);
      font-size: 12px;
      font-weight: 500;
      letter-spacing: .08em;
    }
    #doc-content h3 {
      font-family: var(--font-display);
      font-size: 24px;
      font-weight: 500;
      margin: 32px 0 10px;
    }
    #doc-content h4 {
      font-family: var(--font-display);
      font-size: 18px;
      font-weight: 500;
      margin: 28px 0 8px;
    }
    #doc-content p {
      font-size: 17px;
      line-height: 1.7;
      margin: 0 0 16px;
      max-width: 64ch;
    }
    #doc-content ul,
    #doc-content ol {
      list-style: revert;
      margin: 0 0 18px;
      max-width: 64ch;
      padding-left: 28px;
    }
    #doc-content li {
      font-size: 17px;
      line-height: 1.7;
      margin: 0 0 6px;
    }
    #doc-content blockquote {
      border-left: 3px solid var(--accent);
      color: var(--ink-soft);
      font-family: var(--font-display);
      font-size: 19px;
      font-style: italic;
      line-height: 1.45;
      margin: 24px 0;
      max-width: 760px;
      padding: 4px 0 4px 24px;
    }
    #doc-content table {
      margin: 24px 0;
    }
    #doc-content code { font-size: 14px; }
    #doc-content pre {
      margin: 24px 0;
      max-width: calc(var(--col-content) + var(--col-aside));
    }
    #doc-content hr {
      border: 0;
      border-top: 1px solid var(--rule);
      margin: 56px 0;
    }
    .doc-toc {
      background: var(--paper-soft, var(--paper-deep));
      border: 1px solid var(--rule);
      margin: 0 0 48px;
      max-width: 760px;
      padding: 22px 28px;
    }
    .doc-toc-head {
      color: var(--ink-faint);
      font-family: var(--font-mono);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: .14em;
      margin: 0 0 12px;
      text-transform: uppercase;
    }
    .doc-toc ol {
      counter-reset: toc;
      list-style: none;
      margin: 0;
      padding: 0;
    }
    .doc-toc li {
      counter-increment: toc;
      font-size: 15px;
      line-height: 1.5;
      padding: 4px 0 4px 36px;
      position: relative;
    }
    .doc-toc li::before {
      color: var(--accent);
      content: counter(toc, decimal-leading-zero);
      font-family: var(--font-mono);
      font-size: 11px;
      left: 0;
      letter-spacing: .04em;
      position: absolute;
      top: 6px;
    }
    .doc-toc a { color: var(--ink-soft); }
    .doc-toc a:hover { color: var(--ink); }
    #doc-skeleton {
      padding: 32px 0;
    }
    .skeleton-line {
      background: linear-gradient(90deg, var(--paper-deep) 0%, var(--paper) 50%, var(--paper-deep) 100%);
      background-size: 200% 100%;
      height: 24px;
      margin-bottom: 16px;
    }
    .skeleton-line.title {
      height: 56px;
      margin-bottom: 32px;
      max-width: 70%;
    }
    .skeleton-line.short { max-width: 40%; }
    .skeleton-line.medium { max-width: 80%; }
    @keyframes skeleton-shine {
      from { background-position: 200% 0; }
      to { background-position: -200% 0; }
    }
    .skeleton-line { animation: skeleton-shine 1.6s linear infinite; }
    .doc-error {
      background: var(--paper-deep);
      border: 1px solid var(--warn);
      border-left-width: 4px;
      font-family: var(--font-mono);
      font-size: 13px;
      line-height: 1.6;
      margin: 32px 0;
      max-width: 760px;
      padding: 24px 28px;
    }
    .footer {
      border-top: 1px solid var(--rule);
      color: var(--ink-faint);
      margin: 64px 0 0;
      padding-top: 18px;
    }
    .footer-copy {
      color: var(--ink-soft);
      font-family: var(--font-body);
      font-size: 21px;
      font-weight: 300;
      letter-spacing: 0;
      line-height: 1.5;
      margin: 0 0 24px;
      max-width: var(--col-content);
      text-transform: none;
    }
    .footer-meta {
      display: flex;
      flex-wrap: wrap;
      font-family: var(--font-mono);
      font-size: 11px;
      gap: 16px;
      justify-content: space-between;
      letter-spacing: .06em;
      text-transform: uppercase;
    }
    .footer-meta code {
      font-size: 10px;
      letter-spacing: 0;
      overflow-wrap: anywhere;
      text-transform: none;
    }

    .public-index .layout {
      display: block;
    }
    .public-index .rail {
      background: var(--paper);
      border-bottom: 0;
      border-right: 0;
      display: block;
      height: 72px;
      margin: 0;
      max-width: none;
      padding: 0;
      position: sticky;
      top: 0;
      width: 100%;
      z-index: 60;
    }
    .public-index .nav-bar {
      align-items: center;
      background: var(--paper);
      border-bottom: 1px solid var(--rule-soft);
      display: flex;
      height: 72px;
      justify-content: space-between;
      margin: 0 auto;
      max-width: calc(var(--col-content) + var(--col-aside) + var(--gap));
      padding: 0 64px;
      position: relative;
      z-index: 70;
      width: 100%;
    }
    .public-index .rail-inner {
      background: var(--paper);
      border-bottom: 1px solid var(--rule);
      inset: 72px 0 auto;
      max-height: calc(100vh - 72px);
      overflow-y: auto;
      padding: 34px max(28px, calc((100vw - 1072px) / 2)) 38px;
      position: fixed;
      transform: translateY(-110%);
      transition: transform var(--speed-base) var(--ease);
      z-index: 55;
    }
    .public-index .rail-inner.is-open { transform: translateY(0); }
    .public-index .scrim { inset: 72px 0 0; }
    .public-index .toc { padding-top: 8px; }
    .public-index .toc-title { display: block; }
    .public-index .toc-num { display: inline-block; }
    .public-index .toc ul {
      display: grid;
      gap: 10px 34px;
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    }
    .public-index .toc a {
      display: flex;
      font-family: var(--font-body);
      font-size: 15px;
      letter-spacing: 0;
      padding: 7px 0 7px 16px;
      text-transform: none;
    }
    .public-index .toc a::before { display: block; }
    .public-index .toc a:hover { padding-left: 22px; }
    .public-index .nav-toggle {
      align-items: center;
      background: var(--paper);
      border: 1px solid var(--ink);
      border-radius: 0;
      color: var(--ink);
      display: inline-flex;
      height: 40px;
      justify-content: center;
      padding: 0;
      transition: background var(--speed-fast) var(--ease), color var(--speed-fast) var(--ease);
      width: 56px;
    }
    .public-index .nav-toggle:hover,
    .public-index .nav-toggle[aria-expanded="true"] {
      background: var(--ink);
      color: var(--paper);
    }
    .public-index .nav-toggle span {
      background: currentColor;
      display: block;
      height: 1.5px;
      position: relative;
      transition: transform var(--speed-base) var(--ease), opacity var(--speed-fast) var(--ease);
      width: 22px;
    }
    .public-index .nav-toggle span::before,
    .public-index .nav-toggle span::after {
      background: currentColor;
      content: "";
      display: block;
      height: 1.5px;
      left: 0;
      position: absolute;
      transition: transform var(--speed-base) var(--ease);
      width: 22px;
    }
    .public-index .nav-toggle span::before { top: -7px; }
    .public-index .nav-toggle span::after { top: 7px; }
    .public-index .nav-toggle[aria-expanded="true"] span { background: transparent; }
    .public-index .nav-toggle[aria-expanded="true"] span::before { transform: translateY(7px) rotate(45deg); }
    .public-index .nav-toggle[aria-expanded="true"] span::after { transform: translateY(-7px) rotate(-45deg); }
    .public-index .stage {
      margin: 0 auto;
      max-width: calc(var(--col-content) + var(--col-aside) + var(--gap));
      padding-top: 72px;
      width: calc(100% - 128px);
    }
    .public-index .masthead { padding-bottom: 84px; }

    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after {
        animation-duration: .01ms !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
      }
    }
    @media (max-width: 1180px) {
      :root { --col-margin: 200px; }
      .stage { padding: 48px 48px 80px; }
      .chapter-body { padding-left: 0; }
      .chapter-head { grid-template-columns: 48px minmax(0, 1fr); }
      .public-index .stage { width: calc(100% - 96px); }
      .public-index .nav-bar { padding: 0 48px; }
    }
    @media (max-width: 960px) {
      .layout, .page {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
      }
      .rail,
      .public-index .rail {
        background: var(--paper);
        border-bottom: 1px solid var(--rule-soft);
        border-right: 0;
        display: block;
        height: auto;
        margin: 0;
        max-width: none;
        padding: 0;
        position: sticky;
        top: 0;
        width: 100%;
        z-index: 60;
      }
      .nav-bar,
      .public-index .nav-bar {
        align-items: center;
        background: var(--paper);
        border-bottom: 0;
        display: flex;
        height: 64px;
        padding: 0 20px;
        position: relative;
        z-index: 70;
      }
      .nav-bar .brand-meta { display: none; }
      .rail-inner,
      .public-index .rail-inner {
        background: var(--paper);
        border-bottom: 1px solid var(--rule);
        inset: 64px 0 auto;
        max-height: calc(100vh - 64px);
        overflow-y: auto;
        padding: 28px 28px 32px;
        position: fixed;
        transform: translateY(-110%);
        transition: transform var(--speed-base) var(--ease);
        z-index: 55;
      }
      .public-index .scrim { inset: 64px 0 0; }
      .rail-inner.is-open { transform: translateY(0); }
      .public-index .toc,
      .toc { padding-top: 8px; }
      .public-index .toc-title,
      .public-index .toc-num { display: inline-block; }
      .public-index .toc-title { display: block; }
      .public-index .toc ul {
        display: block;
      }
      .public-index .toc a {
        display: flex;
        font-family: var(--font-body);
        font-size: 15px;
        letter-spacing: 0;
        padding: 7px 0 7px 16px;
        text-transform: none;
      }
      .public-index .toc a::before { display: block; }
      .public-index .toc a:hover { padding-left: 22px; }
      .nav-toggle {
        align-items: center;
        background: var(--paper);
        border: 1px solid var(--ink);
        border-radius: 0;
        color: var(--ink);
        display: inline-flex;
        height: 40px;
        justify-content: center;
        padding: 0;
        transition: background var(--speed-fast) var(--ease), color var(--speed-fast) var(--ease);
        width: 56px;
      }
      .nav-toggle:hover,
      .nav-toggle[aria-expanded="true"] {
        background: var(--ink);
        color: var(--paper);
      }
      .nav-toggle span {
        background: currentColor;
        display: block;
        height: 1.5px;
        position: relative;
        transition: transform var(--speed-base) var(--ease), opacity var(--speed-fast) var(--ease);
        width: 22px;
      }
      .nav-toggle span::before,
      .nav-toggle span::after {
        background: currentColor;
        content: "";
        display: block;
        height: 1.5px;
        left: 0;
        position: absolute;
        transition: transform var(--speed-base) var(--ease);
        width: 22px;
      }
      .nav-toggle span::before { top: -7px; }
      .nav-toggle span::after { top: 7px; }
      .nav-toggle[aria-expanded="true"] span { background: transparent; }
      .nav-toggle[aria-expanded="true"] span::before { transform: translateY(7px) rotate(45deg); }
      .nav-toggle[aria-expanded="true"] span::after { transform: translateY(-7px) rotate(-45deg); }
      .stage,
      .public-index .stage {
        padding: 32px 24px 64px;
        width: 100%;
      }
      .masthead {
        margin-bottom: 40px;
        padding-bottom: 28px;
      }
      .chapter { margin-bottom: 48px; }
      .chapter-head {
        gap: 16px;
        grid-template-columns: 36px minmax(0, 1fr);
        padding-top: 22px;
      }
      .hero-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .source-map { grid-template-columns: 1fr; }
      code { white-space: normal; }
    }
    @media (max-width: 560px) {
      .stage,
      .public-index .stage {
        padding: 24px 18px 56px;
      }
      .display-h1 {
        font-size: 44px;
        line-height: .98;
      }
      .lead { font-size: 18px; }
      .chapter h2 { font-size: 26px; }
      .chapter-body ol li { padding-left: 32px; }
      .language-mark {
        display: block;
        flex-basis: 100%;
        margin-top: 8px;
      }
      .hero-facts { grid-template-columns: 1fr; }
      th { font-size: 11px; padding-right: 12px; }
      td { padding-right: 12px; }
      pre { font-size: 12px; }
    }