/* ───────────────────────────────────────────────────────────────────────── */
/*  VirtualLife AI Imagine — Typography Tokens                                */
/*  TT Rounds Neue (display/UI) · JetBrains Mono (code) · Source Serif 4      */
/* ───────────────────────────────────────────────────────────────────────── */

/* TT Rounds Neue — the primary brand typeface. Geometric rounded sans, loaded
   from the variable TTF shipped with the app (weight axis 100–900).           */
@font-face {
  font-family: "TT Rounds Neue";
  src: url("../assets/fonts/TT-Rounds-Neue-Variable.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* Webfont companions (mono + serif). Declared via @font-face from a stable CDN
   (Fontsource woff2) so the families resolve without a Google Fonts <link>.
   If you'd rather self-host, drop the binaries in assets/fonts/ and swap the
   src url() targets — keep the family names exactly as-is.                     */
@font-face {
  font-family: "JetBrains Mono";
  src: url("https://cdn.jsdelivr.net/fontsource/fonts/jetbrains-mono@latest/latin-400-normal.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "JetBrains Mono";
  src: url("https://cdn.jsdelivr.net/fontsource/fonts/jetbrains-mono@latest/latin-500-normal.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "JetBrains Mono";
  src: url("https://cdn.jsdelivr.net/fontsource/fonts/jetbrains-mono@latest/latin-700-normal.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif 4";
  src: url("https://cdn.jsdelivr.net/fontsource/fonts/source-serif-4@latest/latin-400-normal.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif 4";
  src: url("https://cdn.jsdelivr.net/fontsource/fonts/source-serif-4@latest/latin-600-normal.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ── Font families ──────────────────────────────────────────────────── */
  --font-sans:
    "TT Rounds Neue", "Plus Jakarta Sans", "Inter", system-ui, -apple-system,
    sans-serif;
  --font-mono:
    "JetBrains Mono", "Cascadia Code", "Fira Code", ui-monospace, monospace;
  --font-serif: "Source Serif 4", "Georgia", "Times New Roman", serif;

  /* ── Base ───────────────────────────────────────────────────────────── */
  /* The app runs at a compact 0.825rem base — desktop-app density, not web.  */
  --font-size-base: 0.825rem;
  --line-height-base: 1.5;

  /* ── Type scale (rem) ───────────────────────────────────────────────── */
  --text-2xs: 0.65rem;   /* badge text, status captions, mono labels        */
  --text-xs: 0.7rem;     /* meta, breadcrumbs, secondary captions           */
  --text-sm: 0.8rem;     /* dense UI text, table cells                      */
  --text-base: 0.825rem; /* body default                                    */
  --text-md: 0.875rem;   /* buttons, inputs, emphasised body                */
  --text-lg: 1rem;       /* card titles, section labels                     */
  --text-xl: 1.1rem;     /* sidebar logo, dialog titles                     */
  --text-2xl: 1.35rem;   /* page section titles                            */
  --text-3xl: 1.8rem;    /* page-header H2                                  */
  --text-4xl: 2.2rem;    /* hero headline                                  */

  /* ── Weights ────────────────────────────────────────────────────────── */
  --weight-normal: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-extrabold: 800;

  /* ── Letter-spacing ─────────────────────────────────────────────────── */
  --tracking-tight: -0.03em;  /* large display headings                     */
  --tracking-snug: -0.02em;   /* section + logo                             */
  --tracking-normal: 0;
  --tracking-wide: 0.05em;    /* uppercase table headers                    */
  --tracking-wider: 0.08em;   /* uppercase nav-section eyebrows             */

  /* ── Semantic aliases ───────────────────────────────────────────────── */
  --text-body: var(--text-base);
  --text-caption: var(--text-xs);
  --text-label: var(--text-md);
}
