/* Shared brand tokens and site shell. Page styles load before this file. */
:root {
  --bg:#08090c; --surface:#0d1117; --surface-2:#121820;
  --border:rgba(255,255,255,.08); --border-bright:rgba(255,255,255,.16);
  --text:#edf2f7; --text-muted:#9ba9b8; --text-dim:#8996a5;
  --accent:#00f5ff; --accent-dim:rgba(0,245,255,.08); --accent-glow:transparent;
  --green:var(--accent); --green-dim:var(--accent-dim);
  --red:#f43f5e; --red-dim:rgba(244,63,94,.09);
  --amber:#f59e0b; --yellow:#f59e0b; --yellow-dim:rgba(245,158,11,.08);
  --font-sans:'Inter',Arial,sans-serif; --font-mono:'JetBrains Mono',monospace;
  --content-width:1280px; --page-gutter:40px;
}
.site-page { margin:0; background:var(--bg); color:var(--text); font-family:var(--font-sans); -webkit-font-smoothing:antialiased; }
.site-page :is(h1,h2,h3) { font-family:var(--font-sans); letter-spacing:-.02em; }
.site-page :is(code,pre,kbd,samp) { font-family:var(--font-mono); }
.site-page :is(.container,.ci-wrap,.blog-shell,.blog-article,.site-header-inner,.site-footer-container,.site-breadcrumb) {
  width:min(calc(100% - var(--page-gutter) * 2),var(--content-width)); margin-inline:auto; padding-inline:0;
}
.site-page .site-header { background:#08090cf5; border-color:var(--border); font-family:var(--font-sans); padding:18px 0; }
.site-page .site-header :is(h2,h3,p), .site-page .site-footer-link { font-family:var(--font-sans); }
.site-page :is(.topnav-link,.mega-label,.mega-tags,.site-footer,.site-footer-label,.site-footer-legal a) { font-family:var(--font-mono); }
.site-page :is(.product-menu,.mega-card,.mega-more,.mega-icon) { border-radius:3px; background:var(--surface); border-color:var(--border); }
.site-page .site-footer { background:var(--bg); border-color:var(--border); text-align:left; width:100%; margin:0; padding:40px 0; }
.site-page .site-footer * { box-sizing:border-box; }
.site-page .site-footer-nav { margin:0; padding:0; }
.site-page .site-footer-label { margin:0 0 16px; }
.site-page .site-footer-link { text-decoration:none; }
.site-page .site-footer-legal a { color:var(--text-muted); }
.site-page .site-header-context { width:min(calc(100% - var(--page-gutter) * 2),var(--content-width)); margin-inline:auto; padding-inline:0; }
.site-page :focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
@media(max-width:767px) { :root { --page-gutter:16px; } }
