/* Дизайн-токены сервиса «Анализы». Файл СГЕНЕРИРОВАН из design/analiz/tokens/*.css —
   правки вносить в дизайн-систему и пересобирать: pnpm assets:tokens */

/* --- tokens/colors.css --- */
:root{
/* ——— Палитра НЕЙТРАЛЬНАЯ, до брендинга ———
   Бренда у сервиса «Анализы» пока нет: логотип, фирменный цвет и шрифты будут
   заданы отдельно. Чтобы это не превратилось в «временное навсегда», палитра
   здесь построена так, что смена бренда — правка ОДНОЙ секции: рампа --accent-*
   и семантические алиасы ниже. Ни один компонент не берёт цвет напрямую из
   рампы, только через алиас. */

/* --- Акцент: спокойный сине-зелёный. Не красный и не зелёный намеренно:
       в медицинском контексте оба уже значат «плохо» и «хорошо», и брать их
       под навигацию значит спорить с собственной же разметкой отклонений. --- */
--accent-50:#eef6f7;
--accent-100:#d7ebee;
--accent-200:#aed7dd;
--accent-300:#7dbcc6;
--accent-400:#4e9faa;
--accent-500:#2f838f;
--accent-600:#246a74;
--accent-700:#1d545c;
--accent-800:#173f45;

/* --- Нейтральная рампа (холодно-серая, под текст на бумаге) --- */
--ink-900:#14171a;
--ink-800:#21262b;
--ink-700:#39424a;
--ink-600:#556069;
--ink-500:#747f88;
--ink-400:#9aa4ac;
--ink-300:#c3cad0;
--ink-200:#e0e5e9;
--ink-100:#eef1f4;
--ink-50:#f7f9fa;
--white:#ffffff;

/* --- Статусы показателя. ЕДИНСТВЕННОЕ место, где цвет несёт смысл:
       «норма / ниже / выше / не распознано». Цветом ОДНИМ ничего не
       сообщается — рядом всегда стоит слово (см. ui/components.ts), иначе
       разбор нечитаем при цветовой слепоте и на чёрно-белой печати. --- */
--state-ok-fg:#1d6b3f;
--state-ok-bg:#e8f4ec;
--state-ok-border:#b7ddc6;

--state-low-fg:#1c5a86;
--state-low-bg:#e7f1f8;
--state-low-border:#b6d4e8;

--state-high-fg:#8a4413;
--state-high-bg:#fbf0e6;
--state-high-border:#eccfb2;

--state-unknown-fg:#556069;
--state-unknown-bg:#eef1f4;
--state-unknown-border:#d5dbe0;

/* --- Предупреждение: дисклеймер и «срочно к врачу» --- */
--warn-fg:#8a2f2f;
--warn-bg:#fbeded;
--warn-border:#ecc4c4;

/* --- Семантические алиасы: компоненты берут цвет ТОЛЬКО отсюда --- */
--text-heading:var(--ink-900);
--text-body:var(--ink-800);
--text-muted:var(--ink-600);
--text-faint:var(--ink-500);
--text-inverse:var(--white);
--text-link:var(--accent-700);
--text-link-hover:var(--accent-800);

--surface-page:var(--ink-50);
--surface-card:var(--white);
--surface-subtle:var(--ink-100);
--surface-sunken:var(--ink-200);
--surface-inverse:var(--ink-900);
--surface-accent-soft:var(--accent-50);
--surface-accent:var(--accent-600);

--border-subtle:var(--ink-200);
--border-strong:var(--ink-300);

--action-bg:var(--accent-600);
--action-bg-hover:var(--accent-700);
--action-fg:var(--white);
--action-ghost-border:var(--ink-300);

--ring-focus:0 0 0 3px var(--accent-200);
}

/* --- tokens/typography.css --- */
:root{
/* ——— Шрифты: СИСТЕМНЫЕ, файлов не подключается ———
   У tridereva шрифты лежат в public/assets/fonts и раздаются с своего домена.
   Здесь их нет намеренно: пока бренд не выбран, любой подключённый шрифт — это
   решение о бренде, принятое молча, плюс 200 КБ на первую загрузку страницы,
   которую человек открывает с телефона в поликлинике. Внешних CDN у сервиса
   нет вовсе (CSP `font-src 'self'`), так что «взять из Google Fonts» здесь не
   вариант ни сейчас, ни потом. */
--font-ui:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
--font-display:var(--font-ui);
--font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;

--text-xs:0.8125rem;
--text-sm:0.875rem;
--text-base:1rem;
--text-lg:1.125rem;
--text-xl:1.25rem;
--text-2xl:1.5rem;
--text-3xl:1.875rem;
--text-4xl:2.25rem;

--weight-regular:400;
--weight-medium:500;
--weight-semibold:600;
--weight-bold:700;

--leading-tight:1.2;
--leading-snug:1.3;
--leading-normal:1.5;
--leading-relaxed:1.65;

--tracking-tight:-0.01em;
--tracking-normal:0;
}

/* --- tokens/spacing.css --- */
:root{
--space-1:0.25rem;
--space-2:0.5rem;
--space-3:0.75rem;
--space-4:1rem;
--space-5:1.25rem;
--space-6:1.5rem;
--space-8:2rem;
--space-10:2.5rem;
--space-12:3rem;
--space-16:4rem;
--space-20:5rem;

/* Ширина колонки текста. Разбор читают подряд, а не проглядывают: строка
   длиннее ~70 символов теряется при переходе на следующую. */
--measure:68ch;
--container-max:64rem;
--container-pad:var(--space-4);
}

/* --- tokens/radius.css --- */
:root{
--radius-xs:4px;
--radius-sm:6px;
--radius-md:10px;
--radius-lg:14px;
--radius-xl:20px;
--radius-pill:999px;
}

/* --- tokens/elevation.css --- */
:root{
/* Теней мало и они слабые: страница результата — документ, а не панель
   приложения. Каждая карточка с заметной тенью на такой странице читается как
   «здесь что-то нажимается». */
--shadow-none:none;
--shadow-sm:0 1px 2px rgba(20,23,26,0.06);
--shadow-md:0 2px 8px rgba(20,23,26,0.08);
--shadow-lg:0 8px 24px rgba(20,23,26,0.10);
}

/* --- tokens/motion.css --- */
:root{
--duration-fast:120ms;
--duration-base:200ms;
--ease-standard:cubic-bezier(0.2,0,0,1);
}

/* Анимации на сайте сводятся к подсветке ссылок и кнопок, но правило нужно
   всё равно: человек, включивший «уменьшить движение», просил об этом систему,
   а не каждый сайт по отдельности. */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important}
}

/* --- tokens/base.css --- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font-ui);font-size:var(--text-base);line-height:var(--leading-relaxed);color:var(--text-body);background:var(--surface-page);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--font-display);color:var(--text-heading);line-height:var(--leading-snug);margin:0}
h1{font-size:var(--text-3xl);font-weight:var(--weight-bold);letter-spacing:var(--tracking-tight)}
h2{font-size:var(--text-xl);font-weight:var(--weight-semibold)}
h3{font-size:var(--text-lg);font-weight:var(--weight-semibold)}
p{margin:0}
ul,ol{margin:0;padding-left:1.25em}
a{color:var(--text-link);text-decoration:underline;text-underline-offset:2px;transition:color var(--duration-fast) var(--ease-standard)}
a:hover{color:var(--text-link-hover)}
img{max-width:100%;height:auto}
:focus-visible{outline:none;box-shadow:var(--ring-focus);border-radius:var(--radius-xs)}
code,pre{font-family:var(--font-mono);font-size:.92em}
/* Визуально скрытое, но доступное скринридеру и потоку фокуса. */
.vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}