*{box-sizing:border-box;margin:0;padding:0;font-family:Franklin Gothic Medium,Arial Narrow,Arial,sans-serif;text-decoration:none;list-style:none}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#fbbf24b3;border-radius:999px}::-webkit-scrollbar-thumb:hover{background:var(--gold)}:root{--primary:#8b5cf6;--primary-hover:#7c3aed;--secondary:#06b6d4;--success:#22c55e;--success-light:#4ade80;--gold:#fbbf24;--gold-light:#fde68a;--danger:#ef4444;--bg:#050816;--bg-secondary:#0f172a;--card-bg:#0f172a8c;--text-primary:#fff;--text-secondary:#94a3b8;--border:#ffffff14;--glass:#ffffff0d;--shadow-sm:0 10px 30px #00000040;--shadow-md:0 20px 50px #0006;--radius-sm:14px;--radius-md:20px;--radius-lg:32px;--transition:.35s ease}.create-admin{background:radial-gradient(circle at top left, #7c3aed40, transparent 30%), radial-gradient(circle at bottom right, #06b6d433, transparent 30%), var(--bg);justify-content:center;align-items:center;min-height:100vh;padding:40px 20px;display:flex}.create-admin-card{background:var(--card-bg);-webkit-backdrop-filter:blur(18px);border:1px solid var(--border);border-radius:var(--radius-lg);width:100%;max-width:950px;box-shadow:var(--shadow-md);padding:40px}.form-header{margin-bottom:35px}.form-header h2{color:var(--text-primary);margin-bottom:8px;font-size:36px;font-weight:700}.form-header p{color:var(--text-secondary);font-size:15px}.form-grid{grid-template-columns:repeat(2,1fr);gap:22px;display:grid}.password-section{grid-template-columns:repeat(2,1fr);gap:22px;margin-top:22px;display:grid}.form-group{flex-direction:column;gap:10px;display:flex}.form-group input{border:1px solid var(--border);width:100%;height:58px;color:var(--text-primary);transition:var(--transition);background:#ffffff08;border-radius:14px;padding:0 18px}.form-group input:focus{border-color:var(--primary);background:#ffffff0d;box-shadow:0 0 0 4px #7c3aed26}.password-toggle{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;font-size:18px;display:flex;position:absolute;top:50%;right:18px;transform:translateY(-50%)}.submit-btn{background:linear-gradient(135deg, var(--primary), var(--secondary));color:#fff;cursor:pointer;border:none;border-radius:14px;width:100%;height:58px;margin-top:30px;font-size:15px;font-weight:600;transition:all .3s}.err-msg{padding-left:10px;font-size:12px;color:red!important}@media (width<=768px){.create-admin-card{padding:25px}.form-grid,.password-section{grid-template-columns:1fr}.form-header h2{font-size:28px}}.login{background:radial-gradient(circle at top left, #7c3aed40, transparent 30%), radial-gradient(circle at bottom right, #06b6d433, transparent 30%), var(--bg);justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.login-card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);width:100%;max-width:450px;box-shadow:var(--shadow-md);padding:40px}.login-header{margin-bottom:30px}.login-header h1{color:var(--text-primary);margin-bottom:8px;font-size:32px;font-weight:700}.login-header p{color:var(--text-secondary)}.form-group{flex-direction:column;gap:8px;margin-bottom:20px;display:flex}.form-group label{color:var(--text-primary);font-size:14px;font-weight:500}.form-group input{border:1px solid var(--border);width:100%;height:56px;color:var(--text-primary);background:#ffffff08;border-radius:14px;padding:0 16px;transition:all .3s}.form-group input::placeholder{color:var(--text-secondary)}.form-group input:focus{border-color:var(--primary);box-shadow:0 0 0 4px #7c3aed26}.password-wrapper{position:relative}.password-wrapper input{padding-right:55px}.password-toggle{cursor:pointer;color:var(--text-secondary);background:0 0;border:none;justify-content:center;align-items:center;font-size:18px;display:flex;position:absolute;top:50%;right:16px;transform:translateY(-50%)}.password-toggle:hover{color:var(--text-primary)}.message{border-radius:12px;margin-bottom:20px;padding:14px 16px;font-size:14px;font-weight:500}.submit-btn{background:linear-gradient(135deg, var(--primary), var(--secondary));color:#fff;cursor:pointer;border:none;border-radius:14px;width:100%;height:56px;font-size:15px;font-weight:600;transition:all .3s}@media (width<=600px){.login-card{padding:25px}.login-header h1{font-size:28px}}.sidebar{background:var(--bg-secondary);border-right:1px solid var(--border);width:300px;height:100vh;box-shadow:var(--shadow-sm);z-index:10000;flex-direction:column;padding:20px 16px;display:flex;position:fixed;top:0;left:0}.sidebar h2{color:var(--text-primary);letter-spacing:.5px;margin-bottom:30px;font-size:20px}.sidebar nav{flex-direction:column;gap:10px;display:flex}.sidebar nav a{border-radius:var(--radius-sm);color:var(--text-secondary);transition:var(--transition);border:1px solid #0000;align-items:center;gap:12px;padding:12px 14px;font-size:15px;display:flex}.sidebar nav a:hover{background:var(--card-bg);color:var(--text-primary);border-color:var(--border);transform:translate(4px)}.sidebar nav a.active{background:var(--primary);color:#fff;box-shadow:var(--shadow-sm)}.sidebar svg{opacity:.9;font-size:16px}.sidebar nav a:last-child{margin-top:auto}@media (width<=1000px){.sidebar{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);width:70%;transition:all .5s;position:absolute;left:-100%}.sidebar-move{left:0%}}@media (width<=500px){.sidebar{width:90%}}.admin-layout{display:flex}.admin-content{background:var(--bg);flex:1;min-height:100vh;margin-left:300px;overflow-x:hidden}@media (width<=1000px){.admin-content{margin-left:0}}.pagination{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;margin-top:40px;display:flex}.pagination button{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);min-width:45px;height:45px;color:var(--text-primary);cursor:pointer;background:#ffffff0a;border:1px solid #ffffff14;border-radius:14px;padding:0 14px;font-size:14px;font-weight:600;transition:all .3s}.pagination button:hover:not(:disabled){background:linear-gradient(135deg, var(--primary), var(--secondary));color:#fff;transform:translateY(-3px);box-shadow:0 10px 25px #7c3aed59}.pagination button.active{background:linear-gradient(135deg, var(--primary), var(--secondary));color:#fff;border-color:#0000;box-shadow:0 10px 30px #7c3aed73}.pagination button:disabled{opacity:.4;cursor:not-allowed}.pagination button.prev,.pagination button.next{min-width:90px}@media (width<=768px){.pagination{gap:8px}.pagination button{min-width:40px;height:40px;font-size:13px}.pagination button.prev,.pagination button.next{min-width:75px}}.musics-page{min-height:100vh;padding:30px;position:relative}.musics-page:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(circle at 15% 15%,#7c3aed40,#0000 30%),radial-gradient(circle at 85% 20%,#06b6d42e,#0000 35%),radial-gradient(circle at 80% 80%,#fbbf242e,#0000 35%);position:fixed;inset:0}.musics-page:after{content:"";pointer-events:none;z-index:0;background-image:linear-gradient(#ffffff08 1px,#0000 1px),linear-gradient(90deg,#ffffff08 1px,#0000 1px);background-size:40px 40px;position:fixed;inset:0}.musics-page>*{z-index:2;position:relative}.musics-page h1{background:linear-gradient(90deg,#fff,#fbbf24,#06b6d4);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:30px;font-size:42px;font-weight:900}.music-list{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px;display:grid}.music-card{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:linear-gradient(#ffffff12,#ffffff05);border:1px solid #ffffff14;border-radius:22px;padding:15px;transition:all .35s;position:relative;overflow:hidden}.music-card:before{content:"";background:linear-gradient(120deg,#0000,#ffffff0d,#0000);transition:all .8s;position:absolute;inset:0;transform:translate(-100%)}.music-card:hover:before{transform:translate(100%)}.music-card:hover{border-color:#fbbf2440;transform:translateY(-6px)scale(1.01);box-shadow:0 20px 60px #00000059,0 0 30px #fbbf2414}.music-card-active{border:1px solid #fbbf2459;box-shadow:0 0 25px #fbbf241f,0 20px 50px #00000059}.music-card-profile-back{justify-content:space-between;align-items:center;display:flex}.music-card-profile{align-items:center;gap:16px;display:flex}.music-card-profile img{object-fit:cover;border:2px solid #ffffff14;border-radius:18px;width:80px;height:80px;transition:all .35s}.music-card:hover img{transform:scale(1.06)}.music-info{flex-direction:column;flex:1;gap:7px;display:flex}.music-info h3{color:#fff;font-size:18px}.music-info p{color:var(--text-secondary);font-size:14px}.music-info a{color:var(--gold);align-items:center;gap:5px;display:flex}.play-btns{align-items:center;gap:15px;margin-top:18px;display:flex}.play-pause{color:#fff;cursor:pointer;background:linear-gradient(135deg,#7c3aed,#06b6d4);border-radius:50%;width:48px;min-width:48px;height:48px;padding:12px;transition:all .35s;box-shadow:0 0 25px #7c3aed59}.play-pause:hover{transform:scale(1.15);box-shadow:0 0 40px #7c3aed99}.duration-show-back{background:#ffffff14;border-radius:999px;flex:1;height:10px;overflow:hidden}.duration-show-front{background:linear-gradient(90deg,#fbbf24,#22c55e);border-radius:999px;width:0;height:100%;transition:width .3s linear;box-shadow:0 0 20px #fbbf2480}.duration{color:#fff;text-align:right;min-width:40px;font-size:13px;font-weight:600}.pagination{justify-content:center;gap:10px;margin-top:35px;display:flex}.pagination button{cursor:pointer;color:#fff;background:#ffffff0d;border:none;border-radius:12px;width:42px;height:42px;transition:all .3s}.pagination button:hover{background:#7c3aed99;transform:translateY(-3px)}.pagination button.active{background:linear-gradient(135deg, var(--primary), var(--secondary))}.music-actions{gap:12px;margin-top:15px;display:flex;flex-direction:row!important}.action-btn{cursor:pointer;color:#fff;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border:none;border-radius:14px;align-items:center;gap:6px;padding:8px 11px;font-weight:600;transition:all .3s;display:flex}.action-btn svg{font-size:15px}.edit-btn{background:#00000026;border:1px solid #ffffff73}.edit-btn:hover{color:#3b82f6f2;border:1px solid #3b82f6a6;transform:translateY(-3px)}.delete-btn{background:#00000026;border:1px solid #ffffff73}.delete-btn:hover{color:#ef4444f2;border:1px solid #ef4444a6;transform:translateY(-3px)}.action-btn:active{transform:scale(.96)}@media (width<=768px){.musics-page{padding:20px}.music-list{grid-template-columns:1fr}.music-card-profile img{width:70px;height:70px}.musics-page h1{font-size:30px}}@media (width<=480px){.musics-page,.music-card{padding:12px}.play-pause{width:42px;height:42px}.music-card-profile{gap:12px}.music-info h3{font-size:16px}}.musics-loading-page{background:var(--bg);min-height:100vh;padding:30px;position:relative;overflow:hidden}.loading-bg{pointer-events:none;background:radial-gradient(circle at 15% 20%,#7c3aed2e,#0000 35%),radial-gradient(circle at 85% 15%,#06b6d426,#0000 35%),radial-gradient(circle at 50% 100%,#fbbf241f,#0000 40%);position:fixed;inset:0}.loading-bg:before{content:"";background-image:linear-gradient(#ffffff08 1px,#0000 1px),linear-gradient(90deg,#ffffff08 1px,#0000 1px);background-size:40px 40px;position:absolute;inset:0}.loading-header{border-radius:14px;width:260px;height:42px;margin-bottom:35px}.loading-grid{grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:22px;display:grid}.loading-card{-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);background:linear-gradient(#ffffff0f,#ffffff05);border:1px solid #ffffff14;border-radius:24px;padding:20px;position:relative;box-shadow:0 20px 50px #00000059,0 0 25px #7c3aed14}.loading-top{align-items:center;gap:16px;display:flex}.loading-image{border-radius:18px;flex-shrink:0;width:90px;height:90px}.loading-info{flex:1}.loading-title{border-radius:10px;width:80%;height:18px;margin-bottom:12px}.loading-subtitle{border-radius:10px;width:50%;height:14px}.loading-bottom{align-items:center;gap:14px;margin-top:24px;display:flex}.loading-play{border-radius:50%;flex-shrink:0;width:52px;height:52px}.loading-progress{border-radius:999px;flex:1;height:8px}.loading-time{border-radius:8px;width:45px;height:14px}@keyframes shimmer{to{left:150%}}@media (width<=768px){.musics-loading-page{padding:20px}.loading-grid{grid-template-columns:1fr}.loading-image{width:75px;height:75px}}.add-music-page{background:var(--bg);justify-content:center;align-items:center;min-height:100%;padding:40px;display:flex;position:relative;overflow:hidden}.edit-music-section{align-items:flex-start;width:calc(100% - 300px);height:100%;padding-top:20px;position:fixed;top:0;left:300px;overflow-y:auto}.add-music-page:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(circle at 15% 15%,#7c3aed2e,#0000 35%),radial-gradient(circle at 85% 20%,#06b6d41f,#0000 35%),radial-gradient(circle at 50% 100%,#f59e0b1f,#0000 45%);position:fixed;inset:0}.add-music-page:after{content:"";pointer-events:none;z-index:0;background-image:linear-gradient(#ffffff08 1px,#0000 1px),linear-gradient(90deg,#ffffff08 1px,#0000 1px);background-size:40px 40px;position:fixed;inset:0}.add-music-card{z-index:1;box-sizing:border-box;-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);background:#ffffff0d;border:1px solid #ffffff14;border-radius:28px;width:80%;margin:0 auto;padding:35px;position:relative;box-shadow:0 20px 60px #00000059,inset 0 1px #ffffff14}.page-header{text-align:center;margin-bottom:40px}.header-icon{color:#fff;background:linear-gradient(135deg, var(--primary), var(--secondary));border-radius:50%;justify-content:center;align-items:center;width:90px;height:90px;margin:0 auto 20px;font-size:34px;animation:3s infinite pulse;display:flex;box-shadow:0 0 30px #7c3aed66,0 0 60px #06b6d433}.page-header h1{color:var(--text-primary);margin-bottom:10px;font-size:38px;font-weight:800}.page-header p{color:var(--text-secondary)}.add-music-form{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;display:grid}.input-group{width:100%}.input-group input{color:#fff;box-sizing:border-box;background:#ffffff0a;border:1px solid #ffffff14;border-radius:18px;width:100%;height:60px;padding:0 20px;transition:all .3s}.input-group input::placeholder{color:#ffffff73}.input-group input:focus{border-color:var(--primary);background:#ffffff0f;outline:none;box-shadow:0 0 0 4px #7c3aed26}.upload-box{cursor:pointer;background:#ffffff08;border:2px dashed #ffffff1f;border-radius:24px;flex-direction:column;justify-content:center;align-items:center;gap:14px;min-height:180px;transition:all .35s;display:flex}.upload-box:hover{border-color:var(--secondary);background:#ffffff0d;transform:translateY(-6px);box-shadow:0 15px 40px #06b6d426}.upload-box svg{color:var(--secondary);font-size:38px}.upload-box span{color:#fff;font-weight:600}.upload-box input{display:none}.youtube-toggle{grid-column:1/-1}.youtube-toggle label{color:#fff;cursor:pointer;align-items:center;gap:12px;font-weight:600;display:inline-flex}.youtube-toggle input{width:18px;height:18px}.youtube-toggle svg{color:red}.cover-preview{grid-column:1/-1;justify-content:center;display:flex}.cover-preview img{object-fit:cover;border:2px solid #ffffff14;border-radius:24px;width:150px;height:150px;transition:all .35s;box-shadow:0 20px 50px #0006}.cover-preview img:hover{transform:scale(1.04)}.submit-btn{cursor:pointer;color:#fff;background:linear-gradient(135deg, var(--primary), var(--secondary));border:none;border-radius:20px;grid-column:1/-1;height:65px;padding:0 30px;font-size:16px;font-weight:700;transition:all .35s}.submit-btn:disabled{opacity:.6;cursor:not-allowed}.message{border-radius:var(--radius-sm);margin-top:20px;margin-bottom:20px;padding:14px 18px;font-weight:500}.file-name{word-wrap:break-word;text-align:center;width:100%;padding:0 30px;display:inline-block}.old-files-box{flex-direction:column;gap:10px;display:flex}.old-files-head{text-align:center;font-size:20px!important}.old-media{grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px;display:grid}.audio-preview{grid-column:1 span;justify-content:flex-start;align-items:center;display:flex}.old-music{width:220px}.cover-preview{grid-column:1 span;justify-content:flex-end;align-items:center;display:flex}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.08)}to{transform:scale(1)}}.input-box{flex-direction:column;grid-column:2 span;gap:10px;width:100%;margin-top:22px;display:flex}.input-label{color:#fff;font-size:16px;font-weight:700}.remix-select{color:#fff;cursor:pointer;appearance:none;background:#121924f2 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='white' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M1.646 5.646a.5.5 0 0 1 .708 0L8 11.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E") right 22px center no-repeat;border:1px solid #ffffff14;border-radius:22px;outline:none;width:100%;height:64px;padding:0 22px;font-size:16px;font-weight:500;transition:all .3s}.remix-select:hover{border-color:#26c6ff}.remix-select:focus{border-color:#26c6ff;box-shadow:0 0 0 4px #26c6ff26}.remix-select option{color:#fff;background:#111823}@media (width<=1000px){.edit-music-section{width:100%;padding:20px;left:0}.add-music-page{padding:20px 80px}.add-music-card{width:100%;padding:28px}.page-header h1{font-size:30px}.add-music-form{flex-direction:column;gap:18px;display:flex}.upload-box,.youtube-toggle,.input-group,.submit-btn{width:100%}.old-media{grid-template-columns:1fr;gap:18px}.cover-preview,.audio-preview{justify-content:center}.old-music{width:100%;max-width:320px}.add-music-form>div:last-child>div:last-child{flex-direction:column;gap:15px;display:flex!important}.add-music-form>div:last-child>div:last-child .submit-btn{width:100%}}@media (width<=500px){.edit-music-section{padding:12px}.add-music-page{padding:10px}.add-music-card{border-radius:20px;padding:18px}.header-icon{width:65px;height:65px;font-size:26px}.page-header h1{font-size:24px}.page-header p{font-size:14px}.input-group input{height:52px;font-size:14px}.upload-box{min-height:140px}.upload-box svg{font-size:30px}.file-name{padding:0 10px;font-size:13px}.submit-btn{height:54px;font-size:14px}}.music-adding-loading{z-index:9999;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0f172abf;border-radius:30px;justify-content:center;align-items:center;display:flex;position:relative;inset:0}.music-adding-loading:before{content:"";background:radial-gradient(circle at 15% 15%,#7c3aed40,#0000 35%),radial-gradient(circle at 85% 20%,#06b6d42e,#0000 35%),radial-gradient(circle at 50% 100%,#fbbf2426,#0000 40%);border-radius:30px;position:absolute;inset:0}.music-adding-loading:after{content:"";background-image:linear-gradient(#ffffff08 1px,#0000 1px),linear-gradient(90deg,#ffffff08 1px,#0000 1px);background-size:40px 40px;border-radius:30px;position:absolute;inset:0}.music-loading-card{z-index:2;text-align:center;-webkit-backdrop-filter:blur(35px);backdrop-filter:blur(35px);background:linear-gradient(#ffffff14,#ffffff08);border:1px solid #ffffff14;border-radius:30px;width:420px;max-width:100%;padding:40px 30px;position:relative;box-shadow:0 25px 80px #00000073,0 0 60px #7c3aed26}.music-loading-icon{color:#fff;background:linear-gradient(135deg, var(--primary), var(--secondary));border-radius:50%;justify-content:center;align-items:center;width:90px;height:90px;margin:0 auto 20px;font-size:34px;animation:1.5s infinite pulse;display:flex;box-shadow:0 0 40px #7c3aed80}.music-loading-card h2{color:#fff;margin-bottom:10px}.music-loading-card p{color:var(--text-secondary);margin-bottom:25px}.loading-bar{background:#ffffff14;border-radius:999px;width:100%;height:10px;overflow:hidden}.loading-bar-fill{background:linear-gradient(90deg,#8b5cf6,#06b6d4,#fbbf24);border-radius:999px;width:40%;height:100%;animation:1.2s linear infinite loadingMove}@keyframes loadingMove{0%{transform:translate(-120%)}to{transform:translate(320%)}}@media (width<=600px){.music-loading-card{padding:30px 20px}.music-loading-icon{width:75px;height:75px;font-size:28px}}.alert{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:99999;border-radius:16px;flex-direction:column;gap:7px;min-width:320px;max-width:450px;padding:16px 22px;font-size:14px;font-weight:600;transition:all .5s;display:flex;position:fixed;top:30px;right:30px;transform:translate(130%)}.alert.success{color:#4ade80;background:#22c55e26;border:1px solid #22c55e40;box-shadow:0 15px 40px #22c55e26}.alert.error{color:#f87171;background:#ef444426;border:1px solid #ef444440;box-shadow:0 15px 40px #ef444426}.alert.warning{color:#fbbf24;background:#fbbf2426;border:1px solid #fbbf2440;box-shadow:0 15px 40px #fbbf2426}.alert-btns{gap:10px;padding:5px;display:flex}.alert-btns>button{color:#fff;cursor:pointer;border:1px solid #ffffff1a;border-radius:8px;padding:5px 8px}.accept-btn{box-shadow:0 0 10px var(--primary-hover);background-color:#6023abcc}.cancel-btn{background-color:#ef4444cc;box-shadow:0 0 10px #ef444440}.show-alert{transform:translate(0%)}.hide-alert{transform:translate(130%)}@media (width<=600px){.alert{min-width:auto;max-width:none;top:15px;left:15px;right:15px}}.profile-page{background:var(--bg);justify-content:center;align-items:center;min-height:100%;padding:40px;display:flex;position:relative;overflow:hidden}.profile-page h1,.profile-page h2{color:var(--text-primary);margin-bottom:20px}.profile-form{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);flex-direction:column;gap:14px;padding:24px;display:flex}.profile-form input{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);width:100%;color:var(--text-primary);transition:var(--transition);outline:none;padding:14px 16px}.profile-form input::placeholder{color:var(--text-secondary)}.profile-form input:focus{border-color:var(--primary)}.profile-form button{background:var(--primary);border-radius:var(--radius-sm);color:#fff;cursor:pointer;transition:var(--transition);border:none;padding:14px 24px;font-weight:600}.profile-form button:hover:not(:disabled){background:var(--primary-hover)}.profile-form button:disabled{opacity:.6;cursor:not-allowed}.message{border-radius:var(--radius-sm);margin-bottom:20px;padding:14px 18px;font-weight:500}.message.success{color:var(--success);background:#22c55e26;border:1px solid #22c55e4d}.message.error{color:var(--danger);background:#ef444426;border:1px solid #ef44444d}.background-grid{opacity:.5;background-image:linear-gradient(#ffffff0a 1px,#0000 1px),linear-gradient(90deg,#ffffff0a 1px,#0000 1px);background-size:40px 40px;position:absolute;inset:0}.floating-circle{filter:blur(120px);border-radius:50%;animation:10s ease-in-out infinite float;position:absolute}.circle-1{background:var(--primary);width:350px;height:350px;top:-100px;left:-100px}.circle-2{background:var(--gold);width:300px;height:300px;bottom:-100px;right:-100px}.profile-card{background:var(--card-bg);-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);border:1px solid var(--border);border-radius:var(--radius-lg);width:100%;max-width:520px;box-shadow:var(--shadow-md);z-index:2;padding:40px;position:relative}.profile-header{text-align:center;margin-bottom:30px}.profile-icon{background:linear-gradient(135deg, var(--primary), var(--secondary));color:#fff;border-radius:50%;justify-content:center;align-items:center;width:80px;height:80px;margin:auto auto 20px;font-size:32px;display:flex;box-shadow:0 0 40px #8b5cf699}.profile-header h1{color:var(--text-primary);margin-bottom:10px}.profile-header p{color:var(--text-secondary)}.profile-form{flex-direction:column;gap:20px;display:flex}.input-group{position:relative}.input-group input{background:var(--glass);border:1px solid var(--border);border-radius:var(--radius-md);color:#fff;width:100%;height:60px;transition:var(--transition);padding:0 55px 0 50px}.input-group input:focus{border-color:var(--primary);box-shadow:0 0 0 4px #8b5cf626}.input-icon{color:var(--secondary);position:absolute;top:50%;left:18px;transform:translateY(-50%)}.eye-btn{cursor:pointer;border:none;align-items:center;font-size:18px;display:flex;position:absolute;top:50%;right:18px;transform:translateY(-50%);color:var(--gold)!important;background:0 0!important}.submit-btn{border-radius:var(--radius-md);color:#fff;cursor:pointer;border:none;width:max-content;height:50px;font-weight:700;transition:all .4s;background:linear-gradient(135deg, var(--primary), var(--secondary))!important;margin-top:0!important}.submit-btn:hover{transform:translateY(-3px);box-shadow:0 15px 30px #8b5cf659}.message{border-radius:var(--radius-sm);margin-bottom:20px;padding:15px}.message.success{border:1px solid var(--success);color:var(--success-light);background:#22c55e26}.message.error{border:1px solid var(--danger);color:#fca5a5;background:#ef444426}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-30px)}to{transform:translateY(0)}}.profile-actions{align-items:center;gap:15px;display:flex}.password-link{border-radius:var(--radius-md);min-width:220px;height:60px;color:var(--gold);transition:var(--transition);background:#fbbf2414;border:1px solid #fbbf2440;justify-content:center;align-items:center;gap:10px;font-weight:600;text-decoration:none;display:flex}.password-link:hover{background:#fbbf2426;transform:translateY(-3px);box-shadow:0 15px 30px #fbbf242e}.profile-card{animation:.6s cardAppear}.profile-icon{animation:3s infinite pulseGlow}@keyframes pulseGlow{0%{box-shadow:0 0 25px #8b5cf666}50%{box-shadow:0 0 60px #8b5cf6cc,0 0 120px #06b6d440}to{box-shadow:0 0 25px #8b5cf666}}@keyframes cardAppear{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@media (width<=1000px){.profile-page{padding:30px 20px}.profile-card{max-width:100%;padding:60px 24px!important}.profile-header{margin-bottom:24px}.profile-icon{width:70px;height:70px;margin-bottom:16px;font-size:28px}.profile-header h1{font-size:28px}.profile-header p{font-size:15px}.profile-form{gap:18px;width:100%;padding:20px}.input-group input{height:54px;padding:0 50px 0 46px;font-size:15px}.input-icon{font-size:16px;left:16px}.eye-btn{font-size:17px;right:16px}.submit-btn{height:54px;padding:0 28px;font-size:15px}.profile-actions{gap:12px}.password-link{min-width:200px;height:54px;padding:0 20px;font-size:15px}.message{padding:14px;font-size:14px}.circle-1{width:260px;height:260px}.circle-2{width:220px;height:220px}}@media (width<=500px){.profile-form{border-radius:10px;padding:10px}.profile-card{padding:30px 10px!important}.profile-actions{flex-direction:column;align-items:flex-start}.profile-actions button,.profile-actions a{width:100%}.eye-btn{padding:0!important}}.profile-loading{background:var(--bg);justify-content:center;align-items:center;width:100%;min-height:100vh;padding:40px;display:flex;position:relative;overflow:hidden}.profile-loading:before{content:"";background:radial-gradient(circle at 15% 15%,#7c3aed2e,#0000 35%),radial-gradient(circle at 85% 20%,#06b6d426,#0000 35%),radial-gradient(circle at 50% 100%,#fbbf241f,#0000 40%);position:fixed;inset:0}.profile-loading:after{content:"";background-image:linear-gradient(#ffffff08 1px,#0000 1px),linear-gradient(90deg,#ffffff08 1px,#0000 1px);background-size:40px 40px;position:fixed;inset:0}.profile-loading-card{z-index:5;-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:linear-gradient(#ffffff14,#ffffff08);border:1px solid #ffffff14;border-radius:30px;width:100%;max-width:650px;padding:35px;position:relative;box-shadow:0 25px 70px #0006}.profile-loading-avatar{border-radius:50%;width:90px;height:90px;margin:0 auto 25px}.profile-loading-title{border-radius:12px;width:220px;height:26px;margin:0 auto 12px}.profile-loading-subtitle{border-radius:10px;width:160px;height:16px;margin:0 auto 35px}.profile-loading-form{flex-direction:column;gap:18px;display:flex}.profile-loading-input{border-radius:18px;width:100%;height:60px}.profile-loading-actions{gap:16px;margin-top:10px;display:flex}.profile-loading-btn{border-radius:18px;flex:1;height:58px}.skeleton{background:#ffffff14;position:relative;overflow:hidden}.skeleton:after{content:"";background:linear-gradient(90deg,#0000,#ffffff2e,#0000);width:100%;height:100%;animation:1.5s infinite shimmer;position:absolute;top:0;left:-150%}@media (width<=768px){.profile-loading{padding:20px}.profile-loading-card{padding:24px}.profile-loading-actions{flex-direction:column}.profile-loading-avatar{width:75px;height:75px}}.loading-container{z-index:1000;background:#00000073;justify-content:center;align-items:center;width:100%;min-height:100vh;display:flex;position:absolute;inset:0}.loading-spinner{border:7px solid #0c6785;border-top-color:var(--primary);border-radius:50%;width:50px;height:50px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.remix-page{padding:35px}.remix-header{justify-content:space-between;align-items:center;margin-bottom:35px;display:flex}.remix-header h1{color:#fff;align-items:center;gap:12px;font-size:34px;display:flex}.remix-header p{color:#94a3b8;margin-top:8px}.new-remix-btn{cursor:pointer;color:#fff;background:linear-gradient(135deg, var(--primary), var(--gold));border:none;border-radius:14px;align-items:center;gap:10px;padding:14px 22px;transition:all .3s;display:flex}.new-remix-btn:hover{transform:translateY(-3px)}.remix-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:24px;display:grid}.remix-card{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffff0d;border:1px solid #ffffff14;border-radius:22px;padding:30px;transition:all .35s;position:relative}.remix-card:hover{border-color:var(--primary);transform:translateY(-8px)}.remix-icon{color:#fff;background:linear-gradient(135deg, var(--primary), var(--gold));border-radius:50%;justify-content:center;align-items:center;width:65px;height:65px;margin-bottom:25px;font-size:28px;display:flex}.remix-card h3{color:#fff;font-size:20px}.remix-edit-btn{cursor:pointer;color:#fff;background:#ffffff14;border:none;border-radius:50%;width:42px;height:42px;position:absolute;top:18px;right:18px}.remix-edit-btn:hover{background:var(--primary)}.remix-input{color:#fff;background:#111827;border:none;border-radius:12px;outline:none;width:100%;padding:14px}.remix-actions{justify-content:flex-end;gap:12px;margin-top:25px;display:flex}.cancel-btn,.save-btn{cursor:pointer;border:none;border-radius:12px;align-items:center;gap:8px;padding:12px 20px;display:flex}.cancel-btn{color:#fff;background:#334155}.save-btn{color:#fff;background:linear-gradient(135deg, var(--primary), var(--gold))}.remix-modal{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:999;background:#0000008c;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.remix-modal-box{background:#111827;border-radius:24px;width:420px;max-width:95%;padding:35px}.remix-modal-box h2{color:#fff;margin-bottom:25px}.remix-modal-box input{color:#fff;background:#1e293b;border:none;border-radius:14px;outline:none;width:100%;padding:15px}@media (width<=1000px){.remix-page{padding:30px 25px}.remix-header h1{font-size:30px}.remix-header p{font-size:15px}.remix-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:20px}}@media (width<=768px){.remix-page{padding:25px 18px}.remix-header{flex-direction:column;align-items:flex-start;gap:22px}.remix-header h1{font-size:26px}.remix-header p{font-size:14px}.new-remix-btn{justify-content:center;width:100%;padding:13px 18px;font-size:15px}.remix-grid{grid-template-columns:1fr;gap:18px}.remix-card{padding:24px}.remix-icon{width:58px;height:58px;margin-bottom:18px;font-size:24px}.remix-card h3{font-size:18px}.remix-edit-btn{width:38px;height:38px;font-size:14px}.remix-actions{flex-direction:column;gap:10px}.remix-actions button{justify-content:center;width:100%}.remix-modal-box{border-radius:20px;width:100%;padding:28px 22px}.remix-modal-box h2{margin-bottom:20px;font-size:24px}.remix-modal-box input{padding:14px;font-size:15px}}@media (width<=480px){.remix-page{padding:20px 14px}.remix-header{gap:18px}.remix-header h1{gap:10px;font-size:22px}.remix-header p{font-size:13px}.new-remix-btn{border-radius:12px;padding:12px;font-size:14px}.remix-card{border-radius:18px;padding:18px}.remix-icon{width:52px;height:52px;font-size:20px}.remix-card h3{font-size:17px}.remix-edit-btn{width:34px;height:34px;top:14px;right:14px}.remix-input,.cancel-btn,.save-btn{padding:12px;font-size:14px}.remix-modal-box{padding:22px 18px}}.menu{z-index:100000;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0f1117;border-right:1px solid #ffffff0f;flex-direction:column;grid-column:1 span;gap:20px;height:100vh;padding:20px;display:flex;overflow:hidden auto}.menu>*{background:#161922;border:1px solid #ffffff0f;border-radius:20px;padding:18px;box-shadow:0 8px 25px #00000040}.lang-wrapper{cursor:pointer;display:inline-block;position:relative}.lang-selected{width:100%;color:var(--text-secondary);background:#8b5cf61f;border:1px solid #8b5cf640;border-radius:14px;align-items:center;gap:14px;padding:14px 18px;text-decoration:none;transition:all .3s;display:flex;box-shadow:0 10px 25px #8b5cf626}.lang-dropdown{z-index:10;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);width:100%;color:var(--text-secondary);background:#8b5cf61f;border:1px solid #8b5cf61f;border-radius:15px;flex-direction:column;gap:8px;margin-top:5px;padding:10px;display:flex;position:absolute;top:110%;left:0}.lang-item{cursor:pointer;background:#8b5cf61f;border:1px solid #8b5cf61f;border-radius:12px;align-items:center;gap:8px;padding:8px 10px;display:flex}.lang-item:hover{background:#36026eb3}.flag{object-fit:cover;border-radius:2px;width:20px;height:15px}.menu-list{width:100%}.menu-list ul{flex-direction:column;gap:10px;width:100%;margin:0;padding:0;list-style:none;display:flex}.menu-list li{width:100%}.menu-list a{width:100%;color:var(--text-secondary);background:#ffffff05;border:1px solid #0000;border-radius:14px;align-items:center;gap:14px;padding:14px 18px;text-decoration:none;transition:all .3s;display:flex}.menu-list a:hover{color:#fff;background:#8b5cf61f;border-color:#8b5cf640;transform:translate(6px);box-shadow:0 10px 25px #8b5cf626}.menu-list a.active{color:#fff;background:linear-gradient(135deg,#8b5cf638,#fbbf2414);border-color:#8b5cf659;box-shadow:0 12px 30px #8b5cf633}.menu-list svg{min-width:20px;color:var(--primary);font-size:18px;transition:all .3s}.menu-list a:hover svg,.menu-list a.active svg{color:var(--gold)}.menu-list span{font-size:15px;font-weight:600}.info-footer{-webkit-backdrop-filter:blur(20px);background:#0f172aa6;border:1px solid #fbbf2440;border-radius:24px;width:100%;padding:16px;position:relative;box-shadow:0 10px 35px #00000059,0 0 25px #fbbf2414}.footer-glow{pointer-events:none;background:radial-gradient(circle,#fbbf2433,#0000 70%);width:120px;height:120px;position:absolute;top:-50px;right:-50px}.info-container{flex-direction:column;gap:14px;display:flex}.info-brand{flex-direction:column;gap:8px;display:flex}.info-brand h2{color:var(--gold);align-items:center;gap:6px;margin:0;font-size:1.1rem;font-weight:700;display:flex}.info-brand p{color:var(--text-secondary);margin:0;font-size:.82rem;line-height:1.6}.info-social{flex-direction:column;gap:10px;display:flex}.info-social h3{color:#fff;margin:0;font-size:.9rem;font-weight:700}.social-links{flex-wrap:wrap;gap:8px;display:flex}.social-links a{color:#fff;background:#ffffff0d;border:1px solid #ffffff14;border-radius:999px;padding:6px 10px;font-size:.72rem;font-weight:600;transition:all .3s}.social-links a:hover{color:#111827;background:linear-gradient(135deg,#fde68a,#fbbf24);border-color:#0000;transform:translateY(-2px);box-shadow:0 0 15px #fbbf2459}.copyright{color:var(--text-secondary);border-top:1px solid #ffffff14;margin-top:12px;padding-top:12px;font-size:.72rem;line-height:1.5}.profile-card{background:#ffffff08;border:1px solid #ffffff0f;border-radius:20px;flex-direction:column;align-items:center;gap:16px;width:100%;padding:18px;display:flex}.profile-logo{flex-shrink:0}.profile-logo-img{object-fit:cover;border:2px solid #fbbf2480;border-radius:50%;width:64px;height:64px;box-shadow:0 0 20px #fbbf2426}.profile-info{flex-direction:column;gap:20px;display:flex}.profile-info h3{color:#fff;text-align:center;margin:0;font-size:18px;font-weight:700}.profile-info p{color:#9ca3af;text-align:center;margin:0;font-size:13px}.artists-page{z-index:2;position:relative}.artists-header h2{color:#fff;margin-bottom:6px;font-size:34px;font-weight:800}.artists-header span{color:#8b949e;letter-spacing:1px;text-transform:uppercase;font-size:14px}.artists-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:24px;display:grid}.artists-card{cursor:pointer;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:linear-gradient(#ffffff14,#ffffff08);border:1px solid #ffffff14;border-radius:26px;padding:34px 24px;transition:all .35s;position:relative;overflow:hidden}.artists-card:before{content:"";opacity:0;background:linear-gradient(135deg,#8b5cf62e,#fbbf2414);transition:all .35s;position:absolute;inset:0}.artists-card:hover:before{opacity:1}.artists-card:hover{border-color:#8b5cf666;transform:translateY(-8px);box-shadow:0 22px 45px #00000073}.artists-avatar{z-index:2;color:#fff;background:linear-gradient(135deg, var(--primary), var(--gold));border-radius:50%;justify-content:center;align-items:center;width:82px;height:82px;margin-bottom:22px;font-size:34px;font-weight:800;display:flex;position:relative;box-shadow:0 14px 35px #8b5cf659}.artists-card h3{z-index:2;color:#fff;white-space:nowrap;text-overflow:ellipsis;margin-bottom:8px;font-size:22px;position:relative;overflow:hidden}.artists-card p{z-index:2;color:#9ca3af;font-size:14px;position:relative}.artists-card:after{content:"▶";color:#fff;background:linear-gradient(135deg, var(--primary), var(--gold));border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;transition:all .3s;display:flex;position:absolute;bottom:22px;right:22px;transform:scale(0)}.artists-card:hover:after{transform:scale(1)}@media (width<=900px){.artists-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:18px}.artists-header h2{font-size:28px}.artists-avatar{width:68px;height:68px;font-size:28px}}@media (width<=600px){.artists-grid{grid-template-columns:repeat(2,1fr);gap:10px}.artists-card{padding:24px 18px}.artists-card h3{font-size:16px}.artists-card p{font-size:12px}.artists-header h2{font-size:24px}.artists-header span{font-size:12px}.artists-avatar{width:50px;height:50px;font-size:22px}}@media (width<=1000px){.menu{transition:all 1s;position:absolute;left:-200%}.menu-move{left:0%}}.user{scrollbar-gutter:stable;background:radial-gradient(circle at 0 0,#8b5cf61f,#0000 35%),radial-gradient(circle at 100% 0,#fbbf2414,#0000 35%),#07090f;grid-column:3 span;height:100vh;padding:30px 30px 180px;position:relative;overflow:hidden auto}.user:before{content:"";pointer-events:none;background-image:linear-gradient(#ffffff08 1px,#0000 1px),linear-gradient(90deg,#ffffff08 1px,#0000 1px);background-size:40px 40px;position:fixed;inset:0}.musics{z-index:2;position:relative}.section-main-head{gap:20px;display:flex}.refresh-btn{cursor:pointer;color:#fff;background:linear-gradient(135deg,#8b5cf6e6,#6366f1e6);border:none;border-radius:16px;justify-content:center;align-items:center;width:52px;height:52px;transition:all .35s;display:flex;position:relative;overflow:hidden;box-shadow:0 10px 25px #8b5cf659}.refresh-btn:before{content:"";opacity:0;background:linear-gradient(135deg,#ffffff26,#0000);transition:all .35s;position:absolute;inset:0}.refresh-btn svg{z-index:2;font-size:22px;transition:transform .7s;position:relative}.refresh-btn:hover{transform:translateY(-4px);box-shadow:0 18px 35px #8b5cf673}.refresh-btn:hover:before{opacity:1}.refresh-btn:hover svg{transform:rotate(180deg)}.refresh-btn:active{transform:scale(.95)}.refresh-btn:after{content:"";opacity:0;background:radial-gradient(circle,#ffffff26,#0000 70%);width:120%;height:120%;transition:all .4s;position:absolute;top:-10%;left:-10%}.refresh-btn:hover:after{opacity:1}.section-header h2{color:#fff;margin-bottom:8px;font-size:34px;font-weight:800}.section-header p{color:#9ca3af}.music-grid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:20px;display:grid}.music-card-user{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:linear-gradient(#ffffff0d,#ffffff05);border:1px solid #ffffff14;border-radius:22px;transition:all .4s;position:relative;overflow:hidden}.music-card-user:after{content:"";background:linear-gradient(90deg, transparent, var(--primary), var(--gold), transparent);opacity:0;width:100%;height:2px;transition:all .4s;position:absolute;bottom:0;left:0}.music-card-user:hover{border-color:#8b5cf640;transform:translateY(-8px);box-shadow:0 20px 40px #00000059,0 0 25px #8b5cf61f}.music-card-user:hover:after{opacity:1}.music-cover{height:190px;position:relative;overflow:hidden}.music-cover img{object-fit:cover;width:100%;height:100%;transition:all .6s}.music-card-user:hover img{transform:scale(1.08)}.music-cover:before{content:"";z-index:1;background:linear-gradient(#0000 40%,#000000bf);position:absolute;inset:0}.heart-icon{color:#fff;z-index:1000;cursor:pointer;background-color:#0000;border:none;outline:none;font-size:1.15rem;position:absolute;top:15px;right:15px}.heart-icon-checked{color:var(--gold)}.play-btn-user{cursor:pointer;color:#fff;background:linear-gradient(135deg, var(--primary), var(--gold));z-index:2;border:none;border-radius:50%;justify-content:center;align-items:center;width:50px;height:50px;transition:all .35s;display:flex;position:absolute;bottom:14px;right:14px;box-shadow:0 10px 25px #8b5cf659}.play-btn-user:hover{transform:scale(1.12)rotate(5deg)}.music-details{text-transform:capitalize;width:calc(100% - 50px);padding:16px}.music-details h3{color:#fff;white-space:nowrap;text-overflow:ellipsis;margin-bottom:6px;font-size:17px;font-weight:700;overflow:hidden}.music-details p{color:#9ca3af;white-space:nowrap;text-overflow:ellipsis;font-size:13px;overflow:hidden}.music-details .stats{justify-content:space-between;align-items:center;margin-top:12px;display:flex}.music-details .duration{color:var(--gold);font-size:13px;font-weight:600}.music-details .listen-count{color:#9ca3af;font-size:12px}.more-box{z-index:999999;justify-content:center;width:100%;display:flex;position:relative;top:30px}.more{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);color:#fff;letter-spacing:.4px;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff14;border-radius:16px;justify-content:center;align-items:center;gap:10px;min-width:180px;height:50px;padding:0 26px;font-size:15px;font-weight:600;transition:all .3s;display:flex;position:relative;overflow:hidden}.more:before{content:"";opacity:0;background:linear-gradient(135deg,#8b5cf62e,#fbbf2414);transition:all .3s;position:absolute;inset:0}.more span,.more svg{z-index:2;position:relative}.more:hover{border-color:#8b5cf659;transform:translateY(-3px);box-shadow:0 12px 30px #00000059}.more:hover:before{opacity:1}.more:active{transform:scale(.97)}.music-controller{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-sizing:border-box;z-index:100;background:#0e121ef7;border-top:1px solid #ffffff14;padding:16px 24px;position:fixed;bottom:0;left:50%;transform:translate(-50%)}.controller-top{align-items:center;gap:24px;display:flex}.controller-left{flex:1;align-items:center;gap:14px;min-width:0;display:flex}.controller-cover{object-fit:cover;border-radius:14px;flex-shrink:0;width:70px;height:70px}.controller-info{flex-direction:column;flex:1;justify-content:center;gap:4px;min-width:0;display:flex}.controller-info h4{color:#fff;white-space:nowrap;text-overflow:ellipsis;font-size:16px;overflow:hidden}.controller-info p{color:#9da6b7;white-space:nowrap;text-overflow:ellipsis;font-size:13px;overflow:hidden}.controller-buttons{flex-shrink:0;align-items:center;gap:18px;display:flex}.controller-buttons button{color:#fff;cursor:pointer;background:0 0;border:none}.play-main-btn{border-radius:50%;justify-content:center;align-items:center;width:54px;height:54px;display:flex;background:linear-gradient(135deg, var(--primary), var(--gold))!important}.controller-right{flex-shrink:0;align-items:center;gap:12px;display:flex}.playlist-btn,.volume-btn,.youtube-link{color:#fff;background:#ffffff14;border:none;border-radius:50%;justify-content:center;align-items:center;width:42px;height:42px;text-decoration:none;display:flex}.playlist-btn{cursor:pointer;border:1px solid #fff;width:22px;height:22px;position:relative;top:2px}.controller-progress{background:#ffffff14;border-radius:100px;width:100%;height:6px;margin-top:16px;overflow:hidden}.controller-progress-fill{background:linear-gradient(90deg, var(--primary), var(--gold));width:0;height:100%}.playlist-modal{z-index:10000000;background:#0b102080;justify-content:center;align-items:center;width:100%;padding:24px;display:flex;position:fixed;inset:0}.main-modal{-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);background:#0b1020e6;border:1px solid #ffffff14;border-radius:24px;width:50%;padding:24px;animation:.35s showPlaylist;box-shadow:0 20px 60px #00000080,0 0 30px #8b5cf626}@keyframes showPlaylist{0%{opacity:0;transform:translateY(-25px)}to{opacity:1;transform:translateY(0)}}.playlist-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.playlist-header h3{color:#fff;align-items:center;gap:10px;font-size:22px;display:flex}.close-btn{cursor:pointer;color:#fff;background:#ffffff14;border:none;border-radius:50%;width:38px;height:38px;transition:all .3s}.close-btn:hover{background:#ffffff26;transform:rotate(90deg)}.playlist-msg{border-radius:12px;margin-bottom:16px;padding:12px;font-size:14px}.playlist-msg.error{color:#f87171;background:#ef444426}.playlist-msg.success{color:#4ade80;background:#22c55e26}.playlist-create-trigger button{cursor:pointer;background:linear-gradient(135deg, var(--primary), var(--gold));color:#fff;border:none;border-radius:14px;justify-content:center;align-items:center;gap:10px;width:100%;padding:14px;font-weight:700;transition:all .3s;display:flex}.playlist-create-trigger button:hover{transform:translateY(-3px)}.playlist-create{flex-direction:column;gap:12px;margin-top:20px;display:flex}.playlist-create input{color:#fff;background:#ffffff0a;border:1px solid #ffffff14;border-radius:14px;outline:none;height:50px;padding:0 16px}.playlist-create input:focus{border-color:var(--primary)}.create-btn{cursor:pointer;background:linear-gradient(135deg, var(--primary), var(--gold));color:#fff;border:none;border-radius:14px;height:50px;font-weight:700}.playlist-list{flex-direction:column;gap:12px;max-height:320px;margin-top:20px;display:flex;overflow-y:auto}.playlist-item{background:#ffffff0a;border:1px solid #ffffff0d;border-radius:18px;justify-content:space-between;align-items:center;width:100%;padding:14px;transition:all .3s;display:flex}.playlist-item:hover{border-color:#8b5cf659;width:calc(100% - 10px);transform:translate(5px)}.playlist-item-info{color:#fff;align-items:center;gap:14px;display:flex}.playlist-item-info svg{color:var(--gold);font-size:22px}.playlist-item-info h4{margin:0;font-size:15px}.playlist-item-info span{color:#9ca3af;font-size:13px}.playlist-exists{color:#22c55e;font-size:22px}.playlist-add-btn{cursor:pointer;color:#fff;background:linear-gradient(135deg, var(--primary), var(--gold));border:none;border-radius:50%;width:42px;height:42px;transition:all .3s}.playlist-add-btn:hover{transform:scale(1.1)rotate(90deg)}.empty-playlists{text-align:center;color:#9ca3af;padding:40px 0}.empty-playlists svg{color:var(--gold);margin-bottom:12px;font-size:42px}.my-playlists{z-index:2;position:relative}.playlist-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:26px;display:grid}.playlist-card{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffff0d;border:1px solid #ffffff14;border-radius:22px;transition:all .35s;overflow:hidden}.playlist-card:hover{border-color:#ffffff26;transform:translateY(-8px);box-shadow:0 18px 45px #00000073}.playlist-cover{background:#111;height:230px;position:relative}.playlist-cover img{object-fit:cover;width:100%;height:100%}.cover-icon{color:#777;margin:auto;font-size:70px;position:absolute;inset:0}.playlist-play{cursor:pointer;color:#fff;background:linear-gradient(135deg, var(--primary), var(--gold));opacity:0;border:none;border-radius:50%;justify-content:center;align-items:center;width:58px;height:58px;font-size:20px;transition:all .3s;display:flex;position:absolute;bottom:18px;right:18px;transform:translateY(15px)}.playlist-card:hover .playlist-play{opacity:1;transform:translateY(0)}.playlist-body{padding:18px}.playlist-body h3{color:#fff;margin-bottom:10px;font-size:20px}.playlist-body span{color:#9ca3af;align-items:center;gap:8px;font-size:14px;display:flex}.playlist-controller-btns{gap:5px;display:flex}.playlist-controller-btns button{cursor:pointer;color:#fff;border:none;border-radius:10px;outline:none;justify-content:center;align-items:center;width:30px;height:30px;font-size:13px;transition:all .3s;display:flex;transform:translateY(0)}.playlist-controller-btns button:hover{transform:translateY(-3px)}.edit-playlist{background-color:#8b5cf62e}.delete-playlist{background-color:#f87171;font-size:11px!important}.playlist-empty{background:#ffffff08;border:2px dashed #ffffff14;border-radius:24px;flex-direction:column;justify-content:center;align-items:center;gap:18px;min-height:420px;display:flex}.playlist-empty svg{color:var(--primary);font-size:70px}.playlist-empty h3{color:#fff;font-size:28px}.playlist-empty p{color:#9ca3af;text-align:center;max-width:340px}.menu-bar{cursor:pointer;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffff0f;border:1px solid #ffffff14;border-radius:16px;outline:none;justify-content:center;align-items:center;width:52px;height:52px;transition:all .35s;display:flex;position:relative;overflow:hidden}.menu-bar:before{content:"";opacity:0;background:linear-gradient(135deg,#8b5cf62e,#fbbf241f);transition:all .35s;position:absolute;inset:0}.menu-bar:hover:before{opacity:1}.menu-bar:hover{border-color:#ffffff2e;transform:translateY(-3px);box-shadow:0 12px 28px #8b5cf647}.menu-bar:active{transform:scale(.95)}.menu-bar-icon{z-index:2;color:#fff;font-size:22px;transition:all .35s;position:relative}.menu-bar:hover .menu-bar-icon{color:var(--gold);transform:rotate(90deg)}.sticky-element{z-index:1000;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background-color:#1006282e;justify-content:space-between;gap:20px;margin-bottom:30px;padding:10px;display:flex;position:sticky;top:0;left:0}.sticky-element .sticky-element-child{gap:20px;display:flex}.music-youtube-link{color:var(--gold);z-index:10000;font-size:23px;position:absolute;bottom:10px;left:20px}.music-view{z-index:999999;background:linear-gradient(#20283a 0%,#121822 55%,#0d1118 100%);flex-direction:column;padding:22px;display:flex;position:fixed;inset:0;overflow-y:auto}.music-view-header{justify-content:space-between;align-items:center;display:flex}.music-view-back,.music-view-placeholder{width:46px;height:46px}.music-view-back{color:#fff;cursor:pointer;background:#ffffff14;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:20px;transition:all .25s;display:flex}.music-view-back:hover{background:#ffffff26}.music-view-title{color:#b8c2d6;letter-spacing:3px;font-size:12px;font-weight:700}.music-view-cover-box{justify-content:center;align-items:center;width:100%;margin:18px 0 28px;display:flex}.music-view-cover{aspect-ratio:1;object-fit:cover;border-radius:28px;width:min(78vw,330px);box-shadow:0 30px 80px #00000073}.music-view-info{text-align:center}.music-view-info h2{color:#fff;margin-bottom:8px;font-size:30px;font-weight:700}.music-view-info p{color:#94a3b8;font-size:17px}.music-view-progress-wrapper{grid-template-columns:45px 1fr 45px;align-items:center;gap:12px;width:100%;max-width:360px;margin:35px auto 0;display:grid}.music-view-progress-wrapper>span{color:#8d98ad;font-size:13px}.music-view-progress-bar{background:#2b3343;border-radius:999px;width:100%;height:6px;overflow:hidden}.music-view-progress-fill{background:linear-gradient(90deg,#7c3aed,#38bdf8,#facc15);border-radius:999px;width:0;height:100%}.music-view-actions{justify-content:center;gap:18px;margin-top:35px;display:flex}.music-view-action-btn{color:#fff;cursor:pointer;background:#20293b;border:none;border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;font-size:22px;transition:all .25s;display:flex}.music-view-action-btn:hover{background:var(--primary);transform:scale(1.08)}.music-view-controller{justify-content:center;align-items:center;gap:30px;margin-top:45px;display:flex}.music-view-controller-btn{color:#fff;cursor:pointer;background:#20293b;border:none;border-radius:50%;justify-content:center;align-items:center;width:58px;height:58px;font-size:21px;transition:all .25s;display:flex}.music-view-controller-btn:hover{background:#2b374d;transform:scale(1.08)}.music-view-main-play{color:#fff;cursor:pointer;background:linear-gradient(135deg,#7c3aed,#38bdf8);border:none;border-radius:50%;justify-content:center;align-items:center;width:92px;height:92px;font-size:34px;transition:all .25s;display:flex;box-shadow:0 15px 40px #38bdf859}.music-view-main-play:hover{transform:scale(1.05)}.music-view-duration,.music-view-time{text-align:center}@media (width<=768px){.music-view{justify-content:flex-start;padding:18px}.music-view-cover{width:min(82vw,300px)}.music-view-info h2{font-size:28px}.music-view-info p{font-size:15px}.music-view-controller{gap:24px;margin-top:38px}}@media (width<=500px){.music-view{padding:16px}.music-view-cover{border-radius:22px;width:72vw}.music-view-info h2{font-size:25px}.music-view-progress-wrapper{max-width:320px}.music-view-controller{gap:20px}.music-view-controller-btn{width:52px;height:52px;font-size:18px}.music-view-main-play{width:84px;height:84px;font-size:30px}.music-view-action-btn{width:52px;height:52px;font-size:20px}}@media (width<=380px){.music-view-cover{width:78vw}.music-view-info h2{font-size:22px}.music-view-controller{gap:16px}}@media (width<=1100px){.playlist-cover{height:310px}}@media (width<=1000px){.playlist-cover{height:260px}.music-controller{left:0%;transform:translate(0%)}}@media (width<=930px){.playlist-grid{grid-template-columns:1fr 1fr}.playlist-cover{height:210px}}@media (width<=900px){.section-header h2{font-size:25px}.section-header p{font-size:15px}.main-modal{width:80%}}@media (width<=750px){.user{padding:20px 20px 180px}.music-grid{grid-template-columns:1fr 1fr 1fr}.section-header h2{font-size:21px}.section-header p{font-size:12px}.menu-bar{border-radius:10px;width:40px;height:40px;padding:0}.menu-bar-icon{font-size:20px}.music-details{width:calc(100% - 42px)}.music-controller{padding:12px 30px;left:50%;transform:translate(-50%)}.controller-top{gap:12px}.controller-left{min-width:0}.controller-cover{border-radius:10px;width:60px;height:60px}.controller-info{width:90px}.controller-info h4{font-size:13px}.controller-info p{font-size:11px}.controller-buttons{gap:10px}.play-main-btn{width:44px;height:44px;font-size:17px}.controller-right{gap:8px}.playlist-btn,.youtube-link,.volume-btn{width:34px;height:34px;font-size:13px}.playlist-btn{width:20px;height:20px;font-size:11px}.controller-progress{margin-top:12px}.controller-buttons button:first-child,.controller-buttons button:last-child{display:none}}@media (width<=590px){.user{padding:15px 15px 180px}.music-grid{grid-template-columns:1fr 1fr;gap:15px}.playlist-grid{gap:15px}.refresh-btn{border-radius:12px;height:38px;width:38px!important}.refresh-btn svg{font-size:20px}.main-modal{width:90%}.playlist-controller-btns{position:absolute;top:160px}.edit-playlist{background-color:#8b5cf6ad}}@media (width<=450px){.user{padding:10px 10px 180px}.music-grid{gap:10px}.playlist-cover{height:170px}.playlist-card{border-radius:10px}.sticky-element{gap:5px}.child-for-music{flex-direction:column}.main-modal{width:95%;padding:20px 15px}.playlist-modal{padding:10px}.music-card-user{border-radius:14px}.playlist-controller-btns{top:130px}}@media (width<=410px){.music-cover{height:170px}.main-modal{width:98%}}@media (width<=370px){.music-cover{height:150px}.main-modal{width:100%}}.mini-loading-overlay{-webkit-backdrop-filter:blur(6px);z-index:10;background:#0f172a59;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.mini-spinner{border:3px solid #ffffff26;border-top-color:#fbbf24;border-radius:50%;width:28px;height:28px;animation:.8s linear infinite spin}.artist{background-color:var(--bg);grid-column:1 span;height:100vh;display:block;overflow:hidden}.artist-info{border-bottom:1px solid #ffffff26;justify-content:center;align-items:center;width:100%;height:300px;display:flex}.artist-bubbles{width:100%;height:260px;position:relative}.artist-bubble{object-fit:cover;border:3px solid #ffffff26;border-radius:50%;position:absolute;box-shadow:0 0 30px #8b5cf640}.artist-bubble.center{z-index:3;width:120px;height:120px;top:50px;left:50%;transform:translate(-50%)}.artist-bubble.left{z-index:2;width:90px;height:90px;top:90px;left:20px}.artist-bubble.right{z-index:2;width:90px;height:90px;top:90px;right:20px}.not-3{width:150px!important;height:150px!important}.is-2{top:30px!important}.artist-name{color:#fff;text-align:center;white-space:wrap;text-shadow:0 0 10px #ffffff4d,0 0 30px #8b5cf666;text-transform:capitalize;width:100%;font-size:2rem;font-weight:800;position:absolute;bottom:-10px;left:50%;transform:translate(-50%)}.artist-musics{flex-direction:column;gap:10px;width:100%;height:calc(100vh - 300px);padding:20px;display:flex;position:relative}.artist-music-item{background:#ffffff08;border:1px solid #ffffff0f;border-radius:12px;justify-content:space-between;align-items:center;gap:10px;padding:8px 10px;transition:all .3s;display:flex}.artist-music-item:hover,.hover-style{background:#fbbf2414;border-color:#fbbf2440;transform:translate(4px)}.artist-music-cover{object-fit:cover;border-radius:10px;width:42px;height:42px}.artist-music-info h4{color:#fff;margin:0;font-size:.85rem}.artist-music-info p{color:var(--text-secondary);margin:0;font-size:.7rem}.current-playlist{color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(10px);background:#ffffff0d;border:1px solid #ffffff1a;border-radius:999px;padding:16px;font-size:.75rem;font-weight:600;transition:all .3s;box-shadow:0 0 20px #fbbf2414}.current-playlist:hover{color:#111827;background:linear-gradient(135deg,#fde68a,#fbbf24);border-color:#0000;transform:translateY(-2px);box-shadow:0 0 25px #fbbf2459}.current-playlist:active{transform:scale(.97)}@media (width<=750px){.artist{z-index:10000000;width:60%;transition:all .4s;position:absolute;left:-100%}}@media (width<=600px){.artist{width:80%}}.main{grid-template-columns:1fr 1fr 1fr 1fr 1fr;display:grid}@media (width<=1300px){.main{grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr}}@media (width<=1100px){.main{grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr}}
