/* Loopi design tokens — paleta 1:1 z brandbooka, neo-brutalism + retro groovy */
:root {
  /* paleta */
  --vanilla: #F6F5E1;
  --pink-soft: #FFB6DD;
  --pink-hot: #FF59B8;
  --red: #E20019;
  --ink: #1A1A1A;
  --maroon: #7A0012;
  --grad-flame: linear-gradient(135deg, var(--pink-hot) 0%, var(--red) 100%);
  --grad-soft: linear-gradient(160deg, var(--pink-soft), var(--vanilla));

  /* neo-brutalizm: grube kontury, twarde cienie bez blur */
  --border-w: 3px;
  --radius-card: 24px;
  --radius-tile: 18px;
  --radius-pill: 999px;
  --shadow-hard: 5px 6px 0 var(--ink);
  --shadow-hard-sm: 3px 3px 0 var(--ink);
  --shadow-press: 1px 2px 0 var(--ink);

  /* typografia (self-hosted, latin-ext) */
  --font-logo: 'Shrikhand', 'Baloo 2', cursive;
  --font-display: 'Baloo 2', 'Arial Rounded MT Bold', sans-serif;
  --font-body: 'Nunito', system-ui, sans-serif;

  /* galaretowate easingi; --ease-spring zdublowany w js/lib/spring.js (WAAPI nie czyta var()) */
  --ease-spring: linear(0, .01, .06 3%, .25 7%, .61 12.5%, .9 17%, 1.06 21%,
    1.15 25%, 1.16 27%, 1.12 32%, 1.03 40%, .98 47%, .975 53%, .997 66%, 1.002 76%, 1);
  --ease-pop: cubic-bezier(.34, 1.56, .64, 1);

  /* layout */
  --tab-h: 64px;
  --safe-t: env(safe-area-inset-top, 0px);
  --safe-b: env(safe-area-inset-bottom, 0px);
  --view-max: 480px;
}