/* Trenuje www — design tokens (desktop, light) */
:root {
  /* Color — accent (violet, sampled from mockups) */
  --accent-h: 250; --accent-s: 70%; --accent-l: 55%;
  --accent: hsl(250 70% 55%);            /* #5b3edb */
  --accent-strong: hsl(250 66% 47%);     /* pressed / search btn */
  --accent-subtle: hsl(258 100% 94%);    /* lilac badge bg #ede1ff */
  --accent-soft: hsl(250 80% 97%);       /* tint rows / hovers */

  /* Neutrals */
  --bg: hsl(240 14% 98%);                /* #f9f9fb page */
  --surface: hsl(0 0% 100%);
  --surface-sunken: hsl(240 12% 97%);
  --ink: hsl(240 10% 5%);                /* near-black headings */
  --text-primary: hsl(240 8% 12%);
  --text-secondary: hsl(240 5% 40%);
  --text-tertiary: hsl(240 5% 58%);
  --border-subtle: hsl(240 8% 93%);
  --border-default: hsl(240 8% 88%);
  --border-strong: hsl(240 6% 78%);

  /* Semantic */
  --success-bg: hsl(140 45% 88%);        /* „Dostępny dziś" pill */
  --success-text: hsl(145 55% 26%);
  --star: hsl(42 96% 50%);               /* rating stars */
  --lime: hsl(72 85% 62%);               /* hero underline */

  /* Typography */
  --font-display: 'Playfair Display', 'Fraunces', Georgia, serif;
  --font-sans: 'Inter Tight', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
  /* scale 1.2 */
  --fs-xs: 0.75rem;   --lh-xs: 1.35;
  --fs-sm: 0.855rem;  --lh-sm: 1.4;
  --fs-base: 1rem;    --lh-base: 1.5;
  --fs-lg: 1.2rem;    --lh-lg: 1.4;
  --fs-xl: 1.44rem;   --lh-xl: 1.3;  --ls-xl: -0.01em;
  --fs-2xl: 1.9rem;   --lh-2xl: 1.15; --ls-2xl: -0.02em;
  --fs-3xl: 2.6rem;   --lh-3xl: 1.08; --ls-3xl: -0.02em;
  --fs-4xl: 4.05rem;  --lh-4xl: 1.02; --ls-4xl: -0.025em;

  /* Spacing (rem) */
  --sp-1: 0.25rem; --sp-2: 0.5rem; --sp-3: 0.75rem; --sp-4: 1rem;
  --sp-6: 1.5rem; --sp-8: 2rem; --sp-12: 3rem; --sp-16: 4rem; --sp-24: 6rem;

  /* Radius */
  --r-soft: 8px; --r-card: 16px; --r-xl: 20px; --r-hero: 24px; --r-pill: 999px;

  /* Shadow */
  --shadow-low: 0 1px 2px rgb(20 18 40 / 0.04), 0 4px 16px rgb(20 18 40 / 0.05);
  --shadow-med: 0 2px 6px rgb(20 18 40 / 0.06), 0 12px 32px rgb(20 18 40 / 0.10);
  --shadow-high: 0 4px 12px rgb(20 18 40 / 0.08), 0 24px 56px rgb(20 18 40 / 0.16);

  /* Motion */
  --dur-fast: 180ms; --dur-base: 240ms;
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}