/* ===========================================================
   Персик — design tokens
   The single source of colour, radius and motion for the app.
   Never write a raw hex value outside this file.
   =========================================================== */

:root {
  /* --- surfaces & ink --- */
  --c-bg:        #FFF7EC;
  --c-bg-deep:   #FFEFD9;
  --c-surface:   #FFFFFF;
  --c-ink:       #2E2A39;
  --c-ink-soft:  #6B6577;
  --c-line:      #E8E0D4;

  /* --- brand --- */
  --c-persiq:    #FF5A36;
  --c-persiq-dk: #D93F20;
  --c-persiq-lt: #FFE3DB;
  --c-blip:      #35B7F5;
  --c-blip-dk:   #1E93CC;

  /* --- semantic --- */
  --c-grass:     #4CC63E;
  --c-grass-dk:  #3AA22E;
  --c-grass-lt:  #E4F8E1;
  --c-wrong:     #FF4B4B;
  --c-wrong-dk:  #D93636;
  --c-wrong-lt:  #FFE5E5;
  --c-sun:       #FFC93C;
  --c-sun-dk:    #E0A800;

  /* --- lesson themes --- */
  --c-berry:     #FF4B7D;
  --c-berry-dk:  #D9315F;
  --c-grape:     #8B5CF6;
  --c-grape-dk:  #6D3EDB;
  --c-sky:       #35B7F5;
  --c-sky-dk:    #1E93CC;
  --c-flame:     #FF8A3D;
  --c-flame-dk:  #DB6A20;

  /* per-lesson accent, re-pointed by [data-theme] below */
  --c-theme:     var(--c-persiq);
  --c-theme-dk:  var(--c-persiq-dk);

  /* --- radii --- */
  --r-sm:   12px;
  --r-md:   18px;
  --r-lg:   26px;
  --r-xl:   36px;
  --r-pill: 999px;

  /* --- structure --- */
  --border:     3px solid var(--c-line);
  --border-w:   3px;
  --shadow-btn: 0 4px 0;
  --shadow-card: 0 6px 0 rgba(46, 42, 57, .07);
  --shadow-pop:  0 12px 34px rgba(46, 42, 57, .16);

  /* --- motion --- */
  --spring:  cubic-bezier(.34, 1.56, .64, 1);
  --ease:    cubic-bezier(.22, .61, .36, 1);
  --t-fast:  .14s;
  --t-med:   .26s;

  /* --- type --- */
  --font: 'Nunito', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-emoji: 'Segoe UI Emoji', 'Apple Color Emoji', 'Noto Color Emoji', sans-serif;
}

/* Lesson accent themes — set data-theme on any container */
[data-theme="sun"]   { --c-theme: var(--c-sun);    --c-theme-dk: var(--c-sun-dk); }
[data-theme="grass"] { --c-theme: var(--c-grass);  --c-theme-dk: var(--c-grass-dk); }
[data-theme="sky"]   { --c-theme: var(--c-sky);    --c-theme-dk: var(--c-sky-dk); }
[data-theme="berry"] { --c-theme: var(--c-berry);  --c-theme-dk: var(--c-berry-dk); }
[data-theme="grape"] { --c-theme: var(--c-grape);  --c-theme-dk: var(--c-grape-dk); }
[data-theme="flame"] { --c-theme: var(--c-flame);  --c-theme-dk: var(--c-flame-dk); }

@media (prefers-reduced-motion: reduce) {
  :root { --t-fast: 0s; --t-med: 0s; }
  *, *::before, *::after {
    animation-duration: .001s !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001s !important;
  }
}