/* Единственный источник цветов, размеров и скоростей. Страницы берут только отсюда. */
:root {
  --paper: #F4F5F8;
  --surface: #FFFFFF;
  --sunken: #E9ECF2;
  --line: #D9DEE7;
  --line-2: #E8EBF1;
  --ink: #0B1B33;
  --ink-2: #44506A;
  --muted: #5A6478;

  --brand: #2547D0;
  --brand-hover: #1E3BB0;
  --brand-active: #1A3399;
  --brand-soft: #E6ECFC;
  --on-brand: #FFFFFF;
  --accent: #F2C14E;
  --accent-soft: #FCE7A8;

  --deep: #0B1B33;
  --deep-2: #16294A;
  --on-deep: #FFFFFF;
  --on-deep-2: #9AA8C3;

  --ok: #157347;
  --ok-soft: #E3F3EA;
  --warn: #9A5B0B;
  --warn-soft: #FBEFD9;
  --danger: #B42318;
  --danger-hover: #961C13;
  --danger-soft: #FBE7E5;
  --info: #0E7490;
  --info-soft: #E0F2F7;

  --focus: 0 0 0 3px rgba(37, 71, 208, .35);
  --sh-1: 0 1px 2px rgba(11, 27, 51, .06), 0 4px 12px rgba(11, 27, 51, .05);
  --sh-2: 0 4px 10px rgba(11, 27, 51, .08), 0 24px 48px -12px rgba(11, 27, 51, .25);

  --r-s: 6px;
  --r-m: 10px;
  --r-l: 14px;
  --r-xl: 20px;

  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 20px;
  --s-6: 24px;
  --s-8: 32px;

  --f-ui: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --f-display: 'Manrope', 'Inter', system-ui, sans-serif;
  --f-mono: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  --fs-xs: 11.5px;
  --fs-s: 12.5px;
  --fs-m: 14px;
  --fs-l: 16px;
  --fs-xl: 20px;
  --fs-2xl: 28px;
  --fs-3xl: 36px;

  --t-fast: 120ms;
  --t-med: 200ms;
  --ease: cubic-bezier(.2, .7, .2, 1);

  --side-w: 232px;
  --bar-h: 60px;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #0A1426;
    --surface: #111E36;
    --sunken: #0D1930;
    --line: #22324F;
    --line-2: #1A2943;
    --ink: #EEF2FA;
    --ink-2: #C3CCDD;
    --muted: #9AA8C3;
    --brand: #5B7BF0;
    --brand-hover: #7290F3;
    --brand-active: #8AA3F5;
    --brand-soft: #1B2D5C;
    --on-brand: #0A1426;
    --deep: #06101F;
    --deep-2: #12213C;
    --ok: #4BC489;
    --ok-soft: #10301F;
    --warn: #F0B455;
    --warn-soft: #36270C;
    --danger: #F27A6E;
    --danger-hover: #F59389;
    --danger-soft: #3A1512;
    --info: #4FC3DD;
    --info-soft: #0E2C35;
    --sh-1: 0 1px 2px rgba(0, 0, 0, .3);
    --sh-2: 0 10px 40px rgba(0, 0, 0, .5);
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --paper: #0A1426;
  --surface: #111E36;
  --sunken: #0D1930;
  --line: #22324F;
  --line-2: #1A2943;
  --ink: #EEF2FA;
  --ink-2: #C3CCDD;
  --muted: #9AA8C3;
  --brand: #5B7BF0;
  --brand-hover: #7290F3;
  --brand-active: #8AA3F5;
  --brand-soft: #1B2D5C;
  --on-brand: #0A1426;
  --deep: #06101F;
  --deep-2: #12213C;
  --ok: #4BC489;
  --ok-soft: #10301F;
  --warn: #F0B455;
  --warn-soft: #36270C;
  --danger: #F27A6E;
  --danger-hover: #F59389;
  --danger-soft: #3A1512;
  --info: #4FC3DD;
  --info-soft: #0E2C35;
  --sh-1: 0 1px 2px rgba(0, 0, 0, .3);
  --sh-2: 0 10px 40px rgba(0, 0, 0, .5);
  color-scheme: dark;
}