/* Pavilion design tokens
   Shared by Pavilion Wallet, Pavilion Bridge and the Paladins collection.
   Font URLs assume this file sits one level below the fonts folder
   (site/css/tokens.css next to site/fonts/). Adjust the paths if you place it elsewhere. */

@font-face {
  font-family: "Manrope";
  src: url("../fonts/manrope-latin.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Geist Mono";
  src: url("../fonts/geist-mono.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Palette */
  --ink: #1B2B41;
  --mineral: #8DB1C1;
  --paper: #F4F2EC;

  /* Derived */
  --ink-soft: #2E405A;
  --mineral-deep: #6B93A6;
  --paper-soft: #E9EAE4;
  --line: #C9D1D4;
  --muted: #4A5A6E;

  /* Dither ramp, Paper -> Mineral -> Ink (pixel engines + quantizer) */
  --ramp-0: #f4f2ec;
  --ramp-1: #d9dfdf;
  --ramp-2: #b8cad1;
  --ramp-3: #8db1c1;
  --ramp-4: #7695a4;
  --ramp-5: #57707f;
  --ramp-6: #1b2b41;

  /* Type families */
  --font-sans: "Manrope", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --font-pixel: "GeistPixel-Square", "Geist Mono", ui-monospace, monospace;

  /* Spacing */
  --s-0: 0;
  --s-25: 2px;
  --s-50: 4px;
  --s-75: 8px;
  --s-100: 12px;
  --s-200: 16px;
  --s-300: 24px;
  --s-400: 32px;
  --s-500: 40px;
  --s-600: 48px;
  --s-700: 64px;
  --s-800: 80px;
  --s-900: 96px;

  /* Type scale (Tailwind): size + line height */
  --text-xs: 12px;   --text-xs--line-height: 16px;
  --text-sm: 14px;   --text-sm--line-height: 20px;
  --text-base: 16px; --text-base--line-height: 24px;
  --text-lg: 18px;   --text-lg--line-height: 28px;
  --text-xl: 20px;   --text-xl--line-height: 28px;
  --text-2xl: 24px;  --text-2xl--line-height: 32px;
  --text-3xl: 30px;  --text-3xl--line-height: 36px;
  --text-4xl: 36px;  --text-4xl--line-height: 40px;
  --text-5xl: 48px;  --text-5xl--line-height: 1;
  --text-6xl: 60px;  --text-6xl--line-height: 1;
  --text-7xl: 72px;  --text-7xl--line-height: 1;

  /* Radii */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-xl: 12px;
  --radius-2xl: 16px;
  --radius-full: 9999px;

  /* Motion */
  --ease: cubic-bezier(.22,1,.36,1);
}