/* Kids English — Design tokens 2026 ("Soft Clay"). Подключать первым. */
:root{
  /* Палитра: основа */
  --c-paper:#FFF8EE;      /* фон, тёплая бумага */
  --c-paper-2:#FCEFD9;    /* второй слой фона */
  --c-cream:#FFFFFF;      /* карточки */
  --c-ink:#2B2350;        /* текст/иконки (13.6:1 на paper) */
  --c-ink-soft:#5A5280;   /* вторичные иконки (6.7:1 на paper) */
  /* Бренд и акценты */
  --c-fox:#FF7A3D;        /* фирменный (лис), заливки; с ink 5.6:1 */
  --c-fox-deep:#D9531A;   /* нижняя «глина» под fox */
  --c-sun:#FFC83D;        /* звёзды, награды; с ink 9.3:1 */
  --c-sun-deep:#E59E00;
  --c-mint:#3DD6A3;       /* «верно», «дальше»; с ink 7.8:1 */
  --c-mint-deep:#1FA37A;
  --c-sky:#5AB8FF;        /* вода/карта */
  --c-sky-deep:#2E86D6;
  --c-berry:#FF5C8A;      /* редкие награды */
  --c-grape:#8B6CFF;      /* звук/буквы */
  --c-grape-deep:#6246E0;
  --c-leaf:#8DDB5A;       /* острова */
  --c-sand:#FFE2A8;
  --c-locked:#D9D2E6;     /* закрыто: не серый, а лавандовый туман */
  /* «Неверно» — без красного: мягкое покачивание + приглушение */
  --c-try:#FFB59E;
  /* Шрифты: цифры/буквы ребёнок видит, слов почти нет */
  --f-display:"Baloo 2","Andika",system-ui,sans-serif;
  --f-letter:"Andika","Nunito",system-ui,sans-serif; /* однокруглые a/g для обучения */
  --fs-letter-xl:clamp(72px,18vmin,160px);
  --fs-letter-m:clamp(40px,9vmin,72px);
  /* Сетка и касания */
  --tap-min:64px; --tap:88px; --tap-hero:128px;
  --sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:24px;--sp-6:32px;--sp-7:48px;
  /* Радиусы — «squircle» */
  --r-s:16px;--r-m:24px;--r-l:36px;--r-xl:48px;--r-pill:999px;
  /* Глубина: «глина» = твёрдый нижний край + мягкая тень */
  --clay-h:6px;
  --sh-clay:0 var(--clay-h) 0 var(--clay-c,rgba(43,35,80,.16)),0 14px 28px -8px rgba(43,35,80,.22);
  --sh-clay-pressed:0 2px 0 var(--clay-c,rgba(43,35,80,.16)),0 6px 12px -6px rgba(43,35,80,.2);
  --sh-float:0 24px 48px -16px rgba(43,35,80,.28);
  --inner-gloss:inset 0 3px 0 rgba(255,255,255,.55),inset 0 -4px 0 rgba(0,0,0,.06);
  /* Движение */
  --e-spring:cubic-bezier(.34,1.56,.64,1);   /* «пружина» — нажатия, появление */
  --e-out:cubic-bezier(.22,1,.36,1);         /* выезды, переходы */
  --e-in-out:cubic-bezier(.65,0,.35,1);      /* перемещение лиса по пути */
  --d-tap:90ms; --d-release:220ms; --d-pop:360ms; --d-screen:420ms; --d-walk:700ms; --d-reward:1200ms; --d-idle-hint:6s;
}
@media (prefers-reduced-motion:reduce){:root{--d-pop:1ms;--d-screen:1ms;--d-walk:1ms;--d-reward:1ms}}
/* Базовые компоненты */
.k-btn{min-width:var(--tap);min-height:var(--tap);border:0;border-radius:var(--r-l);background:var(--bg,var(--c-cream));
 --clay-c:var(--deep,rgba(43,35,80,.16));box-shadow:var(--sh-clay),var(--inner-gloss);display:grid;place-items:center;
 transition:transform var(--d-release) var(--e-spring),box-shadow var(--d-release) var(--e-spring);cursor:pointer}
.k-btn:active{transform:translateY(4px) scale(.96);box-shadow:var(--sh-clay-pressed),var(--inner-gloss);transition-duration:var(--d-tap)}
.k-btn.hero{min-width:var(--tap-hero);min-height:var(--tap-hero);border-radius:var(--r-xl)}
.k-btn.go{--bg:var(--c-mint);--deep:var(--c-mint-deep)}
.k-btn.fox{--bg:var(--c-fox);--deep:var(--c-fox-deep)}
.k-btn.sound{--bg:var(--c-grape);--deep:var(--c-grape-deep)}
.k-card{background:var(--c-cream);border-radius:var(--r-xl);box-shadow:var(--sh-clay)}
/* Self-hosted fonts (SIL OFL 1.1, see fonts/OFL-*.txt). Baloo 2 has no Cyrillic glyphs, so Russian text (parent zone) uses Nunito. */
@font-face{font-family:"Baloo 2";src:url(fonts/baloo2-800.woff2) format("woff2");font-weight:600 900;font-display:swap}
@font-face{font-family:Nunito;src:url(fonts/nunito-700.woff2) format("woff2");font-weight:400 800;font-display:swap}
@font-face{font-family:Nunito;src:url(fonts/nunito-900.woff2) format("woff2");font-weight:850 1000;font-display:swap}
:root{--f-display:"Baloo 2","Nunito","Andika",system-ui,sans-serif;--f-ui:"Nunito",system-ui,sans-serif}
