/* =================================================================
 * tokens.css — дизайн-токены. Меняй здесь — поедет везде.
 * ================================================================= */
:root {
  --brand:        #c6ff3a;
  --brand-2:      #4d7cff;
  --color-live:   #e63946;

  --bg:           #0a0d12;
  --bg-elev:      #11151c;
  --bg-row:       #0e1218;
  --bg-row-hov:   #161b24;
  --border:       #1c222c;
  --border-soft:  #161b23;
  --text:         #e9ecf2;
  --text-dim:     #7f8a9c;
  --text-mute:    #525c6c;

  --win:          #4ade80;
  --draw:         #94a3b8;
  --loss:         #e63946;
  --yellow-card:  #ffd23f;
  --red-card:     #e63946;

  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 14px;
  --shadow-1: 0 1px 0 rgba(255,255,255,.03), 0 8px 24px rgba(0,0,0,.35);

  --ff-sans: "Onest", "Manrope", "Helvetica Neue", system-ui, sans-serif;
  --ff-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, monospace;

  /* Микро-типографика. На desktop — авторские размеры,
   * на мобильных поднимается до 12px (требование Яндекса
   * «слишком мелкий текст» / мобилопригодность). */
  --fs-7:  7px;
  --fs-8:  8px;
  --fs-9:  9px;
  --fs-10: 10px;
  --fs-11: 11px;
}

@media (max-width: 768px) {
  :root {
    --fs-7:  12px;
    --fs-8:  12px;
    --fs-9:  12px;
    --fs-10: 12px;
    --fs-11: 12px;
  }
}

[data-theme="light"] {
  --bg:          #f4f5f7;
  --bg-elev:     #ffffff;
  --bg-row:      #ffffff;
  --bg-row-hov:  #f0f2f6;
  --border:      #e3e6ec;
  --border-soft: #eef0f4;
  --text:        #0f1218;
  --text-dim:    #5e6878;
  --text-mute:   #94a0b2;
  --brand:       #1d8a2b;
}