/* cryptoschool.cc colour system (2026-10-08). Every page maps its neutral colours onto these tokens (sites/cryptoschool.cc/theme.py).
   Light by default unless the visitor's device prefers dark; the top-bar switch saves the choice (localStorage "cs-theme").
   The top bar and the footer stay the dark brand frame in both modes; gold and other accents never change. */
:root, html[data-theme="light"] {
  --cs-page: #f3f4f6; --cs-card: #ffffff; --cs-card-2: #eceef2; --cs-text: #111827; --cs-text-2: #374151; --cs-muted: #6b7280;
  --cs-on-text: #ffffff; --cs-ink-rgb: 17, 24, 39; --cs-bg-rgb: 255, 255, 255; color-scheme: light;
}
html[data-theme="dark"] {
  --cs-page: #09090b; --cs-card: #18181b; --cs-card-2: #27272a; --cs-text: #f4f4f5; --cs-text-2: #d4d4d8; --cs-muted: #a1a1aa;
  --cs-on-text: #09090b; --cs-ink-rgb: 244, 244, 245; --cs-bg-rgb: 9, 9, 11; color-scheme: dark;
}
.cs-theme-btn {
  margin-left: 12px; flex: none; white-space: nowrap; cursor: pointer; font: 600 13px/1 Inter, system-ui, sans-serif;
  padding: 8px 12px; border-radius: 999px; background: transparent; color: rgba(255, 255, 255, .85);
  border: 1px solid rgba(255, 255, 255, .22);
}
.nav-inner .cs-theme-btn { margin-left: auto; }
.nav-inner .cs-theme-btn + .nav-cta { margin-left: 8px; }
/* the long menu: tighter on mid widths, and it scrolls sideways instead of pushing the switch and Join off the screen */
.nav-links { min-width: 0; overflow-x: auto; scrollbar-width: none; }
.nav-links::-webkit-scrollbar { display: none; }
.nav > .nav-inner { max-width: 1360px; }
@media (max-width: 1440px) { .nav-links .nav-link { padding-left: 8px; padding-right: 8px; } }
/* below 1340px the long menu cannot fit: use the page's own menu button (only where the page has the mobile menu) */
@media (max-width: 1339px) { .nav:has(.nav-mobile) .nav-links { display: none; } .nav:has(.nav-mobile) .nav-toggle { display: block; margin-left: 8px; } }
@media (max-width: 720px) { .nav-inner .cs-theme-btn { margin-left: auto; } .nav-inner .cs-theme-btn ~ .nav-toggle { margin-left: 8px; } }
.cs-theme-btn:hover { color: #fff; border-color: rgba(255, 255, 255, .45); }