/* =====================================================================
   AURAO Decorator — Static Tailwind utilities
   Заменяет <script src="https://cdn.tailwindcss.com"> (~200KB → 2KB).
   Сгенерирован 2026-05-27. Содержит ТОЛЬКО используемые классы.
   ===================================================================== */

/* ── Display ── */
.hidden     { display: none !important; }
.block      { display: block; }
.flex       { display: flex; }
.grid       { display: grid; }
.inline     { display: inline; }

/* ── Flex / Grid ── */
.flex-1       { flex: 1 1 0%; }
.flex-wrap    { flex-wrap: wrap; }
.items-center { align-items: center; }
.justify-between { justify-content: space-between; }
.grid-cols-2  { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-cols-3  { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-cols-4  { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.gap-1  { gap: 4px; }
.gap-2  { gap: 8px; }
.gap-3  { gap: 12px; }
.gap-6  { gap: 24px; }
.gap-8  { gap: 32px; }
.space-y-2 > * + * { margin-top: 8px; }
.space-y-3 > * + * { margin-top: 12px; }

/* ── Spacing ── */
.p-2    { padding: 8px; }
.px-8   { padding-left: 32px; padding-right: 32px; }
.pb-16  { padding-bottom: 64px; }
.mt-1   { margin-top: 4px; }
.mt-2   { margin-top: 8px; }
.mt-3   { margin-top: 12px; }
.mb-1   { margin-bottom: 4px; }
.mb-2   { margin-bottom: 8px; }
.mb-6   { margin-bottom: 24px; }
.mx-auto { margin-left: auto; margin-right: auto; }

/* ── Sizing ── */
.w-3      { width: 12px; }
.w-4      { width: 16px; }
.w-full   { width: 100%; }
.h-3      { height: 12px; }
.h-4      { height: 16px; }
.max-w-7xl { max-width: 1280px; }

/* ── Typography ── */
.text-xs     { font-size: 12px; line-height: 16px; }
.text-2xl    { font-size: 24px; line-height: 32px; }
.text-3xl    { font-size: 30px; line-height: 36px; }
.text-center { text-align: center; }
.font-semibold { font-weight: 600; }

/* ── Colors (Tailwind slate palette) ── */
.text-slate-200 { color: #E2E8F0; }
.text-slate-300 { color: #CBD5E1; }
.text-slate-400 { color: #94A3B8; }
.text-slate-500 { color: #64748B; }
.text-red-400   { color: #F87171; }

/* ── Borders ── */
.rounded { border-radius: 2px; } /* AURAO override: 2px вместо Tailwind 4px */

/* ── Interactivity ── */
.cursor-pointer { cursor: pointer; }