*{margin:0;padding:0;box-sizing:border-box}:root{--primary:#1E3A5F;--accent:#8B9DAF;--text-dark:#1E293B;--white:#FFFFFF;--border-light:#E2E8F0;--transition:all 0.2s ease}body{font-family:'Inter',system-ui,-apple-system,sans-serif;background-color:var(--white);color:var(--text-dark);line-height:1.6;-webkit-font-smoothing:antialiased}.container{max-width:1200px;margin:0 auto;padding:0 24px}a{text-decoration:none;color:inherit}.header-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;min-height:72px;border-bottom:1px solid var(--border-light)}.logo{font-size:1.9rem;font-weight:700;letter-spacing:-0.02em;color:var(--primary);display:flex;align-items:center;gap:6px}.logo i{color:var(--accent);font-size:1.8rem}.nav-list{display:flex;gap:2.5rem;list-style:none}.nav-list a{font-weight:500;font-size:1.05rem;color:var(--text-dark);padding-bottom:6px;border-bottom:2px solid transparent;transition:var(--transition)}.nav-list a:hover{color:var(--primary);border-bottom-color:var(--accent)}@media (max-width:640px){.header-inner{flex-direction:column;gap:12px;padding:12px 0}.nav-list{flex-wrap:wrap;justify-content:center;gap:1.8rem 2rem}.logo{font-size:1.7rem}}.footer-bottom{border-top:1px solid rgba(30,58,95,0.15);margin-top:40px;padding:28px 0 16px;text-align:center;font-size:0.95rem;color:var(--text-dark);opacity:0.7}i{margin-right:4px}
body{font-family:system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',sans-serif;background:#f0f4fa;color:#0b1c2e;line-height:1.4;min-height:100vh;display:flex;flex-direction:column}
header{text-align:center;padding:3rem 1.5rem 1rem}
h1{font-size:2.5rem;font-weight:300;letter-spacing:-0.02em;color:#0a1927;margin-bottom:0.25rem}
.count{font-size:0.9rem;color:#5e7180;font-weight:350}
.container{max-width:1100px;margin:0 auto;padding:2rem 1.5rem 3rem;flex:1;width:100%}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.25rem}
.card{background:linear-gradient(145deg,#ffffff 0%,#fafdff 100%);border-radius:20px;box-shadow:0 10px 20px -8px rgba(12,30,50,0.08),0 0 0 1px rgba(156,188,216,0.1);text-decoration:none;display:flex;align-items:center;justify-content:center;padding:1.8rem 1.2rem;min-height:140px;transition:all 0.3s ease;border:1px solid rgba(255,255,255,0.5);backdrop-filter:blur(0);text-align:center;word-break:break-word}
.card:hover{transform:translateY(-5px);box-shadow:0 20px 30px -10px rgba(23,92,172,0.15),0 0 0 1px #a3c6e9;background:#ffffff;border-color:#ffffff}
.title{font-size:1.3rem;font-weight:420;color:#163A5F;line-height:1.3;transition:color 0.2s}
.card:hover .title{color:#0f6fbf}
.empty{text-align:center;padding:5rem 2rem;background:#ffffffc0;border-radius:28px;color:#6f8a9c;font-size:1.2rem;font-weight:300;backdrop-filter:blur(4px)}
footer{text-align:center;padding:2.5rem 1rem;color:#809aab;font-size:0.8rem;border-top:1px solid #dae2ec;margin-top:auto}
.dot{display:inline-block;width:3px;height:3px;background:#b0c6d7;border-radius:50%;margin:0 8px;vertical-align:middle}
@keyframes fade{0%{opacity:0;transform:scale(0.96) translateY(10px)}100%{opacity:1;transform:scale(1) translateY(0)}}
.card{animation:fade 0.45s ease backwards}
.card:nth-child(1){animation-delay:0.02s}.card:nth-child(2){animation-delay:0.04s}.card:nth-child(3){animation-delay:0.06s}.card:nth-child(4){animation-delay:0.08s}.card:nth-child(5){animation-delay:0.10s}.card:nth-child(6){animation-delay:0.12s}
@media(max-width:640px){h1{font-size:2rem}.grid{grid-template-columns:repeat(2,1fr);gap:0.9rem}.card{padding:1.5rem 0.8rem;min-height:120px}.title{font-size:1.1rem}}@media(max-width:400px){.grid{grid-template-columns:1fr}}