:root{--primary:104 97% 54%;--foreground:0 0% 98%;--card:240 10% 4.9%;--muted:240 3.7% 15.9%;--muted-foreground:240 5% 64.9%;--border:240 3.7% 15.9%;--ring:240 4.9% 50%;--radius:.65rem;}*{box-sizing:border-box}html,body{height:100%;margin:0}body{font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background:#000;color:hsl(var(--foreground));-webkit-font-smoothing:antialiased;overflow:hidden;}.player{position:relative;width:100vw;height:100vh;height:100dvh;background:#000;outline:none;overflow:hidden;-webkit-tap-highlight-color:transparent;}.player video{width:100%;height:100%;display:block;background:#000;object-fit:contain;pointer-events:none;}.player .i-pause,.player .i-mute,.player .i-vol-med,.player .i-vol-high,.player .i-fs-exit{display:none}.player.is-playing .i-play{display:none}.player.is-playing .i-pause{display:inline}.player.vol-med:not(.is-muted) .i-vol-med{display:inline}.player.vol-high:not(.is-muted) .i-vol-high{display:inline}.player.is-muted .i-mute{display:inline}.player.is-fullscreen .i-fs{display:none}.player.is-fullscreen .i-fs-exit{display:inline}.center-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;}.big-play{pointer-events:auto;width:76px;height:76px;border-radius:50%;border:1px solid rgb(255 255 255 / .15);background:rgb(0 0 0 / .6);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;backdrop-filter:blur(6px);transition:transform .15s ease,background .15s ease;}.big-play:hover{transform:scale(1.06);background:rgb(0 0 0 / .75)}.big-play[hidden]{display:none}.spinner{width:52px;height:52px;border:3px solid hsl(var(--primary) / .2);border-top-color:hsl(var(--primary));border-radius:50%;animation:spin .8s linear infinite;}.spinner[hidden]{display:none}@keyframes spin{to{transform:rotate(360deg)}}.offline-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:24px;text-align:center;color:hsl(var(--foreground));background:radial-gradient(120% 90% at 50% 40%,rgb(24 24 27 / .92),rgb(0 0 0 / .96));z-index:25;}.offline-overlay[hidden]{display:none}.offline-overlay svg{color:hsl(var(--primary));opacity:.9}.offline-title{font-size:1.15rem;font-weight:700}.offline-sub{font-size:.85rem;color:hsl(var(--muted-foreground))}.offline-sub b{color:hsl(var(--primary))}.offline-retry{margin-top:6px;font-size:.75rem;color:rgb(255 255 255 / .45);font-variant-numeric:tabular-nums;}.offline-back{display:inline-flex;align-items:center;gap:8px;margin-top:12px;height:36px;padding:0 16px;font-size:.82rem;font-weight:700;border:none;border-radius:calc(var(--radius) - 2px);background:hsl(var(--primary));color:#000;cursor:pointer;transition:background .15s ease;}.offline-back svg{color:#000}.offline-back:hover{background:hsl(104 97% 62%)}.offline-back[hidden]{display:none}.unmute-hint{position:absolute;top:max(16px,env(safe-area-inset-top));left:max(16px,env(safe-area-inset-left));display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 14px;font-size:.82rem;font-weight:600;color:#fff;cursor:pointer;border:1px solid rgb(255 255 255 / .18);border-radius:999px;background:rgb(0 0 0 / .6);backdrop-filter:blur(6px);z-index:20;animation:pulse-soft 2s ease-in-out infinite;}.unmute-hint:hover{background:rgb(0 0 0 / .8)}.unmute-hint[hidden]{display:none}@keyframes pulse-soft{0%,100%{opacity:1}50%{opacity:.75}}.controls{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;gap:8px;padding:5px 14px;padding-left:max(14px,env(safe-area-inset-left));padding-right:max(14px,env(safe-area-inset-right));padding-bottom:max(5px,env(safe-area-inset-bottom));background:rgb(11 11 12 / .95);border-top:1px solid rgb(255 255 255 / .1);backdrop-filter:blur(5px);opacity:0;transform:translateY(8px);transition:opacity .2s ease,transform .2s ease;z-index:10;}.player:hover .controls,.player:focus-within .controls,.player.show-controls .controls,.player:not(.is-playing) .controls{opacity:1;transform:translateY(0)}.player.idle{cursor:none}.player.idle.is-playing .controls{opacity:0;transform:translateY(8px)}.ctrl-btn{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;padding:0;flex:none;border:none;border-radius:999px;background:transparent;color:#fff;cursor:pointer;touch-action:manipulation;transition:background .15s ease;}.ctrl-btn svg{width:22px;height:22px}.ctrl-btn[hidden]{display:none}#qualityBtn svg{width:19px;height:19px}.ctrl-btn:hover{background:rgb(255 255 255 / .14)}.ctrl-btn-text{font-size:.82rem;font-weight:500}.spacer{flex:1}.live-btn{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 6px;font-size:.72rem;font-weight:700;letter-spacing:.05em;border:none;background:transparent;color:hsl(var(--muted-foreground));cursor:pointer;transition:color .15s ease;}.live-btn:hover{color:hsl(var(--foreground))}.live-btn .live-dot{width:7px;height:7px;border-radius:50%;background:#6b7280}.live-btn.is-live{color:#fff}.live-btn.is-live .live-dot{background:hsl(var(--primary));animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}.volume{display:flex;align-items:center;padding-right:24px;margin-right:-24px;}.slider{-webkit-appearance:none;appearance:none;height:4px;border-radius:999px;background:linear-gradient(to right,#fff 0%,#fff calc(var(--vol,1) * 100%),rgb(255 255 255 / .28) calc(var(--vol,1) * 100%),rgb(255 255 255 / .28) 100%);cursor:pointer;margin:0;}.volume-slider{width:0;opacity:0;transition:width .22s ease,opacity .22s ease,margin .22s ease;}.volume:hover .volume-slider,.live-btn:hover + .volume .volume-slider,.volume:focus-within .volume-slider{width:76px;opacity:1;margin:0 8px 0 2px}.slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:12px;height:12px;border-radius:50%;background:#fff;border:none;cursor:pointer;box-shadow:0 0 0 1px rgb(0 0 0 / .2);transition:transform .12s ease;}.slider::-webkit-slider-thumb:hover{transform:scale(1.15)}.slider::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:#fff;border:none;cursor:pointer;box-shadow:0 0 0 1px rgb(0 0 0 / .2);}.latency{font-size:.78rem;font-variant-numeric:tabular-nums;color:rgb(255 255 255 / .7);padding:0 6px;}.sep-dot{color:hsl(var(--primary));font-weight:700}.quality-label{font-size:.8rem;font-weight:500;color:rgb(255 255 255 / .85);white-space:nowrap;padding:0 2px;}.menu-wrap{position:static}.menu{position:absolute;bottom:calc(100% + 8px);right:16px;min-width:180px;max-width:calc(100vw - 32px);max-height:min(65vh,65dvh,380px);overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:rgb(255 255 255 / .25) transparent;background:rgb(11 11 12 / .97);border-radius:12px;padding:0;box-shadow:0 10px 30px -10px rgb(0 0 0 / .7);z-index:30;}.menu[hidden]{display:none}.menu-view[hidden]{display:none}.menu{animation:menu-pop .16s ease;transform-origin:bottom right}@keyframes menu-pop{from{opacity:0;transform:translateY(6px) scale(.98)}to{opacity:1;transform:none}}.menu.menu-resizing{transition:width .18s ease,height .18s ease;overflow:hidden}.menu-view.slide-fwd{animation:menu-slide-fwd .18s ease}.menu-view.slide-back{animation:menu-slide-back .18s ease}@keyframes menu-slide-fwd{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:none}}@keyframes menu-slide-back{from{opacity:0;transform:translateX(-24px)}to{opacity:1;transform:none}}.menu-row{display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%;padding:13px 12px 13px 14px;font-size:.82rem;font-weight:600;border:none;background:transparent;color:hsl(var(--foreground));cursor:pointer;text-align:left;}.menu-row:hover{background:rgb(255 255 255 / .08)}.menu-row-value{display:flex;align-items:center;gap:4px;font-weight:400;font-size:.78rem;color:hsl(var(--muted-foreground));white-space:nowrap;}.menu::-webkit-scrollbar{width:8px}.menu::-webkit-scrollbar-thumb{background:rgb(255 255 255 / .25);border-radius:999px}.menu-header{display:flex;align-items:center;gap:10px;width:100%;padding:13px 16px 12px 14px;font-size:.82rem;font-weight:600;border:none;border-bottom:1px solid rgb(255 255 255 / .12);background:transparent;color:hsl(var(--foreground));cursor:pointer;text-align:left;}.menu-header:hover{background:rgb(255 255 255 / .08)}.menu-header svg{flex:none}.menu-item{display:flex;align-items:center;width:100%;padding:11px 16px 11px 12px;font-size:.82rem;border:none;background:transparent;color:hsl(var(--foreground));cursor:pointer;text-align:left;}.menu-item:hover{background:rgb(255 255 255 / .08)}.menu-row:focus,.menu-header:focus,.menu-item:focus{outline:none}.menu-item.active{font-weight:600}.menu-item .check{display:flex;align-items:center;width:26px;flex:none;color:hsl(var(--primary));opacity:0;}.menu-item.active .check{opacity:1}.mi-badge{font-size:.62em;font-weight:700;margin-left:3px;letter-spacing:.03em;color:hsl(var(--primary));}.mi-codec{margin-left:auto;padding-left:12px;font-size:.68rem;color:hsl(var(--muted-foreground));}.status{position:absolute;top:max(16px,env(safe-area-inset-top));right:max(16px,env(safe-area-inset-right));margin:0;font-size:.8rem;color:hsl(var(--muted-foreground));z-index:20;max-width:60vw;text-align:right;}.status:empty{display:none}.status.error{color:#fecaca;background:rgb(127 29 29 / .85);border:1px solid rgb(248 113 113 / .4);padding:8px 12px;border-radius:calc(var(--radius) - 2px);}@media (hover:none),(pointer:coarse){.player:not(.idle) .controls{opacity:1;transform:translateY(0)}.ctrl-btn{width:44px;height:44px}.controls{gap:4px}.volume{padding-right:0;margin-right:0}.volume-slider{width:72px;opacity:1;margin:0 8px 0 2px}.slider{height:6px}.slider::-webkit-slider-thumb{width:18px;height:18px}.slider::-moz-range-thumb{width:18px;height:18px}.menu-row{padding:15px 14px 15px 16px}.menu-item{padding:14px 16px 14px 12px}.menu-header{padding:15px 16px 14px 14px}.ctrl-btn:hover{background:transparent}.ctrl-btn:active{background:rgb(255 255 255 / .14)}.big-play:hover{transform:none}.big-play:active{transform:scale(1.06);background:rgb(0 0 0 / .75)}}@media (max-width:560px){.latency{display:none}.controls{padding-top:8px;padding-bottom:max(8px,env(safe-area-inset-bottom))}.offline-title{font-size:1rem}.offline-sub{font-size:.8rem}.offline-overlay svg{width:44px;height:44px}.menu{right:8px;max-width:calc(100vw - 16px)}}@media (max-width:420px){.quality-label{display:none}.volume-slider{width:60px}.controls{gap:2px}.unmute-hint{height:34px;padding:0 12px;font-size:.78rem}}.menu-row-label{display:flex;align-items:center;gap:12px}.menu-row-label svg{flex:none;opacity:.9}