/* Утилиты pppoker — мелкие хелперы для шаблонов (документированы в CLAUDE.md).
   Раньше файла не было → классы .flex/.items-center/.gap-*/.text-*/.mt-* ничего
   не делали (кнопки не центрировались — иконочная уезжала по baseline). Цвета —
   только через var(--token). */

/* ── Видимость ── */
.hidden { display: none !important; }

/* ── Flex ── */
.flex { display: flex; }
.flex-1 { flex: 1; }
.items-center { align-items: center; }
.gap-1 { gap: 4px; }
.gap-2 { gap: 8px; }
.gap-4 { gap: 16px; }

/* ── Текст: цвет ── */
.text-accent  { color: var(--accent); }
.text-dim     { color: var(--dim); }
.text-muted   { color: var(--muted); }
.text-danger  { color: var(--ds-error); }
.text-warning { color: var(--cyan); }
.text-mono    { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }

/* ── Текст: размер ── */
.text-2xs { font-size: 10px; }
.text-xs  { font-size: 11px; }
.text-sm  { font-size: 12px; }

/* ── Отступы сверху (шаг 4px) ── */
.mt-1 { margin-top: 4px; }
.mt-2 { margin-top: 8px; }
.mt-3 { margin-top: 12px; }
.mt-4 { margin-top: 16px; }
.mt-5 { margin-top: 20px; }
.mt-6 { margin-top: 24px; }
.mt-7 { margin-top: 28px; }
.mt-8 { margin-top: 32px; }

/* ── Отступы снизу (шаг 4px) ── */
.mb-1 { margin-bottom: 4px; }
.mb-2 { margin-bottom: 8px; }
.mb-3 { margin-bottom: 12px; }
.mb-4 { margin-bottom: 16px; }
.mb-5 { margin-bottom: 20px; }
.mb-6 { margin-bottom: 24px; }
.mb-7 { margin-bottom: 28px; }
.mb-8 { margin-bottom: 32px; }

/* ── Прочее ── */
.cursor-pointer { cursor: pointer; }