/* ==========================================================================
   Дизайн-токены. Монохромная система: чистый чёрный, бумажно-белый,
   графитовые поверхности. Никаких обводок — только заливки и мягкие тени.
   ========================================================================== */

:root {
  /* Поверхности тёмной темы */
  --black:        #000000;
  --ink:          #0A0A0B;
  --panel:        #131315;
  --panel-2:      #1B1B1E;
  --panel-3:      #232327;

  /* Поверхности светлой темы */
  --paper:        #FFFFFF;
  --paper-2:      #F4F4F5;
  --paper-3:      #EBEBED;

  /* Текст */
  --on-dark:      #FFFFFF;
  --on-dark-2:    rgba(255, 255, 255, .60);
  --on-dark-3:    rgba(255, 255, 255, .38);
  --on-light:     #0A0A0B;
  --on-light-2:   rgba(10, 10, 11, .55);
  --on-light-3:   rgba(10, 10, 11, .34);

  /* Заливки-подложки (вместо обводок) */
  --fill-dark-1:  rgba(255, 255, 255, .07);
  --fill-dark-2:  rgba(255, 255, 255, .12);
  --fill-light-1: rgba(10, 10, 11, .05);
  --fill-light-2: rgba(10, 10, 11, .09);

  /* Акцент — намеренно ахроматичный, как в референсе */
  --accent:       #FFFFFF;
  --accent-ink:   #0A0A0B;
  --positive:     #C8F169;
  --warning:      #FFD166;

  /* Сцена показа (фон вокруг макета телефона) — спокойный графит */
  --stage-1:      #54545C;
  --stage-2:      #3E3E45;
  --stage-3:      #2F2F35;
  --stage-ink:    rgba(255, 255, 255, .92);
  --stage-ink-2:  rgba(255, 255, 255, .52);
  --stage-ink-3:  rgba(255, 255, 255, .34);
  --stage-glass:  rgba(38, 38, 43, .82);
  --stage-fill:   rgba(255, 255, 255, .10);

  /* Радиусы */
  --r-xs:  10px;
  --r-sm:  14px;
  --r-md:  18px;
  --r-lg:  22px;
  --r-xl:  28px;
  --r-2xl: 34px;
  --r-pill: 999px;

  /* Тени: мягкие, широкие, без каёмок */
  --sh-1: 0 2px 8px rgba(0, 0, 0, .06);
  --sh-2: 0 10px 30px rgba(0, 0, 0, .22);
  --sh-3: 0 22px 60px rgba(0, 0, 0, .30);
  --sh-dark: 0 -14px 44px rgba(0, 0, 0, .55);

  /* Тайминги */
  --e-out: cubic-bezier(.22, 1, .36, 1);
  --e-in-out: cubic-bezier(.65, 0, .35, 1);
  --t-fast: 180ms;
  --t-base: 320ms;
  --t-slow: 520ms;

  /* Логический экран приложения. В режиме макета он всегда именно такой,
     а под размер окна подгоняется масштабом (--k). */
  --device-w: 390px;
  --device-h: 844px;
  --device-bezel: 7px;
  --device-r: 54px;
  --k: 1;

  /* Высота дока демо-сценария (учитывается в раскладке) */
  --dock-h: 58px;

  /* Безопасные зоны телефона */
  --safe-b: env(safe-area-inset-bottom, 0px);
  --safe-t: env(safe-area-inset-top, 0px);

  /* Шрифт */
  --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
          'Helvetica Neue', Arial, sans-serif;
}