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}}