/* The web app's palette (wasm/web/index.html in the Foresight repo), laid over
   tokens.css: blue-black surfaces, blue accent, teal/red for up/down. Loaded
   wherever the web app is shown (webapp_visible); when the web app goes public
   these values move into tokens.css and this file goes. */
:root {
  --bg: #0a0c10; --bg-2: #0d0f14;
  --surface: #141a24; --surface-2: #1b2230;
  --border: #232b39; --border-2: #2c3648; --border-3: #2f4a70;
  --fg: #f1f4f8; --fg-2: #d8dee9; --muted: #8a97ab; --dim: #7f8ca0;
  --accent: #4f9cf9; --accent-2: #3b82e0; --accent-soft: #4f9cf91a;
  --up: #26a69a; --down: #ef5350;
}
body { background-image: radial-gradient(ellipse at 75% 0%, #16284780, transparent 48%); }
.btn-primary, nav.site-nav a.btn-primary { color: #050810; }
.btn-primary:hover { background: #7bb5fb; border-color: #7bb5fb; color: #050810; }
.docs-content a { color: var(--accent); }

/* The brand as the web app's top bar draws it: the FS mark tinted like the
   text, then the name at the app's size and weight. */
.fs-brand { display: inline-flex; align-items: center; gap: 9px; text-decoration: none; }
.fs-brand .fs-mark { width: 31px; height: 22px; background: var(--fg);
  -webkit-mask: url("../img/logo-mark.5e697b393f90.png") center / contain no-repeat; mask: url("../img/logo-mark.5e697b393f90.png") center / contain no-repeat; }
.fs-brand .fs-word { font: 600 15px/1.45 system-ui, -apple-system, "Segoe UI", sans-serif; letter-spacing: .02em;
  color: var(--fg); text-transform: none; }
