/* tw-lite: подмножество утилит Tailwind + FontAwesome-иконки ТОЛЬКО для HTML статей из БД
   (cont_topcats.content раздела /freebets/ свёрстан классами Tailwind, который ни у легаси, ни у нас
   не подключён — на бою статья без оформления). Подключается в articles/show только когда в content
   есть class="...". Полный Tailwind не тянем: 300 КБ ради одной статьи и чужая сетка на всём макете.
   Область действия — .art__content, на остальной layout не влияет. */

.art__content .container { max-width: none; padding: 0; }
.art__content .mx-auto { margin-left: auto; margin-right: auto; }
.art__content .max-w-3xl { max-width: 768px; }
.art__content .w-full { width: 100%; }
.art__content .w-8 { width: 32px; }
.art__content .h-8 { height: 32px; }

.art__content .flex { display: flex; }
.art__content .inline-block { display: inline-block; }
.art__content .block { display: block; }
.art__content .grid { display: grid; }
.art__content .grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.art__content .gap-6 { gap: 24px; }
.art__content .items-center { align-items: center; }
.art__content .items-start { align-items: flex-start; }
.art__content .justify-center { justify-content: center; }
.art__content .flex-shrink-0 { flex-shrink: 0; }
.art__content .absolute { position: absolute; }
.art__content .top-0 { top: 0; }
.art__content .left-0 { left: 0; }
.art__content .overflow-hidden { overflow: hidden; }
.art__content .overflow-x-auto { overflow-x: auto; }
@media (min-width: 768px) {
    .art__content .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .art__content .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .art__content .md\:col-span-2 { grid-column: span 2 / span 2; }
    .art__content .md\:text-2xl { font-size: 24px; line-height: 32px; }
}
@media (min-width: 1024px) {
    .art__content .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.art__content .mb-2 { margin-bottom: 8px; }
.art__content .mb-3 { margin-bottom: 12px; }
.art__content .mb-4 { margin-bottom: 16px; }
.art__content .mb-6 { margin-bottom: 24px; }
.art__content .mb-8 { margin-bottom: 32px; }
.art__content .mb-10 { margin-bottom: 40px; }
.art__content .mt-1 { margin-top: 4px; }
.art__content .mt-2 { margin-top: 8px; }
.art__content .mr-1 { margin-right: 4px; }
.art__content .mr-2 { margin-right: 8px; }
.art__content .mr-3 { margin-right: 12px; }
.art__content .mr-4 { margin-right: 16px; }
.art__content .ml-3 { margin-left: 12px; }
.art__content .p-4 { padding: 16px; }
.art__content .p-6 { padding: 24px; }
.art__content .p-8 { padding: 32px; }
.art__content .pb-6 { padding-bottom: 24px; }
.art__content .pl-6 { padding-left: 24px; }
.art__content .pl-10 { padding-left: 40px; }
.art__content .px-4 { padding-left: 16px; padding-right: 16px; }
.art__content .px-8 { padding-left: 32px; padding-right: 32px; }
.art__content .py-3 { padding-top: 12px; padding-bottom: 12px; }
.art__content .py-10 { padding-top: 40px; padding-bottom: 40px; }
.art__content .py-12 { padding-top: 48px; padding-bottom: 48px; }
.art__content .space-y-1 > * + * { margin-top: 4px; }
.art__content .space-y-3 > * + * { margin-top: 12px; }
.art__content .space-y-4 > * + * { margin-top: 16px; }
.art__content .space-y-6 > * + * { margin-top: 24px; }

.art__content .text-sm { font-size: 13px; line-height: 20px; }
.art__content .text-lg { font-size: 17px; line-height: 28px; }
.art__content .text-xl { font-size: 19px; line-height: 28px; }
.art__content .text-2xl { font-size: 22px; line-height: 30px; }
.art__content .text-3xl { font-size: 26px; line-height: 34px; }
.art__content .font-medium { font-weight: 500; }
.art__content .font-semibold { font-weight: 600; }
.art__content .font-bold { font-weight: 700; }
.art__content .text-center { text-align: center; }
.art__content .text-left { text-align: left; }
.art__content .list-disc { list-style-type: disc; }
.art__content .list-decimal { list-style-type: decimal; }

.art__content .text-white { color: #fff; }
.art__content .text-gray-600 { color: #4b5563; }
.art__content .text-gray-700 { color: #374151; }
.art__content .text-gray-800 { color: #1f2937; }
.art__content .text-blue-500 { color: #3b82f6; }
.art__content .text-blue-600 { color: #2563eb; }
.art__content .text-blue-800 { color: #1e40af; }
.art__content .text-green-500 { color: #22c55e; }
.art__content .text-green-600 { color: #16a34a; }
.art__content .text-red-600 { color: #dc2626; }
.art__content .text-red-800 { color: #991b1b; }
.art__content .text-yellow-500 { color: #eab308; }
.art__content .text-yellow-600 { color: #ca8a04; }
.art__content .text-yellow-700 { color: #a16207; }
.art__content .text-yellow-800 { color: #854d0e; }

.art__content .bg-white { background-color: #fff; }
.art__content .bg-gray-50 { background-color: #f9fafb; }
.art__content .bg-blue-50 { background-color: #eff6ff; }
.art__content .bg-blue-600 { background-color: #2563eb; }
.art__content .bg-red-50 { background-color: #fef2f2; }
.art__content .bg-yellow-50 { background-color: #fefce8; }
.art__content .hover\:bg-blue-700:hover { background-color: #1d4ed8; }
.art__content .hover\:bg-gray-100:hover { background-color: #f3f4f6; }
.art__content .border { border: 1px solid #e5e7eb; }
.art__content .border-b { border-bottom: 1px solid #e5e7eb; }
.art__content .border-l-4 { border-left: 4px solid #e5e7eb; }
.art__content .border-gray-200 { border-color: #e5e7eb; }
.art__content .border-blue-100 { border-color: #dbeafe; }
.art__content .border-red-500 { border-color: #ef4444; }
.art__content .border-yellow-500 { border-color: #eab308; }
.art__content .border-collapse { border-collapse: collapse; }
.art__content .rounded { border-radius: 4px; }
.art__content .rounded-lg { border-radius: 8px; }
.art__content .rounded-full { border-radius: 9999px; }
.art__content .shadow-md { box-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1); }
.art__content .transition { transition: background-color .2s, color .2s, box-shadow .2s; }
.art__content .duration-300 { transition-duration: .3s; }

/* Классы, объявленные в статье, но нигде не определённые — разумные значения */
.art__content .gradient-bg { background: linear-gradient(135deg, #1e40af 0%, #2563eb 60%, #3b82f6 100%); border-radius: 8px; }
.art__content .highlight-box { background: #eff6ff; border-left: 4px solid #2563eb; padding: 16px 20px; border-radius: 0 8px 8px 0; margin-bottom: 16px; }
.art__content .bonus-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; overflow: hidden; }
.art__content .step-box { position: relative; padding-left: 40px; }
.art__content .step-circle { position: absolute; left: 0; top: 0; width: 32px; height: 32px; border-radius: 9999px;
    background: #2563eb; color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; }

/* FontAwesome не подключён — иконки заменяем символами */
.art__content .fas { display: inline-block; font-style: normal; line-height: 1; }
.art__content .fa-check::before { content: "✓"; }
.art__content .fa-check-circle::before { content: "✔"; }
.art__content .fa-exclamation-circle::before { content: "!"; font-weight: 700; }
.art__content .fa-info-circle::before { content: "i"; font-weight: 700; }
.art__content .fa-lightbulb::before { content: "💡"; }
.art__content .fa-futbol::before { content: "⚽"; }
.art__content .fa-basketball-ball::before { content: "🏀"; }
.art__content .fa-hockey-puck::before { content: "🏒"; }
.art__content .fa-table-tennis::before { content: "🏓"; }
.art__content .fa-gamepad::before { content: "🎮"; }
.art__content .fa-trophy::before { content: "🏆"; }
.art__content .fa-medal::before { content: "🏅"; }
.art__content .fa-users::before { content: "👥"; }
.art__content .fa-history::before { content: "🕘"; }
.art__content .fa-undo::before { content: "↺"; }
.art__content .fa-chart-line::before { content: "📈"; }
.art__content .fa-percentage::before { content: "%"; font-weight: 700; }