/* Design tokens «Machine Telemetry» (specs/design-system.md). The ONLY file with color literals. */

@font-face {
  font-family: "Archivo";
  src: url("../fonts/archivo-latin-wdth-normal.woff2") format("woff2-variations");
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Archivo";
  src: url("../fonts/archivo-latin-ext-wdth-normal.woff2") format("woff2-variations");
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, 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: "JetBrains Mono";
  src: url("../fonts/jetbrains-mono-latin-wght-normal.woff2") format("woff2-variations");
  font-weight: 100 800;
  font-display: swap;
}

:root {
  /* dark theme is the default */
  --surface-0: #0E1013;
  --surface-1: #161A1F;
  --line: #2A3038;
  --ink: #E8E6E1;
  --ink-muted: #8C939C;
  --signal: #FF5A1F;
  --signal-ink: #0E1013;
  --signal-text: #FF5A1F; /* signal as small text: 6.1:1 on surface-0 */
  --coolant: #38D4C8;
  --coolant-text: #38D4C8;
  --ok: #7BD88F;
  --warn: #F2C14E;
  --plate: #F2F0EA;
  --plate-dark: #1E2329;
  --grid-line: rgba(232, 230, 225, 0.05);
  --grid-axis: rgba(255, 90, 31, 0.18);

  --font-display: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --font-text: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;
  --font-zh: "PingFang SC", "Microsoft YaHei", "Noto Sans SC", "Source Han Sans SC", sans-serif;

  --step--1: clamp(0.83rem, 0.8rem + 0.15vw, 0.92rem);
  --step-0: clamp(1rem, 0.95rem + 0.25vw, 1.13rem);
  --step-1: clamp(1.2rem, 1.1rem + 0.5vw, 1.45rem);
  --step-2: clamp(1.44rem, 1.25rem + 0.9vw, 1.95rem);
  --step-3: clamp(1.73rem, 1.4rem + 1.6vw, 2.6rem);
  --step-4: clamp(2.07rem, 1.5rem + 2.8vw, 3.6rem);
  --step-5: clamp(2.5rem, 1.6rem + 4.4vw, 5rem);
  --step-6: clamp(3rem, 1.7rem + 6.4vw, 6.8rem);

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --space-10: 8rem;

  --gutter: 16px;
  --max-width: 1440px;
  --radius: 0;
  --border: 1px solid var(--line);
  --cut: 12px;
  --header-height: 64px;
  /* Component sizes (design-system.md § Размеры): px stay only for hairlines ≤ 3px, decorative patterns and breakpoints */
  --tap: 44px;              /* minimum touch target */
  --field-height: 48px;
  --textarea-height: 140px;
  --card-min: 260px;        /* plate grid column */
  --card-min-mid: 300px;    /* three-up plate grid */
  --card-min-wide: 320px;   /* lists, galleries, related blocks */
  --logo-box: 96px;
  --logo-max: 64px;
  --logo-box-large: 180px;
  --logo-max-large: 120px;
  --mark-width: 40px;       /* default brand mark in the header */
  --mark-height: 24px;
  --site-logo-height: 32px; /* logo uploaded in the admin */
  --site-logo-max-width: 200px;
  --duration: 240ms;
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}

@media (min-width: 768px) { :root { --gutter: 32px; } }
@media (min-width: 1440px) { :root { --gutter: 64px; } }

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    --surface-0: #ECEAE3;
    --surface-1: #F6F4EE;
    --line: #C9C5BA;
    --ink: #15181C;
    --ink-muted: #5B6168;
    --signal: #C23C0A; /* white text on it: 5.3:1 (WCAG AA) */
    --signal-ink: #FFFFFF;
    --signal-text: #B5370A; /* small text: 4.9:1 on surface-0 */
    --coolant: #0E8C83;
    --coolant-text: #0A6B64; /* small text: 5.3:1 on surface-0 */
    --ok: #1F8A3B;
    --warn: #9A6B00;
    --plate: #FFFFFF;
    --plate-dark: #22272E;
    --grid-line: rgba(21, 24, 28, 0.06);
    --grid-axis: rgba(217, 67, 11, 0.22);
  }
}
:root[data-theme="light"] {
  --surface-0: #ECEAE3;
  --surface-1: #F6F4EE;
  --line: #C9C5BA;
  --ink: #15181C;
  --ink-muted: #5B6168;
  --signal: #C23C0A;
  --signal-ink: #FFFFFF;
  --signal-text: #B5370A;
  --coolant: #0E8C83;
  --coolant-text: #0A6B64;
  --ok: #1F8A3B;
  --warn: #9A6B00;
  --plate: #FFFFFF;
  --plate-dark: #22272E;
  --grid-line: rgba(21, 24, 28, 0.06);
  --grid-axis: rgba(217, 67, 11, 0.22);
}
