/* vaytric shared foundation.
   One font family, one palette, one radius scale, one accent. Every page links
   this so the tool, the guides and the landing cannot drift apart. */

@font-face{font-family:Geist;src:url(/f/Geist-Variable.woff2) format('woff2');
           font-weight:100 900;font-display:swap;font-style:normal}
@font-face{font-family:"Geist Mono";src:url(/f/GeistMono-Variable.woff2) format('woff2');
           font-weight:100 900;font-display:swap;font-style:normal}

:root{
  --bg:#0a0c11; --panel:#11141b; --rowhi:#161a23;
  --line:#1d2230; --line2:#2b3244;
  --ink:#edeff5; --dim:#949cad; --faint:#666e80;
  --accent:#e8b339; --accent2:#7aa7ff;
  --sans:Geist,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --r:10px;
}

*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);
     -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--accent2);text-decoration:none}
a:hover{text-decoration:underline}

/* Shared page chrome: the bar every page wears at the top. */
.vbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;
      padding:15px 0 13px;border-bottom:1px solid var(--line)}
.vbar .home{font-weight:650;font-size:15.5px;letter-spacing:-.02em;color:var(--ink)}
.vbar .home:hover{text-decoration:none;color:var(--accent)}
.vbar .sep{color:var(--faint);font-size:14px}
.vbar .where{color:var(--dim);font-size:13.5px}
.vbar .grow{margin-left:auto}
.vbar .grow a{color:var(--dim);font-size:13.5px;margin-left:18px}
.vbar .grow a:hover{color:var(--ink);text-decoration:none}
@media (max-width:560px){.vbar .grow a.opt{display:none}}