/* ============================================================
   zhookaffie · tokens.css — brand tokens LOCKED per STRATEGY v0.2.0 §0
   Sampled from the vector master (zhookaffie.pdf). Do not drift.
   ============================================================ */
:root {
  /* core palette */
  --ink: #53211C;          /* espresso brown — text, headers, tab bar */
  --accent: #EB510B;       /* paw orange — CTAs, badges, active states */
  --cream: #FFF7F0;        /* warm app background */
  --surface: #FFFFFF;      /* cards */
  --line: #EDDCD2;         /* hairlines / dividers */
  --accent-soft: #FBE3D4;  /* tint — chips, highlights */
  --veg: #1E8E3E;          /* FSSAI-style veg marker only */

  /* derived (ink/accent alpha ramps only — no new hues) */
  --ink-60: rgba(83, 33, 28, .62);
  --ink-40: rgba(83, 33, 28, .40);
  --ink-12: rgba(83, 33, 28, .12);
  --ink-06: rgba(83, 33, 28, .06);
  --accent-12: rgba(235, 81, 11, .12);
  --accent-22: rgba(235, 81, 11, .22);
  --on-ink: #FFF7F0;
  --on-accent: #FFFFFF;

  /* type */
  --font-display: 'Baloo 2', system-ui, sans-serif;
  --font-body: 'DM Sans', system-ui, sans-serif;

  /* shape — chunky sticker radii */
  --r-xs: 10px;
  --r-sm: 14px;
  --r-md: 18px;
  --r-lg: 24px;
  --r-pill: 999px;

  /* sticker shadows (hard offset, gen-z sticker look) */
  --pop: 0 2px 0 var(--ink);
  --pop-2: 3px 4px 0 var(--ink);
  --pop-3: 5px 6px 0 var(--ink);

  /* layout */
  --wrap: 1120px;
  --tabbar-h: 64px;
  --topbar-h: 64px;
  --sab: env(safe-area-inset-bottom, 0px);
  --sat: env(safe-area-inset-top, 0px);

  /* motion */
  --snap: cubic-bezier(.34, 1.56, .64, 1); /* bouncy */
  --ease: cubic-bezier(.22, .61, .36, 1);
}

/* self-hosted variable fonts (subset latin + ₹) */
@font-face {
  font-family: 'Baloo 2';
  src: url('../assets/fonts/Baloo2-var.woff2') format('woff2-variations');
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'DM Sans';
  src: url('../assets/fonts/DMSans-var.woff2') format('woff2-variations');
  font-weight: 100 1000;
  font-style: normal;
  font-display: swap;
}