:root{--z-video:1;--z-overlay:10;--z-dropdown:20}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{color:#fff;-webkit-tap-highlight-color:transparent;background:#000;height:100dvh;font-family:system-ui,-apple-system,sans-serif;overflow:hidden}.feed{scroll-snap-type:y mandatory;overscroll-behavior-y:contain;height:100dvh;overflow-y:scroll}.video-item{scroll-snap-align:start;scroll-snap-stop:always;background:#000;height:100dvh;position:relative}.video-item video,.video-item mux-player{object-fit:cover;width:100%;height:100%}.overlay-top{pointer-events:none;height:10dvh;z-index:var(--z-overlay);background:linear-gradient(#000000bf 0%,#0000 100%);justify-content:space-between;align-items:center;padding:0 16px;display:flex;position:absolute;top:0;left:0;right:0}.overlay-top>*{pointer-events:auto}.overlay-bottom{padding:12px 16px max(24px, env(safe-area-inset-bottom));z-index:var(--z-overlay);pointer-events:none;background:linear-gradient(#0000 0%,#000000bf 100%);position:absolute;bottom:0;left:0;right:0}.overlay-bottom>*{pointer-events:auto}.dropdown{display:inline-block;position:relative}.dropdown-trigger{color:#fff;cursor:pointer;background:#ffffff26;border:1px solid #ffffff40;border-radius:8px;align-items:center;gap:4px;padding:6px 12px;font-size:14px;display:flex}.dropdown-menu{z-index:var(--z-dropdown);background:#000000e6;border:1px solid #fff3;border-radius:8px;min-width:120px;position:absolute;top:calc(100% + 4px);overflow:hidden}.dropdown-menu.left{left:0}.dropdown-menu.right{right:0}.dropdown-item{color:#fff;cursor:pointer;text-align:left;white-space:nowrap;background:0 0;border:none;width:100%;padding:10px 14px;font-size:14px;text-decoration:none;display:block}.dropdown-item:hover{background:#ffffff1a}.dropdown-item.active{color:#4fc3f7}.controls-row{align-items:center;gap:12px;display:flex}.control-btn{color:#fff;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:4px;display:flex}.seek-bar{appearance:none;background:#ffffff4d;border-radius:2px;outline:none;flex:1;height:3px}.seek-bar::-webkit-slider-thumb{-webkit-appearance:none;cursor:pointer;background:#fff;border-radius:50%;width:12px;height:12px}.seek-bar::-moz-range-thumb{cursor:pointer;background:#fff;border:none;border-radius:50%;width:12px;height:12px}.spinner-container{z-index:5;pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.spinner{border:3px solid #fff3;border-top-color:#fff;border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.error-container{z-index:5;flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex;position:absolute;inset:0}.error-container p{opacity:.7;font-size:14px}.error-container button{color:#fff;cursor:pointer;background:#ffffff26;border:1px solid #ffffff4d;border-radius:8px;padding:8px 20px;font-size:14px}.overlay-link{color:#fff;background:#ffffff26;border:1px solid #ffffff40;border-radius:8px;padding:6px 12px;font-size:14px;font-weight:500;text-decoration:none}.placeholder-page{flex-direction:column;justify-content:center;align-items:center;gap:16px;height:100dvh;padding:24px;display:flex}.placeholder-page h1{font-size:24px}.placeholder-page a{color:#4fc3f7;text-decoration:none}.dropdown-backdrop{z-index:calc(var(--z-dropdown) - 1);position:fixed;inset:0}