@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300..800&family=Noto+Sans+SC:wght@300..800&display=swap');

body { 
    font-family: 'Noto Sans SC', 'Inter', sans-serif; 
    background-color: #f8fafc;
    /* 添加微妙的背景纹理 */
    background-image: radial-gradient(circle at 10% 20%, rgba(219, 234, 254, 0.4) 0%, transparent 20%),
                      radial-gradient(circle at 90% 80%, rgba(237, 233, 254, 0.4) 0%, transparent 20%);
    background-attachment: fixed;
    transition: background-color 0.3s ease;
}

/* Dark Mode Background */
.dark body {
    background-color: #0f172a;
    background-image: radial-gradient(circle at 10% 20%, rgba(30, 58, 138, 0.2) 0%, transparent 20%),
                      radial-gradient(circle at 90% 80%, rgba(49, 46, 129, 0.2) 0%, transparent 20%);
}

/* 磨砂玻璃效果 */
.glass-nav {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    transition: background-color 0.3s ease;
}

.dark .glass-nav {
    background: rgba(15, 23, 42, 0.85);
    border-bottom-color: rgba(255, 255, 255, 0.1);
}

/* 更加精致的卡片悬停效果 */
.model-card {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.model-card:hover { 
    transform: translateY(-4px); 
    box-shadow: 0 12px 24px -8px rgba(0, 0, 0, 0.08), 0 4px 8px -4px rgba(0, 0, 0, 0.04);
    border-color: #bfdbfe; /* hover:border-blue-200 */
}

.dark .model-card:hover {
    box-shadow: 0 12px 24px -8px rgba(0, 0, 0, 0.3), 0 4px 8px -4px rgba(0, 0, 0, 0.2);
    border-color: #1e40af; /* hover:border-blue-800 */
}

/* 隐藏滚动条但保留功能 */
.hide-scrollbar::-webkit-scrollbar { display: none; }
.hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* Fade In Animation */
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
.animate-fade-in { animation: fadeIn 0.5s ease-out forwards; }