/* ============================================================================
ExoAtlas Documentation — shared stylesheet
One file for the /documentation/ hub, /documentation/concepts/, and every
app section. Loaded after /assets/css/style.css (site chrome).
The site stylesheet uses hard-coded colors (no global custom properties),
so the docs palette is defined here as --docs-* variables and kept
consistent with the site's existing accents (#2563eb / #1d4ed8 from
updates.css, #3b82f6 focus ring from style.css). All colors are explicit
so pages stay legible under both values of .
============================================================================ */
:root {
--docs-accent: #2563eb;
--docs-accent-strong: #1d4ed8;
--docs-text: #333333;
--docs-text-muted: #6b7280;
--docs-heading: #111827;
--docs-border: #e5e7eb;
--docs-bg: #ffffff;
--docs-bg-subtle: #f8fafc;
--docs-bg-code: #f3f4f6;
--docs-pro-text: #92400e;
--docs-pro-bg: #fef3c7;
--docs-pro-border: #fcd34d;
--docs-warn-text: #7f1d1d;
--docs-warn-bg: #fef2f2;
--docs-warn-border: #fecaca;
--docs-note-text: #1e3a5f;
--docs-note-bg: #eff6ff;
--docs-note-border: #bfdbfe;
--docs-sidebar-w: 260px;
--docs-toc-w: 200px;
--docs-gap: 32px;
}
/* ---------------------------------------------------------------------------
Layout grid: sidebar / content / on-this-page TOC
≥1200px: three columns. 900–1199px: sidebar + content. <900px: single
column; the sidebar collapses to a "Documentation menu" bar.
--------------------------------------------------------------------------- */
.docs-layout {
display: grid;
grid-template-columns: var(--docs-sidebar-w) minmax(0, 1fr) var(--docs-toc-w);
gap: var(--docs-gap);
max-width: 1400px;
margin: 0 auto;
padding: 24px 20px 64px;
box-sizing: border-box;
color: var(--docs-text);
background: var(--docs-bg);
}
@media (max-width: 1199px) {
.docs-layout { grid-template-columns: var(--docs-sidebar-w) minmax(0, 1fr); }
.docs-toc { display: none; }
}
@media (max-width: 899px) {
.docs-layout { grid-template-columns: minmax(0, 1fr); padding: 12px 14px 48px; }
}
/* ---------------------------------------------------------------------------
Ad-flanked page shell
The two