/* ============================================================
   Kropka — Spacing, radii, shadows, motion (Design System)

   ŹRÓDŁO: docs/Nowy-Design-Kropka/_ds/kropka-eduhub-design-system-
           9cab01f8-efff-4109-8fa5-976f5fbd8656/tokens/spacing.css

   BEZ ODSTĘPSTW od źródła. Skala odstępów --sp-1…--sp-10 była
   pominięta, dopóki jedynym konsumentem tokenów był pasek boczny
   opisujący odstępy klasami Tailwind. Wróciła w komplecie, gdy
   ruszyły strony treściowe: rejestr osób (redesign-gws-import D6)
   oraz warstwa prymitywów .kp-*, która buduje odstępy wewnętrzne
   komponentów na tokenach, a nie na wartościach w pikselach.

   Sprawdzone przed dodaniem: żadna z poniższych nazw nie występuje
   w templates/base.html ani w pozostałych plikach static/ — brak
   kolizji z istniejącymi zmiennymi aplikacji.
   ============================================================ */

:root {
  /* ── Spacing (baza 4px) ──────────────────────────────────── */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-10: 40px;

  /* ── Radii ───────────────────────────────────────────────── */
  --r-chip:    6px;     /* subject / status chips */
  --r-card:    12px;    /* dense inner cards, rows */
  --r-card-lg: 16px;    /* content cards */
  --r-bento:   24px;    /* hero / widget panels */
  --r-pill:    9999px;  /* CTA + pills + segmented */

  /* ── Shadows (near-black + forest-black tones) ───────────── */
  --shadow-soft:  0px 1px 2px 0px rgba(0, 0, 0, 0.05);
  --shadow-nav:   0px 4px 15px 0px rgba(0, 0, 0, 0.10);
  --shadow-card:  2px 4px 15px 0px rgba(0, 0, 0, 0.20);
  --shadow-bento: 2px 4px 15px 0px rgba(13, 15, 14, 0.20);
  --shadow-hero:  2px 4px 40px 0px rgba(13, 15, 14, 0.20);
  --shadow-deep:  2px 4px 15px 0px rgba(0, 0, 0, 0.30);

  /* ── Motion ──────────────────────────────────────────────── */
  --ease-out: cubic-bezier(0.32, 0.72, 0, 1);
  --dur-fast: 120ms;
  --dur-med:  200ms;
  --dur-slow: 240ms;
}