/* css/style.css */
[x-cloak] { display: none !important; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
.fade-in { animation: fadeIn 0.5s ease-out forwards; opacity: 0; }
@keyframes spin { to { transform: rotate(360deg); } }
body { font-family: 'Inter', sans-serif; }
input, select, textarea, button { transition: all 0.2s ease-in-out; }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #e5e7eb; } .dark ::-webkit-scrollbar-track { background: #374151; }
::-webkit-scrollbar-thumb { background: #9ca3af; border-radius: 10px; } .dark ::-webkit-scrollbar-thumb { background: #6b7280; }
::-webkit-scrollbar-thumb:hover { background: #6b7280; } .dark ::-webkit-scrollbar-thumb:hover { background: #4b5563; }
.dark .prose-invert a { color: theme('colors.primary.300'); } .dark .prose-invert a:hover { color: theme('colors.primary.200'); }
.dark .prose-invert code { background-color: theme('colors.gray.700'); color: theme('colors.primary.300'); }
/* Subtle transition for dropdown */
.dropdown-menu { transition: opacity 0.2s ease-out, transform 0.2s ease-out; }