/* Reuse the homepage shell, stacks, lists and questions without a separate theme. */
.gates-page > * { min-width: 0; }
.gates-video { display: block; width: min(100%, 480px); margin: 0 auto; }
.gates-video img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: contain; }
.gates-prose { min-width: 0; overflow-wrap: anywhere; }
.gates-prose :not(pre) > code { background: var(--hover); padding: 2px 4px; font-size: var(--font-size-small); overflow-wrap: anywhere; }
.gates-prose pre { min-width: 0; max-width: 100%; overflow-x: auto; padding: var(--space-4); border: var(--border-style); background: var(--surface); }
.gates-prose pre code { font-size: var(--font-size-small); }
/* Keep semantic current-page state, but match the homepage's plain nav links. */
.gates-page .site-nav a[aria-current="page"] { color: var(--fg); background: transparent; font-weight: var(--font-weight); }

.gates-prose ol { margin: 0; padding-left: var(--space-5); }
.gates-prose ol li + li { margin-top: var(--space-3); }

.gates-mailbox-diagram { display: block; width: 100%; height: auto; }

/* Compact disclosures without changing the homepage FAQ or its typography. */
.gates-page .question { display: block; padding: 0; }
.gates-page .question > summary { min-height: 44px; padding: 14px 20px; overflow-wrap: anywhere; }
.gates-page .question > summary:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.gates-page .question > p { margin: 0; padding: 0 20px 16px; }

/* Match the documentation syntax palette within GATES code blocks only. */
.gates-prose .hljs-keyword, .gates-prose .hljs-selector-tag, .gates-prose .hljs-literal { color: #8c278d; }
.gates-prose .hljs-string, .gates-prose .hljs-regexp, .gates-prose .hljs-addition { color: #246c42; }
.gates-prose .hljs-number, .gates-prose .hljs-symbol, .gates-prose .hljs-bullet { color: #a04e05; }
.gates-prose .hljs-comment, .gates-prose .hljs-quote { color: #66717d; font-style: italic; }
.gates-prose .hljs-title, .gates-prose .hljs-section, .gates-prose .hljs-title.function_ { color: #075caa; }
.gates-prose .hljs-built_in, .gates-prose .hljs-type, .gates-prose .hljs-title.class_ { color: #9a4719; }
.gates-prose .hljs-attr, .gates-prose .hljs-attribute, .gates-prose .hljs-property, .gates-prose .hljs-variable { color: #005f87; }
.gates-prose .hljs-meta { color: #6b4290; }
.gates-prose .hljs-deletion { color: #b32424; }