/* Design tokens. Colours come from assets/colors.css (Radix Colors, generated by tools/colors.ts);
   this file only names their roles. Type: Onest, self-hosted, full Cyrillic and Latvian diacritics. */

@font-face { font-family: 'Onest'; font-display: swap; font-weight: 100 900; src: url(../assets/fonts/onest-latin-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Onest'; font-display: swap; font-weight: 100 900; src: url(../assets/fonts/onest-latin-ext-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Onest'; font-display: swap; font-weight: 100 900; src: url(../assets/fonts/onest-cyrillic-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }
@font-face { font-family: 'Onest'; font-display: swap; font-weight: 100 900; src: url(../assets/fonts/onest-cyrillic-ext-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F; }

:root {
  /* Surfaces and text */
  --bg: light-dark(#fff, var(--slate-1));
  --surface: light-dark(#fff, var(--slate-2));
  --tint: var(--slate-2);
  --ink: var(--slate-12);
  --ink-2: var(--slate-11);
  --line: var(--slate-6);
  --line-strong: var(--slate-8);
  /* One brand colour: actions, links, corrections, covered task points */
  /* Fills are darker than blue-9 so white text on them passes 4.5:1. */
  --brand: light-dark(var(--blue-11), color-mix(in oklab, var(--blue-9) 72%, #000));
  --brand-ink: light-dark(color-mix(in oklab, var(--blue-11) 70%, var(--blue-12)), var(--blue-11));
  --brand-soft: var(--blue-3);
  --brand-edge: color-mix(in oklab, var(--brand) 62%, #000);
  --on-brand: #fff;
  /* Semantic marks: red for grammar and spelling errors, amber for word choice */
  --err: var(--red-9);
  --err-ink: var(--red-11);
  --err-soft: color-mix(in oklab, var(--red-9) 14%, transparent);
  --style: var(--amber-10);
  /* «Можно сказать иначе»: a see-through brand blue, not a third colour */
  --alt-tint: color-mix(in oklab, var(--blue-9) 13%, transparent);
  --alt-tint-strong: color-mix(in oklab, var(--blue-9) 24%, transparent);
  --alt-line: light-dark(var(--blue-10), var(--blue-11));

  --font: 'Onest', 'Inter', system-ui, sans-serif;
  --step-0: clamp(1.0625rem, 1rem + 0.25vw, 1.1875rem);
  --step-1: clamp(1.1875rem, 1.05rem + 0.5vw, 1.375rem);
  --step-2: clamp(1.75rem, 1.2rem + 1.8vw, 2.5rem);
  --step-3: clamp(2.125rem, 1.3rem + 3.2vw, 3.75rem);
  --small: 0.9375rem;

  --gutter: clamp(16px, 5vw, 64px);
  --space: clamp(56px, 8vw, 112px);   /* between sections */
  --head-gap: clamp(20px, 2.5vw, 32px); /* from a section heading to its content */
  --radius: 12px;
  --radius-lg: 18px;
  --control: 52px;
  --shadow: 0 1px 2px rgb(0 0 0 / .04), 0 24px 60px -32px rgb(16 24 40 / .28);
  --shadow-pop: 0 12px 32px -18px rgb(16 24 40 / .35);
}