@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap";@layer reset{*,:before,:after{box-sizing:border-box;margin:0;padding:0}button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit;background:0 0;border:none}button{cursor:pointer}input[type=range]{appearance:none;background:0 0}input[type=range]:focus{outline:none}}@layer base{:root{--color-bg-dark:#07070a;--color-text-primary:#fff;--color-text-secondary:#fff9;--color-text-muted:#ffffff59;--accent-color:#a855f7;--accent-color-rgb:168, 85, 247;--accent-glow:#a855f766;--glass-bg:#0f0f198c;--glass-border:#ffffff0f;--glass-highlight:#ffffff08;--font-sans:"Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--sidebar-width:260px;--player-bar-height:90px;--theme-color-1:#6b21a8;--theme-color-2:#1e1b4b;--theme-color-3:#581c87;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}body{background-color:var(--color-bg-dark);font-family:var(--font-sans);color:var(--color-text-primary);-webkit-font-smoothing:antialiased;height:100svh;line-height:1.5;overflow:hidden}}@layer theme{.ambient-glow{z-index:-1;pointer-events:none;background:radial-gradient(circle at 50% 50%, var(--color-bg-dark) 30%, #000 100%);width:100%;height:100%;position:absolute;top:0;left:0;overflow:hidden}.ambient-glow:after{content:"";pointer-events:none;z-index:1;background-image:linear-gradient(#ffffff02 1px,#0000 1px),linear-gradient(90deg,#ffffff02 1px,#0000 1px);background-size:50px 50px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(circle,#000 20%,#0000 80%);mask-image:radial-gradient(circle,#000 20%,#0000 80%)}.glow-orb{filter:blur(140px);opacity:.45;mix-blend-mode:screen;will-change:transform, background;border-radius:50%;transition:background 1.5s ease-in-out,transform 10s ease-in-out;position:absolute}.orb-1{background:radial-gradient(circle, var(--theme-color-1) 0%, transparent 80%);width:60vw;height:60vw;animation:25s ease-in-out infinite alternate floatOrb1;top:-10%;left:10%}.orb-2{background:radial-gradient(circle, var(--theme-color-2) 0%, transparent 80%);width:50vw;height:50vw;animation:30s ease-in-out infinite alternate floatOrb2;bottom:-15%;right:5%}.orb-3{background:radial-gradient(circle, var(--theme-color-3) 0%, transparent 80%);width:45vw;height:45vw;animation:20s ease-in-out infinite alternate floatOrb3;top:30%;right:25%}@keyframes floatOrb1{0%{transform:translate(0)scale(1)}to{transform:translate(8%,10%)scale(1.15)}}@keyframes floatOrb2{0%{transform:translate(0)scale(1.1)}to{transform:translate(-10%,-8%)scale(.9)}}@keyframes floatOrb3{0%{transform:translate(0)scale(.9)}to{transform:translate(12%,-12%)scale(1.2)}}}@layer layout{.glass-container{grid-template-columns:var(--sidebar-width) 1fr;grid-template-rows:1fr var(--player-bar-height);background:var(--glass-bg);-webkit-backdrop-filter:blur(25px)saturate(180%);backdrop-filter:blur(25px)saturate(180%);border:1px solid var(--glass-border);width:100vw;height:100svh;display:grid;overflow:hidden}.sidebar{border-right:1px solid var(--glass-border);z-index:10;background:#0a0a0f59;flex-direction:column;grid-area:1/1;gap:32px;padding:24px 16px;display:flex}.brand{align-items:center;gap:12px;padding-left:8px;display:flex}.brand-logo{background:linear-gradient(135deg, var(--accent-color) 0%, #7c3aed 100%);width:40px;height:40px;box-shadow:0 4px 15px var(--accent-glow);color:#fff;border-radius:12px;justify-content:center;align-items:center;display:flex}.brand-name{letter-spacing:-.5px;background:linear-gradient(90deg,#fff 40%,#ffffffb3);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:20px;font-weight:700}.nav-menu{flex-direction:column;gap:6px;display:flex}.nav-item{color:var(--color-text-secondary);text-align:left;border-radius:12px;align-items:center;gap:16px;padding:12px 16px;font-weight:500;transition:all .25s cubic-bezier(.4,0,.2,1);display:flex}.nav-item:hover{color:var(--color-text-primary);background:var(--glass-highlight)}.nav-item.active{color:#fff;background:linear-gradient(90deg, rgba(var(--accent-color-rgb), .15) 0%, transparent 100%);box-shadow:inset 3px 0 0 var(--accent-color);padding-left:13px}.sidebar-peek{background:#ffffff08;border:1px solid #ffffff0a;border-radius:16px;align-items:center;gap:12px;margin-top:auto;padding:12px;display:flex}.peek-cover,.peek-cover-placeholder{object-fit:cover;border-radius:8px;width:48px;height:48px}.peek-cover-placeholder{color:var(--color-text-muted);background:#ffffff0f;justify-content:center;align-items:center;display:flex}.peek-info{flex-grow:1;overflow:hidden}.peek-title{white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:600;overflow:hidden}.peek-artist{color:var(--color-text-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.viewport{scrollbar-color:#ffffff1f #0000;scrollbar-width:thin;flex-direction:column;grid-area:1/2;gap:32px;padding:32px 40px;display:flex;position:relative;overflow-y:auto}.view{flex-direction:column;gap:24px;min-height:100%;animation:.4s fadeIn;display:none}.view.active{display:flex}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.view-header{justify-content:space-between;align-items:flex-end;display:flex}.view-header h1{letter-spacing:-.8px;margin-top:4px;font-size:32px;font-weight:700}.badge{background:rgba(var(--accent-color-rgb), .15);border:1px solid rgba(var(--accent-color-rgb), .3);color:#dfc8ff;letter-spacing:.5px;text-transform:uppercase;border-radius:99px;padding:4px 10px;font-size:12px;font-weight:600;display:inline-block}.player-bar{border-top:1px solid var(--glass-border);-webkit-backdrop-filter:blur(35px);backdrop-filter:blur(35px);z-index:20;background:#0a0a0fa6;grid-area:2/1/auto/-1;grid-template-columns:280px 1fr 280px;align-items:center;padding:0 24px;display:grid}}@layer components{.btn{border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-size:14px;font-weight:600;transition:all .2s;display:inline-flex}.btn-primary{background:var(--accent-color);color:#fff;box-shadow:0 4px 15px rgba(var(--accent-color-rgb), .35)}.btn-primary:hover{box-shadow:0 6px 18px rgba(var(--accent-color-rgb), .45);background:#b86bfc;transform:translateY(-1px)}.btn-primary:active{transform:translateY(1px)}.btn-secondary{color:var(--color-text-primary);background:#ffffff0f;border:1px solid #ffffff14}.btn-secondary:hover{background:#ffffff1f}.btn-text{color:var(--color-text-secondary);padding:6px 12px}.btn-text:hover{color:#fff;background:#ffffff0d}.btn-toggle{color:var(--color-text-secondary);background:#ffffff0a;border:1px solid #ffffff0d;border-radius:10px;padding:8px 14px;font-size:13px}.btn-toggle.active{background:var(--accent-color);color:#fff;box-shadow:0 4px 12px rgba(var(--accent-color-rgb), .3);border-color:#0000}.search-bar-container{width:100%;position:relative}.search-icon{color:var(--color-text-muted);pointer-events:none;width:18px;height:18px;position:absolute;top:50%;left:16px;transform:translateY(-50%)}.search-input{background:#ffffff0a;border:1px solid #ffffff0f;border-radius:16px;width:100%;padding:14px 16px 14px 48px;font-size:15px;transition:all .3s}.search-input:focus{border-color:rgba(var(--accent-color-rgb), .5);box-shadow:0 0 0 3px rgba(var(--accent-color-rgb), .15);background:#ffffff12;outline:none}.local-dropzone{text-align:center;background:#ffffff03;border:2px dashed #ffffff1f;border-radius:24px;flex-direction:column;flex-grow:1;justify-content:center;align-items:center;gap:16px;padding:64px 40px;transition:border-color .3s,background .3s;display:flex}.local-dropzone:hover{border-color:var(--accent-color);background:rgba(var(--accent-color-rgb), .02)}.dropzone-icon{width:64px;height:64px;color:var(--accent-color);opacity:.8}.local-dropzone h3{font-size:20px;font-weight:600}.local-dropzone p{color:var(--color-text-secondary);max-width:480px;margin-bottom:8px;font-size:14px;line-height:1.6}.section-title{letter-spacing:-.2px;font-size:18px;font-weight:600}.tracks-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:20px;display:grid}.loading-state,.empty-state{color:var(--color-text-secondary);flex-direction:column;grid-column:1/-1;justify-content:center;align-items:center;gap:16px;padding:60px 0;display:flex}.spinner{border:3px solid #ffffff1a;border-top-color:var(--accent-color);border-radius:50%;width:32px;height:32px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.music-card{background:#ffffff05;border:1px solid #ffffff0a;border-radius:18px;flex-direction:column;gap:12px;padding:14px;transition:all .3s cubic-bezier(.25,.8,.25,1);display:flex;position:relative;overflow:hidden}.music-card:hover{background:#ffffff0f;border-color:#ffffff1a;transform:translateY(-4px);box-shadow:0 8px 24px #0000004d}.card-art-container{aspect-ratio:1;background:#ffffff0d;border-radius:12px;justify-content:center;align-items:center;width:100%;display:flex;position:relative;overflow:hidden}.card-art{object-fit:cover;width:100%;height:100%}.card-art-placeholder{color:var(--color-text-muted)}.card-btn-play{background:var(--accent-color);color:#fff;width:44px;height:44px;box-shadow:0 4px 12px rgba(var(--accent-color-rgb), .4);opacity:0;border-radius:50%;justify-content:center;align-items:center;transition:all .25s cubic-bezier(.4,0,.2,1);display:flex;position:absolute;bottom:12px;right:12px;transform:translateY(8px)}.music-card:hover .card-btn-play{opacity:1;transform:translateY(0)}.card-btn-play:hover{background:#b86bfc;scale:1.05}.card-title{white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:600;overflow:hidden}.card-artist{color:var(--color-text-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.card-badge{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#dfc8ff;letter-spacing:.5px;background:#0009;border-radius:4px;padding:2px 6px;font-size:10px;font-weight:600;position:absolute;top:10px;left:10px}.local-content-wrapper{flex-direction:column;gap:16px;display:flex}.local-stats{color:var(--color-text-secondary);justify-content:space-between;align-items:center;font-size:13px;display:flex}.tracks-list-container{background:#ffffff05;border:1px solid #ffffff0a;border-radius:18px;overflow:hidden}.tracks-table{border-collapse:collapse;text-align:left;width:100%;font-size:14px}.tracks-table th{color:var(--color-text-secondary);background:#ffffff03;border-bottom:1px solid #ffffff0f;padding:14px 20px;font-weight:500}.tracks-table td{color:var(--color-text-primary);vertical-align:middle;border-bottom:1px solid #ffffff08;padding:12px 20px}.tracks-table tbody tr{cursor:pointer;transition:background .2s}.tracks-table tbody tr:hover{background:#ffffff0a}.tracks-table tbody tr.active-track{background:rgba(var(--accent-color-rgb), .08);color:var(--accent-color)}.tracks-table tbody tr.active-track td{color:#e9d5ff}.track-row-title-container{align-items:center;gap:12px;display:flex}.track-row-art{object-fit:cover;border-radius:6px;width:36px;height:36px}.track-row-art-placeholder{width:36px;height:36px;color:var(--color-text-muted);background:#ffffff0d;border-radius:6px;justify-content:center;align-items:center;display:flex}.track-row-text{overflow:hidden}.track-row-title{white-space:nowrap;text-overflow:ellipsis;font-weight:600;overflow:hidden}.track-row-artist{color:var(--color-text-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.tracks-table tr.active-track .track-row-artist{color:#c084fc}.track-row-format{color:var(--color-text-secondary);background:#ffffff0f;border-radius:4px;padding:2px 6px;font-size:11px;font-weight:600;display:inline-block}.nowplaying-container{grid-template-columns:1fr 300px;gap:40px;height:100%;min-height:480px;display:grid;position:relative}.visualizer-container{z-index:0;pointer-events:none;border-radius:24px;width:100%;height:100%;position:absolute;top:0;left:0;overflow:hidden}#visualizer-canvas{mix-blend-mode:screen;width:100%;height:100%;display:block}.nowplaying-main{z-index:1;flex-direction:column;justify-content:center;align-items:center;gap:32px;padding:20px 0;display:flex}.art-card-container{justify-content:center;align-items:center;width:280px;height:280px;display:flex;position:relative}.art-card{width:260px;height:260px;box-shadow:0 16px 40px #00000080, 0 0 80px rgba(var(--accent-color-rgb), .2);background:#ffffff0a;border:1px solid #ffffff1a;border-radius:24px;justify-content:center;align-items:center;transition:transform .5s cubic-bezier(.25,.8,.25,1),box-shadow .8s;display:flex;overflow:hidden}.art-card:hover{transform:scale(1.03)rotate(1deg)}.art-card img{object-fit:cover;width:100%;height:100%}.art-placeholder{color:var(--color-text-muted)}.art-placeholder svg{width:80px;height:80px}.nowplaying-info{text-align:center;flex-direction:column;align-items:center;gap:8px;max-width:450px;display:flex}.nowplaying-info h2{letter-spacing:-.5px;font-size:26px;font-weight:700;line-height:1.2}.nowplaying-info p{color:var(--color-text-secondary);font-size:16px}.audio-specs{background:#ffffff0d;border:1px solid #ffffff14;border-radius:99px;align-items:center;gap:8px;margin-top:6px;padding:4px 10px;font-size:11px;display:inline-flex}.spec-badge{color:#dfc8ff;letter-spacing:.5px;font-weight:700}.spec-detail{color:var(--color-text-secondary)}.nowplaying-sidebar{z-index:1;flex-direction:column;justify-content:center;gap:20px;display:flex}.panel{border-radius:20px;flex-direction:column;gap:16px;padding:20px;display:flex}.glass-panel{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#0a0a1273;border:1px solid #ffffff0a;transition:border-color .4s,box-shadow .4s;box-shadow:0 8px 32px #0000004d}.glass-panel:hover{border-color:rgba(var(--accent-color-rgb), .18);box-shadow:0 8px 32px #0000004d, 0 0 20px rgba(var(--accent-color-rgb), .08)}.panel h3{text-transform:uppercase;letter-spacing:.8px;color:var(--color-text-secondary);font-size:14px;font-weight:600}.eq-sliders{flex-direction:column;gap:12px;display:flex}.eq-slider-group{flex-direction:column;gap:6px;display:flex}.eq-slider-group label{color:var(--color-text-secondary);justify-content:space-between;font-size:12px;font-weight:500;display:flex}.eq-slider{background:#ffffff1a;border-radius:99px;width:100%;height:4px}.eq-slider::-webkit-slider-runnable-track{border-radius:99px;height:4px}.eq-slider::-webkit-slider-thumb{appearance:none;cursor:pointer;background:#fff;border-radius:50%;width:12px;height:12px;margin-top:-4px;transition:scale .15s;box-shadow:0 0 6px #00000080}.eq-slider::-webkit-slider-thumb:hover{scale:1.25}.style-picker{grid-template-columns:1fr;gap:8px;display:grid}.settings-list{flex-direction:column;gap:20px;display:flex}.settings-card{padding:24px}.settings-card h3{margin-bottom:16px}.settings-row{border-bottom:1px solid #ffffff08;justify-content:space-between;align-items:center;gap:24px;padding:16px 0;display:flex}.settings-row:last-child{border-bottom:none;padding-bottom:0}.settings-info{flex-grow:1}.settings-label{margin-bottom:4px;font-size:15px;font-weight:600}.settings-desc{color:var(--color-text-secondary);font-size:13px;line-height:1.4}.settings-input{text-align:right;background:#ffffff0d;border:1px solid #ffffff14;border-radius:8px;width:240px;padding:8px 12px;font-size:14px}.settings-input:focus{border-color:var(--accent-color);outline:none}.toggle-switch{width:46px;height:24px;display:inline-block;position:relative}.toggle-switch input{opacity:0;width:0;height:0}.toggle-switch label{cursor:pointer;background-color:#ffffff1a;border-radius:99px;transition:all .3s;position:absolute;inset:0}.toggle-switch label:before{content:"";background-color:#fff;border-radius:50%;width:18px;height:18px;transition:all .3s;position:absolute;bottom:3px;left:3px}.toggle-switch input:checked+label{background-color:var(--accent-color)}.toggle-switch input:checked+label:before{transform:translate(22px)}.bar-track-info{align-items:center;gap:12px;display:flex;overflow:hidden}.bar-art-container{background:#ffffff0a;border:1px solid #ffffff0d;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:56px;height:56px;display:flex;overflow:hidden}.bar-cover{object-fit:cover;width:100%;height:100%}.bar-cover-placeholder{color:var(--color-text-muted)}.bar-text{overflow:hidden}.bar-title{white-space:nowrap;text-overflow:ellipsis;color:#fff;font-size:14px;font-weight:600;overflow:hidden}.bar-artist{color:var(--color-text-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.bar-controls-container{flex-direction:column;justify-self:center;align-items:center;gap:8px;width:100%;max-width:580px;display:flex}.control-buttons{align-items:center;gap:20px;display:flex}.btn-icon{width:32px;height:32px;color:var(--color-text-secondary);border-radius:50%;justify-content:center;align-items:center;transition:all .2s;display:flex}.btn-icon:hover{color:#fff;background:#ffffff0d}.btn-icon svg{width:18px;height:18px}.btn-icon.active{color:var(--accent-color)}.btn-play-pause{background:linear-gradient(135deg, var(--accent-color) 0%, #7c3aed 100%);color:#fff;width:60px;height:60px;box-shadow:0 8px 25px rgba(var(--accent-color-rgb), .5);border:4px solid #0d0d14;border-radius:50%;transition:transform .25s cubic-bezier(.34,1.56,.64,1),scale .25s,box-shadow .25s;transform:translateY(-16px)}.btn-play-pause:hover{box-shadow:0 12px 30px rgba(var(--accent-color-rgb), .7);transform:translateY(-19px)scale(1.06)}.btn-play-pause:active{transform:translateY(-14px)scale(.96)}.btn-play-pause svg{fill:currentColor;width:20px;height:20px}.timeline-container{align-items:center;gap:12px;width:100%;display:flex}.time{color:var(--color-text-secondary);width:36px;font-size:11px;font-weight:500}#time-current{text-align:right}#time-total{text-align:left}.slider-wrapper{cursor:pointer;flex-grow:1;align-items:center;height:20px;display:flex;position:relative}.timeline-slider,.volume-slider{z-index:2;cursor:pointer;background:#ffffff1a;border-radius:2px;width:100%;height:4px}.slider-progress{background:linear-gradient(90deg, var(--accent-color) 0%, #f472b6 100%);z-index:1;pointer-events:none;border-radius:2px 0 0 2px;height:4px;position:absolute;top:50%;left:0;transform:translateY(-50%)}.timeline-slider::-webkit-slider-thumb{appearance:none;cursor:pointer;opacity:0;background:#fff;border-radius:50%;width:12px;height:12px;transition:opacity .15s,scale .15s;box-shadow:0 0 4px #00000080}.volume-slider::-webkit-slider-thumb{appearance:none;cursor:pointer;opacity:0;background:#fff;border-radius:50%;width:12px;height:12px;transition:opacity .15s,scale .15s;box-shadow:0 0 4px #00000080}.slider-wrapper:hover .timeline-slider::-webkit-slider-thumb{opacity:1}.slider-wrapper:hover .volume-slider::-webkit-slider-thumb{opacity:1}.slider-wrapper:hover .timeline-slider,.slider-wrapper:hover .slider-progress{height:6px}.bar-actions-container{justify-self:end;align-items:center;gap:16px;display:flex}.volume-container{align-items:center;gap:8px;width:130px;display:flex}.volume-slider-wrapper{width:80px}.bar-quality-badge{color:#dfc8ff;letter-spacing:.5px;text-transform:uppercase;background:#ffffff14;border:1px solid #ffffff26;border-radius:4px;padding:2px 8px;font-size:10px;font-weight:700}}@layer utilities{.hidden{display:none!important}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ffffff1f;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#fff3}}@media (width<=900px){.glass-container{grid-template-columns:1fr;grid-template-rows:1fr auto var(--player-bar-height)}.sidebar{border-right:none;border-bottom:1px solid var(--glass-border);flex-direction:row;grid-area:1/1;justify-content:space-between;align-items:center;height:60px;padding:12px 20px}.sidebar-peek{display:none}.nav-menu{flex-direction:row;gap:4px}.nav-item span{display:none}.nav-item{border-radius:10px;padding:10px}.nav-item.active{border-left:none;border-bottom:2px solid var(--accent-color);padding-bottom:8px;padding-left:10px}.viewport{height:calc(100vh - 60px - var(--player-bar-height));grid-area:2/1;padding:20px}.player-bar{grid-template-columns:1fr 1.5fr;padding:0 16px}.bar-track-info{max-width:180px}.bar-actions-container{display:none}.nowplaying-container{grid-template-columns:1fr;gap:20px}.nowplaying-sidebar{flex-direction:column}}::view-transition-group(root){animation:none}@keyframes slide-to-left{to{opacity:0;transform:translate(-100px)}}@keyframes slide-from-right{0%{opacity:0;transform:translate(100px)}}@keyframes slide-to-right{to{opacity:0;transform:translate(100px)}}@keyframes slide-from-left{0%{opacity:0;transform:translate(-100px)}}html:active-view-transition-type(forward)::view-transition-old(root){animation-name:slide-to-left}html:active-view-transition-type(forward)::view-transition-new(root){animation-name:slide-from-right}html:active-view-transition-type(backward)::view-transition-old(root){animation-name:slide-to-right}html:active-view-transition-type(backward)::view-transition-new(root){animation-name:slide-from-left}.search-source-selector{gap:12px;margin-bottom:4px;display:flex}.search-source-selector .btn-toggle{align-items:center;gap:8px;padding:10px 18px;font-weight:600;display:flex}.search-source-selector .btn-toggle svg{width:16px;height:16px}.nowplaying-toggle-bar{border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0003;border-radius:14px;justify-content:center;gap:8px;width:100%;max-width:480px;margin:0 auto;padding:6px;display:flex}.nowplaying-toggle-bar .btn-toggle{color:var(--color-text-secondary);background:0 0;border:none;flex-grow:1;justify-content:center;align-items:center;gap:8px;padding:8px 16px;font-weight:500;display:flex}.nowplaying-toggle-bar .btn-toggle.active{color:#fff;background:#ffffff14;border-left:none;box-shadow:inset 0 1px #ffffff0d}.nowplaying-video-container{width:100%;max-width:760px;margin:0 auto;padding:0 12px}.video-ratio-wrapper{width:100%;height:0;box-shadow:0 20px 50px #0009, 0 0 40px rgba(var(--accent-color-rgb), .1);background:#000;border:1px solid #ffffff14;border-radius:20px;padding-bottom:56.25%;position:relative;overflow:hidden}.video-ratio-wrapper iframe{width:100%;height:100%;position:absolute;top:0;left:0}.nowplaying-lyrics-container{width:100%;max-width:680px;height:380px;margin:0 auto;position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(#0000 0%,#000 15% 85%,#0000 100%);mask-image:linear-gradient(#0000 0%,#000 15% 85%,#0000 100%)}.lyrics-wrapper{scroll-behavior:smooth;scrollbar-width:none;flex-direction:column;gap:20px;height:100%;padding:80px 0 120px;display:flex;overflow-y:auto}.lyrics-wrapper::-webkit-scrollbar{display:none}.lyric-line{color:#fff;opacity:.25;cursor:pointer;transform-origin:0;border-radius:8px;padding:4px 12px;font-size:26px;font-weight:700;line-height:1.35;transition:opacity .35s cubic-bezier(.4,0,.2,1),transform .35s cubic-bezier(.4,0,.2,1),text-shadow .35s}.lyric-line:hover:not(.lyrics-status){opacity:.6}.lyric-line.active{opacity:1;color:#fff;text-shadow:0 0 20px rgba(var(--accent-color-rgb), .6);transform:scale(1.04)}.lyrics-status{color:var(--color-text-secondary);opacity:.6;text-align:center;cursor:default;width:100%;margin-top:60px;font-size:18px;font-weight:400}#btn-fullscreen-close{color:#fff;z-index:100;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff14;border:1px solid #ffffff14;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;display:none;position:absolute;top:30px;right:40px}#btn-fullscreen-close:hover{background:#ffffff26;scale:1.05}.glass-container.fullscreen-mode{border:none;grid-template-rows:1fr;grid-template-columns:1fr}.glass-container.fullscreen-mode .sidebar{display:none!important}.glass-container.fullscreen-mode .viewport{grid-area:1/1/-1/-1;height:100vh;padding:40px 80px 120px;overflow:hidden!important}.glass-container.fullscreen-mode .player-bar{border:1px solid var(--glass-border);background:#0a0a0fcc;border-radius:20px;grid-template-columns:240px 1fr 240px;width:85%;max-width:960px;position:absolute;bottom:30px;left:50%;transform:translate(-50%);box-shadow:0 20px 40px #0009}.glass-container.fullscreen-mode .nowplaying-container{grid-template-columns:1.1fr 1fr;align-items:center;gap:80px;max-width:1200px;height:calc(100vh - 160px);margin:0 auto;display:grid}.glass-container.fullscreen-mode .nowplaying-main{text-align:center;align-items:center}.glass-container.fullscreen-mode .nowplaying-sidebar{display:none!important}.glass-container.fullscreen-mode .visualizer-container{opacity:.7;border-radius:0;width:100vw;height:100vh;position:absolute;top:0;left:0}.glass-container.fullscreen-mode:has(#panel-lyrics:not([style*="display: none"])) .nowplaying-container{grid-template-columns:1fr 1.2fr}.glass-container.fullscreen-mode:has(#panel-lyrics:not([style*="display: none"])) #panel-lyrics{grid-column:2;justify-content:center;align-items:flex-start;display:flex!important}.glass-container.fullscreen-mode:has(#panel-lyrics:not([style*="display: none"])) #panel-visualizer{grid-column:1;display:flex!important}.glass-container.fullscreen-mode:has(#panel-lyrics:not([style*="display: none"])) .nowplaying-lyrics-container{max-width:100%;height:480px}.glass-container.fullscreen-mode:has(#panel-lyrics:not([style*="display: none"])) .lyric-line{font-size:30px}.glass-container.fullscreen-mode:has(#panel-video:not([style*="display: none"])) .nowplaying-container{grid-template-columns:1fr}.glass-container.fullscreen-mode:has(#panel-video:not([style*="display: none"])) #panel-visualizer{display:none!important}.glass-container.fullscreen-mode .art-card{border-radius:50%;width:320px;height:320px;animation:25s linear infinite paused rotateVinyl}.glass-container.fullscreen-mode .art-card.playing{animation-play-state:running}@keyframes rotateVinyl{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (width<=900px){.glass-container.fullscreen-mode .nowplaying-container{grid-template-columns:1fr;gap:30px}.glass-container.fullscreen-mode:has(#panel-lyrics:not([style*="display: none"])) .nowplaying-container{grid-template-columns:1fr}.glass-container.fullscreen-mode:has(#panel-lyrics:not([style*="display: none"])) #panel-visualizer{display:none!important}.glass-container.fullscreen-mode .player-bar{grid-template-columns:1fr;width:95%}}.glass-container.fullscreen-mode.controls-hidden{cursor:none!important}.glass-container.fullscreen-mode.controls-hidden .player-bar{opacity:0;pointer-events:none;transform:translate(-50%,20px)scale(.98)}.glass-container.fullscreen-mode.controls-hidden #btn-fullscreen-close,.glass-container.fullscreen-mode.controls-hidden .nowplaying-toggle-bar{opacity:0;pointer-events:none;transform:translateY(-20px)}.glass-container.fullscreen-mode .player-bar,.glass-container.fullscreen-mode #btn-fullscreen-close,.glass-container.fullscreen-mode .nowplaying-toggle-bar{transition:opacity .5s cubic-bezier(.4,0,.2,1),transform .5s cubic-bezier(.4,0,.2,1)}.art-card-container{justify-content:center;align-items:center;width:290px;height:290px;margin:0 auto;display:flex;position:relative}.vinyl-record{width:280px;height:280px;box-shadow:0 20px 40px #0009, 0 0 0 1px #ffffff0d, 0 0 50px rgba(var(--accent-color-rgb), .15);background:radial-gradient(circle,#2a2a2a 0%,#151515 40%,#050505 100%);border:8px solid #111;justify-content:center;align-items:center;transition:transform .8s cubic-bezier(.25,.8,.25,1);animation:20s linear infinite paused rotateVinyl;display:flex;position:relative;overflow:hidden;border-radius:50%!important}.vinyl-record.playing{animation-play-state:running}.vinyl-grooves{pointer-events:none;z-index:1;background:repeating-radial-gradient(circle,#000000d9 0 2px,#ffffff09 3px,#000000e6 4px);border-radius:50%;width:100%;height:100%;position:absolute;top:0;left:0}.vinyl-label-container{z-index:2;background:#222;border:4px solid #000;border-radius:50%;width:160px;height:160px;position:relative;overflow:hidden}.vinyl-label-container img{object-fit:cover;width:100%;height:100%}.vinyl-center-pin{z-index:3;background:radial-gradient(circle,#f9f9f9 0%,#a1a1a1 60%,#444 100%);border:2px solid #000;border-radius:50%;width:14px;height:14px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 2px 4px #0006}.vinyl-tonearm{z-index:10;pointer-events:none;transform-origin:85px 30px;width:110px;height:180px;transition:transform 1.2s cubic-bezier(.25,1,.5,1);position:absolute;top:-40px;right:-25px;transform:rotate(-30deg)}.vinyl-tonearm.playing{transform:rotate(6deg)}.tonearm-base{background:radial-gradient(circle,#e6e6e6 0%,#7d7d7d 70%,#2b2b2b 100%);border:1px solid #ffffff26;border-radius:50%;width:30px;height:30px;position:absolute;top:15px;right:15px;box-shadow:0 4px 10px #00000080}.tonearm-rod{filter:drop-shadow(0 4px 6px #0000004d);background:0 0;border-bottom:5px solid #dcdcdc;border-right:5px solid #dcdcdc;border-bottom-right-radius:25px;width:50px;height:110px;position:absolute;top:30px;right:28px}.tonearm-head{background:linear-gradient(135deg,#333,#1a1a1a);border:1px solid #ffffff1a;border-radius:3px;width:14px;height:22px;position:absolute;top:132px;right:68px;transform:rotate(-15deg);box-shadow:0 2px 4px #0006}.tonearm-head:after{content:"";background:#f55;border-radius:1px;width:3px;height:6px;position:absolute;bottom:2px;left:3px}.glass-container.fullscreen-mode .art-card-container{width:380px;height:380px}.glass-container.fullscreen-mode .vinyl-record{border-width:10px;width:360px;height:360px}.glass-container.fullscreen-mode .vinyl-label-container{width:210px;height:210px}.glass-container.fullscreen-mode .vinyl-tonearm{transform-origin:105px 35px;width:140px;height:240px;top:-50px;right:-30px;transform:rotate(-32deg)}.glass-container.fullscreen-mode .vinyl-tonearm.playing{transform:rotate(5deg)}.glass-container.fullscreen-mode .tonearm-base{width:36px;height:36px;top:20px;right:20px}.glass-container.fullscreen-mode .tonearm-rod{border-bottom-width:6px;border-right-width:6px;border-bottom-right-radius:35px;width:65px;height:155px;top:38px;right:36px}.glass-container.fullscreen-mode .tonearm-head{width:18px;height:30px;top:185px;right:90px}.modal-overlay{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:10000;background:#05050899;justify-content:center;align-items:center;width:100vw;height:100vh;animation:.25s ease-out fadeIn;display:flex;position:fixed;top:0;left:0}.modal-content{background:#0f0f16d9;border:1px solid #ffffff14;border-radius:20px;width:90%;max-width:500px;padding:24px;animation:.3s cubic-bezier(.34,1.56,.64,1) scaleIn;box-shadow:0 25px 60px #0009}.modal-header{border-bottom:1px solid #ffffff0f;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:12px;display:flex}.shortcuts-grid{flex-direction:column;gap:12px;display:flex}.shortcut-row{border-bottom:1px dashed #ffffff0a;justify-content:space-between;align-items:center;padding:6px 0;display:flex}.shortcut-row:last-child{border-bottom:none}.shortcut-row .key{color:var(--accent-color);text-align:center;background:#ffffff14;border:1px solid #ffffff1a;border-radius:6px;min-width:50px;padding:4px 8px;font-family:monospace;font-size:13px;font-weight:700;box-shadow:0 2px #0000004d}.shortcut-row .desc{color:var(--color-text-secondary);font-size:14px;font-weight:500}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)translateY(20px)}to{opacity:1;transform:scale(1)translateY(0)}}html,body{width:100%!important;height:100%!important;margin:0!important;padding:0!important;overflow:hidden!important}.fullscreen-search-overlay{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:10002;opacity:0;pointer-events:none;background:#08080c73;flex-direction:column;align-items:center;width:100%;height:100%;padding-top:60px;transition:opacity .3s cubic-bezier(.4,0,.2,1);display:flex;position:absolute;top:0;left:0}.fullscreen-search-overlay.active{opacity:1;pointer-events:auto}.fullscreen-search-overlay .fs-search-box{width:90%;max-width:600px;transition:transform .3s cubic-bezier(.34,1.56,.64,1);transform:translateY(-20px)scale(.95)}.fullscreen-search-overlay.active .fs-search-box{transform:translateY(0)scale(1)}.fullscreen-search-overlay .fs-search-results{width:90%;max-width:600px}.fs-search-box{-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);background:#0a0a0fd9;border:1px solid #ffffff14;border-radius:18px;align-items:center;gap:12px;padding:10px 18px;display:flex;box-shadow:0 10px 30px #00000080,inset 0 1px #ffffff0d}.fs-search-box .search-input{color:#fff;background:0 0;border:none;outline:none;flex-grow:1;font-family:inherit;font-size:16px}.fs-search-results{-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);background:#0a0a0ff2;border:1px solid #ffffff14;border-radius:18px;flex-direction:column;gap:4px;max-height:350px;margin-top:8px;padding:8px;display:flex;overflow-y:auto;box-shadow:0 20px 50px #0009}.fs-search-results::-webkit-scrollbar{width:6px}.fs-search-results::-webkit-scrollbar-thumb{background:#ffffff14;border-radius:3px}.fs-result-row{cursor:pointer;border-radius:12px;justify-content:space-between;align-items:center;padding:10px 14px;transition:background .2s;display:flex}.fs-result-row:hover{background:#ffffff0f}.fs-result-info{flex-grow:1;align-items:center;gap:12px;display:flex;overflow:hidden}.fs-result-art{object-fit:cover;border-radius:8px;flex-shrink:0;width:40px;height:40px}.fs-result-art-placeholder{width:40px;height:40px;color:var(--color-text-muted);background:#ffffff0a;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.fs-result-text{overflow:hidden}.fs-result-title{color:#fff;white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:600;overflow:hidden}.fs-result-artist{color:var(--color-text-muted);white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.fs-result-badge{border-radius:6px;flex-shrink:0;padding:3px 8px;font-size:10px;font-weight:700}