/* ============================================================
   Olimpiada Tangram - Effects: radii, borders, shadows, motion
   Rounded, friendly geometry; soft navy-tinted shadows on light;
   glow-free, flat treatment on the navy ground.
   ============================================================ */

:root {
  /* ---- Corner radii (generous, friendly) ---- */
  --tg-radius-xs:   6px;   /* highlight-marker chips, tags */
  --tg-radius-sm:   10px;  /* inputs, small controls */
  --tg-radius-md:   16px;  /* buttons, list rows */
  --tg-radius-lg:   24px;  /* cards, panels */
  --tg-radius-xl:   32px;  /* hero cards, media */
  --tg-radius-2xl:  44px;  /* large feature blocks */
  --tg-radius-pill: 999px; /* pills, chips, avatars */

  /* ---- Borders ---- */
  --tg-border-width:      1.5px;
  --tg-border-width-bold: 3px; /* playful thick outline (badges, focus) */

  /* ---- Shadows (navy-tinted, soft) - for light surfaces ---- */
  --tg-shadow-xs:  0 1px 2px rgba(10, 0, 128, 0.08);
  --tg-shadow-sm:  0 2px 8px rgba(10, 0, 128, 0.10);
  --tg-shadow-md:  0 10px 24px rgba(10, 0, 128, 0.12);
  --tg-shadow-lg:  0 20px 48px rgba(10, 0, 128, 0.16);
  --tg-shadow-xl:  0 32px 70px rgba(10, 0, 128, 0.22);

  /* Chunky "sticker" shadow - flat offset, no blur (playful) */
  --tg-shadow-sticker: 6px 6px 0 rgba(10, 0, 128, 0.16);

  /* ---- Focus ring ---- */
  --tg-ring: 0 0 0 3px rgba(0, 188, 255, 0.55);

  /* ---- Motion ---- */
  --tg-ease:         cubic-bezier(0.22, 1, 0.36, 1); /* @kind other */
  --tg-ease-bounce:  cubic-bezier(0.34, 1.56, 0.64, 1); /* @kind other */
  --tg-dur-fast:     140ms; /* @kind other */
  --tg-dur:          220ms; /* @kind other */
  --tg-dur-slow:     420ms; /* @kind other */
}