.sidebar{background-color:var(--bg-secondary);padding:1rem;width:var(--sidebar-width);border-right:1px solid rgba(255,255,255,.1);transition:transform var(--transition-speed);height:100%;flex-shrink:0;font-size:.8rem;display:flex;flex-direction:column;-webkit-user-select:none;user-select:none;overflow-y:auto}.sidebar-overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;z-index:var(--z-overlay)}.sidebar-toggle{display:none;position:fixed;top:1rem;left:1rem;z-index:var(--z-sidebar);background:var(--bg-secondary);border:none;color:var(--text-primary);padding:.5rem;border-radius:.5rem;cursor:pointer}.sidebar .logo{align-items:center;gap:.5rem;font-size:1.25rem;font-weight:600;margin-bottom:2rem;color:var(--text-primary)}.sidebar .delimiter{display:block;width:100%;height:2px;background-color:var(--bg-primary);margin-block:1em}.sidebar nav{display:flex;flex-direction:column;flex:1}.sidebar nav .nav-item{display:flex;align-items:center;gap:.75rem;padding:.3rem;color:gray;text-decoration:none;border-radius:.5rem;transition:all var(--transition-speed)}.sidebar nav .nav-item:hover{background-color:var(--bg-tertiary);color:var(--text-primary);cursor:pointer}.sidebar nav .nav-item.active{background-color:var(--bg-tertiary);color:var(--text-primary)}.sidebar nav .nav-item.__child{margin-left:27px}.sidebar nav .nav-body{flex:1;overflow-y:auto}@media (max-width: 900px){.sidebar{position:absolute;top:0;left:0;height:100%;transform:translate(-100%);z-index:var(--z-sidebar)}.sidebar.open{transform:translate(0)}.sidebar-overlay.open{display:block}.sidebar-toggle{display:flex;align-items:center;justify-content:center}}.player{max-height:10dvh;background-color:#12181ccf;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid rgba(255,255,255,.1);padding:1rem;grid-template-columns:1fr 2fr 1fr;align-items:center;position:sticky;bottom:0;z-index:3;transform:translate(100%);grid-template-areas:"title controls data";-webkit-user-select:none;user-select:none;display:none;transition-duration:.3s;transition-property:overlay display transform;transition-behavior:allow-discrete;interpolate-size:allow-keywords}@media (max-width: 1020px){.player{grid-template-columns:none;grid-template-areas:"title title" "controls data";row-gap:1rem;max-height:18dvh}}@media (max-width: 700px){.player{grid-template-columns:1fr;grid-template-areas:"title" "controls";max-height:20dvh}}.player[data-show=true]{display:grid;transform:translate(0)}@starting-style{.player[data-show=true]{transform:translate(100%)}}.player>article{display:flex;align-items:center;gap:1rem}.player .track-info{display:flex;align-items:center;gap:1rem;grid-area:title}.player .track-info img{width:48px;height:48px;border-radius:.25rem;object-fit:cover}.player .controls{display:flex;align-items:center;gap:20px;grid-area:controls}.player .controls .buttons{display:flex;align-items:center;gap:1rem}.player .controls .volume{position:relative}.player .controls .volume .volume-bar[data-active=true]{position:absolute;bottom:21px;left:0;width:100%;height:100px;background-color:var(--bg-secondary);border-radius:3px;z-index:1;transition:transform var(--transition-speed);padding:4px}.player .controls .volume .volume-bar[data-active=true] .volume-bar-fill{display:block;height:100%;width:100%;border:thin solid var(--accent-color);border-radius:3px;position:relative;overflow:hidden}.player .controls .volume .volume-bar[data-active=true] .volume-bar-fill:before{content:"";position:absolute;width:100%;height:var(--fill);background-color:var(--accent-color);border-radius:2px;z-index:2;bottom:0;transition:transform var(--transition-speed)}.player .player__bottom{grid-area:data}@media (max-width: 700px){.player .player__bottom{display:none}}.player .title{font-size:1.1rem}.player .artist{color:#fbbf07;font-size:.7rem}.player .action-button{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:.25rem;transition:color var(--transition-speed)}.player .action-button>svg{width:15px;height:15px}.player .action-button:hover{color:var(--text-primary)}.progress{display:flex;align-items:center;gap:.5rem;width:100%}.progress__time{font-size:.875rem;color:#6b7280;width:3rem}.progress__bar{position:relative;flex:1;height:5px;background-color:gray;border-radius:15px;cursor:pointer}.progress__bar-fill{position:absolute;height:100%;background-color:#fff;border-radius:15px;transition:width .1s ease}.skeleton{background-color:var(--bg-primary);border-radius:4px;position:relative;overflow:hidden}.skeleton:after{content:"";position:absolute;top:0;left:-100%;height:100%;width:100%;background:linear-gradient(90deg,transparent,var(--bg-secondary),transparent);animation:shimmer 3s infinite}.skeleton:before{content:"";position:absolute;top:0;left:-100%;height:100%;width:100%;background:linear-gradient(90deg,transparent,var(--bg-secondary),transparent);animation:shimmer 3s infinite;animation-delay:1.5s}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(500%)}}header{display:flex;justify-content:flex-end;align-items:center;padding:10px;position:sticky;top:0;z-index:3;padding:1rem;gap:20px;background:#131318ee;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}header svg,header img{aspect-ratio:1;width:17px;height:17px}header .header__auth{display:flex;gap:10px;font-size:.9rem;align-items:center}header .header__auth.logged-in>*:not(.icons):not(.subs):not(.notifies):not(.credits){display:none}@media (max-width: 600px){header .header__auth.logged-in{display:none}}@media (max-width: 300px){header .header__auth{display:none}}header .header__auth .icons{display:flex;gap:10px;cursor:pointer;justify-content:center;align-items:center}header .header__auth .icons a{display:flex;align-items:center}header .header__auth .label{display:none}header .header__core{display:flex;align-items:center;gap:10px;padding:.4em .6em;border-radius:4px;position:relative}header .header__core .notify-count{background-color:var(--bg-five);color:var(--text-five);border-radius:50%;width:15px;height:15px;display:flex;align-items:center;justify-content:center;font-size:.6rem;top:-5px;right:-5px;font-weight:700;z-index:2}@media (max-width: 600px){header .header__core{background-color:transparent}}@media (max-width: 600px){header .header__core .notify-container{top:55%!important;left:-100%!important}}header .header__core .apps-container{left:50%;top:130%;transform:translate(-50%)}header .header__core .apps-container img{max-width:30px;aspect-ratio:1}@media (max-width: 600px){header .header__core .apps-container{top:130%!important;left:50%!important}}header .credits>strong{color:var(--text-accent)}header .user-profile{display:flex;align-items:center;gap:10px;background-color:#fff;color:#070d0fb6;font-weight:600;padding:4px 6px;border-radius:20px;cursor:pointer;transition:background-color .3s;position:relative;-webkit-user-select:none;user-select:none;font-size:.9rem;font-weight:700}header .user-profile svg,header .user-profile img{max-width:20px;border-radius:50px}header .user-profile .arrow-icon{transform:rotate(0);transition:transform .2s;display:block}header .user-profile .arrow-icon[data-open=true]{transform:rotate(180deg)}header .user-profile__data{position:absolute;top:150%;right:0;width:fit-content;background-color:var(--bg-secondary);color:var(--text-primary);border-radius:4px;padding:1em;z-index:6;display:none;opacity:0;flex-direction:column-reverse;align-items:flex-start;gap:10px;transition-property:overlay display opacity;transition-duration:.3s;transition-behavior:allow-discrete}header .user-profile__data .icons{display:none;flex-direction:column;align-items:center;gap:10px}@media (max-width: 600px){header .user-profile__data .icons{display:flex}}header .user-profile__data .notifies{display:none}@media (max-width: 600px){header .user-profile__data .notifies{display:flex}}header .user-profile__data strong{color:var(--text-accent)}header .user-profile__data>.subs,header .user-profile__data>.credits{display:none}@media (max-width: 600px){header .user-profile__data>.subs,header .user-profile__data>.credits{display:flex}}header .user-profile__data[data-open=true],header .user-profile__data:hover{display:flex;opacity:1}@starting-style{header .user-profile__data[data-open=true],header .user-profile__data:hover{opacity:0}}header .header__login{background:none;padding:5px;border:none;color:var(--text-primary);cursor:pointer;transition:color .2s;font-family:inter;font-size:.9rem}header .header__login:hover{color:var(--text-accent)}header .header__register{background-color:var(--bg-five);color:var(--bg-secondary);padding:5px 20px;border:none;border-radius:20px;text-decoration:none;transition:all .2s;font-weight:600}header .header__register:hover{background-color:#fff;filter:brightness(105%)}header .nav-burger{display:none;cursor:pointer}@media (max-width: 1020px){header .nav-burger{display:flex;justify-content:center;align-items:center}}:root{--bg-primary: #29292b;--bg-secondary: #121217;--bg-tertiary: #12181c;--bg-fourth: #2c4bec;--bg-five: #fbbf07;--text-primary: #ffffff;--text-secondary: #a0a0a0;--text-accent: #fbbf07;--text-fourth: #ffffff;--text-five: #000000;--accent-color: #ffd700;--button-primary: #2196f3;--button-secondary: #fbbf07;--sidebar-width: 170px;--header-height: 2px;--footer-height: 80px;--transition-speed: .2s;--z-sidebar: 1000;--z-overlay: 999}*{margin:0;padding:0;box-sizing:border-box}*::-webkit-scrollbar{width:.6em;height:.6em}*::-webkit-scrollbar-track{box-shadow:inset 0 0 6px #0000004d}*::-webkit-scrollbar-thumb{background-color:#a9a9a9;outline:1px solid slategrey;border-radius:2px}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:linear-gradient(to bottom,var(--bg-primary),var(--bg-secondary));color:var(--text-primary)}.app{display:flex;flex-direction:column;height:100vh}.app .skeleton{flex:1}.app .content-wrapper{display:flex;flex:1;overflow:hidden}.app .content-wrapper .main-content{flex:1;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:20px}.app .content-wrapper .main-content>section{flex:1;padding-bottom:2em}.app table{width:100%;border-collapse:collapse}.app table th{padding:1rem;color:var(--text-secondary);font-weight:500;border-bottom:1px solid var(--bg-tertiary);text-align:center}.app table tr:not(:has(th)){border-radius:10px}.app table td{padding:.5rem;color:var(--text-primary);border-bottom:1px solid #242b2f}.app .arrow{transition:transform .3s ease;transform:rotate(0)}.app .arrow[data-open=true]{transform:rotate(180deg)}.app .form-field .form-label{display:block;margin-bottom:.5rem;color:var(--text-primary);font-size:.875rem}.app .form-field .form-error{color:#ef4444;font-size:.75rem;margin-top:.25rem}.app .form-input,.app .form-select{text-align:left;width:100%;padding:.75rem;background-color:var(--bg-tertiary);border:1px solid transparent;border-radius:.375rem;color:var(--text-primary);transition:all var(--transition-speed)}.app .form-input:focus,.app .form-select:focus{outline:none;border-color:var(--accent-color)}.app .with-fields{justify-content:center}.app .with-fields>*{flex:1 1 200px}.app .artist-link{--artist-link-color: "gray";color:var(--artist-link-color);text-decoration:none;transition:.3s ease}.app .artist-link:hover{text-decoration:underline;color:var(--text-accent)}.app .genre-link{text-decoration:none;color:inherit;transition:.3s ease}.app .genre-link:hover{text-decoration:underline;color:var(--text-accent)}@media (max-width: 900px){.content-wrapper{position:relative}.content-wrapper .main-content{padding-top:calc(var(--header-height) + 2rem)}}.loader{width:40px;aspect-ratio:1.154;--_g: no-repeat radial-gradient(farthest-side, #fff 90%, #fff0);background:var(--_g) 50% 0,var(--_g) 0 100%,var(--_g) 100% 100%;background-size:35% 40.39%;animation:l16 1s infinite;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes l16{50%,to{background-position:100% 100%,50% 0,0 100%}}*{text-decoration:none!important}a,a:hover{text-decoration:none}.select{text-align:left;width:100%;padding:.75rem;background-color:var(--bg-tertiary);border:1px solid transparent;border-radius:.375rem;color:var(--text-primary);transition:all var(--transition-speed)}.select:focus{outline:none}.fixed{position:fixed}.relative{position:relative}.absolute{position:absolute}.top-0{top:0}.top-5{top:5px}.top-10{top:10px}.top-15{top:15px}.top-20{top:20px}.top-25{top:25px}.top-30{top:30px}.top-35{top:35px}.top-40{top:40px}.top-45{top:45px}.top-50{top:50px}.top-55{top:55px}.top-60{top:60px}.top-65{top:65px}.top-70{top:70px}.top-75{top:75px}.top-80{top:80px}.top-85{top:85px}.top-90{top:90px}.top-95{top:95px}.top-100{top:100px}.left-0{left:0}.left-5{left:5px}.left-10{left:10px}.left-15{left:15px}.left-20{left:20px}.left-25{left:25px}.left-30{left:30px}.left-35{left:35px}.left-40{left:40px}.left-45{left:45px}.left-50{left:50px}.right-0{right:0}.right-5{right:5px}.right-10{right:10px}.right-15{right:15px}.right-20{right:20px}.right-25{right:25px}.right-30{right:30px}.right-35{right:35px}.right-40{right:40px}.right-45{right:45px}.right-50{right:50px}.bottom-0{bottom:0}.bottom-5{bottom:5px}.bottom-10{bottom:10px}.bottom-15{bottom:15px}.bottom-20{bottom:20px}.bottom-25{bottom:25px}.bottom-30{bottom:30px}.bottom-35{bottom:35px}.bottom-40{bottom:40px}.bottom-45{bottom:45px}.bottom-50{bottom:50px}.flex{display:flex}.flex.column{flex-direction:column}.flex.column-reverse{flex-direction:column-reverse}.flex.row{flex-direction:row}.flex.row-reverse{flex-direction:row-reverse}.flex.nowrap{flex-wrap:nowrap}.flex.wrap{flex-wrap:wrap}.flex.justify{justify-content:center}.flex.justify-end{justify-content:flex-end}.flex.justify-start{justify-content:flex-start!important}.flex.justify-between{justify-content:space-between}.flex.justify-around{justify-content:space-around}.flex.justify-evenly{justify-content:space-evenly}.flex.align{align-items:center}.flex.align-end{align-items:flex-end}.flex.align-start{align-items:flex-start!important}.flex.gap-5{gap:5px}.flex.gap-10{gap:10px}.flex.gap-15{gap:15px}.flex.gap-20{gap:20px}.flex.gap-25{gap:25px}.flex.gap-30{gap:30px}.flex.gap-35{gap:35px}.flex.gap-40{gap:40px}.flex.gap-45{gap:45px}.flex.gap-50{gap:50px}.flex.include-align>*{display:flex;align-items:center}.flex.basis-50{flex-basis:50px}.flex.basis-100{flex-basis:100px}.flex.basis-150{flex-basis:150px}.flex.basis-200{flex-basis:200px}.flex.basis-250{flex-basis:250px}.flex.basis-300{flex-basis:300px}.flex.basis-350{flex-basis:350px}.flex.basis-400{flex-basis:400px}.flex.basis-450{flex-basis:450px}.flex.basis-500{flex-basis:500px}.none{display:none}.block{display:block}.m{margin:.2em}.m-1{margin:1em}.m-2{margin:2em}.m-3{margin:3em}.m-4{margin:4em}.m-5{margin:5em}.mx-auto{margin-inline:auto}.my{margin-block:.2em}.my-1{margin-block:1em}.my-2{margin-block:2em}.my-3{margin-block:3em}.my-4{margin-block:4em}.my-5{margin-block:5em}.my-top{margin-block-start:.2em}.my-top-1{margin-block-start:1em}.my-top-2{margin-block-start:2em}.my-top-3{margin-block-start:3em}.my-top-4{margin-block-start:4em}.my-top-5{margin-block-start:5em}.my-bottom{margin-block-end:.2em}.my-bottom-1{margin-block-end:1em}.my-bottom-2{margin-block-end:2em}.my-bottom-3{margin-block-end:3em}.my-bottom-4{margin-block-end:4em}.my-bottom-5{margin-block-end:5em}.mx{margin-inline:.2em}.mx-1{margin-inline:1em}.mx-2{margin-inline:2em}.mx-3{margin-inline:3em}.mx-4{margin-inline:4em}.mx-5{margin-inline:5em}.p{padding:.2em}.p-1{padding:1em}.p-2{padding:2em}.p-3{padding:3em}.p-4{padding:4em}.p-5{padding:5em}.py{padding-block:.2em}.py-1{padding-block:1em}.py-2{padding-block:2em}.py-3{padding-block:3em}.py-4{padding-block:4em}.py-5{padding-block:5em}.py-top{padding-block-start:.2em}.py-top-1{padding-block-start:1em}.py-top-2{padding-block-start:2em}.py-top-3{padding-block-start:3em}.py-top-4{padding-block-start:4em}.py-top-5{padding-block-start:5em}.py-bottom{padding-block-end:.2em}.py-bottom-1{padding-block-end:1em}.py-bottom-2{padding-block-end:2em}.py-bottom-3{padding-block-end:3em}.py-bottom-4{padding-block-end:4em}.py-bottom-5{padding-block-end:5em}.px{padding-inline:.2em}.px-1{padding-inline:1em}.px-2{padding-inline:2em}.px-3{padding-inline:3em}.px-4{padding-inline:4em}.px-5{padding-inline:5em}.px-left{padding-inline-start:.2em}.px-left-1{padding-inline-start:1em}.px-left-2{padding-inline-start:2em}.px-left-3{padding-inline-start:3em}.px-left-4{padding-inline-start:4em}.px-left-5{padding-inline-start:5em}.py-right{padding-inline-end:.2em}.py-right-1{padding-inline-end:1em}.py-right-2{padding-inline-end:2em}.py-right-3{padding-inline-end:3em}.py-right-4{padding-inline-end:4em}.py-right-5{padding-inline-end:5em}.h-fit-content{height:fit-content!important}.w-fit-content{width:fit-content!important}.overflow-hidden{overflow:hidden}.overflow-y{overflow-y:auto}.overflow-x{overflow-x:auto}.fs-0{font-size:0rem}.fs-1{font-size:1rem}.fs-2{font-size:2rem}.fs-3{font-size:3rem}.fs-4{font-size:4rem}.fs-5{font-size:5rem}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.text-nowrap{text-wrap:nowrap}.rounded-4{border-radius:4px}.rounded-6{border-radius:6px}.rounded-8{border-radius:8px}.rounded-10{border-radius:10px}.rounded-12{border-radius:12px}.rounded-14{border-radius:14px}.rounded-16{border-radius:16px}.rounded-18{border-radius:18px}*[role=button],button{cursor:pointer}.btn{width:fit-content;padding:.4em 2em;border-radius:4px;transition:box-shadow .3s,background-color .3s;font-size:1rem;background:transparent;border:none}.btn.primary{background-color:#264752;color:#fff}.btn.primary-border{background-color:transparent;border:2px solid rgb(38,71,82)}.btn.secondary{background-color:#2a9c8e;color:#fff}.btn.secondary-border{background-color:transparent;border:2px solid rgb(42,156,142)}.btn.teriroty{background-color:#e66f50;color:#fff}.btn.teriroty-border{background-color:transparent;border:2px solid rgb(230,111,80)}.btn.danger{background-color:#f01a1a;color:#fff}.btn.danger-border{background-color:transparent;border:2px solid rgb(240,26,26)}.btn:hover{box-shadow:1px 2px 4px #00000069}.btn:disabled{background-color:gray!important;cursor:not-allowed}input{background-color:transparent;text-align:center;border:thin solid gray;border-radius:10px;font-size:1rem;text-align:left;padding:.5em .5em .5em 30px}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-webkit-appearance:textfield;appearance:textfield;-moz-appearance:textfield}input::placeholder{color:gray;font-size:.8rem}input:active,input:focus{outline:none}.backdrop-shadow{transition:filter .3s ease}.backdrop-shadow:hover{filter:drop-shadow(1px 3px 2px rgba(128,128,128,.653))}.animate-height{justify-content:center;align-items:center}.animate-height:is(:not(tr)){display:none;opacity:0;height:0;transition-duration:1s;transition-property:overlay display opacity height;transition-behavior:allow-discrete;interpolate-size:allow-keywords}.animate-height:is(tr) td *:not(dialog){display:none;opacity:0;height:0;transition-duration:.3s;transition-property:overlay display opacity height padding;transition-behavior:allow-discrete;interpolate-size:allow-keywords}.animate-height[open],.animate-height[data-open=true]{justify-content:center;align-items:center}.animate-height[open]:is(:not(tr)),.animate-height[data-open=true]:is(:not(tr)){height:fit-content;opacity:1;display:flex!important}.animate-height[open]:is(tr) td *:not(dialog),.animate-height[data-open=true]:is(tr) td *:not(dialog){height:fit-content;opacity:1;display:flex!important}@starting-style{.animate-height[open]:is(:not(tr)),.animate-height[data-open=true]:is(:not(tr)){height:0;opacity:0}.animate-height[open]:is(tr) td>*,.animate-height[data-open=true]:is(tr) td>*{height:0;opacity:0}}dialog{width:100%;height:100%;max-width:100dvw;max-height:100dvh;background:#00000053;border:none;justify-content:center;align-items:center}dialog:active,dialog:focus{outline:none}dialog,.animate-translate{display:none;translate:0 25px;opacity:0;transition-duration:1s;transition-property:overlay display opacity;transition-behavior:allow-discrete}dialog[open],dialog[data-open=true],.animate-translate[open],.animate-translate[data-open=true]{opacity:1;translate:0 0;display:flex!important}@starting-style{dialog[open],dialog[data-open=true],.animate-translate[open],.animate-translate[data-open=true]{opacity:0;translate:0 -25px}}.width{width:100%}.width-50{width:50px}.width-100{width:100px}.width-150{width:150px}.width-200{width:200px}.width-250{width:250px}.width-300{width:300px}.width-350{width:350px}.width-400{width:400px}.width-450{width:450px}.width-500{width:500px}.max-width{max-width:100%}.max-width-50{max-width:50px}.max-width-100{max-width:100px}.max-width-150{max-width:150px}.max-width-200{max-width:200px}.max-width-250{max-width:250px}.max-width-300{max-width:300px}.max-width-350{max-width:350px}.max-width-400{max-width:400px}.max-width-450{max-width:450px}.max-width-500{max-width:500px}.min-width-60{min-width:60px}.min-width-80{min-width:80px}.min-width-100{min-width:100px}.min-width-120{min-width:120px}.min-width-140{min-width:140px}.min-width-160{min-width:160px}.min-width-180{min-width:180px}.min-width-200{min-width:200px}.min-width-220{min-width:220px}.min-width-240{min-width:240px}.min-width-260{min-width:260px}.min-width-280{min-width:280px}.min-width-300{min-width:300px}.min-width-320{min-width:320px}.min-width-340{min-width:340px}.min-width-360{min-width:360px}.min-width-380{min-width:380px}.min-width-400{min-width:400px}.min-width-420{min-width:420px}.min-width-440{min-width:440px}.min-width-460{min-width:460px}.min-width-480{min-width:480px}.min-width-500{min-width:500px}.alert{padding:.4em 1em;text-align:center;border-radius:4px}.alert.danger{color:#fff;background-color:#f01a1abf}.pointer{cursor:pointer}.drag{cursor:grab}.procesar{color:#fff}.procesar:hover{background:#195f42}.select-none{-webkit-user-select:none;user-select:none}.text-center{text-align:center!important}.flex-1{flex:1}
