:root{--bg-dark: hsl(0 0% 0%);--bg: hsl(0 0% 5%);--bg-light: hsl(0 0% 10%);--text: hsl(0 0% 95%);--text-muted: hsl(0 0% 70%);--loadingStart: hsl(200, 20%, 70%);--loadingEnd: hsl(200, 20%, 95%);--red: #d44a4a;color:var(--text);--alert-color-red: rgba(155, 19, 19, .7);--alert-color-green: rgba(68, 147, 81, .7);--alert-color-yellow: rgba(255, 211, 44, .7)}.light-theme{--bg-dark: hsl(0 0% 100%);--bg: hsl(0 0% 95%);--bg-light: hsl(0 0% 90%);--text: hsl(0 0% 5%);--text-muted: hsl(0 0% 30%);--loadingStart: hsl(200, 9%, 47%);--loadingEnd: hsl(200, 2%, 63%);--red: #fd8e8e;--alert-color-red: rgba(255, 168, 150, .7);--alert-color-green: rgba(133, 198, 143, .7);--alert-color-yellow: rgba(255, 234, 153, .7)}.primary-purple{--primary: #8957ff;--active-text: #7a4de4}.primary-purple.light-theme{--active-text: #aa9ff6}.primary-pink{--primary: #fa8abb;--active-text: #dc80a7}.primary-pink.light-theme{--active-text: #ffdbdb}.primary-red{--primary: #ff3366;--active-text: #e02d5a}.primary-red.light-theme{--active-text: #fcccd8}.primary-yellow{--primary: #ffbb00;--active-text: #e4a701}.primary-yellow.light-theme{--active-text: #fde9b8}.primary-blue{--primary: #02bbff;--active-text: #02a0d9}.primary-blue.light-theme{--active-text: #a0e1f8}.primary-green{--primary: #00cc88;--active-text: #01a26c}.primary-green.light-theme{--active-text: #a5f8dc}.menu-container{grid-area:menu;width:14.375rem;transition:width ease-in-out .3s;position:relative;overflow:auto;border-right:.0625rem solid var(--bg-light)}.menu-container .scrollbar{overflow-y:auto;overflow-x:hidden;height:100%;padding:0 1rem;display:flex;gap:1rem;flex-direction:column;justify-content:space-between;-ms-overflow-style:none;scrollbar-width:none}.menu-container .scrollbar::-webkit-scrollbar{display:none}.menu-container .bot-selection{position:relative;width:100%;overflow:hidden;margin-top:.625rem}.menu-container .bot-selection:hover .options{height:5.625rem}.menu-container .bot-selection:hover .selected span{transform:rotate(0)}.menu-container .bot-selection .selected{cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:.625rem;border-radius:.5rem;border:.125rem solid var(--bg-light)}.menu-container .bot-selection .selected span{transform:rotate(180deg);font-size:1rem;color:var(--text-muted)}.menu-container .bot-selection .selected p{overflow:hidden;white-space:nowrap}.menu-container .bot-selection .left{display:flex;align-items:center;gap:.75rem}.menu-container .bot-selection img{width:1.1875rem;border-radius:50%}.menu-container .bot-selection .options{width:100%;height:0rem;display:flex;flex-direction:column;background-color:var(--bg-light);border-radius:.5rem;overflow:hidden;transition:all ease-in-out .2s;overflow-y:auto}.menu-container .bot-selection .options .option{display:flex;padding:.625rem .75rem;align-items:center;gap:.75rem;cursor:pointer}.menu-container .bot-selection .options .option:hover{background-color:var(--bg-dark)}.menu-container .bot-selection .options .option p{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.menu-container .top{display:flex;flex-direction:column;gap:.75rem}.menu-container .bar{background-color:var(--bg-light);padding:.0625rem;border-radius:.625rem}.menu-container .section{display:flex;flex-direction:column;overflow:hidden}.menu-container .section .menu-btn{display:flex;align-items:center;padding:.625rem .75rem;gap:.75rem;transition:all ease-in-out .2s;border-radius:.5rem;cursor:pointer}.menu-container .section .menu-btn p{text-wrap:nowrap;font-size:1rem;color:var(--text-muted)}.menu-container .section .menu-btn span{font-size:1.25rem;color:var(--text-muted)}.menu-container .section .menu-btn:hover{background-color:color-mix(in srgb,var(--bg-light) 80%,white)}.menu-container .section .menu-btn.center{background-color:var(--bg-light);justify-content:center;border-radius:1.25rem;gap:.3125rem;margin-bottom:.625rem}.menu-container .section .menu-btn.center p{padding-right:.3125rem}.menu-container .section .menu-btn.center:hover{background-color:color-mix(in srgb,var(--bg-light) 80%,white)}.menu-container .section .menu-btn.red p,.menu-container .section .menu-btn.red span{color:#cc8889}.menu-container .section .menu-btn.active{background-color:var(--bg-light);color:var(--text)}.menu-container .section .menu-btn.active p,.menu-container .section .menu-btn.active span{font-variation-settings:"FILL" 1,"wght" 400,"GRAD" 0,"opsz" 24;color:var(--text)}.menu-container.hide{width:4.75rem}.menu-container.hide .bot-selection span,.menu-container.hide .section .header span,.menu-container.hide p,.menu-container.hide .no-icon{display:none}@media(max-width:768px){.menu-container{position:fixed;top:0;left:0;width:80vw;max-width:320px;height:100vh;z-index:1002;background:var(--bg);box-shadow:2px 0 16px #00000026;transform:translate(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1);border-right:none}.menu-container.active{transform:translate(0)}#menu-overlay.mobile-overlay{display:none;position:fixed;top:0;left:0;width:100vw;height:100vh;background:#0000004d;z-index:1001}.menu-container.active+#menu-overlay.mobile-overlay{display:block}}.queue-container{grid-area:queue;justify-self:end;width:25rem;padding:.3125rem;display:flex;flex-direction:column;gap:.75rem;overflow-y:auto;overflow-x:hidden;transition:width .3s ease-in-out,padding .3s ease-in-out}.queue-container.close{width:0rem;padding:.3125rem 0rem}.queue-container .header.small-padding{padding-block:.625rem}.queue-container .header{display:flex;align-items:center;justify-content:space-between;margin:0 .625rem;white-space:nowrap}.queue-container .header .actions{display:flex;align-items:center;gap:.625rem}.queue-container .header .btn{position:relative;display:flex;flex-direction:column;align-items:center}.queue-container .header .btn .label{position:absolute;bottom:-2.8125rem;padding:.5rem .75rem;background-color:var(--bg-light);border-radius:.25rem;opacity:0;transition:all ease-in-out .2s;pointer-events:none;white-space:nowrap;z-index:1}.queue-container .header .btn span:hover+.label{opacity:1;transition-delay:.5s}.queue-container .header .btn span{color:var(--text-muted)}.queue-container .header .btn.active span{color:var(--text)}.queue-container .scrollbar{position:relative;display:flex;flex-direction:column;gap:.75rem;overflow-y:auto;scrollbar-gutter:stable;height:100%}.queue-container .scrollbar .action-bar{position:sticky;display:flex;align-items:center;justify-content:center;gap:.3125rem;border-radius:1.25rem;margin:-1.5rem auto;padding:.5rem 1.375rem .5rem 1.25rem;bottom:-.9375rem;left:0;right:0;width:fit-content;background-color:var(--bg-light);opacity:0;pointer-events:none;transition:all .2s ease-in-out;cursor:pointer}.queue-container .scrollbar .action-bar span,.queue-container .scrollbar .action-bar p{font-size:.75rem}.queue-container .scrollbar .action-bar:hover{scale:1.05;background-color:var(--active-text)}.queue-container .scrollbar .action-bar.active{opacity:1;transform:translateY(-1.5625rem);pointer-events:auto}.queue-container .section{display:flex;flex-direction:column;width:100%;gap:.5rem}.queue-container .section .header{display:flex;align-items:end;justify-content:space-between;gap:1.25rem;margin:0 .625rem}.queue-container .section .header p{cursor:pointer;color:var(--text-muted)}.queue-container .section .track{display:flex;align-items:center;justify-content:space-between;overflow:hidden;transition:opacity .1s ease-in-out;padding:.625rem .875rem;border-radius:.375rem;margin-right:.3125rem;cursor:pointer}.queue-container .section .track:hover{background-color:var(--bg-light)}.queue-container .section .track:hover span{opacity:1}.queue-container .section .track:hover .left .thumbnail{transition-delay:.2s}.queue-container .section .track:hover .left .thumbnail .track-img{filter:brightness(50%)}.queue-container .section .track:hover .left .thumbnail .requester-img{transition-delay:.2s;opacity:1}.queue-container .section .track .left{min-width:90%;display:flex;align-items:center;gap:.9375rem}.queue-container .section .track .left .track-info{width:100%;display:flex;flex-direction:column;gap:.625rem;overflow:hidden}.queue-container .section .track .left .track-info p{width:97%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.queue-container .section .track .left .thumbnail .track-img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;border-radius:.3125rem;transition:all .3s ease-in-out}.queue-container .section .track .left .thumbnail .requester-img{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:65%;height:65%;object-fit:cover;border-radius:50%;opacity:0;transition:opacity .2s ease-in-out}.queue-container .section .track .left .thumbnail{position:relative;min-width:3.125rem;min-height:3.125rem}.queue-container .section .track .left .thumbnail:before{content:"";display:block}.queue-container .section span{opacity:0}.queue-container .section .queue{display:flex;flex-direction:column}.queue-container .autoplay-btn{display:flex;justify-content:center;align-items:center;padding:.6rem;transition:all ease-in-out .2s;overflow:hidden;border-radius:.5rem;border:.125rem solid var(--bg-light);cursor:pointer}.queue-container .autoplay-btn:hover{background-color:color-mix(in srgb,var(--bg-light) 80%,white)}.queue-container .autoplay-btn.active{background-color:var(--bg-light)}.queue-container .autoplay-btn.active:hover{background-color:color-mix(in srgb,var(--bg-light) 80%,white)}.queue-container .autoplay-btn p{text-wrap:nowrap;font-size:1rem;color:var(--text-muted)}.avatar-container{display:flex;align-items:center;justify-content:flex-end;width:auto}.avatar{position:relative;transition:.2s}.avatar img{width:2rem;height:2rem;display:block;object-fit:cover;border-radius:50%;border:.125rem solid var(--bg);background-color:var(--bg)}.avatar:not(:first-child){margin-left:-.625rem}.avatar:hover{z-index:1;transform:translateY(.5rem)}.avatar:hover .name{opacity:1;visibility:visible}.avatar.extra{width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;background-color:var(--bg);border-radius:50%;object-fit:cover}.avatar .name{position:absolute;max-width:9.375rem;bottom:-100%;left:50%;transform:translate(-50%);padding:.5rem .75rem;border-radius:.3125rem;background-color:var(--bg-light);white-space:nowrap;opacity:0;visibility:hidden;transition:.2s;font-size:.875rem;text-overflow:ellipsis;overflow:hidden}@media(max-width:768px){.queue-container{position:fixed;top:0;right:0;width:90vw;max-width:400px;height:100vh;z-index:1002;background:var(--bg);box-shadow:-2px 0 16px #00000026;transform:translate(100%);transition:transform .3s cubic-bezier(.4,0,.2,1)}.queue-container.active{transform:translate(0)}#queue-overlay.mobile-overlay{display:none;position:fixed;top:0;left:0;width:100vw;height:100vh;background:#0000004d;z-index:1001}.queue-container.active~#queue-overlay.mobile-overlay{display:block}}.control-container{position:relative;grid-area:control;display:grid;grid-template-areas:"left center right";grid-template-columns:1fr 2fr 1fr;padding:.625rem 1.5rem;background-color:var(--bg)}.control-container>div{display:flex;align-items:center}.control-container .material-symbols-outlined{cursor:pointer;transition:all ease-in-out .2s;color:var(--text-muted)}.control-container .left{grid-area:left;display:flex;align-items:center;gap:.9375rem;overflow:hidden;opacity:0;transition:all .2s;width:100%}.control-container .left img{width:3.125rem;height:3.125rem;object-fit:cover;border-radius:.3125rem}.control-container .left .track-info{display:flex;align-items:flex-start;flex-direction:column;gap:.625rem;min-width:10%;max-width:70%}.control-container .left .track-info p{width:100%;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.control-container .btn{position:relative;display:flex;flex-direction:column;align-items:center}.control-container .btn .label{position:absolute;top:-2.8125rem;padding:.5rem .75rem;background-color:var(--bg-light);border-radius:.25rem;opacity:0;transition:all ease-in-out .2s;pointer-events:none;white-space:nowrap}.control-container .btn span:hover+.label{opacity:1;transition-delay:.5s}.control-container .center{grid-area:center;display:flex;flex-direction:column;justify-content:center;gap:.5rem}.control-container .center .actions{display:flex;align-items:center;gap:.9375rem}.control-container .center .actions .play_btn{font-size:2.5rem;color:var(--text)}.control-container .center .actions span{font-size:1.5625rem}.control-container .center .position{display:flex;align-items:center;gap:.875rem;width:70%;min-width:21.875rem}.control-container .position-bar{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;cursor:pointer;outline:none;border-radius:.9375rem;height:.3125rem;transition:all .2s ease-in-out;background:linear-gradient(to right,var(--primary) 0%,var(--text-muted) 0%)}.control-container .position-bar::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:.9375rem;width:.9375rem;background-color:var(--active-text);border-radius:50%;border:none;transition:.2s ease-in-out;opacity:0}.control-container .position-bar:hover::-webkit-slider-thumb{opacity:1}.control-container .position-bar:-webkit-slider-runnable-track{background-color:var(--text-muted)}.control-container .position-bar:-moz-range-track{background-color:var(--text-muted)}.control-container .volume-bar{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:4.375rem;cursor:pointer;outline:none;border-radius:.9375rem;height:.3125rem;transition:all .2s ease-in-out;background:linear-gradient(to right,var(--primary) 0%,var(--text-muted) 0%)}.control-container .volume-bar::-webkit-slider-thumb{color:#fff;opacity:0}.control-container .volume-bar:hover::-webkit-slider-thumb{opacity:1}.control-container .volume-bar:-webkit-slider-runnable-track{background-color:var(--text-muted)}.control-container .volume-bar:-moz-range-track{background-color:var(--text-muted)}.control-container .right{grid-area:right;display:flex;justify-content:flex-end;gap:.9375rem}@media(max-width:768px){.control-container{grid-template-columns:1fr 2fr 1fr;padding:.5rem;gap:.5rem}.control-container .left,.control-container .center,.control-container .right{min-width:0}.non-essential{display:none!important}.important{display:flex!important;align-items:center}.center .actions{gap:.5rem}.center .btn.important span{font-size:2rem}.left.important img{width:2.2rem;height:2.2rem}.track-info.important{max-width:100px}.track-info.important p.title{font-size:1rem}}@media(max-width:480px){.control-container{grid-template-columns:1fr 2fr 1fr;padding:.25rem;gap:.25rem}.track-info.important{max-width:60px}.track-info.important p.title{font-size:.9rem}.center .btn.important span{font-size:1.5rem}.left.important img{width:1.5rem;height:1.5rem}}.header-container{grid-area:header;position:relative;display:flex;align-items:center;justify-content:space-between;padding:.7rem 1rem;height:min-content;gap:1rem;border-bottom:.0625rem solid var(--bg-light)}.header-container span{font-size:1.25rem}.header-container .menu-bar-btn,.header-container .back-page-btn{display:flex;justify-content:center;align-items:center;padding:.625rem;border-radius:50%;cursor:pointer;font-size:1.25rem}.header-container .menu-bar-btn:hover,.header-container .back-page-btn:hover{background-color:var(--bg-light)}.search-container{flex:1;display:flex;align-items:center;justify-content:center;gap:.75rem}.search-container .search-bar{position:relative;display:flex;align-items:center;width:100%;max-width:30rem;background-color:var(--bg);padding:.625rem .9375rem;border-radius:1.2rem;outline:.0625rem solid var(--bg-light);transition:outline .1s ease-in-out;box-shadow:0 2px 8px #0000000a}.search-container .search-bar:hover{outline:.125rem solid var(--text-muted)}.search-container .search-bar:focus-within{outline:.125rem solid var(--active-text)}.search-container .search-bar input{font-size:.95rem;padding:0 .75rem;width:100%;background-color:transparent;outline:none;border:none;color:var(--text)}.search-container .search-bar .material-symbols-outlined{font-size:1.25rem}.search-container .search-bar .search-result{position:absolute;display:none;flex-direction:column;z-index:1;top:calc(100% + .5rem);left:0;width:100%;height:31.25rem;max-height:60vh;background-color:var(--bg);border-radius:.5rem;padding:.625rem .3125rem;gap:.625rem;overflow:hidden}.search-container .search-bar .search-result img{width:3.4375rem;height:3.4375rem;object-fit:cover;border-radius:.5rem}.search-container .search-bar .search-result .header{display:flex;justify-content:space-between;align-items:center;padding:.625rem .875rem}.search-container .search-bar .search-result .btn{display:flex;align-items:center;padding:.3125rem .875rem;border-radius:.5rem;gap:.3125rem;cursor:pointer;transition:all ease-in-out .2s;background-color:var(--bg-light)}.search-container .search-bar .search-result .btn:hover{scale:1.1}.search-container .search-bar .search-result .tracks{display:flex;flex-direction:column;height:90%;gap:.3125rem;overflow-y:scroll;overflow-x:hidden;scrollbar-gutter:stable}.search-container .search-bar .search-result .track-row{display:flex;align-items:center;justify-content:space-between;padding:.625rem .875rem;margin-right:.3125rem;border-radius:.75rem;cursor:pointer;transition:all ease-in-out .2s}.search-container .search-bar .search-result .track-row:hover{background-color:var(--bg-light)}.search-container .search-bar .search-result .track-row .left{width:85%;display:flex;align-items:center;gap:.625rem}.search-container .search-bar .search-result .track-row .track-info{width:100%;display:flex;flex-direction:column;justify-content:center;overflow:hidden}.search-container .search-bar .search-result .track-row p{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.search-container .search-bar .search-result .track-row p.title{font-size:1.0625rem;margin-bottom:.5rem}.search-container .search-bar .search-result .track-row p.description{font-size:.875rem;color:var(--text-muted)}.search-container .search-bar .search-result p{font-size:.9375rem}.header-btn{position:relative;z-index:2}.header-btn .btn{position:relative;display:flex;flex-direction:column;justify-content:left;align-items:center;padding:.625rem;border-radius:.5rem;cursor:pointer;transition:all ease-in-out .1s}.header-btn .btn:active{scale:.95}.header-btn .btn.active:after{content:"";position:absolute;top:.5625rem;right:.5625rem;background-color:#d44a4a;border-radius:50%;width:.5rem;height:.5rem}.header-btn .btn .label{position:absolute;bottom:-2.5rem;padding:.5rem .75rem;background-color:var(--bg-light);border-radius:.25rem;opacity:0;transition:all ease-in-out .2s;pointer-events:none;white-space:nowrap;z-index:1}.header-btn .btn span:hover+.label{opacity:1;transition-delay:.5s}.header-btn .panel{position:absolute;top:2.5rem;height:fit-content;width:25rem;max-height:70vh;right:0%;background-color:var(--bg-dark);opacity:0;transition:all .3s ease-in-out;border-radius:.5rem;box-shadow:#63636333 0 .125rem .5rem;display:flex;flex-direction:column;gap:.625rem;pointer-events:none;overflow:hidden;z-index:5}.header-btn .panel.active{opacity:1;transform:translateY(.625rem);pointer-events:auto;overflow-y:auto;-ms-overflow-style:none;scrollbar-width:none}.header-btn .panel .header{display:flex;align-items:center;gap:.5rem;background-color:var(--bg-light);padding:.9375rem}.header-btn .panel .header span{font-size:1.4375rem}.header-btn .panel .sections{display:flex;flex-direction:column;gap:.3125rem;overflow:auto}.header-btn .panel .no-message{display:flex;justify-content:center;align-items:center;flex-direction:column;padding:3.125rem 0}.header-btn .panel .no-message img{width:6.25rem;margin-bottom:1.875rem}.header-btn .panel .message{padding:.625rem .9375rem 1.25rem;border-bottom:.0625rem solid var(--bg-light);display:flex;gap:.9375rem}.header-btn .panel .message:hover{background-color:var(--bg)}.header-btn .panel .message img{width:2.8125rem;height:2.8125rem;border-radius:50%}.header-btn .panel .message .title{font-size:.9375rem;font-weight:600;margin-bottom:.375rem}.header-btn .panel .message .time{font-size:.875rem;color:var(--text-muted);margin-bottom:.625rem}.header-btn .panel .message .description{color:var(--text-muted);margin-bottom:.625rem;line-height:150%}.header-btn .panel .message .actions{display:flex;align-items:center;gap:.625rem}.header-btn .panel .message .action{padding:.5rem .9375rem;border-radius:.3125rem;border:.0938rem solid var(--bg-light);cursor:pointer;transition:all .2s ease-in-out}.header-btn .panel .message .action.accept{background-color:var(--active-text)}.header-btn .panel .message .action:hover:not(.accept){background-color:#d44a4a;color:#fff}.user-avatar{display:flex;align-items:center;gap:.75rem;cursor:pointer}.user-avatar img{width:2.5rem;height:auto;border-radius:50%}.user-menu-container{position:relative;display:flex;align-items:center;justify-content:flex-end;width:auto}.user-menu-panel{position:absolute;top:3.5rem;right:0;background-color:var(--bg-light);border-radius:.5rem;box-shadow:#63636333 0 .125rem .5rem;opacity:0;transform:translateY(.625rem);pointer-events:none;transition:all .3s ease-in-out;min-width:10rem;padding:.25rem;z-index:10}.user-menu-panel.active{opacity:1;transform:translateY(0);pointer-events:auto;z-index:1}.user-menu-panel ul{list-style:none;padding:0;margin:0}.user-menu-panel ul li{padding:.75rem .875rem;cursor:pointer;display:flex;align-items:center;gap:.75rem;border-radius:.3125rem}.user-menu-panel ul li:hover{background-color:var(--bg)}.user-menu-panel ul li a{text-decoration:none;color:var(--text);display:flex;align-items:center;gap:.75rem}.user-menu-panel ul li a.logout-link,.user-menu-panel ul li a.logout-link .material-symbols-outlined{color:#cc8889}.loader{width:1.25rem;aspect-ratio:1;border-radius:50%;border:.15rem solid var(--text);animation:l20-1 .8s infinite linear alternate,l20-2 1.6s infinite linear}@media(max-width:768px){.header-container{padding:.5rem .75rem;gap:.5rem}.search-container{gap:.5rem}.search-container .search-bar{max-width:20rem}.search-container .search-bar .search-result{position:fixed;top:3.5rem;left:0;width:100vw;height:70vh;max-height:100vh;z-index:1003;border-radius:0}.user-menu-panel{top:3rem;min-width:8rem}.header-btn .panel{position:fixed;top:2.8rem;left:0;width:100vw;max-height:100vh;z-index:1003;border-radius:0}}@media(max-width:480px){.header-container{justify-content:space-around}.search-container{width:100%;order:3}.search-container .back-page-btn{display:none}.search-container .search-bar{max-width:none}.menu-bar-btn{order:1}.header-btn{order:4}.user-menu-container{order:5}}*{padding:0;margin:0;font-family:Roboto,sans-serif;color:var(--text);-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}span,img{-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:-moz-none;-o-user-select:none;user-select:none}p{font-size:.875rem}a{color:var(--text);text-decoration:none}body{overflow-x:hidden;overflow-y:hidden;background-color:var(--bg-dark)}.rotate{transform:rotate(180deg)}.sortable-chosen{opacity:.5}.sortable-ghost{border-left:.375rem solid var(--primary)}::-webkit-scrollbar{width:.375rem;margin:.625rem}::-webkit-scrollbar-thumb{background:var(--text-muted);border-radius:.75rem}.material-symbols-outlined{transition:all ease-in-out .2s;font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24}.material-symbols-outlined.filled{font-variation-settings:"FILL" 1,"wght" 400,"GRAD" 0,"opsz" 24}.material-symbols-outlined.clickable:hover{scale:1.1;color:var(--text);cursor:pointer}.material-symbols-outlined.clickable:active{scale:.9;color:var(--text)}.material-symbols-outlined.clickable.active{color:var(--text)}#screen-loader{display:flex;position:fixed;padding:0;margin:0;top:0;left:0;width:100%;height:100%;background-color:var(--bg-dark);z-index:100}#screen-loader .loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border:.125rem solid var(--text);scale:2}.track-info p.description{color:var(--text-muted)}.main-grid-container{display:grid;grid-template-areas:"header header header" "menu main queue" "control control control";gap:.0625rem;height:100vh;height:100svh;grid-template-rows:.5fr 8fr .5fr;grid-template-columns:min-content 1fr min-content;overflow:hidden;background:var(--bg-dark);transition:box-shadow .5s ease-in-out}.warning-bar{display:flex;align-items:center;justify-content:center;gap:.9375rem;background-color:var(--alert-color-red);padding:.5rem 0}.warning-bar p{color:var(--text)}.warning-bar .loader{border:.1875rem solid var(--text)}.main-container{grid-area:main;display:flex;flex-direction:column;overflow:hidden}.main-container .center{display:flex;justify-content:center;align-items:center}.main-container .sections{display:flex;flex-direction:column;gap:1.5rem;scrollbar-gutter:stable;overflow-y:scroll;overflow-x:hidden}.main-container .sections .track-header{display:flex;align-items:flex-end;justify-content:space-between;margin:0 .75rem}.main-container .sections .track-header .small{font-size:.875rem;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.main-container .sections .track-header .small.skeleton{width:6.25rem;height:.9375rem;opacity:.2;border-radius:.5rem;animation:skeleton-loading 1s linear infinite alternate;background-color:var(--loadingStart);animation-delay:.5s}.main-container .sections .track-header .middle{font-size:1rem;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.main-container .sections .track-header .middle.skeleton{width:18.75rem;height:1.125rem;opacity:.2;border-radius:.5rem;animation:skeleton-loading 1s linear infinite alternate;background-color:var(--loadingStart);animation-delay:1.5s}.main-container .sections .track-header .large{font-size:1.875rem;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.main-container .sections .track-header .large.skeleton{width:28.125rem;height:2.1875rem;opacity:.2;border-radius:.5rem;animation:skeleton-loading 1s linear infinite alternate;background-color:var(--loadingStart);animation-delay:1s}.main-container .sections .track-header img{width:10rem;height:10rem;border-radius:.75rem;object-fit:cover}.main-container .sections .track-header .left{display:flex;align-items:flex-end;gap:1.25rem;width:90%}.main-container .sections .track-header .left .track-info{display:flex;flex-direction:column;gap:.625rem;width:100%;overflow:hidden}.main-container .sections .track-header .actions{display:flex;align-items:center;gap:1.25rem}.main-container .sections .track-header .actions .large{font-size:3.4375rem}.main-container .sections .track-header .actions .middle{font-size:1.875rem}.main-container .sections .track-header .image{display:grid;grid-template-columns:5rem 5rem;grid-template-rows:5rem 5rem;overflow:hidden;border-radius:.5rem;min-width:10rem}.main-container .sections .track-header .image img{width:5rem;height:5rem;object-fit:cover;border-radius:0}.main-container .sections .track-header .image.skeleton{width:10rem;height:10rem;opacity:.2;border-radius:.5rem;animation:skeleton-loading 1s linear infinite alternate}.main-container .sections .track-rows{display:flex;flex-direction:column}.main-container .sections .track-row{display:flex;align-items:center;justify-content:space-between;transition:all ease-in-out .2s;padding:.625rem 1.5rem;border-radius:.5rem;cursor:pointer}.main-container .sections .track-row:hover{background-color:var(--bg-light)}.main-container .sections .track-row:hover .right span{opacity:1;pointer-events:auto}.main-container .sections .track-row:active{opacity:.8}.main-container .sections .track-row img{width:3.4375rem;height:3.4375rem;object-fit:cover;border-radius:.3125rem;margin-left:.625rem}.main-container .sections .track-row .left{display:flex;align-items:center;gap:.75rem;width:80%}.main-container .sections .track-row .left .track-info{display:flex;flex-direction:column;overflow:hidden;gap:.625rem}.main-container .sections .track-row .left .track-info p{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.main-container .sections .track-row .right{display:flex;align-items:center;gap:1.125rem}.main-container .sections .track-row .right p{font-size:1rem}.main-container .sections .track-row .right span{opacity:0;pointer-events:none;font-size:1.5625rem}.main-container .sections .footer{padding:1.5rem .75rem}.main-container .sections .footer p.right{color:var(--text-muted);margin-left:auto;margin-right:0}.main-container .sections .footer .columns{display:flex;flex-wrap:wrap;flex-grow:1}.main-container .sections .footer .columns .column{display:flex;flex-direction:column;width:20%;min-width:11.25rem;gap:.5rem;margin-bottom:1.25rem}.main-container .sections .footer .columns .column a{color:var(--text-muted);width:fit-content;padding-bottom:.5rem}.main-container .sections .footer .columns .column a:hover{color:var(--text);text-decoration:underline}.main-container .sections .footer .columns .column .title{color:var(--text);font-weight:700;padding-bottom:.5rem;font-size:1.125rem}.main-container .sections .footer .row{display:flex;flex-wrap:wrap;justify-content:space-between}.main-container .sections .footer .social-icons{display:flex;gap:.75rem;margin-bottom:1.25rem}.main-container .sections .footer .social-icons a{display:flex;justify-content:center;align-items:center;width:2.75rem;height:2.75rem;background-color:var(--bg-light);border-radius:50%;transition:background-color .2s ease-in-out}.main-container .sections .footer .social-icons a:hover{background-color:var(--text-muted)}.main-container .sections .footer .footer-line{height:1px;margin-bottom:1.25rem;background-color:var(--bg-light)}.main-container .section{display:flex;flex-direction:column;margin:.625rem .5rem;gap:.5rem}.main-container .section .header{display:flex;align-items:end;justify-content:space-between}.main-container .section .header .header-icon{display:flex;align-items:center}.main-container .section .header .header-icon img{width:3.4375rem;height:3.4375rem;border-radius:.5rem}.main-container .section .header .sub-title{display:flex;flex-direction:column;align-items:start;gap:.625rem;margin-left:.75rem;white-space:nowrap}.main-container .section .header .sub-title p{color:var(--text-muted)}.main-container .section .header.skeleton .header-icon img{opacity:.2;animation:skeleton-loading 1s linear infinite alternate}.main-container .section .header.skeleton p{border-radius:.3125rem;width:18.75rem;height:.875rem;opacity:.2;animation:skeleton-loading 1s linear infinite alternate;background-color:var(--loadingStart);animation-delay:.8s}.main-container .section .header.skeleton .sub-title h2{border-radius:.3125rem;width:50%;opacity:.2;height:1.875rem;animation:skeleton-loading 1s linear infinite alternate;background-color:var(--loadingStart);animation-delay:.5s}.main-container .section .lyrics-options{display:flex;align-items:center;overflow-y:auto;gap:.875rem;margin-left:.75rem}.main-container .section .lyrics-options::-webkit-scrollbar{display:none}.main-container .section .lyrics-options .option{padding:.625rem .875rem;background-color:var(--bg);border-radius:.3125rem;cursor:pointer;transition:all .2s ease-in-out}.main-container .section .lyrics-options .option:hover,.main-container .section .lyrics-options .option.active{background-color:var(--bg-light)}.main-container .section .options .option:active{opacity:.5}.main-container .section .options.skeleton .option{width:4.5rem;height:2.25rem;counter-increment:my-counter;animation:skeleton-loading 1s linear infinite alternate;background-color:var(--loadingStart);opacity:.2}.main-container .section .options.skeleton .option:nth-child(2){animation-delay:.5s}.main-container .section .options.skeleton .option:nth-child(3){animation-delay:1s}.main-container .section .options.skeleton .option:nth-child(4){animation-delay:1.5s}.main-container .section .lyrics{display:flex;flex-direction:column;gap:.625rem;margin-left:.75rem}.main-container .section .lyrics .line{font-size:1.125rem}.main-container .section .lyrics-options.skeleton .option{height:2.375rem;width:4.75rem;animation:skeleton-loading 1s linear infinite alternate;background-color:var(--loadingStart);opacity:.2}.main-container .section .lyrics.skeleton .line{width:50%;min-width:25rem;height:1.25rem;animation:skeleton-loading 1s linear infinite alternate;background-color:var(--loadingStart);opacity:.2;border-radius:.3125rem}.main-container .section .lyrics.skeleton .line:nth-child(2n){width:35%;min-width:18.75rem}.main-container .section .lyrics.skeleton .line:not(:first-child){animation-delay:.5s}.main-container .card-container{display:grid;gap:.3125rem;grid-template-columns:repeat(auto-fill,minmax(10.625rem,1fr))}.main-container .card-container .card{display:flex;flex-direction:column;width:100%;gap:.625rem;cursor:pointer;padding:.75rem;border-radius:.625rem;transform:translateY(.625rem);transition:all ease-in-out .2s}.main-container .card-container .card:hover{background-color:var(--bg-light)}.main-container .card-container .card:hover span{bottom:10%;opacity:1;color:#fff}.main-container .card-container .card:active{opacity:.8}.main-container .card-container .card .thumbnail{position:relative;width:100%}.main-container .card-container .card .thumbnail:before{content:"";display:block;padding-top:100%}.main-container .card-container .card img{position:absolute;object-fit:cover;top:0;left:0;width:100%;height:100%;border-radius:.625rem}.main-container .card-container .card span{position:absolute;right:7%;bottom:1%;font-size:3.125rem;text-decoration-color:#151125;text-shadow:0 .125rem .5rem gray;opacity:0;transition:all ease-in-out .2s}.main-container .card-container .card span:hover{scale:1.1}.main-container .card-container .card span:active{scale:.9}.main-container .card-container .card .track-info{display:flex;flex-direction:column;gap:.3125rem}.main-container .card-container .card p{font-size:.875rem;width:98%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.main-container .card-container .card.skeleton img{opacity:.2;animation:skeleton-loading 1s linear infinite alternate}.main-container .card-container .card.skeleton .title{border-radius:.3125rem;width:95%;opacity:.2;height:1.125rem;animation:skeleton-loading 1s linear infinite alternate;background-color:var(--loadingStart);animation-delay:.5s}.main-container .card-container .card.skeleton .description{width:65%;height:1rem;border-radius:.3125rem;opacity:.2;animation:skeleton-loading 1s linear infinite alternate;background-color:var(--loadingStart);animation-delay:1s}.error-container{justify-content:center;align-items:center;height:100%;margin:1.5625rem 0}.error-container img{max-width:18.75rem}.error-container .message{display:flex;flex-direction:column;width:50%;align-items:center;text-align:center;gap:1.25rem;margin-block:1.875rem 1.25rem}.error-container .message p{color:var(--text-muted);line-height:1.25rem}.error-container .reload-btn{padding:.875rem 1.125rem;border:.125rem solid var(--bg-light);border-radius:.5rem;cursor:pointer;transition:all ease-in-out .2s}.error-container .reload-btn:hover{background-color:var(--bg-light)}.settings-column{background-color:var(--bg);display:flex;flex-direction:column;border-radius:.5rem}.settings-column .color-select-container{padding:.25rem 1.125rem 1rem;display:flex;gap:1rem}.settings-column .color-select-container .color{width:2.75rem;height:2.75rem;border-radius:.25rem;transition:outline .2s ease-in-out,scale .2s ease-in-out;outline:.125rem solid var(--bg);cursor:pointer}.settings-column .color-select-container .color:hover{outline:.125rem solid var(--text-muted)}.settings-column .color-select-container .color:active{scale:1.05}.settings-column .color-select-container .color.selected{outline:.125rem solid var(--text)}.settings-row{background-color:var(--bg);padding:1rem 1.125rem;border-radius:.5rem;display:flex;align-items:center;justify-content:space-between}.settings-row .info{display:flex;flex-direction:column;gap:.625rem;width:70%}.settings-row .title{color:var(--text)}.settings-row .desc{color:var(--text-muted)}.settings-row input.text-input{outline:none;border:none;background-color:transparent;border-radius:.5rem;border:.125rem solid transparent;background-color:var(--bg-light);font-size:.875rem;padding:.625rem .75rem;width:6.25rem;outline:.0625rem solid var(--bg-light);transition:outline .1s ease-in-out}.settings-row input:hover.text-input{outline:.125rem solid var(--text-muted)}.settings-row input:focus.text-input{outline:.125rem solid var(--active-text)}.settings-row .select-container{width:12.5rem;border-radius:.5rem;background-color:var(--bg-light);font-size:.875rem;padding:.625rem .75rem;position:relative;outline:.125rem solid var(--bg);transition:outline .1s ease-in-out}.settings-row .select-container:hover{outline:.125rem solid var(--text-muted)}.settings-row .select-container .selected-container{display:flex;align-items:center;justify-content:space-between;cursor:pointer}.settings-row .select-container .options{display:none;position:absolute;max-height:9.375rem;width:100%;padding:.1875rem;border-radius:.5rem;left:0;top:3.125rem;background-color:var(--bg-light);overflow-y:auto;z-index:1}.settings-row .select-container .option{font-size:.875rem;padding:.625rem .75rem;transition:all .2s ease-in-out;border-radius:.3125rem;cursor:pointer}.settings-row .select-container .option:hover{background-color:var(--bg)}.settings-row.long-input{gap:1.25rem;flex-direction:column;align-items:start}.settings-row.long-input input.text-input{width:100%;height:2.5rem}.switch{position:relative;display:inline-block;width:3.4375rem;height:1.75rem;margin-left:1rem}.switch input{opacity:0;width:0;height:0}.switch-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:var(--text-muted);-webkit-transition:.4s;transition:.4s;border-radius:2.125rem}.switch-slider:before{position:absolute;content:"";height:1.25rem;width:1.25rem;left:.25rem;bottom:.25rem;background-color:#fff;-webkit-transition:.4s;transition:.4s;border-radius:50%}input:checked+.switch-slider{background-color:var(--active-text)}input:checked+.switch-slider:before{-webkit-transform:translateX(1.6563rem);-ms-transform:translateX(1.6563rem);transform:translate(1.6563rem)}input:focus+.switch-slider{box-shadow:0 0 .0625rem var(--active-text)}.changes-bar{position:sticky;bottom:.625rem;display:flex;align-items:center;justify-content:space-between;padding:.625rem 1rem;margin:0 1.75rem;z-index:1;background-color:var(--bg-light);border-radius:.5rem;box-shadow:#959da533 0 .5rem 1.5rem;opacity:0;transform:translateY(6.25rem);transition:all .6s ease-in-out}.changes-bar .left,.changes-bar .right{display:flex;align-items:center;height:2.5rem;gap:.875rem}.changes-bar span{color:#ae9328;font-size:2rem}.changes-bar p{font-size:.9375rem}.changes-bar .reset{text-decoration:underline;cursor:pointer}.changes-bar .submit{padding:.625rem .875rem;background-color:var(--active-text);cursor:pointer;border-radius:.3125rem;transition:all .2s ease-in-out}.changes-bar .submit:hover{background-color:var(--bg)}.changes-bar .submit:active{opacity:.8}.changes-bar.show{opacity:1;transform:translateY(0)}.server-cards{display:grid;gap:.9375rem;grid-template-columns:repeat(auto-fill,minmax(20rem,1fr));padding:0 .75rem}.server-card{display:flex;flex-direction:column;border-radius:.75rem;overflow:hidden;background-color:var(--bg);cursor:pointer;position:relative;box-shadow:#0000003d 0 .1875rem .5rem}.server-card .action-info{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;background-color:#000000b3;transition:opacity .2s ease-in-out;display:flex;justify-content:center;align-items:center;color:var(--text);gap:.625rem}.server-card .action-info p{color:#fff}.server-card .action-info span{color:#fff;font-size:3rem}.server-card:hover .action-info{opacity:1}.server-card:hover>.banner img{transform:scale(1.2)}.server-card .banner{height:8.125rem;overflow:hidden}.server-card .banner img{height:100%;width:100%;object-fit:cover;transition:all .3s ease-in-out}.server-card .info{display:flex;align-items:center;gap:.9375rem;padding:.9375rem 1.25rem}.server-card .info .server-icon{width:2.8125rem;border-radius:50%}.server-card .info .server-info{display:flex;flex-direction:column;gap:.5rem}.server-card .info .server-info .title{color:var(--text)}.server-card .info .server-info .description{color:var(--text-muted)}.context-menu{position:absolute;width:12.5rem;height:fit-content;display:flex;flex-direction:column;background-color:var(--bg-light);border-radius:.5rem;padding:.25rem;gap:.125rem;z-index:10;opacity:0;pointer-events:none;top:0;left:0}.context-menu .row{position:relative;display:flex;align-items:center;padding:.75rem .875rem;gap:.75rem;border-radius:.3125rem;cursor:pointer}.context-menu .row:hover{background-color:var(--bg)}.context-menu .row:hover .sub-menu{opacity:1;pointer-events:auto}.context-menu .row .btn{display:flex;align-items:center;justify-content:space-between;width:100%}.context-menu .row .btn .left{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.context-menu .row span{font-size:1.125rem}.context-menu .row.blocked{cursor:not-allowed}.context-menu .row.blocked:hover{background-color:transparent}.context-menu .row.alert>p{color:#cc8889}.context-menu .row.alert>span{color:#cc8889}.context-menu .sub-menu{position:absolute;width:fit-content;height:fit-content;right:-12.1875rem;background-color:var(--bg-light);border-radius:.5rem;padding:.25rem;gap:.125rem;box-shadow:0 .3125rem .625rem #000c;pointer-events:none;opacity:0}dialog::backdrop{-webkit-backdrop-filter:blur(.1875rem);backdrop-filter:blur(.1875rem)}.modal-background{position:fixed;display:flex;justify-content:center;align-items:center;top:0;left:0;width:100%;height:100%;z-index:999;animation:fadeInBackground .5s forwards}.modal-background.inactive{animation:fadeOutBackground .5s forwards}.modal-background.inactive .modal-container{animation:scaleDown .5s forwards}.modal-background .modal-container{border:none;outline:none;background-color:var(--bg);border-radius:.75rem;padding:1.5rem;width:31.25rem;height:fit-content;transition:all .2s ease-in-out;box-shadow:#63636333 0 .125rem .5rem;overflow-y:auto;animation:scaleUp .5s forwards}.modal-background .modal-container .header{margin-bottom:1.5625rem}.modal-background .modal-container .header .top{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:1.25rem}.modal-background .modal-container .header .top .icon{display:flex;align-items:center;justify-content:center;padding:.4375rem;border-radius:50%;background-color:var(--primary);color:#fff}.modal-background .modal-container .header .top .icon.red{background-color:#cc888959}.modal-background .modal-container .header .top .icon-background{display:flex;align-items:center;justify-content:center;background-color:var(--active-text);border-radius:50%;padding:.5rem;width:3.375rem;height:3.375rem}.modal-background .modal-container .header .top .icon-background.red{background-color:#cc88896a}.modal-background .modal-container .header .top .close{padding:.625rem;cursor:pointer}.modal-background .modal-container .header .description{color:var(--text-muted);margin-top:.5rem}.modal-background .modal-container .section{display:flex;flex-direction:column;gap:.625rem;margin-bottom:1.5625rem}.modal-background .modal-container .section .title{padding-left:.125rem}.modal-background .modal-container .section .description{padding-left:.125rem;font-size:.75rem}.modal-background .modal-container .section input[type=text]{width:100%;height:2.8125rem;padding:.625rem .9375rem;border:none;outline:.0625rem solid var(--bg);border-radius:.5rem;background-color:transparent;background-color:var(--bg-light);transition:outline .1s ease-in-out;font-size:.875rem}.modal-background .modal-container .section input[type=text]:hover{outline:.125rem solid var(--text-muted)}.modal-background .modal-container .section input[type=text]:focus{outline:.125rem solid var(--active-text)}.modal-background .modal-container .section .select-container{position:relative;width:100%;height:2.8125rem;border-radius:.5rem;padding:.625rem .9375rem;background-color:var(--bg-light);outline:.0625rem solid var(--bg);transition:outline .1s ease-in-out;cursor:pointer}.modal-background .modal-container .section .select-container:hover{outline:.125rem solid var(--text-muted)}.modal-background .modal-container .section .select-container .selected-container{display:flex;align-items:center;justify-content:space-between}.modal-background .modal-container .section .select-container .options{display:none;position:absolute;width:100%;height:fit-content;row-gap:.125rem;padding:.1875rem;left:0;top:3.125rem;background-color:var(--bg-light);border-radius:.5rem}.modal-background .modal-container .section .select-container .options .option{padding:.75rem;border-radius:.5rem;cursor:pointer}.modal-background .modal-container .section .select-container .options .option:hover{background-color:var(--bg)}.modal-background .modal-container .section.error p{color:var(--red)}.modal-background .modal-container .section.error input[type=text]{outline:.125rem solid var(--red)}.modal-background .modal-container .footer{padding-top:.625rem;display:flex;align-items:center;justify-content:space-between}.modal-background .modal-container .footer .btn{display:flex;align-items:center;justify-content:center;width:48%;padding:.625rem 1.125rem;border-radius:.5rem;border:.125rem solid var(--bg-light);cursor:pointer;transition:all .2s ease-in-out}.modal-background .modal-container .footer .btn.submit{border:none;background-color:var(--active-text)}.modal-background .modal-container .footer .btn.submit.red{background-color:var(--red)}.modal-background .modal-container .footer .btn.close{color:#cc8889}.modal-background .modal-container .footer .btn.close:hover{color:#fff;background-color:#cc8889}.modal-background .shortcuts-modal{width:43.75rem;max-height:80vh;overflow-y:auto}.modal-background .shortcuts-modal .shortcuts-content{margin-bottom:1.5625rem}.modal-background .shortcuts-modal .shortcuts-category{margin-bottom:1.875rem}.modal-background .shortcuts-modal .shortcuts-category:last-child{margin-bottom:0}.modal-background .shortcuts-modal .shortcuts-category .category-title{font-size:1.125rem;font-weight:600;color:var(--text);margin-bottom:.9375rem;padding-bottom:.5rem;border-bottom:.0625rem solid var(--bg-light)}.modal-background .shortcuts-modal .shortcuts-category .shortcuts-list{display:flex;flex-direction:column;gap:.75rem}.modal-background .shortcuts-modal .shortcuts-category .shortcut-item{display:flex;align-items:center;justify-content:space-between;padding:.75rem;background-color:var(--bg-light);border-radius:.5rem;transition:background-color .2s ease-in-out}.modal-background .shortcuts-modal .shortcuts-category .shortcut-item:hover{background-color:var(--bg)}.modal-background .shortcuts-modal .shortcuts-category .shortcut-item .shortcut-key{font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.875rem;font-weight:500;color:var(--active-text);background-color:var(--bg);padding:.375rem .75rem;border-radius:.375rem;border:.0625rem solid var(--text-muted);min-width:6.25rem;text-align:center}.modal-background .shortcuts-modal .shortcuts-category .shortcut-item .shortcut-description{font-size:.875rem;color:var(--text);flex:1;margin-left:1rem}.modal-background .shortcuts-modal .footer{justify-content:center}.modal-background .shortcuts-modal .footer .btn{width:auto;min-width:6.25rem}.alert-msg{position:absolute;color:#fff;width:2.8125rem;height:2.8125rem;z-index:10;top:-1.25rem;left:0;right:0;margin:0 auto;overflow:hidden;opacity:0;transform:scale(0);transition:all .6s;border-radius:5rem;background-color:var(--bg-light);box-shadow:#63636333 0 .125rem .5rem;-webkit-backdrop-filter:blur(.625rem);backdrop-filter:blur(.625rem)}.alert-msg a{color:var(--text);text-decoration:underline}.alert-msg .alert-msg--content{opacity:0}.alert-msg .alert-msg--words{font-size:.875rem;opacity:0;transition:all .3s;transition-delay:.5s;white-space:nowrap;display:flex;justify-content:center;align-items:center;margin-left:3.4375rem;height:2.8125rem;color:var(--text)}.alert-msg .alert-msg--icon{display:flex;align-self:center;justify-self:center;height:2.8125rem;width:2.8125rem;object-fit:cover;float:left;border-radius:50%;padding:.25rem}.alert-msg.alert-msg__active{position:absolute;opacity:1;top:-3.4375rem;transform:scale(1)}.alert-msg.alert-msg__extended{width:500px}.alert-msg.alert-msg__extended .alert-msg--content{opacity:1;transition:all .5s}.alert-msg.alert-msg__extended .alert-msg--words{opacity:1}.alert-msg.error{background-color:var(--alert-color-red)}.alert-msg.success{background-color:var(--alert-color-green)}.alert-msg.info{background-color:var(--alert-color-yellow)}.effect-panel{position:absolute;bottom:1.875rem;padding:.9375rem;height:22.0625rem;width:21.875rem;right:0%;background-color:var(--bg-dark);opacity:0;transition:all .3s ease-in-out;border-radius:.5rem;box-shadow:#63636333 0 .125rem .5rem;display:flex;flex-direction:column;gap:.625rem;pointer-events:none;overflow:hidden}.effect-panel::-webkit-scrollbar{display:none}.effect-panel .section{background-color:var(--bg-light);display:flex;align-items:center;justify-content:space-between;padding:.75rem;border-radius:.3125rem}.effect-panel .info p{margin-top:.1875rem;color:var(--text-muted)}.effect-panel .options{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.625rem}.effect-panel .options .option{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.625rem;background-color:var(--bg-light);cursor:pointer;padding:.75rem;border-radius:.3125rem;transition:all .2s ease-in-out}.effect-panel .options .option p{color:var(--text-muted);transition:all .2s ease-in-out}.effect-panel .options .option:hover{background-color:var(--bg)}.effect-panel .options .option:hover span,.effect-panel .options .option:hover p{color:var(--text)}.effect-panel .options .option.active{background-color:var(--active-text)}.effect-panel .options .option.active span,.effect-panel .options .option.active p{color:var(--text)}.effect-panel .control{display:flex;flex-direction:column;gap:.625rem}.effect-panel .control .control-section{position:relative;background-color:var(--bg-light);padding:.75rem;border-radius:.3125rem}.effect-panel .control .control-section p{font-size:1rem;font-weight:700}.effect-panel .control .control-section .position-info{position:absolute;top:.3125rem;padding:.3125rem .625rem;background-color:var(--bg);border-radius:.3125rem;left:-.625rem;opacity:0;transition:opacity .2s ease-in-out}.effect-panel .control .control-section:hover .position-info{opacity:1}.effect-panel .control .control-section .slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;cursor:pointer;outline:none;border-radius:.9375rem;height:.3125rem;transition:all .2s ease-in-out;background:var(--text-muted);margin-top:1.25rem}.effect-panel .control .control-section .slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:.9375rem;width:.9375rem;background-color:var(--active-text);border-radius:50%;border:none;transition:.2s ease-in-out}.effect-panel.active{opacity:1;transform:translateY(-1.25rem);pointer-events:auto;overflow-y:auto;-ms-overflow-style:none;scrollbar-width:none}@keyframes l20-1{0%{clip-path:polygon(50% 50%,0 0,50% 0%,50% 0%,50% 0%,50% 0%,50% 0%)}12.5%{clip-path:polygon(50% 50%,0 0,50% 0%,100% 0%,100% 0%,100% 0%,100% 0%)}25%{clip-path:polygon(50% 50%,0 0,50% 0%,100% 0%,100% 100%,100% 100%,100% 100%)}50%{clip-path:polygon(50% 50%,0 0,50% 0%,100% 0%,100% 100%,50% 100%,0% 100%)}62.5%{clip-path:polygon(50% 50%,100% 0,100% 0%,100% 0%,100% 100%,50% 100%,0% 100%)}75%{clip-path:polygon(50% 50%,100% 100%,100% 100%,100% 100%,100% 100%,50% 100%,0% 100%)}to{clip-path:polygon(50% 50%,50% 100%,50% 100%,50% 100%,50% 100%,50% 100%,0% 100%)}}@keyframes l20-2{0%{transform:scaleY(1) rotate(0)}49.99%{transform:scaleY(1) rotate(135deg)}50%{transform:scaleY(-1) rotate(0)}to{transform:scaleY(-1) rotate(-135deg)}}@keyframes skeleton-loading{0%{background-color:var(--loadingStart)}to{background-color:var(--loadingEnd)}}@keyframes fadeInBackground{0%{background:#0000;-webkit-backdrop-filter:blur(0rem);backdrop-filter:blur(0rem)}to{background:#000000b3;-webkit-backdrop-filter:blur(.375rem);backdrop-filter:blur(.375rem)}}@keyframes fadeOutBackground{0%{background:#000000b3;-webkit-backdrop-filter:blur(.375rem);backdrop-filter:blur(.375rem)}to{background:#0000;-webkit-backdrop-filter:blur(0rem);backdrop-filter:blur(0rem)}}@keyframes scaleUp{0%{transform:scale(.9) translateY(200%);opacity:0}80%{transform:scale(.9) translateY(0);opacity:1}to{transform:scale(1)}}@keyframes scaleDown{0%{transform:scale(1)}35%{transform:scale(.9) translateY(0);opacity:1}to{transform:translateY(200%);opacity:0}}@media(max-width:768px){.alert-msg.alert-msg__extended{width:90vw}}