/* site.css — the docs site's own rules, in the project layer the engine
   reserves for an app. Syntax highlighting is the engine's companion
   sheet static/highlight.css (loaded with static/highlight.js); this sheet
   holds only what the site alone needs. */
@layer project {
  :where(.site-menu) > :where(summary) { list-style: none; cursor: pointer; }
  :where(.site-menu) > :where(summary)::-webkit-details-marker { display: none; }
  :where(.pg-aside) > :where(.toc) { position: sticky; inset-block-start: 0; }
  :where(.demo-frame) { inline-size: 100%; aspect-ratio: 16 / 10; border: 1px solid var(--border); border-radius: var(--cfg-radius); background: var(--_bg); overflow: hidden; }
  :where(.demo-frame) > :where(iframe) { inline-size: 200%; block-size: 200%; border: 0; transform: scale(0.5); transform-origin: 0 0; pointer-events: none; }
}
