:root {
  /* Фон */
  --color-bg: #0b0f17;
  --color-bg-elevated: #1a1d28;
  --color-bg-muted: #222633;
  --color-bg-input: #161822;
  --color-card-solid: #000000;

  /* Текст */
  --color-text: #f5f6fa;
  --color-text-secondary: #b8bcc8;
  --color-text-muted: #8a8f9e;

  /* Акцент (дорого-синий) */
  --color-accent: #1c4fd8;
  --color-accent-hover: #163eb0;
  --color-accent-soft: rgba(28, 79, 216, 0.16);
  --color-accent-border: rgba(28, 79, 216, 0.55);

  /* Границы и разделители */
  --color-border: #2e3344;
  --color-border-soft: #252a38;

  /* Состояния */
  --color-success: #34d399;
  --color-error: #f87171;
  --color-warning: #fbbf24;

  /* Кнопки */
  --color-btn-primary-bg: var(--color-accent);
  --color-btn-primary-text: #ffffff;
  --color-btn-outline-border: var(--color-accent);
  --color-btn-outline-text: var(--color-accent);

  /* Чипы / теги */
  --color-chip-bg: var(--color-bg-muted);
  --color-chip-text: var(--color-text-secondary);
  --color-chip-active-bg: var(--color-accent-soft);
  --color-chip-active-text: var(--color-text);
  --color-chip-active-border: var(--color-accent);

  /* Карточки */
  --color-card-bg: var(--color-card-solid);
  --color-card-border: rgba(255, 255, 255, 0.08);

  /* Иконки */
  --color-icon: var(--color-accent);
  --color-icon-muted: var(--color-text-muted);

  --content-max: 1440px;   /* предел для текстовых блоков */
  --wide-max: 1760px;      /* предел для широких секций */
  --gutter: clamp(16px, 4vw, 48px);

  --bg:#0b0f17;
  --panel:#121722;
  --panel-2:#161c29;
  --border:#232c3b;
  --text:#f4f6f9;
  --muted:#8b97a5;
  --accent:#4f8fe0;
  --accent-2:#3b93f5;
}


.page {
  max-width: var(--wide-max);
  margin-inline: auto;
  background: var(--bg);
}