/* Documentation and downloads only; game and controller pages keep their own styles. */
.doc-page { --doc-line: #aaa69e; --doc-surface: #ffffff60; }
.doc-page .skip-link { position: absolute; top: -80px; left: 20px; z-index: 100; padding: 12px 20px; background: var(--plastic-hi); }
.doc-page .skip-link:focus { top: 12px; }
.doc-page .doc-menu > summary { font-weight: 600; cursor: pointer; margin: 0 0 14px; }
.doc-page .doc-menu > label { display: block; }
.doc-page .doc-content { overflow-wrap: break-word; }
.doc-page .doc-content h2, .doc-page .doc-content h3, .doc-page .platform { scroll-margin-top: 96px; }
.doc-page .doc-content figure { margin: 24px 0; overflow: hidden; border-radius: 14px; background: #000; }
/* Diagrams draw their own light card; the black backdrop is for screenshots. */
.doc-page .doc-content figure.diagram { background: none; }
.doc-page .doc-content figure img { display: block; width: 100%; height: auto; }
.doc-page .doc-content figcaption { padding: 12px 16px; background: #161619; color: #c9c9d1; font-size: 13px; }
.doc-page .doc-content pre { white-space: pre-wrap; overflow-wrap: anywhere; }
.doc-page .doc-content code.sha { word-break: break-all; }
.doc-page .doc-content :not(pre) > code { overflow-wrap: anywhere; }
.doc-page .doc-content a.button { text-align: center; gap: 6px; }
.doc-page .doc-content .button small { font-size: 12px; white-space: nowrap; }
.doc-page .platform-jump { display: flex; flex-wrap: wrap; gap: 10px; margin: 24px 0; }
.doc-page .platform-jump a { display: inline-block; padding: 8px 16px; border: 1px solid var(--doc-line); border-radius: 30px; text-decoration: none; font-weight: 600; }
.doc-page .platform { padding-top: 8px; margin-top: 30px; border-top: 1px solid var(--doc-line); }
.doc-page .download-note { margin-top: 30px; padding: 16px; background: var(--doc-surface); border-radius: 12px; }
.doc-page [hidden] { display: none !important; }
@media (max-width: 900px) {
  .doc-page .doc-layout { gap: 18px; padding-top: 24px; }
  .doc-page .doc-sidebar { padding: 16px 20px; border-radius: 14px; }
  .doc-page .doc-menu:not([open]) > summary { margin: 0; }
  .doc-page .doc-menu[open] { max-height: 65vh; overflow: auto; }
  .doc-page .doc-content { padding: 28px 24px; }
}
@media (max-width: 640px) {
  .doc-page .doc-content h1 { font-size: 36px; }
  .doc-page .doc-content h2 { font-size: 28px; }
  .doc-page .doc-content ol, .doc-page .doc-content ul { padding-left: 22px; }
  .doc-page .doc-content .actions { flex-direction: column; align-items: stretch; }
  .doc-page .doc-content pre { padding: 15px; font-size: 12px; }
  .doc-page .doc-content table { font-size: 14px; }
  .doc-page .doc-content th, .doc-page .doc-content td { min-width: 95px; padding: 9px 8px; }
}
@media (prefers-color-scheme: dark) {
  .doc-page { --plastic: #222328; --plastic-hi: #303137; --plastic-lo: #111216; --ink: #f2f0e9; --ink-2: #cfced4; --ink-3: #b4b1bb; --blue: #a9c4ff; --doc-line: #55565e; --doc-surface: #3a3b42; color-scheme: dark; background: #222328; }
  .doc-page h1, .doc-page h2, .doc-page h3 { text-shadow: none; }
  .doc-page .topbar { background: #222328f5; border-bottom: 1px solid var(--doc-line); }
  .doc-page .panel { background: #2d2e34; box-shadow: inset 0 1px 0 #ffffff15, 0 12px 32px -24px #000; }
  .doc-page .wordmark { color: var(--ink); }
  .doc-page .doc-content details, .doc-page .doc-content blockquote { background: var(--doc-surface); }
  .doc-page .doc-content td, .doc-page .doc-content th, .doc-page .footer { border-color: var(--doc-line); }
  .doc-page .doc-group a:hover, .doc-page .doc-home:hover { background: #ffffff12; }
  .doc-page .doc-group a[aria-current] { background: #464750; }
}