/* Match the source styling while keeping narrow viewports usable. */
button { cursor: pointer; }
article, article p, article a, article td { overflow-wrap: anywhere; }
main > div > aside { display: none; }
@media (min-width: 1280px) { main > div > aside { display: block; } }
html { scroll-behavior: smooth; }
html.dark { color-scheme: dark; }
dialog { color: var(--foreground); background: var(--background); border: 1px solid var(--border); border-radius: 8px; padding: 0; }
dialog::backdrop { background: rgb(0 0 0 / .45); }
.docs-search { width: min(600px, calc(100vw - 32px)); margin: 12vh auto auto; max-height: 70vh; }
.docs-search-head { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--border); }
.docs-search-head input { width: 100%; min-width: 0; background: transparent; outline: none; font: inherit; }
.docs-icon { width: 20px; height: 20px; flex-shrink: 0; }
.docs-close { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 6px; color: var(--muted-foreground); }
.docs-close:hover { background: var(--muted); }
.docs-results { padding: 8px; max-height: 52vh; overflow-y: auto; }
.docs-result { display: block; padding: 12px; border-radius: 6px; }
.docs-result:hover, .docs-result:focus { background: var(--accent); outline: none; }
.docs-result strong { display: block; font-size: 14px; }
.docs-result p { margin-top: 4px; font-size: 13px; color: var(--muted-foreground); }
.docs-no-results { padding: 28px 12px; text-align: center; color: var(--muted-foreground); }
.docs-menu { margin: 0; width: min(320px, 88vw); height: 100dvh; max-height: 100dvh; border-radius: 0; }
.docs-menu-head { padding: 16px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--border); }
.docs-menu nav { padding: 24px 16px; }
.docs-active-section { color: var(--primary) !important; border-left-color: var(--primary) !important; }
.docs-copy { color: var(--muted-foreground); }
.docs-notice { position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); padding: 10px 16px; border: 1px solid var(--border); border-radius: 6px; color: var(--foreground); background: var(--background); z-index: 100; font-size: 14px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
