@import "https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap";*{box-sizing:border-box;margin:0;padding:0;font-family:Outfit,sans-serif}a{color:inherit;text-decoration:none}.app{color:#fff;background:linear-gradient(#0b004e,#1d152f,#002834);min-height:100vh}.navbar{color:#ddd;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:100;background:#0006;border-bottom:1px solid #ffffff1a;justify-content:space-between;align-items:center;padding:18px 8%;display:flex;position:sticky;top:0}.logo{width:160px;height:auto}.navbar ul{gap:35px;list-style:none;display:flex}.navbar li{cursor:pointer;font-size:15px;transition:all .3s;position:relative}.navbar li:after{content:"";background:#a855f7;width:0%;height:2px;transition:all .3s;position:absolute;bottom:-5px;left:0}.navbar li:hover:after{width:100%}.navbar li:hover{color:#fff}.nav-right{align-items:center;gap:15px;display:flex}.navbar select{color:#fff;cursor:pointer;background:0 0;border:1px solid #666;border-radius:6px;padding:6px 10px}.navbar select:hover{border-color:#a855f7}.navbar button{color:#fff;cursor:pointer;background:linear-gradient(90deg,#7927ff,#a855f7);border:none;border-radius:20px;align-items:center;gap:8px;padding:10px 20px;font-size:14px;font-weight:500;transition:all .3s;display:flex}.navbar button:hover{opacity:.9;transform:scale(1.05)}.navbar button img{width:12px}@media (width<=900px){.navbar{padding:18px 6%}}@media (width<=768px){.navbar ul{display:none}.navbar{padding:15px 5%}}.home{padding:20px 10px 100px}.hero{text-align:center;flex-direction:column;align-items:center;gap:25px;max-width:700px;margin:100px auto;display:flex}.hero h1{font-size:max(4vw,36px);font-weight:600;line-height:1.2}.hero p{color:#bdbdbd;width:70%;line-height:1.6}.hero form{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff0d;border:1px solid #ffffff1a;border-radius:10px;align-items:center;gap:10px;width:85%;padding:10px 12px;display:flex}.hero input{color:#fff;background:0 0;border:none;outline:none;flex:1;padding-left:10px;font-size:15px}.hero button{color:#fff;cursor:pointer;background:linear-gradient(90deg,#7927ff,#a855f7);border:none;border-radius:8px;padding:10px 22px;font-size:14px;transition:all .3s}.hero button:hover{opacity:.9;transform:scale(1.05)}.crypto-table{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff08;border:1px solid #ffffff14;border-radius:15px;max-width:900px;margin:50px auto;overflow:hidden}.table-layout{border-bottom:1px solid #2a2a2a;grid-template-columns:.5fr 2fr 1fr 1fr 1.5fr;align-items:center;padding:16px 20px;transition:all .3s;display:grid}.table-layout:hover{background:#ffffff0d}.crypto-table>.table-layout:last-child{border-bottom:none}.table-layout div{align-items:center;gap:12px;display:flex}.table-layout div img{width:35px}.green{color:#16c784;text-align:center;font-weight:500}.red{color:#ea3943;text-align:center;font-weight:500}.market-cap{text-align:right}@media (width<=768px){.table-layout{grid-template-columns:.5fr 3fr 1fr 1fr}.market-cap{display:none}}@media (width<=500px){.table-layout{font-size:13px}.table-layout div img{width:25px}.hero form{width:95%}}.spinner{place-items:center;min-height:60vh;display:grid}.spin{border:5px solid #bdbdbd;border-top-color:#7927ff;border-radius:50%;width:65px;height:65px;animation:1s linear infinite rotate}@keyframes rotate{to{transform:rotate(360deg)}}.coin{color:#fff;padding:120px 20px 40px}.coin-name{flex-direction:column;align-items:center;gap:15px;margin:80px auto 40px;display:flex}.coin-name img{max-width:90px}.coin-name p b{font-size:38px;font-weight:600}.coin-chart{background:0 0;border-radius:10px;width:95%;max-width:900px;margin:40px auto;padding:10px}.coin-info{flex-direction:column;gap:12px;max-width:750px;margin:40px auto;display:flex}.coin-info ul{background:#ffffff08;border:1px solid #ffffff0f;border-radius:10px;justify-content:space-between;align-items:center;padding:14px 16px;list-style:none;transition:all .3s;display:flex}.coin-info ul:hover{background:#ffffff0f;transform:translateY(-2px)}.coin-info ul li:first-child{color:#aaa;font-size:14px}.coin-info ul li:last-child{color:#fff;font-size:15px;font-weight:500}.value{color:#16c784}.footer{text-align:center;text-align:center;color:#aaa;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#ffffff05;border-top:1px solid #ffffff1a;max-width:80%;margin:60px auto auto;padding:20px 10%;font-size:14px}.footer p{letter-spacing:.5px;margin:0}
