/* Bamba Wallet — design tokens (see design.md). Colours are Bamba's existing
 * palette, unchanged; everything in styles.css references these by name. */

@font-face {
  font-family: "Inter";
  src: url("assets/fonts/inter-variable.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Night — storytelling bands */
  --color-night: #000000;
  --color-night-2: #0a0a0a;
  --color-surface: #16181a;
  --color-surface-2: #1c1e21;
  --color-line: rgba(255, 255, 255, 0.12);
  --color-line-soft: rgba(255, 255, 255, 0.06);
  --color-text: #ffffff;
  --color-text-muted: rgba(255, 255, 255, 0.72);
  --color-text-soft: #8d969e;

  /* Paper — catalogue bands */
  --color-paper: #ffffff;
  --color-paper-2: #f4f4f4;
  --color-ink: #191c1f;
  --color-ink-muted: #505a63;
  --color-hairline: #e2e2e7;

  /* Meaning, never decoration */
  --color-money-in: #4ade80;
  --color-money-in-ink: #428619;
  --color-money-in-wash: rgba(66, 134, 25, 0.12);
  --color-alert: #ec7e00;
  --color-alert-ink: #1a1300;
  --color-scrim: rgba(0, 0, 0, 0.72);
  --color-nav: rgba(22, 24, 26, 0.78);

  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  /* Type scale — max five per page */
  --text-display: clamp(3rem, 6.5vw + 1rem, 7.5rem);
  --text-display-s: clamp(2.5rem, 4vw + 1rem, 4.75rem);
  --text-2xl: clamp(1.75rem, 1.5vw + 1.1rem, 2.5rem);
  --text-lg: 1.25rem;
  --text-md: 1.0625rem;
  --text-sm: 0.875rem;
  --text-xs: 0.75rem;

  /* 4-pt spacing */
  --space-3xs: 0.125rem;
  --space-2xs: 0.25rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2.5rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;
  --space-4xl: 9rem;

  --page-gutter: clamp(1.25rem, 4vw, 4rem);
  --page-max: 80rem;

  --radius-sm: 12px;
  --radius-md: 20px;
  --radius-lg: 28px;
  --radius-full: 9999px;

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in: cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-micro: 120ms;
  --dur-short: 220ms;
  --dur-long: 480ms;

  --z-raised: 10;
  --z-sticky: 200;
  --z-modal: 400;
  --z-toast: 500;
}