npm - @livepeer-frameworks/player-wc - Versions diffs - 0.1.4 → 0.1.5 - Mend

@livepeer-frameworks/player-wc 0.1.4 → 0.1.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (23) hide show

package/dist/cjs/components/fw-dev-mode-panel.js +1 -0
package/dist/cjs/components/fw-dev-mode-panel.js.map +1 -1
package/dist/cjs/components/fw-player-controls.js +0 -34
package/dist/cjs/components/fw-player-controls.js.map +1 -1
package/dist/cjs/components/fw-player.js +1 -4
package/dist/cjs/components/fw-player.js.map +1 -1
package/dist/cjs/styles/shared-styles.js +18 -0
package/dist/cjs/styles/shared-styles.js.map +1 -1
package/dist/esm/components/fw-dev-mode-panel.js +1 -0
package/dist/esm/components/fw-dev-mode-panel.js.map +1 -1
package/dist/esm/components/fw-player-controls.js +0 -34
package/dist/esm/components/fw-player-controls.js.map +1 -1
package/dist/esm/components/fw-player.js +1 -4
package/dist/esm/components/fw-player.js.map +1 -1
package/dist/esm/styles/shared-styles.js +18 -0
package/dist/esm/styles/shared-styles.js.map +1 -1
package/dist/fw-player.iife.js +22 -24
package/dist/types/components/fw-player-controls.d.ts +0 -1
package/package.json +2 -2
package/src/components/fw-dev-mode-panel.ts +1 -0
package/src/components/fw-player-controls.ts +0 -34
package/src/components/fw-player.ts +1 -4
package/src/styles/shared-styles.ts +18 -0

package/dist/esm/components/fw-player.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"fw-player.js","sources":["../../../../src/components/fw-player.ts"],"sourcesContent":["/*\n <fw-player> — Main player web component.\n * Port of Player.tsx / PlayerInner from player-react.\n */\nimport { LitElement, html, css, nothing, type PropertyValues } from \"lit\";\nimport { customElement, property, state, query } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { PlayerControllerHost } from \"../controllers/player-controller-host.js\";\nimport { sharedStyles } from \"../styles/shared-styles.js\";\nimport { utilityStyles } from \"../styles/utility-styles.js\";\nimport {\n closeIcon,\n statsIcon,\n settingsIcon,\n pictureInPictureIcon,\n loopIcon,\n} from \"../icons/index.js\";\nimport type { ContentEndpoints, PlaybackMode } from \"@livepeer-frameworks/player-core\";\n\n@customElement(\"fw-player\")\nexport class FwPlayer extends LitElement {\n // ---- Public attributes (reflected) ----\n @property({ attribute: \"content-id\" }) contentId = \"\";\n @property({ attribute: \"content-type\" }) contentType?: \"live\" \| \"dvr\" \| \"clip\" \| \"vod\";\n @property({ attribute: \"gateway-url\" }) gatewayUrl?: string;\n @property({ attribute: \"mist-url\" }) mistUrl?: string;\n @property({ attribute: \"auth-token\" }) authToken?: string;\n @property({ type: Boolean }) autoplay = true;\n @property({ type: Boolean }) muted = true;\n // React/Svelte use `stockControls` for native controls. Keep `controls` as a\n // compatibility no-op so WC parity does not hide custom controls/seekbar.\n @property({ type: Boolean }) controls = false;\n @property({ type: Boolean, attribute: \"stock-controls\" }) stockControls = false;\n @property({ type: Boolean, attribute: \"native-controls\" }) nativeControls = false;\n @property({ type: Boolean }) debug = false;\n @property({ type: Boolean, attribute: \"dev-mode\" }) devMode = false;\n @property({ attribute: \"thumbnail-url\" }) thumbnailUrl?: string;\n @property({ attribute: \"playback-mode\" }) playbackMode: PlaybackMode = \"auto\";\n\n // ---- JS-only properties (not reflected) ----\n @property({ attribute: false }) endpoints?: ContentEndpoints;\n\n // ---- Internal state ----\n @state() private _isStatsOpen = false;\n @state() private _isDevPanelOpen = false;\n @state() private _skipDirection: \"back\" \| \"forward\" \| null = null;\n @state() private _contextMenuOpen = false;\n @state() private _contextMenuMounted = false;\n @state() private _contextMenuState: \"open\" \| \"closed\" = \"closed\";\n @state() private _contextMenuSide: \"top\" \| \"bottom\" \| \"left\" \| \"right\" = \"bottom\";\n @state() private _contextMenuActiveLevel: \"root\" \| \"submenu\" = \"root\";\n @state() private _contextMenuOpenSubmenu: \"playback-mode\" \| null = null;\n @state() private _contextMenuSubmenuSide: \"left\" \| \"right\" = \"right\";\n @state() private _contextMenuX = 0;\n @state() private _contextMenuY = 0;\n\n // ---- Refs ----\n @query(\"#container\") private _containerEl!: HTMLDivElement;\n\n // ---- Controller ----\n pc = new PlayerControllerHost(this);\n\n static styles = [\n sharedStyles,\n utilityStyles,\n css`\n :host {\n display: block;\n position: relative;\n width: 100%;\n height: 100%;\n contain: layout style;\n }\n :host([hidden]) {\n display: none;\n }\n .player-area {\n position: relative;\n width: 100%;\n height: 100%;\n }\n .player-area--dev {\n flex: 1;\n min-width: 0;\n }\n `,\n ];\n\n // ---- Lifecycle ----\n\n protected willUpdate(changed: PropertyValues) {\n if (\n changed.has(\"contentId\") \|\|\n changed.has(\"contentType\") \|\|\n changed.has(\"gatewayUrl\") \|\|\n changed.has(\"mistUrl\") \|\|\n changed.has(\"authToken\") \|\|\n changed.has(\"autoplay\") \|\|\n changed.has(\"muted\") \|\|\n changed.has(\"stockControls\") \|\|\n changed.has(\"nativeControls\") \|\|\n changed.has(\"debug\") \|\|\n changed.has(\"thumbnailUrl\") \|\|\n changed.has(\"endpoints\")\n ) {\n this.pc.configure({\n contentId: this.contentId,\n contentType: this.contentType,\n endpoints: this.endpoints,\n gatewayUrl: this.gatewayUrl,\n mistUrl: this.mistUrl,\n authToken: this.authToken,\n autoplay: this.autoplay,\n muted: this.muted,\n controls: this.stockControls \|\| this.nativeControls,\n poster: this.thumbnailUrl,\n debug: this.debug,\n });\n }\n }\n\n protected firstUpdated() {\n this.pc.attach(this._containerEl);\n\n // Close context menu on outside click\n document.addEventListener(\"pointerdown\", this._handleDocumentPointerDown);\n document.addEventListener(\"contextmenu\", this._handleDocumentContextMenu);\n document.addEventListener(\"keydown\", this._handleDocumentKeyDown);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n document.removeEventListener(\"pointerdown\", this._handleDocumentPointerDown);\n document.removeEventListener(\"contextmenu\", this._handleDocumentContextMenu);\n document.removeEventListener(\"keydown\", this._handleDocumentKeyDown);\n if (this._contextMenuCloseTimer) {\n clearTimeout(this._contextMenuCloseTimer);\n this._contextMenuCloseTimer = undefined;\n }\n this._resetContextMenuTypeahead();\n }\n\n // ---- Context Menu ----\n\n private _contextMenuCloseTimer?: ReturnType<typeof setTimeout>;\n private _contextMenuTypeahead = \"\";\n private _contextMenuTypeaheadTimer?: ReturnType<typeof setTimeout>;\n\n private _resetContextMenuTypeahead = () => {\n this._contextMenuTypeahead = \"\";\n if (this._contextMenuTypeaheadTimer) {\n clearTimeout(this._contextMenuTypeaheadTimer);\n this._contextMenuTypeaheadTimer = undefined;\n }\n };\n\n private _resolveContextMenuSide = (\n rawX: number,\n rawY: number,\n clampedX: number,\n clampedY: number\n ) => {\n const deltaX = Math.abs(rawX - clampedX);\n const deltaY = Math.abs(rawY - clampedY);\n\n if (deltaX === 0 && deltaY === 0) {\n return \"bottom\";\n }\n\n if (deltaY >= deltaX) {\n return rawY > clampedY ? \"top\" : \"bottom\";\n }\n\n return rawX > clampedX ? \"left\" : \"right\";\n };\n\n private _closeContextMenu = (restoreFocus = false) => {\n this._contextMenuOpen = false;\n this._contextMenuState = \"closed\";\n this._contextMenuActiveLevel = \"root\";\n this._contextMenuOpenSubmenu = null;\n this._resetContextMenuTypeahead();\n if (this._contextMenuCloseTimer) {\n clearTimeout(this._contextMenuCloseTimer);\n }\n this._contextMenuCloseTimer = setTimeout(() => {\n if (!this._contextMenuOpen) {\n this._contextMenuMounted = false;\n }\n }, 170);\n\n if (restoreFocus) {\n const root = this.shadowRoot?.querySelector<HTMLElement>('[part=\"root\"]');\n root?.focus();\n }\n };\n\n private _getQueryRoot = (): ShadowRoot \| null => {\n return (\n this.shadowRoot ?? (this as unknown as { renderRoot?: ShadowRoot \| null }).renderRoot ?? null\n );\n };\n\n private _getContextMenuElement = () =>\n this._getQueryRoot()?.querySelector<HTMLElement>('[data-context-menu=\"true\"]') ?? null;\n\n private _getContextMenuBounds = () => {\n const root = this._getQueryRoot()?.querySelector<HTMLElement>('[part=\"root\"]');\n const rect = root?.getBoundingClientRect() ?? this.getBoundingClientRect();\n\n const width = rect.width > 0 ? rect.width : window.innerWidth;\n const height = rect.height > 0 ? rect.height : window.innerHeight;\n\n return {\n left: rect.left,\n top: rect.top,\n right: rect.left + width,\n bottom: rect.top + height,\n width,\n height,\n };\n };\n\n private _toLocalContextMenuPoint = (clientX: number, clientY: number) => {\n const bounds = this._getContextMenuBounds();\n return {\n x: clientX - bounds.left,\n y: clientY - bounds.top,\n };\n };\n\n private _getContextMenuItems = (level: \"root\" \| \"submenu\" = this._contextMenuActiveLevel) =>\n Array.from(\n this._getQueryRoot()?.querySelectorAll<HTMLButtonElement>(\n `[data-context-menu-item=\"true\"][data-context-menu-level=\"${level}\"]:not([data-disabled=\"true\"])`\n ) ?? []\n );\n\n private _focusFirstContextMenuItem = (\n level: \"root\" \| \"submenu\" = this._contextMenuActiveLevel\n ) => {\n const [firstItem] = this._getContextMenuItems(level);\n firstItem?.focus();\n };\n\n private _focusPlaybackModeTrigger = () => {\n const trigger = this._getQueryRoot()?.querySelector<HTMLButtonElement>(\n '[data-context-menu-trigger=\"playback-mode\"]'\n );\n trigger?.focus();\n };\n\n private _openPlaybackModeSubmenu = () => {\n this._contextMenuOpenSubmenu = \"playback-mode\";\n this._contextMenuActiveLevel = \"submenu\";\n this._resetContextMenuTypeahead();\n queueMicrotask(() => {\n this._syncPlaybackModeSubmenuSide();\n this._focusFirstContextMenuItem(\"submenu\");\n });\n };\n\n private _closePlaybackModeSubmenu = (restoreTriggerFocus = false) => {\n this._contextMenuOpenSubmenu = null;\n this._contextMenuActiveLevel = \"root\";\n this._resetContextMenuTypeahead();\n if (restoreTriggerFocus) {\n this._focusPlaybackModeTrigger();\n }\n };\n\n private _clampContextMenuPosition = (x: number, y: number, width: number, height: number) => {\n const viewportPadding = 8;\n const bounds = this._getContextMenuBounds();\n const maxX = Math.max(viewportPadding, bounds.width - width - viewportPadding);\n const maxY = Math.max(viewportPadding, bounds.height - height - viewportPadding);\n\n return {\n x: Math.max(viewportPadding, Math.min(x, maxX)),\n y: Math.max(viewportPadding, Math.min(y, maxY)),\n };\n };\n\n private _syncContextMenuPosition = () => {\n if (!this._contextMenuMounted) return;\n const menu = this._getContextMenuElement();\n if (!menu) return;\n\n const rect = menu.getBoundingClientRect();\n const next = this._clampContextMenuPosition(\n this._contextMenuX,\n this._contextMenuY,\n rect.width,\n rect.height\n );\n this._contextMenuSide = this._resolveContextMenuSide(\n this._contextMenuX,\n this._contextMenuY,\n next.x,\n next.y\n );\n if (next.x !== this._contextMenuX \|\| next.y !== this._contextMenuY) {\n this._contextMenuX = next.x;\n this._contextMenuY = next.y;\n }\n };\n\n private _syncPlaybackModeSubmenuSide = () => {\n if (this._contextMenuOpenSubmenu !== \"playback-mode\") return;\n const menu = this._getContextMenuElement();\n if (!menu) return;\n const bounds = this._getContextMenuBounds();\n const rect = menu.getBoundingClientRect();\n const estimatedSubmenuWidth = 190;\n this._contextMenuSubmenuSide =\n rect.right + estimatedSubmenuWidth > bounds.right - 8 ? \"left\" : \"right\";\n };\n\n private _openContextMenu = (clientX: number, clientY: number) => {\n const local = this._toLocalContextMenuPoint(clientX, clientY);\n const next = this._clampContextMenuPosition(local.x, local.y, 220, 200);\n this._contextMenuSide = this._resolveContextMenuSide(local.x, local.y, next.x, next.y);\n this._contextMenuX = next.x;\n this._contextMenuY = next.y;\n this._contextMenuMounted = true;\n this._contextMenuState = \"open\";\n this._contextMenuActiveLevel = \"root\";\n this._contextMenuOpenSubmenu = null;\n if (this._contextMenuCloseTimer) {\n clearTimeout(this._contextMenuCloseTimer);\n this._contextMenuCloseTimer = undefined;\n }\n this._resetContextMenuTypeahead();\n this._contextMenuOpen = true;\n };\n\n private _handleContextMenu = (e: MouseEvent) => {\n const target = e.target as HTMLElement \| null;\n if (target?.closest('[data-context-menu=\"true\"]')) {\n e.preventDefault();\n return;\n }\n\n e.preventDefault();\n this._openContextMenu(e.clientX, e.clientY);\n };\n\n private _handleContextMenuShortcut = (e: KeyboardEvent) => {\n const isContextMenuKey = e.key === \"ContextMenu\";\n const isShiftF10 = e.key === \"F10\" && e.shiftKey;\n if (!isContextMenuKey && !isShiftF10) return;\n\n e.preventDefault();\n const rect = this.getBoundingClientRect();\n const x = rect.left + rect.width / 2;\n const y = rect.top + rect.height / 2;\n this._openContextMenu(x, y);\n };\n\n private _handleDocumentPointerDown = (e: PointerEvent) => {\n if (!this._contextMenuOpen) return;\n const menu = this._getContextMenuElement();\n const composedPath = e.composedPath();\n if (menu && composedPath.includes(menu)) return;\n this._closeContextMenu();\n };\n\n private _handleDocumentContextMenu = (e: MouseEvent) => {\n if (!this._contextMenuOpen) return;\n if (!this.contains(e.target as Node)) {\n this._closeContextMenu();\n }\n };\n\n private _handleDocumentKeyDown = (e: KeyboardEvent) => {\n if (e.key === \"Escape\" && this._contextMenuOpen) {\n e.preventDefault();\n this._closeContextMenu(true);\n }\n };\n\n private _handleContextMenuKeyDown = (e: KeyboardEvent) => {\n if (!this._contextMenuOpen) return;\n const activeElement = this.shadowRoot?.activeElement as HTMLButtonElement \| null;\n\n if (e.key === \"Escape\") {\n e.preventDefault();\n if (this._contextMenuActiveLevel === \"submenu\") {\n this._closePlaybackModeSubmenu(true);\n } else {\n this._closeContextMenu(true);\n }\n return;\n }\n\n if (e.key === \"Tab\") {\n this._closeContextMenu();\n return;\n }\n\n if (e.key === \"ArrowRight\" && this._contextMenuActiveLevel === \"root\") {\n if (activeElement?.dataset.contextMenuTrigger === \"playback-mode\") {\n e.preventDefault();\n this._openPlaybackModeSubmenu();\n }\n return;\n }\n\n if (e.key === \"ArrowLeft\" && this._contextMenuActiveLevel === \"submenu\") {\n e.preventDefault();\n this._closePlaybackModeSubmenu(true);\n return;\n }\n\n const items = this._getContextMenuItems(this._contextMenuActiveLevel);\n if (items.length === 0) return;\n const activeIndex = items.findIndex((item) => item === activeElement);\n\n if (e.key === \"Home\") {\n e.preventDefault();\n this._focusFirstContextMenuItem(this._contextMenuActiveLevel);\n return;\n }\n\n if (e.key === \"End\") {\n e.preventDefault();\n items[items.length - 1]?.focus();\n return;\n }\n\n if (e.key === \"ArrowDown\" \|\| e.key === \"ArrowUp\") {\n e.preventDefault();\n const direction = e.key === \"ArrowDown\" ? 1 : -1;\n const startIndex =\n activeIndex === -1 ? (direction === 1 ? 0 : items.length - 1) : activeIndex;\n const nextIndex = (startIndex + direction + items.length) % items.length;\n items[nextIndex]?.focus();\n return;\n }\n\n if (e.key === \"Enter\" \|\| e.key === \" \") {\n if (activeElement) {\n e.preventDefault();\n activeElement.click();\n }\n return;\n }\n\n if (e.key.length === 1 && !e.metaKey && !e.ctrlKey && !e.altKey) {\n e.preventDefault();\n this._contextMenuTypeahead += e.key.toLowerCase();\n if (this._contextMenuTypeaheadTimer) {\n clearTimeout(this._contextMenuTypeaheadTimer);\n }\n this._contextMenuTypeaheadTimer = setTimeout(() => {\n this._resetContextMenuTypeahead();\n }, 700);\n\n const startIndex = activeIndex === -1 ? 0 : activeIndex + 1;\n const orderedItems = [...items.slice(startIndex), ...items.slice(0, startIndex)];\n const match = orderedItems.find((item) =>\n item.textContent?.trim().toLowerCase().startsWith(this._contextMenuTypeahead)\n );\n match?.focus();\n }\n };\n\n // ---- Toast auto-dismiss ----\n\n private _toastTimer?: ReturnType<typeof setTimeout>;\n\n protected updated(changed: PropertyValues) {\n if (this.pc.s.toast) {\n clearTimeout(this._toastTimer);\n this._toastTimer = setTimeout(() => this.pc.dismissToast(), 3000);\n }\n\n if (\n (changed.has(\"_contextMenuOpen\") \|\| changed.has(\"_contextMenuMounted\")) &&\n this._contextMenuOpen\n ) {\n queueMicrotask(() => {\n this._syncContextMenuPosition();\n this._focusFirstContextMenuItem(\"root\");\n });\n }\n\n if (\n changed.has(\"_contextMenuOpenSubmenu\") &&\n this._contextMenuOpenSubmenu === \"playback-mode\"\n ) {\n queueMicrotask(() => {\n this._syncPlaybackModeSubmenuSide();\n });\n }\n }\n\n // ---- Derived state ----\n\n private get _showTitleOverlay() {\n const s = this.pc.s;\n return (s.isHovering \|\| s.isPaused) && !s.shouldShowIdleScreen && !s.isBuffering && !s.error;\n }\n\n private get _showBufferingSpinner() {\n const s = this.pc.s;\n return !s.shouldShowIdleScreen && s.isBuffering && !s.error && s.hasPlaybackStarted;\n }\n\n private get _showWaitingForEndpoint() {\n const s = this.pc.s;\n return !s.endpoints?.primary && s.state !== \"booting\";\n }\n\n private get _waitingMessage() {\n const s = this.pc.s;\n if (this.gatewayUrl && s.state === \"gateway_loading\") {\n return \"Resolving viewing endpoint...\";\n }\n return \"Waiting for endpoint...\";\n }\n\n private get _useStockControls() {\n return (\n this.stockControls \|\|\n this.nativeControls \|\|\n this.pc.s.currentPlayerInfo?.shortname === \"mist-legacy\"\n );\n }\n\n // ---- Public API methods ----\n\n async play() {\n await this.pc.play();\n }\n pause() {\n this.pc.pause();\n }\n togglePlay() {\n this.pc.togglePlay();\n }\n seek(time: number) {\n this.pc.seek(time);\n }\n seekBy(delta: number) {\n this.pc.seekBy(delta);\n }\n jumpToLive() {\n this.pc.jumpToLive();\n }\n setVolume(volume: number) {\n this.pc.setVolume(volume);\n }\n toggleMute() {\n this.pc.toggleMute();\n }\n toggleLoop() {\n this.pc.toggleLoop();\n }\n async toggleFullscreen() {\n await this.pc.toggleFullscreen();\n }\n async togglePiP() {\n await this.pc.togglePiP();\n }\n toggleSubtitles() {\n this.pc.toggleSubtitles();\n }\n async retry() {\n await this.pc.retry();\n }\n async reload() {\n await this.pc.reload();\n }\n getQualities() {\n return this.pc.getQualities();\n }\n selectQuality(id: string) {\n this.pc.selectQuality(id);\n }\n destroy() {\n this.pc.hostDisconnected();\n }\n\n // ---- Render ----\n\n protected render() {\n const s = this.pc.s;\n\n return html`\n <div\n part=\"root\"\n class=${classMap({\n \"fw-player-surface\": true,\n \"fw-player-root\": true,\n \"w-full\": true,\n \"h-full\": true,\n \"overflow-hidden\": true,\n flex: this.devMode,\n })}\n data-player-container=\"true\"\n tabindex=\"0\"\n @mouseenter=${() => this.pc.handleMouseEnter()}\n @mouseleave=${() => this.pc.handleMouseLeave()}\n @mousemove=${() => this.pc.handleMouseMove()}\n @touchstart=${() => this.pc.handleTouchStart()}\n @keydown=${this._handleContextMenuShortcut}\n @contextmenu=${this._handleContextMenu}\n >\n <!-- Player area -->\n <div\n class=${classMap({\n \"player-area\": true,\n \"player-area--dev\": this.devMode,\n })}\n >\n <!-- Video container -->\n <div id=\"container\" part=\"video-container\" class=\"fw-player-container\"></div>\n\n <!-- Subtitle renderer -->\n ${s.subtitlesEnabled\n ? html`\n <fw-subtitle-renderer\n .currentTime=${s.currentTime}\n .enabled=${s.subtitlesEnabled}\n ></fw-subtitle-renderer>\n `\n : nothing}\n\n <!-- Title overlay -->\n ${this._showTitleOverlay\n ? html`\n <fw-title-overlay\n .title=${s.metadata?.title ?? null}\n .description=${s.metadata?.description ?? null}\n ></fw-title-overlay>\n `\n : nothing}\n\n <!-- Stats panel -->\n ${this._isStatsOpen\n ? html`\n <fw-stats-panel\n part=\"stats-panel\"\n .pc=${this.pc}\n @fw-close=${() => {\n this._isStatsOpen = false;\n }}\n ></fw-stats-panel>\n `\n : nothing}\n\n <!-- Speed indicator -->\n ${s.isHoldingSpeed\n ? html` <fw-speed-indicator .speed=${s.holdSpeed}></fw-speed-indicator> `\n : nothing}\n\n <!-- Skip indicator -->\n <fw-skip-indicator\n .direction=${this._skipDirection}\n @fw-hide=${() => {\n this._skipDirection = null;\n }}\n ></fw-skip-indicator>\n\n <!-- Waiting for endpoint -->\n ${this._showWaitingForEndpoint\n ? html`\n <fw-idle-screen\n status=\"OFFLINE\"\n .message=${this._waitingMessage}\n @fw-retry=${() => {\n this.pc.clearError();\n this.pc.retry();\n }}\n ></fw-idle-screen>\n `\n : nothing}\n\n <!-- Idle screen -->\n ${!this._showWaitingForEndpoint && s.shouldShowIdleScreen\n ? html`\n <fw-idle-screen\n .status=${s.isEffectivelyLive ? s.streamState?.status : undefined}\n .message=${s.isEffectivelyLive ? s.streamState?.message : \"Loading video...\"}\n .percentage=${s.isEffectivelyLive ? s.streamState?.percentage : undefined}\n @fw-retry=${() => {\n this.pc.clearError();\n this.pc.retry();\n }}\n ></fw-idle-screen>\n `\n : nothing}\n\n <!-- Buffering spinner -->\n ${this._showBufferingSpinner\n ? html`\n <div\n role=\"status\"\n aria-live=\"polite\"\n class=\"fw-player-surface absolute inset-0 flex items-center justify-center bg-black/40 backdrop-blur-sm z-20\"\n >\n <div\n class=\"flex items-center gap-3 rounded-lg border border-white/10 bg-black/70 px-4 py-3 text-sm text-white shadow-lg\"\n >\n <div\n class=\"w-4 h-4 border-2 border-white/10 rounded-full animate-spin\"\n style=\"border-top-color: white;\"\n ></div>\n <span>Buffering...</span>\n </div>\n </div>\n `\n : nothing}\n\n <!-- Error overlay -->\n ${!s.shouldShowIdleScreen && s.error\n ? html`\n <div\n role=\"alert\"\n aria-live=\"assertive\"\n class=${classMap({\n \"fw-error-overlay\": true,\n \"fw-error-overlay--passive\": s.isPassiveError,\n \"fw-error-overlay--fullscreen\": !s.isPassiveError,\n })}\n >\n <div\n class=${classMap({\n \"fw-error-popup\": true,\n \"fw-error-popup--passive\": s.isPassiveError,\n \"fw-error-popup--fullscreen\": !s.isPassiveError,\n })}\n >\n <div\n class=${classMap({\n \"fw-error-header\": true,\n \"fw-error-header--warning\": s.isPassiveError,\n \"fw-error-header--error\": !s.isPassiveError,\n })}\n >\n <span\n class=${classMap({\n \"fw-error-title\": true,\n \"fw-error-title--warning\": s.isPassiveError,\n \"fw-error-title--error\": !s.isPassiveError,\n })}\n >${s.isPassiveError ? \"Warning\" : \"Error\"}</span\n >\n <button\n type=\"button\"\n class=\"fw-error-close\"\n @click=${() => this.pc.clearError()}\n aria-label=\"Dismiss\"\n >\n ${closeIcon()}\n </button>\n </div>\n <div class=\"fw-error-body\">\n <p class=\"fw-error-message\">Playback issue</p>\n </div>\n <div class=\"fw-error-actions\">\n <button\n type=\"button\"\n class=\"fw-error-btn\"\n aria-label=\"Retry playback\"\n @click=${() => {\n this.pc.clearError();\n this.pc.retry();\n }}\n >\n Retry\n </button>\n </div>\n </div>\n </div>\n `\n : nothing}\n\n <!-- Toast notification -->\n ${s.toast\n ? html`\n <div\n class=\"absolute bottom-20 left-1/2 -translate-x-1/2 z-30\"\n role=\"status\"\n aria-live=\"polite\"\n >\n <div\n class=\"flex items-center gap-2 rounded-lg border border-white/10 bg-black/80 px-4 py-2 text-sm text-white shadow-lg backdrop-blur-sm\"\n >\n <span>${s.toast.message}</span>\n <button\n type=\"button\"\n @click=${() => this.pc.dismissToast()}\n class=\"ml-0.5 text-white/60 hover\\\\:text-white cursor-pointer\"\n aria-label=\"Dismiss\"\n >\n ${closeIcon()}\n </button>\n </div>\n </div>\n `\n : nothing}\n\n <!-- Player controls -->\n ${!this._useStockControls\n ? html`\n <fw-player-controls\n part=\"controls\"\n .pc=${this.pc}\n .playbackMode=${this.playbackMode}\n .isContentLive=${s.isEffectivelyLive}\n .devMode=${this.devMode}\n .isDevPanelOpen=${this._isDevPanelOpen}\n .isStatsOpen=${this._isStatsOpen}\n @fw-stats-toggle=${() => {\n this._isStatsOpen = !this._isStatsOpen;\n }}\n @fw-dev-panel-toggle=${() => {\n this._isDevPanelOpen = !this._isDevPanelOpen;\n }}\n @fw-mode-change=${(event: CustomEvent<{ mode: PlaybackMode }>) => {\n this.playbackMode = event.detail.mode;\n }}\n ></fw-player-controls>\n `\n : nothing}\n </div>\n\n <!-- Dev mode side panel -->\n ${this.devMode && this._isDevPanelOpen\n ? html`\n <fw-dev-mode-panel\n .pc=${this.pc}\n .playbackMode=${this.playbackMode}\n @fw-close=${() => {\n this._isDevPanelOpen = false;\n }}\n @fw-playback-mode-change=${(event: CustomEvent<{ mode: PlaybackMode }>) => {\n this.playbackMode = event.detail.mode;\n }}\n ></fw-dev-mode-panel>\n `\n : nothing}\n </div>\n\n <!-- Context menu -->\n <!-- Keep menu in-shadow (no document portal) to preserve host-scoped styling and avoid a global overlay manager. -->\n ${this._contextMenuMounted\n ? html`\n <div\n data-context-menu=\"true\"\n data-state=${this._contextMenuState}\n data-side=${this._contextMenuSide}\n class=\"fw-player-surface fw-context-menu\"\n role=\"menu\"\n aria-label=\"Player options\"\n tabindex=\"-1\"\n style=\"position: absolute; left: ${this._contextMenuX}px; top: ${this\n ._contextMenuY}px;\"\n @contextmenu=${(e: MouseEvent) => e.preventDefault()}\n @keydown=${this._handleContextMenuKeyDown}\n >\n <button\n type=\"button\"\n role=\"menuitem\"\n tabindex=\"-1\"\n data-context-menu-item=\"true\"\n data-context-menu-level=\"root\"\n class=\"fw-context-menu-item gap-2\"\n @click=${() => {\n this._isStatsOpen = !this._isStatsOpen;\n this._closeContextMenu();\n }}\n >\n <span class=\"opacity-70 shrink-0\">${statsIcon(14)}</span>\n <span>${this._isStatsOpen ? \"Hide Stats\" : \"Stats\"}</span>\n </button>\n ${this.devMode\n ? html`\n <div class=\"fw-context-menu-separator\"></div>\n <button\n type=\"button\"\n role=\"menuitem\"\n tabindex=\"-1\"\n data-context-menu-item=\"true\"\n data-context-menu-level=\"root\"\n class=\"fw-context-menu-item gap-2\"\n @click=${() => {\n this._isDevPanelOpen = !this._isDevPanelOpen;\n this._closeContextMenu();\n }}\n >\n <span class=\"opacity-70 shrink-0\">${settingsIcon(14)}</span>\n <span>${this._isDevPanelOpen ? \"Hide Settings\" : \"Settings\"}</span>\n </button>\n `\n : nothing}\n <div class=\"fw-context-menu-separator\"></div>\n <button\n type=\"button\"\n role=\"menuitemcheckbox\"\n aria-checked=${String(s.isPiPActive)}\n tabindex=\"-1\"\n data-context-menu-item=\"true\"\n data-context-menu-level=\"root\"\n class=\"fw-context-menu-item gap-2\"\n @click=${() => {\n this.pc.togglePiP();\n this._closeContextMenu();\n }}\n >\n <span class=\"opacity-70 shrink-0\">${pictureInPictureIcon(14)}</span>\n <span>Picture-in-Picture</span>\n </button>\n <button\n type=\"button\"\n role=\"menuitemcheckbox\"\n aria-checked=${String(s.isLoopEnabled)}\n tabindex=\"-1\"\n data-context-menu-item=\"true\"\n data-context-menu-level=\"root\"\n class=\"fw-context-menu-item gap-2\"\n @click=${() => {\n this.pc.toggleLoop();\n this._closeContextMenu();\n }}\n >\n <span class=\"opacity-70 shrink-0\">${loopIcon(14)}</span>\n <span>${s.isLoopEnabled ? \"Disable Loop\" : \"Enable Loop\"}</span>\n </button>\n ${this.devMode\n ? html`\n <div class=\"fw-context-menu-separator\"></div>\n <button\n type=\"button\"\n role=\"menuitem\"\n aria-haspopup=\"menu\"\n aria-expanded=${String(this._contextMenuOpenSubmenu === \"playback-mode\")}\n tabindex=\"-1\"\n data-context-menu-item=\"true\"\n data-context-menu-level=\"root\"\n data-context-menu-trigger=\"playback-mode\"\n class=\"fw-context-menu-item gap-2\"\n @click=${() => {\n if (this._contextMenuOpenSubmenu === \"playback-mode\") {\n this._closePlaybackModeSubmenu();\n } else {\n this._openPlaybackModeSubmenu();\n }\n }}\n >\n <span>Playback Mode</span>\n <span class=\"ml-auto opacity-70\">›</span>\n </button>\n ${this._contextMenuOpenSubmenu === \"playback-mode\"\n ? html`\n <div\n class=\"fw-player-surface fw-context-menu\"\n role=\"menu\"\n aria-label=\"Playback mode options\"\n data-state=\"open\"\n data-side=${this._contextMenuSubmenuSide === \"right\" ? \"right\" : \"left\"}\n style=${this._contextMenuSubmenuSide === \"right\"\n ? \"position:absolute; top:0; left: calc(100% + 4px);\"\n : \"position:absolute; top:0; right: calc(100% + 4px);\"}\n >\n <button\n type=\"button\"\n role=\"menuitemradio\"\n aria-checked=${String(this.playbackMode === \"auto\")}\n tabindex=\"-1\"\n data-context-menu-item=\"true\"\n data-context-menu-level=\"submenu\"\n class=\"fw-context-menu-item gap-2\"\n @click=${() => {\n this.playbackMode = \"auto\";\n void this.pc.setDevModeOptions({ playbackMode: \"auto\" });\n this._closeContextMenu();\n }}\n >\n <span>Auto</span>\n </button>\n <button\n type=\"button\"\n role=\"menuitemradio\"\n aria-checked=${String(this.playbackMode === \"low-latency\")}\n tabindex=\"-1\"\n data-context-menu-item=\"true\"\n data-context-menu-level=\"submenu\"\n class=\"fw-context-menu-item gap-2\"\n @click=${() => {\n this.playbackMode = \"low-latency\";\n void this.pc.setDevModeOptions({ playbackMode: \"low-latency\" });\n this._closeContextMenu();\n }}\n >\n <span>Low Latency</span>\n </button>\n <button\n type=\"button\"\n role=\"menuitemradio\"\n aria-checked=${String(this.playbackMode === \"quality\")}\n tabindex=\"-1\"\n data-context-menu-item=\"true\"\n data-context-menu-level=\"submenu\"\n class=\"fw-context-menu-item gap-2\"\n @click=${() => {\n this.playbackMode = \"quality\";\n void this.pc.setDevModeOptions({ playbackMode: \"quality\" });\n this._closeContextMenu();\n }}\n >\n <span>Quality</span>\n </button>\n <button\n type=\"button\"\n role=\"menuitemradio\"\n aria-checked=${String(this.playbackMode === \"vod\")}\n tabindex=\"-1\"\n data-context-menu-item=\"true\"\n data-context-menu-level=\"submenu\"\n class=\"fw-context-menu-item gap-2\"\n @click=${() => {\n this.playbackMode = \"vod\";\n void this.pc.setDevModeOptions({ playbackMode: \"vod\" });\n this._closeContextMenu();\n }}\n >\n <span>VOD</span>\n </button>\n </div>\n `\n : nothing}\n `\n : nothing}\n </div>\n `\n : nothing}\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"fw-player\": FwPlayer;\n }\n}\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"fw-player.js","sources":["../../../../src/components/fw-player.ts"],"sourcesContent":["/*\n <fw-player> — Main player web component.\n * Port of Player.tsx / PlayerInner from player-react.\n */\nimport { LitElement, html, css, nothing, type PropertyValues } from \"lit\";\nimport { customElement, property, state, query } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { PlayerControllerHost } from \"../controllers/player-controller-host.js\";\nimport { sharedStyles } from \"../styles/shared-styles.js\";\nimport { utilityStyles } from \"../styles/utility-styles.js\";\nimport {\n closeIcon,\n statsIcon,\n settingsIcon,\n pictureInPictureIcon,\n loopIcon,\n} from \"../icons/index.js\";\nimport type { ContentEndpoints, PlaybackMode } from \"@livepeer-frameworks/player-core\";\n\n@customElement(\"fw-player\")\nexport class FwPlayer extends LitElement {\n // ---- Public attributes (reflected) ----\n @property({ attribute: \"content-id\" }) contentId = \"\";\n @property({ attribute: \"content-type\" }) contentType?: \"live\" \| \"dvr\" \| \"clip\" \| \"vod\";\n @property({ attribute: \"gateway-url\" }) gatewayUrl?: string;\n @property({ attribute: \"mist-url\" }) mistUrl?: string;\n @property({ attribute: \"auth-token\" }) authToken?: string;\n @property({ type: Boolean }) autoplay = true;\n @property({ type: Boolean }) muted = true;\n // React/Svelte use `stockControls` for native controls. Keep `controls` as a\n // compatibility no-op so WC parity does not hide custom controls/seekbar.\n @property({ type: Boolean }) controls = false;\n @property({ type: Boolean, attribute: \"stock-controls\" }) stockControls = false;\n @property({ type: Boolean, attribute: \"native-controls\" }) nativeControls = false;\n @property({ type: Boolean }) debug = false;\n @property({ type: Boolean, attribute: \"dev-mode\" }) devMode = false;\n @property({ attribute: \"thumbnail-url\" }) thumbnailUrl?: string;\n @property({ attribute: \"playback-mode\" }) playbackMode: PlaybackMode = \"auto\";\n\n // ---- JS-only properties (not reflected) ----\n @property({ attribute: false }) endpoints?: ContentEndpoints;\n\n // ---- Internal state ----\n @state() private _isStatsOpen = false;\n @state() private _isDevPanelOpen = false;\n @state() private _skipDirection: \"back\" \| \"forward\" \| null = null;\n @state() private _contextMenuOpen = false;\n @state() private _contextMenuMounted = false;\n @state() private _contextMenuState: \"open\" \| \"closed\" = \"closed\";\n @state() private _contextMenuSide: \"top\" \| \"bottom\" \| \"left\" \| \"right\" = \"bottom\";\n @state() private _contextMenuActiveLevel: \"root\" \| \"submenu\" = \"root\";\n @state() private _contextMenuOpenSubmenu: \"playback-mode\" \| null = null;\n @state() private _contextMenuSubmenuSide: \"left\" \| \"right\" = \"right\";\n @state() private _contextMenuX = 0;\n @state() private _contextMenuY = 0;\n\n // ---- Refs ----\n @query(\"#container\") private _containerEl!: HTMLDivElement;\n\n // ---- Controller ----\n pc = new PlayerControllerHost(this);\n\n static styles = [\n sharedStyles,\n utilityStyles,\n css`\n :host {\n display: block;\n position: relative;\n width: 100%;\n height: 100%;\n contain: layout style;\n }\n :host([hidden]) {\n display: none;\n }\n .player-area {\n position: relative;\n width: 100%;\n height: 100%;\n }\n .player-area--dev {\n flex: 1;\n min-width: 0;\n min-height: 0;\n }\n `,\n ];\n\n // ---- Lifecycle ----\n\n protected willUpdate(changed: PropertyValues) {\n if (\n changed.has(\"contentId\") \|\|\n changed.has(\"contentType\") \|\|\n changed.has(\"gatewayUrl\") \|\|\n changed.has(\"mistUrl\") \|\|\n changed.has(\"authToken\") \|\|\n changed.has(\"autoplay\") \|\|\n changed.has(\"muted\") \|\|\n changed.has(\"stockControls\") \|\|\n changed.has(\"nativeControls\") \|\|\n changed.has(\"debug\") \|\|\n changed.has(\"thumbnailUrl\") \|\|\n changed.has(\"endpoints\")\n ) {\n this.pc.configure({\n contentId: this.contentId,\n contentType: this.contentType,\n endpoints: this.endpoints,\n gatewayUrl: this.gatewayUrl,\n mistUrl: this.mistUrl,\n authToken: this.authToken,\n autoplay: this.autoplay,\n muted: this.muted,\n controls: this.stockControls \|\| this.nativeControls,\n poster: this.thumbnailUrl,\n debug: this.debug,\n });\n }\n }\n\n protected firstUpdated() {\n this.pc.attach(this._containerEl);\n\n // Close context menu on outside click\n document.addEventListener(\"pointerdown\", this._handleDocumentPointerDown);\n document.addEventListener(\"contextmenu\", this._handleDocumentContextMenu);\n document.addEventListener(\"keydown\", this._handleDocumentKeyDown);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n document.removeEventListener(\"pointerdown\", this._handleDocumentPointerDown);\n document.removeEventListener(\"contextmenu\", this._handleDocumentContextMenu);\n document.removeEventListener(\"keydown\", this._handleDocumentKeyDown);\n if (this._contextMenuCloseTimer) {\n clearTimeout(this._contextMenuCloseTimer);\n this._contextMenuCloseTimer = undefined;\n }\n this._resetContextMenuTypeahead();\n }\n\n // ---- Context Menu ----\n\n private _contextMenuCloseTimer?: ReturnType<typeof setTimeout>;\n private _contextMenuTypeahead = \"\";\n private _contextMenuTypeaheadTimer?: ReturnType<typeof setTimeout>;\n\n private _resetContextMenuTypeahead = () => {\n this._contextMenuTypeahead = \"\";\n if (this._contextMenuTypeaheadTimer) {\n clearTimeout(this._contextMenuTypeaheadTimer);\n this._contextMenuTypeaheadTimer = undefined;\n }\n };\n\n private _resolveContextMenuSide = (\n rawX: number,\n rawY: number,\n clampedX: number,\n clampedY: number\n ) => {\n const deltaX = Math.abs(rawX - clampedX);\n const deltaY = Math.abs(rawY - clampedY);\n\n if (deltaX === 0 && deltaY === 0) {\n return \"bottom\";\n }\n\n if (deltaY >= deltaX) {\n return rawY > clampedY ? \"top\" : \"bottom\";\n }\n\n return rawX > clampedX ? \"left\" : \"right\";\n };\n\n private _closeContextMenu = (restoreFocus = false) => {\n this._contextMenuOpen = false;\n this._contextMenuState = \"closed\";\n this._contextMenuActiveLevel = \"root\";\n this._contextMenuOpenSubmenu = null;\n this._resetContextMenuTypeahead();\n if (this._contextMenuCloseTimer) {\n clearTimeout(this._contextMenuCloseTimer);\n }\n this._contextMenuCloseTimer = setTimeout(() => {\n if (!this._contextMenuOpen) {\n this._contextMenuMounted = false;\n }\n }, 170);\n\n if (restoreFocus) {\n const root = this.shadowRoot?.querySelector<HTMLElement>('[part=\"root\"]');\n root?.focus();\n }\n };\n\n private _getQueryRoot = (): ShadowRoot \| null => {\n return (\n this.shadowRoot ?? (this as unknown as { renderRoot?: ShadowRoot \| null }).renderRoot ?? null\n );\n };\n\n private _getContextMenuElement = () =>\n this._getQueryRoot()?.querySelector<HTMLElement>('[data-context-menu=\"true\"]') ?? null;\n\n private _getContextMenuBounds = () => {\n const root = this._getQueryRoot()?.querySelector<HTMLElement>('[part=\"root\"]');\n const rect = root?.getBoundingClientRect() ?? this.getBoundingClientRect();\n\n const width = rect.width > 0 ? rect.width : window.innerWidth;\n const height = rect.height > 0 ? rect.height : window.innerHeight;\n\n return {\n left: rect.left,\n top: rect.top,\n right: rect.left + width,\n bottom: rect.top + height,\n width,\n height,\n };\n };\n\n private _toLocalContextMenuPoint = (clientX: number, clientY: number) => {\n const bounds = this._getContextMenuBounds();\n return {\n x: clientX - bounds.left,\n y: clientY - bounds.top,\n };\n };\n\n private _getContextMenuItems = (level: \"root\" \| \"submenu\" = this._contextMenuActiveLevel) =>\n Array.from(\n this._getQueryRoot()?.querySelectorAll<HTMLButtonElement>(\n `[data-context-menu-item=\"true\"][data-context-menu-level=\"${level}\"]:not([data-disabled=\"true\"])`\n ) ?? []\n );\n\n private _focusFirstContextMenuItem = (\n level: \"root\" \| \"submenu\" = this._contextMenuActiveLevel\n ) => {\n const [firstItem] = this._getContextMenuItems(level);\n firstItem?.focus();\n };\n\n private _focusPlaybackModeTrigger = () => {\n const trigger = this._getQueryRoot()?.querySelector<HTMLButtonElement>(\n '[data-context-menu-trigger=\"playback-mode\"]'\n );\n trigger?.focus();\n };\n\n private _openPlaybackModeSubmenu = () => {\n this._contextMenuOpenSubmenu = \"playback-mode\";\n this._contextMenuActiveLevel = \"submenu\";\n this._resetContextMenuTypeahead();\n queueMicrotask(() => {\n this._syncPlaybackModeSubmenuSide();\n this._focusFirstContextMenuItem(\"submenu\");\n });\n };\n\n private _closePlaybackModeSubmenu = (restoreTriggerFocus = false) => {\n this._contextMenuOpenSubmenu = null;\n this._contextMenuActiveLevel = \"root\";\n this._resetContextMenuTypeahead();\n if (restoreTriggerFocus) {\n this._focusPlaybackModeTrigger();\n }\n };\n\n private _clampContextMenuPosition = (x: number, y: number, width: number, height: number) => {\n const viewportPadding = 8;\n const bounds = this._getContextMenuBounds();\n const maxX = Math.max(viewportPadding, bounds.width - width - viewportPadding);\n const maxY = Math.max(viewportPadding, bounds.height - height - viewportPadding);\n\n return {\n x: Math.max(viewportPadding, Math.min(x, maxX)),\n y: Math.max(viewportPadding, Math.min(y, maxY)),\n };\n };\n\n private _syncContextMenuPosition = () => {\n if (!this._contextMenuMounted) return;\n const menu = this._getContextMenuElement();\n if (!menu) return;\n\n const rect = menu.getBoundingClientRect();\n const next = this._clampContextMenuPosition(\n this._contextMenuX,\n this._contextMenuY,\n rect.width,\n rect.height\n );\n this._contextMenuSide = this._resolveContextMenuSide(\n this._contextMenuX,\n this._contextMenuY,\n next.x,\n next.y\n );\n if (next.x !== this._contextMenuX \|\| next.y !== this._contextMenuY) {\n this._contextMenuX = next.x;\n this._contextMenuY = next.y;\n }\n };\n\n private _syncPlaybackModeSubmenuSide = () => {\n if (this._contextMenuOpenSubmenu !== \"playback-mode\") return;\n const menu = this._getContextMenuElement();\n if (!menu) return;\n const bounds = this._getContextMenuBounds();\n const rect = menu.getBoundingClientRect();\n const estimatedSubmenuWidth = 190;\n this._contextMenuSubmenuSide =\n rect.right + estimatedSubmenuWidth > bounds.right - 8 ? \"left\" : \"right\";\n };\n\n private _openContextMenu = (clientX: number, clientY: number) => {\n const local = this._toLocalContextMenuPoint(clientX, clientY);\n const next = this._clampContextMenuPosition(local.x, local.y, 220, 200);\n this._contextMenuSide = this._resolveContextMenuSide(local.x, local.y, next.x, next.y);\n this._contextMenuX = next.x;\n this._contextMenuY = next.y;\n this._contextMenuMounted = true;\n this._contextMenuState = \"open\";\n this._contextMenuActiveLevel = \"root\";\n this._contextMenuOpenSubmenu = null;\n if (this._contextMenuCloseTimer) {\n clearTimeout(this._contextMenuCloseTimer);\n this._contextMenuCloseTimer = undefined;\n }\n this._resetContextMenuTypeahead();\n this._contextMenuOpen = true;\n };\n\n private _handleContextMenu = (e: MouseEvent) => {\n const target = e.target as HTMLElement \| null;\n if (target?.closest('[data-context-menu=\"true\"]')) {\n e.preventDefault();\n return;\n }\n\n e.preventDefault();\n this._openContextMenu(e.clientX, e.clientY);\n };\n\n private _handleContextMenuShortcut = (e: KeyboardEvent) => {\n const isContextMenuKey = e.key === \"ContextMenu\";\n const isShiftF10 = e.key === \"F10\" && e.shiftKey;\n if (!isContextMenuKey && !isShiftF10) return;\n\n e.preventDefault();\n const rect = this.getBoundingClientRect();\n const x = rect.left + rect.width / 2;\n const y = rect.top + rect.height / 2;\n this._openContextMenu(x, y);\n };\n\n private _handleDocumentPointerDown = (e: PointerEvent) => {\n if (!this._contextMenuOpen) return;\n const menu = this._getContextMenuElement();\n const composedPath = e.composedPath();\n if (menu && composedPath.includes(menu)) return;\n this._closeContextMenu();\n };\n\n private _handleDocumentContextMenu = (e: MouseEvent) => {\n if (!this._contextMenuOpen) return;\n if (!this.contains(e.target as Node)) {\n this._closeContextMenu();\n }\n };\n\n private _handleDocumentKeyDown = (e: KeyboardEvent) => {\n if (e.key === \"Escape\" && this._contextMenuOpen) {\n e.preventDefault();\n this._closeContextMenu(true);\n }\n };\n\n private _handleContextMenuKeyDown = (e: KeyboardEvent) => {\n if (!this._contextMenuOpen) return;\n const activeElement = this.shadowRoot?.activeElement as HTMLButtonElement \| null;\n\n if (e.key === \"Escape\") {\n e.preventDefault();\n if (this._contextMenuActiveLevel === \"submenu\") {\n this._closePlaybackModeSubmenu(true);\n } else {\n this._closeContextMenu(true);\n }\n return;\n }\n\n if (e.key === \"Tab\") {\n this._closeContextMenu();\n return;\n }\n\n if (e.key === \"ArrowRight\" && this._contextMenuActiveLevel === \"root\") {\n if (activeElement?.dataset.contextMenuTrigger === \"playback-mode\") {\n e.preventDefault();\n this._openPlaybackModeSubmenu();\n }\n return;\n }\n\n if (e.key === \"ArrowLeft\" && this._contextMenuActiveLevel === \"submenu\") {\n e.preventDefault();\n this._closePlaybackModeSubmenu(true);\n return;\n }\n\n const items = this._getContextMenuItems(this._contextMenuActiveLevel);\n if (items.length === 0) return;\n const activeIndex = items.findIndex((item) => item === activeElement);\n\n if (e.key === \"Home\") {\n e.preventDefault();\n this._focusFirstContextMenuItem(this._contextMenuActiveLevel);\n return;\n }\n\n if (e.key === \"End\") {\n e.preventDefault();\n items[items.length - 1]?.focus();\n return;\n }\n\n if (e.key === \"ArrowDown\" \|\| e.key === \"ArrowUp\") {\n e.preventDefault();\n const direction = e.key === \"ArrowDown\" ? 1 : -1;\n const startIndex =\n activeIndex === -1 ? (direction === 1 ? 0 : items.length - 1) : activeIndex;\n const nextIndex = (startIndex + direction + items.length) % items.length;\n items[nextIndex]?.focus();\n return;\n }\n\n if (e.key === \"Enter\" \|\| e.key === \" \") {\n if (activeElement) {\n e.preventDefault();\n activeElement.click();\n }\n return;\n }\n\n if (e.key.length === 1 && !e.metaKey && !e.ctrlKey && !e.altKey) {\n e.preventDefault();\n this._contextMenuTypeahead += e.key.toLowerCase();\n if (this._contextMenuTypeaheadTimer) {\n clearTimeout(this._contextMenuTypeaheadTimer);\n }\n this._contextMenuTypeaheadTimer = setTimeout(() => {\n this._resetContextMenuTypeahead();\n }, 700);\n\n const startIndex = activeIndex === -1 ? 0 : activeIndex + 1;\n const orderedItems = [...items.slice(startIndex), ...items.slice(0, startIndex)];\n const match = orderedItems.find((item) =>\n item.textContent?.trim().toLowerCase().startsWith(this._contextMenuTypeahead)\n );\n match?.focus();\n }\n };\n\n // ---- Toast auto-dismiss ----\n\n private _toastTimer?: ReturnType<typeof setTimeout>;\n\n protected updated(changed: PropertyValues) {\n if (this.pc.s.toast) {\n clearTimeout(this._toastTimer);\n this._toastTimer = setTimeout(() => this.pc.dismissToast(), 3000);\n }\n\n if (\n (changed.has(\"_contextMenuOpen\") \|\| changed.has(\"_contextMenuMounted\")) &&\n this._contextMenuOpen\n ) {\n queueMicrotask(() => {\n this._syncContextMenuPosition();\n this._focusFirstContextMenuItem(\"root\");\n });\n }\n\n if (\n changed.has(\"_contextMenuOpenSubmenu\") &&\n this._contextMenuOpenSubmenu === \"playback-mode\"\n ) {\n queueMicrotask(() => {\n this._syncPlaybackModeSubmenuSide();\n });\n }\n }\n\n // ---- Derived state ----\n\n private get _showTitleOverlay() {\n const s = this.pc.s;\n return (s.isHovering \|\| s.isPaused) && !s.shouldShowIdleScreen && !s.isBuffering && !s.error;\n }\n\n private get _showBufferingSpinner() {\n const s = this.pc.s;\n return !s.shouldShowIdleScreen && s.isBuffering && !s.error && s.hasPlaybackStarted;\n }\n\n private get _showWaitingForEndpoint() {\n const s = this.pc.s;\n return !s.endpoints?.primary && s.state !== \"booting\";\n }\n\n private get _waitingMessage() {\n const s = this.pc.s;\n if (this.gatewayUrl && s.state === \"gateway_loading\") {\n return \"Resolving viewing endpoint...\";\n }\n return \"Waiting for endpoint...\";\n }\n\n private get _useStockControls() {\n return (\n this.stockControls \|\|\n this.nativeControls \|\|\n this.pc.s.currentPlayerInfo?.shortname === \"mist-legacy\"\n );\n }\n\n // ---- Public API methods ----\n\n async play() {\n await this.pc.play();\n }\n pause() {\n this.pc.pause();\n }\n togglePlay() {\n this.pc.togglePlay();\n }\n seek(time: number) {\n this.pc.seek(time);\n }\n seekBy(delta: number) {\n this.pc.seekBy(delta);\n }\n jumpToLive() {\n this.pc.jumpToLive();\n }\n setVolume(volume: number) {\n this.pc.setVolume(volume);\n }\n toggleMute() {\n this.pc.toggleMute();\n }\n toggleLoop() {\n this.pc.toggleLoop();\n }\n async toggleFullscreen() {\n await this.pc.toggleFullscreen();\n }\n async togglePiP() {\n await this.pc.togglePiP();\n }\n toggleSubtitles() {\n this.pc.toggleSubtitles();\n }\n async retry() {\n await this.pc.retry();\n }\n async reload() {\n await this.pc.reload();\n }\n getQualities() {\n return this.pc.getQualities();\n }\n selectQuality(id: string) {\n this.pc.selectQuality(id);\n }\n destroy() {\n this.pc.hostDisconnected();\n }\n\n // ---- Render ----\n\n protected render() {\n const s = this.pc.s;\n\n return html`\n <div\n part=\"root\"\n class=${classMap({\n \"fw-player-surface\": true,\n \"fw-player-root\": true,\n \"w-full\": true,\n \"h-full\": true,\n \"overflow-hidden\": true,\n flex: this.devMode,\n })}\n data-player-container=\"true\"\n tabindex=\"0\"\n @mouseenter=${() => this.pc.handleMouseEnter()}\n @mouseleave=${() => this.pc.handleMouseLeave()}\n @mousemove=${() => this.pc.handleMouseMove()}\n @touchstart=${() => this.pc.handleTouchStart()}\n @keydown=${this._handleContextMenuShortcut}\n @contextmenu=${this._handleContextMenu}\n >\n <!-- Player area -->\n <div\n class=${classMap({\n \"player-area\": true,\n \"player-area--dev\": this.devMode,\n })}\n >\n <!-- Video container -->\n <div id=\"container\" part=\"video-container\" class=\"fw-player-container\"></div>\n\n <!-- Subtitle renderer -->\n ${s.subtitlesEnabled\n ? html`\n <fw-subtitle-renderer\n .currentTime=${s.currentTime}\n .enabled=${s.subtitlesEnabled}\n ></fw-subtitle-renderer>\n `\n : nothing}\n\n <!-- Title overlay -->\n ${this._showTitleOverlay\n ? html`\n <fw-title-overlay\n .title=${s.metadata?.title ?? null}\n .description=${s.metadata?.description ?? null}\n ></fw-title-overlay>\n `\n : nothing}\n\n <!-- Stats panel -->\n ${this._isStatsOpen\n ? html`\n <fw-stats-panel\n part=\"stats-panel\"\n .pc=${this.pc}\n @fw-close=${() => {\n this._isStatsOpen = false;\n }}\n ></fw-stats-panel>\n `\n : nothing}\n\n <!-- Speed indicator -->\n ${s.isHoldingSpeed\n ? html` <fw-speed-indicator .speed=${s.holdSpeed}></fw-speed-indicator> `\n : nothing}\n\n <!-- Skip indicator -->\n <fw-skip-indicator\n .direction=${this._skipDirection}\n @fw-hide=${() => {\n this._skipDirection = null;\n }}\n ></fw-skip-indicator>\n\n <!-- Waiting for endpoint -->\n ${this._showWaitingForEndpoint\n ? html`\n <fw-idle-screen\n status=\"OFFLINE\"\n .message=${this._waitingMessage}\n @fw-retry=${() => {\n this.pc.clearError();\n this.pc.retry();\n }}\n ></fw-idle-screen>\n `\n : nothing}\n\n <!-- Idle screen -->\n ${!this._showWaitingForEndpoint && s.shouldShowIdleScreen\n ? html`\n <fw-idle-screen\n .status=${s.isEffectivelyLive ? s.streamState?.status : undefined}\n .message=${s.isEffectivelyLive ? s.streamState?.message : \"Loading video...\"}\n .percentage=${s.isEffectivelyLive ? s.streamState?.percentage : undefined}\n @fw-retry=${() => {\n this.pc.clearError();\n this.pc.retry();\n }}\n ></fw-idle-screen>\n `\n : nothing}\n\n <!-- Buffering spinner -->\n ${this._showBufferingSpinner\n ? html`\n <div\n role=\"status\"\n aria-live=\"polite\"\n class=\"fw-player-surface absolute inset-0 flex items-center justify-center bg-black/40 backdrop-blur-sm z-20\"\n >\n <div\n class=\"flex items-center gap-3 rounded-lg border border-white/10 bg-black/70 px-4 py-3 text-sm text-white shadow-lg\"\n >\n <div\n class=\"w-4 h-4 border-2 border-white/10 rounded-full animate-spin\"\n style=\"border-top-color: white;\"\n ></div>\n <span>Buffering...</span>\n </div>\n </div>\n `\n : nothing}\n\n <!-- Error overlay -->\n ${!s.shouldShowIdleScreen && s.error\n ? html`\n <div\n role=\"alert\"\n aria-live=\"assertive\"\n class=${classMap({\n \"fw-error-overlay\": true,\n \"fw-error-overlay--passive\": s.isPassiveError,\n \"fw-error-overlay--fullscreen\": !s.isPassiveError,\n })}\n >\n <div\n class=${classMap({\n \"fw-error-popup\": true,\n \"fw-error-popup--passive\": s.isPassiveError,\n \"fw-error-popup--fullscreen\": !s.isPassiveError,\n })}\n >\n <div\n class=${classMap({\n \"fw-error-header\": true,\n \"fw-error-header--warning\": s.isPassiveError,\n \"fw-error-header--error\": !s.isPassiveError,\n })}\n >\n <span\n class=${classMap({\n \"fw-error-title\": true,\n \"fw-error-title--warning\": s.isPassiveError,\n \"fw-error-title--error\": !s.isPassiveError,\n })}\n >${s.isPassiveError ? \"Warning\" : \"Error\"}</span\n >\n <button\n type=\"button\"\n class=\"fw-error-close\"\n @click=${() => this.pc.clearError()}\n aria-label=\"Dismiss\"\n >\n ${closeIcon()}\n </button>\n </div>\n <div class=\"fw-error-body\">\n <p class=\"fw-error-message\">Playback issue</p>\n </div>\n <div class=\"fw-error-actions\">\n <button\n type=\"button\"\n class=\"fw-error-btn\"\n aria-label=\"Retry playback\"\n @click=${() => {\n this.pc.clearError();\n this.pc.retry();\n }}\n >\n Retry\n </button>\n </div>\n </div>\n </div>\n `\n : nothing}\n\n <!-- Toast notification -->\n ${s.toast\n ? html`\n <div\n class=\"absolute bottom-20 left-1/2 -translate-x-1/2 z-30\"\n role=\"status\"\n aria-live=\"polite\"\n >\n <div\n class=\"flex items-center gap-2 rounded-lg border border-white/10 bg-black/80 px-4 py-2 text-sm text-white shadow-lg backdrop-blur-sm\"\n >\n <span>${s.toast.message}</span>\n <button\n type=\"button\"\n @click=${() => this.pc.dismissToast()}\n class=\"ml-0.5 text-white/60 hover\\\\:text-white cursor-pointer\"\n aria-label=\"Dismiss\"\n >\n ${closeIcon()}\n </button>\n </div>\n </div>\n `\n : nothing}\n\n <!-- Player controls -->\n ${!this._useStockControls\n ? html`\n <fw-player-controls\n part=\"controls\"\n .pc=${this.pc}\n .playbackMode=${this.playbackMode}\n .isContentLive=${s.isEffectivelyLive}\n .devMode=${this.devMode}\n .isStatsOpen=${this._isStatsOpen}\n @fw-stats-toggle=${() => {\n this._isStatsOpen = !this._isStatsOpen;\n }}\n @fw-mode-change=${(event: CustomEvent<{ mode: PlaybackMode }>) => {\n this.playbackMode = event.detail.mode;\n }}\n ></fw-player-controls>\n `\n : nothing}\n </div>\n\n <!-- Dev mode side panel -->\n ${this.devMode && this._isDevPanelOpen\n ? html`\n <fw-dev-mode-panel\n .pc=${this.pc}\n .playbackMode=${this.playbackMode}\n @fw-close=${() => {\n this._isDevPanelOpen = false;\n }}\n @fw-playback-mode-change=${(event: CustomEvent<{ mode: PlaybackMode }>) => {\n this.playbackMode = event.detail.mode;\n }}\n ></fw-dev-mode-panel>\n `\n : nothing}\n </div>\n\n <!-- Context menu -->\n <!-- Keep menu in-shadow (no document portal) to preserve host-scoped styling and avoid a global overlay manager. -->\n ${this._contextMenuMounted\n ? html`\n <div\n data-context-menu=\"true\"\n data-state=${this._contextMenuState}\n data-side=${this._contextMenuSide}\n class=\"fw-player-surface fw-context-menu\"\n role=\"menu\"\n aria-label=\"Player options\"\n tabindex=\"-1\"\n style=\"position: absolute; left: ${this._contextMenuX}px; top: ${this\n ._contextMenuY}px;\"\n @contextmenu=${(e: MouseEvent) => e.preventDefault()}\n @keydown=${this._handleContextMenuKeyDown}\n >\n <button\n type=\"button\"\n role=\"menuitem\"\n tabindex=\"-1\"\n data-context-menu-item=\"true\"\n data-context-menu-level=\"root\"\n class=\"fw-context-menu-item gap-2\"\n @click=${() => {\n this._isStatsOpen = !this._isStatsOpen;\n this._closeContextMenu();\n }}\n >\n <span class=\"opacity-70 shrink-0\">${statsIcon(14)}</span>\n <span>${this._isStatsOpen ? \"Hide Stats\" : \"Stats\"}</span>\n </button>\n ${this.devMode\n ? html`\n <div class=\"fw-context-menu-separator\"></div>\n <button\n type=\"button\"\n role=\"menuitem\"\n tabindex=\"-1\"\n data-context-menu-item=\"true\"\n data-context-menu-level=\"root\"\n class=\"fw-context-menu-item gap-2\"\n @click=${() => {\n this._isDevPanelOpen = !this._isDevPanelOpen;\n this._closeContextMenu();\n }}\n >\n <span class=\"opacity-70 shrink-0\">${settingsIcon(14)}</span>\n <span>${this._isDevPanelOpen ? \"Hide Settings\" : \"Settings\"}</span>\n </button>\n `\n : nothing}\n <div class=\"fw-context-menu-separator\"></div>\n <button\n type=\"button\"\n role=\"menuitemcheckbox\"\n aria-checked=${String(s.isPiPActive)}\n tabindex=\"-1\"\n data-context-menu-item=\"true\"\n data-context-menu-level=\"root\"\n class=\"fw-context-menu-item gap-2\"\n @click=${() => {\n this.pc.togglePiP();\n this._closeContextMenu();\n }}\n >\n <span class=\"opacity-70 shrink-0\">${pictureInPictureIcon(14)}</span>\n <span>Picture-in-Picture</span>\n </button>\n <button\n type=\"button\"\n role=\"menuitemcheckbox\"\n aria-checked=${String(s.isLoopEnabled)}\n tabindex=\"-1\"\n data-context-menu-item=\"true\"\n data-context-menu-level=\"root\"\n class=\"fw-context-menu-item gap-2\"\n @click=${() => {\n this.pc.toggleLoop();\n this._closeContextMenu();\n }}\n >\n <span class=\"opacity-70 shrink-0\">${loopIcon(14)}</span>\n <span>${s.isLoopEnabled ? \"Disable Loop\" : \"Enable Loop\"}</span>\n </button>\n ${this.devMode\n ? html`\n <div class=\"fw-context-menu-separator\"></div>\n <button\n type=\"button\"\n role=\"menuitem\"\n aria-haspopup=\"menu\"\n aria-expanded=${String(this._contextMenuOpenSubmenu === \"playback-mode\")}\n tabindex=\"-1\"\n data-context-menu-item=\"true\"\n data-context-menu-level=\"root\"\n data-context-menu-trigger=\"playback-mode\"\n class=\"fw-context-menu-item gap-2\"\n @click=${() => {\n if (this._contextMenuOpenSubmenu === \"playback-mode\") {\n this._closePlaybackModeSubmenu();\n } else {\n this._openPlaybackModeSubmenu();\n }\n }}\n >\n <span>Playback Mode</span>\n <span class=\"ml-auto opacity-70\">›</span>\n </button>\n ${this._contextMenuOpenSubmenu === \"playback-mode\"\n ? html`\n <div\n class=\"fw-player-surface fw-context-menu\"\n role=\"menu\"\n aria-label=\"Playback mode options\"\n data-state=\"open\"\n data-side=${this._contextMenuSubmenuSide === \"right\" ? \"right\" : \"left\"}\n style=${this._contextMenuSubmenuSide === \"right\"\n ? \"position:absolute; top:0; left: calc(100% + 4px);\"\n : \"position:absolute; top:0; right: calc(100% + 4px);\"}\n >\n <button\n type=\"button\"\n role=\"menuitemradio\"\n aria-checked=${String(this.playbackMode === \"auto\")}\n tabindex=\"-1\"\n data-context-menu-item=\"true\"\n data-context-menu-level=\"submenu\"\n class=\"fw-context-menu-item gap-2\"\n @click=${() => {\n this.playbackMode = \"auto\";\n void this.pc.setDevModeOptions({ playbackMode: \"auto\" });\n this._closeContextMenu();\n }}\n >\n <span>Auto</span>\n </button>\n <button\n type=\"button\"\n role=\"menuitemradio\"\n aria-checked=${String(this.playbackMode === \"low-latency\")}\n tabindex=\"-1\"\n data-context-menu-item=\"true\"\n data-context-menu-level=\"submenu\"\n class=\"fw-context-menu-item gap-2\"\n @click=${() => {\n this.playbackMode = \"low-latency\";\n void this.pc.setDevModeOptions({ playbackMode: \"low-latency\" });\n this._closeContextMenu();\n }}\n >\n <span>Low Latency</span>\n </button>\n <button\n type=\"button\"\n role=\"menuitemradio\"\n aria-checked=${String(this.playbackMode === \"quality\")}\n tabindex=\"-1\"\n data-context-menu-item=\"true\"\n data-context-menu-level=\"submenu\"\n class=\"fw-context-menu-item gap-2\"\n @click=${() => {\n this.playbackMode = \"quality\";\n void this.pc.setDevModeOptions({ playbackMode: \"quality\" });\n this._closeContextMenu();\n }}\n >\n <span>Quality</span>\n </button>\n <button\n type=\"button\"\n role=\"menuitemradio\"\n aria-checked=${String(this.playbackMode === \"vod\")}\n tabindex=\"-1\"\n data-context-menu-item=\"true\"\n data-context-menu-level=\"submenu\"\n class=\"fw-context-menu-item gap-2\"\n @click=${() => {\n this.playbackMode = \"vod\";\n void this.pc.setDevModeOptions({ playbackMode: \"vod\" });\n this._closeContextMenu();\n }}\n >\n <span>VOD</span>\n </button>\n </div>\n `\n : nothing}\n `\n : nothing}\n </div>\n `\n : nothing}\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"fw-player\": FwPlayer;\n }\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/styles/shared-styles.js CHANGED Viewed

@@ -442,11 +442,20 @@ const sharedStyles = css `
   .fw-context-menu-item {
     position: relative;
     display: flex;
+    width: 100%;
+    justify-content: flex-start;
+    gap: 0.5rem;
     cursor: pointer;
     user-select: none;
     align-items: center;
     padding: 0.5rem 0.75rem;
     font-size: 0.875rem;
+    text-align: left;
+    font: inherit;
+    border: none;
+    background: transparent;
+    appearance: none;
+    -webkit-appearance: none;
     outline: none;
     color: hsl(var(--tn-fg));
     transition:
@@ -485,11 +494,20 @@ const sharedStyles = css `
   .fw-context-menu-checkbox {
     position: relative;
     display: flex;
+    width: 100%;
+    justify-content: flex-start;
+    gap: 0.5rem;
     cursor: pointer;
     user-select: none;
     align-items: center;
     padding: 0.5rem 0.5rem 0.5rem 2rem;
     font-size: 0.875rem;
+    text-align: left;
+    font: inherit;
+    border: none;
+    background: transparent;
+    appearance: none;
+    -webkit-appearance: none;
     outline: none;
     color: hsl(var(--tn-fg));
     transition:

package/dist/esm/styles/shared-styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"shared-styles.js","sources":["../../../../src/styles/shared-styles.ts"],"sourcesContent":["// AUTO-GENERATED — do not edit. Run `pnpm run build:css` to regenerate.\n// Source: packages/core/src/styles/player.css\nimport { css } from \"lit\";\n\nexport const sharedStyles = css`\n/\n FrameWorks Player CSS\n * Plain CSS - no build step required (just copy to dist).\n * CSS variables are OUTSIDE layer for guaranteed availability.\n * Component styles are in @layer fw-player for cascade isolation.\n /\n\n/ =====================================================\n CSS VARIABLES - OUTSIDE LAYER (always available)\n ===================================================== /\n\n/\n * Player-scoped CSS variables - on .fw-player-surface to avoid :root pollution.\n * All player components must be wrapped in .fw-player-surface to inherit these.\n * These are OUTSIDE the layer so they're always available regardless of cascade.\n /\n.fw-player-surface {\n / Tokyo Night color palette /\n --tn-bg-dark: 235 21% 11%; / #1a1b26 - Darkest (slab backgrounds) /\n --tn-bg: 233 23% 17%; / #24283b - Main background /\n --tn-bg-highlight: 233 23% 21%; / #292e42 - Elevated surfaces /\n --tn-bg-visual: 232 27% 25%; / #33395e - Selection/active states /\n\n / Text hierarchy /\n --tn-fg: 223 27% 76%; / #a9b1d6 - Primary text /\n --tn-fg-bright: 220 13% 91%; / #e2e4ea - Bright/highlighted text /\n --tn-fg-dark: 224 16% 53%; / #787c99 - Secondary text (muted) /\n --tn-fg-gutter: 228 15% 45%; / #5a607f - Borders, seams /\n\n / Accent colors (semantic) /\n --tn-blue: 218 79% 73%; / #7aa2f7 - Primary actions /\n --tn-green: 95 53% 55%; / #9ece6a - Success /\n --tn-red: 348 74% 64%; / #f7768e - Destructive, live /\n --tn-yellow: 35 79% 64%; / #e0af68 - Warnings /\n --tn-purple: 267 82% 77%; / #bb9af7 - Secondary accent /\n --tn-cyan: 178 64% 63%; / #7dcfff - Info /\n --tn-teal: 162 66% 62%; / #73daca - Terminal green /\n\n / Player-internal variables (not shared with host) /\n --fw-background: var(--tn-bg);\n --fw-foreground: var(--tn-fg);\n --fw-card: var(--tn-bg-highlight);\n --fw-card-foreground: var(--tn-fg);\n --fw-popover: var(--tn-bg-highlight);\n --fw-popover-foreground: var(--tn-fg);\n --fw-primary: var(--tn-blue);\n --fw-primary-foreground: var(--tn-bg-dark);\n --fw-secondary: var(--tn-bg-visual);\n --fw-secondary-foreground: var(--tn-fg);\n --fw-muted: var(--tn-bg-highlight);\n --fw-muted-foreground: var(--tn-fg-dark);\n --fw-accent: var(--tn-bg-visual);\n --fw-accent-foreground: var(--tn-fg);\n --fw-destructive: var(--tn-red);\n --fw-destructive-foreground: var(--tn-bg-dark);\n --fw-border: var(--tn-fg-gutter);\n --fw-input: var(--tn-bg-highlight);\n --fw-ring: var(--tn-blue);\n --fw-radius: 0;\n\n / Controls-specific variables /\n --fw-controls-bg: hsl(var(--tn-bg-dark) / 0.85);\n --fw-controls-fg: hsl(var(--tn-fg));\n --fw-seam: hsl(var(--tn-fg-gutter) / 0.3);\n color: var(--fw-controls-fg);\n}\n\n/ Declare layer upfront for lowest priority /\n@layer fw-player;\n\n/ Component styles in the fw-player layer /\n@layer fw-player {\n / =====================================================\n ANIMATIONS\n ===================================================== /\n @keyframes float {\n 0%,\n 100% {\n transform: translateY(0px) scale(1);\n }\n 50% {\n transform: translateY(-12px) scale(0.95);\n }\n }\n\n @keyframes spin-slow {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n }\n\n @keyframes spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n }\n\n .animate-spin-slow {\n animation: spin-slow 18s linear infinite;\n }\n\n .animate-spin {\n animation: spin 1s linear infinite;\n }\n\n / =====================================================\n SLAB SYSTEM - Player Controls & Overlays\n ===================================================== /\n\n .fw-player-surface button {\n font: inherit;\n }\n\n / Slab base - solid structural block /\n .fw-slab {\n background: var(--fw-controls-bg);\n border: 1px solid var(--fw-seam);\n }\n\n / Slab header - uppercase, padded /\n .fw-slab-header {\n padding: 0.5rem 1rem;\n border-bottom: 1px solid var(--fw-seam);\n font-size: 0.75rem;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n color: hsl(var(--tn-fg-dark));\n }\n\n / Slab body - padded content area /\n .fw-slab-body {\n padding: 1rem;\n }\n\n / Slab actions - flush buttons, seams between /\n .fw-slab-actions {\n display: flex;\n border-top: 1px solid var(--fw-seam);\n }\n\n .fw-slab-actions > {\n flex: 1;\n border-radius: 0 !important;\n }\n\n .fw-slab-actions > * + * {\n border-left: 1px solid var(--fw-seam);\n }\n\n /* Control bar - stacked layout (seekbar above controls row) /\n .fw-control-bar {\n display: flex;\n flex-direction: column;\n width: 100%;\n background: var(--fw-controls-bg);\n border-top: 1px solid var(--fw-seam);\n backdrop-filter: blur(8px);\n pointer-events: auto;\n }\n\n / Control group - seamed sections within bar /\n .fw-control-group {\n display: flex;\n align-items: center;\n padding: 0.5rem;\n }\n\n .fw-control-group + .fw-control-group {\n border-left: 1px solid var(--fw-seam);\n }\n\n / Flush button - fills space, no radius /\n .fw-btn-flush {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0.5rem 0.75rem;\n border-radius: 0;\n background: transparent;\n color: hsl(var(--tn-fg));\n transition:\n background-color 0.15s,\n color 0.15s;\n cursor: pointer;\n border: none;\n }\n\n .fw-btn-flush:hover {\n background: hsl(var(--tn-bg-visual) / 0.5);\n }\n\n .fw-btn-flush:active {\n background: hsl(var(--tn-bg-visual));\n }\n\n .fw-btn-flush--active {\n color: hsl(var(--tn-blue));\n }\n\n / Status indicators /\n .fw-status-online {\n color: hsl(var(--tn-green));\n }\n .fw-status-offline {\n color: hsl(var(--tn-red));\n }\n .fw-status-warning {\n color: hsl(var(--tn-yellow));\n }\n .fw-status-info {\n color: hsl(var(--tn-cyan));\n }\n\n / =====================================================\n PLAYER CONTAINER STYLES (Slab-based)\n ===================================================== /\n\n .fw-player-root {\n position: relative;\n height: 100%;\n width: 100%;\n overflow: hidden;\n border-radius: 0; / Slabs don't have rounded corners /\n background-color: hsl(var(--tn-bg-dark));\n border: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-player-container {\n height: 100%;\n width: 100%;\n overflow: hidden;\n border-radius: 0;\n background-color: hsl(var(--tn-bg-dark));\n }\n\n .fw-player-video {\n height: 100%;\n width: 100%;\n border-radius: 0;\n object-fit: contain;\n background-color: hsl(var(--tn-bg-dark));\n }\n\n .fw-player-embed {\n height: 100%;\n width: 100%;\n min-height: 300px;\n border-radius: 0;\n border-width: 0;\n background-color: hsl(var(--tn-bg-dark));\n }\n\n .fw-player-dvd {\n position: absolute;\n pointer-events: none;\n user-select: none;\n -webkit-user-select: none;\n }\n\n / =====================================================\n VIDEO.JS CONTAINER CONSTRAINTS\n ===================================================== /\n\n / VideoJS wrapper must respect container bounds /\n .fw-player-container .video-js {\n width: 100% !important;\n height: 100% !important;\n max-width: 100% !important;\n max-height: 100% !important;\n min-width: 0 !important;\n min-height: 0 !important;\n padding: 0 !important;\n background: black;\n }\n\n / Ensure video tech fills the wrapper with letterboxing /\n .fw-player-container .video-js .vjs-tech {\n width: 100% !important;\n height: 100% !important;\n object-fit: contain !important;\n }\n\n / =====================================================\n VIDEO.JS UI HIDING (when using custom controls)\n ===================================================== /\n\n / Hide all VideoJS chrome when using our custom controls /\n .vjs-fw-custom-controls .vjs-control-bar,\n .vjs-fw-custom-controls .vjs-big-play-button,\n .vjs-fw-custom-controls .vjs-loading-spinner,\n .vjs-fw-custom-controls .vjs-text-track-display,\n .vjs-fw-custom-controls .vjs-error-display,\n .vjs-fw-custom-controls .vjs-modal-dialog,\n .vjs-fw-custom-controls .vjs-poster,\n .vjs-fw-custom-controls .vjs-live-control,\n .vjs-fw-custom-controls .vjs-title-bar {\n display: none !important;\n }\n\n / Ensure video element fills container (absolute positioning) /\n .vjs-fw-custom-controls .vjs-tech {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n object-fit: contain;\n }\n\n / =====================================================\n SEMANTIC COMPONENT CLASSES (npm_studio pattern)\n All component styling - no Tailwind utilities needed\n ===================================================== /\n\n / --- Settings Menu --- /\n .fw-settings-menu {\n position: absolute;\n bottom: 3rem;\n right: 0;\n width: 12rem;\n max-height: 70vh;\n overflow-y: auto;\n background: hsl(var(--tn-bg-dark));\n border: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n box-shadow:\n 0 10px 15px -3px rgb(0 0 0 / 0.1),\n 0 4px 6px -4px rgb(0 0 0 / 0.1);\n border-radius: 0.25rem;\n z-index: 50;\n }\n\n .fw-settings-section {\n padding: 0.5rem;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-settings-section:last-child {\n border-bottom: none;\n }\n\n .fw-settings-label {\n font-size: 10px;\n color: hsl(var(--tn-fg-dark));\n text-transform: uppercase;\n font-weight: 600;\n margin-bottom: 0.25rem;\n padding-left: 0.25rem;\n }\n\n .fw-settings-options {\n display: flex;\n gap: 0.25rem;\n }\n\n .fw-settings-options--wrap {\n flex-wrap: wrap;\n }\n\n .fw-settings-btn {\n flex: 1;\n padding: 0.375rem 0.25rem;\n font-size: 10px;\n border-radius: 0.25rem;\n background: hsl(var(--tn-bg));\n color: hsl(var(--tn-fg));\n border: none;\n cursor: pointer;\n transition:\n background-color 0.15s,\n color 0.15s;\n }\n\n .fw-settings-btn:hover {\n background: hsl(var(--tn-bg-highlight));\n }\n\n .fw-settings-btn--active {\n background: hsl(var(--tn-blue));\n color: hsl(var(--tn-bg-dark));\n }\n\n .fw-settings-btn--active:hover {\n background: hsl(var(--tn-blue));\n }\n\n .fw-settings-list {\n display: flex;\n flex-direction: column;\n gap: 0.125rem;\n max-height: 8rem;\n overflow-y: auto;\n }\n\n .fw-settings-list-item {\n padding: 0.25rem 0.5rem;\n font-size: 0.75rem;\n text-align: left;\n border-radius: 0.25rem;\n background: transparent;\n color: hsl(var(--tn-fg));\n border: none;\n cursor: pointer;\n transition: background-color 0.15s;\n }\n\n .fw-settings-list-item:hover {\n background: hsl(var(--tn-bg-highlight));\n }\n\n .fw-settings-list-item--active {\n background: hsl(var(--tn-blue) / 0.2);\n color: hsl(var(--tn-blue));\n }\n\n / --- Context Menu (bits-ui wrapper) --- /\n .fw-context-menu {\n z-index: 50;\n min-width: 8rem;\n overflow: hidden;\n border-radius: 0.25rem;\n border: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n background: hsl(var(--tn-bg-dark));\n padding: 0;\n color: hsl(var(--tn-fg));\n box-shadow:\n 0 10px 15px -3px rgb(0 0 0 / 0.1),\n 0 4px 6px -4px rgb(0 0 0 / 0.1);\n }\n\n .fw-context-menu-item {\n position: relative;\n display: flex;\n cursor: pointer;\n user-select: none;\n align-items: center;\n padding: 0.5rem 0.75rem;\n font-size: 0.875rem;\n outline: none;\n color: hsl(var(--tn-fg));\n transition:\n background-color 0.15s,\n color 0.15s;\n }\n\n .fw-context-menu-item:hover,\n .fw-context-menu-item:focus {\n background: hsl(var(--tn-bg-visual));\n color: white;\n }\n\n .fw-context-menu-item[data-disabled] {\n pointer-events: none;\n opacity: 0.5;\n }\n\n .fw-context-menu-item--inset {\n padding-left: 2rem;\n }\n\n .fw-context-menu-separator {\n margin: 0.25rem -0.25rem;\n height: 1px;\n background: hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-context-menu-label {\n padding: 0.375rem 0.5rem;\n font-size: 0.75rem;\n font-weight: 600;\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-context-menu-checkbox {\n position: relative;\n display: flex;\n cursor: pointer;\n user-select: none;\n align-items: center;\n padding: 0.5rem 0.5rem 0.5rem 2rem;\n font-size: 0.875rem;\n outline: none;\n color: hsl(var(--tn-fg));\n transition:\n background-color 0.15s,\n color 0.15s;\n }\n\n .fw-context-menu-checkbox:hover,\n .fw-context-menu-checkbox:focus {\n background: hsl(var(--tn-bg-visual));\n color: white;\n }\n\n .fw-context-menu-indicator {\n position: absolute;\n left: 0.5rem;\n display: flex;\n height: 0.875rem;\n width: 0.875rem;\n align-items: center;\n justify-content: center;\n }\n\n / --- Live Badge --- /\n .fw-live-badge {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n padding: 0.125rem 0.5rem;\n font-size: 10px;\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n transition:\n background-color 0.15s,\n color 0.15s;\n border: none;\n cursor: pointer;\n }\n\n .fw-live-badge--active {\n background: rgb(220 38 38);\n color: white;\n cursor: default;\n }\n\n .fw-live-badge--behind {\n background: #414868;\n color: #a9b1d6;\n }\n\n .fw-live-badge--behind:hover {\n background: rgb(220 38 38);\n color: white;\n }\n\n / --- Volume Control --- /\n .fw-volume-group {\n display: flex;\n align-items: center;\n border-radius: 0;\n transition:\n background-color 0.2s,\n width 0.2s;\n cursor: pointer;\n }\n\n .fw-volume-group--expanded {\n background: hsl(var(--tn-bg-visual) / 0.5);\n }\n\n .fw-volume-group:hover {\n background: hsl(var(--tn-bg-visual) / 0.5);\n }\n\n .fw-volume-group--expanded:hover {\n background: hsl(var(--tn-bg-visual) / 0.5);\n }\n\n .fw-volume-group--disabled {\n opacity: 0.4;\n cursor: not-allowed;\n }\n\n .fw-volume-btn {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 2rem;\n height: 2rem;\n color: rgb(255 255 255 / 0.8);\n background: transparent;\n border: none;\n cursor: pointer;\n transition: color 0.15s;\n }\n\n .fw-volume-btn:hover {\n color: white;\n }\n\n .fw-volume-slider-wrapper {\n display: flex;\n align-items: center;\n overflow: hidden;\n transition:\n width 0.2s ease-out,\n opacity 0.2s ease-out;\n }\n\n .fw-volume-slider-wrapper--collapsed {\n width: 0;\n opacity: 0;\n }\n\n .fw-volume-slider-wrapper--expanded {\n width: 7rem;\n padding-right: 0.5rem;\n opacity: 1;\n }\n\n / --- Slider Component (shared by React/Svelte) --- /\n .fw-slider {\n position: relative;\n display: flex;\n width: 100%;\n height: 1.25rem;\n touch-action: none;\n user-select: none;\n align-items: center;\n cursor: pointer;\n }\n\n .fw-slider--vertical {\n flex-direction: column;\n width: 1.25rem;\n height: 100%;\n }\n\n .fw-slider-track {\n position: absolute;\n left: 0;\n right: 0;\n height: 4px;\n border-radius: 9999px;\n background: hsl(var(--tn-fg-gutter) / 0.4);\n overflow: hidden;\n transition: height 0.15s ease;\n }\n\n .fw-slider:hover .fw-slider-track {\n height: 6px;\n }\n\n .fw-slider--vertical .fw-slider-track {\n top: 0;\n bottom: 0;\n left: 50%;\n right: auto;\n width: 4px;\n height: auto;\n transform: translateX(-50%);\n }\n\n .fw-slider--vertical:hover .fw-slider-track {\n width: 6px;\n height: auto;\n }\n\n .fw-slider-range {\n position: absolute;\n height: 100%;\n border-radius: 9999px;\n background: hsl(var(--tn-fg));\n }\n\n .fw-slider-range--accent {\n background: hsl(var(--tn-cyan));\n }\n\n .fw-slider--vertical .fw-slider-range {\n width: 100%;\n height: auto;\n bottom: 0;\n }\n\n .fw-slider-thumb {\n display: block;\n width: 10px;\n height: 10px;\n border-radius: 50%;\n background: hsl(var(--tn-fg));\n border: none;\n box-shadow: 0 2px 4px rgb(0 0 0 / 0.3);\n cursor: pointer;\n transition:\n width 0.15s ease,\n height 0.15s ease,\n box-shadow 0.15s ease;\n }\n\n .fw-slider:hover .fw-slider-thumb {\n width: 14px;\n height: 14px;\n }\n\n .fw-slider-thumb:focus {\n outline: none;\n }\n\n .fw-slider-thumb:focus-visible {\n box-shadow: 0 0 0 2px hsl(var(--tn-fg) / 0.5);\n }\n\n .fw-slider-thumb--accent {\n background: hsl(var(--tn-cyan));\n }\n\n .fw-slider-thumb[data-disabled] {\n pointer-events: none;\n opacity: 0.5;\n }\n\n / --- Time Display --- /\n .fw-time-display {\n font-family: ui-monospace, monospace;\n font-size: 11px;\n line-height: 1;\n color: hsl(var(--tn-fg-dark));\n white-space: nowrap;\n padding: 0 0.5rem;\n }\n\n / --- Controls Wrapper --- /\n .fw-controls-wrapper {\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n display: flex;\n flex-direction: column;\n justify-content: flex-end;\n transition: opacity 0.2s;\n pointer-events: none;\n }\n\n .fw-controls-wrapper--visible {\n opacity: 1;\n }\n\n .fw-controls-wrapper--hidden {\n opacity: 0;\n }\n\n .fw-controls-row {\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n\n .fw-controls-left {\n display: flex;\n align-items: center;\n min-width: 0;\n flex-shrink: 1;\n }\n\n .fw-controls-right {\n display: flex;\n align-items: center;\n }\n\n .fw-seek-wrapper {\n width: 100%;\n padding: 0 0.5rem;\n margin-bottom: -0.25rem;\n }\n\n / --- SeekBar Component --- /\n .fw-seek-track {\n position: absolute;\n left: 0;\n right: 0;\n height: 4px;\n border-radius: 9999px;\n background: hsl(var(--tn-fg-gutter) / 0.4);\n transition: height 0.15s ease;\n }\n\n .fw-seek-wrapper:hover .fw-seek-track,\n .fw-seek-track--active {\n height: 6px;\n }\n\n .fw-seek-buffered {\n position: absolute;\n height: 100%;\n border-radius: 9999px;\n background: hsl(var(--tn-fg) / 0.3);\n transition: all 0.2s ease;\n }\n\n .fw-seek-progress {\n position: absolute;\n height: 100%;\n border-radius: 9999px;\n background: hsl(var(--tn-blue));\n transition: width 0.1s linear;\n }\n\n .fw-seek-thumb {\n position: absolute;\n top: 50%;\n width: 16px;\n height: 16px;\n border-radius: 50%;\n background: hsl(var(--tn-blue));\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);\n transform: translate(-50%, -50%);\n transition:\n opacity 0.15s ease,\n transform 0.15s ease;\n opacity: 0;\n pointer-events: none;\n }\n\n .fw-seek-wrapper:hover .fw-seek-thumb,\n .fw-seek-thumb--active {\n opacity: 1;\n transform: translate(-50%, -50%) scale(1);\n }\n\n .fw-seek-thumb--hidden {\n opacity: 0;\n transform: translate(-50%, -50%) scale(0.75);\n }\n\n .fw-seek-tooltip {\n position: absolute;\n bottom: 100%;\n margin-bottom: 8px;\n padding: 4px 8px;\n font-family: ui-monospace, monospace;\n font-size: 12px;\n background: hsl(var(--tn-bg-dark) / 0.95);\n color: hsl(var(--tn-fg));\n border-radius: 4px;\n white-space: nowrap;\n pointer-events: none;\n transform: translateX(-50%);\n }\n\n / --- Stats Panel --- /\n .fw-stats-panel {\n position: absolute;\n top: 0.5rem;\n right: 0.5rem;\n width: 18rem;\n max-height: 80%;\n overflow-y: auto;\n background: hsl(var(--tn-bg-dark) / 0.85);\n backdrop-filter: blur(4px);\n border: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n font-family: ui-monospace, monospace;\n font-size: 0.75rem;\n z-index: 30;\n }\n\n .fw-stats-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0.5rem;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n font-size: 10px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-stats-section {\n padding: 0.5rem;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-stats-section:last-child {\n border-bottom: none;\n }\n\n .fw-stats-row {\n display: flex;\n justify-content: space-between;\n padding: 0.125rem 0;\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-stats-value {\n color: hsl(var(--tn-fg));\n }\n\n / --- Loading Screen --- /\n .fw-loading-screen {\n position: absolute;\n inset: 0;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n background: hsl(var(--tn-bg-dark));\n z-index: 20;\n }\n\n .fw-loading-spinner {\n width: 2rem;\n height: 2rem;\n border: 3px solid hsl(var(--tn-fg-gutter) / 0.3);\n border-top-color: hsl(var(--tn-blue));\n border-radius: 50%;\n animation: spin 1s linear infinite;\n }\n\n .fw-loading-text {\n margin-top: 1rem;\n font-size: 0.875rem;\n color: hsl(var(--tn-fg-dark));\n }\n\n / --- Idle Screen --- /\n .fw-idle-screen {\n position: absolute;\n inset: 0;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n background: hsl(var(--tn-bg-dark));\n z-index: 20;\n }\n\n .fw-idle-message {\n font-size: 0.875rem;\n color: hsl(var(--tn-fg-dark));\n }\n\n / --- Stream State Overlay --- /\n .fw-stream-state-overlay {\n position: absolute;\n inset: 0;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n background: hsl(var(--tn-bg-dark) / 0.9);\n gap: 1rem;\n z-index: 20;\n }\n\n .fw-stream-state-icon {\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-stream-state-text {\n font-size: 0.875rem;\n color: hsl(var(--tn-fg-dark));\n }\n\n / --- Title Overlay --- /\n .fw-title-overlay {\n padding: 1rem;\n background: linear-gradient(to bottom, hsl(var(--tn-bg-dark) / 0.8), transparent);\n }\n\n / --- Thumbnail Overlay --- /\n .fw-player-thumbnail {\n position: relative;\n display: flex;\n height: 100%;\n min-height: 280px;\n width: 100%;\n cursor: pointer;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n background: hsl(var(--tn-bg-dark));\n }\n\n / --- Speed Indicator --- /\n .fw-speed-indicator {\n pointer-events: none;\n background: none;\n backdrop-filter: none;\n }\n\n / --- Skip Indicator --- /\n .fw-skip-indicator {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n / --- Error Display --- /\n .fw-player-error {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 1rem;\n padding: 1.5rem;\n min-height: 280px;\n background: hsl(var(--tn-bg-dark));\n color: hsl(var(--tn-fg));\n text-align: center;\n }\n\n / --- Error Popup Overlay --- /\n .fw-error-overlay {\n position: absolute;\n z-index: 20;\n }\n\n .fw-error-overlay--fullscreen {\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n background: hsl(0 0% 0% / 0.6);\n backdrop-filter: blur(4px);\n }\n\n .fw-error-overlay--passive {\n top: 0.75rem;\n left: 0.75rem;\n right: 0.75rem;\n }\n\n .fw-error-popup {\n background: hsl(var(--tn-bg-dark));\n border: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3);\n overflow: hidden;\n }\n\n .fw-error-popup--fullscreen {\n min-width: 280px;\n max-width: 320px;\n }\n\n .fw-error-popup--passive {\n max-width: 28rem;\n }\n\n .fw-error-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0.5rem 0.75rem;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-error-header--error {\n background: hsl(0 70% 50% / 0.1);\n }\n\n .fw-error-header--warning {\n background: hsl(45 100% 50% / 0.1);\n }\n\n .fw-error-title {\n font-size: 11px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n }\n\n .fw-error-title--error {\n color: hsl(0 70% 60%);\n }\n\n .fw-error-title--warning {\n color: hsl(45 100% 50%);\n }\n\n .fw-error-close {\n width: 24px;\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n background: transparent;\n border: none;\n color: hsl(var(--tn-fg-dark));\n cursor: pointer;\n transition:\n background-color 0.15s ease,\n color 0.15s ease;\n }\n\n .fw-error-close:hover {\n background: hsl(var(--tn-fg) / 0.1);\n color: hsl(var(--tn-fg));\n }\n\n .fw-error-body {\n padding: 0.75rem;\n }\n\n .fw-error-message {\n font-size: 14px;\n color: hsl(var(--tn-fg));\n }\n\n .fw-error-actions {\n display: flex;\n border-top: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-error-btn {\n flex: 1;\n padding: 0.5rem 1rem;\n font-size: 12px;\n font-weight: 500;\n color: hsl(var(--tn-fg));\n background: transparent;\n border: none;\n cursor: pointer;\n transition:\n background-color 0.15s ease,\n color 0.15s ease;\n }\n\n .fw-error-btn:hover {\n background: hsl(var(--tn-fg) / 0.05);\n color: hsl(var(--tn-fg-bright));\n }\n\n / --- Context Menu Animations (for bits-ui) --- /\n @keyframes fw-context-menu-in {\n from {\n opacity: 0;\n transform: scale(0.95);\n }\n to {\n opacity: 1;\n transform: scale(1);\n }\n }\n\n @keyframes fw-context-menu-out {\n from {\n opacity: 1;\n transform: scale(1);\n }\n to {\n opacity: 0;\n transform: scale(0.95);\n }\n }\n\n .fw-context-menu[data-state=\"open\"] {\n animation: fw-context-menu-in 150ms cubic-bezier(0.4, 0, 0.2, 1);\n }\n\n .fw-context-menu[data-state=\"closed\"] {\n animation: fw-context-menu-out 150ms cubic-bezier(0.4, 0, 0.2, 1);\n }\n\n / Slide animations for different sides /\n .fw-context-menu[data-side=\"top\"] {\n transform-origin: bottom center;\n }\n\n .fw-context-menu[data-side=\"bottom\"] {\n transform-origin: top center;\n }\n\n .fw-context-menu[data-side=\"left\"] {\n transform-origin: right center;\n }\n\n .fw-context-menu[data-side=\"right\"] {\n transform-origin: left center;\n }\n\n / =====================================================\n DEV MODE PANEL (Advanced settings sidebar)\n ===================================================== /\n\n / Main panel - side panel container /\n .fw-dev-panel {\n z-index: 40;\n pointer-events: auto;\n background: hsl(var(--tn-bg-dark));\n border-left: 1px solid hsl(var(--tn-fg-gutter) / 0.5);\n color: hsl(var(--tn-fg));\n font-family: ui-monospace, monospace;\n font-size: 0.75rem;\n width: 280px;\n display: flex;\n flex-direction: column;\n height: 100%;\n flex-shrink: 0;\n }\n\n / Header with tabs /\n .fw-dev-header {\n display: flex;\n align-items: center;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n background: hsl(var(--tn-bg) / 0.5);\n }\n\n / Tab buttons /\n .fw-dev-tab {\n padding: 0.5rem 0.75rem;\n font-size: 10px;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n font-weight: 600;\n background: transparent;\n border: none;\n border-right: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n color: hsl(var(--tn-fg-dark));\n cursor: pointer;\n transition:\n background-color 0.15s,\n color 0.15s;\n }\n\n .fw-dev-tab:hover {\n background: hsl(var(--tn-bg-dark) / 0.5);\n color: hsl(var(--tn-fg));\n }\n\n .fw-dev-tab--active {\n background: hsl(var(--tn-bg-dark));\n color: hsl(var(--tn-fg-bright));\n }\n\n .fw-dev-close {\n padding: 0.5rem;\n width: 2rem;\n height: 2rem;\n display: flex;\n align-items: center;\n justify-content: center;\n background: transparent;\n border: none;\n color: hsl(var(--tn-fg-dark));\n cursor: pointer;\n transition: color 0.15s;\n margin-left: auto;\n }\n\n .fw-dev-close:hover {\n color: hsl(var(--tn-fg));\n }\n\n / Spacer - pushes close button to right /\n .fw-dev-spacer {\n flex: 1;\n }\n\n / Content area (body) /\n .fw-dev-content,\n .fw-dev-body {\n flex: 1;\n overflow-y: auto;\n }\n\n / Section with label /\n .fw-dev-section {\n padding: 0.75rem;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-dev-section-label,\n .fw-dev-label {\n font-size: 10px;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n font-weight: 600;\n color: hsl(var(--tn-fg-dark));\n margin-bottom: 0.25rem;\n }\n\n .fw-dev-section-value,\n .fw-dev-value {\n font-size: 0.875rem;\n color: hsl(var(--tn-fg-bright));\n }\n\n .fw-dev-value-arrow {\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-dev-value-muted {\n font-size: 10px;\n color: hsl(var(--tn-fg-dark));\n margin-top: 0.25rem;\n }\n\n .fw-dev-section-sub {\n font-size: 10px;\n color: hsl(var(--tn-fg-dark));\n margin-top: 0.25rem;\n }\n\n / Mode selector buttons /\n .fw-dev-mode-options,\n .fw-dev-mode-group {\n display: flex;\n gap: 0.25rem;\n margin-top: 0.5rem;\n }\n\n .fw-dev-mode-desc {\n font-size: 10px;\n color: hsl(var(--tn-fg-dark));\n margin-top: 0.5rem;\n font-style: italic;\n }\n\n .fw-dev-mode-btn {\n flex: 1;\n padding: 0.375rem 0.5rem;\n font-size: 10px;\n font-weight: 500;\n border-radius: 0.25rem;\n background: hsl(var(--tn-bg-highlight));\n border: none;\n color: hsl(var(--tn-fg-dark));\n cursor: pointer;\n transition:\n background-color 0.15s,\n color 0.15s;\n }\n\n .fw-dev-mode-btn:hover {\n color: hsl(var(--tn-fg));\n background: hsl(var(--tn-bg-visual));\n }\n\n .fw-dev-mode-btn--active {\n background: hsl(var(--tn-blue));\n color: hsl(var(--tn-bg-dark));\n }\n\n / Action buttons row /\n .fw-dev-actions {\n display: flex;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-dev-action-btn {\n flex: 1;\n padding: 0.5rem 0.75rem;\n background: hsl(var(--tn-bg-highlight));\n border: none;\n border-right: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n color: hsl(var(--tn-fg));\n font-size: 0.75rem;\n cursor: pointer;\n transition:\n background-color 0.15s,\n color 0.15s;\n }\n\n .fw-dev-action-btn:last-child {\n border-right: none;\n }\n\n .fw-dev-action-btn:hover {\n background: hsl(var(--tn-bg-visual));\n color: hsl(var(--tn-fg-bright));\n }\n\n / Combo list header /\n .fw-dev-list-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0.5rem 0.75rem;\n background: hsl(var(--tn-bg) / 0.5);\n }\n\n .fw-dev-list-title {\n font-size: 10px;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n font-weight: 600;\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-dev-list-toggle {\n font-size: 10px;\n color: hsl(var(--tn-fg-dark));\n background: transparent;\n border: none;\n cursor: pointer;\n display: flex;\n align-items: center;\n gap: 0.25rem;\n padding: 0.25rem;\n transition: color 0.15s;\n }\n\n .fw-dev-list-toggle:hover {\n color: hsl(var(--tn-fg));\n }\n\n / Combo list items /\n .fw-dev-combo-list {\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-dev-combo-item {\n width: 100%;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n padding: 0.5rem 0.75rem;\n text-align: left;\n background: transparent;\n border: none;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.2);\n color: hsl(var(--tn-fg));\n cursor: pointer;\n transition: background-color 0.15s;\n }\n\n .fw-dev-combo-item:last-child {\n border-bottom: none;\n }\n\n .fw-dev-combo-item:hover {\n background: hsl(var(--tn-bg) / 0.5);\n }\n\n .fw-dev-combo-item--active {\n background: hsl(var(--tn-bg-visual));\n color: hsl(var(--tn-fg-bright));\n box-shadow: inset 0 0 0 1px hsl(var(--tn-blue));\n }\n\n .fw-dev-combo-item--disabled {\n opacity: 0.4;\n }\n\n .fw-dev-combo-item--warning {\n background: hsl(var(--tn-yellow) / 0.05);\n }\n\n .fw-dev-combo-item--warning:hover {\n background: hsl(var(--tn-yellow) / 0.1);\n }\n\n .fw-dev-combo-rank {\n width: 1.25rem;\n height: 1.25rem;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 10px;\n font-weight: 700;\n border-radius: 0.125rem;\n background: hsl(var(--tn-fg-gutter) / 0.5);\n color: hsl(var(--tn-fg-dark));\n flex-shrink: 0;\n }\n\n .fw-dev-combo-rank--active {\n background: hsl(var(--tn-blue));\n color: hsl(var(--tn-bg-dark));\n }\n\n .fw-dev-combo-rank--warning {\n background: hsl(var(--tn-yellow) / 0.3);\n color: hsl(var(--tn-yellow));\n }\n\n .fw-dev-combo-name {\n flex: 1;\n font-size: 0.75rem;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .fw-dev-combo-arrow {\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-dev-combo-type {\n color: hsl(var(--tn-cyan));\n }\n\n .fw-dev-combo-type--warning {\n color: hsl(var(--tn-yellow));\n }\n\n .fw-dev-combo-score {\n font-size: 10px;\n font-family: ui-monospace, monospace;\n font-variant-numeric: tabular-nums;\n padding: 0.125rem 0.375rem;\n border-radius: 0.125rem;\n flex-shrink: 0;\n }\n\n .fw-dev-combo-score--high {\n background: hsl(var(--tn-green) / 0.2);\n color: hsl(var(--tn-green));\n }\n\n .fw-dev-combo-score--medium {\n background: hsl(var(--tn-blue) / 0.2);\n color: hsl(var(--tn-blue));\n }\n\n .fw-dev-combo-score--low {\n background: hsl(var(--tn-yellow) / 0.2);\n color: hsl(var(--tn-yellow));\n }\n\n / Tooltip for combo details /\n .fw-dev-tooltip {\n position: absolute;\n left: 0;\n z-index: 50;\n background: hsl(var(--tn-bg-dark));\n border: 1px solid hsl(var(--tn-fg-gutter));\n box-shadow:\n 0 4px 6px -1px rgb(0 0 0 / 0.1),\n 0 2px 4px -2px rgb(0 0 0 / 0.1);\n padding: 0.5rem;\n font-size: 10px;\n white-space: nowrap;\n pointer-events: none;\n min-width: 220px;\n }\n\n .fw-dev-tooltip--above {\n bottom: 100%;\n margin-bottom: 0.25rem;\n }\n\n .fw-dev-tooltip--below {\n top: 100%;\n margin-top: 0.25rem;\n }\n\n .fw-dev-tooltip-header {\n margin-bottom: 0.5rem;\n padding-bottom: 0.5rem;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.5);\n }\n\n .fw-dev-tooltip-title {\n font-weight: 700;\n color: hsl(var(--tn-fg-bright));\n }\n\n .fw-dev-tooltip-subtitle {\n color: hsl(var(--tn-cyan));\n }\n\n .fw-dev-tooltip-info {\n color: hsl(var(--tn-fg-dark));\n margin-top: 0.25rem;\n }\n\n .fw-dev-tooltip-score {\n font-weight: 700;\n color: hsl(var(--tn-fg-bright));\n margin-bottom: 0.25rem;\n }\n\n .fw-dev-tooltip-breakdown {\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-dev-tooltip-breakdown-value {\n color: hsl(var(--tn-fg));\n }\n\n .fw-dev-tooltip-breakdown-weight {\n color: hsl(var(--tn-fg-gutter));\n }\n\n .fw-dev-tooltip-error {\n color: hsl(var(--tn-red));\n }\n\n / Stats panel content /\n .fw-dev-stats-hero {\n padding: 0.75rem;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-dev-stats-rate {\n font-size: 1.5rem;\n font-weight: 700;\n font-variant-numeric: tabular-nums;\n }\n\n .fw-dev-stats-rate--good {\n color: hsl(var(--tn-green));\n }\n\n .fw-dev-stats-rate--catching {\n color: hsl(var(--tn-blue));\n }\n\n .fw-dev-stats-rate--slow {\n color: hsl(var(--tn-yellow));\n }\n\n .fw-dev-stats-rate--stalling {\n color: hsl(var(--tn-red));\n }\n\n .fw-dev-stats-label {\n font-size: 10px;\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-dev-stats-metrics {\n display: flex;\n gap: 1rem;\n margin-top: 0.5rem;\n font-size: 10px;\n }\n\n .fw-dev-stats-metric--good {\n color: hsl(var(--tn-green));\n }\n\n .fw-dev-stats-metric--warning {\n color: hsl(var(--tn-yellow));\n }\n\n .fw-dev-stats-metric--bad {\n color: hsl(var(--tn-red));\n }\n\n / Stats rows /\n .fw-dev-stats-rows {\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-dev-stats-row {\n display: flex;\n justify-content: space-between;\n padding: 0.5rem 0.75rem;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.2);\n }\n\n .fw-dev-stats-row:last-child {\n border-bottom: none;\n }\n\n .fw-dev-stats-key {\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-dev-stats-value {\n color: hsl(var(--tn-fg-bright));\n }\n\n .fw-dev-stats-value--cyan {\n color: hsl(var(--tn-cyan));\n }\n\n .fw-dev-stats-value--warning {\n color: hsl(var(--tn-yellow));\n }\n\n .fw-dev-stats-value--bad {\n color: hsl(var(--tn-red));\n }\n\n .fw-dev-stats-value--good {\n color: hsl(var(--tn-green));\n }\n\n / Track badges /\n .fw-dev-track-badge {\n font-size: 10px;\n font-family: ui-monospace, monospace;\n text-transform: uppercase;\n padding: 0.125rem 0.375rem;\n }\n\n .fw-dev-track-badge--video {\n background: hsl(var(--tn-blue) / 0.2);\n color: hsl(var(--tn-blue));\n }\n\n .fw-dev-track-badge--audio {\n background: hsl(var(--tn-green) / 0.2);\n color: hsl(var(--tn-green));\n }\n\n .fw-dev-track-badge--other {\n background: hsl(var(--tn-yellow) / 0.2);\n color: hsl(var(--tn-yellow));\n }\n\n .fw-dev-track-info {\n display: flex;\n flex-wrap: wrap;\n gap: 0.5rem;\n font-size: 10px;\n color: hsl(var(--tn-fg-dark));\n }\n\n / Empty state /\n .fw-dev-empty,\n .fw-dev-list-empty {\n padding: 1rem 0.75rem;\n text-align: center;\n color: hsl(var(--tn-fg-dark));\n }\n\n / Chevron icon (expand/collapse toggle) /\n .fw-dev-chevron {\n transition: transform 0.15s;\n }\n\n .fw-dev-chevron--open {\n transform: rotate(180deg);\n }\n\n / Combo wrapper (relative for tooltip positioning) /\n .fw-dev-combo {\n position: relative;\n }\n\n / Combo button (alias for fw-dev-combo-item) /\n .fw-dev-combo-btn {\n width: 100%;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n padding: 0.5rem 0.75rem;\n text-align: left;\n background: transparent;\n border: none;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.2);\n color: hsl(var(--tn-fg));\n cursor: pointer;\n transition: background-color 0.15s;\n }\n\n .fw-dev-combo-btn:last-child {\n border-bottom: none;\n }\n\n .fw-dev-combo-btn:hover {\n background: hsl(var(--tn-bg) / 0.5);\n }\n\n .fw-dev-combo-btn--active {\n background: hsl(var(--tn-bg-visual));\n color: hsl(var(--tn-fg-bright));\n box-shadow: inset 0 0 0 1px hsl(var(--tn-blue));\n }\n\n .fw-dev-combo-btn--disabled {\n opacity: 0.4;\n }\n\n .fw-dev-combo-btn--codec-warn {\n background: hsl(var(--tn-yellow) / 0.05);\n }\n\n .fw-dev-combo-btn--codec-warn:hover {\n background: hsl(var(--tn-yellow) / 0.1);\n }\n\n / Combo rank modifiers /\n .fw-dev-combo-rank--disabled {\n background: hsl(var(--tn-fg-gutter) / 0.3);\n color: hsl(var(--tn-fg-gutter));\n }\n\n .fw-dev-combo-rank--warn {\n background: hsl(var(--tn-yellow) / 0.3);\n color: hsl(var(--tn-yellow));\n }\n\n / Combo type modifiers /\n .fw-dev-combo-type--disabled {\n color: hsl(var(--tn-fg-gutter));\n }\n\n .fw-dev-combo-type--warn {\n color: hsl(var(--tn-yellow));\n }\n\n / Combo score modifiers (additional) /\n .fw-dev-combo-score--disabled {\n background: hsl(var(--tn-fg-gutter) / 0.2);\n color: hsl(var(--tn-fg-gutter));\n }\n\n .fw-dev-combo-score--mid {\n background: hsl(var(--tn-blue) / 0.2);\n color: hsl(var(--tn-blue));\n }\n\n / Tooltip additional classes /\n .fw-dev-tooltip-tracks {\n color: hsl(var(--tn-fg-dark));\n margin-top: 0.25rem;\n }\n\n .fw-dev-tooltip-value {\n color: hsl(var(--tn-fg));\n }\n\n .fw-dev-tooltip-row {\n color: hsl(var(--tn-fg-dark));\n margin-bottom: 0.125rem;\n }\n\n .fw-dev-tooltip-bonus {\n color: hsl(var(--tn-green));\n }\n\n .fw-dev-tooltip-penalty {\n color: hsl(var(--tn-red));\n }\n\n .fw-dev-tooltip-weight {\n color: hsl(var(--tn-fg-gutter));\n font-size: 9px;\n }\n\n / =====================================================\n DEV MODE STATS TAB\n ===================================================== /\n\n / Section header modifier /\n .fw-dev-section-header {\n margin-top: 0.5rem;\n }\n\n / Playback rate hero section /\n .fw-dev-rate {\n display: flex;\n align-items: baseline;\n gap: 0.5rem;\n margin-bottom: 0.5rem;\n }\n\n .fw-dev-rate-value {\n font-size: 1.5rem;\n font-weight: 700;\n font-variant-numeric: tabular-nums;\n }\n\n .fw-dev-rate-status {\n font-size: 10px;\n color: hsl(var(--tn-fg-dark));\n text-transform: uppercase;\n }\n\n .fw-dev-rate-stats {\n display: flex;\n gap: 1rem;\n font-size: 10px;\n color: hsl(var(--tn-fg-dark));\n }\n\n / Stat value modifiers /\n .fw-dev-stat-value--good {\n color: hsl(var(--tn-green));\n }\n\n .fw-dev-stat-value--accent {\n color: hsl(var(--tn-blue));\n }\n\n .fw-dev-stat-value--warn {\n color: hsl(var(--tn-yellow));\n }\n\n .fw-dev-stat-value--bad {\n color: hsl(var(--tn-red));\n }\n\n / Stats row (key-value pair) /\n .fw-dev-stat {\n display: flex;\n justify-content: space-between;\n padding: 0.5rem 0.75rem;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.2);\n }\n\n .fw-dev-stat:last-child {\n border-bottom: none;\n }\n\n .fw-dev-stat-label {\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-dev-stat-value {\n color: hsl(var(--tn-fg-bright));\n }\n\n / Track display /\n .fw-dev-track {\n padding: 0.5rem 0.75rem;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.2);\n }\n\n .fw-dev-track:last-child {\n border-bottom: none;\n }\n\n .fw-dev-track-header {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n margin-bottom: 0.25rem;\n }\n\n .fw-dev-track-codec {\n font-size: 10px;\n color: hsl(var(--tn-fg));\n font-weight: 500;\n }\n\n .fw-dev-track-id {\n font-size: 10px;\n color: hsl(var(--tn-fg-gutter));\n margin-left: auto;\n }\n\n .fw-dev-track-meta {\n display: flex;\n flex-wrap: wrap;\n gap: 0.5rem;\n font-size: 10px;\n color: hsl(var(--tn-fg-dark));\n }\n\n / No tracks state */\n .fw-dev-no-tracks {\n padding: 0.75rem;\n text-align: center;\n }\n\n .fw-dev-no-tracks-text {\n color: hsl(var(--tn-fg-dark));\n font-size: 10px;\n }\n\n .fw-dev-no-tracks-type {\n color: hsl(var(--tn-fg-gutter));\n margin-left: 0.25rem;\n }\n}\n\n`;\n"],"names":[],"mappings":";;AAAA;AACA;AAGO,MAAM,YAAY,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"shared-styles.js","sources":["../../../../src/styles/shared-styles.ts"],"sourcesContent":["// AUTO-GENERATED — do not edit. Run `pnpm run build:css` to regenerate.\n// Source: packages/core/src/styles/player.css\nimport { css } from \"lit\";\n\nexport const sharedStyles = css`\n/\n FrameWorks Player CSS\n * Plain CSS - no build step required (just copy to dist).\n * CSS variables are OUTSIDE layer for guaranteed availability.\n * Component styles are in @layer fw-player for cascade isolation.\n /\n\n/ =====================================================\n CSS VARIABLES - OUTSIDE LAYER (always available)\n ===================================================== /\n\n/\n * Player-scoped CSS variables - on .fw-player-surface to avoid :root pollution.\n * All player components must be wrapped in .fw-player-surface to inherit these.\n * These are OUTSIDE the layer so they're always available regardless of cascade.\n /\n.fw-player-surface {\n / Tokyo Night color palette /\n --tn-bg-dark: 235 21% 11%; / #1a1b26 - Darkest (slab backgrounds) /\n --tn-bg: 233 23% 17%; / #24283b - Main background /\n --tn-bg-highlight: 233 23% 21%; / #292e42 - Elevated surfaces /\n --tn-bg-visual: 232 27% 25%; / #33395e - Selection/active states /\n\n / Text hierarchy /\n --tn-fg: 223 27% 76%; / #a9b1d6 - Primary text /\n --tn-fg-bright: 220 13% 91%; / #e2e4ea - Bright/highlighted text /\n --tn-fg-dark: 224 16% 53%; / #787c99 - Secondary text (muted) /\n --tn-fg-gutter: 228 15% 45%; / #5a607f - Borders, seams /\n\n / Accent colors (semantic) /\n --tn-blue: 218 79% 73%; / #7aa2f7 - Primary actions /\n --tn-green: 95 53% 55%; / #9ece6a - Success /\n --tn-red: 348 74% 64%; / #f7768e - Destructive, live /\n --tn-yellow: 35 79% 64%; / #e0af68 - Warnings /\n --tn-purple: 267 82% 77%; / #bb9af7 - Secondary accent /\n --tn-cyan: 178 64% 63%; / #7dcfff - Info /\n --tn-teal: 162 66% 62%; / #73daca - Terminal green /\n\n / Player-internal variables (not shared with host) /\n --fw-background: var(--tn-bg);\n --fw-foreground: var(--tn-fg);\n --fw-card: var(--tn-bg-highlight);\n --fw-card-foreground: var(--tn-fg);\n --fw-popover: var(--tn-bg-highlight);\n --fw-popover-foreground: var(--tn-fg);\n --fw-primary: var(--tn-blue);\n --fw-primary-foreground: var(--tn-bg-dark);\n --fw-secondary: var(--tn-bg-visual);\n --fw-secondary-foreground: var(--tn-fg);\n --fw-muted: var(--tn-bg-highlight);\n --fw-muted-foreground: var(--tn-fg-dark);\n --fw-accent: var(--tn-bg-visual);\n --fw-accent-foreground: var(--tn-fg);\n --fw-destructive: var(--tn-red);\n --fw-destructive-foreground: var(--tn-bg-dark);\n --fw-border: var(--tn-fg-gutter);\n --fw-input: var(--tn-bg-highlight);\n --fw-ring: var(--tn-blue);\n --fw-radius: 0;\n\n / Controls-specific variables /\n --fw-controls-bg: hsl(var(--tn-bg-dark) / 0.85);\n --fw-controls-fg: hsl(var(--tn-fg));\n --fw-seam: hsl(var(--tn-fg-gutter) / 0.3);\n color: var(--fw-controls-fg);\n}\n\n/ Declare layer upfront for lowest priority /\n@layer fw-player;\n\n/ Component styles in the fw-player layer /\n@layer fw-player {\n / =====================================================\n ANIMATIONS\n ===================================================== /\n @keyframes float {\n 0%,\n 100% {\n transform: translateY(0px) scale(1);\n }\n 50% {\n transform: translateY(-12px) scale(0.95);\n }\n }\n\n @keyframes spin-slow {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n }\n\n @keyframes spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n }\n\n .animate-spin-slow {\n animation: spin-slow 18s linear infinite;\n }\n\n .animate-spin {\n animation: spin 1s linear infinite;\n }\n\n / =====================================================\n SLAB SYSTEM - Player Controls & Overlays\n ===================================================== /\n\n .fw-player-surface button {\n font: inherit;\n }\n\n / Slab base - solid structural block /\n .fw-slab {\n background: var(--fw-controls-bg);\n border: 1px solid var(--fw-seam);\n }\n\n / Slab header - uppercase, padded /\n .fw-slab-header {\n padding: 0.5rem 1rem;\n border-bottom: 1px solid var(--fw-seam);\n font-size: 0.75rem;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n color: hsl(var(--tn-fg-dark));\n }\n\n / Slab body - padded content area /\n .fw-slab-body {\n padding: 1rem;\n }\n\n / Slab actions - flush buttons, seams between /\n .fw-slab-actions {\n display: flex;\n border-top: 1px solid var(--fw-seam);\n }\n\n .fw-slab-actions > {\n flex: 1;\n border-radius: 0 !important;\n }\n\n .fw-slab-actions > * + * {\n border-left: 1px solid var(--fw-seam);\n }\n\n /* Control bar - stacked layout (seekbar above controls row) /\n .fw-control-bar {\n display: flex;\n flex-direction: column;\n width: 100%;\n background: var(--fw-controls-bg);\n border-top: 1px solid var(--fw-seam);\n backdrop-filter: blur(8px);\n pointer-events: auto;\n }\n\n / Control group - seamed sections within bar /\n .fw-control-group {\n display: flex;\n align-items: center;\n padding: 0.5rem;\n }\n\n .fw-control-group + .fw-control-group {\n border-left: 1px solid var(--fw-seam);\n }\n\n / Flush button - fills space, no radius /\n .fw-btn-flush {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0.5rem 0.75rem;\n border-radius: 0;\n background: transparent;\n color: hsl(var(--tn-fg));\n transition:\n background-color 0.15s,\n color 0.15s;\n cursor: pointer;\n border: none;\n }\n\n .fw-btn-flush:hover {\n background: hsl(var(--tn-bg-visual) / 0.5);\n }\n\n .fw-btn-flush:active {\n background: hsl(var(--tn-bg-visual));\n }\n\n .fw-btn-flush--active {\n color: hsl(var(--tn-blue));\n }\n\n / Status indicators /\n .fw-status-online {\n color: hsl(var(--tn-green));\n }\n .fw-status-offline {\n color: hsl(var(--tn-red));\n }\n .fw-status-warning {\n color: hsl(var(--tn-yellow));\n }\n .fw-status-info {\n color: hsl(var(--tn-cyan));\n }\n\n / =====================================================\n PLAYER CONTAINER STYLES (Slab-based)\n ===================================================== /\n\n .fw-player-root {\n position: relative;\n height: 100%;\n width: 100%;\n overflow: hidden;\n border-radius: 0; / Slabs don't have rounded corners /\n background-color: hsl(var(--tn-bg-dark));\n border: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-player-container {\n height: 100%;\n width: 100%;\n overflow: hidden;\n border-radius: 0;\n background-color: hsl(var(--tn-bg-dark));\n }\n\n .fw-player-video {\n height: 100%;\n width: 100%;\n border-radius: 0;\n object-fit: contain;\n background-color: hsl(var(--tn-bg-dark));\n }\n\n .fw-player-embed {\n height: 100%;\n width: 100%;\n min-height: 300px;\n border-radius: 0;\n border-width: 0;\n background-color: hsl(var(--tn-bg-dark));\n }\n\n .fw-player-dvd {\n position: absolute;\n pointer-events: none;\n user-select: none;\n -webkit-user-select: none;\n }\n\n / =====================================================\n VIDEO.JS CONTAINER CONSTRAINTS\n ===================================================== /\n\n / VideoJS wrapper must respect container bounds /\n .fw-player-container .video-js {\n width: 100% !important;\n height: 100% !important;\n max-width: 100% !important;\n max-height: 100% !important;\n min-width: 0 !important;\n min-height: 0 !important;\n padding: 0 !important;\n background: black;\n }\n\n / Ensure video tech fills the wrapper with letterboxing /\n .fw-player-container .video-js .vjs-tech {\n width: 100% !important;\n height: 100% !important;\n object-fit: contain !important;\n }\n\n / =====================================================\n VIDEO.JS UI HIDING (when using custom controls)\n ===================================================== /\n\n / Hide all VideoJS chrome when using our custom controls /\n .vjs-fw-custom-controls .vjs-control-bar,\n .vjs-fw-custom-controls .vjs-big-play-button,\n .vjs-fw-custom-controls .vjs-loading-spinner,\n .vjs-fw-custom-controls .vjs-text-track-display,\n .vjs-fw-custom-controls .vjs-error-display,\n .vjs-fw-custom-controls .vjs-modal-dialog,\n .vjs-fw-custom-controls .vjs-poster,\n .vjs-fw-custom-controls .vjs-live-control,\n .vjs-fw-custom-controls .vjs-title-bar {\n display: none !important;\n }\n\n / Ensure video element fills container (absolute positioning) /\n .vjs-fw-custom-controls .vjs-tech {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n object-fit: contain;\n }\n\n / =====================================================\n SEMANTIC COMPONENT CLASSES (npm_studio pattern)\n All component styling - no Tailwind utilities needed\n ===================================================== /\n\n / --- Settings Menu --- /\n .fw-settings-menu {\n position: absolute;\n bottom: 3rem;\n right: 0;\n width: 12rem;\n max-height: 70vh;\n overflow-y: auto;\n background: hsl(var(--tn-bg-dark));\n border: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n box-shadow:\n 0 10px 15px -3px rgb(0 0 0 / 0.1),\n 0 4px 6px -4px rgb(0 0 0 / 0.1);\n border-radius: 0.25rem;\n z-index: 50;\n }\n\n .fw-settings-section {\n padding: 0.5rem;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-settings-section:last-child {\n border-bottom: none;\n }\n\n .fw-settings-label {\n font-size: 10px;\n color: hsl(var(--tn-fg-dark));\n text-transform: uppercase;\n font-weight: 600;\n margin-bottom: 0.25rem;\n padding-left: 0.25rem;\n }\n\n .fw-settings-options {\n display: flex;\n gap: 0.25rem;\n }\n\n .fw-settings-options--wrap {\n flex-wrap: wrap;\n }\n\n .fw-settings-btn {\n flex: 1;\n padding: 0.375rem 0.25rem;\n font-size: 10px;\n border-radius: 0.25rem;\n background: hsl(var(--tn-bg));\n color: hsl(var(--tn-fg));\n border: none;\n cursor: pointer;\n transition:\n background-color 0.15s,\n color 0.15s;\n }\n\n .fw-settings-btn:hover {\n background: hsl(var(--tn-bg-highlight));\n }\n\n .fw-settings-btn--active {\n background: hsl(var(--tn-blue));\n color: hsl(var(--tn-bg-dark));\n }\n\n .fw-settings-btn--active:hover {\n background: hsl(var(--tn-blue));\n }\n\n .fw-settings-list {\n display: flex;\n flex-direction: column;\n gap: 0.125rem;\n max-height: 8rem;\n overflow-y: auto;\n }\n\n .fw-settings-list-item {\n padding: 0.25rem 0.5rem;\n font-size: 0.75rem;\n text-align: left;\n border-radius: 0.25rem;\n background: transparent;\n color: hsl(var(--tn-fg));\n border: none;\n cursor: pointer;\n transition: background-color 0.15s;\n }\n\n .fw-settings-list-item:hover {\n background: hsl(var(--tn-bg-highlight));\n }\n\n .fw-settings-list-item--active {\n background: hsl(var(--tn-blue) / 0.2);\n color: hsl(var(--tn-blue));\n }\n\n / --- Context Menu (bits-ui wrapper) --- /\n .fw-context-menu {\n z-index: 50;\n min-width: 8rem;\n overflow: hidden;\n border-radius: 0.25rem;\n border: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n background: hsl(var(--tn-bg-dark));\n padding: 0;\n color: hsl(var(--tn-fg));\n box-shadow:\n 0 10px 15px -3px rgb(0 0 0 / 0.1),\n 0 4px 6px -4px rgb(0 0 0 / 0.1);\n }\n\n .fw-context-menu-item {\n position: relative;\n display: flex;\n width: 100%;\n justify-content: flex-start;\n gap: 0.5rem;\n cursor: pointer;\n user-select: none;\n align-items: center;\n padding: 0.5rem 0.75rem;\n font-size: 0.875rem;\n text-align: left;\n font: inherit;\n border: none;\n background: transparent;\n appearance: none;\n -webkit-appearance: none;\n outline: none;\n color: hsl(var(--tn-fg));\n transition:\n background-color 0.15s,\n color 0.15s;\n }\n\n .fw-context-menu-item:hover,\n .fw-context-menu-item:focus {\n background: hsl(var(--tn-bg-visual));\n color: white;\n }\n\n .fw-context-menu-item[data-disabled] {\n pointer-events: none;\n opacity: 0.5;\n }\n\n .fw-context-menu-item--inset {\n padding-left: 2rem;\n }\n\n .fw-context-menu-separator {\n margin: 0.25rem -0.25rem;\n height: 1px;\n background: hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-context-menu-label {\n padding: 0.375rem 0.5rem;\n font-size: 0.75rem;\n font-weight: 600;\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-context-menu-checkbox {\n position: relative;\n display: flex;\n width: 100%;\n justify-content: flex-start;\n gap: 0.5rem;\n cursor: pointer;\n user-select: none;\n align-items: center;\n padding: 0.5rem 0.5rem 0.5rem 2rem;\n font-size: 0.875rem;\n text-align: left;\n font: inherit;\n border: none;\n background: transparent;\n appearance: none;\n -webkit-appearance: none;\n outline: none;\n color: hsl(var(--tn-fg));\n transition:\n background-color 0.15s,\n color 0.15s;\n }\n\n .fw-context-menu-checkbox:hover,\n .fw-context-menu-checkbox:focus {\n background: hsl(var(--tn-bg-visual));\n color: white;\n }\n\n .fw-context-menu-indicator {\n position: absolute;\n left: 0.5rem;\n display: flex;\n height: 0.875rem;\n width: 0.875rem;\n align-items: center;\n justify-content: center;\n }\n\n / --- Live Badge --- /\n .fw-live-badge {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n padding: 0.125rem 0.5rem;\n font-size: 10px;\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n transition:\n background-color 0.15s,\n color 0.15s;\n border: none;\n cursor: pointer;\n }\n\n .fw-live-badge--active {\n background: rgb(220 38 38);\n color: white;\n cursor: default;\n }\n\n .fw-live-badge--behind {\n background: #414868;\n color: #a9b1d6;\n }\n\n .fw-live-badge--behind:hover {\n background: rgb(220 38 38);\n color: white;\n }\n\n / --- Volume Control --- /\n .fw-volume-group {\n display: flex;\n align-items: center;\n border-radius: 0;\n transition:\n background-color 0.2s,\n width 0.2s;\n cursor: pointer;\n }\n\n .fw-volume-group--expanded {\n background: hsl(var(--tn-bg-visual) / 0.5);\n }\n\n .fw-volume-group:hover {\n background: hsl(var(--tn-bg-visual) / 0.5);\n }\n\n .fw-volume-group--expanded:hover {\n background: hsl(var(--tn-bg-visual) / 0.5);\n }\n\n .fw-volume-group--disabled {\n opacity: 0.4;\n cursor: not-allowed;\n }\n\n .fw-volume-btn {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 2rem;\n height: 2rem;\n color: rgb(255 255 255 / 0.8);\n background: transparent;\n border: none;\n cursor: pointer;\n transition: color 0.15s;\n }\n\n .fw-volume-btn:hover {\n color: white;\n }\n\n .fw-volume-slider-wrapper {\n display: flex;\n align-items: center;\n overflow: hidden;\n transition:\n width 0.2s ease-out,\n opacity 0.2s ease-out;\n }\n\n .fw-volume-slider-wrapper--collapsed {\n width: 0;\n opacity: 0;\n }\n\n .fw-volume-slider-wrapper--expanded {\n width: 7rem;\n padding-right: 0.5rem;\n opacity: 1;\n }\n\n / --- Slider Component (shared by React/Svelte) --- /\n .fw-slider {\n position: relative;\n display: flex;\n width: 100%;\n height: 1.25rem;\n touch-action: none;\n user-select: none;\n align-items: center;\n cursor: pointer;\n }\n\n .fw-slider--vertical {\n flex-direction: column;\n width: 1.25rem;\n height: 100%;\n }\n\n .fw-slider-track {\n position: absolute;\n left: 0;\n right: 0;\n height: 4px;\n border-radius: 9999px;\n background: hsl(var(--tn-fg-gutter) / 0.4);\n overflow: hidden;\n transition: height 0.15s ease;\n }\n\n .fw-slider:hover .fw-slider-track {\n height: 6px;\n }\n\n .fw-slider--vertical .fw-slider-track {\n top: 0;\n bottom: 0;\n left: 50%;\n right: auto;\n width: 4px;\n height: auto;\n transform: translateX(-50%);\n }\n\n .fw-slider--vertical:hover .fw-slider-track {\n width: 6px;\n height: auto;\n }\n\n .fw-slider-range {\n position: absolute;\n height: 100%;\n border-radius: 9999px;\n background: hsl(var(--tn-fg));\n }\n\n .fw-slider-range--accent {\n background: hsl(var(--tn-cyan));\n }\n\n .fw-slider--vertical .fw-slider-range {\n width: 100%;\n height: auto;\n bottom: 0;\n }\n\n .fw-slider-thumb {\n display: block;\n width: 10px;\n height: 10px;\n border-radius: 50%;\n background: hsl(var(--tn-fg));\n border: none;\n box-shadow: 0 2px 4px rgb(0 0 0 / 0.3);\n cursor: pointer;\n transition:\n width 0.15s ease,\n height 0.15s ease,\n box-shadow 0.15s ease;\n }\n\n .fw-slider:hover .fw-slider-thumb {\n width: 14px;\n height: 14px;\n }\n\n .fw-slider-thumb:focus {\n outline: none;\n }\n\n .fw-slider-thumb:focus-visible {\n box-shadow: 0 0 0 2px hsl(var(--tn-fg) / 0.5);\n }\n\n .fw-slider-thumb--accent {\n background: hsl(var(--tn-cyan));\n }\n\n .fw-slider-thumb[data-disabled] {\n pointer-events: none;\n opacity: 0.5;\n }\n\n / --- Time Display --- /\n .fw-time-display {\n font-family: ui-monospace, monospace;\n font-size: 11px;\n line-height: 1;\n color: hsl(var(--tn-fg-dark));\n white-space: nowrap;\n padding: 0 0.5rem;\n }\n\n / --- Controls Wrapper --- /\n .fw-controls-wrapper {\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n display: flex;\n flex-direction: column;\n justify-content: flex-end;\n transition: opacity 0.2s;\n pointer-events: none;\n }\n\n .fw-controls-wrapper--visible {\n opacity: 1;\n }\n\n .fw-controls-wrapper--hidden {\n opacity: 0;\n }\n\n .fw-controls-row {\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n\n .fw-controls-left {\n display: flex;\n align-items: center;\n min-width: 0;\n flex-shrink: 1;\n }\n\n .fw-controls-right {\n display: flex;\n align-items: center;\n }\n\n .fw-seek-wrapper {\n width: 100%;\n padding: 0 0.5rem;\n margin-bottom: -0.25rem;\n }\n\n / --- SeekBar Component --- /\n .fw-seek-track {\n position: absolute;\n left: 0;\n right: 0;\n height: 4px;\n border-radius: 9999px;\n background: hsl(var(--tn-fg-gutter) / 0.4);\n transition: height 0.15s ease;\n }\n\n .fw-seek-wrapper:hover .fw-seek-track,\n .fw-seek-track--active {\n height: 6px;\n }\n\n .fw-seek-buffered {\n position: absolute;\n height: 100%;\n border-radius: 9999px;\n background: hsl(var(--tn-fg) / 0.3);\n transition: all 0.2s ease;\n }\n\n .fw-seek-progress {\n position: absolute;\n height: 100%;\n border-radius: 9999px;\n background: hsl(var(--tn-blue));\n transition: width 0.1s linear;\n }\n\n .fw-seek-thumb {\n position: absolute;\n top: 50%;\n width: 16px;\n height: 16px;\n border-radius: 50%;\n background: hsl(var(--tn-blue));\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);\n transform: translate(-50%, -50%);\n transition:\n opacity 0.15s ease,\n transform 0.15s ease;\n opacity: 0;\n pointer-events: none;\n }\n\n .fw-seek-wrapper:hover .fw-seek-thumb,\n .fw-seek-thumb--active {\n opacity: 1;\n transform: translate(-50%, -50%) scale(1);\n }\n\n .fw-seek-thumb--hidden {\n opacity: 0;\n transform: translate(-50%, -50%) scale(0.75);\n }\n\n .fw-seek-tooltip {\n position: absolute;\n bottom: 100%;\n margin-bottom: 8px;\n padding: 4px 8px;\n font-family: ui-monospace, monospace;\n font-size: 12px;\n background: hsl(var(--tn-bg-dark) / 0.95);\n color: hsl(var(--tn-fg));\n border-radius: 4px;\n white-space: nowrap;\n pointer-events: none;\n transform: translateX(-50%);\n }\n\n / --- Stats Panel --- /\n .fw-stats-panel {\n position: absolute;\n top: 0.5rem;\n right: 0.5rem;\n width: 18rem;\n max-height: 80%;\n overflow-y: auto;\n background: hsl(var(--tn-bg-dark) / 0.85);\n backdrop-filter: blur(4px);\n border: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n font-family: ui-monospace, monospace;\n font-size: 0.75rem;\n z-index: 30;\n }\n\n .fw-stats-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0.5rem;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n font-size: 10px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-stats-section {\n padding: 0.5rem;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-stats-section:last-child {\n border-bottom: none;\n }\n\n .fw-stats-row {\n display: flex;\n justify-content: space-between;\n padding: 0.125rem 0;\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-stats-value {\n color: hsl(var(--tn-fg));\n }\n\n / --- Loading Screen --- /\n .fw-loading-screen {\n position: absolute;\n inset: 0;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n background: hsl(var(--tn-bg-dark));\n z-index: 20;\n }\n\n .fw-loading-spinner {\n width: 2rem;\n height: 2rem;\n border: 3px solid hsl(var(--tn-fg-gutter) / 0.3);\n border-top-color: hsl(var(--tn-blue));\n border-radius: 50%;\n animation: spin 1s linear infinite;\n }\n\n .fw-loading-text {\n margin-top: 1rem;\n font-size: 0.875rem;\n color: hsl(var(--tn-fg-dark));\n }\n\n / --- Idle Screen --- /\n .fw-idle-screen {\n position: absolute;\n inset: 0;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n background: hsl(var(--tn-bg-dark));\n z-index: 20;\n }\n\n .fw-idle-message {\n font-size: 0.875rem;\n color: hsl(var(--tn-fg-dark));\n }\n\n / --- Stream State Overlay --- /\n .fw-stream-state-overlay {\n position: absolute;\n inset: 0;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n background: hsl(var(--tn-bg-dark) / 0.9);\n gap: 1rem;\n z-index: 20;\n }\n\n .fw-stream-state-icon {\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-stream-state-text {\n font-size: 0.875rem;\n color: hsl(var(--tn-fg-dark));\n }\n\n / --- Title Overlay --- /\n .fw-title-overlay {\n padding: 1rem;\n background: linear-gradient(to bottom, hsl(var(--tn-bg-dark) / 0.8), transparent);\n }\n\n / --- Thumbnail Overlay --- /\n .fw-player-thumbnail {\n position: relative;\n display: flex;\n height: 100%;\n min-height: 280px;\n width: 100%;\n cursor: pointer;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n background: hsl(var(--tn-bg-dark));\n }\n\n / --- Speed Indicator --- /\n .fw-speed-indicator {\n pointer-events: none;\n background: none;\n backdrop-filter: none;\n }\n\n / --- Skip Indicator --- /\n .fw-skip-indicator {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n / --- Error Display --- /\n .fw-player-error {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 1rem;\n padding: 1.5rem;\n min-height: 280px;\n background: hsl(var(--tn-bg-dark));\n color: hsl(var(--tn-fg));\n text-align: center;\n }\n\n / --- Error Popup Overlay --- /\n .fw-error-overlay {\n position: absolute;\n z-index: 20;\n }\n\n .fw-error-overlay--fullscreen {\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n background: hsl(0 0% 0% / 0.6);\n backdrop-filter: blur(4px);\n }\n\n .fw-error-overlay--passive {\n top: 0.75rem;\n left: 0.75rem;\n right: 0.75rem;\n }\n\n .fw-error-popup {\n background: hsl(var(--tn-bg-dark));\n border: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3);\n overflow: hidden;\n }\n\n .fw-error-popup--fullscreen {\n min-width: 280px;\n max-width: 320px;\n }\n\n .fw-error-popup--passive {\n max-width: 28rem;\n }\n\n .fw-error-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0.5rem 0.75rem;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-error-header--error {\n background: hsl(0 70% 50% / 0.1);\n }\n\n .fw-error-header--warning {\n background: hsl(45 100% 50% / 0.1);\n }\n\n .fw-error-title {\n font-size: 11px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n }\n\n .fw-error-title--error {\n color: hsl(0 70% 60%);\n }\n\n .fw-error-title--warning {\n color: hsl(45 100% 50%);\n }\n\n .fw-error-close {\n width: 24px;\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n background: transparent;\n border: none;\n color: hsl(var(--tn-fg-dark));\n cursor: pointer;\n transition:\n background-color 0.15s ease,\n color 0.15s ease;\n }\n\n .fw-error-close:hover {\n background: hsl(var(--tn-fg) / 0.1);\n color: hsl(var(--tn-fg));\n }\n\n .fw-error-body {\n padding: 0.75rem;\n }\n\n .fw-error-message {\n font-size: 14px;\n color: hsl(var(--tn-fg));\n }\n\n .fw-error-actions {\n display: flex;\n border-top: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-error-btn {\n flex: 1;\n padding: 0.5rem 1rem;\n font-size: 12px;\n font-weight: 500;\n color: hsl(var(--tn-fg));\n background: transparent;\n border: none;\n cursor: pointer;\n transition:\n background-color 0.15s ease,\n color 0.15s ease;\n }\n\n .fw-error-btn:hover {\n background: hsl(var(--tn-fg) / 0.05);\n color: hsl(var(--tn-fg-bright));\n }\n\n / --- Context Menu Animations (for bits-ui) --- /\n @keyframes fw-context-menu-in {\n from {\n opacity: 0;\n transform: scale(0.95);\n }\n to {\n opacity: 1;\n transform: scale(1);\n }\n }\n\n @keyframes fw-context-menu-out {\n from {\n opacity: 1;\n transform: scale(1);\n }\n to {\n opacity: 0;\n transform: scale(0.95);\n }\n }\n\n .fw-context-menu[data-state=\"open\"] {\n animation: fw-context-menu-in 150ms cubic-bezier(0.4, 0, 0.2, 1);\n }\n\n .fw-context-menu[data-state=\"closed\"] {\n animation: fw-context-menu-out 150ms cubic-bezier(0.4, 0, 0.2, 1);\n }\n\n / Slide animations for different sides /\n .fw-context-menu[data-side=\"top\"] {\n transform-origin: bottom center;\n }\n\n .fw-context-menu[data-side=\"bottom\"] {\n transform-origin: top center;\n }\n\n .fw-context-menu[data-side=\"left\"] {\n transform-origin: right center;\n }\n\n .fw-context-menu[data-side=\"right\"] {\n transform-origin: left center;\n }\n\n / =====================================================\n DEV MODE PANEL (Advanced settings sidebar)\n ===================================================== /\n\n / Main panel - side panel container /\n .fw-dev-panel {\n z-index: 40;\n pointer-events: auto;\n background: hsl(var(--tn-bg-dark));\n border-left: 1px solid hsl(var(--tn-fg-gutter) / 0.5);\n color: hsl(var(--tn-fg));\n font-family: ui-monospace, monospace;\n font-size: 0.75rem;\n width: 280px;\n display: flex;\n flex-direction: column;\n height: 100%;\n flex-shrink: 0;\n }\n\n / Header with tabs /\n .fw-dev-header {\n display: flex;\n align-items: center;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n background: hsl(var(--tn-bg) / 0.5);\n }\n\n / Tab buttons /\n .fw-dev-tab {\n padding: 0.5rem 0.75rem;\n font-size: 10px;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n font-weight: 600;\n background: transparent;\n border: none;\n border-right: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n color: hsl(var(--tn-fg-dark));\n cursor: pointer;\n transition:\n background-color 0.15s,\n color 0.15s;\n }\n\n .fw-dev-tab:hover {\n background: hsl(var(--tn-bg-dark) / 0.5);\n color: hsl(var(--tn-fg));\n }\n\n .fw-dev-tab--active {\n background: hsl(var(--tn-bg-dark));\n color: hsl(var(--tn-fg-bright));\n }\n\n .fw-dev-close {\n padding: 0.5rem;\n width: 2rem;\n height: 2rem;\n display: flex;\n align-items: center;\n justify-content: center;\n background: transparent;\n border: none;\n color: hsl(var(--tn-fg-dark));\n cursor: pointer;\n transition: color 0.15s;\n margin-left: auto;\n }\n\n .fw-dev-close:hover {\n color: hsl(var(--tn-fg));\n }\n\n / Spacer - pushes close button to right /\n .fw-dev-spacer {\n flex: 1;\n }\n\n / Content area (body) /\n .fw-dev-content,\n .fw-dev-body {\n flex: 1;\n overflow-y: auto;\n }\n\n / Section with label /\n .fw-dev-section {\n padding: 0.75rem;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-dev-section-label,\n .fw-dev-label {\n font-size: 10px;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n font-weight: 600;\n color: hsl(var(--tn-fg-dark));\n margin-bottom: 0.25rem;\n }\n\n .fw-dev-section-value,\n .fw-dev-value {\n font-size: 0.875rem;\n color: hsl(var(--tn-fg-bright));\n }\n\n .fw-dev-value-arrow {\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-dev-value-muted {\n font-size: 10px;\n color: hsl(var(--tn-fg-dark));\n margin-top: 0.25rem;\n }\n\n .fw-dev-section-sub {\n font-size: 10px;\n color: hsl(var(--tn-fg-dark));\n margin-top: 0.25rem;\n }\n\n / Mode selector buttons /\n .fw-dev-mode-options,\n .fw-dev-mode-group {\n display: flex;\n gap: 0.25rem;\n margin-top: 0.5rem;\n }\n\n .fw-dev-mode-desc {\n font-size: 10px;\n color: hsl(var(--tn-fg-dark));\n margin-top: 0.5rem;\n font-style: italic;\n }\n\n .fw-dev-mode-btn {\n flex: 1;\n padding: 0.375rem 0.5rem;\n font-size: 10px;\n font-weight: 500;\n border-radius: 0.25rem;\n background: hsl(var(--tn-bg-highlight));\n border: none;\n color: hsl(var(--tn-fg-dark));\n cursor: pointer;\n transition:\n background-color 0.15s,\n color 0.15s;\n }\n\n .fw-dev-mode-btn:hover {\n color: hsl(var(--tn-fg));\n background: hsl(var(--tn-bg-visual));\n }\n\n .fw-dev-mode-btn--active {\n background: hsl(var(--tn-blue));\n color: hsl(var(--tn-bg-dark));\n }\n\n / Action buttons row /\n .fw-dev-actions {\n display: flex;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-dev-action-btn {\n flex: 1;\n padding: 0.5rem 0.75rem;\n background: hsl(var(--tn-bg-highlight));\n border: none;\n border-right: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n color: hsl(var(--tn-fg));\n font-size: 0.75rem;\n cursor: pointer;\n transition:\n background-color 0.15s,\n color 0.15s;\n }\n\n .fw-dev-action-btn:last-child {\n border-right: none;\n }\n\n .fw-dev-action-btn:hover {\n background: hsl(var(--tn-bg-visual));\n color: hsl(var(--tn-fg-bright));\n }\n\n / Combo list header /\n .fw-dev-list-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0.5rem 0.75rem;\n background: hsl(var(--tn-bg) / 0.5);\n }\n\n .fw-dev-list-title {\n font-size: 10px;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n font-weight: 600;\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-dev-list-toggle {\n font-size: 10px;\n color: hsl(var(--tn-fg-dark));\n background: transparent;\n border: none;\n cursor: pointer;\n display: flex;\n align-items: center;\n gap: 0.25rem;\n padding: 0.25rem;\n transition: color 0.15s;\n }\n\n .fw-dev-list-toggle:hover {\n color: hsl(var(--tn-fg));\n }\n\n / Combo list items /\n .fw-dev-combo-list {\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-dev-combo-item {\n width: 100%;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n padding: 0.5rem 0.75rem;\n text-align: left;\n background: transparent;\n border: none;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.2);\n color: hsl(var(--tn-fg));\n cursor: pointer;\n transition: background-color 0.15s;\n }\n\n .fw-dev-combo-item:last-child {\n border-bottom: none;\n }\n\n .fw-dev-combo-item:hover {\n background: hsl(var(--tn-bg) / 0.5);\n }\n\n .fw-dev-combo-item--active {\n background: hsl(var(--tn-bg-visual));\n color: hsl(var(--tn-fg-bright));\n box-shadow: inset 0 0 0 1px hsl(var(--tn-blue));\n }\n\n .fw-dev-combo-item--disabled {\n opacity: 0.4;\n }\n\n .fw-dev-combo-item--warning {\n background: hsl(var(--tn-yellow) / 0.05);\n }\n\n .fw-dev-combo-item--warning:hover {\n background: hsl(var(--tn-yellow) / 0.1);\n }\n\n .fw-dev-combo-rank {\n width: 1.25rem;\n height: 1.25rem;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 10px;\n font-weight: 700;\n border-radius: 0.125rem;\n background: hsl(var(--tn-fg-gutter) / 0.5);\n color: hsl(var(--tn-fg-dark));\n flex-shrink: 0;\n }\n\n .fw-dev-combo-rank--active {\n background: hsl(var(--tn-blue));\n color: hsl(var(--tn-bg-dark));\n }\n\n .fw-dev-combo-rank--warning {\n background: hsl(var(--tn-yellow) / 0.3);\n color: hsl(var(--tn-yellow));\n }\n\n .fw-dev-combo-name {\n flex: 1;\n font-size: 0.75rem;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .fw-dev-combo-arrow {\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-dev-combo-type {\n color: hsl(var(--tn-cyan));\n }\n\n .fw-dev-combo-type--warning {\n color: hsl(var(--tn-yellow));\n }\n\n .fw-dev-combo-score {\n font-size: 10px;\n font-family: ui-monospace, monospace;\n font-variant-numeric: tabular-nums;\n padding: 0.125rem 0.375rem;\n border-radius: 0.125rem;\n flex-shrink: 0;\n }\n\n .fw-dev-combo-score--high {\n background: hsl(var(--tn-green) / 0.2);\n color: hsl(var(--tn-green));\n }\n\n .fw-dev-combo-score--medium {\n background: hsl(var(--tn-blue) / 0.2);\n color: hsl(var(--tn-blue));\n }\n\n .fw-dev-combo-score--low {\n background: hsl(var(--tn-yellow) / 0.2);\n color: hsl(var(--tn-yellow));\n }\n\n / Tooltip for combo details /\n .fw-dev-tooltip {\n position: absolute;\n left: 0;\n z-index: 50;\n background: hsl(var(--tn-bg-dark));\n border: 1px solid hsl(var(--tn-fg-gutter));\n box-shadow:\n 0 4px 6px -1px rgb(0 0 0 / 0.1),\n 0 2px 4px -2px rgb(0 0 0 / 0.1);\n padding: 0.5rem;\n font-size: 10px;\n white-space: nowrap;\n pointer-events: none;\n min-width: 220px;\n }\n\n .fw-dev-tooltip--above {\n bottom: 100%;\n margin-bottom: 0.25rem;\n }\n\n .fw-dev-tooltip--below {\n top: 100%;\n margin-top: 0.25rem;\n }\n\n .fw-dev-tooltip-header {\n margin-bottom: 0.5rem;\n padding-bottom: 0.5rem;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.5);\n }\n\n .fw-dev-tooltip-title {\n font-weight: 700;\n color: hsl(var(--tn-fg-bright));\n }\n\n .fw-dev-tooltip-subtitle {\n color: hsl(var(--tn-cyan));\n }\n\n .fw-dev-tooltip-info {\n color: hsl(var(--tn-fg-dark));\n margin-top: 0.25rem;\n }\n\n .fw-dev-tooltip-score {\n font-weight: 700;\n color: hsl(var(--tn-fg-bright));\n margin-bottom: 0.25rem;\n }\n\n .fw-dev-tooltip-breakdown {\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-dev-tooltip-breakdown-value {\n color: hsl(var(--tn-fg));\n }\n\n .fw-dev-tooltip-breakdown-weight {\n color: hsl(var(--tn-fg-gutter));\n }\n\n .fw-dev-tooltip-error {\n color: hsl(var(--tn-red));\n }\n\n / Stats panel content /\n .fw-dev-stats-hero {\n padding: 0.75rem;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-dev-stats-rate {\n font-size: 1.5rem;\n font-weight: 700;\n font-variant-numeric: tabular-nums;\n }\n\n .fw-dev-stats-rate--good {\n color: hsl(var(--tn-green));\n }\n\n .fw-dev-stats-rate--catching {\n color: hsl(var(--tn-blue));\n }\n\n .fw-dev-stats-rate--slow {\n color: hsl(var(--tn-yellow));\n }\n\n .fw-dev-stats-rate--stalling {\n color: hsl(var(--tn-red));\n }\n\n .fw-dev-stats-label {\n font-size: 10px;\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-dev-stats-metrics {\n display: flex;\n gap: 1rem;\n margin-top: 0.5rem;\n font-size: 10px;\n }\n\n .fw-dev-stats-metric--good {\n color: hsl(var(--tn-green));\n }\n\n .fw-dev-stats-metric--warning {\n color: hsl(var(--tn-yellow));\n }\n\n .fw-dev-stats-metric--bad {\n color: hsl(var(--tn-red));\n }\n\n / Stats rows /\n .fw-dev-stats-rows {\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.3);\n }\n\n .fw-dev-stats-row {\n display: flex;\n justify-content: space-between;\n padding: 0.5rem 0.75rem;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.2);\n }\n\n .fw-dev-stats-row:last-child {\n border-bottom: none;\n }\n\n .fw-dev-stats-key {\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-dev-stats-value {\n color: hsl(var(--tn-fg-bright));\n }\n\n .fw-dev-stats-value--cyan {\n color: hsl(var(--tn-cyan));\n }\n\n .fw-dev-stats-value--warning {\n color: hsl(var(--tn-yellow));\n }\n\n .fw-dev-stats-value--bad {\n color: hsl(var(--tn-red));\n }\n\n .fw-dev-stats-value--good {\n color: hsl(var(--tn-green));\n }\n\n / Track badges /\n .fw-dev-track-badge {\n font-size: 10px;\n font-family: ui-monospace, monospace;\n text-transform: uppercase;\n padding: 0.125rem 0.375rem;\n }\n\n .fw-dev-track-badge--video {\n background: hsl(var(--tn-blue) / 0.2);\n color: hsl(var(--tn-blue));\n }\n\n .fw-dev-track-badge--audio {\n background: hsl(var(--tn-green) / 0.2);\n color: hsl(var(--tn-green));\n }\n\n .fw-dev-track-badge--other {\n background: hsl(var(--tn-yellow) / 0.2);\n color: hsl(var(--tn-yellow));\n }\n\n .fw-dev-track-info {\n display: flex;\n flex-wrap: wrap;\n gap: 0.5rem;\n font-size: 10px;\n color: hsl(var(--tn-fg-dark));\n }\n\n / Empty state /\n .fw-dev-empty,\n .fw-dev-list-empty {\n padding: 1rem 0.75rem;\n text-align: center;\n color: hsl(var(--tn-fg-dark));\n }\n\n / Chevron icon (expand/collapse toggle) /\n .fw-dev-chevron {\n transition: transform 0.15s;\n }\n\n .fw-dev-chevron--open {\n transform: rotate(180deg);\n }\n\n / Combo wrapper (relative for tooltip positioning) /\n .fw-dev-combo {\n position: relative;\n }\n\n / Combo button (alias for fw-dev-combo-item) /\n .fw-dev-combo-btn {\n width: 100%;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n padding: 0.5rem 0.75rem;\n text-align: left;\n background: transparent;\n border: none;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.2);\n color: hsl(var(--tn-fg));\n cursor: pointer;\n transition: background-color 0.15s;\n }\n\n .fw-dev-combo-btn:last-child {\n border-bottom: none;\n }\n\n .fw-dev-combo-btn:hover {\n background: hsl(var(--tn-bg) / 0.5);\n }\n\n .fw-dev-combo-btn--active {\n background: hsl(var(--tn-bg-visual));\n color: hsl(var(--tn-fg-bright));\n box-shadow: inset 0 0 0 1px hsl(var(--tn-blue));\n }\n\n .fw-dev-combo-btn--disabled {\n opacity: 0.4;\n }\n\n .fw-dev-combo-btn--codec-warn {\n background: hsl(var(--tn-yellow) / 0.05);\n }\n\n .fw-dev-combo-btn--codec-warn:hover {\n background: hsl(var(--tn-yellow) / 0.1);\n }\n\n / Combo rank modifiers /\n .fw-dev-combo-rank--disabled {\n background: hsl(var(--tn-fg-gutter) / 0.3);\n color: hsl(var(--tn-fg-gutter));\n }\n\n .fw-dev-combo-rank--warn {\n background: hsl(var(--tn-yellow) / 0.3);\n color: hsl(var(--tn-yellow));\n }\n\n / Combo type modifiers /\n .fw-dev-combo-type--disabled {\n color: hsl(var(--tn-fg-gutter));\n }\n\n .fw-dev-combo-type--warn {\n color: hsl(var(--tn-yellow));\n }\n\n / Combo score modifiers (additional) /\n .fw-dev-combo-score--disabled {\n background: hsl(var(--tn-fg-gutter) / 0.2);\n color: hsl(var(--tn-fg-gutter));\n }\n\n .fw-dev-combo-score--mid {\n background: hsl(var(--tn-blue) / 0.2);\n color: hsl(var(--tn-blue));\n }\n\n / Tooltip additional classes /\n .fw-dev-tooltip-tracks {\n color: hsl(var(--tn-fg-dark));\n margin-top: 0.25rem;\n }\n\n .fw-dev-tooltip-value {\n color: hsl(var(--tn-fg));\n }\n\n .fw-dev-tooltip-row {\n color: hsl(var(--tn-fg-dark));\n margin-bottom: 0.125rem;\n }\n\n .fw-dev-tooltip-bonus {\n color: hsl(var(--tn-green));\n }\n\n .fw-dev-tooltip-penalty {\n color: hsl(var(--tn-red));\n }\n\n .fw-dev-tooltip-weight {\n color: hsl(var(--tn-fg-gutter));\n font-size: 9px;\n }\n\n / =====================================================\n DEV MODE STATS TAB\n ===================================================== /\n\n / Section header modifier /\n .fw-dev-section-header {\n margin-top: 0.5rem;\n }\n\n / Playback rate hero section /\n .fw-dev-rate {\n display: flex;\n align-items: baseline;\n gap: 0.5rem;\n margin-bottom: 0.5rem;\n }\n\n .fw-dev-rate-value {\n font-size: 1.5rem;\n font-weight: 700;\n font-variant-numeric: tabular-nums;\n }\n\n .fw-dev-rate-status {\n font-size: 10px;\n color: hsl(var(--tn-fg-dark));\n text-transform: uppercase;\n }\n\n .fw-dev-rate-stats {\n display: flex;\n gap: 1rem;\n font-size: 10px;\n color: hsl(var(--tn-fg-dark));\n }\n\n / Stat value modifiers /\n .fw-dev-stat-value--good {\n color: hsl(var(--tn-green));\n }\n\n .fw-dev-stat-value--accent {\n color: hsl(var(--tn-blue));\n }\n\n .fw-dev-stat-value--warn {\n color: hsl(var(--tn-yellow));\n }\n\n .fw-dev-stat-value--bad {\n color: hsl(var(--tn-red));\n }\n\n / Stats row (key-value pair) /\n .fw-dev-stat {\n display: flex;\n justify-content: space-between;\n padding: 0.5rem 0.75rem;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.2);\n }\n\n .fw-dev-stat:last-child {\n border-bottom: none;\n }\n\n .fw-dev-stat-label {\n color: hsl(var(--tn-fg-dark));\n }\n\n .fw-dev-stat-value {\n color: hsl(var(--tn-fg-bright));\n }\n\n / Track display /\n .fw-dev-track {\n padding: 0.5rem 0.75rem;\n border-bottom: 1px solid hsl(var(--tn-fg-gutter) / 0.2);\n }\n\n .fw-dev-track:last-child {\n border-bottom: none;\n }\n\n .fw-dev-track-header {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n margin-bottom: 0.25rem;\n }\n\n .fw-dev-track-codec {\n font-size: 10px;\n color: hsl(var(--tn-fg));\n font-weight: 500;\n }\n\n .fw-dev-track-id {\n font-size: 10px;\n color: hsl(var(--tn-fg-gutter));\n margin-left: auto;\n }\n\n .fw-dev-track-meta {\n display: flex;\n flex-wrap: wrap;\n gap: 0.5rem;\n font-size: 10px;\n color: hsl(var(--tn-fg-dark));\n }\n\n / No tracks state */\n .fw-dev-no-tracks {\n padding: 0.75rem;\n text-align: center;\n }\n\n .fw-dev-no-tracks-text {\n color: hsl(var(--tn-fg-dark));\n font-size: 10px;\n }\n\n .fw-dev-no-tracks-type {\n color: hsl(var(--tn-fg-gutter));\n margin-left: 0.25rem;\n }\n}\n\n`;\n"],"names":[],"mappings":";;AAAA;AACA;AAGO,MAAM,YAAY,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}