:root{--sp-color-bg:rgba(15, 23, 42, 0.85);--sp-color-surface:rgba(30, 41, 59, 0.7);--sp-color-surface-hover:rgba(51, 65, 85, 0.85);--sp-color-border:rgba(255, 255, 255, 0.12);--sp-color-text:#f8fafc;--sp-color-text-muted:#94a3b8;--sp-color-primary:#38bdf8;--sp-color-primary-hover:#0ea5e9;--sp-color-primary-glow:rgba(56, 189, 248, 0.35);--sp-color-buffer:rgba(255, 255, 255, 0.25);--sp-color-track:rgba(255, 255, 255, 0.15);--sp-color-danger:#f43f5e;--sp-glass-backdrop:blur(12px) saturate(160%);--sp-shadow-sm:0 2px 8px rgba(0, 0, 0, 0.3);--sp-shadow-md:0 4px 16px rgba(0, 0, 0, 0.4);--sp-shadow-lg:0 8px 32px rgba(0, 0, 0, 0.5);--sp-radius-xs:4px;--sp-radius-sm:6px;--sp-radius-md:10px;--sp-radius-lg:16px;--sp-radius-full:9999px;--sp-space-1:4px;--sp-space-2:8px;--sp-space-3:12px;--sp-space-4:16px;--sp-space-5:20px;--sp-space-6:24px;--sp-font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;--sp-font-size-xs:11px;--sp-font-size-sm:13px;--sp-font-size-md:14px;--sp-font-size-lg:16px;--sp-btn-size:36px;--sp-btn-padding:8px;--sp-progress-height:4px;--sp-progress-height-hover:7px;--sp-thumb-size:13px;--sp-focus-ring:2px solid var(--sp-color-primary);--sp-focus-offset:2px;--sp-transition-fast:0.15s cubic-bezier(0.4, 0, 0.2, 1);--sp-transition-normal:0.25s cubic-bezier(0.4, 0, 0.2, 1);--sp-transition-slow:0.4s cubic-bezier(0.4, 0, 0.2, 1);--sp-z-video:1;--sp-z-poster:2;--sp-z-spinner:5;--sp-z-bigplay:6;--sp-z-controls:10;--sp-z-menu:20;--sp-z-modal:30}@media (prefers-reduced-motion:reduce){:root{--sp-transition-fast:0s;--sp-transition-normal:0s;--sp-transition-slow:0s}}.sp-player{position:relative;display:block;box-sizing:border-box;width:100%;max-width:100%;background-color:#000;color:var(--sp-color-text);font-family:var(--sp-font-family);font-size:var(--sp-font-size-sm);line-height:1.4;overflow:hidden;user-select:none;-webkit-user-select:none;border-radius:var(--sp-radius-md);box-shadow:var(--sp-shadow-md)}.sp-player *,.sp-player ::after,.sp-player ::before{box-sizing:border-box}.sp-player.sp-aspect-16-9{aspect-ratio:16/9}.sp-player.sp-aspect-4-3{aspect-ratio:4/3}.sp-player.sp-aspect-1-1{aspect-ratio:1/1}.sp-player.sp-aspect-21-9{aspect-ratio:21/9}.sp-player.sp-aspect-fill{width:100%;height:100%}.sp-player video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain;background-color:#000;z-index:var(--sp-z-video)}.sp-player.sp-fullscreen{position:fixed!important;top:0!important;left:0!important;width:100vw!important;height:100vh!important;max-width:100vw!important;max-height:100vh!important;border-radius:0!important;z-index:999999!important}.sp-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.sp-hidden{display:none!important}.sp-player:focus-visible{outline:var(--sp-focus-ring);outline-offset:var(--sp-focus-offset)}.sp-controls{position:absolute;bottom:0;left:0;right:0;padding:var(--sp-space-2) var(--sp-space-4) var(--sp-space-3);background:linear-gradient(to top,rgba(0,0,0,.85) 0,rgba(0,0,0,.4) 60%,transparent 100%);display:flex;flex-direction:column;gap:var(--sp-space-2);z-index:var(--sp-z-controls);transition:opacity var(--sp-transition-normal),transform var(--sp-transition-normal);transform:translateY(0);opacity:1}.sp-player.sp-playing.sp-user-inactive .sp-controls{opacity:0;transform:translateY(8px);pointer-events:none}.sp-controls-row{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-space-3)}.sp-controls-left,.sp-controls-right{display:flex;align-items:center;gap:var(--sp-space-2)}.sp-button{background:0 0;border:none;color:var(--sp-color-text);width:var(--sp-btn-size);height:var(--sp-btn-size);min-width:36px;min-height:36px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--sp-radius-sm);cursor:pointer;padding:0;transition:background-color var(--sp-transition-fast),color var(--sp-transition-fast),transform var(--sp-transition-fast)}.sp-button:hover{background-color:var(--sp-color-surface-hover);color:#fff}.sp-button:active{transform:scale(.95)}.sp-button:focus-visible{outline:var(--sp-focus-ring);outline-offset:var(--sp-focus-offset)}.sp-button.sp-active{color:var(--sp-color-primary)}.sp-big-play-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:68px;height:68px;border-radius:var(--sp-radius-full);background:var(--sp-color-bg);backdrop-filter:var(--sp-glass-backdrop);-webkit-backdrop-filter:var(--sp-glass-backdrop);border:1px solid var(--sp-color-border);color:var(--sp-color-text);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:var(--sp-z-bigplay);box-shadow:var(--sp-shadow-lg);transition:transform var(--sp-transition-normal),background-color var(--sp-transition-normal),border-color var(--sp-transition-normal)}.sp-big-play-btn:hover{transform:translate(-50%,-50%) scale(1.08);border-color:var(--sp-color-primary);background-color:var(--sp-color-surface-hover)}.sp-big-play-btn:focus-visible{outline:var(--sp-focus-ring);outline-offset:4px}.sp-big-play-icon{width:30px;height:30px;display:flex;align-items:center;justify-content:center;margin-left:3px}.sp-big-play-icon svg{width:30px;height:30px}.sp-progress-container{position:relative;width:100%;height:16px;display:flex;align-items:center;cursor:pointer;touch-action:none}.sp-progress-container:focus-visible{outline:0}.sp-progress-container:focus-visible .sp-progress-track{outline:var(--sp-focus-ring);outline-offset:2px}.sp-progress-track{position:relative;width:100%;height:var(--sp-progress-height);background-color:var(--sp-color-track);border-radius:var(--sp-radius-full);overflow:visible;transition:height var(--sp-transition-fast)}.sp-progress-container.sp-is-scrubbing .sp-progress-track,.sp-progress-container:hover .sp-progress-track{height:var(--sp-progress-height-hover)}.sp-progress-buffered{position:absolute;top:0;left:0;height:100%;width:0%;background-color:var(--sp-color-buffer);border-radius:var(--sp-radius-full)}.sp-progress-hover{position:absolute;top:0;left:0;height:100%;width:0%;background-color:rgba(255,255,255,.2);border-radius:var(--sp-radius-full);pointer-events:none}.sp-progress-played{position:absolute;top:0;left:0;height:100%;width:0%;background:var(--sp-color-primary);border-radius:var(--sp-radius-full);box-shadow:0 0 10px var(--sp-color-primary-glow)}.sp-progress-thumb{position:absolute;top:50%;left:0;transform:translate(-50%,-50%) scale(0);width:var(--sp-thumb-size);height:var(--sp-thumb-size);background-color:#fff;border-radius:var(--sp-radius-full);box-shadow:var(--sp-shadow-sm);transition:transform var(--sp-transition-fast);pointer-events:none}.sp-progress-container.sp-is-scrubbing .sp-progress-thumb,.sp-progress-container:hover .sp-progress-thumb{transform:translate(-50%,-50%) scale(1)}.sp-progress-tooltip{position:absolute;bottom:calc(100% + 8px);left:0;transform:translateX(-50%);background:var(--sp-color-bg);color:var(--sp-color-text);font-size:var(--sp-font-size-xs);padding:3px 6px;border-radius:var(--sp-radius-xs);pointer-events:none;opacity:0;transition:opacity var(--sp-transition-fast);white-space:nowrap;box-shadow:var(--sp-shadow-sm);border:1px solid var(--sp-color-border)}.sp-progress-container.sp-is-scrubbing .sp-progress-tooltip,.sp-progress-container:hover .sp-progress-tooltip{opacity:1}.sp-time-display{display:flex;align-items:center;gap:4px;font-variant-numeric:tabular-nums;font-size:var(--sp-font-size-xs);color:var(--sp-color-text-muted);cursor:pointer;padding:2px 6px;border-radius:var(--sp-radius-xs);transition:color var(--sp-transition-fast)}.sp-time-display:hover{color:var(--sp-color-text)}.sp-time-current{color:var(--sp-color-text);font-weight:500}.sp-volume-control{display:flex;align-items:center;gap:var(--sp-space-1)}.sp-volume-slider-container{width:0;height:28px;display:flex;align-items:center;overflow:hidden;opacity:0;cursor:pointer;transition:width var(--sp-transition-normal),opacity var(--sp-transition-normal)}.sp-volume-control:focus-within .sp-volume-slider-container,.sp-volume-control:hover .sp-volume-slider-container,.sp-volume-slider-container.sp-is-dragging{width:64px;opacity:1}.sp-volume-track{position:relative;width:100%;height:4px;background-color:var(--sp-color-track);border-radius:var(--sp-radius-full)}.sp-volume-filled{position:absolute;top:0;left:0;height:100%;width:100%;background-color:var(--sp-color-text);border-radius:var(--sp-radius-full)}.sp-volume-thumb{position:absolute;top:50%;left:100%;transform:translate(-50%,-50%);width:10px;height:10px;background-color:#fff;border-radius:var(--sp-radius-full);pointer-events:none}.sp-settings-container{position:relative}.sp-settings-menu{position:absolute;bottom:calc(100% + 12px);right:0;width:220px;background:var(--sp-color-bg);backdrop-filter:var(--sp-glass-backdrop);-webkit-backdrop-filter:var(--sp-glass-backdrop);border:1px solid var(--sp-color-border);border-radius:var(--sp-radius-md);box-shadow:var(--sp-shadow-lg);padding:var(--sp-space-1);display:flex;flex-direction:column;z-index:var(--sp-z-menu);animation:sp-menu-fade-in var(--sp-transition-fast)}@keyframes sp-menu-fade-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.sp-menu-item{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--sp-space-2) var(--sp-space-3);background:0 0;border:none;border-radius:var(--sp-radius-sm);color:var(--sp-color-text);font-size:var(--sp-font-size-xs);cursor:pointer;text-align:left;transition:background-color var(--sp-transition-fast)}.sp-menu-item:hover{background-color:var(--sp-color-surface-hover)}.sp-menu-item:focus-visible{outline:var(--sp-focus-ring)}.sp-menu-label{flex:1}.sp-menu-value{color:var(--sp-color-text-muted);font-size:11px}.sp-menu-header{border-bottom:1px solid var(--sp-color-border);padding-bottom:var(--sp-space-2);margin-bottom:var(--sp-space-1);font-weight:600}.sp-menu-back{font-size:16px;line-height:1;margin-right:var(--sp-space-2)}.sp-radio-item.sp-selected{color:var(--sp-color-primary);font-weight:500}.sp-menu-switch{position:relative;width:32px;height:18px;background-color:var(--sp-color-surface);border-radius:var(--sp-radius-full);border:1px solid var(--sp-color-border);transition:background-color var(--sp-transition-fast)}.sp-menu-switch::after{content:'';position:absolute;top:2px;left:2px;width:12px;height:12px;background-color:#fff;border-radius:var(--sp-radius-full);transition:transform var(--sp-transition-fast)}.sp-menu-switch.sp-switch-on{background-color:var(--sp-color-primary);border-color:var(--sp-color-primary)}.sp-menu-switch.sp-switch-on::after{transform:translateX(14px)}.sp-spinner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:var(--sp-z-spinner);color:var(--sp-color-primary);pointer-events:none}.sp-spinner-svg{animation:1s linear infinite sp-spin}@keyframes sp-spin{100%{transform:rotate(360deg)}}.sp-error-display{position:absolute;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.85);backdrop-filter:var(--sp-glass-backdrop);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-space-4);padding:var(--sp-space-6);text-align:center;z-index:var(--sp-z-modal)}.sp-error-message{color:var(--sp-color-danger);font-size:var(--sp-font-size-md);max-width:400px}.sp-error-retry{background:var(--sp-color-surface);border:1px solid var(--sp-color-border);color:var(--sp-color-text);padding:var(--sp-space-2) var(--sp-space-4);border-radius:var(--sp-radius-sm);cursor:pointer;font-size:var(--sp-font-size-xs);transition:background-color var(--sp-transition-fast)}.sp-error-retry:hover{background:var(--sp-color-surface-hover)}.sp-modal-backdrop{position:absolute;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.7);backdrop-filter:var(--sp-glass-backdrop);-webkit-backdrop-filter:var(--sp-glass-backdrop);display:flex;align-items:center;justify-content:center;z-index:var(--sp-z-modal);animation:.2s ease-out sp-modal-fade}@keyframes sp-modal-fade{from{opacity:0}to{opacity:1}}.sp-modal-content{background:var(--sp-color-bg);border:1px solid var(--sp-color-border);border-radius:var(--sp-radius-md);padding:var(--sp-space-5);width:90%;max-width:420px;box-shadow:var(--sp-shadow-lg)}.sp-modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-space-4)}.sp-modal-title{margin:0;font-size:var(--sp-font-size-md);font-weight:600}.sp-modal-close{background:0 0;border:none;color:var(--sp-color-text-muted);cursor:pointer;padding:4px;border-radius:var(--sp-radius-xs)}.sp-modal-close:hover{color:var(--sp-color-text)}.sp-shortcuts-grid{display:flex;flex-direction:column;gap:var(--sp-space-2)}.sp-shortcut-row{display:flex;align-items:center;justify-content:space-between;font-size:var(--sp-font-size-xs);color:var(--sp-color-text-muted)}.sp-shortcut-row kbd{background-color:var(--sp-color-surface);border:1px solid var(--sp-color-border);border-radius:var(--sp-radius-xs);padding:2px 6px;font-family:monospace;font-size:11px;color:var(--sp-color-text)}video.sopplayer,video.video-js{display:block;width:100%}.video-js .vjs-big-play-button{cursor:pointer;border-radius:var(--sp-radius-md,8px)}.sopplayer .vjs-play-control .vjs-icon-placeholder:before{content:"";background-image:url('svg/play.svg');background-repeat:no-repeat;background-position:center;background-size:24px}.sopplayer .vjs-play-control.vjs-playing .vjs-icon-placeholder:before{content:"";background-image:url('svg/pause.svg');background-repeat:no-repeat;background-position:center;background-size:24px}.sp-player.sp-theme-default{--sp-color-primary:#38bdf8;--sp-color-primary-hover:#0ea5e9;--sp-color-primary-glow:rgba(56, 189, 248, 0.4);--sp-focus-ring:2px solid #38bdf8}.sp-player.sp-theme-flamingo{--sp-color-primary:#f43f5e;--sp-color-primary-hover:#e11d48;--sp-color-primary-glow:rgba(244, 63, 94, 0.45);--sp-color-surface-hover:rgba(244, 63, 94, 0.15);--sp-focus-ring:2px solid #f43f5e}.sp-player.sp-theme-forest{--sp-color-primary:#10b981;--sp-color-primary-hover:#059669;--sp-color-primary-glow:rgba(16, 185, 129, 0.45);--sp-color-surface-hover:rgba(16, 185, 129, 0.15);--sp-focus-ring:2px solid #10b981}.sp-player.sp-theme-city{--sp-color-primary:#f59e0b;--sp-color-primary-hover:#d97706;--sp-color-primary-glow:rgba(245, 158, 11, 0.45);--sp-color-surface-hover:rgba(245, 158, 11, 0.15);--sp-focus-ring:2px solid #f59e0b}.sp-player.sp-theme-sea{--sp-color-primary:#06b6d4;--sp-color-primary-hover:#0891b2;--sp-color-primary-glow:rgba(6, 182, 212, 0.45);--sp-color-surface-hover:rgba(6, 182, 212, 0.15);--sp-focus-ring:2px solid #06b6d4}.sp-player.sp-theme-fantasy{--sp-color-primary:#a855f7;--sp-color-primary-hover:#9333ea;--sp-color-primary-glow:rgba(168, 85, 247, 0.45);--sp-color-surface-hover:rgba(168, 85, 247, 0.15);--sp-focus-ring:2px solid #a855f7}.sp-player.sp-theme-minimal{--sp-color-bg:rgba(0, 0, 0, 0.9);--sp-color-surface:rgba(255, 255, 255, 0.1);--sp-color-surface-hover:rgba(255, 255, 255, 0.2);--sp-color-primary:#ffffff;--sp-color-primary-hover:#e2e8f0;--sp-color-primary-glow:rgba(255, 255, 255, 0.3);--sp-focus-ring:2px solid #ffffff}