/* ============================================================================
 *  ФормулаЦТ — дизайн-токены
 *  Палитра в духе обучающих приложений: чистый белый фон, плотные карточки,
 *  яркий зелёный акцент, «объёмные» кнопки. Без тяжёлых градиентов и свечения.
 * ==========================================================================*/
:root {
  /* Бренд — свежий зелёный */
  --brand:        #58cc02;
  --brand-600:    #4cad02;
  --brand-700:    #3f8f02;
  --brand-300:    #89e219;
  --brand-100:    #e8f7d4;
  --brand-glow:   rgba(88, 204, 2, .28);

  --math:         #1cb0f6;
  --math-soft:    #ddf4ff;
  --phys:         #ff4b4b;
  --phys-soft:    #ffe2e2;

  --ok:           #58cc02;
  --ok-600:       #46a302;
  --ok-soft:      #e8f7d4;
  --err:          #ff4b4b;
  --err-600:      #e03e3e;
  --err-soft:     #ffe2e2;
  --warn:         #ffc800;
  --gold:         #ffc800;
  --star:         #ffc800;

  /* Поверхности */
  --bg:           #ffffff;
  --bg-2:         #f7f7f7;
  --surface:      #ffffff;
  --surface-2:    #f7f7f7;
  --surface-3:    #efefef;
  --line:         #e5e5e5;
  --line-2:       #d0d0d0;

  /* Текст */
  --fg:           #3c3c3c;
  --fg-2:         #777777;
  --fg-3:         #afafaf;
  --fg-inv:       #ffffff;

  /* Геометрия */
  --r-sm: 10px;
  --r:    14px;
  --r-lg: 18px;
  --r-xl: 26px;
  --r-pill: 999px;

  /* Тени — мягкие, почти без «свечения» */
  --sh-1: 0 1px 2px rgba(60, 60, 60, .05);
  --sh-2: 0 2px 8px rgba(60, 60, 60, .07);
  --sh-3: 0 10px 28px rgba(60, 60, 60, .12);
  --sh-brand: 0 4px 0 var(--brand-700);

  /* Ритм */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 20px; --sp-6: 24px; --sp-7: 32px; --sp-8: 44px;

  --topbar-h: 62px;
  --tabbar-h: 66px;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bot: env(safe-area-inset-bottom, 0px);

  --font: "Nunito", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --font-num: "Nunito", ui-rounded, system-ui, sans-serif;

  --t-fast: .12s cubic-bezier(.4, 0, .2, 1);
  --t:      .22s cubic-bezier(.4, 0, .2, 1);
  --t-bounce: .42s cubic-bezier(.34, 1.56, .64, 1);
}

/* ------------------------------- ТЁМНАЯ ТЕМА ----------------------------- */
html[data-theme="dark"] {
  --brand:        #6fd813;
  --brand-600:    #5fbf0c;
  --brand-700:    #4d9d08;
  --brand-300:    #4a7a1e;
  --brand-100:    #22350f;
  --brand-glow:   rgba(111, 216, 19, .26);

  --math-soft:    #102b3d;
  --phys-soft:    #3a1d1d;

  --ok-soft:      #22350f;
  --err-soft:     #3a1d1d;

  --bg:           #131f24;
  --bg-2:         #17262c;
  --surface:      #1b2b32;
  --surface-2:    #22343c;
  --surface-3:    #2a3f49;
  --line:         #2f4650;
  --line-2:       #3d5966;

  --fg:           #f1f7f9;
  --fg-2:         #a9bcc4;
  --fg-3:         #7c929c;

  --sh-1: 0 1px 2px rgba(0, 0, 0, .3);
  --sh-2: 0 3px 12px rgba(0, 0, 0, .35);
  --sh-3: 0 12px 34px rgba(0, 0, 0, .45);
  --sh-brand: 0 4px 0 var(--brand-700);
}

/* Авто-тема из Telegram */
html[data-theme="auto"] { color-scheme: light dark; }
@media (prefers-color-scheme: dark) {
  html[data-theme="auto"] {
    --bg: #131f24; --bg-2: #17262c; --surface: #1b2b32; --surface-2: #22343c;
    --surface-3: #2a3f49; --line: #2f4650; --line-2: #3d5966;
    --fg: #f1f7f9; --fg-2: #a9bcc4; --fg-3: #7c929c;
    --brand: #6fd813; --brand-100: #22350f; --math-soft: #102b3d; --phys-soft: #3a1d1d;
    --ok-soft: #22350f; --err-soft: #3a1d1d;
  }
}