@font-face{font-family:Montserrat;font-style:normal;font-weight:400;font-display:swap;src:url(/assets/Montserrat-Regular-DLSKq2aI.woff2) format("woff2")}@font-face{font-family:Montserrat;font-style:normal;font-weight:500;font-display:swap;src:url(/assets/Montserrat-Medium-DOh6wYMa.woff2) format("woff2")}@font-face{font-family:Montserrat;font-style:normal;font-weight:600;font-display:swap;src:url(/assets/Montserrat-SemiBold-CfD65XhI.woff2) format("woff2")}@font-face{font-family:Montserrat;font-style:normal;font-weight:700;font-display:swap;src:url(/assets/Montserrat-Bold-CnhIhCuj.woff2) format("woff2")}@font-face{font-family:Montserrat;font-style:normal;font-weight:800;font-display:swap;src:url(/assets/Montserrat-ExtraBold-DsEz0UwE.woff2) format("woff2")}*{margin:0;padding:0;box-sizing:border-box;font-family:Montserrat,sans-serif}.navbar{display:flex;align-items:center;justify-content:space-between;padding:3rem 6rem;background-color:#111;color:#fff;margin-bottom:50px}.navbar a{text-decoration:none;color:#fff;position:relative;padding-bottom:4px}.navbar h1{font-size:1.4rem;font-weight:800;letter-spacing:.5px}.navbar ul{list-style:none;display:flex;align-items:center;gap:1.5rem}.navbar li{display:flex;align-items:center;cursor:pointer;font-size:1rem;position:relative;transition:color .3s ease}.user-link{display:flex;align-items:center;gap:8px}.user-link span{display:inline-block}.navbar a:after{content:"";position:absolute;left:0;bottom:-4px;width:0;height:2px;background-color:#2ecc71;transition:width .3s ease}.navbar a:hover,.navbar a.active{color:#2ecc71;font-weight:500}.navbar a:hover:after,.navbar a.active:after{width:100%}.rate-date{display:flex;align-items:center;justify-content:space-between;margin-top:8px;font-size:13px;color:#555}.rate{font-weight:700;color:#2f7d32}.date{color:#777;font-size:12px}.songlist{display:flex;flex-direction:row;padding:0 1rem;width:80%;margin:0 auto;gap:50px}.empty-state{text-align:center;padding:20px;color:#777;font-size:15px;font-style:italic}.formside,.listside{flex:1}.listside>small{color:#1c1c1c;font-style:italic;max-width:500px;display:block;margin:0 auto}.listside{margin-bottom:80px}.skeleton-loader{max-width:500px}.title-del{display:flex;justify-content:space-between}.title-del>h2{display:flex;align-items:center;gap:8px;cursor:pointer}.edit-icon{cursor:pointer;color:#4e4c4c3b;transition:color .2s ease}.editform>input{text-align:left;height:25px;border:none;background:transparent;max-width:80%;padding-bottom:15px}.editform>input:focus{outline:none;box-shadow:inset 0 -2px #4142425d}.edit-title{font-weight:700;font-size:1.1rem;color:#2ecc71;padding-bottom:5px}.edit-artist{font-size:.85rem;color:#555;margin-bottom:20px;text-align:left;height:25px;border:none;background:transparent;max-width:70%}.edit-artist:focus{outline:none;box-shadow:inset 0 -2px #4142425d}.editform button{background:none;border:none;cursor:pointer}.art-check-cont{display:flex;align-items:center;justify-content:space-between;border:none;outline:none}.save-btn{color:#2f7d32}.del-icon{cursor:pointer;color:#4e4c4c3b;transition:color .2s ease}.del-icon:hover{color:#e74c3c}.eachsongs{max-width:500px;margin:5px auto;padding:16px 20px;background-color:#fff;border-radius:8px;box-shadow:0 4px 10px #00000014;display:flex;flex-direction:row;gap:20px}.eachsongs *{min-width:0}.eachsongs h2{color:#2ecc71;font-weight:700;font-size:1.1rem;margin-bottom:6px;word-wrap:break-word;overflow-wrap:anywhere;white-space:normal}.eachsongs>div:last-child{flex:1;min-width:0}.eachsongs p{color:#555;font-size:.85rem}.eachsongs:hover{transform:translateY(-2px);transition:transform .2s ease}.cont-img img{height:40px}.cont-img{width:50px;height:50px;background-color:azure;border-radius:50%;place-content:center}.form-title{margin-bottom:20px;font-weight:700;font-size:1.5rem}.addsong-form{max-width:500px;margin:10px auto 40px;padding:0 20px;background-color:#fff;border-radius:8px;display:flex;flex-direction:column;gap:10px}.addsong-form label{font-size:.9rem;font-weight:600;color:#333}.addsong-form input{padding:10px 12px;border-radius:6px;font-size:.95rem;outline:none;border:#11111100 solid .2px;background-color:#f2f1f1;transition:border-color .2s ease,box-shadow .2s ease}.addsong-form input:focus{border-color:#2ecc71;box-shadow:0 0 0 2px #2ecc7133}.rate-field{display:flex;align-items:center;gap:8px;margin:10px 0}.rate-field label{font-size:.9rem;font-weight:600;color:#333}.rate-field select{padding:6px 10px;border-radius:6px;border:1px solid #ccc;background-color:#fff;font-size:14px;cursor:pointer}.rate-field select:focus{outline:none;border-color:#2f7d32;box-shadow:0 0 0 2px #2f7d3233}.rate-field span{font-weight:700;color:#555}.add-first-song-btn{width:50%;padding:12px;border-radius:999px;border:none;background:#2ecc71;color:#fff;font-weight:600;cursor:pointer;margin:20px 0;transition:background .3s ease}.addsong-form button{margin-top:10px;padding:10px;border:none;border-radius:6px;background-color:#2ecc71;color:#fff;font-size:1rem;font-weight:600;cursor:pointer;transition:background-color .2s ease,transform .1s ease}.addsong-form button:hover,.add-first-song-btn:hover{background-color:#27ae60;transform:translateY(-1px)}.error{position:fixed;top:2%;left:50%;transform:translate(-50%);z-index:9999;background:#ff4d4d;color:#fff;font-weight:500;text-align:center;padding:12px 25px;border-radius:10px;opacity:1;font-size:.8rem;transition:transform .6s ease-out,opacity .6s ease-out}.error.hide{opacity:0;transform:translate(-50%,-60px)}.success{position:fixed;top:2%;left:50%;transform:translate(-50%);z-index:9999;background:#4bb543;color:#fff;font-weight:500;text-align:center;padding:12px 25px;border-radius:10px;opacity:1;font-size:.8rem;transition:transform .6s ease-out,opacity .6s ease-out}.success.hide{opacity:0;transform:translate(-50%,-60px)}.about-page,.contact-page{margin:0 auto;max-width:500px;padding:20px;text-align:center;line-height:30px}.about-page h2,.contact-page h2{font-size:1.8rem;margin-bottom:15px;color:#2ecc71}.sort-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:500px;margin:20px auto}.sort-bar select{flex:1;padding:10px 12px;border-radius:6px;border:1px solid #ddd;background-color:#fff;font-size:14px;cursor:pointer;outline:none;transition:border .2s ease,box-shadow .2s ease}.sort-bar select:focus{border-color:#2ecc71;box-shadow:0 0 0 2px #2ecc7133}.sort-bar button{padding:10px 14px;border-radius:6px;border:none;background-color:#111;color:#2ecc71;font-size:14px;font-weight:600;cursor:pointer;white-space:nowrap;transition:background .2s ease,transform .15s ease}.sort-bar button:hover{background-color:#222;transform:translateY(-1px)}.sort-bar button:active{transform:scale(.96)}.overlay{position:fixed;top:0;left:0;height:100vh;width:100vw;background:#00000080;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);display:flex;align-items:center;justify-content:center;z-index:9999}.modal{background:#fff;padding:25px;border-radius:12px;width:320px;animation:popup .3s ease}.modal input,.modal button{width:100%;padding:10px;margin-top:10px}@keyframes popup{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}.fab-btn{position:fixed;bottom:20px;left:20px;width:55px;height:55px;border-radius:50%;border:none;background-color:#2ecc71;color:#fff;font-size:28px;font-weight:700;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 8px 20px #00000040;transition:transform .2s ease,box-shadow .2s ease;z-index:1000}.fab-btn:hover{transform:scale(1.1);box-shadow:0 10px 25px #00000059}.fab-btn:active{transform:scale(.95)}.profile-container{display:flex;flex-direction:column;align-items:center;justify-content:center;max-width:700px;margin:40px auto;padding:20px;background-color:#fff;border-radius:8px;box-shadow:0 4px 10px #0000001a}.username{font-size:18px;font-weight:400}.logout-btn{text-decoration:none;margin-top:20px;padding:10px 20px;border:none;border-radius:6px;background-color:#e74c3c;color:#fff;font-size:1rem;font-weight:500;cursor:pointer;transition:background-color .2s ease,transform .1s ease}.logout-btn:hover{background-color:#c0392b;transform:translateY(-1px)}.eye{opacity:.4}.login-page,.signup-page,.forgot-page{display:flex;height:100vh;background:#f8fafc}.login-left,.signup-left,.forgot-left{flex:1;display:flex;justify-content:center;align-items:center}.login-card,.signup-card,.forgot-card{width:100%;text-align:center;max-width:450px}.login-heading,.signup-heading,.forgot-heading{margin:15px 0;font-size:26px}.small-heading{color:#515e70;font-size:14px;margin-bottom:30px}.small-heading a{text-decoration:none;cursor:pointer}form{margin-top:20px;padding:15px}input{width:100%;padding:15px 14px;border-radius:10px;border:1px solid #c1c6d1;margin-bottom:20px;outline:none;font-size:14px}.password-box{position:relative}.password-box span{position:absolute;right:12px;top:35%;transform:translateY(-50%);cursor:pointer;font-size:16px;color:#1111119b}.password-box input{padding-right:40px}.options{display:flex;justify-content:space-between;place-content:center;font-size:14px;font-weight:500;margin-top:20px}.MuiFormControlLabel-label{font-family:inherit!important}.sec-question{display:flex;gap:10px;margin:15px 0;width:100%}.sec-question label{font-weight:500;color:#333;white-space:nowrap}.sec-question select{width:100%;flex:1;padding:15px 14px;border-radius:10px;border:1px solid #c1c6d1;font-size:14px;outline:none}.options a{text-decoration:none}.login-error,.signup-error{color:red;text-align:center;padding:0 5px;font-size:14px}.submit{width:50%;padding:12px;border-radius:999px;border:none;background:#2ecc71;color:#fff;font-weight:600;font-size:1rem;cursor:pointer;margin:20px 0;transition:background .3s ease}.submit:hover{background:#27ae60}.login-right,.signup-right,.forgot-right{width:45%;background:#0f172a;position:relative;overflow:hidden}.pattern{width:100%;height:100%;background-image:radial-gradient(circle at 30% 30%,#27ae60 0%,transparent 60%),radial-gradient(circle at 70% 70%,#27ae60 0%,transparent 60%)}.pattern img{width:100%;height:100%;object-fit:cover}@media(max-width:768px){.login-page,.signup-page,.forgot-page{flex-direction:column}.sec-question select{font-size:16px}.login-right,.signup-right,.forgot-right{display:none}.login-left,.signup-left,.forgot-left{padding:20px}}@media(max-width:1200px){.songlist{width:90%;gap:30px}}@media(max-width:820px){.navbar{padding:3rem}.form-title{font-size:1.3rem}.addsong-form{padding:0 10px}}@media(max-width:768px){.username{font-size:16px;font-weight:400}.navbar h1{font-size:1.1rem}.navbar>ul>li{font-size:.9rem}.navbar ul{gap:.8rem}.songlist{flex-direction:column;gap:40px}.editform>input{font-size:16px}.addsong-form input,input{font-size:16px}.edit-artist{font-size:16px;transform:scale(.8);transform-origin:left center}.eachsongs h2{font-size:1rem}.eachsongs p{font-size:.75rem}.rate-date,.date{font-size:11px}.form-title{font-size:1.1rem}.addsong-form label{font-size:.8rem}.rate-field select{font-size:16px;transform:scale(.9);transform-origin:left center}.rate-field span{font-size:.8rem}.addsong-form button{font-size:.9rem}.sort-bar select{font-size:16px;transform:scale(.9);transform-origin:left center}.songlist{padding:0}.about-page h2,.contact-page h2{font-size:1.2rem}.about-page,.contact-page{line-height:20px;font-size:.9rem}}@media(max-width:480px){.login-error,.signup-error{padding:0 5px;font-size:13px}.eye{opacity:.2}.username,.profile-container h1{font-size:1rem}.MuiFormControlLabel-label{font-family:inherit!important;font-size:14px!important}.login-heading,.signup-heading,.forgot-heading{margin:7px 0;font-size:20px}.small-heading{font-size:13px;margin-bottom:10px}.sec-question label{font-size:14px}.submit{font-size:14px;padding:8px;width:40%}.navbar{padding:2rem 1rem}.navbar h1{font-size:1rem}.navbar>ul>li{font-size:.8rem}.navbar ul{gap:.7rem}.about-page h2,.contact-page h2{font-size:1rem}.about-page,.contact-page{line-height:normal;font-size:.8rem}.success,.error{font-size:.6rem;padding:10px}}