html{overflow:hidden}body{box-sizing:border-box;margin:0;padding:0;padding-bottom:max(env(safe-area-inset-bottom,0px),var(--safe-bottom, 0px));font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;height:100vh;height:100dvh;display:flex;justify-content:center;align-items:center;color:#fff;background:#1e1e1e;overflow:hidden}.notice{position:absolute;left:0;bottom:0;padding:5px 15px;font-size:14px;color:#ffffff2f;z-index:1000}.bg{position:fixed;inset:0;z-index:-1}.bg-layer{display:flex;perspective:500px;position:absolute;inset:0;background-size:cover;background-position:center;filter:blur(30px);transform:scale(1.15);opacity:0;transition:opacity .8s ease;-webkit-mask-image:radial-gradient(circle at center,rgba(0,0,0,1) 10%,rgba(0,0,0,0) 100%);mask-image:radial-gradient(circle at center,#000 10%,#0000)}.bg-layer.visible{opacity:1}body:before{content:"";position:fixed;inset:0;overflow:hidden;background-image:var(--bg-image, url(../default.jpg));background-size:cover;background-position:center;z-index:-1}body:after{content:"";position:fixed;inset:0;overflow:hidden;background:radial-gradient(circle at center,#fff 5%,#0000 90%);background:radial-gradient(circle at center,#0000 5%,#000 90%);z-index:-1}.loader-overlay{position:fixed;inset:0;z-index:9999;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center}.spinner{width:40px;height:40px;border:3px solid rgba(202,42,214,.15);border-top-color:#ca2ad6;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.unselectable{-webkit-user-select:none;-ms-user-select:none;user-select:none}@font-face{font-family:Globe Trekker Gradient Italic;src:url(../assets/fonts/GlobeTrekkerGradientItalic.otf) format("opentype");font-style:italic;font-weight:400;font-display:swap}@font-face{font-family:Globe Trekker Laser Italic;src:url(../assets/fonts/GlobeTrekkerLaserItalic.otf) format("opentype");font-style:italic;font-weight:400;font-display:swap}@font-face{font-family:Globe Trekker Super Italic;src:url(../assets/fonts/GlobeTrekkerSuperItalic.otf) format("opentype");font-style:italic;font-weight:400;font-display:swap}.custom-font{--font-block: "Globe Trekker Super Italic", system-ui, sans-serif;font-family:var(--font-block);font-style:italic}#player{display:flex;height:40vh;flex-direction:column;justify-content:space-between;align-items:center;gap:2vh}.logo{position:fixed;top:0;width:clamp(300px,min(30vw,90vh),600px);left:50%;transform:translate(-50%)}.cover-scene{perspective:1000px;width:clamp(300px,min(55vh,50vw),600px)}.cover-wrapper{position:relative;width:100%;aspect-ratio:50 / 31;transform-style:preserve-3d;transition:transform .15s cubic-bezier(.2,.8,.2,1);will-change:transform}.cover-wrapper:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at var(--x) var(--y),#f159ff28,transparent 50%);transform:translateZ(-1px);pointer-events:none}.layer-buttons{position:absolute;inset:0;pointer-events:none}.layer-сassette{position:absolute;inset:0;width:100%;height:100%;background-image:url(../cassette.png);background-size:100% 100%;background-position:center}.layer-glass{position:absolute;inset:0;background-image:url(../cassette-glass.png);background-size:100% 100%;background-position:center}.layer-bolts{position:absolute;inset:0;background-image:url(../cassette-bolts.png);background-size:100% 100%;background-position:center}.tape{position:absolute;inset:17% 0 0;width:36%;aspect-ratio:1 / 1;transform:translate(-50%,-50%);transform-origin:center;-webkit-mask-image:radial-gradient(circle at center,black var(--r),transparent calc(var(--r) + 1%));mask-image:radial-gradient(circle at center,black var(--r),transparent calc(var(--r) + 1%))}.t-left{left:11%}.t-right{left:53.5%}.layer-between{transform:translateZ(-9px);opacity:1}.layer-between2{transform:translateZ(-21px);opacity:1}.layer-1{transform:translateZ(-10px);opacity:1}.layer-2{transform:translateZ(-20px);opacity:1}.layer-3{transform:translateZ(-30px);opacity:1}.layer-4{transform:translateZ(-40px);opacity:1}.layer-5{transform:translateZ(-50px);opacity:1}.layer-6{transform:translateZ(-9px);opacity:.3}.layer-7{transform:translateZ(2px);opacity:1}.layer-8{transform:translateZ(-49px);opacity:.1}.layer-9{transform:translateZ(40px);opacity:1}.layer-10{transform:translateZ(50px);opacity:1}.cover-frame{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;filter:drop-shadow(0 0 50px #000000);transform:translateZ(0)}.cover-image{position:absolute;inset:0;width:100%;height:101%;object-fit:cover;-webkit-mask-image:url(../cassette-cover.png);-webkit-mask-size:contain;-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;mask-image:url(../cassette-cover.png);mask-size:contain;mask-repeat:no-repeat;mask-position:center;filter:brightness(1) drop-shadow(0 0 20px #000000)}.track-info{display:flex;flex-direction:column;align-items:center;gap:1vh;width:100%;justify-content:space-evenly;text-align:center;word-wrap:break-word}.track-info #title{color:#fff;font-size:clamp(20px,4vw,32px);position:relative;overflow:hidden;width:100%;min-width:0;white-space:nowrap}.track-info #artist{color:#dadada;font-size:clamp(18px,3.5vw,28px);position:relative;width:100%;min-width:0;white-space:nowrap}.track-measurer{position:absolute;visibility:hidden;pointer-events:none;white-space:nowrap}#title.track-overflow,#artist.track-overflow{white-space:nowrap;text-align:left}.track-overflow .track-text{display:none}.track-marquee-inner{display:block;overflow:hidden;white-space:nowrap}.track-marquee-runner{display:inline-flex;white-space:nowrap;animation:marquee 20s linear infinite}.track-marquee-runner span{white-space:nowrap;padding-right:50px}@keyframes marquee{0%{transform:translate(0)}to{transform:translate(-50%)}}.track-info #progress{color:#adadad;font-size:clamp(18px,3vw,28px)}.live-dot{color:#ca2ad6;margin:0 4px;filter:drop-shadow(0 0 6px #CA2AD6) drop-shadow(0 0 10px #CA2AD6);animation:live-glow 6s ease-in-out .3s infinite}.listener-count{color:#ca2ad6;filter:drop-shadow(0 0 10px #CA2AD6) drop-shadow(0 0 15px #CA2AD6);animation:live-glow 6s ease-in-out .3s infinite}.listener-block{font-size:.7em;margin-left:8px}.listener-label{opacity:.5;vertical-align:middle;color:#adadad}@keyframes live-glow{0%,to{filter:drop-shadow(0 0 6px #CA2AD6) drop-shadow(0 0 10px #CA2AD6)}50%{filter:drop-shadow(0 0 6px #CA2AD6) drop-shadow(0 0 20px #CA2AD6)}}#player .controls{display:flex;gap:20px;justify-content:space-around}.controls button{background:#0000;border:none;padding:0 15px;border-radius:50%;cursor:pointer;color:#fff;font-weight:700;transition:transform .15s ease,background .15s ease;line-height:1.7em;text-shadow:0 -1px -5px rgba(0,0,0,.6),0 1px 1px rgba(255,255,255,.4);-webkit-tap-highlight-color:transparent;touch-action:manipulation}.controls button:focus{outline:none}.controls button:focus:not(:focus-visible){outline:none}@media(hover:hover)and (pointer:fine){.controls button:hover{transform:scale(1.2);filter:drop-shadow(0 0 5px #CA2AD6);transition:transform .15s ease,background .15s ease;outline:none}}.controls button:active{transform:scale(1.2);filter:drop-shadow(0 0 5px #CA2AD6);transition:transform .15s ease,background .15s ease;outline:none}.controls button img{aspect-ratio:1 / 1;height:40px;filter:invert(100%) sepia(100%) grayscale(100%) brightness(200%)}.volume{width:105%;display:flex;align-items:center;justify-content:center;gap:10px}.volume-icon{aspect-ratio:1 / 1;height:20px;filter:invert(100%)}.volume-slider{width:100%;max-width:300px;height:15px;appearance:none;border-radius:10px;border:none;outline:none;cursor:pointer;transition:transform .15s ease,background .15s ease;pointer-events:auto}.volume.muted{opacity:.5}.volume-slider::-webkit-slider-thumb{appearance:none;width:10px;height:14px;background:#ca2ad6;cursor:pointer;transform:scale(0);transition:transform .2s ease,background .15s ease}@media(hover:hover)and (pointer:fine){.volume-slider:hover{transform:scale(1.05);background:#ca2ad6;filter:drop-shadow(0 0 5px #CA2AD6);transition:transform .15s ease,background .15s ease}}@media(hover:hover)and (pointer:fine){.volume-slider::-webkit-slider-thumb:hover{transform:scale(1.2);background:#fff}}.volume-slider.muted::-webkit-slider-thumb{background:#777}@media(orientation:portrait){#player{gap:5vh}.track-info{gap:2vh}}@media(orientation:landscape)and (max-height:600px){.logo{left:8%;transform:none}#player{width:100%;flex-direction:row;justify-content:center}.cover-scene{perspective:1000px;width:clamp(300px,min(100vh,50vw),600px)}.track-info{max-width:400px}}@media(orientation:landscape){.track-info{gap:2vh}}.rating{color:#fff;display:flex;flex-direction:row-reverse;justify-content:flex-end;gap:20px}.rating label{cursor:pointer;font-size:24px;transform:scale(1.5);transition:transform .1s,background .2s}.rating input{display:none}.rating span{color:#fff}.rating label:hover span,.rating label:hover~label span{color:gold;transform:scale(2);filter:drop-shadow(0 0 10px gold)}.rating input:checked~label span,.rating input:checked+span{color:gold}.overlay{position:fixed;inset:0;background:#0009;display:flex;justify-content:center;align-items:center;z-index:9999}.modal{display:flex;background:#1e1e1e;color:#fff;padding:1.8rem;max-width:400px;width:90%;border-radius:12px;box-shadow:0 8px 24px #00000080;text-align:center;flex-direction:column;align-items:stretch;gap:20px}.modal-title{margin:0;font-size:1.2rem;font-weight:700}.modal-message{margin:0;font-size:1rem;word-break:break-word}.modal-details{text-align:left}.modal-details pre{background:#2c2c2c;padding:.5rem;border-radius:6px;overflow:hidden;max-height:0;transition:max-height .5s ease;white-space:pre-wrap;word-break:break-word}.modal-close{background:#ff285e;color:#fff;border:none;padding:.5rem 1rem;border-radius:6px;cursor:pointer;font-size:1rem;transition:background .2s}.modal-close:hover{background:#ff0095;transition:background .2s}.dropdown{text-align:left}.dropdown-summary{background:none;border:none;color:#fff;font-weight:700;cursor:pointer;padding:0;margin-bottom:8px;display:flex;align-items:center;gap:6px;transition:color .2s ease}.dropdown-summary:hover{color:#ff0095;transition:color .2s ease}.arrow{display:inline-block;transition:transform .3s ease;transform-origin:center}.arrow.open{transform:rotate(90deg)}.dropdown-content{overflow:hidden;transition:max-height .3s ease}.dropdown-content pre{background:#2c2c2c;padding:.5rem;border-radius:6px;margin:0;word-break:break-word}.burger-menu{position:fixed;top:20px;left:20px;z-index:200}.burger-btn{display:flex;flex-direction:column;justify-content:center;gap:5px;width:36px;height:36px;background:transparent;border:none;cursor:pointer;padding:4px;z-index:201;position:relative}.burger-btn span{display:block;width:100%;height:2px;background:#fff;border-radius:2px;transition:transform .25s ease,opacity .25s ease,background .15s ease;transform-origin:center;box-shadow:0 0 3px #ca2ad64d}.burger-btn:hover span{filter:drop-shadow(0 0 4px #CA2AD6)}.burger-btn:active span{transform:scale(.95)}.burger-btn.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}.burger-btn.open span:nth-child(2){opacity:0}.burger-btn.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}.menu-panel{position:fixed;top:0;left:0;width:320px;height:100vh;height:100dvh;box-sizing:border-box;background:linear-gradient(180deg,#1e1e1ef7,#0f0f0ffc);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-right:1px solid rgba(202,42,214,.15);padding:80px 30px 10px;box-shadow:10px 0 40px #00000080;z-index:150;overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:rgba(202,42,214,.3) transparent}.menu-panel::-webkit-scrollbar{width:4px}.menu-panel::-webkit-scrollbar-track{background:transparent}.menu-panel::-webkit-scrollbar-thumb{background:#ca2ad64d;border-radius:2px;min-height:40px}.menu-panel::-webkit-scrollbar-thumb:hover{background:#ca2ad680}.menu-panel ul{list-style:none;margin:0;padding:0}.menu-panel li{margin-bottom:12px}.menu-panel a{display:flex;align-items:center;padding:12px 16px;color:#dadada;text-decoration:none;font-size:18px;border-radius:8px;transition:background .2s ease,color .2s ease}.menu-panel a:hover{background:#ca2ad61a;color:#ca2ad6}.menu-panel a:active{background:#ca2ad633}.menu-panel a.disabled{opacity:.35;cursor:not-allowed;pointer-events:none}.menu-panel a.disabled:hover{background:transparent;color:#dadada}.reset-btn{color:#ff6b6b!important}.reset-btn:hover{color:#f44!important;background:#ff6b6b1a!important}.badge{display:inline-block;font-size:10px;font-weight:700;padding:5px 10px;border-radius:4px;background:#ca2ad640;color:#ca2ad6;vertical-align:middle;margin-left:10px;letter-spacing:.5px;text-transform:uppercase}.menu-panel li.soon{margin-bottom:12px}.page{display:flex;flex-direction:column;height:calc(100vh - 90px);height:calc(100dvh - 90px);min-height:0}.page-content{flex:1;min-height:0;max-height:100%;overflow-y:auto;scrollbar-gutter:stable;margin:0 -30px;padding:0 30px}.page-content::-webkit-scrollbar{width:4px}.page-content::-webkit-scrollbar-track{background:transparent}.page-content::-webkit-scrollbar-thumb{background:#ca2ad64d;border-radius:2px;min-height:40px}.page-content::-webkit-scrollbar-thumb:hover{background:#ca2ad680}.back-btn{align-self:flex-start;background:transparent;border:none;color:#ca2ad6;font-size:15px;cursor:pointer;padding:6px 0;margin-bottom:24px;transition:filter .2s ease}.back-btn:hover{filter:drop-shadow(0 0 4px #CA2AD6)}.page-content h3{margin:0 0 16px;font-size:20px;color:#fff}.settings-group{margin-bottom:16px}.settings-label{display:block;margin-bottom:8px;font-size:14px;color:#b0b0b0}.app-select{position:relative}.app-select-trigger{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:42px;padding:10px 14px;font-size:15px;color:#dadada;background:#ffffff0d;border:1px solid rgba(202,42,214,.15);border-radius:8px;cursor:pointer;outline:none;transition:border-color .2s ease,background .2s ease,border-radius .2s ease;font-family:inherit;text-align:left}.app-select-trigger:hover{background:#ffffff14;border-color:#ca2ad659}.app-select-trigger.open{border-color:#ca2ad6;background:#ca2ad614;border-radius:8px 8px 0 0}.app-select-arrow{display:block;width:12px;height:8px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='%23dadada'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E") no-repeat center;transition:transform .2s ease}.app-select-trigger.open .app-select-arrow{transform:rotate(180deg)}.app-select-options{position:absolute;top:100%;left:0;right:0;margin:0;padding:0;list-style:none;background:#1e1e1e;border:1px solid rgba(202,42,214,.15);border-top:none;border-radius:0 0 8px 8px;z-index:10;overflow:hidden}.app-select-options .app-select-option{padding:10px 14px;margin:0;font-size:15px;color:#dadada;cursor:pointer;transition:background .15s ease,color .15s ease}.app-select-options .app-select-option:hover{background:#ca2ad61a;color:#ca2ad6}.app-select-options .app-select-option.selected{background:#ca2ad626;color:#ca2ad6}.app-select-options .app-select-option.disabled{opacity:.4;cursor:default;pointer-events:none}.app-select-badge{display:inline-block;margin-left:8px;padding:1px 6px;font-size:10px;font-weight:600;color:#ca2ad6;background:#ca2ad626;border-radius:4px;vertical-align:middle}.toggle-switch{width:100%}.toggle-track{position:relative;display:flex;background:#ffffff0d;border:1px solid rgba(202,42,214,.15);border-radius:8px;overflow:hidden;cursor:pointer}.toggle-slider{position:absolute;top:0;left:0;height:100%;background:#ca2ad633;border-radius:7px;transition:transform .3s cubic-bezier(.4,0,.2,1);pointer-events:none}.toggle-option{position:relative;flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:10px 14px;font-size:15px;color:#dadada;z-index:1;transition:color .2s ease;-webkit-user-select:none;user-select:none}.toggle-option.active{color:#ca2ad6}.toggle-option.disabled{opacity:.4;cursor:default;pointer-events:none}.toggle-option:not(.disabled):hover{color:#ca2ad6}.toggle-badge{display:inline-flex;align-items:center;vertical-align:middle;padding:1px 6px;font-size:10px;font-weight:600;color:#ca2ad6;background:#ca2ad626;border-radius:4px}.drop-enter-active,.drop-leave-active{transition:opacity .15s ease,transform .15s ease}.drop-enter-from,.drop-leave-to{opacity:0;transform:translateY(-4px)}.page-content ul.links a.with-icon{display:flex;align-items:center;gap:10px}.page-content ul.links a.with-icon img{height:22px;width:auto}.donation_label{margin:0 0 16px;font-size:20px;color:#ffee52}.page-content h4{margin:0 0 16px;font-size:16px;color:#ffffff71}.page-content p{margin:0 0 12px;color:#b0b0b0;font-size:14px;line-height:1.6}.page-content .version{font-size:12px;color:#666;margin-top:20px}.page-content ul.links{list-style:none;padding:0;margin:0}.page-content ul.links li{margin-bottom:10px}.page-content ul.links a{display:block;padding:10px 14px;color:#dadada;text-decoration:none;font-size:15px;border-radius:8px;border:1px solid rgba(202,42,214,.15);transition:background .2s ease,border-color .2s ease,color .2s ease}.page-content ul.links a:hover{background:#ca2ad614;border-color:#ca2ad659;color:#ca2ad6}.page-content .changelog-entry{margin-bottom:24px}.page-content .changelog-entry .version{margin:0 0 8px;color:#888}.page-content ul.changelog-list{list-style:none;padding:0;margin:0}.page-content ul.changelog-list li{position:relative;padding-left:14px;margin-bottom:6px;color:#b0b0b0;font-size:13px;line-height:1.5}.page-content ul.changelog-list li:before{content:"•";position:absolute;left:0;color:#ca2ad6}.slide-enter-active,.slide-leave-active{transition:transform .3s cubic-bezier(.4,0,.2,1)}.slide-enter-from,.slide-leave-to{transform:translate(-100%)}.slide-enter-to,.slide-leave-from{transform:translate(0)}.fade-enter-active,.fade-leave-active{transition:opacity .2s ease,transform .2s ease}.fade-enter-from{opacity:0;transform:translateY(8px)}.fade-leave-to{opacity:0;transform:translateY(-8px)}.fade-enter-to,.fade-leave-from{opacity:1;transform:translateY(0)}.slide-enter-active:before,.slide-leave-active:before{content:"";position:fixed;inset:0;background:#0006;z-index:-1;animation:fadeIn .3s ease forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media(max-width:480px){.menu-panel{width:85vw;padding:70px 16px 10px}.page{height:calc(100vh - 80px);height:calc(100dvh - 80px)}.page-content{margin:0 -16px;padding:0 16px}.burger-btn{width:32px;height:32px;gap:4px}}.tag-empty{color:#888;text-align:center;padding:40px 0;font-size:14px}.tag-divider{height:1px;background:#ffffff1a;margin:8px 0 16px}.tag-list{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:24px}.tag-btn{padding:10px 18px;min-height:44px;border:none;border-radius:0;background:transparent;color:#888;font-size:18px;cursor:pointer;text-align:left;filter:none;transition:color .2s ease,filter .3s ease;font-family:var(--font-block),system-ui,sans-serif}.tag-btn:hover{color:#aaa}.tag-btn.active{color:var(--tag-color, #CA2AD6);filter:drop-shadow(0 0 10px var(--tag-color, #CA2AD6)) drop-shadow(0 0 15px var(--tag-color, #CA2AD6));animation:glow-pulse 6s ease-in-out .3s infinite}@keyframes glow-pulse{0%,to{filter:drop-shadow(0 0 10px var(--tag-color, #CA2AD6)) drop-shadow(0 0 15px var(--tag-color, #CA2AD6))}50%{filter:drop-shadow(0 0 10px var(--tag-color, #CA2AD6)) drop-shadow(0 0 30px var(--tag-color, #CA2AD6))}}.tag-count{font-size:.65em;opacity:.5;margin-left:6px;vertical-align:middle}.confirm-btn{display:flex;align-items:center;justify-content:center;width:100%;padding:12px 16px;min-height:44px;border:none;border-radius:8px;background:#ca2ad61a;color:#ca2ad6;font-size:18px;cursor:pointer;font-family:var(--font-block),system-ui,sans-serif;transition:background .2s ease,color .2s ease}.confirm-btn:hover{background:#ca2ad633}.confirm-btn:disabled,.disabled-btn{color:#444!important;cursor:not-allowed!important;pointer-events:none}.tag-actions{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}.reset-tags-btn{display:flex;align-items:center;justify-content:center;width:100%;padding:12px 16px;min-height:44px;border:none;border-radius:8px;background:#ff6b6b1a;color:#ff6b6b;font-size:18px;cursor:pointer;font-family:var(--font-block),system-ui,sans-serif;transition:background .2s ease,color .2s ease}.reset-tags-btn:hover{background:#ff6b6b33}.fade-slide-enter-active,.fade-slide-leave-active{transition:opacity .25s ease,transform .25s ease}.fade-slide-enter-from,.fade-slide-leave-to{opacity:0;transform:translateY(-8px)}