html,body,#root{height:100%}body{margin:0}.app-shell{height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden;--video-w: calc(50dvh * 16 / 9);--frame: 9px;--frame-color: #212121;--frame-radius: 0px}.app-shell header{flex:0 0 auto}.app-shell .logo{height:auto;margin:0}.app-shell .logo img{height:clamp(36px,8vh,84px);padding:clamp(4px,1vh,14px);width:auto;max-width:100%}.app-shell .player-area{flex:0 0 auto;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:0 clamp(4px,1vw,16px)}.app-shell .video-frame{position:relative;width:100%;max-width:min(100%,var(--video-w));aspect-ratio:16 / 9;margin:0 auto;background:#000}.app-shell .video-frame>div{position:absolute;top:0;right:0;bottom:0;left:0}.app-shell .video-frame iframe{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;border:0;display:block}.app-shell .video-controls{flex:0 0 auto;position:relative;width:100%;max-width:min(100%,calc(var(--video-w) + 4rem));margin:0 auto;box-sizing:border-box}.app-shell .video-controls button,.app-shell .video-item{-webkit-tap-highlight-color:transparent}.app-shell #shuffleButton,.app-shell #shuffleButton.disabled{position:relative;background:none}.app-shell #shuffleButton:before,.app-shell #shuffleButton:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:no-repeat center / contain;transition:opacity .22s ease,transform .32s cubic-bezier(.34,1.56,.64,1);pointer-events:none}.app-shell #shuffleButton:before{background-image:url(/css/content/shuffleNov.png)}.app-shell #shuffleButton:after{background-image:url(/css/content/shufflnNov.png);opacity:0;transform:scale(.9)}.app-shell #shuffleButton.disabled:before{opacity:0;transform:scale(.9)}.app-shell #shuffleButton.disabled:after{opacity:1;transform:none}@media (hover: hover){.app-shell #shuffleButton{transition:transform .2s cubic-bezier(.34,1.56,.64,1)}.app-shell #shuffleButton:hover{transform:rotate(-3deg) scale(1.05)}.app-shell #previousButton:hover{transform:rotate(-10deg) scale(1.1)}.app-shell #nextButton:hover{transform:rotate(10deg) scale(1.1)}}.app-shell #shuffleButton:active{transform:scale(.95)}.app-shell #previousButton,.app-shell #nextButton{transition:transform .28s cubic-bezier(.34,1.56,.64,1)}.app-shell #previousButton:active{transform:translate(-4px) scale(.88);transition-duration:80ms}.app-shell #nextButton:active{transform:translate(4px) scale(.88);transition-duration:80ms}.app-shell .video-controls .search-toggle{position:absolute;left:min(max(calc(50% + 161px),calc(75% + 51px)),calc(100% - 44px));top:50%;width:38px;height:44px;margin:0;padding:0;background:url(/css/content/mag-glass.png) no-repeat center / contain;transform:translateY(-50%);transition:transform .2s cubic-bezier(.34,1.56,.64,1)}.app-shell .video-controls .search-toggle:hover,.app-shell .video-controls .search-toggle--open{transform:translateY(-50%) rotate(-12deg) scale(1.1)}.app-shell .video-controls .search-toggle--open:hover{transform:translateY(-50%) rotate(-18deg) scale(1.15)}.app-shell .video-controls .search-toggle:focus-visible{outline:2px solid #212121;outline-offset:2px}@media (max-width: 768px){.app-shell .video-controls .search-toggle{left:min(max(calc(50% + 146px),calc(75% + 58px)),calc(100% - 28px));width:24px;height:28px}}.app-shell .video-list{flex:1 1 auto;min-height:3.6rem;overflow-y:auto;width:100%;max-width:min(100%,calc(var(--video-w) + 4rem));margin:0 auto clamp(10px,3dvh,32px);box-sizing:border-box;border:var(--frame) solid var(--frame-color);border-radius:var(--frame-radius);background:linear-gradient(#ffffff9e,#ffffff9e),repeating-linear-gradient(-45deg,#84eb88 0,#84eb88 14px,#62b9f4 14px,#62b9f4 28px,#f7c592 28px,#f7c592 42px,#ff7e6e 42px,#ff7e6e 56px,#fff87b 56px,#fff87b 70px,#cfa8ff 70px,#cfa8ff 84px,pink 84px,pink 98px)}.app-shell .video-list .video-item.current{position:sticky;top:0;bottom:0;z-index:1;transition:box-shadow .15s ease}.app-shell .video-list .video-item.current[data-stuck=top]{box-shadow:0 4px 10px #21212147}.app-shell .video-list .video-item.current[data-stuck=bottom]{box-shadow:0 -4px 10px #21212147}.app-shell .song-search{flex:0 0 auto;position:relative;width:100%;max-width:min(100%,calc(var(--video-w) + 4rem));margin:clamp(2px,.6vh,8px) auto 0;box-sizing:border-box;animation:search-in .18s ease-out}@keyframes search-in{0%{opacity:0;transform:translateY(-8px)}}.song-search__input{display:block;width:100%;box-sizing:border-box;padding:6px 3rem 6px 10px;border:var(--frame) solid var(--frame-color);border-bottom:none;border-radius:var(--frame-radius) var(--frame-radius) 0 0;background:#fff;color:#212121;font-family:Barlow,Helvetica LT Std,Arial;font-size:1rem;text-transform:lowercase;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.song-search__input::placeholder{color:#9a9a9a}.song-search__input:focus-visible{background:#fffde6}.song-search__count{position:absolute;right:calc(var(--frame) + 10px);top:calc(50% + var(--frame) / 2);transform:translateY(-50%);font-family:Barlow,Helvetica LT Std,Arial;font-size:.75rem;color:#9a9a9a;font-variant-numeric:tabular-nums;pointer-events:none}.song-search__input::-webkit-search-cancel-button{display:none}.video-list__empty{padding:5px;background:#fff;color:#6f6f6f;font-family:Barlow,Helvetica LT Std,Arial;text-transform:lowercase}.app-shell .song-search+.video-list{border-top-width:4px;border-top-left-radius:0;border-top-right-radius:0}@media (max-width: 768px){.app-shell .video-list,.app-shell .song-search+.video-list{border:none;border-radius:0}.song-search__count{right:12px;top:50%}.song-search__input{border:none;border-radius:0;font-size:16px}}.video-item{user-select:none;-webkit-user-select:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.video-item[data-holding]{filter:brightness(.94)}.hold-ring{position:fixed;z-index:50;transform:translate(-50%,-50%);pointer-events:none}.hold-ring svg{display:block;transform:rotate(-90deg)}.hold-ring__bg{fill:#ffffff8c}.hold-ring__track,.hold-ring__progress{fill:none;stroke-linecap:round}.hold-ring__track{stroke:#2121212e}.hold-ring__progress{stroke:#212121;stroke-dasharray:var(--ring-c);stroke-dashoffset:var(--ring-c);animation:hold-fill var(--hold-ms) linear forwards}@keyframes hold-fill{to{stroke-dashoffset:0}}.hold-ring--done{animation:hold-pop .26s ease-out forwards}@keyframes hold-pop{0%{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(-50%,-50%) scale(1.5);opacity:0}}.q-burst{position:fixed;z-index:49;width:64px;height:82px;background-size:contain;background-repeat:no-repeat;background-position:center;pointer-events:none;will-change:transform,opacity}.queue-hint{position:fixed;z-index:51;transform:translate(-50%,-160%);padding:4px 10px;border-radius:999px;background:#212121eb;color:#fff;font-family:Barlow,Helvetica LT Std,Arial;font-size:.75rem;line-height:1.2;white-space:nowrap;pointer-events:none;animation:hint-in .16s ease-out}@keyframes hint-in{0%{opacity:0;transform:translate(-50%,-140%)}to{opacity:1;transform:translate(-50%,-160%)}}@media (prefers-reduced-motion: reduce){.queue-hint,.app-shell .song-search{animation:none}.app-shell .video-controls .search-toggle{transition:none}.app-shell #shuffleButton,.app-shell #shuffleButton:before,.app-shell #shuffleButton:after,.app-shell #previousButton,.app-shell #nextButton{transition:opacity .12s linear;transform:none!important}.hold-ring--done{animation-duration:.12s}}.player-ui{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;pointer-events:none;font-family:Barlow,Helvetica LT Std,Arial;color:#fff}.player-ui{--player-native-zone: min(96px, 35%)}.app-shell .video-frame:fullscreen .player-ui{--player-native-zone: min(120px, 20%)}.player-ui__surface{position:absolute;inset:0 0 var(--player-native-zone) 0;pointer-events:auto;cursor:pointer}.player-ui:not([data-visible]) .player-ui__surface{top:0;right:0;bottom:0;left:0}.player-ui[data-playing]:not([data-visible]) .player-ui__surface{cursor:none}.player-ui__bar{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;gap:6px;padding:18px 8px 6px;box-sizing:border-box;pointer-events:auto;background:linear-gradient(to top,#000c,#0000);opacity:0;transform:translateY(100%);transition:opacity .18s ease,transform .18s ease}.player-ui[data-visible] .player-ui__bar{opacity:1;transform:none}.player-ui__btn{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:4px;border:none;border-radius:4px;background:none;color:#fff;cursor:pointer}.player-ui__btn svg{width:100%;height:100%;fill:currentColor}.player-ui__btn:hover{color:#ff7e6e}.player-ui__btn:focus-visible{outline:2px solid #fff;outline-offset:-2px}.player-ui__time{flex:0 0 auto;font-size:.75rem;font-variant-numeric:tabular-nums;text-shadow:0 1px 2px rgba(0,0,0,.6)}.player-ui__seek{position:relative;flex:1 1 auto;min-width:40px;height:24px;display:flex;align-items:center}.player-ui__seek-track{position:absolute;left:0;right:0;height:4px;border-radius:2px;background:#ffffff4d;overflow:hidden;transition:height .12s ease}.player-ui__seek:hover .player-ui__seek-track{height:6px}.player-ui__seek-buffered,.player-ui__seek-played{position:absolute;inset:0 auto 0 0;border-radius:2px}.player-ui__seek-buffered{width:var(--buffered, 0%);background:#ffffff80}.player-ui__seek-played{width:var(--played, 0%);background:#ff7e6e}.player-ui__seek-input,.player-ui__volume-input{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0;background:none;cursor:pointer;touch-action:none}.player-ui__seek-input{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.player-ui__seek-input::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border:none;border-radius:50%;background:#ff7e6e}.player-ui__seek-input::-moz-range-thumb{width:12px;height:12px;border:none;border-radius:50%;background:#ff7e6e}.player-ui__seek-input:disabled{cursor:default}.player-ui__seek-input:disabled::-webkit-slider-thumb{opacity:0}.player-ui__seek-input:disabled::-moz-range-thumb{opacity:0}.player-ui__volume{flex:0 0 auto;display:flex;align-items:center}.player-ui__volume-input{width:0;height:4px;border-radius:2px;background:#ffffff4d;opacity:0;transition:width .14s ease,opacity .14s ease}.player-ui__volume:hover .player-ui__volume-input,.player-ui__volume-input:focus-visible{width:64px;opacity:1;margin-left:4px}.player-ui__volume-input::-webkit-slider-thumb{-webkit-appearance:none;width:10px;height:10px;border:none;border-radius:50%;background:#fff}.player-ui__volume-input::-moz-range-thumb{width:10px;height:10px;border:none;border-radius:50%;background:#fff}.player-ui__big-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;width:64px;height:64px;padding:14px 12px 14px 16px;box-sizing:border-box;border:none;border-radius:50%;background:#0000008c;color:#fff;cursor:pointer;pointer-events:auto}.player-ui__big-play svg{width:100%;height:100%;fill:currentColor}.player-ui__big-play:hover{background:#000000bf}.app-shell .video-frame:fullscreen{width:100%;height:100%;max-width:none;aspect-ratio:auto}@media (max-width: 768px){.player-ui__bar{gap:4px;padding:16px 6px 4px}.player-ui__btn{width:28px;height:28px}.player-ui__time{font-size:.68rem}.player-ui__seek-input::-webkit-slider-thumb{width:14px;height:14px}.player-ui__seek-input::-moz-range-thumb{width:14px;height:14px}.player-ui__big-play{width:52px;height:52px}}@media (max-width: 420px){.player-ui__time--total{display:none}}@media (prefers-reduced-motion: reduce){.player-ui__bar{transition:none}}