/* ==========================================================================
   PLAYRIX MARATHON — design tokens
   Нейтральный чистый UI, акцент — фиолетовый внутренних ивентов Playrix
   (совпадает с палитрой AI Animation Challenge). Всё, что может меняться
   при брендировании, вынесено сюда.
   ========================================================================== */

:root {
  /* --- Нейтральная шкала (внутри белых карточек) --- */
  --c-bg:          #F6F7F9;
  --c-surface:     #FFFFFF;
  --c-surface-2:   #F1F3F6;
  --c-surface-3:   #E7EAEF;
  --c-border:      #DFE3EA;
  --c-border-strong:#C7CDD8;

  --c-text:        #14181F;
  --c-text-2:      #5A6472;
  --c-text-3:      #8A94A3;
  --c-text-inv:    #FFFFFF;

  /* --- Сцена ивента (по референсам #2): тёмный фиолет + карточки --- */
  --c-scene:       #200042;  /* фон страницы, как у AI Animation Challenge */
  --c-scene-hdr:   #170733;  /* шапка: на ступень темнее сцены */
  --c-deep:        #361A55;  /* подложки карточек на тёмном (как у карточек игр) */

  /* --- Акцент (сиреневый AI Animation Challenge) --- */
  --c-accent:      #8762E2;
  --c-accent-hover:#6F49C9;
  --c-accent-soft: #F1EDFA;
  --c-accent-deep: #361A55;

  /* --- Подтверждение: ярко-зелёный voted с Hackathon'26 --- */
  --c-bright:      #28D223;

  /* --- Семантика статусов --- */
  --c-ok:          #128A5A;
  --c-ok-soft:     #E4F5ED;
  --c-warn:        #A66300;
  --c-warn-soft:   #FDF1DF;
  --c-danger:      #C0342B;
  --c-danger-soft: #FCEBEA;
  --c-info:        #1F6FB2;
  --c-info-soft:   #E7F1FA;

  /* --- Типографика --- */
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, "Helvetica Neue", Arial, sans-serif;
  --fs-12: 12px;
  --fs-13: 13px;
  --fs-14: 14px;
  --fs-16: 16px;
  --fs-18: 18px;
  --fs-22: 22px;
  --fs-28: 28px;
  --fs-36: 36px;
  --lh-tight: 1.25;
  --lh-base: 1.5;

  /* --- Сетка / отступы (шаг 4) --- */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px;
  --s-5: 20px; --s-6: 24px; --s-8: 32px; --s-10: 40px;
  --s-12: 48px; --s-16: 64px;

  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 24px;

  --shadow-1: 0 1px 2px rgba(20, 24, 31, .06), 0 1px 6px rgba(20, 24, 31, .05);
  --shadow-2: 0 2px 6px rgba(20, 24, 31, .08), 0 8px 24px rgba(20, 24, 31, .10);

  --header-h: 64px;
}