/* Base custom styles: font smoothing, scrollbar, and mobile performance overrides.
   Note: Tailwind utility components (.glass-panel, .shield-pill, .ai-pill, .particle,
   .contact-card) live in the inline <style type="text/tailwindcss"> block in index.html,
   because the Tailwind Play CDN only compiles @apply from inline style tags. */

html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

::-webkit-scrollbar {
    width: 4px;
}
::-webkit-scrollbar-track {
    background: transparent;
}
::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.08);
    border-radius: 4px;
}

/* Mobile: drop heavy effects (grain, aurora, strong blur) for performance. */
@media (max-width: 768px) {
    .grain-overlay {
        display: none;
    }
    .aurora {
        display: none;
    }
    .glass-panel {
        background: rgba(19, 19, 19, 0.5) !important;
        backdrop-filter: blur(8px) !important;
        -webkit-backdrop-filter: blur(8px) !important;
        border-color: rgba(255, 255, 255, 0.08) !important;
    }
    .glass-panel .backdrop-blur-sm,
    .badge-blur {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
}