/* The protocol page (protocol/index.html, written by tools/build.mjs from protocol/ride-v2.md): a long reference
   document in the site's type and colour. Tables scroll inside their own box, so the page never scrolls sideways. */

main > .doc { width: min(100% - 2 * var(--gutter), 860px); padding-block: var(--space-6); }
.doc-head { margin-bottom: var(--space-6); }
.doc-head .kicker a { color: inherit; text-decoration: none; }
.doc-head .kicker a:hover { text-decoration: underline; }
.doc-head h1 { font-size: var(--step-4); font-weight: 750; margin-bottom: var(--space-4); }
.doc-id { margin: calc(-1 * var(--space-2)) 0 var(--space-4); }
.doc-id code { font-size: var(--step-0); color: var(--accent); background: var(--card); border: 1px solid var(--rule); border-radius: 2px; padding: 0.1em 0.4em; }
.doc-lede { font-size: var(--step-1); line-height: 1.45; color: var(--ink-2); max-width: var(--measure); }
.doc-files { font-family: var(--font-label); font-size: var(--step--1); color: var(--ink-3); }
.doc-files a { color: var(--ink-3); }

.toc { margin-top: var(--space-5); padding: var(--space-4) var(--space-5); background: var(--card); border: 1px solid var(--rule); border-radius: var(--radius); }
.toc ol { margin: 0; padding-left: 1.4em; columns: 2 14rem; column-gap: var(--space-6); font-family: var(--font-label); font-size: var(--step--1); }
.toc li { break-inside: avoid; padding-block: 0.15em; }
.toc a { color: var(--ink-2); text-decoration: none; }
.toc a:hover { color: var(--ink); text-decoration: underline; }

.doc-body h2 { font-size: var(--step-2); margin: var(--space-7) 0 var(--space-3); padding-top: var(--space-4); border-top: 2px solid var(--ink); }
.doc-body h3 { font-size: var(--step-1); margin: var(--space-5) 0 var(--space-2); }
.doc-body .anchor { font-weight: 400; color: var(--ink-3); text-decoration: none; opacity: 0; margin-left: 0.2em; }
.doc-body h2:hover .anchor, .doc-body h3:hover .anchor, .doc-body .anchor:focus-visible { opacity: 1; }
.doc-body p, .doc-body ul, .doc-body ol { max-width: var(--measure); }
.doc-body ul, .doc-body ol { margin: 0 0 var(--space-4); padding-left: 1.3em; }
.doc-body li { margin-bottom: var(--space-2); }
.doc-body li > ul, .doc-body li > ol { margin: var(--space-2) 0 0; }
.doc-body :not(pre) > code { background: var(--card); border: 1px solid var(--rule); border-radius: 2px; padding: 0 0.25em; font-size: 0.82em; }

.doc-body .table { overflow-x: auto; margin: 0 0 var(--space-5); border-top: 1px solid var(--rule-strong); }
.doc-body table { border-collapse: collapse; width: 100%; font-size: var(--step--1); line-height: 1.4; }
.doc-body th, .doc-body td { text-align: left; vertical-align: top; padding: var(--space-2) var(--space-3) var(--space-2) 0; border-bottom: 1px solid var(--rule); }
.doc-body th { font-family: var(--font-label); font-weight: 600; color: var(--ink-2); white-space: nowrap; }
.doc-body td:first-child { min-width: 10rem; }
.doc-body td code { font-size: 0.9em; }
