/* Colateral - Minimal overrides (Tailwind handles the rest) */

/* Scrollbar */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #D4C5B5; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #A39B91; }

/* Conic gradient ring for index score */
.index-ring {
    background: conic-gradient(
        #1A5C5E calc(var(--score, 0) * 1%),
        #E8DDD3 calc(var(--score, 0) * 1%)
    );
}

/* Mobile responsive overrides */
@media (max-width: 639px) {
    /* Prevent horizontal overflow */
    body { overflow-x: hidden; }

    /* Scale down page headers on mobile */
    main h1 { font-size: 1.25rem !important; }

    /* Wrap header flex rows on mobile */
    main > div:first-child {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    /* Scale action buttons on mobile */
    main a[class*="px-5"][class*="py-2.5"],
    main button[class*="px-5"][class*="py-2.5"] {
        padding: 0.5rem 0.75rem;
        font-size: 0.75rem;
    }

    /* Reduce card padding on mobile */
    main .rounded-2xl[class*="p-8"] {
        padding: 1.25rem;
    }
    main .rounded-2xl[class*="p-6"] {
        padding: 1rem;
    }
    main .rounded-2xl[class*="p-7"] {
        padding: 1.25rem;
    }
    main .rounded-2xl[class*="p-10"] {
        padding: 1.5rem;
    }

    /* Grid gaps tighter */
    main [class*="gap-6"] { gap: 1rem; }
    main [class*="gap-5"] { gap: 0.75rem; }

    /* Community post items */
    main a[class*="px-6"][class*="py-5"] {
        padding: 0.75rem 1rem;
    }
}

/* Scroll reveal */
.reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1), transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}
.reveal.visible { opacity: 1; transform: translateY(0); }
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }