/* ==========================================================================
   1win Design System · СЛОЙ 1 — ПРИМИТИВЫ
   --------------------------------------------------------------------------
   Это официальная палитра и шкалы 1win. Значения выгружены из прод-сборки
   1win.lat (там дизайн-система отдаётся как ~3100 CSS-переменных) и сверены
   с прод-сборкой лендинга 1win Token (/land/_nuxt/index.*.css).

   ПРАВИЛО: этот файл не редактируется. Он — «краски в тюбиках».
   В разметке примитивы почти не используются напрямую: берите семантику
   из 02-semantic.css или компонентные токены из 03-landing.css.
   ========================================================================== */

:root {
  /* ======================================================================
     ЦВЕТОВЫЕ ШКАЛЫ (hue-50 … hue-950, 500 — «чистый» тон)
     ====================================================================== */

  /* --- Blue (насыщенный ультрамарин) — заливка блоков ------------------ */
  --color-blue-50:  #cbd5fe;
  --color-blue-100: #a5b6fe;
  --color-blue-200: #7f97fe;
  --color-blue-300: #5878fe;
  --color-blue-400: #3259fe;   /* заливка секции «Why 1win Token» */
  --color-blue-500: #0030fe;   /* верх градиента «Popularity» */
  --color-blue-600: #0029d9;
  --color-blue-700: #0022b2;
  --color-blue-800: #001b8c;
  --color-blue-900: #001466;
  --color-blue-950: #000c40;

  /* --- Blue-Cyan — ГЛАВНЫЙ синий бренда -------------------------------- */
  --color-blue-cyan-50:  #bfddff;
  --color-blue-cyan-100: #99c8ff;
  --color-blue-cyan-200: #73b3ff;
  --color-blue-cyan-300: #4d9fff;
  --color-blue-cyan-400: #268aff;  /* заливка секции «Company's Life» */
  --color-blue-cyan-450: #1381ff;  /* hover кнопки, низ градиента */
  --color-blue-cyan-500: #0075ff;  /* ★ ОСНОВНОЙ ЦВЕТ БРЕНДА */
  --color-blue-cyan-550: #006eec;
  --color-blue-cyan-600: #0064d9;
  --color-blue-cyan-700: #0052b3;
  --color-blue-cyan-800: #00408c;
  --color-blue-cyan-900: #002f66;
  --color-blue-cyan-950: #001d40;

  /* --- Cyan ------------------------------------------------------------- */
  --color-cyan-50:  #bfe8ff;
  --color-cyan-100: #99daff;
  --color-cyan-200: #73ccff;
  --color-cyan-300: #4dbeff;
  --color-cyan-400: #26b0ff;
  --color-cyan-500: #00a1ff;   /* синяя плашка в заголовках лендинга */
  --color-cyan-600: #0089d9;
  --color-cyan-700: #0071b2;
  --color-cyan-800: #00598c;
  --color-cyan-900: #004166;
  --color-cyan-950: #002840;

  /* --- Teal -------------------------------------------------------------- */
  --color-teal-50:  #bffbff;
  --color-teal-100: #99f9ff;
  --color-teal-200: #73f6ff;
  --color-teal-300: #4df4ff;
  --color-teal-400: #26f1ff;
  --color-teal-500: #00efff;
  --color-teal-600: #00cbd9;
  --color-teal-700: #00a7b2;
  --color-teal-800: #00838c;
  --color-teal-900: #005f66;
  --color-teal-950: #003c40;

  /* --- Mint (позитив, «зелёный 1win») ----------------------------------- */
  --color-mint-50:  #bfffda;
  --color-mint-100: #99ffc4;
  --color-mint-200: #73ffae;
  --color-mint-300: #4dff97;
  --color-mint-400: #26ff81;
  --color-mint-500: #00ff6b;
  --color-mint-600: #00d95b;
  --color-mint-650: #00c654;
  --color-mint-700: #00b24b;   /* ★ brand accent (зелёный бренда) */
  --color-mint-750: #009f42;
  --color-mint-775: #00963e;
  --color-mint-800: #008c3b;
  --color-mint-825: #008337;
  --color-mint-875: #007330;
  --color-mint-900: #00662b;
  --color-mint-950: #00401b;

  /* --- Lime / Green-Lime / Citron-Lime ---------------------------------- */
  --color-lime-50:  #d8ffbf;
  --color-lime-100: #c0ff99;
  --color-lime-200: #a9ff73;
  --color-lime-300: #91ff4d;
  --color-lime-400: #79ff26;
  --color-lime-500: #62ff00;
  --color-lime-600: #53d900;
  --color-lime-700: #44b200;
  --color-lime-800: #368c00;
  --color-lime-900: #276600;
  --color-lime-950: #1d4d00;

  --color-green-lime-50:  #e6ffbf;
  --color-green-lime-100: #d7ff99;
  --color-green-lime-200: #c7ff73;
  --color-green-lime-300: #b8ff4d;
  --color-green-lime-400: #a9ff26;
  --color-green-lime-500: #9aff00;
  --color-green-lime-600: #83d900;
  --color-green-lime-700: #6cb200;
  --color-green-lime-800: #558c00;
  --color-green-lime-900: #3e6600;
  --color-green-lime-950: #274000;

  --color-citron-lime-50:  #f2ffbf;
  --color-citron-lime-100: #eaff99;
  --color-citron-lime-200: #e3ff73;
  --color-citron-lime-300: #dbff4d;
  --color-citron-lime-400: #d3ff26;
  --color-citron-lime-500: #cbff00;
  --color-citron-lime-600: #add900;
  --color-citron-lime-700: #8eb200;
  --color-citron-lime-800: #708c00;
  --color-citron-lime-900: #526600;
  --color-citron-lime-950: #334000;

  /* --- Citron / Citron-Yellow ------------------------------------------- */
  --color-citron-50:  #fffdbf;
  --color-citron-100: #fffca6;
  --color-citron-200: #fffb80;
  --color-citron-300: #fffa59;
  --color-citron-400: #fff833;
  --color-citron-500: #fff500;
  --color-citron-600: #d9d200;
  --color-citron-700: #b2ad00;
  --color-citron-800: #8c8800;
  --color-citron-900: #666300;
  --color-citron-950: #403e00;

  --color-citron-yellow-50:  #fff0bf;
  --color-citron-yellow-100: #ffe799;
  --color-citron-yellow-200: #ffde73;
  --color-citron-yellow-300: #ffd54d;
  --color-citron-yellow-400: #ffcc26;   /* «favorite» / VIP-золото */
  --color-citron-yellow-500: #ffc300;
  --color-citron-yellow-600: #d9a600;
  --color-citron-yellow-700: #b38800;
  --color-citron-yellow-800: #8c6b00;
  --color-citron-yellow-900: #664e00;
  --color-citron-yellow-950: #403100;

  /* --- Yellow-Amber ------------------------------------------------------ */
  --color-yellow-amber-50:  #ffe4bf;
  --color-yellow-amber-100: #ffd599;
  --color-yellow-amber-200: #ffc573;
  --color-yellow-amber-300: #ffb54d;
  --color-yellow-amber-400: #ffa526;   /* правый край оранжевого градиента */
  --color-yellow-amber-500: #ff9500;
  --color-yellow-amber-600: #d97e00;
  --color-yellow-amber-700: #b26800;
  --color-yellow-amber-800: #8c5200;
  --color-yellow-amber-900: #663b00;
  --color-yellow-amber-950: #402500;

  /* --- Orange-Amber ------------------------------------------------------ */
  --color-orange-amber-50:  #ffdabf;
  --color-orange-amber-100: #ffc399;
  --color-orange-amber-200: #ffad73;
  --color-orange-amber-300: #ff974d;
  --color-orange-amber-400: #ff8126;   /* левый край оранжевого градиента */
  --color-orange-amber-500: #ff6b01;
  --color-orange-amber-600: #d95a00;
  --color-orange-amber-700: #b24a00;
  --color-orange-amber-800: #8c3a00;
  --color-orange-amber-900: #662a00;
  --color-orange-amber-950: #401b00;

  /* --- Orange / Sunset / Red --------------------------------------------- */
  --color-orange-50:  #ffcfbf;
  --color-orange-100: #ffb399;
  --color-orange-200: #ff9673;
  --color-orange-300: #ff7a4d;
  --color-orange-400: #ff5d26;
  --color-orange-500: #ff4000;
  --color-orange-525: #f63d00;
  --color-orange-600: #d93600;
  --color-orange-700: #b22d00;
  --color-orange-800: #8c2300;
  --color-orange-900: #661900;
  --color-orange-950: #401000;

  --color-sunset-50:  #ffc7bf;
  --color-sunset-100: #ffa599;
  --color-sunset-200: #ff8373;
  --color-sunset-300: #ff614d;
  --color-sunset-400: #ff4026;
  --color-sunset-500: #ff1f01;
  --color-sunset-600: #d91a01;
  --color-sunset-700: #b31501;
  --color-sunset-800: #8c1101;
  --color-sunset-900: #660c01;
  --color-sunset-950: #400801;

  --color-red-50:  #ffbfbf;
  --color-red-100: #ff9999;
  --color-red-200: #ff7373;
  --color-red-300: #ff4d4d;
  --color-red-400: #ff2626;
  --color-red-500: #ff0101;
  --color-red-600: #d90101;
  --color-red-700: #b30101;
  --color-red-800: #8c0101;
  --color-red-900: #660101;
  --color-red-950: #400101;

  /* --- Rose (розовый акцент лендинга) ------------------------------------ */
  --color-rose-50:  #ffbfda;
  --color-rose-100: #ff99c3;
  --color-rose-200: #ff73ad;
  --color-rose-300: #ff4d97;   /* ★ розовая плашка в заголовках */
  --color-rose-400: #ff2681;
  --color-rose-500: #ff006a;
  --color-rose-600: #d9005a;
  --color-rose-700: #b2004a;
  --color-rose-800: #8c003a;
  --color-rose-900: #66002a;
  --color-rose-950: #40001b;

  /* --- Pink / Pink-Purple / Purple / Purple-Blue ------------------------- */
  --color-pink-50:  #ffbff5;
  --color-pink-100: #ff99ef;
  --color-pink-200: #ff73e8;
  --color-pink-300: #ff4de2;
  --color-pink-400: #ff26dc;
  --color-pink-500: #ff00d6;
  --color-pink-600: #d900b6;
  --color-pink-700: #b20096;
  --color-pink-800: #8c0076;
  --color-pink-900: #660056;
  --color-pink-950: #400036;

  --color-pink-purple-50:  #eabfff;
  --color-pink-purple-100: #dd99ff;
  --color-pink-purple-200: #d073ff;
  --color-pink-purple-300: #c34dff;
  --color-pink-purple-400: #b726ff;
  --color-pink-purple-500: #aa00ff;
  --color-pink-purple-600: #9000d9;
  --color-pink-purple-700: #7700b2;
  --color-pink-purple-800: #5e008c;
  --color-pink-purple-900: #440066;
  --color-pink-purple-950: #2a0040;

  --color-purple-50:  #dbbfff;
  --color-purple-100: #c699ff;
  --color-purple-200: #b173ff;
  --color-purple-300: #9c4dff;
  --color-purple-400: #8626ff;
  --color-purple-500: #7100ff;
  --color-purple-600: #6000d9;
  --color-purple-700: #4f00b3;
  --color-purple-800: #3e008c;
  --color-purple-900: #2d0066;
  --color-purple-950: #1c0040;

  --color-purple-blue-50:  #dbcbfe;
  --color-purple-blue-100: #c1a5fe;
  --color-purple-blue-200: #a77ffe;
  --color-purple-blue-300: #8f58fe;
  --color-purple-blue-400: #6e26fe;
  --color-purple-blue-500: #4c00fe;
  --color-purple-blue-600: #4500d9;
  --color-purple-blue-700: #3900b2;
  --color-purple-blue-800: #2f008c;
  --color-purple-blue-900: #250066;
  --color-purple-blue-950: #1a004d;

  /* --- Gray (нерегулярная шкала — так в оригинале) ----------------------- */
  --color-gray-50:  #f0f2f5;
  --color-gray-100: #d7dbe2;
  --color-gray-150: #bcc2cf;
  --color-gray-200: #a3abbb;
  --color-gray-225: #9aa1b1;
  --color-gray-250: #9299a8;
  --color-gray-300: #818794;
  --color-gray-325: #797f8b;
  --color-gray-350: #6f7480;
  --color-gray-400: #53575f;
  --color-gray-450: #474b52;
  --color-gray-500: #3a3d43;
  --color-gray-600: #2e3035;
  --color-gray-700: #242528;
  --color-gray-800: #1d1e20;
  --color-gray-900: #141415;   /* ★ фон страницы */

  /* ======================================================================
     БРЕНД-ШКАЛЫ (1 = самый тёмный/светлый край, 9 = базовый, 14 = контраст)
     ====================================================================== */

  /* --- Brand primary = синий #0075ff ------------------------------------ */
  --brand-primary-dark-1:  #0b0a17;
  --brand-primary-dark-2:  #10102d;
  --brand-primary-dark-3:  #141744;
  --brand-primary-dark-4:  #161f5e;
  --brand-primary-dark-5:  #16297a;
  --brand-primary-dark-6:  #143698;
  --brand-primary-dark-7:  #0f46b8;
  --brand-primary-dark-8:  #095bdb;
  --brand-primary-dark-9:  #0075ff;
  --brand-primary-dark-10: #1381ff;
  --brand-primary-dark-11: #3fa2ff;
  --brand-primary-dark-12: #5eb6ff;
  --brand-primary-dark-13: #7ec8ff;
  --brand-primary-dark-14: #9dd8ff;

  --brand-primary-light-1:  #cde5ff;
  --brand-primary-light-2:  #b3d7ff;
  --brand-primary-light-3:  #9acaff;
  --brand-primary-light-4:  #80bcff;
  --brand-primary-light-5:  #66aeff;
  --brand-primary-light-6:  #4da0ff;
  --brand-primary-light-7:  #3392ff;
  --brand-primary-light-8:  #1a83ff;
  --brand-primary-light-9:  #0075ff;
  --brand-primary-light-10: #006eec;
  --brand-primary-light-11: #0653b5;
  --brand-primary-light-12: #084291;
  --brand-primary-light-13: #08336f;
  --brand-primary-light-14: #07244e;

  --brand-primary-alfa-12: rgba(0, 117, 255, 0.12);
  --brand-primary-alfa-16: rgba(0, 117, 255, 0.16);
  --brand-primary-alfa-68: rgba(0, 117, 255, 0.68); /* ★ кольцо фокуса */

  /* --- Brand accent = зелёный #00b24b ----------------------------------- */
  --brand-accent-dark-1:  #001509;
  --brand-accent-dark-2:  #002b12;
  --brand-accent-dark-3:  #003c19;
  --brand-accent-dark-4:  #005223;
  --brand-accent-dark-5:  #00632a;
  --brand-accent-dark-6:  #007933;
  --brand-accent-dark-7:  #008a3a;
  --brand-accent-dark-8:  #00a144;
  --brand-accent-dark-9:  #00b24b;
  --brand-accent-dark-10: #00d95b;
  --brand-accent-dark-11: #3dc476;
  --brand-accent-dark-12: #5bcd8b;
  --brand-accent-dark-13: #7fd8a5;
  --brand-accent-dark-14: #9fe2bb;

  --brand-accent-light-1:  #cdf0dc;
  --brand-accent-light-2:  #b3e8c9;
  --brand-accent-light-3:  #99e0b7;
  --brand-accent-light-4:  #7fd8a5;
  --brand-accent-light-5:  #67d194;
  --brand-accent-light-6:  #4bc980;
  --brand-accent-light-7:  #33c16f;
  --brand-accent-light-8:  #17b95b;
  --brand-accent-light-9:  #00b24b;
  --brand-accent-light-10: #008c3b;
  --brand-accent-light-11: #008337;
  --brand-accent-light-12: #006b2d;
  --brand-accent-light-13: #005223;
  --brand-accent-light-14: #003c19;

  /* ======================================================================
     НЕЙТРАЛИ
     neutral-dark-*  — шкала ДЛЯ ТЁМНОЙ темы (1 = фон, 14 = текст)
     neutral-light-* — шкала ДЛЯ СВЕТЛОЙ темы (1 = фон, 14 = текст)
     ====================================================================== */

  --neutral-clean-black: #000000;
  --neutral-clean-white: #ffffff;
  --neutral-clean-black-none: rgba(20, 20, 21, 0);
  --neutral-clean-white-none: rgba(240, 242, 245, 0);

  --neutral-dark-1:  #141415;  /* фон тёмной темы */
  --neutral-dark-2:  #1d1e20;
  --neutral-dark-3:  #2e3035;
  --neutral-dark-4:  #3b3d43;
  --neutral-dark-5:  #44474e;
  --neutral-dark-6:  #4f525a;
  --neutral-dark-7:  #62666f;
  --neutral-dark-8:  #757a85;
  --neutral-dark-9:  #898e98;
  --neutral-dark-10: #9ea2ab;
  --neutral-dark-11: #b3b6bd;
  --neutral-dark-12: #797f8b;  /* третичный текст */
  --neutral-dark-13: #9aa1b1;  /* вторичный текст */
  --neutral-dark-14: #f0f2f5;  /* основной текст на тёмном */

  --neutral-light-1:  #ffffff;  /* фон светлой темы */
  --neutral-light-2:  #e7e9ed;
  --neutral-light-3:  #d7dbe2;
  --neutral-light-4:  #dfe1e3;
  --neutral-light-5:  #cdced3;
  --neutral-light-6:  #bcbec4;
  --neutral-light-7:  #a9acb4;
  --neutral-light-8:  #989ca5;
  --neutral-light-9:  #858a95;
  --neutral-light-10: #747984;
  --neutral-light-11: #646872;
  --neutral-light-12: #6f7480;  /* третичный текст */
  --neutral-light-13: #53575f;  /* вторичный текст */
  --neutral-light-14: #141415;  /* основной текст на светлом */

  /* --- Альфа-нейтрали: белые по тёмному ---------------------------------- */
  --neutral-dark-alfa-1:  rgba(255, 255, 255, 0.08);
  --neutral-dark-alfa-2:  rgba(255, 255, 255, 0.12);
  --neutral-dark-alfa-3:  rgba(255, 255, 255, 0.16);
  --neutral-dark-alfa-4:  rgba(255, 255, 255, 0.20);
  --neutral-dark-alfa-5:  rgba(255, 255, 255, 0.24);
  --neutral-dark-alfa-6:  rgba(255, 255, 255, 0.32);
  --neutral-dark-alfa-7:  rgba(255, 255, 255, 0.40);
  --neutral-dark-alfa-8:  rgba(255, 255, 255, 0.48);
  --neutral-dark-alfa-9:  rgba(255, 255, 255, 0.56);
  --neutral-dark-alfa-10: rgba(255, 255, 255, 0.64);
  --neutral-dark-alfa-11: rgba(255, 255, 255, 0.72);
  --neutral-dark-alfa-12: rgba(255, 255, 255, 0.80);
  --neutral-dark-alfa-13: rgba(255, 255, 255, 0.88);
  --neutral-dark-alfa-14: rgba(255, 255, 255, 0.96);

  /* --- Альфа-нейтрали: чёрные по светлому -------------------------------- */
  --neutral-light-alfa-1:  rgba(0, 0, 0, 0.08);
  --neutral-light-alfa-2:  rgba(0, 0, 0, 0.12);
  --neutral-light-alfa-3:  rgba(0, 0, 0, 0.16);
  --neutral-light-alfa-4:  rgba(0, 0, 0, 0.20);
  --neutral-light-alfa-5:  rgba(0, 0, 0, 0.24);
  --neutral-light-alfa-6:  rgba(0, 0, 0, 0.32);
  --neutral-light-alfa-7:  rgba(0, 0, 0, 0.40);
  --neutral-light-alfa-8:  rgba(0, 0, 0, 0.48);
  --neutral-light-alfa-9:  rgba(0, 0, 0, 0.56);
  --neutral-light-alfa-10: rgba(0, 0, 0, 0.64);
  --neutral-light-alfa-11: rgba(0, 0, 0, 0.72);
  --neutral-light-alfa-12: rgba(0, 0, 0, 0.80);
  --neutral-light-alfa-13: rgba(0, 0, 0, 0.88);
  --neutral-light-alfa-14: rgba(0, 0, 0, 0.96);

  /* --- Тональные альфы: серо-голубые (не чистые ч/б) --------------------- */
  --neutral-dark-alfa-tonal-1:  rgba(179, 182, 189, 0.08);
  --neutral-dark-alfa-tonal-2:  rgba(179, 182, 189, 0.12);
  --neutral-dark-alfa-tonal-3:  rgba(179, 182, 189, 0.16);
  --neutral-dark-alfa-tonal-4:  rgba(179, 182, 189, 0.20);
  --neutral-dark-alfa-tonal-5:  rgba(179, 182, 189, 0.24);
  --neutral-dark-alfa-tonal-6:  rgba(179, 182, 189, 0.32);
  --neutral-dark-alfa-tonal-7:  rgba(179, 182, 189, 0.40);
  --neutral-dark-alfa-tonal-8:  rgba(179, 182, 189, 0.48);
  --neutral-dark-alfa-tonal-9:  rgba(179, 182, 189, 0.56);
  --neutral-dark-alfa-tonal-10: rgba(179, 182, 189, 0.64);
  --neutral-dark-alfa-tonal-11: rgba(179, 182, 189, 0.72);
  --neutral-dark-alfa-tonal-12: rgba(179, 182, 189, 0.80);
  --neutral-dark-alfa-tonal-13: rgba(179, 182, 189, 0.88);
  --neutral-dark-alfa-tonal-14: rgba(179, 182, 189, 0.96);

  --neutral-light-alfa-tonal-1:  rgba(169, 172, 180, 0.08);
  --neutral-light-alfa-tonal-2:  rgba(169, 172, 180, 0.12);
  --neutral-light-alfa-tonal-3:  rgba(169, 172, 180, 0.16);
  --neutral-light-alfa-tonal-4:  rgba(169, 172, 180, 0.20);
  --neutral-light-alfa-tonal-5:  rgba(169, 172, 180, 0.24);
  --neutral-light-alfa-tonal-6:  rgba(169, 172, 180, 0.32);
  --neutral-light-alfa-tonal-7:  rgba(169, 172, 180, 0.40);
  --neutral-light-alfa-tonal-8:  rgba(169, 172, 180, 0.48);
  --neutral-light-alfa-tonal-9:  rgba(169, 172, 180, 0.56);
  --neutral-light-alfa-tonal-10: rgba(169, 172, 180, 0.64);
  --neutral-light-alfa-tonal-11: rgba(169, 172, 180, 0.72);
  --neutral-light-alfa-tonal-12: rgba(169, 172, 180, 0.80);
  --neutral-light-alfa-tonal-13: rgba(169, 172, 180, 0.88);
  --neutral-light-alfa-tonal-14: rgba(169, 172, 180, 0.96);

  /* ======================================================================
     SENTIMENT (статусы). На лендинге почти не нужны, но входят в систему.
     ====================================================================== */
  --sentiment-positive-light-9:    #00b24b;
  --sentiment-positive-dark-9:     #00b24b;
  --sentiment-negative-light-9:    #d93600;
  --sentiment-negative-dark-9:     #f63d00;
  --sentiment-warning-light-9:     #d97e00;
  --sentiment-warning-dark-9:      #d9a600;
  --sentiment-informative-light-9: #0075ff;
  --sentiment-informative-dark-9:  #0075ff;
  --sentiment-favorite-light-9:    #ffcc26;  /* VIP / золото */
  --sentiment-favorite-dark-9:     #ffcc26;
  --sentiment-first-9:             #ffc300;  /* 1-е место */
  --sentiment-second-9:            #818794;  /* 2-е место */
  --sentiment-third-9:             #d97e00;  /* 3-е место */

  /* ======================================================================
     ОТСТУПЫ (spacing) — шкала 1win
     ====================================================================== */
  --spacing-0:  0px;
  --spacing-1:  1px;
  --spacing-2:  2px;
  --spacing-4:  4px;
  --spacing-6:  6px;
  --spacing-8:  8px;
  --spacing-12: 12px;
  --spacing-16: 16px;
  --spacing-20: 20px;
  --spacing-24: 24px;
  --spacing-32: 32px;
  --spacing-40: 40px;
  --spacing-48: 48px;
  --spacing-64: 64px;

  /* ======================================================================
     РАДИУСЫ
     ====================================================================== */
  --rounding-0:  0px;
  --rounding-1:  1px;
  --rounding-2:  2px;
  --rounding-4:  4px;
  --rounding-6:  6px;
  --rounding-8:  8px;
  --rounding-10: 10px;
  --rounding-12: 12px;
  --rounding-14: 14px;
  --rounding-16: 16px;
  --rounding-20: 20px;
  --rounding-24: 24px;
  --rounding-32: 32px;
  --rounding-max: 999px;

  /* Семантические радиусы контейнеров и контролов */
  --rounding-container-xxs: var(--rounding-4);
  --rounding-container-xs:  var(--rounding-8);
  --rounding-container-s:   var(--rounding-12);
  --rounding-container-m:   var(--rounding-16);
  --rounding-container-l:   var(--rounding-20);
  --rounding-container-xl:  var(--rounding-24);
  --rounding-container-xxl: var(--rounding-32);

  --rounding-control-s:   var(--rounding-8);
  --rounding-control-m:   var(--rounding-10);
  --rounding-control-l:   var(--rounding-10);
  --rounding-control-xl:  var(--rounding-12);
  --rounding-control-xxl: var(--rounding-12);

  --rounding-component-avatar:   var(--rounding-max);
  --rounding-component-badge:    var(--rounding-max);
  --rounding-component-checkbox: var(--rounding-6);
  --rounding-component-chipstab: var(--rounding-max);
  --rounding-component-popover:  var(--rounding-16);
  --rounding-component-radio:    var(--rounding-max);
  --rounding-component-switch:   var(--rounding-max);
  --rounding-component-tooltip:  var(--rounding-12);

  /* ======================================================================
     РАЗМЕРЫ КОНТРОЛОВ
     ====================================================================== */
  --size-control-xxs: 24px;
  --size-control-xs:  28px;
  --size-control-s:   32px;
  --size-control-m:   36px;
  --size-control-l:   40px;
  --size-control-xl:  44px;
  --size-control-xxl: 48px;

  /* ======================================================================
     ТЕНИ
     ====================================================================== */
  --box-shadow-none: none;
  --box-shadow-xs: 0px 1px 1px 0px rgba(0, 0, 0, 0.05);
  --box-shadow-s:  0px 1px 1px 0px rgba(0, 0, 0, 0.06),
                   0px 1px 2px 0px rgba(0, 0, 0, 0.10);
  --box-shadow-m:  0px -2px 16px 0px rgba(0, 0, 0, 0.05),
                   0px 8px 16px -3px rgba(0, 0, 0, 0.08),
                   0px 1px 4px 0px rgba(0, 0, 0, 0.05);
  --box-shadow-l:  0px 4px 8px 0px rgba(0, 0, 0, 0.12),
                   0px 0px 20px 0px rgba(0, 0, 0, 0.24);
  --box-shadow-xl: 0px 4px 8px 0px rgba(0, 0, 0, 0.24),
                   0px 0px 20px 0px rgba(0, 0, 0, 0.50);

  /* ======================================================================
     ТИПОГРАФИКА — СЕМЕЙСТВА
     ====================================================================== */
  --reserved-fonts: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                    "Helvetica Neue", Arial, sans-serif;

  --font-body-font-family:       "Inter", var(--reserved-fonts);
  --font-caption-font-family:    "Inter", var(--reserved-fonts);
  --font-headline-font-family:   "Inter", var(--reserved-fonts);
  --font-display-font-family:    "Inter", var(--reserved-fonts);
  --font-decorative-font-family: "Halvar Breit", var(--reserved-fonts);

  /* ======================================================================
     ТИПОГРАФИКА — ШКАЛЫ
     Каждая роль: size / weight / line-height / letter-spacing.
     mobile = до 768px, desktop = от 768px.
     ====================================================================== */

  /* --- Decorative (Halvar Breit, 800, UPPERCASE) — акцидентный слой ------ */
  --font-decorative-text-case: uppercase;

  --font-decorative-display-s-mobile-font-size: 16px;
  --font-decorative-display-s-mobile-line-height: 20px;
  --font-decorative-display-s-mobile-letter-spacing: 0px;
  --font-decorative-display-s-desktop-font-size: 22px;
  --font-decorative-display-s-desktop-line-height: 26px;
  --font-decorative-display-s-desktop-letter-spacing: -0.44px;

  --font-decorative-display-m-mobile-font-size: 22px;
  --font-decorative-display-m-mobile-line-height: 26px;
  --font-decorative-display-m-mobile-letter-spacing: -0.44px;
  --font-decorative-display-m-desktop-font-size: 28px;
  --font-decorative-display-m-desktop-line-height: 32px;
  --font-decorative-display-m-desktop-letter-spacing: -0.56px;

  --font-decorative-display-l-mobile-font-size: 28px;
  --font-decorative-display-l-mobile-line-height: 34px;
  --font-decorative-display-l-mobile-letter-spacing: -0.56px;
  --font-decorative-display-l-desktop-font-size: 34px;
  --font-decorative-display-l-desktop-line-height: 38px;
  --font-decorative-display-l-desktop-letter-spacing: -1.36px;

  --font-decorative-display-xl-mobile-font-size: 34px;
  --font-decorative-display-xl-mobile-line-height: 38px;
  --font-decorative-display-xl-mobile-letter-spacing: -1.36px;
  --font-decorative-display-xl-desktop-font-size: 54px;
  --font-decorative-display-xl-desktop-line-height: 60px;
  --font-decorative-display-xl-desktop-letter-spacing: -2.16px;

  --font-decorative-display-2xl-mobile-font-size: 54px;
  --font-decorative-display-2xl-mobile-line-height: 54px;
  --font-decorative-display-2xl-mobile-letter-spacing: -2.80px;
  --font-decorative-display-2xl-desktop-font-size: 70px;
  --font-decorative-display-2xl-desktop-line-height: 70px;
  --font-decorative-display-2xl-desktop-letter-spacing: -2.80px;

  --font-decorative-font-weight: 800;
  --font-decorative-body-font-size: 13px;
  --font-decorative-body-line-height: 13px;
  --font-decorative-body-letter-spacing: 0.52px;

  /* --- Display (Inter 600) — крупные заголовки --------------------------- */
  --font-display-m-mobile-font-size: 28px;
  --font-display-m-mobile-line-height: 32px;
  --font-display-m-mobile-letter-spacing: -0.59px;
  --font-display-m-desktop-font-size: 44px;
  --font-display-m-desktop-line-height: 50px;
  --font-display-m-desktop-letter-spacing: -0.98px;

  --font-display-l-mobile-font-size: 32px;
  --font-display-l-mobile-line-height: 36px;
  --font-display-l-mobile-letter-spacing: -0.69px;
  --font-display-l-desktop-font-size: 56px;
  --font-display-l-desktop-line-height: 62px;
  --font-display-l-desktop-letter-spacing: -1.25px;

  --font-display-font-weight: 600;

  /* --- Headline (Inter 600) — h1…h4 -------------------------------------- */
  --font-headline-h1-mobile-font-size: 24px;
  --font-headline-h1-mobile-line-height: 28px;
  --font-headline-h1-mobile-letter-spacing: -0.47px;
  --font-headline-h1-desktop-font-size: 36px;
  --font-headline-h1-desktop-line-height: 40px;
  --font-headline-h1-desktop-letter-spacing: -0.79px;

  --font-headline-h2-mobile-font-size: 22px;
  --font-headline-h2-mobile-line-height: 26px;
  --font-headline-h2-mobile-letter-spacing: -0.40px;
  --font-headline-h2-desktop-font-size: 28px;
  --font-headline-h2-desktop-line-height: 32px;
  --font-headline-h2-desktop-letter-spacing: -0.59px;

  --font-headline-h3-mobile-font-size: 20px;
  --font-headline-h3-mobile-line-height: 24px;
  --font-headline-h3-mobile-letter-spacing: -0.33px;
  --font-headline-h3-desktop-font-size: 24px;
  --font-headline-h3-desktop-line-height: 28px;
  --font-headline-h3-desktop-letter-spacing: -0.47px;

  --font-headline-h4-mobile-font-size: 16px;
  --font-headline-h4-mobile-line-height: 22px;
  --font-headline-h4-mobile-letter-spacing: -0.12px;
  --font-headline-h4-desktop-font-size: 20px;
  --font-headline-h4-desktop-line-height: 24px;
  --font-headline-h4-desktop-letter-spacing: -0.33px;

  --font-headline-font-weight: 600;

  /* --- Display body (Inter 16/22) — крупный текст ------------------------ */
  --font-display-body-font-size: 16px;
  --font-display-body-line-height: 22px;
  --font-display-body-letter-spacing: -0.12px;
  --font-display-body-regular-font-weight: 400;
  --font-display-body-semibold-font-weight: 600;

  /* --- Body (Inter 14/20) — базовый текст -------------------------------- */
  --font-body-font-size: 14px;
  --font-body-line-height: 20px;
  --font-body-letter-spacing: 0px;
  --font-body-regular-font-weight: 400;
  --font-body-semibold-font-weight: 600;
  --font-body-label-font-weight: 600;

  /* --- Caption (Inter 12/16 и 10/14) ------------------------------------- */
  --font-caption-s-font-size: 12px;
  --font-caption-s-line-height: 16px;
  --font-caption-s-letter-spacing: 0.01px;
  --font-caption-s-caps-text-case: uppercase;
  --font-caption-s-regular-font-weight: 400;
  --font-caption-s-semibold-font-weight: 600;

  --font-caption-xs-font-size: 10px;
  --font-caption-xs-line-height: 14px;
  --font-caption-xs-letter-spacing: 0.10px;
  --font-caption-xs-regular-font-weight: 400;
  --font-caption-xs-semibold-font-weight: 600;

  /* ======================================================================
     Z-INDEX
     ====================================================================== */
  --z-index-main: 100;
  --z-index-floating: 102;
  --z-index-tabbar: 130;
  --z-index-sidebar: 131;
  --z-index-header: 140;
  --z-index-modal-layout: 1000;
  --z-index-snackbar: 1005;
  --z-index-tooltip: 1010;
}
