.b1-player{--b1-primary: #1ab360;--b1-primary-dark: #0f733b;--b1-primary-light: #26d975;--b1-primary-hover: #15a050;--b1-primary-glow: rgba(26, 179, 96, .4);--b1-primary-subtle: rgba(26, 179, 96, .15);--b1-primary-muted: rgba(26, 179, 96, .08);--b1-live: #eb0400;--b1-live-glow: rgba(235, 4, 0, .4);--b1-warning: #f59e0b;--b1-error: #ef4444;--b1-success: #22c55e;--b1-bg-dark: #0e0e10;--b1-bg-surface: rgba(18, 18, 18, .98);--b1-bg-elevated: rgba(24, 24, 27, .98);--b1-bg-overlay: rgba(0, 0, 0, .85);--b1-bg-overlay-light: rgba(0, 0, 0, .5);--b1-bg-hover: rgba(255, 255, 255, .08);--b1-bg-active: rgba(255, 255, 255, .12);--b1-text: #efeff1;--b1-text-secondary: rgba(255, 255, 255, .7);--b1-text-muted: rgba(255, 255, 255, .5);--b1-text-disabled: rgba(255, 255, 255, .3);--b1-border: rgba(255, 255, 255, .1);--b1-border-subtle: rgba(255, 255, 255, .05);--b1-border-primary: rgba(26, 179, 96, .25);--b1-shadow: 0 4px 24px rgba(0, 0, 0, .5);--b1-shadow-lg: 0 12px 48px rgba(0, 0, 0, .8)}.player-controls{width:100%;padding:0;z-index:2;-webkit-tap-highlight-color:transparent;container-type:inline-size}.controls-bar{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;gap:8px}.controls-left,.controls-right{display:flex;align-items:center;gap:4px}.control-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;background:transparent;border:none;border-radius:4px;color:var(--b1-text);cursor:pointer;transition:all .15s ease;flex-shrink:0}.control-btn:hover{background:var(--b1-bg-hover)}.control-btn:active{transform:scale(.9);background:var(--b1-bg-active)}.volume-control{position:relative;display:flex;align-items:center;gap:0}.volume-slider-wrapper{width:0;overflow:hidden;transition:width .15s ease;display:flex;align-items:center;padding:0}.volume-slider-wrapper.show{width:80px;padding-left:8px}.volume-slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:4px;border-radius:2px;outline:none;cursor:pointer;background:linear-gradient(to right,var(--b1-primary) 50%,var(--b1-border) 50%)}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;background:var(--b1-text);border-radius:50%;cursor:pointer;-webkit-transition:transform .1s ease;transition:transform .1s ease;box-shadow:0 1px 4px #0000004d}.volume-slider::-webkit-slider-thumb:hover{transform:scale(1.2)}.volume-slider::-moz-range-thumb{width:14px;height:14px;background:var(--b1-text);border-radius:50%;border:none;cursor:pointer;-moz-transition:transform .1s ease;transition:transform .1s ease;box-shadow:0 1px 4px #0000004d}.volume-slider::-moz-range-thumb:hover{transform:scale(1.2)}.live-btn{width:auto;padding:0 12px;gap:6px;font-weight:600;font-size:13px;margin-left:8px}.live-dot{width:8px;height:8px;border-radius:50%;transition:background-color .2s}.live-dot.gray{background-color:#999}.live-dot.red{background-color:red;box-shadow:0 0 4px #ff000080}.live-text{color:#fff;letter-spacing:.5px}@media(max-width:768px){.controls-bar{padding:10px 12px}.control-btn{width:44px;height:44px}.live-btn{width:auto;padding:0 10px;height:44px}.volume-slider-wrapper.show{width:70px}}@media(max-width:480px){.controls-bar{padding:8px 10px}.control-btn{width:40px;height:40px}.live-btn{height:40px}.volume-slider-wrapper.show{width:60px}}@media(hover:none)and (pointer:coarse){.control-btn{width:48px;height:48px}.live-btn{width:auto;padding:0 12px;height:48px}.volume-slider{height:6px}.volume-slider::-webkit-slider-thumb,.volume-slider::-moz-range-thumb{width:18px;height:18px}.volume-slider-wrapper.show{width:90px}}@media(max-height:500px)and (orientation:landscape){.player-controls{position:relative;z-index:10}.controls-bar{padding:6px 12px;gap:4px}.control-btn{width:36px;height:36px}.live-btn{height:36px}.controls-left,.controls-right{gap:2px}.volume-slider-wrapper.show{width:60px;padding-left:6px}.volume-slider{height:3px}.volume-slider::-webkit-slider-thumb{width:12px;height:12px}.volume-slider::-moz-range-thumb{width:12px;height:12px}}@container (max-width: 560px){.controls-bar{padding:8px 10px;gap:4px}.controls-left,.controls-right{gap:2px}.control-btn{width:34px;height:34px}.control-btn svg{width:18px;height:18px}.live-btn{width:34px;height:34px;margin-left:4px;padding:0;gap:0}.live-text{display:none}.volume-slider-wrapper.show{width:52px;padding-left:6px}}@container (max-width: 460px){.controls-bar{padding:6px 8px;gap:2px}.controls-left,.controls-right{gap:0}.control-btn{width:30px;height:30px;border-radius:3px}.control-btn svg{width:16px;height:16px}.live-btn{width:30px;height:30px;margin-left:2px}.volume-slider-wrapper,.volume-slider-wrapper.show{display:none}}.settings-menu{position:absolute;bottom:64px;right:16px;width:280px;max-height:400px;background:var(--b1-bg-elevated);border-radius:8px;overflow:hidden;box-shadow:var(--b1-shadow);z-index:100;animation:menuFadeIn .15s ease}@keyframes menuFadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.settings-menu-content{display:flex;flex-direction:column;height:100%}.settings-menu-header{display:flex;align-items:center;padding:12px 14px;border-bottom:1px solid var(--b1-border);gap:8px;min-height:48px}.header-title{flex:1;font-size:14px;font-weight:600;color:var(--b1-text)}.back-btn,.close-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:transparent;border:none;border-radius:4px;color:var(--b1-text-secondary);cursor:pointer;transition:all .1s ease;flex-shrink:0}.back-btn:hover,.close-btn:hover{background:var(--b1-bg-hover);color:var(--b1-text)}.settings-menu-items{display:flex;flex-direction:column;overflow-y:auto;max-height:350px}.settings-menu-items::-webkit-scrollbar{width:6px}.settings-menu-items::-webkit-scrollbar-track{background:transparent}.settings-menu-items::-webkit-scrollbar-thumb{background:var(--b1-text-disabled);border-radius:3px}.menu-item{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;min-height:48px;background:transparent;border:none;color:var(--b1-text);font-size:14px;text-align:left;cursor:pointer;transition:background .1s ease}.menu-item:hover{background:var(--b1-bg-hover)}.menu-item:active{background:var(--b1-bg-active)}.menu-item.active{background:var(--b1-primary-subtle)}.menu-item-left{display:flex;align-items:center;gap:12px;flex:1}.menu-item-left svg{color:var(--b1-text-muted);flex-shrink:0}.menu-item-right{display:flex;align-items:center;gap:6px}.menu-item-right svg{color:var(--b1-text-disabled)}.menu-value{color:var(--b1-text-muted);font-size:13px}.quality-item .menu-item-left{flex-direction:column;align-items:flex-start;gap:2px}.quality-desc{font-size:12px;color:var(--b1-text-disabled)}.quality-item.active .quality-desc{color:var(--b1-primary)}.check-icon{color:var(--b1-primary)!important}.toggle-item{cursor:pointer}.toggle-switch{width:40px;height:22px;background:var(--b1-border);border-radius:11px;position:relative;transition:background .2s ease;flex-shrink:0}.toggle-switch.active{background:var(--b1-primary)}.toggle-thumb{position:absolute;top:2px;left:2px;width:18px;height:18px;background:var(--b1-text);border-radius:50%;transition:transform .2s ease;box-shadow:0 1px 3px #0000004d}.toggle-switch.active .toggle-thumb{transform:translate(18px)}.info-item{cursor:default}.info-item:hover{background:transparent}.info-badge{font-size:11px;font-weight:600;padding:3px 8px;border-radius:4px;text-transform:uppercase;letter-spacing:.3px}.info-badge.on{background:var(--b1-primary-subtle);color:var(--b1-primary)}.info-badge.off{background:#ef444433;color:var(--b1-error)}.menu-item.disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.menu-item.disabled:hover{background:transparent}.locked-notice{background:var(--b1-bg-hover);border-bottom:1px solid var(--b1-border);justify-content:center;padding:10px 14px;min-height:auto}.locked-text{font-size:12px;color:var(--b1-text-muted);text-align:center}@media(max-width:480px){.settings-menu{width:calc(100vw - 32px);left:16px;right:16px;bottom:60px}}@media(hover:none)and (pointer:coarse){.menu-item{min-height:52px;padding:14px 16px}.back-btn,.close-btn{width:36px;height:36px}.toggle-switch{width:48px;height:26px}.toggle-thumb{width:22px;height:22px}.toggle-switch.active .toggle-thumb{transform:translate(22px)}}@media(max-height:500px)and (orientation:landscape){.settings-menu{bottom:50px;right:12px;width:240px;max-height:calc(100vh - 80px)}.settings-menu-header{padding:8px 12px;min-height:40px}.header-title{font-size:13px}.back-btn,.close-btn{width:28px;height:28px}.settings-menu-items{max-height:calc(100vh - 130px)}.menu-item{padding:8px 12px;min-height:40px;font-size:13px}.menu-value{font-size:12px}.quality-desc{font-size:11px}.toggle-switch{width:36px;height:20px}.toggle-thumb{width:16px;height:16px}.toggle-switch.active .toggle-thumb{transform:translate(16px)}.info-badge{font-size:10px;padding:2px 6px}}.debug-overlay{position:fixed;width:650px;max-height:calc(100vh - 60px);background:#000000a6;border:1px solid rgba(255,255,255,.1);border-radius:12px;overflow-y:auto;box-shadow:0 10px 25px #00000080,0 0 0 1px #ffffff0d;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:1000;animation:slideDown .3s cubic-bezier(.4,0,.2,1);font-family:Courier New,SF Mono,Monaco,monospace;-webkit-user-select:none;-moz-user-select:none;user-select:none}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.debug-overlay::-webkit-scrollbar{width:10px}.debug-overlay::-webkit-scrollbar-track{background:#0003}.debug-overlay::-webkit-scrollbar-thumb{background:#fff3;border-radius:5px;border:2px solid transparent;background-clip:content-box}.debug-overlay::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.debug-header{display:flex;align-items:center;gap:10px;padding:14px 20px;background:#ffffff1a;border-bottom:1px solid rgba(255,255,255,.1);color:#fff;font-size:14px;font-weight:800;letter-spacing:.8px;text-transform:uppercase}.debug-content-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#ffffff1a}.debug-column{background:transparent;display:flex;flex-direction:column}.debug-section{padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.1);background:#0003}.debug-section:last-of-type{border-bottom:none}.debug-section h4{margin:0 0 10px;font-size:11px;font-weight:800;color:#ffffffb3;text-transform:uppercase;letter-spacing:.8px}.debug-row{display:flex;justify-content:space-between;align-items:center;padding:6px 0;font-size:11px;transition:all .2s cubic-bezier(.4,0,.2,1)}.debug-row:hover{background:#ffffff0d;margin:0 -8px;padding:6px 8px;border-radius:4px}.debug-row.active{background:#4ade8026;margin:0 -8px;border-radius:4px;border-left:3px solid #4ade80;padding:6px 8px 6px 12px}.debug-label{color:#ffffff80;font-weight:600}.debug-value{color:#ffffffe6;font-weight:400;text-align:right}.debug-value.small{font-size:10px;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.debug-row.active .debug-label,.debug-row.active .debug-value{color:#4ade80;font-weight:800}.debug-footer{padding:10px 20px;text-align:center;background:#ffffff0d;border-top:1px solid rgba(255,255,255,.1)}.debug-footer small{color:#fff6;font-size:10px;font-weight:500}.qualities-list{max-height:200px;overflow-y:auto;padding-right:4px}.qualities-list::-webkit-scrollbar{width:4px}.qualities-list::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:2px}@media(max-width:768px){.debug-overlay{width:320px}.debug-content-grid{grid-template-columns:1fr}}.live-indicator-container{display:flex;align-items:center;gap:8px}.live-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:4px;font-size:12px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;transition:all .2s ease}.status-live{background:var(--b1-live);color:var(--b1-text)}.status-live .live-dot{width:8px;height:8px;background:var(--b1-text);border-radius:50%;animation:livePulse 1.5s ease-in-out infinite}@keyframes livePulse{0%,to{opacity:1}50%{opacity:.4}}.status-loading{background:var(--b1-primary);color:var(--b1-text)}.status-loading .spinner-icon{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.status-reconnecting{background:var(--b1-warning);color:var(--b1-bg-dark);animation:reconnectBlink 1s ease-in-out infinite}@keyframes reconnectBlink{0%,to{opacity:1}50%{opacity:.6}}.status-offline{background:var(--b1-border);color:var(--b1-text-secondary)}.status-ended{background:var(--b1-text-disabled);color:var(--b1-text-muted)}.viewer-count{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;background:var(--b1-bg-overlay-light);border-radius:4px;color:var(--b1-text);font-size:13px;font-weight:500;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.viewer-count svg{color:var(--b1-text-secondary)}@media(max-width:480px){.live-indicator-container{gap:6px}.live-badge{padding:4px 8px;font-size:10px;gap:4px}.status-live .live-dot{width:6px;height:6px}.viewer-count{padding:4px 8px;font-size:11px;gap:4px}.viewer-count svg{width:12px;height:12px}}@media(max-height:500px)and (orientation:landscape){.live-indicator-container{gap:6px}.live-badge{padding:3px 8px;font-size:10px;gap:4px}.status-live .live-dot{width:6px;height:6px}.viewer-count{padding:3px 8px;font-size:11px;gap:4px}.viewer-count svg{width:12px;height:12px}}.watermark-overlay{position:absolute;inset:0;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:5;overflow:hidden}.watermark-item{display:flex;flex-direction:column;gap:clamp(2px,.3vmin,4px);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:clamp(10px,1.2vmin,16px);font-weight:600;color:#ffffff80;text-shadow:1px 1px 1px rgba(0,0,0,.9),-1px -1px 1px rgba(0,0,0,.9),1px -1px 1px rgba(0,0,0,.9),-1px 1px 1px rgba(0,0,0,.9),0 0 4px rgba(0,0,0,.8);white-space:nowrap;letter-spacing:.3px}.watermark-ip{font-weight:500;font-size:clamp(8px,1.4vmin,18px)}.watermark-watch-id{font-size:clamp(11px,1vmin,18px);font-weight:700;opacity:.9}:fullscreen .watermark-item,::backdrop .watermark-item{opacity:.2}.video-player-container{width:100%;height:100%;min-height:480px;aspect-ratio:16 / 9;position:relative;background:var(--b1-bg-dark);overflow:hidden;-webkit-tap-highlight-color:transparent;touch-action:pan-x pan-y;-webkit-user-select:none;-moz-user-select:none;user-select:none;border-radius:0}.video-player-container.fullscreen{width:100vw!important;height:100vh!important;min-height:100vh;aspect-ratio:unset;border-radius:0}.video-player-container.zoomed{touch-action:none}.video-wrapper{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%;max-width:100%;max-height:100%;aspect-ratio:16 / 9;will-change:transform}@supports (aspect-ratio: 16 / 9){.video-wrapper{width:auto;height:100%}@media(min-aspect-ratio:16/9){.video-wrapper{width:100%;height:auto}}}.video-element{width:100%;height:100%;-o-object-fit:contain;object-fit:contain;background:#000;touch-action:none}.zoom-indicator{position:absolute;bottom:80px;left:50%;transform:translate(-50%);padding:8px 16px;background:var(--b1-bg-overlay);border-radius:20px;color:var(--b1-text);font-size:13px;font-weight:600;z-index:30;pointer-events:none;animation:zoomIndicatorFade 2s ease forwards;display:flex;align-items:center;gap:6px}.zoom-indicator svg{width:16px;height:16px}@keyframes zoomIndicatorFade{0%{opacity:1}70%{opacity:1}to{opacity:0}}.buffering-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:15;pointer-events:none}.spinner{width:56px;height:56px;border:3px solid var(--b1-border);border-top-color:var(--b1-primary);border-radius:50%;animation:b1-spin .8s linear infinite}@keyframes b1-spin{to{transform:rotate(360deg)}}.play-pause-animation{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:20;pointer-events:none;animation:playPauseAnim .5s ease-out forwards}.animation-icon{background:var(--b1-bg-overlay-light);border-radius:50%;padding:24px;display:flex;align-items:center;justify-content:center}@keyframes playPauseAnim{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}30%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}to{opacity:0;transform:translate(-50%,-50%) scale(1)}}.unmute-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:var(--b1-bg-overlay-light);z-index:25;cursor:pointer;animation:b1-fadeIn .3s ease}.unmute-content{display:flex;flex-direction:column;align-items:center;gap:12px;padding:32px 48px;background:var(--b1-bg-overlay);border-radius:12px;border:1px solid var(--b1-border);transition:all .2s ease}.unmute-overlay:hover .unmute-content{background:var(--b1-bg-surface);border-color:var(--b1-primary);transform:scale(1.02)}.unmute-icon{display:flex;align-items:center;justify-content:center;width:80px;height:80px;background:var(--b1-primary);border-radius:50%;color:#fff;animation:b1-pulse 2s ease-in-out infinite}@keyframes b1-pulse{0%,to{box-shadow:0 0 0 0 var(--b1-primary-glow)}50%{box-shadow:0 0 0 16px transparent}}.unmute-text{font-size:18px;font-weight:600;color:var(--b1-text)}.unmute-hint{font-size:13px;color:var(--b1-text-muted)}.paused-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0000004d;z-index:10;cursor:pointer;animation:b1-fadeIn .2s ease}.big-play-button{display:flex;align-items:center;justify-content:center;width:88px;height:88px;background:var(--b1-primary);border:none;border-radius:50%;color:#fff;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 24px var(--b1-primary-glow)}.big-play-button:hover{background:var(--b1-primary-hover);transform:scale(1.1);box-shadow:0 8px 32px var(--b1-primary-glow)}.big-play-button:active{transform:scale(.95)}.player-overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;opacity:0;transition:opacity .2s ease;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.7) 0%,transparent 20%,transparent 80%,rgba(0,0,0,.8) 100%)}.player-overlay.show{opacity:1;pointer-events:all}.top-bar{display:flex;justify-content:flex-start;align-items:flex-start;gap:12px;padding-top:calc(env(safe-area-inset-top,0px) + 12px);padding-right:calc(env(safe-area-inset-right,0px) + 16px);padding-bottom:16px;padding-left:calc(env(safe-area-inset-left,0px) + 16px);z-index:2}.top-back-btn{display:flex;align-items:center;justify-content:center;width:42px;height:42px;padding:0;border:none;border-radius:9999px;color:var(--b1-text);cursor:pointer;background:var(--b1-bg-overlay-light);transition:all .15s ease;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);flex-shrink:0}.top-back-btn:hover{background:var(--b1-bg-hover)}.top-back-btn:active{transform:scale(.92);background:var(--b1-bg-active)}@keyframes b1-fadeIn{0%{opacity:0}to{opacity:1}}@media(max-width:768px){.video-player-container{min-height:280px}.top-bar{padding:12px}.unmute-content{padding:24px 36px}.unmute-icon{width:64px;height:64px}.unmute-icon svg{width:32px;height:32px}.unmute-text{font-size:16px}.big-play-button{width:72px;height:72px}.big-play-button svg{width:48px;height:48px}.spinner{width:48px;height:48px}.animation-icon{padding:18px}.animation-icon svg{width:40px;height:40px}}@media(max-width:480px){.video-player-container{min-height:200px}.top-bar{padding:10px}.unmute-content{padding:20px 28px}.unmute-icon{width:56px;height:56px}.unmute-text{font-size:14px}.unmute-hint{font-size:11px}.big-play-button{width:64px;height:64px}.big-play-button svg{width:40px;height:40px}}@media(max-height:500px)and (orientation:landscape){.video-player-container{min-height:100%;height:100vh;aspect-ratio:unset}.player-overlay{background:linear-gradient(180deg,rgba(0,0,0,.5) 0%,transparent 15%,transparent 85%,rgba(0,0,0,.7) 100%)}.top-bar{padding:8px 12px}.unmute-content{padding:16px 24px}.unmute-icon{width:48px;height:48px}.unmute-icon svg{width:24px;height:24px}.unmute-text{font-size:14px}.unmute-hint{font-size:10px}.big-play-button{width:56px;height:56px}.big-play-button svg{width:32px;height:32px}.spinner{width:40px;height:40px}.animation-icon{padding:14px}.animation-icon svg{width:32px;height:32px}.zoom-indicator{bottom:60px;font-size:11px;padding:6px 12px}}
