/* Inter's faces are declared in app/src/styles/fonts.css, which the build resolves out of
   @fontsource-variable/inter. This file holds the tokens that use them. */

/* Design tokens shared by index.html and viewer.html (the standalone home viewer). */
/* ---------- tokens ----------
   One slate palette shared by the page, the inline diagram and the logo.
   ink #15181c | muted #737b85 | hairline #e3e6ea | strong hairline #c3c9d0
   slate #8591a9 | deep slate #5f6a80 | slate tint #dce0e7 | slate ink #363e4d */
:root{
  color-scheme:light;
  --bg:#f4f5f8;
  --surface:#ffffff;
  --surface-2:#eef0f3;
  --ink:#15181c;
  --ink-2:#4a5366;
  --ink-3:#737b85;
  --line:#e3e6ea;
  --line-strong:#c3c9d0;
  --slate:#8591a9;
  --accent:#5f6a80;
  --accent-soft:#dce0e7;
  --accent-deep:#363e4d;
  --base-bar:#b5bdcb;
  --note-bg:#fbf3d9;
  --note-line:#e6cf83;
  --note-ink:#6b520d;
  --todo-line:#c9a2a2;
  --todo-ink:#8a3b3b;
  --shadow:0 1px 2px rgba(21,24,33,.06),0 8px 24px rgba(21,24,33,.08);
  /* One typeface throughout. The three roles stay as separate tokens because the
     rules that use them differ in numerics and tracking, not in family. */
  --sans:"Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --display:var(--sans);
  --body:var(--sans);
  --mono:var(--sans);
  /* logo mark: frame, hub, and how much the hidden cube edges fade */
  --mark-frame:var(--slate);
  --mark-hub:var(--accent);
  --mark-far:.32;
  /* Yembo brand colors, from the guidelines at https://brand.yembo.ai. The slate palette
     above is the viewer's own, tuned for reading a scene beside it; these three are the
     marketing surface's, and only the link-error page uses them — a recipient whose link
     is dead never gets past that page, so it is the one screen that has to look like Yembo
     rather than like a tool. */
  --foundry:#0b111d;
  --canvas:#fcfcfc;
  --signal:#0a58c7;
  /* column widths: text and the wider media/widget track */
  --text-w:680px;
  --wide-w:1000px;
}
