/* Baloo 2, self-hosted.
   Not linked from Google: this is a children's app, the service worker caches
   the shell for offline play, and A2 shared hosting should not depend on a
   third party being reachable. One variable file per subset covers 400 to 800.
   latin-ext carries č ć š ž đ, so it is not optional here. */
@font-face {
  font-family: 'Baloo 2';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url('../fonts/baloo2-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Baloo 2';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url('../fonts/baloo2-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ============================================================
   mnozilica, smjer C: NALJEPNICE (sticker album x risograph)
   Paper stock with tooth, four flat spot inks that overprint,
   empty numbered slots waiting to be filled in.
   ============================================================ */

:root{
  /* ---- structural ---- */
  --sp-1:4px;  --sp-2:8px;  --sp-3:12px; --sp-4:16px; --sp-5:20px;
  --sp-6:24px; --sp-8:32px; --sp-10:40px; --sp-12:48px; --sp-16:64px;

  --radius-sm:4px; --radius-md:9px; --radius-lg:15px; --radius-xl:24px; --radius-full:999px;

  --fs-xs:11px; --fs-sm:12px; --fs-base:15px; --fs-lg:18px; --fs-xl:22px;
  --fs-2xl:28px; --fs-3xl:36px; --fs-4xl:56px; --fs-5xl:104px;

  --z-bg:0; --z-content:1; --z-overlay:5; --z-modal:20; --z-confetti:30;

  --transition-fast:90ms cubic-bezier(.2,.9,.3,1);
  --transition-base:170ms cubic-bezier(.2,.9,.3,1);
  --transition-slow:320ms cubic-bezier(.2,.9,.3,1);

  /* Baloo 2: rounded, chunky, a little bouncy. The face a sticker album uses,
     not the face a dashboard uses. Full Croatian diacritics in latin-ext. */
  --font-family:'Baloo 2','Trebuchet MS','Segoe UI',system-ui,sans-serif;

  /* ---- ink and paper ---- */
  --ink:#211B13;
  --paper:#F3EADA;
  --paper-tooth:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='t'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23t)'/%3E%3C/svg%3E");

  /* ---- colour ---- */
  --primary:#FF2E88;         /* fluorescent pink, the loudest plate */
  --primary-hover:#DE0E6C;
  --primary-light:#FFD5E7;
  --success:#00794A;         /* mid green plate, deepened so paper-white sits at 5.3:1 on it */
  --error:#CE211A;
  --error-light:#FFD8CE;
  --warning:#E9A100;
  --white:#FFFBF0;           /* paper white, never pure white */

  --gray-50:#FAF4E8;  --gray-100:#F3EADA; --gray-200:#E7DAC4; --gray-300:#D6C6AC;
  --gray-400:#BCA98C; --gray-500:#9C8968; --gray-600:#7A6A4F; --gray-700:#5A4D39;
  --gray-800:#3B3226; --gray-900:#211B13;

  --card-bg:#FFFBF0;
  --card-shadow:3px 3px 0 rgba(33,27,19,.22);
  --card-shadow-lg:6px 7px 0 rgba(33,27,19,.28);
  --star-filled:#E9A100;
  --star-empty:#D6C6AC;

  /* Sibling-app names kept, values re-cast as two of this direction's spot inks.
     forest-* is the mustard plate, ocean-* is the riso blue plate.
     The green ink lives on --success, so neither ramp is green. */
  --forest-green:#E9A100; --forest-light:#FFF0C4; --forest-dark:#8A5F00; --forest-bg:#FFF3D6;
  --ocean-blue:#1F5FD0;   --ocean-light:#A8C6F7;  --ocean-dark:#123A85;  --ocean-bg:#DEE9FC;

  /* ---- mastery ramp ----
     Four separate plates, not one warm ramp. Gold used to sit on top and it read
     as a second yellow next to --mastery-3 (1.7:1 at 26px, which is nothing to an
     eight-year-old). The top rung is now the briefed green plate: 4.3:1 against
     the yellow below it, and it says "correct" in the same ink the Potvrdi key
     and the tick dots already use. Mustard stays on the foil star, so the rare
     sticker still gets the gold. */
  --mastery-0:#5A4D39;   /* never seen: empty slot, dark ink on kraft, dashed */
  --mastery-1:#CE211A;   /* shaky */
  --mastery-2:#EF6C1A;   /* slow */
  --mastery-3:#FFE434;   /* quick */
  --mastery-4:#00794A;   /* fluent, printed as foil */
}

*,*::before,*::after{box-sizing:border-box;}
