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)}.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}.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;box-sizing:border-box}@media (max-width: 768px){.app-shell .video-list{border:none}}.video-item{user-select:none;-webkit-user-select:none}.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{animation:none}.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: 40%}.player-ui__surface{position:absolute;inset:0 0 var(--player-native-zone) 0;pointer-events:auto;cursor:pointer}.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}}
