@import"https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;500;600;700&family=Inter:wght@300;400;500;600&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,sans-serif;background:linear-gradient(135deg,#0c1426,#0f172a);color:#f8fafc;line-height:1.6;padding:2rem;min-height:100vh}a{color:#60a5fa;text-decoration:none;transition:color .3s ease}a:hover{color:#3b82f6}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem;margin:2rem 0}.coin-card{background:#ffffff14;padding:1.5rem;height:250px;border-radius:16px;border:1px solid rgba(255,255,255,.15);transition:all .3s ease;cursor:pointer}.coin-card:hover{transform:translateY(-8px);box-shadow:0 12px 40px #00000080;background:#ffffff1f}.coin-header{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}.coin-image{width:48px;height:48px;border-radius:50%}.coin-info h3{font-size:1.2rem;font-weight:600;color:#f8fafc;margin-bottom:4px}.symbol{font-size:.9rem;color:#94a3b8;font-weight:500}.positive{color:#10b981;font-weight:600}.negative{color:#ef4444;font-weight:600}.top-nav{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.5rem;margin-bottom:2rem;background:#ffffff14;border-radius:12px;border:1px solid rgba(255,255,255,.15);flex-wrap:wrap}.top-nav h1{font-family:"Baloo 2",cursive;font-weight:700;color:#f8fafc;font-size:clamp(1.5rem,3vw,2.2rem);margin:0}.top-nav nav{display:flex;gap:1.5rem;align-items:center}.top-nav a{color:#f1f5f9;font-weight:500;font-size:clamp(.9rem,1.5vw,1.1rem);padding:.5rem 1rem;border-radius:8px;transition:all .3s ease}.top-nav a:hover{background:#ffffff1a;color:#60a5fa}.img-logo{width:clamp(100px,12vw,140px);height:auto}.top-controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;gap:1.5rem;padding:1rem 1.5rem;background:#ffffff0d;border-radius:12px;border:1px solid rgba(255,255,255,.1);flex-wrap:wrap}.filter{flex:1;min-width:240px}.filter input{width:100%;padding:.75rem 1rem;border-radius:8px;border:1px solid rgba(255,255,255,.2);background:#ffffff14;color:#f8fafc;font-size:1rem;transition:all .3s ease}.filter input:focus{background:#ffffff1f;border-color:#60a5fa;outline:none}.filter input::placeholder{color:#94a3b8}.controls{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}.controls label{font-weight:500;font-size:.95rem;color:#cbd5e1}.controls select{padding:.6rem 1rem;border-radius:8px;background:#ffffff14;color:#6b747c;border:1px solid rgba(255,255,255,.2);font-size:.9rem;cursor:pointer;transition:all .3s ease;min-width:120px}.controls select:hover{background:#ffffff1f;border-color:#ffffff4d}.controls select:focus{outline:none;border-color:#60a5fa}.about{max-width:800px;margin:0 auto;background:#ffffff14;padding:2rem;border-radius:16px;border:1px solid rgba(255,255,255,.15)}.about h1{margin-bottom:1.5rem;font-family:"Baloo 2",cursive;font-size:2.5rem;color:#f8fafc}.about p{margin-bottom:1.5rem;line-height:1.7;color:#cbd5e1;font-size:1.1rem}.coin-details-container{max-width:800px;margin:2rem auto;padding:2rem;border-radius:16px;background:#ffffff14;border:1px solid rgba(255,255,255,.15);color:#f8fafc;text-align:center}.coin-details-container a{display:inline-block;margin-bottom:1.5rem;font-weight:600;color:#60a5fa;padding:.5rem 1rem;border-radius:8px;transition:all .3s ease}.coin-details-container a:hover{background:#ffffff1a}.coin-details-title{font-family:"Baloo 2",cursive;font-size:2.5rem;margin-bottom:1rem;color:#f8fafc}.coin-details-image{width:100px;height:100px;margin-bottom:1.5rem;border-radius:50%}.coin-details-description{font-size:1.1rem;margin-bottom:2rem;color:#cbd5e1;line-height:1.7}.coin-details-info h3,.coin-details-info h4{margin:1rem 0;font-weight:600;color:#f8fafc}.coin-details-info h3{font-size:1.3rem;color:#60a5fa}.coin-details-info h4{font-size:1.1rem;color:#cbd5e1}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000c;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background:#ffffff1f;color:#f8fafc;padding:2rem;border-radius:16px;width:90%;max-width:600px;border:1px solid rgba(255,255,255,.2);animation:slideUp .3s ease}@keyframes slideUp{0%{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}@media (max-width: 768px){body{padding:1rem}.top-nav{padding:.5rem .75rem;flex-wrap:nowrap}.top-nav h1{font-size:1.2rem;flex-shrink:0}.top-nav nav{gap:.5rem;flex-shrink:1;overflow-x:auto}.top-nav a{font-size:.8rem;padding:.25rem .5rem;white-space:nowrap}.img-logo{width:70px}.top-controls{padding:.5rem .75rem;gap:.5rem;flex-wrap:nowrap;overflow-x:auto}.filter{min-width:100px;flex:1;max-width:150px}.filter input{padding:.4rem .6rem;font-size:.85rem;min-width:0}.controls{gap:.4rem;flex-shrink:0;flex-wrap:nowrap;white-space:nowrap}.controls label{font-size:.8rem}.controls select{padding:.35rem .6rem;font-size:.8rem;min-width:80px}.grid{grid-template-columns:1fr 1fr;gap:1rem}.coin-card{height:auto;min-height:200px}.about h1,.coin-details-title{font-size:2rem}}@media (max-width: 480px){.top-nav{padding:.4rem .5rem}.grid{grid-template-columns:1fr;gap:1rem}.top-nav h1{font-size:1rem}.top-nav a{font-size:.75rem;padding:.2rem .4rem}.img-logo{width:60px}.top-controls{padding:.4rem .5rem;gap:.4rem;overflow-x:auto}.filter{min-width:80px;max-width:120px}.filter input{font-size:.8rem;padding:.35rem .5rem;min-width:0}.controls label{font-size:.75rem}.controls select{font-size:.75rem;padding:.3rem .5rem;min-width:70px}.coin-card{padding:1rem}}
