/* =========================================================
   BASE.CSS — CSS-переменные (:root), сброс, типографика, скроллбар. Загружается первым — остальные модули используют var(--...) отсюда.
   ========================================================= */

/* =========================================================
   УЧЁТ ЗАКАЗОВ — единая дизайн-система
   Лаконичный, спокойный интерфейс: нейтральная палитра +
   один акцентный цвет. Все переменные объявлены один раз.
   ========================================================= */

:root {
  --bg: #f6f6f8;
  --surface: #ffffff;
  --surface-hover: #fafafb;
  --border: #e3e3e8;
  --border-strong: #d1d1d9;
  --text: #1c1c22;
  --text-muted: #79798a;
  --text-faint: #a6a6b3;

  --accent: #4f46e5;
  --accent-hover: #4338ca;
  --accent-soft: rgba(79, 70, 229, 0.1);
  --accent-soft-strong: rgba(79, 70, 229, 0.18);

  --success: #16a34a;
  --success-soft: rgba(22, 163, 74, 0.1);
  --danger: #dc2626;
  --danger-soft: rgba(220, 38, 38, 0.08);
  --warning: #d97706;

  --radius: 10px;
  --radius-sm: 7px;
  --radius-lg: 14px;

  --shadow-sm: 0 1px 2px rgba(20, 20, 30, 0.04);
  --shadow-md: 0 4px 16px rgba(20, 20, 30, 0.08);
  --shadow-modal: 0 20px 50px rgba(20, 20, 30, 0.18);

  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

* { box-sizing: border-box; }

html, body {
  height: 100%;
}

body {
  margin: 0;
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 { margin: 0; font-weight: 600; letter-spacing: -0.01em; }
p { margin: 0; }

button {
  font-family: inherit;
  cursor: pointer;
}

input, select, textarea {
  font-family: inherit;
  font-size: 14px;
}

::selection { background: var(--accent-soft-strong); }

a { color: var(--accent); }

/* ===== Скроллбар ===== */
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: var(--text-faint); }