:root{--bg:#090909;--surface:#141414f2;--border:#ffffff0f;--text:#fafafa;--muted:#888;--dim:#555;--accent:#6ee7b7;--accent-dim:#6ee7b726;--radius-sm:6px;--radius:10px;--radius-lg:14px;--shadow:0 8px 32px #0009}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;overflow:hidden}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;font-family:Inter,system-ui,-apple-system,sans-serif}::selection{background:#6ee7b74d}.player-page{background:#000;width:100%;height:100%;position:relative;overflow:hidden}.backdrop{z-index:0;pointer-events:none;position:absolute;inset:0;overflow:hidden}.backdrop img{object-fit:cover;filter:blur(40px)brightness(.3);opacity:.5;width:100%;height:100%;transform:scale(1.1)}.backdrop .vignette{pointer-events:none;background:radial-gradient(#0000 40%,#000000b3 100%);position:absolute;inset:0}.player{z-index:1;width:100%;height:100%;position:relative;overflow:hidden}.player video{object-fit:contain;width:100%;height:100%;display:block}.overlay{z-index:10;pointer-events:none;flex-direction:column;justify-content:space-between;transition:opacity .3s;display:flex;position:absolute;inset:0}.overlay.active{opacity:1}.overlay.inactive{opacity:0}.overlay.inactive .bottom-bar{transform:translateY(50px)}.overlay.inactive .top-bar{transform:translateY(-50px)}.overlay>*{pointer-events:auto}.grad-top{pointer-events:none;z-index:0;background:linear-gradient(#000000d9 0%,#0000 100%);height:120px;position:absolute;top:0;left:0;right:0}.grad-bot{pointer-events:none;z-index:0;background:linear-gradient(#0000 0%,#000000d9 100%);height:180px;position:absolute;bottom:0;left:0;right:0}.top-bar{z-index:2;justify-content:space-between;align-items:center;padding:18px 22px;transition:transform .35s;display:flex;position:relative}.top-left{align-items:center;gap:14px;min-width:0;display:flex}.top-back{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#ffffffb3;cursor:pointer;background:#ffffff0f;border:none;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;transition:all .15s;display:flex}.top-back:hover{color:#fff;background:#ffffff1a}.top-info{min-width:0}.top-title{color:#fff;white-space:nowrap;text-overflow:ellipsis;text-shadow:0 2px 8px #0009;letter-spacing:-.01em;font-size:.88rem;font-weight:700;overflow:hidden}.top-meta{flex-wrap:wrap;gap:6px;margin-top:3px;display:flex}.top-meta .tag{color:#ffffff8c;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffff0f;border-radius:4px;padding:2px 8px;font-size:.62rem;font-weight:600}.top-meta .tag.accent{background:var(--accent-dim);color:var(--accent)}.top-right{align-items:center;gap:6px;display:flex}.top-btn{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#ffffff8c;cursor:pointer;background:#ffffff0f;border:none;border-radius:10px;justify-content:center;align-items:center;width:38px;height:38px;transition:all .15s;display:flex}.top-btn:hover{color:#fff;background:#ffffff1a}.center-wrap{z-index:2;pointer-events:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.big-play{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:#fff;cursor:pointer;pointer-events:auto;background:#ffffff14;border:none;border-radius:50%;justify-content:center;align-items:center;width:68px;height:68px;transition:all .2s;display:flex;position:relative;box-shadow:0 4px 32px #00000080,inset 0 0 0 1px #ffffff0f}.big-play:after{content:"";pointer-events:none;border:2px solid #ffffff14;border-radius:50%;animation:2.5s ease-in-out infinite play-pulse;position:absolute;inset:-4px}@keyframes play-pulse{0%,to{opacity:.5;transform:scale(1)}50%{opacity:0;transform:scale(1.08)}}.big-play:hover{background:#ffffff24;transform:scale(1.06);box-shadow:0 6px 40px #0009,inset 0 0 0 1px #ffffff1a}.big-play:active{transform:scale(.97)}.big-play svg{width:26px;height:26px;margin-left:3px}.bottom-bar{z-index:2;padding:0 32px 24px;transition:transform .35s;position:relative}.timeline-wrap{cursor:pointer;align-items:center;gap:16px;padding:8px 0 12px;display:flex;position:relative}.tl-track{background:#ffffff14;border-radius:3px;flex:1;height:5px;transition:height .15s;position:relative;overflow:visible}.tl-track:hover{height:8px}.tl-buffered{background:#ffffff1a;border-radius:3px;height:100%;transition:width .2s;position:absolute;top:0;left:0}.tl-played{background:var(--accent);border-radius:3px;height:100%;transition:width 80ms linear;position:absolute;top:0;left:0}.tl-thumb{background:var(--accent);opacity:0;border-radius:50%;width:16px;height:16px;transition:opacity .15s,transform .15s,width .15s,height .15s;position:absolute;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 8px #6ee7b780}.tl-track:hover .tl-thumb{opacity:1;width:18px;height:18px;transform:translate(-50%,-50%)scale(1.1)}.tl-track:active .tl-thumb{width:22px;height:22px}.tl-hover{color:#fff;white-space:nowrap;pointer-events:none;opacity:0;background:#000000d9;border-radius:4px;margin-bottom:8px;padding:3px 8px;font-family:JetBrains Mono,monospace;font-size:.6rem;transition:opacity .15s;position:absolute;bottom:100%;transform:translate(-50%)}.tl-track:hover .tl-hover{opacity:1}.tl-time{color:#ffffff59;white-space:nowrap;letter-spacing:.02em;flex-shrink:0;font-family:JetBrains Mono,monospace;font-size:.7rem}.controls-row{justify-content:space-between;align-items:center;gap:12px;margin-top:2px;display:flex}.ctrl-l,.ctrl-r{align-items:center;gap:8px;display:flex}.ctrl-btn-circle:hover{color:#fff!important;background:#ffffff14!important}.ctrl-btn-circle:hover .tooltip{opacity:1!important}.vol-wrap{align-items:center;gap:4px;display:flex;position:relative}.vol-slider{align-items:center;width:0;height:38px;transition:width .2s;display:flex;overflow:hidden}.vol-wrap:hover .vol-slider{width:76px}.vol-track{cursor:pointer;background:#ffffff1a;border-radius:2px;width:68px;height:4px;position:relative}.vol-fill{background:#fff;border-radius:2px;height:100%;position:absolute;top:0;left:0}.vol-thumb{background:#fff;border-radius:50%;width:14px;height:14px;position:absolute;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 6px #0006}.settings{z-index:20;-webkit-backdrop-filter:blur(24px);background:#121212f5;border:1px solid #ffffff0f;border-radius:14px;min-width:210px;padding:6px;position:absolute;bottom:62px;right:22px;box-shadow:0 16px 48px #0009}.m-item{cursor:pointer;color:#ffffffbf;text-align:left;background:0 0;border:none;border-radius:9px;justify-content:space-between;align-items:center;width:100%;padding:10px 16px;font-family:inherit;font-size:.78rem;transition:background .1s;display:flex}.m-item:hover{color:#fff;background:#ffffff0f}.m-item .ml{align-items:center;gap:8px;display:flex}.m-item .mv{color:var(--muted);align-items:center;gap:4px;font-size:.72rem;display:flex}.m-div{background:#ffffff0a;height:1px;margin:4px 10px}.settings-panel{z-index:20;-webkit-backdrop-filter:blur(32px);background:#101010f5;border:1px solid #ffffff0f;border-radius:20px;flex-direction:column;width:440px;max-height:480px;display:flex;position:absolute;bottom:72px;right:32px;overflow:hidden;box-shadow:0 24px 64px #000c}.sp-header{justify-content:space-between;align-items:center;padding:16px 20px 12px;display:flex}.sp-header-left{align-items:center;gap:10px;display:flex}.sp-header-left svg{color:var(--accent);flex-shrink:0}.sp-title{color:#fff;letter-spacing:-.01em;font-size:.85rem;font-weight:700}.sp-sub{color:#ffffff59;margin-top:1px;font-size:.68rem}.sp-close{color:#fff6;cursor:pointer;background:#ffffff0a;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;transition:all .15s;display:flex}.sp-close:hover{color:#fff;background:#ffffff14}.sp-divider{background:#ffffff0a;height:1px;margin:0 16px}.sp-tabs{gap:4px;padding:10px 16px;display:flex;overflow-x:auto}.sp-tab{color:#fff6;cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:8px;align-items:center;gap:5px;padding:7px 14px;font-family:inherit;font-size:.72rem;font-weight:500;transition:all .15s;display:flex}.sp-tab:hover{color:#fff9;background:#ffffff08}.sp-tab.active{color:#fff;background:#ffffff0f}.sp-tab svg{flex-shrink:0}.sp-content{flex:1;padding:8px 16px 16px;overflow-y:auto}.sp-content::-webkit-scrollbar{width:4px}.sp-content::-webkit-scrollbar-thumb{background:#ffffff0f;border-radius:2px}.sp-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.sp-card{cursor:pointer;background:#ffffff05;border:1px solid #ffffff0a;border-radius:12px;padding:14px;transition:all .15s;position:relative}.sp-card:hover{background:#ffffff0a;border-color:#ffffff14;transform:translateY(-1px)}.sp-card.active{background:#6ee7b70a;border-color:#6ee7b74d}.sp-card-name{color:#fff;margin-bottom:2px;font-size:.8rem;font-weight:600}.sp-card-badge{color:#ffffff4d;font-size:.62rem;font-weight:500}.sp-check{position:absolute;top:10px;right:10px}.sp-speed-grid{flex-wrap:wrap;gap:6px;padding:4px;display:flex}.sp-speed-btn{color:#fff9;cursor:pointer;text-align:center;background:#ffffff05;border:1px solid #ffffff0f;border-radius:10px;flex:1;min-width:60px;padding:10px 18px;font-family:inherit;font-size:.82rem;font-weight:600;transition:all .15s}.sp-speed-btn:hover{background:#ffffff0a;border-color:#ffffff1a}.sp-speed-btn.active{color:#6ee7b7;background:#6ee7b714;border-color:#6ee7b740}.loading{z-index:5;flex-direction:column;justify-content:center;align-items:center;gap:16px;display:flex;position:absolute;inset:0}.loading.hide{opacity:0;pointer-events:none;transition:opacity .5s}.load-spin{border:3px solid #ffffff0a;border-top-color:var(--accent);border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.load-title{color:#fff9;letter-spacing:-.01em;font-size:.88rem;font-weight:600}.load-sub{color:var(--dim);font-size:.72rem}.load-steps{flex-direction:column;gap:6px;margin-top:4px;display:flex}.load-step{color:var(--dim);align-items:center;gap:8px;font-size:.7rem;display:flex}.load-step .step-dot{background:var(--dim);border-radius:50%;width:5px;height:5px;transition:all .3s}.load-step.active .step-dot{background:var(--accent);box-shadow:0 0 6px #6ee7b766}.load-step.done .step-dot{background:var(--accent);opacity:.5}.load-step.done{color:#6ee7b780}.error-over{z-index:5;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#000000b3;flex-direction:column;justify-content:center;align-items:center;gap:14px;display:flex;position:absolute;inset:0}.error-over svg{color:#ff5f56;width:40px;height:40px}.error-title{color:#fff;font-size:.95rem;font-weight:700}.error-sub{color:#ffffff73;text-align:center;max-width:320px;font-size:.8rem;line-height:1.5}.error-btn{background:var(--accent);color:#090909;cursor:pointer;border:none;border-radius:9px;padding:10px 24px;font-family:inherit;font-size:.8rem;font-weight:600;transition:all .15s}.error-btn:hover{background:#5bd8a5;transform:translateY(-1px)}.buffer-overlay{z-index:3;pointer-events:none;flex-direction:column;align-items:center;gap:10px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.buffer-ring{border:2.5px solid #ffffff0f;border-top-color:var(--accent);border-radius:50%;width:32px;height:32px;animation:.7s linear infinite spin}.buffer-text{color:#ffffff4d;font-size:.7rem}.toast-area{z-index:15;pointer-events:none;flex-direction:column;align-items:center;gap:4px;display:flex;position:absolute;top:68px;left:50%;transform:translate(-50%)}.toast-el{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff;background:#121212eb;border:1px solid #ffffff0f;border-radius:9px;align-items:center;gap:8px;padding:9px 18px;font-size:.75rem;display:flex;box-shadow:0 8px 24px #0006}:fullscreen .player-page{background:#000!important}:fullscreen .backdrop{opacity:0!important}:fullscreen .top-bar{padding:22px 28px}:fullscreen .bottom-bar{padding:0 32px 28px}:fullscreen .ctrl-btn-circle{width:48px;height:48px}:fullscreen .ctrl-btn-circle svg{width:24px;height:24px}:fullscreen .big-play{width:80px;height:80px}:fullscreen .big-play svg{width:30px;height:30px}:fullscreen .tl-track{height:6px}:fullscreen .tl-track:hover{height:10px}:fullscreen .tl-thumb{width:20px;height:20px}:fullscreen .tl-track:hover .tl-thumb{width:24px;height:24px}:fullscreen .tl-time{font-size:.75rem}:fullscreen .top-title{font-size:1rem}@media (width<=640px){.top-bar{padding:12px 14px}.bottom-bar{padding:0 16px 12px}.big-play{width:54px;height:54px}.big-play svg{width:22px;height:22px}.ctrl-btn-circle{width:34px;height:34px}.ctrl-btn-circle svg{width:17px;height:17px}.top-title{font-size:.78rem}.settings-panel{width:calc(100vw - 32px);max-height:60vh;bottom:64px;right:16px}.sp-grid{grid-template-columns:1fr}.tl-time{font-size:.62rem}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
