*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,Arial,sans-serif;background:#0f172a;color:#fff;min-height:100vh}.navbar{background:#020617;padding:18px;text-align:center;font-size:20px;font-weight:600;letter-spacing:.5px;border-bottom:1px solid #1e293b}.container{padding:30px 20px;text-align:center;max-width:1200px;margin:auto}.search{padding:12px 15px;width:280px;border-radius:8px;border:none;outline:none;margin-bottom:20px;font-size:15px;background:#e5e7eb;color:#111}.filters{margin-bottom:20px}.filters button{margin:6px;padding:9px 14px;border-radius:6px;border:none;cursor:pointer;background:#334155;color:#fff;transition:all .25s ease;font-size:14px}.filters button:hover{background:#2563eb;transform:translateY(-2px)}.filters .active{background:#22c55e;color:#022c22;font-weight:600}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px;margin-top:25px}.card{background:#1e293b;padding:20px;border-radius:12px;transition:all .3s ease;box-shadow:0 0 0 transparent}.card:hover{transform:translateY(-7px);box-shadow:0 12px 28px #00000073}.card h3{margin-bottom:10px;font-size:18px}.card p{margin-bottom:12px;color:#cbd5f5;font-size:14px}.card button{background:#2563eb;border:none;color:#fff;padding:8px 14px;border-radius:6px;cursor:pointer;transition:all .25s ease}.card button:hover{background:#1d4ed8;transform:scale(1.05)}.loader{margin-top:60px;font-size:20px;opacity:.8}.error{margin-top:50px;color:#f87171;font-size:18px}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#020617}::-webkit-scrollbar-thumb{background:#334155;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#475569}@media(max-width:600px){.search{width:90%}.navbar{font-size:18px}}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#020617d9;display:flex;justify-content:center;align-items:center;z-index:1000}.modal{background:#1e293b;padding:30px;border-radius:12px;width:350px;text-align:center;animation:popup .3s ease}.modal h2{margin-bottom:15px}.modal p{margin-bottom:12px;color:#cbd5f5}.close-btn{background:#ef4444}.close-btn:hover{background:#dc2626}@keyframes popup{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}.card-buttons{display:flex;justify-content:center;gap:10px;margin-top:10px}.fav{background:#475569}.fav:hover{background:#64748b}.active-fav{background:#facc15;color:#111827;font-weight:600}@media(max-width:600px){.container{padding:18px 14px}.filters{margin-top:10px;margin-bottom:18px;gap:6px}.card{padding:16px}.card-buttons{gap:6px}.card button{padding:9px;font-size:14px;border-radius:8px}.card button:first-child{background:#1d4ed8}.card button:last-child{background:#334155}.search{margin-bottom:12px}}@media(max-width:600px){.container{padding:20px 12px}.navbar{font-size:18px;padding:14px}.search{width:100%;max-width:100%;font-size:14px}.filters{display:flex;flex-wrap:wrap;justify-content:center}.filters button{font-size:13px;padding:8px 12px}.grid{grid-template-columns:1fr;gap:16px}.card{padding:18px;border-radius:10px}.card h3{font-size:17px}.card p{font-size:14px}.card-buttons{flex-direction:column;gap:8px}.card button{width:100%;padding:10px;font-size:14px}.modal{width:90%;padding:20px}}