/* ==========================================================================
   vt99-tokens.css — Vault-Tec Mission Terminal II (variant99) foundation
   Layer 1 of the variant99 migration: design tokens, self-hosted variable
   fonts, base/reset/global rules, reduced-motion override.
   Primer reference: todo/new_design/primer/design-system-variant99.md §1–2, §22.
   ========================================================================== */

/* --------------------------------------------------------------------------
   @font-face — self-hosted VARIABLE fonts (Step 0.1 files), one file per
   family per subset (latin / cyrillic). font-weight uses range syntax.
   -------------------------------------------------------------------------- */

/* Manrope — display / headings / brand (wght 200–800) */
@font-face{
  font-family:"Manrope";
  font-style:normal;
  font-weight:200 800;
  font-display:swap;
  src:url("../fonts/manrope-var-cyrillic.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:"Manrope";
  font-style:normal;
  font-weight:200 800;
  font-display:swap;
  src:url("../fonts/manrope-var-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

/* Inter — body sans (wght 100–900) */
@font-face{
  font-family:"Inter";
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url("../fonts/inter-var-cyrillic.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:"Inter";
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url("../fonts/inter-var-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

/* JetBrains Mono — numbers / terminal labels / dates (wght 100–800) */
@font-face{
  font-family:"JetBrains Mono";
  font-style:normal;
  font-weight:100 800;
  font-display:swap;
  src:url("../fonts/jetbrains-mono-var-cyrillic.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:"JetBrains Mono";
  font-style:normal;
  font-weight:100 800;
  font-display:swap;
  src:url("../fonts/jetbrains-mono-var-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

/* --------------------------------------------------------------------------
   §1 Design tokens — primer §1 verbatim under the --vt-* namespace
   -------------------------------------------------------------------------- */
:root{
  /* surfaces */
  --vt-bg:#0c0f1a;            /* page canvas */
  --vt-bg-2:#101426;          /* drawer / secondary surface */
  --vt-panel:#121627;         /* card background */
  --vt-panel-2:#171c31;       /* raised surface, tooltips, drawer items */

  /* lines */
  --vt-line:rgba(147,164,255,.1);       /* standard border */
  --vt-line-soft:rgba(147,164,255,.06); /* hairline dividers */

  /* text tiers */
  --vt-text:#eef1fb;    /* primary */
  --vt-text-2:#9aa2c0;  /* secondary */
  --vt-text-3:#5d6584;  /* muted / labels */

  /* accent: blue (interactive) */
  --vt-blue:#3b6ef6; --vt-blue-2:#6d9bff;
  --vt-blue-glow:rgba(59,110,246,.16);

  /* accent: yellow (highlight / brand / rewards) */
  --vt-yellow:#ffd233; --vt-yellow-2:#ffe98a;
  --vt-yellow-glow:rgba(255,210,51,.14);

  /* accent: pip green (terminal LEDs, live status) */
  --vt-pip:#3dff88; --vt-pip-glow:rgba(61,255,136,.1);

  /* semantic states */
  --vt-green:#4ade80;   /* success/completed */
  --vt-red:#f87171;     /* error/incomplete */

  /* radii */
  --vt-r-lg:20px;  /* cards, hero, chart */
  --vt-r-md:14px;  /* inner elements, rows */

  /* fonts */
  --vt-disp:"Manrope",system-ui,sans-serif;                                  /* headings, brand */
  --vt-sans:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;           /* body */
  --vt-mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;          /* numbers, terminal labels, dates */
}

/* --------------------------------------------------------------------------
   §2 Base / Reset / Global — primer §2 verbatim except container class
   prefixed to .vt-wrap (avoid collision with legacy pages)
   -------------------------------------------------------------------------- */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--vt-bg);color:var(--vt-text);font-family:var(--vt-sans);font-size:15px;line-height:1.6;
     -webkit-font-smoothing:antialiased;overflow-x:hidden}
::selection{background:rgba(255,210,51,.3)}              /* yellow selection */
::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:var(--vt-bg)}
::-webkit-scrollbar-thumb{background:#232a45;border-radius:99px;border:2px solid var(--vt-bg)}
::-webkit-scrollbar-thumb:hover{background:var(--vt-yellow)} /* scrollbar turns yellow on hover */
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
svg{display:block}

/* container (prefixed .vt-wrap for variant99 pages) */
.vt-wrap{width:min(1280px,calc(100% - 44px));margin-inline:auto}

/* --------------------------------------------------------------------------
   §22 Accessibility — reduced-motion global override.
   NOTE: project rules forbid forced-specificity declarations, so this block is
   written as plain baseline rules without them.
   It still shortens durations globally as a baseline; every later vt99 sheet
   must additionally gate its own animations behind prefers-reduced-motion
   per migration-plan rule 4.
   -------------------------------------------------------------------------- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms;transition-duration:.01ms}
  html{scroll-behavior:auto}
}

/* --------------------------------------------------------------------------
   §10 Reveal-on-scroll utility (primer §10, registry item 3).
   Mechanism only — pages start opting in during Phases 4–5. JS (vt99.js)
   adds .in via IntersectionObserver with sibling stagger. Under reduced
   motion the hidden state is disabled entirely and JS reveals instantly.
   -------------------------------------------------------------------------- */
.reveal{opacity:0;transform:translateY(26px);
        transition:opacity .7s ease,transform .75s cubic-bezier(.22,1,.36,1)}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
}