{"id":6839,"date":"2026-03-06T00:00:06","date_gmt":"2026-03-06T00:00:06","guid":{"rendered":"https:\/\/raistheme.com\/?page_id=6839"},"modified":"2026-04-05T08:39:02","modified_gmt":"2026-04-05T08:39:02","slug":"facebook-feature","status":"publish","type":"page","link":"https:\/\/raistheme.com\/tools\/social-viewer\/facebook-feature\/","title":{"rendered":"Facebook Feature Viewer \u2013 Explore All Features Free"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"6839\" class=\"elementor elementor-6839\">\n\t\t\t\t<div class=\"elementor-element elementor-element-73b14bca e-con-full e-flex e-con e-parent\" data-id=\"73b14bca\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-37cd3160 elementor-widget elementor-widget-shortcode\" data-id=\"37cd3160\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\"> <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap\"\r\n        rel=\"stylesheet\">\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=JetBrains+Mono:wght@400;500;600&display=swap\" rel=\"stylesheet\">\r\n    <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\r\n    <style>\r\n        \/* Professional Color System *\/\r\n        :root {\r\n            \/* Primary Colors *\/\r\n            --primary-50: #f0f4ff;\r\n            --primary-100: #e0e7ff;\r\n            --primary-200: #c7d2fe;\r\n            --primary-300: #a5b4fc;\r\n            --primary-400: #818cf8;\r\n            --primary-500: #4267B2;\r\n            --primary-600: #3b5998;\r\n            --primary-700: #2d4373;\r\n            --primary-800: #1c2a4a;\r\n            --primary-900: #0f172a;\r\n\r\n            \/* Secondary Colors *\/\r\n            --secondary-50: #fdf2f8;\r\n            --secondary-100: #fce7f3;\r\n            --secondary-200: #fbcfe8;\r\n            --secondary-300: #f9a8d4;\r\n            --secondary-400: #f472b6;\r\n            --secondary-500: #ec4899;\r\n            --secondary-600: #db2777;\r\n            --secondary-700: #be185d;\r\n            --secondary-800: #9d174d;\r\n            --secondary-900: #831843;\r\n\r\n            \/* Accent Colors *\/\r\n            --accent-50: #ecfeff;\r\n            --accent-100: #cffafe;\r\n            --accent-200: #a5f3fc;\r\n            --accent-300: #67e8f9;\r\n            --accent-400: #22d3ee;\r\n            --accent-500: #1877F2;\r\n            --accent-600: #0891b2;\r\n            --accent-700: #0e7490;\r\n            --accent-800: #155e75;\r\n            --accent-900: #164e63;\r\n\r\n            \/* Neutral Colors *\/\r\n            --white: #ffffff;\r\n            --gray-25: #fcfcfd;\r\n            --gray-50: #f8fafc;\r\n            --gray-100: #f1f5f9;\r\n            --gray-200: #e2e8f0;\r\n            --gray-300: #cbd5e1;\r\n            --gray-400: #94a3b8;\r\n            --gray-500: #64748b;\r\n            --gray-600: #475569;\r\n            --gray-700: #334155;\r\n            --gray-800: #1e293b;\r\n            --gray-900: #0f172a;\r\n            --gray-950: #020617;\r\n\r\n            \/* Background Colors *\/\r\n            --bg-primary: #F0F2F5;\r\n            --bg-secondary: #ffffff;\r\n            --bg-tertiary: #f8f9fa;\r\n            --bg-accent: #e9ebee;\r\n\r\n            \/* Text Colors *\/\r\n            --text-primary: #050505;\r\n            --text-secondary: #65676B;\r\n            --text-tertiary: #8A8D91;\r\n            --text-accent: #4267B2;\r\n\r\n            \/* Border Colors *\/\r\n            --border-primary: #dddfe2;\r\n            --border-secondary: #e4e6eb;\r\n            --border-tertiary: #ccd0d5;\r\n\r\n            \/* Premium Gradients *\/\r\n            --gradient-primary: linear-gradient(135deg, #4267B2 0%, #1877F2 100%);\r\n            --gradient-secondary: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);\r\n            --gradient-accent: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);\r\n            --gradient-success: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);\r\n            --gradient-warm: linear-gradient(135deg, #fa709a 0%, #fee140 100%);\r\n            --gradient-cool: linear-gradient(135deg, #a8edea 0%, #fed6e3 100%);\r\n            --gradient-dark: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);\r\n            --gradient-mesh: radial-gradient(at 40% 20%, hsla(228, 100%, 74%, 1) 0px, transparent 50%),\r\n                radial-gradient(at 80% 0%, hsla(189, 100%, 56%, 1) 0px, transparent 50%),\r\n                radial-gradient(at 0% 50%, hsla(355, 100%, 93%, 1) 0px, transparent 50%),\r\n                radial-gradient(at 80% 50%, hsla(340, 100%, 76%, 1) 0px, transparent 50%),\r\n                radial-gradient(at 0% 100%, hsla(22, 100%, 77%, 1) 0px, transparent 50%),\r\n                radial-gradient(at 80% 100%, hsla(242, 100%, 70%, 1) 0px, transparent 50%),\r\n                radial-gradient(at 0% 0%, hsla(343, 100%, 76%, 1) 0px, transparent 50%);\r\n\r\n            \/* Advanced Shadows *\/\r\n            --shadow-xs: 0 1px 2px 0 rgb(0 0 0 \/ 0.05);\r\n            --shadow-sm: 0 1px 3px 0 rgb(0 0 0 \/ 0.1), 0 1px 2px -1px rgb(0 0 0 \/ 0.1);\r\n            --shadow-md: 0 4px 6px -1px rgb(0 0 0 \/ 0.1), 0 2px 4px -2px rgb(0 0 0 \/ 0.1);\r\n            --shadow-lg: 0 10px 15px -3px rgb(0 0 0 \/ 0.1), 0 4px 6px -4px rgb(0 0 0 \/ 0.1);\r\n            --shadow-xl: 0 20px 25px -5px rgb(0 0 0 \/ 0.1), 0 8px 10px -6px rgb(0 0 0 \/ 0.1);\r\n            --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 \/ 0.25);\r\n            --shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 \/ 0.05);\r\n            --shadow-colored-primary: 0 20px 25px -5px rgb(66, 103, 178, 0.1), 0 8px 10px -6px rgb(66, 103, 178, 0.1);\r\n            --shadow-colored-secondary: 0 20px 25px -5px rgb(236, 72, 153, 0.1), 0 8px 10px -6px rgb(236, 72, 153, 0.1);\r\n            --shadow-colored-accent: 0 20px 25px -5px rgb(24, 119, 242, 0.1), 0 8px 10px -6px rgb(24, 119, 242, 0.1);\r\n\r\n            \/* Border Radius System *\/\r\n            --radius-none: 0;\r\n            --radius-sm: 0.125rem;\r\n            --radius: 0.25rem;\r\n            --radius-md: 0.375rem;\r\n            --radius-lg: 0.5rem;\r\n            --radius-xl: 0.75rem;\r\n            --radius-2xl: 1rem;\r\n            --radius-3xl: 1.5rem;\r\n            --radius-4xl: 2rem;\r\n            --radius-full: 9999px;\r\n\r\n            \/* Spacing System *\/\r\n            --space-px: 1px;\r\n            --space-0: 0;\r\n            --space-1: 0.25rem;\r\n            --space-2: 0.5rem;\r\n            --space-3: 0.75rem;\r\n            --space-4: 1rem;\r\n            --space-5: 1.25rem;\r\n            --space-6: 1.5rem;\r\n            --space-8: 2rem;\r\n            --space-10: 2.5rem;\r\n            --space-12: 3rem;\r\n            --space-16: 4rem;\r\n            --space-20: 5rem;\r\n            --space-24: 6rem;\r\n            --space-32: 8rem;\r\n\r\n            \/* Typography Scale *\/\r\n            --text-xs: 0.75rem;\r\n            --text-sm: 0.875rem;\r\n            --text-base: 1rem;\r\n            --text-lg: 1.125rem;\r\n            --text-xl: 1.25rem;\r\n            --text-2xl: 1.5rem;\r\n            --text-3xl: 1.875rem;\r\n            --text-4xl: 2.25rem;\r\n            --text-5xl: 3rem;\r\n            --text-6xl: 3.75rem;\r\n            --text-7xl: 4.5rem;\r\n            --text-8xl: 6rem;\r\n            --text-9xl: 8rem;\r\n\r\n            \/* Animation System *\/\r\n            --duration-75: 75ms;\r\n            --duration-100: 100ms;\r\n            --duration-150: 150ms;\r\n            --duration-200: 200ms;\r\n            --duration-300: 300ms;\r\n            --duration-500: 500ms;\r\n            --duration-700: 700ms;\r\n            --duration-1000: 1000ms;\r\n\r\n            --ease-linear: linear;\r\n            --ease-in: cubic-bezier(0.4, 0, 1, 1);\r\n            --ease-out: cubic-bezier(0, 0, 0.2, 1);\r\n            --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);\r\n            --ease-bounce: cubic-bezier(0.68, -0.55, 0.265, 1.55);\r\n            --ease-elastic: cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n        }\r\n\r\n        \/* Reset & Base *\/\r\n        *,\r\n        *::before,\r\n        *::after {\r\n            box-sizing: border-box;\r\n            margin: 0;\r\n            padding: 0;\r\n        }\r\n\r\n        html {\r\n            scroll-behavior: smooth;\r\n            -webkit-text-size-adjust: 100%;\r\n        }\r\n\r\n        \/* Wrapper to avoid WordPress conflicts *\/\r\n        .fb-feature-viewer-wrapper {\r\n            font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;\r\n            font-feature-settings: 'cv11', 'ss01';\r\n            font-variation-settings: 'opsz' 32;\r\n            background: var(--bg-primary);\r\n            color: var(--text-primary);\r\n            line-height: 1.6;\r\n            -webkit-font-smoothing: antialiased;\r\n            -moz-osx-font-smoothing: grayscale;\r\n            text-rendering: optimizeLegibility;\r\n            overflow-x: hidden;\r\n            min-height: 80vh;\r\n\t\t\t\t\t  padding:40px 0;\r\n        }\r\n\r\n        \/* Premium Background *\/\r\n        .bg-pattern {\r\n            position: fixed;\r\n            top: 0;\r\n            left: 0;\r\n            width: 100%;\r\n            height: 100%;\r\n            background: var(--gradient-mesh);\r\n            opacity: 0.4;\r\n            z-index: -2;\r\n            animation: meshFloat 20s ease-in-out infinite;\r\n        }\r\n\r\n        .bg-pattern::before {\r\n            content: '';\r\n            position: absolute;\r\n            inset: 0;\r\n            background:\r\n                radial-gradient(circle at 20% 80%, rgba(66, 103, 178, 0.08) 0%, transparent 50%),\r\n                radial-gradient(circle at 80% 20%, rgba(236, 72, 153, 0.08) 0%, transparent 50%),\r\n                radial-gradient(circle at 40% 40%, rgba(24, 119, 242, 0.08) 0%, transparent 50%);\r\n            animation: float 25s ease-in-out infinite reverse;\r\n        }\r\n\r\n        .bg-overlay {\r\n            position: fixed;\r\n            inset: 0;\r\n            background: linear-gradient(135deg, var(--white) 0%, rgba(248, 250, 252, 0.8) 100%);\r\n            z-index: -1;\r\n        }\r\n\r\n        .video-meta {\r\n            display: flex;\r\n            justify-content: space-between;\r\n        }\r\n\r\n        @keyframes meshFloat {\r\n\r\n            0%,\r\n            100% {\r\n                transform: translateY(0px) rotate(0deg) scale(1);\r\n            }\r\n\r\n            33% {\r\n                transform: translateY(-20px) rotate(1deg) scale(1.02);\r\n            }\r\n\r\n            66% {\r\n                transform: translateY(10px) rotate(-1deg) scale(0.98);\r\n            }\r\n        }\r\n\r\n        @keyframes float {\r\n\r\n            0%,\r\n            100% {\r\n                transform: translateY(0px) rotate(0deg);\r\n            }\r\n\r\n            50% {\r\n                transform: translateY(-30px) rotate(2deg);\r\n            }\r\n        }\r\n\r\n        \/* Container System *\/\r\n        .fb-container {\r\n            max-width: 1200px;\r\n            margin: 0 auto !important;\r\n            padding: var(--space-8);\r\n            position: relative;\r\n        }\r\n\r\n        \/* Premium Header *\/\r\n        .fb-header {\r\n            text-align: center;\r\n            margin-bottom: var(--space-20);\r\n            animation: slideDown var(--duration-1000) var(--ease-elastic);\r\n            position: relative;\r\n        }\r\n\r\n        .fb-header::before {\r\n            content: '';\r\n            position: absolute;\r\n            top: -50%;\r\n            left: 50%;\r\n            width: 200%;\r\n            height: 200%;\r\n            background: radial-gradient(circle, rgba(66, 103, 178, 0.05) 0%, transparent 70%);\r\n            transform: translateX(-50%);\r\n            z-index: -1;\r\n        }\r\n\r\n        @keyframes slideDown {\r\n            from {\r\n                opacity: 0;\r\n                transform: translateY(-60px) scale(0.9);\r\n                filter: blur(10px);\r\n            }\r\n\r\n            to {\r\n                opacity: 1;\r\n                transform: translateY(0) scale(1);\r\n                filter: blur(0);\r\n            }\r\n        }\r\n\r\n        .fb-header .fb-title {\r\n            font-size: clamp( 2rem, 5vw, 3.5rem );\r\n            font-weight: 900;\r\n            background: var(--gradient-primary);\r\n            background-clip: text;\r\n            -webkit-background-clip: text;\r\n            -webkit-text-fill-color: transparent;\r\n            margin-bottom: var(--space-6);\r\n            letter-spacing: -0.04em;\r\n            line-height: 0.9;\r\n            position: relative;\r\n        }\r\n\r\n        .fb-header .fb-title::after {\r\n            content: '';\r\n            position: absolute;\r\n            bottom: -10px;\r\n            left: 50%;\r\n            width: 100px;\r\n            height: 4px;\r\n            background: var(--gradient-primary);\r\n            border-radius: var(--radius-full);\r\n            transform: translateX(-50%);\r\n            animation: shimmer 3s ease-in-out infinite;\r\n        }\r\n\r\n        @keyframes shimmer {\r\n\r\n            0%,\r\n            100% {\r\n                opacity: 0.5;\r\n                transform: translateX(-50%) scaleX(1);\r\n            }\r\n\r\n            50% {\r\n                opacity: 1;\r\n                transform: translateX(-50%) scaleX(1.2);\r\n            }\r\n        }\r\n\r\n        .fb-header .fb-subtitle {\r\n            font-size: var(--text-xl);\r\n            color: var(--text-secondary);\r\n            font-weight: 500;\r\n            max-width: 600px;\r\n            margin: 0 auto;\r\n            line-height: 1.7;\r\n        }\r\n\r\n        \/* Premium Search Section *\/\r\n        .fb-search-section {\r\n            background: var(--bg-secondary);\r\n            border-radius: var(--radius-4xl);\r\n            box-shadow: var(--shadow-2xl);\r\n            padding: var(--space-12);\r\n            margin-bottom: var(--space-16);\r\n            border: 1px solid var(--border-secondary);\r\n            animation: slideUp var(--duration-1000) var(--ease-elastic) 0.2s both;\r\n            position: relative;\r\n            overflow: hidden;\r\n        }\r\n\r\n        .fb-search-section::before {\r\n            content: '';\r\n            position: absolute;\r\n            top: 0;\r\n            left: -100%;\r\n            width: 100%;\r\n            height: 100%;\r\n            background: linear-gradient(90deg, transparent, rgba(66, 103, 178, 0.03), transparent);\r\n            animation: shine 4s ease-in-out infinite;\r\n        }\r\n\r\n        @keyframes shine {\r\n            0% {\r\n                left: -100%;\r\n            }\r\n\r\n            50% {\r\n                left: 100%;\r\n            }\r\n\r\n            100% {\r\n                left: -100%;\r\n            }\r\n        }\r\n\r\n        @keyframes slideUp {\r\n            from {\r\n                opacity: 0;\r\n                transform: translateY(60px) scale(0.95);\r\n                filter: blur(5px);\r\n            }\r\n\r\n            to {\r\n                opacity: 1;\r\n                transform: translateY(0) scale(1);\r\n                filter: blur(0);\r\n            }\r\n        }\r\n\r\n        .fb-feature-viewer-wrapper .fb-av-search-form {\r\n            display: flex;\r\n            gap: var(--space-4);\r\n            max-width: 1200px;\r\n            margin: 0 auto;\r\n            position: relative;\r\n            z-index: 2;\r\n        }\r\n\r\n        .fb-feature-viewer-wrapper .fb-av-input-group {\r\n            flex: 1;\r\n            position: relative;\r\n        }\r\n\r\n        .fb-feature-viewer-wrapper .fb-av-url-input {\r\n            width: 100% !important;\r\n            min-height: 58px !important;\r\n            padding: var(--space-5) !important;\r\n            border: 2px solid var(--border-secondary) !important;\r\n            border-radius: var(--radius-3xl) !important;\r\n            font-size: var(--text-lg) !important;\r\n            font-weight: 500 !important;\r\n            background: var(--bg-secondary) !important;\r\n            color: var(--text-primary) !important;\r\n            transition: all var(--duration-300) var(--ease-out) !important;\r\n            font-family: inherit !important;\r\n            line-height: 1.35 !important;\r\n            box-shadow: var(--shadow-sm) !important;\r\n        }\r\n\r\n        .fb-feature-viewer-wrapper .fb-av-url-input::placeholder {\r\n            color: var(--text-tertiary);\r\n            font-weight: 400;\r\n        }\r\n\r\n        .fb-feature-viewer-wrapper .fb-av-url-input:focus {\r\n            outline: none;\r\n            border-color: var(--primary-500);\r\n            box-shadow: 0 0 0 4px var(--primary-100), var(--shadow-lg);\r\n            transform: translateY(-2px);\r\n        }\r\n\r\n        .fb-feature-viewer-wrapper .fb-av-analyze-btn {\r\n            background: var(--gradient-primary);\r\n            color: var(--white);\r\n            border: none;\r\n            min-height: 58px;\r\n            padding: 10px 30px;\r\n            border-radius: var(--radius-3xl);\r\n            font-size: var(--text-lg);\r\n            font-weight: 700;\r\n            cursor: pointer;\r\n            transition: all var(--duration-300) var(--ease-out);\r\n            font-family: inherit;\r\n            white-space: nowrap;\r\n            position: relative;\r\n            overflow: hidden;\r\n            box-shadow: var(--shadow-lg);\r\n            letter-spacing: 0;\r\n            display: inline-flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            gap: var(--space-2);\r\n        }\r\n\r\n        .fb-feature-viewer-wrapper .fb-av-analyze-btn::before {\r\n            content: '';\r\n            position: absolute;\r\n            top: 0;\r\n            left: -100%;\r\n            width: 100%;\r\n            height: 100%;\r\n            background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);\r\n            transition: left var(--duration-700) var(--ease-out);\r\n        }\r\n\r\n        .fb-feature-viewer-wrapper .fb-av-analyze-btn:hover::before {\r\n            left: 100%;\r\n        }\r\n\r\n        .fb-feature-viewer-wrapper .fb-av-analyze-btn:hover {\r\n            transform: translateY(-3px) scale(1.02);\r\n            box-shadow: var(--shadow-colored-primary);\r\n        }\r\n\r\n        .fb-feature-viewer-wrapper .fb-av-analyze-btn:active {\r\n            transform: translateY(-1px) scale(0.98);\r\n        }\r\n\r\n        .fb-feature-viewer-wrapper .fb-av-analyze-btn:disabled {\r\n            opacity: 0.7;\r\n            cursor: not-allowed;\r\n            transform: none;\r\n        }\r\n\r\n        .fb-error-message {\r\n            background: var(--gradient-warm);\r\n            color: var(--white);\r\n            padding: var(--space-4) var(--space-6);\r\n            border-radius: var(--radius-2xl);\r\n            margin-top: var(--space-4);\r\n            font-weight: 600;\r\n            animation: shake var(--duration-500) var(--ease-out);\r\n            box-shadow: var(--shadow-lg);\r\n        }\r\n\r\n        @keyframes shake {\r\n\r\n            0%,\r\n            100% {\r\n                transform: translateX(0);\r\n            }\r\n\r\n            25% {\r\n                transform: translateX(-8px);\r\n            }\r\n\r\n            75% {\r\n                transform: translateX(8px);\r\n            }\r\n        }\r\n\r\n        \/* Premium Loading *\/\r\n        .fb-loading {\r\n            text-align: center;\r\n            padding: var(--space-20) var(--space-8);\r\n            background: var(--bg-secondary);\r\n            border-radius: var(--radius-4xl);\r\n            box-shadow: var(--shadow-2xl);\r\n            border: 1px solid var(--border-secondary);\r\n            position: relative;\r\n            overflow: hidden;\r\n        }\r\n\r\n        .fb-loading::before {\r\n            content: '';\r\n            position: absolute;\r\n            inset: 0;\r\n            background: linear-gradient(45deg, transparent 30%, rgba(66, 103, 178, 0.05) 50%, transparent 70%);\r\n            animation: loadingShimmer 2s ease-in-out infinite;\r\n        }\r\n\r\n        @keyframes loadingShimmer {\r\n            0% {\r\n                transform: translateX(-100%) translateY(-100%);\r\n            }\r\n\r\n            100% {\r\n                transform: translateX(100%) translateY(100%);\r\n            }\r\n        }\r\n\r\n        .fb-loading-spinner {\r\n            width: 80px;\r\n            height: 80px;\r\n            margin: 0 auto var(--space-8);\r\n            position: relative;\r\n            z-index: 2;\r\n        }\r\n\r\n        .fb-loading-spinner::before {\r\n            content: '';\r\n            position: absolute;\r\n            inset: 0;\r\n            border: 4px solid var(--border-secondary);\r\n            border-top: 4px solid var(--primary-500);\r\n            border-radius: 50%;\r\n            animation: spin var(--duration-1000) linear infinite;\r\n        }\r\n\r\n        .fb-loading-spinner::after {\r\n            content: '';\r\n            position: absolute;\r\n            inset: 8px;\r\n            border: 3px solid transparent;\r\n            border-top: 3px solid var(--secondary-500);\r\n            border-radius: 50%;\r\n            animation: spin var(--duration-700) linear infinite reverse;\r\n        }\r\n\r\n        @keyframes spin {\r\n            to {\r\n                transform: rotate(360deg);\r\n            }\r\n        }\r\n\r\n        .fb-loading-text {\r\n            font-size: var(--text-xl);\r\n            font-weight: 700;\r\n            color: var(--text-primary);\r\n            animation: pulse var(--duration-1000) ease-in-out infinite;\r\n            position: relative;\r\n            z-index: 2;\r\n        }\r\n\r\n        @keyframes pulse {\r\n\r\n            0%,\r\n            100% {\r\n                opacity: 0.6;\r\n            }\r\n\r\n            50% {\r\n                opacity: 1;\r\n            }\r\n        }\r\n\r\n        \/* Skeleton Loading Styles *\/\r\n        .fb-skeleton-loading {\r\n            background: linear-gradient(90deg, var(--border-secondary) 25%, var(--bg-tertiary) 50%, var(--border-secondary) 75%);\r\n            background-size: 200% 100%;\r\n            animation: skeleton-shimmer 1.5s infinite;\r\n        }\r\n\r\n        @keyframes skeleton-shimmer {\r\n            0% {\r\n                background-position: -200% 0;\r\n            }\r\n\r\n            100% {\r\n                background-position: 200% 0;\r\n            }\r\n        }\r\n\r\n        .fb-videos-skeleton,\r\n        .fb-reels-skeleton {\r\n            display: none;\r\n        }\r\n\r\n        .fb-videos-skeleton.active,\r\n        .fb-reels-skeleton.active {\r\n            display: block;\r\n        }\r\n\r\n        .fb-videos-grid-skeleton,\r\n        .fb-reels-grid-skeleton {\r\n            display: grid;\r\n            grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));\r\n            gap: var(--space-8);\r\n        }\r\n\r\n        .fb-video-skeleton,\r\n        .fb-reel-skeleton {\r\n            background: var(--bg-secondary);\r\n            border-radius: var(--radius-4xl);\r\n            overflow: hidden;\r\n            box-shadow: var(--shadow-md);\r\n            border: 1px solid var(--border-secondary);\r\n        }\r\n\r\n        .fb-video-thumbnail-skeleton,\r\n        .fb-reel-thumbnail-skeleton {\r\n            height: 200px;\r\n            background: var(--border-secondary);\r\n            animation: skeleton-shimmer 1.5s infinite;\r\n        }\r\n\r\n        .fb-video-info-skeleton,\r\n        .fb-reel-info-skeleton {\r\n            padding: var(--space-6);\r\n        }\r\n\r\n        .fb-skeleton-line {\r\n            height: 16px;\r\n            background: var(--border-secondary);\r\n            border-radius: var(--radius-lg);\r\n            margin-bottom: var(--space-3);\r\n            animation: skeleton-shimmer 1.5s infinite;\r\n        }\r\n\r\n        .fb-skeleton-line.short {\r\n            width: 60%;\r\n        }\r\n\r\n        \/* Group Styles *\/\r\n        .fb-group-header {\r\n            background: var(--bg-secondary);\r\n            border-radius: var(--radius-4xl);\r\n            box-shadow: var(--shadow-2xl);\r\n            overflow: hidden;\r\n            margin-bottom: var(--space-8);\r\n            border: 1px solid var(--border-secondary);\r\n            animation: slideUp var(--duration-1000) var(--ease-elastic) 0.4s both;\r\n            position: relative;\r\n        }\r\n\r\n        .fb-group-cover {\r\n            position: relative;\r\n            height: 400px;\r\n            background: var(--gradient-primary);\r\n            overflow: hidden;\r\n        }\r\n\r\n        .fb-group-cover img {\r\n            width: 100%;\r\n            height: 100%;\r\n            object-fit: cover;\r\n            transition: transform var(--duration-700) var(--ease-out);\r\n        }\r\n\r\n        .fb-group-cover:hover img {\r\n            transform: scale(1.05);\r\n        }\r\n\r\n        .fb-group-cover-overlay {\r\n            position: absolute;\r\n            inset: 0;\r\n            background: linear-gradient(to bottom,\r\n                    transparent 0%,\r\n                    rgba(0, 0, 0, 0.1) 40%,\r\n                    rgba(0, 0, 0, 0.8) 100%);\r\n        }\r\n\r\n        .fb-group-info-overlay {\r\n            position: absolute;\r\n            bottom: 0;\r\n            left: 0;\r\n            right: 0;\r\n            padding: var(--space-12);\r\n            color: var(--white);\r\n        }\r\n\r\n        .fb-group-title {\r\n            font-size: clamp(var(--text-2xl), 5vw, var(--text-5xl));\r\n            font-weight: 800;\r\n            margin-bottom: var(--space-3);\r\n            text-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);\r\n            letter-spacing: -0.02em;\r\n            line-height: 1.1;\r\n        }\r\n\r\n        .fb-group-subtitle {\r\n            font-size: var(--text-xl);\r\n            opacity: 0.95;\r\n            font-weight: 600;\r\n            text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);\r\n        }\r\n\r\n        .fb-group-details {\r\n            padding: var(--space-12);\r\n        }\r\n\r\n        .fb-stats-grid {\r\n            display: grid;\r\n            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));\r\n            gap: var(--space-6);\r\n            margin-bottom: var(--space-10);\r\n        }\r\n\r\n        .fb-stat-card {\r\n            background: linear-gradient(135deg, var(--bg-secondary) 0%, var(--bg-tertiary) 100%);\r\n            border: 1px solid var(--border-secondary);\r\n            border-radius: var(--radius-3xl);\r\n            padding: var(--space-8);\r\n            text-align: center;\r\n            transition: all var(--duration-300) var(--ease-out);\r\n            animation: fadeInUp var(--duration-700) var(--ease-elastic);\r\n            animation-delay: calc(var(--delay) * 0.1s);\r\n            animation-fill-mode: both;\r\n            position: relative;\r\n            overflow: hidden;\r\n        }\r\n\r\n        .fb-stat-card::before {\r\n            content: '';\r\n            position: absolute;\r\n            inset: 0;\r\n            background: var(--gradient-primary);\r\n            opacity: 0;\r\n            transition: opacity var(--duration-300) var(--ease-out);\r\n            border-radius: inherit;\r\n        }\r\n\r\n        .fb-stat-card:hover::before {\r\n            opacity: 0.05;\r\n        }\r\n\r\n        @keyframes fadeInUp {\r\n            from {\r\n                opacity: 0;\r\n                transform: translateY(40px) scale(0.9);\r\n                filter: blur(5px);\r\n            }\r\n\r\n            to {\r\n                opacity: 1;\r\n                transform: translateY(0) scale(1);\r\n                filter: blur(0);\r\n            }\r\n        }\r\n\r\n        .fb-stat-card:hover {\r\n            transform: translateY(-8px) scale(1.02);\r\n            box-shadow: var(--shadow-xl);\r\n            border-color: var(--primary-300);\r\n        }\r\n\r\n        .fb-stat-icon {\r\n            width: 64px;\r\n            height: 64px;\r\n            background: var(--gradient-primary);\r\n            border-radius: var(--radius-2xl);\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            margin: 0 auto var(--space-4);\r\n            font-size: var(--text-2xl);\r\n            box-shadow: var(--shadow-lg);\r\n            position: relative;\r\n            z-index: 2;\r\n            color: var(--white);\r\n        }\r\n\r\n        .fb-stat-number {\r\n            font-size: var(--text-3xl);\r\n            font-weight: 800;\r\n            color: var(--text-primary);\r\n            display: block;\r\n            margin-bottom: var(--space-2);\r\n            position: relative;\r\n            z-index: 2;\r\n        }\r\n\r\n        .fb-stat-label {\r\n            font-size: var(--text-sm);\r\n            color: var(--text-secondary);\r\n            font-weight: 600;\r\n            text-transform: uppercase;\r\n            letter-spacing: 0.1em;\r\n            position: relative;\r\n            z-index: 2;\r\n        }\r\n\r\n        .fb-group-description {\r\n            background: linear-gradient(135deg, var(--bg-tertiary) 0%, var(--bg-secondary) 100%);\r\n            border: 1px solid var(--border-secondary);\r\n            border-radius: var(--radius-3xl);\r\n            padding: var(--space-8);\r\n            margin-bottom: var(--space-8);\r\n            font-size: var(--text-lg);\r\n            line-height: 1.8;\r\n            color: var(--text-primary);\r\n            box-shadow: var(--shadow-sm);\r\n        }\r\n\r\n        .fb-visit-btn {\r\n            background: var(--gradient-accent);\r\n            color: var(--white);\r\n            text-decoration: none;\r\n            padding: var(--space-4) var(--space-8);\r\n            border-radius: var(--radius-2xl);\r\n            font-weight: 700;\r\n            font-size: var(--text-lg);\r\n            display: inline-flex;\r\n            align-items: center;\r\n            gap: var(--space-3);\r\n            transition: all var(--duration-300) var(--ease-out);\r\n            box-shadow: var(--shadow-lg);\r\n            letter-spacing: 0.025em;\r\n        }\r\n\r\n        .fb-visit-btn:hover {\r\n            transform: translateY(-3px) scale(1.05);\r\n            box-shadow: var(--shadow-colored-accent);\r\n        }\r\n\r\n        \/* Premium Navigation *\/\r\n        .fb-nav-tabs {\r\n            background: var(--bg-secondary);\r\n            border-radius: var(--radius-4xl);\r\n            box-shadow: var(--shadow-2xl);\r\n            margin-bottom: var(--space-8);\r\n            border: 1px solid var(--border-secondary);\r\n            overflow: hidden;\r\n            animation: slideUp var(--duration-1000) var(--ease-elastic) 0.6s both;\r\n        }\r\n\r\n        .fb-tab-list {\r\n            display: flex;\r\n            background: linear-gradient(135deg, var(--bg-tertiary) 0%, var(--bg-secondary) 100%);\r\n            border-bottom: 1px solid var(--border-secondary);\r\n            padding: var(--space-2);\r\n        }\r\n\r\n        .fb-tab-btn {\r\n            flex: 1;\r\n            padding: var(--space-6) var(--space-8);\r\n            background: none;\r\n            border: none;\r\n            font-size: var(--text-lg);\r\n            font-weight: 700;\r\n            color: var(--text-secondary);\r\n            cursor: pointer;\r\n            transition: all var(--duration-300) var(--ease-out);\r\n            position: relative;\r\n            font-family: inherit;\r\n            border-radius: var(--radius-2xl);\r\n            margin: var(--space-1);\r\n        }\r\n\r\n        .fb-tab-btn::before {\r\n            content: '';\r\n            position: absolute;\r\n            bottom: 0;\r\n            left: 50%;\r\n            width: 0;\r\n            height: 3px;\r\n            background: var(--gradient-primary);\r\n            transition: all var(--duration-300) var(--ease-out);\r\n            transform: translateX(-50%);\r\n            border-radius: var(--radius-full);\r\n        }\r\n\r\n        .fb-tab-btn:hover,\r\n        .fb-tab-btn.active {\r\n            color: var(--primary-600);\r\n            background: var(--bg-secondary);\r\n            box-shadow: var(--shadow-md);\r\n        }\r\n\r\n        .fb-tab-btn.active::before {\r\n            width: 60%;\r\n        }\r\n\r\n        .fb-tab-content {\r\n            display: none;\r\n            padding: var(--space-8);\r\n            animation: fadeInScale var(--duration-500) var(--ease-out);\r\n        }\r\n\r\n        .fb-tab-content.active {\r\n            display: block;\r\n        }\r\n\r\n        @keyframes fadeInScale {\r\n            from {\r\n                opacity: 0;\r\n                transform: scale(0.95) translateY(20px);\r\n                filter: blur(3px);\r\n            }\r\n\r\n            to {\r\n                opacity: 1;\r\n                transform: scale(1) translateY(0);\r\n                filter: blur(0);\r\n            }\r\n        }\r\n\r\n        \/* Premium Media Section *\/\r\n        .fb-media-summary {\r\n            background: var(--gradient-primary);\r\n            border-radius: var(--radius-4xl);\r\n            padding: var(--space-12);\r\n            margin-bottom: var(--space-8);\r\n            text-align: center;\r\n            color: var(--white);\r\n            position: relative;\r\n            overflow: hidden;\r\n        }\r\n\r\n        .fb-media-summary::before {\r\n            content: '';\r\n            position: absolute;\r\n            top: -50%;\r\n            left: -50%;\r\n            width: 200%;\r\n            height: 200%;\r\n            background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);\r\n            animation: rotate 20s linear infinite;\r\n        }\r\n\r\n        @keyframes rotate {\r\n            from {\r\n                transform: rotate(0deg);\r\n            }\r\n\r\n            to {\r\n                transform: rotate(360deg);\r\n            }\r\n        }\r\n\r\n        .fb-summary-title {\r\n            font-size: var(--text-4xl);\r\n            font-weight: 800;\r\n            margin-bottom: var(--space-4);\r\n            position: relative;\r\n            z-index: 2;\r\n            text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);\r\n        }\r\n\r\n        .fb-summary-description {\r\n            font-size: var(--text-xl);\r\n            opacity: 0.95;\r\n            margin-bottom: var(--space-8);\r\n            position: relative;\r\n            z-index: 2;\r\n            font-weight: 500;\r\n        }\r\n\r\n        .fb-summary-stats {\r\n            display: grid;\r\n            grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));\r\n            gap: var(--space-8);\r\n            position: relative;\r\n            z-index: 2;\r\n        }\r\n\r\n        .fb-summary-stat {\r\n            text-align: center;\r\n        }\r\n\r\n        .fb-summary-stat-number {\r\n            font-size: var(--text-4xl);\r\n            font-weight: 900;\r\n            display: block;\r\n            margin-bottom: var(--space-2);\r\n            text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);\r\n        }\r\n\r\n        .fb-summary-stat-label {\r\n            font-size: var(--text-sm);\r\n            opacity: 0.9;\r\n            text-transform: uppercase;\r\n            letter-spacing: 0.1em;\r\n            font-weight: 600;\r\n        }\r\n\r\n        .fb-media-grid {\r\n            display: grid;\r\n            grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));\r\n            gap: var(--space-8);\r\n        }\r\n\r\n        \/* Ultra Premium Media Cards *\/\r\n        .fb-media-card {\r\n            background: var(--bg-secondary);\r\n            border-radius: var(--radius-4xl);\r\n            box-shadow: var(--shadow-xl);\r\n            border: 1px solid var(--border-secondary);\r\n            overflow: hidden;\r\n            transition: all var(--duration-500) var(--ease-elastic);\r\n            animation: slideUp var(--duration-700) var(--ease-elastic);\r\n            animation-delay: calc(var(--index) * 0.1s);\r\n            animation-fill-mode: both;\r\n            position: relative;\r\n            cursor: pointer;\r\n        }\r\n\r\n        .fb-media-card::before {\r\n            content: '';\r\n            position: absolute;\r\n            inset: 0;\r\n            background: var(--gradient-primary);\r\n            opacity: 0;\r\n            transition: opacity var(--duration-300) var(--ease-out);\r\n            border-radius: inherit;\r\n            z-index: 1;\r\n        }\r\n\r\n        .fb-media-card:hover::before {\r\n            opacity: 0.02;\r\n        }\r\n\r\n        .fb-media-card:hover {\r\n            transform: translateY(-12px) scale(1.02);\r\n            box-shadow: var(--shadow-2xl);\r\n            border-color: var(--primary-300);\r\n        }\r\n\r\n        .fb-media-image-container {\r\n            position: relative;\r\n            aspect-ratio: 16\/10;\r\n            overflow: hidden;\r\n            background: linear-gradient(135deg, var(--bg-tertiary) 0%, var(--border-secondary) 100%);\r\n        }\r\n\r\n        .fb-media-image {\r\n            width: 100%;\r\n            height: 100%;\r\n            object-fit: cover;\r\n            transition: transform var(--duration-700) var(--ease-out);\r\n        }\r\n\r\n        .fb-media-card:hover .fb-media-image {\r\n            transform: scale(1.1) rotate(1deg);\r\n        }\r\n\r\n        \/* Ultra Premium Hover Overlay *\/\r\n        .fb-media-hover-overlay {\r\n            position: absolute;\r\n            inset: 0;\r\n            background: linear-gradient(135deg,\r\n                    rgba(66, 103, 178, 0.95) 0%,\r\n                    rgba(139, 92, 246, 0.95) 50%,\r\n                    rgba(236, 72, 153, 0.95) 100%);\r\n            opacity: 0;\r\n            visibility: hidden;\r\n            transition: all var(--duration-500) var(--ease-elastic);\r\n            display: flex;\r\n            flex-direction: column;\r\n            align-items: center;\r\n            justify-content: center;\r\n            gap: var(--space-6);\r\n            padding: var(--space-8);\r\n            backdrop-filter: blur(20px);\r\n            z-index: 10;\r\n        }\r\n\r\n        .fb-media-card:hover .fb-media-hover-overlay {\r\n            opacity: 1;\r\n            visibility: visible;\r\n        }\r\n\r\n        .fb-quality-indicator {\r\n            background: rgba(255, 255, 255, 0.25);\r\n            backdrop-filter: blur(15px);\r\n            border: 2px solid rgba(255, 255, 255, 0.3);\r\n            color: var(--white);\r\n            padding: var(--space-3) var(--space-6);\r\n            border-radius: var(--radius-full);\r\n            font-weight: 800;\r\n            font-size: var(--text-sm);\r\n            text-transform: uppercase;\r\n            letter-spacing: 0.1em;\r\n            animation: slideInDown var(--duration-500) var(--ease-elastic) 0.1s both;\r\n            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);\r\n        }\r\n\r\n        @keyframes slideInDown {\r\n            from {\r\n                opacity: 0;\r\n                transform: translateY(-30px) scale(0.8);\r\n                filter: blur(5px);\r\n            }\r\n\r\n            to {\r\n                opacity: 1;\r\n                transform: translateY(0) scale(1);\r\n                filter: blur(0);\r\n            }\r\n        }\r\n\r\n        .fb-download-actions {\r\n            display: flex;\r\n            flex-direction: column;\r\n            gap: var(--space-3);\r\n            animation: slideInUp var(--duration-500) var(--ease-elastic) 0.2s both;\r\n        }\r\n\r\n        .fb-download-btn {\r\n            background: rgba(255, 255, 255, 0.25);\r\n            backdrop-filter: blur(15px);\r\n            border: 2px solid rgba(255, 255, 255, 0.3);\r\n            color: var(--white);\r\n            padding: var(--space-4) var(--space-8);\r\n            border-radius: var(--radius-full);\r\n            font-size: var(--text-base);\r\n            font-weight: 700;\r\n            cursor: pointer;\r\n            transition: all var(--duration-300) var(--ease-elastic);\r\n            font-family: inherit;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            gap: var(--space-3);\r\n            min-width: 180px;\r\n            position: relative;\r\n            overflow: hidden;\r\n            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);\r\n            text-transform: uppercase;\r\n            letter-spacing: 0.05em;\r\n        }\r\n\r\n        .fb-download-btn::before {\r\n            content: '';\r\n            position: absolute;\r\n            top: 0;\r\n            left: -100%;\r\n            width: 100%;\r\n            height: 100%;\r\n            background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);\r\n            transition: left var(--duration-700) var(--ease-out);\r\n        }\r\n\r\n        .fb-download-btn:hover::before {\r\n            left: 100%;\r\n        }\r\n\r\n        .fb-download-btn:hover {\r\n            background: rgba(255, 255, 255, 0.35);\r\n            border-color: rgba(255, 255, 255, 0.5);\r\n            transform: translateY(-3px) scale(1.05);\r\n            box-shadow: 0 15px 40px rgba(0, 0, 0, 0.2);\r\n        }\r\n\r\n        .fb-download-btn:active {\r\n            transform: translateY(-1px) scale(0.98);\r\n        }\r\n\r\n        .fb-btn-icon {\r\n            font-size: var(--text-lg);\r\n            transition: transform var(--duration-300) var(--ease-out);\r\n        }\r\n\r\n        .fb-download-btn:hover .fb-btn-icon {\r\n            transform: scale(1.2) rotate(5deg);\r\n        }\r\n\r\n        \/* Premium Media Info *\/\r\n        .fb-media-info {\r\n            padding: var(--space-6);\r\n            position: relative;\r\n            z-index: 2;\r\n        }\r\n\r\n        .fb-media-meta {\r\n            display: flex;\r\n            justify-content: space-between;\r\n            align-items: center;\r\n            font-size: var(--text-sm);\r\n            color: var(--text-secondary);\r\n            font-weight: 600;\r\n        }\r\n\r\n        .fb-resolution-badge {\r\n            background: linear-gradient(135deg, var(--bg-tertiary) 0%, var(--border-secondary) 100%);\r\n            color: var(--text-primary);\r\n            padding: var(--space-2) var(--space-4);\r\n            border-radius: var(--radius-full);\r\n            font-size: var(--text-xs);\r\n            font-weight: 700;\r\n            text-transform: uppercase;\r\n            letter-spacing: 0.05em;\r\n            box-shadow: var(--shadow-sm);\r\n        }\r\n\r\n        .fb-type-badge {\r\n            background: var(--gradient-primary);\r\n            color: var(--white);\r\n            padding: var(--space-2) var(--space-4);\r\n            border-radius: var(--radius-full);\r\n            font-size: var(--text-xs);\r\n            font-weight: 700;\r\n            text-transform: uppercase;\r\n            letter-spacing: 0.05em;\r\n            box-shadow: var(--shadow-sm);\r\n        }\r\n\r\n        \/* Video Grid Styles for Groups *\/\r\n        .fb-video-grid {\r\n            display: grid;\r\n            grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));\r\n            gap: var(--space-8);\r\n        }\r\n\r\n        .fb-video-card {\r\n            background: var(--bg-secondary);\r\n            border-radius: var(--radius-4xl);\r\n            box-shadow: var(--shadow-xl);\r\n            border: 1px solid var(--border-secondary);\r\n            overflow: hidden;\r\n            transition: all var(--duration-500) var(--ease-elastic);\r\n            animation: slideUp var(--duration-700) var(--ease-elastic);\r\n            animation-delay: calc(var(--index) * 0.1s);\r\n            animation-fill-mode: both;\r\n            position: relative;\r\n        }\r\n\r\n        .fb-video-card:hover {\r\n            transform: translateY(-12px) scale(1.02);\r\n            box-shadow: var(--shadow-2xl);\r\n            border-color: var(--primary-300);\r\n        }\r\n\r\n        .fb-video-card video {\r\n            width: 100%;\r\n            height: 250px;\r\n            object-fit: cover;\r\n            background: var(--bg-tertiary);\r\n        }\r\n\r\n        .fb-video-info {\r\n            padding: var(--space-6);\r\n            display: flex;\r\n            flex-direction: column;\r\n            height: 220px;\r\n            \/* Adjust height as needed *\/\r\n        }\r\n\r\n        .fb-video-title {\r\n            font-size: var(--text-lg);\r\n            font-weight: 700;\r\n            color: var(--text-primary);\r\n            margin-bottom: var(--space-2);\r\n            flex-shrink: 0;\r\n        }\r\n\r\n        .fb-video-description {\r\n            font-size: var(--text-xs);\r\n            font-weight: 400;\r\n            color: var(--text-tertiary);\r\n            line-height: 1.4;\r\n            overflow: hidden;\r\n            text-overflow: ellipsis;\r\n            display: -webkit-box;\r\n            -webkit-line-clamp: 3;\r\n            \/* Allow up to 3 lines *\/\r\n            -webkit-box-orient: vertical;\r\n            opacity: 0.8;\r\n            flex-grow: 1;\r\n            margin-bottom: var(--space-3);\r\n            display: none;\r\n        }\r\n\r\n        .fb-video-stats {\r\n            margin-top: auto;\r\n            \/* Pushes stats to the bottom *\/\r\n            flex-shrink: 0;\r\n        }\r\n\r\n        .fb-video-badges {\r\n            display: flex;\r\n            gap: var(--space-2);\r\n            margin-bottom: var(--space-4);\r\n        }\r\n\r\n        .fb-quality-badge {\r\n            background: var(--gradient-success);\r\n            color: var(--white);\r\n            padding: var(--space-1) var(--space-3);\r\n            border-radius: var(--radius-full);\r\n            font-size: var(--text-xs);\r\n            font-weight: 700;\r\n            text-transform: uppercase;\r\n        }\r\n\r\n        .fb-format-badge {\r\n            background: var(--bg-tertiary);\r\n            color: var(--text-primary);\r\n            padding: var(--space-1) var(--space-3);\r\n            border-radius: var(--radius-full);\r\n            font-size: var(--text-xs);\r\n            font-weight: 700;\r\n            text-transform: uppercase;\r\n        }\r\n\r\n        .fb-video-actions {\r\n            display: flex;\r\n            gap: var(--space-3);\r\n            align-items: center;\r\n        }\r\n\r\n        .fb-video-download-btn {\r\n            flex: 1;\r\n            background: var(--gradient-primary);\r\n            color: var(--white);\r\n            border: none;\r\n            padding: var(--space-3) var(--space-6);\r\n            border-radius: var(--radius-2xl);\r\n            font-weight: 700;\r\n            cursor: pointer;\r\n            transition: all var(--duration-300) var(--ease-out);\r\n            position: relative;\r\n            overflow: hidden;\r\n        }\r\n\r\n        .fb-video-download-btn:hover {\r\n            transform: translateY(-2px) scale(1.02);\r\n            box-shadow: var(--shadow-lg);\r\n        }\r\n\r\n        .fb-download-progress {\r\n            position: absolute;\r\n            bottom: 0;\r\n            left: 0;\r\n            height: 3px;\r\n            background: rgba(255, 255, 255, 0.5);\r\n            transition: width var(--duration-300) var(--ease-out);\r\n        }\r\n\r\n        .fb-copy-btn {\r\n            background: var(--bg-tertiary);\r\n            color: var(--text-primary);\r\n            border: none;\r\n            padding: var(--space-3);\r\n            border-radius: var(--radius-xl);\r\n            cursor: pointer;\r\n            transition: all var(--duration-300) var(--ease-out);\r\n        }\r\n\r\n        .fb-copy-btn:hover {\r\n            background: var(--border-secondary);\r\n            transform: scale(1.1);\r\n        }\r\n\r\n        .fb-download-all-btn {\r\n            background: var(--gradient-accent);\r\n            color: var(--white);\r\n            border: none;\r\n            padding: var(--space-4) var(--space-8);\r\n            border-radius: var(--radius-3xl);\r\n            font-size: var(--text-lg);\r\n            font-weight: 700;\r\n            cursor: pointer;\r\n            margin-bottom: var(--space-8);\r\n            transition: all var(--duration-300) var(--ease-out);\r\n            box-shadow: var(--shadow-lg);\r\n        }\r\n\r\n        .fb-download-all-btn:hover {\r\n            transform: translateY(-3px) scale(1.02);\r\n            box-shadow: var(--shadow-colored-accent);\r\n        }\r\n\r\n        \/* Profile Styles *\/\r\n        .fb-profile-container {\r\n            background: var(--bg-secondary);\r\n            border-radius: var(--radius-4xl);\r\n            box-shadow: var(--shadow-2xl);\r\n            overflow: hidden;\r\n            margin-bottom: var(--space-8);\r\n            border: 1px solid var(--border-secondary);\r\n            animation: slideUp var(--duration-1000) var(--ease-elastic) 0.4s both;\r\n        }\r\n\r\n        .fb-cover-section {\r\n            position: relative;\r\n            height: 400px;\r\n            background: var(--gradient-primary);\r\n            overflow: hidden;\r\n        }\r\n\r\n        .fb-cover-photo {\r\n            width: 100%;\r\n            height: 100%;\r\n            background-size: cover;\r\n            background-position: center;\r\n            transition: transform var(--duration-700) var(--ease-out);\r\n        }\r\n\r\n        .fb-cover-overlay {\r\n            position: absolute;\r\n            inset: 0;\r\n            background: linear-gradient(to bottom,\r\n                    transparent 0%,\r\n                    rgba(0, 0, 0, 0.1) 40%,\r\n                    rgba(0, 0, 0, 0.8) 100%);\r\n        }\r\n\r\n        .fb-cover-gradient {\r\n            position: absolute;\r\n            inset: 0;\r\n            background: linear-gradient(135deg,\r\n                    rgba(66, 103, 178, 0.1) 0%,\r\n                    rgba(236, 72, 153, 0.1) 100%);\r\n        }\r\n\r\n        .fb-profile-info-section {\r\n            padding: var(--space-12);\r\n        }\r\n\r\n        .fb-profile-header {\r\n            display: flex;\r\n            align-items: flex-start;\r\n            gap: var(--space-8);\r\n            margin-bottom: var(--space-8);\r\n            position: relative;\r\n            margin-top: -80px;\r\n        }\r\n\r\n        .fb-profile-picture-container {\r\n            position: relative;\r\n            flex-shrink: 0;\r\n        }\r\n\r\n        .fb-profile-picture {\r\n            width: 160px;\r\n            height: 160px;\r\n            border-radius: var(--radius-full);\r\n            background-size: cover;\r\n            background-position: center;\r\n            background-color: var(--border-secondary);\r\n            border: 6px solid var(--bg-secondary);\r\n            box-shadow: var(--shadow-xl);\r\n            position: relative;\r\n            z-index: 2;\r\n        }\r\n\r\n        .fb-profile-ring {\r\n            position: absolute;\r\n            inset: -8px;\r\n            border-radius: var(--radius-full);\r\n            background: var(--gradient-primary);\r\n            z-index: 1;\r\n            animation: pulse 3s ease-in-out infinite;\r\n        }\r\n\r\n        .fb-profile-status-indicator {\r\n            position: absolute;\r\n            bottom: 10px;\r\n            right: 10px;\r\n            width: 24px;\r\n            height: 24px;\r\n            background: var(--success-500);\r\n            border-radius: var(--radius-full);\r\n            border: 3px solid var(--bg-secondary);\r\n            z-index: 3;\r\n        }\r\n\r\n        .fb-profile-details {\r\n            flex: 1;\r\n            margin-top: 80px;\r\n        }\r\n\r\n        .fb-profile-name {\r\n            font-size: var(--text-4xl);\r\n            font-weight: 800;\r\n            color: var(--text-primary);\r\n            margin-bottom: var(--space-4);\r\n            line-height: 1.1;\r\n        }\r\n\r\n        .fb-verified-badge::after {\r\n            content: '\u2713';\r\n            display: inline-block;\r\n            margin-left: var(--space-2);\r\n            color: var(--primary-500);\r\n            font-weight: 900;\r\n            font-size: var(--text-lg);\r\n        }\r\n\r\n        .fb-profile-stats {\r\n            display: flex;\r\n            gap: var(--space-6);\r\n            margin-bottom: var(--space-6);\r\n            flex-wrap: wrap;\r\n        }\r\n\r\n        .fb-stat-badge {\r\n            background: var(--bg-tertiary);\r\n            color: var(--text-primary);\r\n            padding: var(--space-2) var(--space-4);\r\n            border-radius: var(--radius-full);\r\n            font-size: var(--text-sm);\r\n            font-weight: 600;\r\n        }\r\n\r\n        .fb-profile-actions {\r\n            display: flex;\r\n            gap: var(--space-4);\r\n            flex-wrap: wrap;\r\n        }\r\n\r\n        .fb-action-btn {\r\n            padding: var(--space-3) var(--space-6);\r\n            border-radius: var(--radius-2xl);\r\n            font-weight: 700;\r\n            font-size: var(--text-base);\r\n            cursor: pointer;\r\n            transition: all var(--duration-300) var(--ease-out);\r\n            display: flex;\r\n            align-items: center;\r\n            gap: var(--space-2);\r\n            border: none;\r\n            font-family: inherit;\r\n        }\r\n\r\n        .fb-action-btn.primary {\r\n            background: var(--gradient-primary);\r\n            color: var(--white);\r\n            box-shadow: var(--shadow-md);\r\n        }\r\n\r\n        .fb-action-btn.secondary {\r\n            background: var(--bg-tertiary);\r\n            color: var(--text-primary);\r\n            border: 1px solid var(--border-secondary);\r\n        }\r\n\r\n        .fb-action-btn:hover {\r\n            transform: translateY(-2px) scale(1.02);\r\n            box-shadow: var(--shadow-lg);\r\n        }\r\n\r\n        .fb-profile-navigation {\r\n            border-top: 1px solid var(--border-secondary);\r\n            padding-top: var(--space-6);\r\n        }\r\n\r\n        .fb-profile-nav-tabs {\r\n            display: flex;\r\n            gap: var(--space-2);\r\n            background: var(--bg-tertiary);\r\n            padding: var(--space-2);\r\n            border-radius: var(--radius-2xl);\r\n        }\r\n\r\n        .fb-nav-tab {\r\n            flex: 1;\r\n            padding: var(--space-4) var(--space-6);\r\n            background: none;\r\n            border: none;\r\n            border-radius: var(--radius-xl);\r\n            font-weight: 600;\r\n            color: var(--text-secondary);\r\n            cursor: pointer;\r\n            transition: all var(--duration-300) var(--ease-out);\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            gap: var(--space-2);\r\n            position: relative;\r\n            font-family: inherit;\r\n        }\r\n\r\n        .fb-nav-tab.active {\r\n            background: var(--bg-secondary);\r\n            color: var(--primary-600);\r\n            box-shadow: var(--shadow-sm);\r\n        }\r\n\r\n        .fb-nav-indicator {\r\n            position: absolute;\r\n            bottom: 0;\r\n            left: 50%;\r\n            width: 0;\r\n            height: 2px;\r\n            background: var(--primary-500);\r\n            transition: width var(--duration-300) var(--ease-out);\r\n            transform: translateX(-50%);\r\n            border-radius: var(--radius-full);\r\n        }\r\n\r\n        .fb-nav-tab.active .fb-nav-indicator {\r\n            width: 60%;\r\n        }\r\n\r\n        .fb-tab-content-container {\r\n            padding: var(--space-8) 0;\r\n        }\r\n\r\n        \/* Photos Grid *\/\r\n        .fb-photos-grid {\r\n            display: grid;\r\n            grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\r\n            gap: var(--space-6);\r\n        }\r\n\r\n        .fb-photoitem {\r\n            background: var(--bg-secondary);\r\n            border-radius: var(--radius-3xl);\r\n            overflow: hidden;\r\n            box-shadow: var(--shadow-md);\r\n            transition: all var(--duration-300) var(--ease-out);\r\n            border: 1px solid var(--border-secondary);\r\n        }\r\n\r\n        .fb-photoitem:hover {\r\n            transform: translateY(-8px) scale(1.02);\r\n            box-shadow: var(--shadow-xl);\r\n        }\r\n\r\n        .fb-photoimage-container {\r\n            position: relative;\r\n            aspect-ratio: 1;\r\n            overflow: hidden;\r\n        }\r\n\r\n        .fb-photoimage {\r\n            width: 100%;\r\n            height: 100%;\r\n            object-fit: cover;\r\n            transition: transform var(--duration-500) var(--ease-out);\r\n            cursor: pointer;\r\n        }\r\n\r\n        .fb-photoitem:hover .fb-photoimage {\r\n            transform: scale(1.1);\r\n        }\r\n\r\n        .fb-photooverlay {\r\n            position: absolute;\r\n            inset: 0;\r\n            background: linear-gradient(135deg,\r\n                    rgba(66, 103, 178, 0.9) 0%,\r\n                    rgba(236, 72, 153, 0.9) 100%);\r\n            opacity: 0;\r\n            visibility: hidden;\r\n            transition: all var(--duration-300) var(--ease-out);\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n        }\r\n\r\n        .fb-photoitem:hover .fb-photooverlay {\r\n            opacity: 1;\r\n            visibility: visible;\r\n        }\r\n\r\n        .fb-photoactions {\r\n            display: flex;\r\n            gap: var(--space-3);\r\n        }\r\n\r\n        .fb-photoaction-btn {\r\n            background: rgba(255, 255, 255, 0.2);\r\n            backdrop-filter: blur(10px);\r\n            border: 2px solid rgba(255, 255, 255, 0.3);\r\n            color: var(--white);\r\n            padding: var(--space-3);\r\n            border-radius: var(--radius-full);\r\n            cursor: pointer;\r\n            transition: all var(--duration-300) var(--ease-out);\r\n            font-size: var(--text-lg);\r\n        }\r\n\r\n        .fb-photoaction-btn:hover {\r\n            background: rgba(255, 255, 255, 0.3);\r\n            transform: scale(1.1);\r\n        }\r\n\r\n        .fb-photoinfo {\r\n            padding: var(--space-4);\r\n        }\r\n\r\n        .fb-photostats {\r\n            margin-bottom: var(--space-3);\r\n        }\r\n\r\n        .fb-photoengagement {\r\n            display: flex;\r\n            gap: var(--space-4);\r\n        }\r\n\r\n        .fb-photoengagement-item {\r\n            display: flex;\r\n            align-items: center;\r\n            gap: var(--space-1);\r\n            color: var(--text-secondary);\r\n            font-size: var(--text-sm);\r\n        }\r\n\r\n        .fb-photometa {\r\n            display: flex;\r\n            justify-content: space-between;\r\n            align-items: center;\r\n            font-size: var(--text-xs);\r\n            color: var(--text-tertiary);\r\n        }\r\n\r\n        .fb-photodimensions {\r\n            font-weight: 600;\r\n        }\r\n\r\n        \/* Photo Modal *\/\r\n        .fb-photomodal {\r\n            position: fixed;\r\n            inset: 0;\r\n            background: rgba(0, 0, 0, 0.9);\r\n            backdrop-filter: blur(20px);\r\n            z-index: 10000;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            opacity: 0;\r\n            visibility: hidden;\r\n            transition: all var(--duration-500) var(--ease-out);\r\n        }\r\n\r\n        .fb-photomodal.active {\r\n            opacity: 1;\r\n            visibility: visible;\r\n        }\r\n\r\n        .fb-photomodal-content {\r\n            max-width: 90vw;\r\n            max-height: 90vh;\r\n            background: var(--bg-secondary);\r\n            border-radius: var(--radius-4xl);\r\n            overflow: hidden;\r\n            display: flex;\r\n            box-shadow: var(--shadow-2xl);\r\n            position: relative;\r\n        }\r\n\r\n        .fb-photomodal-close {\r\n            position: absolute;\r\n            top: var(--space-4);\r\n            right: var(--space-4);\r\n            background: rgba(0, 0, 0, 0.5);\r\n            color: var(--white);\r\n            border: none;\r\n            padding: var(--space-3);\r\n            border-radius: var(--radius-full);\r\n            cursor: pointer;\r\n            z-index: 10001;\r\n            transition: all var(--duration-300) var(--ease-out);\r\n        }\r\n\r\n        .fb-photomodal-close:hover {\r\n            background: rgba(0, 0, 0, 0.7);\r\n            transform: scale(1.1);\r\n        }\r\n\r\n        .fb-photomodal-image {\r\n            max-width: 70vw;\r\n            max-height: 90vh;\r\n            object-fit: contain;\r\n        }\r\n\r\n        .fb-photomodal-info {\r\n            width: 400px;\r\n            padding: var(--space-8);\r\n            display: flex;\r\n            flex-direction: column;\r\n            gap: var(--space-6);\r\n        }\r\n\r\n        .fb-photomodal-title {\r\n            font-size: var(--text-2xl);\r\n            font-weight: 800;\r\n            color: var(--text-primary);\r\n        }\r\n\r\n        .fb-photomodal-stats {\r\n            display: grid;\r\n            grid-template-columns: repeat(2, 1fr);\r\n            gap: var(--space-4);\r\n        }\r\n\r\n        .fb-photomodal-stat {\r\n            text-align: center;\r\n            padding: var(--space-4);\r\n            background: var(--bg-tertiary);\r\n            border-radius: var(--radius-2xl);\r\n        }\r\n\r\n        .fb-photomodal-stat-value {\r\n            font-size: var(--text-xl);\r\n            font-weight: 800;\r\n            color: var(--text-primary);\r\n            margin-bottom: var(--space-1);\r\n        }\r\n\r\n        .fb-photomodal-stat-label {\r\n            font-size: var(--text-sm);\r\n            color: var(--text-secondary);\r\n            font-weight: 600;\r\n        }\r\n\r\n        .fb-photomodal-actions {\r\n            display: flex;\r\n            flex-direction: column;\r\n            gap: var(--space-3);\r\n        }\r\n\r\n        .fb-photomodal-action {\r\n            padding: var(--space-4) var(--space-6);\r\n            border-radius: var(--radius-2xl);\r\n            font-weight: 700;\r\n            cursor: pointer;\r\n            transition: all var(--duration-300) var(--ease-out);\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            gap: var(--space-3);\r\n            border: none;\r\n            font-family: inherit;\r\n        }\r\n\r\n        .fb-photomodal-action.primary {\r\n            background: var(--gradient-primary);\r\n            color: var(--white);\r\n        }\r\n\r\n        .fb-photomodal-action:not(.primary) {\r\n            background: var(--bg-tertiary);\r\n            color: var(--text-primary);\r\n            border: 1px solid var(--border-secondary);\r\n        }\r\n\r\n        .fb-photomodal-action:hover {\r\n            transform: translateY(-2px) scale(1.02);\r\n            box-shadow: var(--shadow-lg);\r\n        }\r\n\r\n        \/* Content Headers *\/\r\n        .fb-content-header {\r\n            display: flex;\r\n            justify-content: space-between;\r\n            align-items: center;\r\n            margin-bottom: var(--space-8);\r\n            padding-bottom: var(--space-4);\r\n            border-bottom: 1px solid var(--border-secondary);\r\n        }\r\n\r\n        .fb-content-title {\r\n            display: flex;\r\n            align-items: center;\r\n            gap: var(--space-3);\r\n        }\r\n\r\n        .fb-content-title h2 {\r\n            font-size: var(--text-2xl);\r\n            font-weight: 800;\r\n            color: var(--text-primary);\r\n        }\r\n\r\n        .fb-content-title i {\r\n            color: var(--primary-500);\r\n            font-size: var(--text-xl);\r\n        }\r\n\r\n        .fb-content-stats {\r\n            display: flex;\r\n            gap: var(--space-4);\r\n        }\r\n\r\n        .fb-stat-item {\r\n            display: flex;\r\n            align-items: center;\r\n            gap: var(--space-2);\r\n            color: var(--text-secondary);\r\n            font-size: var(--text-sm);\r\n        }\r\n\r\n        \/* Posts Container *\/\r\n        .fb-posts-container {\r\n            display: flex;\r\n            flex-direction: column;\r\n            gap: var(--space-6);\r\n        }\r\n\r\n        .fb-post-item {\r\n            background: var(--bg-secondary);\r\n            border-radius: var(--radius-3xl);\r\n            padding: var(--space-6);\r\n            box-shadow: var(--shadow-md);\r\n            border: 1px solid var(--border-secondary);\r\n            transition: all var(--duration-300) var(--ease-out);\r\n        }\r\n\r\n        .fb-post-item:hover {\r\n            transform: translateY(-4px);\r\n            box-shadow: var(--shadow-lg);\r\n        }\r\n\r\n        .fb-post-header {\r\n            display: flex;\r\n            align-items: center;\r\n            gap: var(--space-4);\r\n            margin-bottom: var(--space-4);\r\n        }\r\n\r\n        .fb-post-profile-pic {\r\n            width: 48px;\r\n            height: 48px;\r\n            border-radius: var(--radius-full);\r\n            background-size: cover;\r\n            background-position: center;\r\n            background-color: var(--border-secondary);\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            color: var(--text-tertiary);\r\n        }\r\n\r\n        .fb-post-info {\r\n            flex: 1;\r\n        }\r\n\r\n        .fb-post-author {\r\n            font-weight: 700;\r\n            color: var(--text-primary);\r\n            margin-bottom: var(--space-1);\r\n        }\r\n\r\n        .fb-post-date {\r\n            font-size: var(--text-sm);\r\n            color: var(--text-tertiary);\r\n        }\r\n\r\n        .fb-post-content {\r\n            margin-bottom: var(--space-4);\r\n            line-height: 1.6;\r\n            color: var(--text-primary);\r\n        }\r\n\r\n        .fb-post-image {\r\n            width: 100%;\r\n            border-radius: var(--radius-2xl);\r\n            margin-bottom: var(--space-4);\r\n        }\r\n\r\n        .fb-post-stats {\r\n            display: flex;\r\n            gap: var(--space-6);\r\n            padding-top: var(--space-4);\r\n            border-top: 1px solid var(--border-secondary);\r\n        }\r\n\r\n        \/* About Cards *\/\r\n        .fb-about-grid {\r\n            display: grid;\r\n            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\r\n            gap: var(--space-6);\r\n        }\r\n\r\n        .fb-about-card {\r\n            background: var(--bg-secondary);\r\n            border-radius: var(--radius-3xl);\r\n            padding: var(--space-6);\r\n            box-shadow: var(--shadow-md);\r\n            border: 1px solid var(--border-secondary);\r\n            transition: all var(--duration-300) var(--ease-out);\r\n        }\r\n\r\n        .fb-about-card:hover {\r\n            transform: translateY(-4px);\r\n            box-shadow: var(--shadow-lg);\r\n        }\r\n\r\n        .fb-card-header {\r\n            display: flex;\r\n            align-items: center;\r\n            gap: var(--space-4);\r\n            margin-bottom: var(--space-6);\r\n        }\r\n\r\n        .fb-card-icon {\r\n            width: 48px;\r\n            height: 48px;\r\n            background: var(--gradient-primary);\r\n            border-radius: var(--radius-2xl);\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            color: var(--white);\r\n            font-size: var(--text-xl);\r\n        }\r\n\r\n        .fb-card-header h3 {\r\n            font-size: var(--text-xl);\r\n            font-weight: 700;\r\n            color: var(--text-primary);\r\n        }\r\n\r\n        .fb-card-content {\r\n            color: var(--text-primary);\r\n            line-height: 1.6;\r\n        }\r\n\r\n        .fb-about-item {\r\n            display: flex;\r\n            gap: var(--space-4);\r\n            margin-bottom: var(--space-4);\r\n        }\r\n\r\n        .fb-about-item:last-child {\r\n            margin-bottom: 0;\r\n        }\r\n\r\n        .fb-about-icon {\r\n            width: 40px;\r\n            height: 40px;\r\n            background: var(--bg-tertiary);\r\n            border-radius: var(--radius-xl);\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            color: var(--text-secondary);\r\n            flex-shrink: 0;\r\n        }\r\n\r\n        .fb-about-text h3 {\r\n            font-weight: 600;\r\n            color: var(--text-primary);\r\n            margin-bottom: var(--space-1);\r\n        }\r\n\r\n        .fb-about-text p {\r\n            color: var(--text-secondary);\r\n            font-size: var(--text-sm);\r\n        }\r\n\r\n        \/* Premium Empty State *\/\r\n        .fb-empty-state {\r\n            text-align: center;\r\n            padding: var(--space-20) var(--space-8);\r\n            color: var(--text-secondary);\r\n        }\r\n\r\n        .fb-empty-icon {\r\n            width: 120px;\r\n            height: 120px;\r\n            background: linear-gradient(135deg, var(--bg-tertiary) 0%, var(--border-secondary) 100%);\r\n            border-radius: var(--radius-full);\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            margin: 0 auto var(--space-8);\r\n            font-size: var(--text-4xl);\r\n            box-shadow: var(--shadow-lg);\r\n            animation: bounce 2s ease-in-out infinite;\r\n        }\r\n\r\n        @keyframes bounce {\r\n\r\n            0%,\r\n            20%,\r\n            50%,\r\n            80%,\r\n            100% {\r\n                transform: translateY(0);\r\n            }\r\n\r\n            40% {\r\n                transform: translateY(-15px);\r\n            }\r\n\r\n            60% {\r\n                transform: translateY(-8px);\r\n            }\r\n        }\r\n\r\n        .fb-empty-state h3 {\r\n            font-size: var(--text-2xl);\r\n            font-weight: 700;\r\n            color: var(--text-primary);\r\n            margin-bottom: var(--space-3);\r\n        }\r\n\r\n        .fb-empty-state p {\r\n            font-size: var(--text-lg);\r\n            line-height: 1.7;\r\n            max-width: 500px;\r\n            margin: 0 auto;\r\n        }\r\n\r\n        .fb-no-data-message {\r\n            text-align: center;\r\n            padding: var(--space-12);\r\n            color: var(--text-tertiary);\r\n            font-size: var(--text-lg);\r\n            background: var(--bg-tertiary);\r\n            border-radius: var(--radius-2xl);\r\n            border: 2px dashed var(--border-secondary);\r\n        }\r\n\r\n        \/* Premium Debug Section *\/\r\n        .fb-debug-container {\r\n            background: var(--gray-950);\r\n            color: var(--gray-100);\r\n            border-radius: var(--radius-4xl);\r\n            padding: var(--space-8);\r\n            box-shadow: var(--shadow-2xl);\r\n            border: 1px solid var(--gray-800);\r\n        }\r\n\r\n        .fb-debug-section {\r\n            margin-bottom: var(--space-8);\r\n        }\r\n\r\n        .fb-debug-title {\r\n            color: var(--primary-400);\r\n            font-size: var(--text-xl);\r\n            font-weight: 700;\r\n            margin-bottom: var(--space-4);\r\n            text-transform: uppercase;\r\n            letter-spacing: 0.05em;\r\n        }\r\n\r\n        .fb-debug-content {\r\n            background: var(--gray-900);\r\n            border-radius: var(--radius-2xl);\r\n            padding: var(--space-6);\r\n            font-family: 'JetBrains Mono', 'SF Mono', Monaco, 'Cascadia Code', monospace;\r\n            font-size: var(--text-sm);\r\n            line-height: 1.8;\r\n            border: 1px solid var(--gray-800);\r\n            box-shadow: var(--shadow-inner);\r\n            white-space: pre-line;\r\n        }\r\n\r\n        \/* Video Thumbnail Styles *\/\r\n        .fb-video-thumbnail {\r\n            position: relative;\r\n            height: 200px;\r\n            background-size: cover;\r\n            background-position: center;\r\n            background-color: var(--border-secondary);\r\n            cursor: pointer;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            overflow: hidden;\r\n            border-radius: var(--radius-2xl) var(--radius-2xl) 0 0;\r\n        }\r\n\r\n        .fb-video-play-icon {\r\n            position: absolute;\r\n            width: 60px;\r\n            height: 60px;\r\n            background: rgba(255, 255, 255, 0.9);\r\n            border-radius: var(--radius-full);\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            font-size: var(--text-2xl);\r\n            color: var(--primary-600);\r\n            transition: all var(--duration-300) var(--ease-out);\r\n            z-index: 2;\r\n        }\r\n\r\n        .fb-video-thumbnail:hover .fb-video-play-icon {\r\n            transform: scale(1.1);\r\n            background: var(--bg-secondary);\r\n        }\r\n\r\n        .fb-video-quality-badge {\r\n            position: absolute;\r\n            top: var(--space-3);\r\n            left: var(--space-3);\r\n            background: rgba(0, 0, 0, 0.7);\r\n            color: var(--white);\r\n            padding: var(--space-1) var(--space-3);\r\n            border-radius: var(--radius-full);\r\n            font-size: var(--text-xs);\r\n            font-weight: 700;\r\n            z-index: 2;\r\n        }\r\n\r\n        .fb-reel-badge {\r\n            position: absolute;\r\n            top: var(--space-3);\r\n            left: var(--space-3);\r\n            background: var(--gradient-secondary);\r\n            color: var(--white);\r\n            padding: var(--space-1) var(--space-3);\r\n            border-radius: var(--radius-full);\r\n            font-size: var(--text-xs);\r\n            font-weight: 700;\r\n            z-index: 2;\r\n        }\r\n\r\n        .fb-video-duration {\r\n            position: absolute;\r\n            bottom: var(--space-3);\r\n            right: var(--space-3);\r\n            background: rgba(0, 0, 0, 0.7);\r\n            color: var(--white);\r\n            padding: var(--space-1) var(--space-3);\r\n            border-radius: var(--radius-lg);\r\n            font-size: var(--text-xs);\r\n            font-weight: 600;\r\n            z-index: 2;\r\n        }\r\n\r\n        .fb-video-stats {\r\n            display: flex;\r\n            gap: var(--space-4);\r\n            margin-bottom: var(--space-4);\r\n            font-size: var(--text-sm);\r\n        }\r\n\r\n        .fb-video-stats .fb-stat-item {\r\n            display: flex;\r\n            align-items: center;\r\n            gap: var(--space-1);\r\n            color: var(--text-secondary);\r\n        }\r\n\r\n        .fb-video-stats .fb-stat-item i {\r\n            color: var(--primary-500);\r\n        }\r\n\r\n        \/* Download Progress Modal *\/\r\n        .fb-download-progress-modal {\r\n            position: fixed;\r\n            top: 20px;\r\n            right: 20px;\r\n            background: var(--bg-secondary);\r\n            border-radius: var(--radius-3xl);\r\n            padding: var(--space-6);\r\n            box-shadow: var(--shadow-2xl);\r\n            border: 1px solid var(--border-secondary);\r\n            z-index: 10001;\r\n            min-width: 300px;\r\n            opacity: 0;\r\n            visibility: hidden;\r\n            transform: translateX(100%);\r\n            transition: all var(--duration-500) var(--ease-out);\r\n        }\r\n\r\n        .fb-download-progress-modal.active {\r\n            opacity: 1;\r\n            visibility: visible;\r\n            transform: translateX(0);\r\n        }\r\n\r\n        .fb-download-progress-header {\r\n            display: flex;\r\n            align-items: center;\r\n            gap: var(--space-3);\r\n            margin-bottom: var(--space-4);\r\n        }\r\n\r\n        .fb-download-progress-header i {\r\n            color: var(--primary-500);\r\n            font-size: var(--text-xl);\r\n        }\r\n\r\n        .fb-download-progress-title {\r\n            font-weight: 700;\r\n            color: var(--text-primary);\r\n        }\r\n\r\n        .fb-download-progress-bar {\r\n            width: 100%;\r\n            height: 8px;\r\n            background: var(--border-secondary);\r\n            border-radius: var(--radius-full);\r\n            overflow: hidden;\r\n            margin-bottom: var(--space-3);\r\n        }\r\n\r\n        .fb-download-progress-fill {\r\n            height: 100%;\r\n            background: var(--gradient-primary);\r\n            border-radius: var(--radius-full);\r\n            transition: width var(--duration-300) var(--ease-out);\r\n            width: 0%;\r\n        }\r\n\r\n        .fb-download-progress-text {\r\n            font-size: var(--text-sm);\r\n            color: var(--text-secondary);\r\n            text-align: center;\r\n        }\r\n\r\n        .fb-download-cancel-btn {\r\n            margin-top: var(--space-4);\r\n            background: var(--bg-tertiary);\r\n            color: var(--text-primary);\r\n            border: none;\r\n            padding: var(--space-2) var(--space-4);\r\n            border-radius: var(--radius-lg);\r\n            cursor: pointer;\r\n            width: 100%;\r\n            font-weight: 600;\r\n        }\r\n\r\n        \/* Responsive Design *\/\r\n        @media (max-width: 992px) {\r\n            .fb-container {\r\n                padding: var(--space-6);\r\n            }\r\n\r\n            .fb-search-section {\r\n                padding: var(--space-8);\r\n            }\r\n\r\n            .fb-group-details {\r\n                padding: var(--space-8);\r\n            }\r\n\r\n            .fb-profile-info-section {\r\n                padding: var(--space-8);\r\n            }\r\n\r\n            .fb-photomodal-content {\r\n                flex-direction: column;\r\n                max-width: 95vw;\r\n            }\r\n\r\n            .fb-photomodal-image {\r\n                max-width: 95vw;\r\n                max-height: 60vh;\r\n            }\r\n\r\n            .fb-photomodal-info {\r\n                width: 100%;\r\n            }\r\n        }\r\n\r\n        @media (max-width: 768px) {\r\n            .fb-container {\r\n                padding: var(--space-4);\r\n            }\r\n\r\n            .fb-feature-viewer-wrapper .fb-av-search-form {\r\n                flex-direction: column;\r\n            }\r\n\r\n            .fb-tab-list {\r\n                flex-wrap: wrap;\r\n            }\r\n\r\n            .fb-media-grid {\r\n                grid-template-columns: 1fr;\r\n            }\r\n\r\n            .fb-video-grid {\r\n                grid-template-columns: 1fr;\r\n            }\r\n\r\n            .fb-stats-grid {\r\n                grid-template-columns: repeat(2, 1fr);\r\n            }\r\n\r\n            .fb-summary-stats {\r\n                grid-template-columns: repeat(2, 1fr);\r\n            }\r\n\r\n            .fb-download-actions {\r\n                flex-direction: row;\r\n                justify-content: center;\r\n            }\r\n\r\n            .fb-download-btn {\r\n                min-width: 140px;\r\n                padding: var(--space-3) var(--space-6);\r\n            }\r\n\r\n            .fb-header .fb-title {\r\n                font-size: var(--text-4xl);\r\n            }\r\n\r\n            .fb-group-cover {\r\n                height: 250px;\r\n            }\r\n\r\n            .fb-cover-section {\r\n                height: 250px;\r\n            }\r\n\r\n            .fb-profile-header {\r\n                flex-direction: column;\r\n                align-items: center;\r\n                text-align: center;\r\n                margin-top: -60px;\r\n            }\r\n\r\n            .fb-profile-details {\r\n                margin-top: var(--space-4);\r\n            }\r\n\r\n            .fb-profile-nav-tabs {\r\n                flex-direction: column;\r\n            }\r\n\r\n            .fb-nav-tab {\r\n                justify-content: flex-start;\r\n            }\r\n\r\n            .fb-about-grid {\r\n                grid-template-columns: 1fr;\r\n            }\r\n\r\n            .fb-photos-grid {\r\n                grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));\r\n            }\r\n        }\r\n\r\n        @media (max-width: 600px) {\r\n            .fb-stats-grid {\r\n                grid-template-columns: 1fr;\r\n            }\r\n\r\n            .fb-summary-stats {\r\n                grid-template-columns: 1fr;\r\n            }\r\n\r\n            .fb-download-actions {\r\n                flex-direction: column;\r\n            }\r\n\r\n            .fb-search-section {\r\n                padding: var(--space-6);\r\n            }\r\n\r\n            .fb-group-details {\r\n                padding: var(--space-6);\r\n            }\r\n\r\n            .fb-profile-info-section {\r\n                padding: var(--space-6);\r\n            }\r\n\r\n            .fb-profile-picture {\r\n                width: 120px;\r\n                height: 120px;\r\n            }\r\n\r\n            .fb-profile-name {\r\n                font-size: var(--text-2xl);\r\n            }\r\n\r\n            .fb-photos-grid {\r\n                grid-template-columns: 1fr;\r\n            }\r\n        }\r\n\r\n        @media (max-width: 400px) {\r\n            .fb-container {\r\n                padding: var(--space-3);\r\n            }\r\n\r\n            .fb-feature-viewer-wrapper .fb-av-search-form {\r\n                flex-direction: column;\r\n            }\r\n\r\n            .fb-feature-viewer-wrapper .fb-av-input-group {\r\n                margin-bottom: var(--space-3);\r\n            }\r\n\r\n            .fb-feature-viewer-wrapper .fb-av-analyze-btn {\r\n                width: 100%;\r\n            }\r\n\r\n            .fb-header .fb-title {\r\n                font-size: var(--text-3xl);\r\n            }\r\n\r\n            .fb-header .fb-subtitle {\r\n                font-size: var(--text-lg);\r\n            }\r\n\r\n            .fb-group-cover {\r\n                height: 200px;\r\n            }\r\n\r\n            .fb-cover-section {\r\n                height: 200px;\r\n            }\r\n\r\n            .fb-profile-picture {\r\n                width: 100px;\r\n                height: 100px;\r\n            }\r\n\r\n            .fb-profile-name {\r\n                font-size: var(--text-xl);\r\n            }\r\n\r\n            .fb-profile-actions {\r\n                flex-direction: column;\r\n                width: 100%;\r\n            }\r\n\r\n            .fb-action-btn {\r\n                width: 100%;\r\n                justify-content: center;\r\n            }\r\n\r\n            .fb-media-grid,\r\n            .fb-video-grid,\r\n            .fb-photos-grid {\r\n                grid-template-columns: 1fr;\r\n            }\r\n\r\n            .fb-stats-grid,\r\n            .fb-summary-stats {\r\n                grid-template-columns: 1fr;\r\n            }\r\n\r\n            .fb-download-actions {\r\n                flex-direction: column;\r\n                width: 100%;\r\n            }\r\n\r\n            .fb-download-btn {\r\n                width: 100%;\r\n            }\r\n        }\r\n\r\n        @media (max-width: 375px) {\r\n            .fb-container {\r\n                padding: var(--space-2);\r\n            }\r\n\r\n            .fb-header {\r\n                margin-bottom: var(--space-12);\r\n            }\r\n\r\n            .fb-header .fb-title {\r\n                font-size: var(--text-2xl);\r\n            }\r\n\r\n            .fb-header .fb-subtitle {\r\n                font-size: var(--text-base);\r\n            }\r\n\r\n            .fb-search-section {\r\n                padding: var(--space-4);\r\n            }\r\n\r\n            .fb-group-details,\r\n            .fb-profile-info-section {\r\n                padding: var(--space-4);\r\n            }\r\n\r\n            .fb-profile-picture {\r\n                width: 80px;\r\n                height: 80px;\r\n            }\r\n\r\n            .fb-profile-name {\r\n                font-size: var(--text-lg);\r\n            }\r\n\r\n            .fb-profile-actions {\r\n                gap: var(--space-2);\r\n            }\r\n\r\n            .fb-action-btn {\r\n                padding: var(--space-2) var(--space-4);\r\n                font-size: var(--text-sm);\r\n            }\r\n\r\n            .fb-nav-tabs {\r\n                padding: var(--space-1);\r\n            }\r\n\r\n            .fb-nav-tab {\r\n                padding: var(--space-2) var(--space-4);\r\n                font-size: var(--text-sm);\r\n            }\r\n\r\n            .fb-tab-content {\r\n                padding: var(--space-4);\r\n            }\r\n\r\n            .fb-stats-grid,\r\n            .fb-summary-stats,\r\n            .fb-about-grid,\r\n            .fb-media-grid,\r\n            .fb-video-grid,\r\n            .fb-photos-grid {\r\n                grid-template-columns: 1fr;\r\n                gap: var(--space-4);\r\n            }\r\n\r\n            .fb-stat-card,\r\n            .fb-media-card,\r\n            .fb-video-card,\r\n            .fb-photoitem,\r\n            .fb-about-card,\r\n            .fb-post-item {\r\n                padding: var(--space-4);\r\n            }\r\n\r\n            .fb-download-btn {\r\n                padding: var(--space-3) var(--space-6);\r\n                font-size: var(--text-sm);\r\n            }\r\n        }\r\n\r\n        \/* Custom Scrollbar *\/\r\n        ::-webkit-scrollbar {\r\n            width: 12px;\r\n        }\r\n\r\n        ::-webkit-scrollbar-track {\r\n            background: var(--bg-tertiary);\r\n            border-radius: var(--radius-full);\r\n        }\r\n\r\n        ::-webkit-scrollbar-thumb {\r\n            background: var(--gradient-primary);\r\n            border-radius: var(--radius-full);\r\n            border: 2px solid var(--bg-tertiary);\r\n        }\r\n\r\n        ::-webkit-scrollbar-thumb:hover {\r\n            background: var(--gradient-secondary);\r\n        }\r\n\r\n        \/* Selection *\/\r\n        ::selection {\r\n            background: var(--primary-200);\r\n            color: var(--primary-900);\r\n        }\r\n\r\n        \/* Focus Visible *\/\r\n        :focus-visible {\r\n            outline: 2px solid var(--primary-500);\r\n            outline-offset: 2px;\r\n        }\r\n\t\t\t\r\n\t\t\t\/* Responsive Design *\/\r\n@media (max-width: 992px) {\r\n    .fb-container {\r\n        padding: var(--space-6);\r\n    }\r\n\r\n    .fb-search-section {\r\n        padding: var(--space-8);\r\n    }\r\n\r\n    .fb-group-details {\r\n        padding: var(--space-8);\r\n    }\r\n\r\n    .fb-profile-info-section {\r\n        padding: var(--space-8);\r\n    }\r\n\r\n    .fb-photomodal-content {\r\n        flex-direction: column;\r\n        max-width: 95vw;\r\n    }\r\n\r\n    .fb-photomodal-image {\r\n        max-width: 95vw;\r\n        max-height: 60vh;\r\n    }\r\n\r\n    .fb-photomodal-info {\r\n        width: 100%;\r\n    }\r\n\r\n    \/* General responsive adjustments *\/\r\n    .fb-header .fb-title {\r\n        font-size: clamp(var(--text-3xl), 6vw, var(--text-6xl));\r\n    }\r\n\r\n    .fb-header .fb-subtitle {\r\n        font-size: var(--text-lg);\r\n    }\r\n\r\n    .fb-feature-viewer-wrapper .fb-av-analyze-btn,\r\n    .fb-download-all-btn,\r\n    .fb-visit-btn,\r\n    .fb-download-btn {\r\n        font-size: var(--text-base);\r\n        padding: var(--space-4) var(--space-8);\r\n    }\r\n\r\n    .fb-group-title {\r\n        font-size: clamp(var(--text-xl), 4vw, var(--text-4xl));\r\n    }\r\n\r\n    .fb-group-subtitle {\r\n        font-size: var(--text-lg);\r\n    }\r\n\r\n    .fb-stat-number {\r\n        font-size: var(--text-2xl);\r\n    }\r\n\r\n    .fb-stat-label {\r\n        font-size: var(--text-xs);\r\n    }\r\n\r\n    .fb-tab-btn {\r\n        font-size: var(--text-base);\r\n    }\r\n\r\n    .fb-summary-title {\r\n        font-size: var(--text-3xl);\r\n    }\r\n\r\n    .fb-summary-description {\r\n        font-size: var(--text-lg);\r\n    }\r\n\r\n    .fb-summary-stat-number {\r\n        font-size: var(--text-3xl);\r\n    }\r\n\r\n    .fb-summary-stat-label {\r\n        font-size: var(--text-xs);\r\n    }\r\n\r\n    .fb-media-card,\r\n    .fb-video-card,\r\n    .fb-photoitem,\r\n    .fb-about-card,\r\n    .fb-post-item {\r\n        padding: var(--space-5);\r\n    }\r\n\r\n    .fb-media-info,\r\n    .fb-video-info,\r\n    .fb-photoinfo,\r\n    .fb-card-content,\r\n    .fb-post-content {\r\n        font-size: var(--text-sm);\r\n    }\r\n\r\n    .fb-quality-indicator,\r\n    .fb-download-btn,\r\n    .fb-photoaction-btn,\r\n    .fb-photomodal-action {\r\n        font-size: var(--text-sm);\r\n    }\r\n}\r\n\r\n@media (max-width: 768px) {\r\n    .fb-container {\r\n        padding: var(--space-4);\r\n    }\r\n\r\n    .fb-feature-viewer-wrapper .fb-av-search-form {\r\n        flex-direction: column;\r\n    }\r\n\r\n    .fb-tab-list {\r\n        flex-wrap: wrap;\r\n    }\r\n\r\n    .fb-media-grid {\r\n        grid-template-columns: 1fr;\r\n    }\r\n\r\n    .fb-video-grid {\r\n        grid-template-columns: 1fr;\r\n    }\r\n\r\n    .fb-stats-grid {\r\n        grid-template-columns: repeat(2, 1fr);\r\n    }\r\n\r\n    .fb-summary-stats {\r\n        grid-template-columns: repeat(2, 1fr);\r\n    }\r\n\r\n    .fb-download-actions {\r\n        flex-direction: row;\r\n        justify-content: center;\r\n    }\r\n\r\n    .fb-download-btn {\r\n        min-width: 140px;\r\n        padding: var(--space-3) var(--space-6);\r\n    }\r\n\r\n    .fb-header .fb-title {\r\n        font-size: var(--text-4xl);\r\n    }\r\n\r\n    .fb-group-cover {\r\n        height: 250px;\r\n    }\r\n\r\n    .fb-cover-section {\r\n        height: 250px;\r\n    }\r\n\r\n    .fb-profile-header {\r\n        flex-direction: column;\r\n        align-items: center;\r\n        text-align: center;\r\n        margin-top: -60px; \/* Adjust for smaller profile picture *\/\r\n    }\r\n\r\n    .fb-profile-details {\r\n        margin-top: var(--space-4);\r\n    }\r\n\r\n    .fb-profile-nav-tabs {\r\n        flex-direction: column;\r\n    }\r\n\r\n    .fb-nav-tab {\r\n        justify-content: flex-start;\r\n    }\r\n\r\n    .fb-about-grid {\r\n        grid-template-columns: 1fr;\r\n    }\r\n\r\n    .fb-photos-grid {\r\n        grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));\r\n    }\r\n\r\n    .fb-feature-viewer-wrapper .fb-av-url-input {\r\n        padding: var(--space-4) !important;\r\n    }\r\n\r\n    .fb-video-info {\r\n        height: auto; \/* Allow content to dictate height *\/\r\n    }\r\n\t.fb-header .fb-title {\r\n\tfont-size: clamp(var(--text-4xl), 8vw, var(--text-7xl));\r\n\tfont-weight: 900;\r\n\tbackground: var(--gradient-primary);\r\n\tbackground-clip: text;\r\n\t-webkit-background-clip: text;\r\n\t-webkit-text-fill-color: transparent;\r\n\tmargin-bottom: var(--space-6);\r\n\tletter-spacing: -0.04em;\r\n\tline-height: 0.9;\r\n\tposition: relative;\r\n\tmargin-top: 40px;\r\n}\r\n}\r\n\r\n@media (max-width: 600px) {\r\n    .fb-stats-grid {\r\n        grid-template-columns: 1fr;\r\n    }\r\n\r\n    .fb-summary-stats {\r\n        grid-template-columns: 1fr;\r\n    }\r\n\r\n    .fb-download-actions {\r\n        flex-direction: column;\r\n    }\r\n\r\n    .fb-search-section {\r\n        padding: var(--space-6);\r\n    }\r\n\r\n    .fb-group-details {\r\n        padding: var(--space-6);\r\n    }\r\n\r\n    .fb-profile-info-section {\r\n        padding: var(--space-6);\r\n    }\r\n\r\n    .fb-profile-picture {\r\n        width: 120px;\r\n        height: 120px;\r\n    }\r\n\r\n    .fb-profile-ring {\r\n        inset: -6px;\r\n    }\r\n\r\n    .fb-profile-status-indicator {\r\n        width: 20px;\r\n        height: 20px;\r\n        bottom: 8px;\r\n        right: 8px;\r\n    }\r\n\r\n    .fb-profile-name {\r\n        font-size: var(--text-2xl);\r\n    }\r\n\r\n    .fb-profile-stats {\r\n        flex-direction: column;\r\n        align-items: center;\r\n    }\r\n\r\n    .fb-profile-actions {\r\n        justify-content: center;\r\n    }\r\n\r\n    .fb-photos-grid {\r\n        grid-template-columns: 1fr;\r\n    }\r\n\r\n    .fb-content-title h2 {\r\n        font-size: var(--text-xl);\r\n    }\r\n\r\n    .fb-content-title i {\r\n        font-size: var(--text-lg);\r\n    }\r\n\r\n    .fb-stat-item {\r\n        font-size: var(--text-xs);\r\n    }\r\n\r\n    .fb-post-header {\r\n        flex-direction: column;\r\n        align-items: flex-start;\r\n        gap: var(--space-2);\r\n    }\r\n\r\n    .fb-post-profile-pic {\r\n        width: 40px;\r\n        height: 40px;\r\n    }\r\n\r\n    .fb-post-author {\r\n        font-size: var(--text-base);\r\n    }\r\n\r\n    .fb-post-date {\r\n        font-size: var(--text-xs);\r\n    }\r\n\r\n    .fb-card-header {\r\n        flex-direction: column;\r\n        align-items: flex-start;\r\n        gap: var(--space-2);\r\n    }\r\n\r\n    .fb-card-icon {\r\n        width: 40px;\r\n        height: 40px;\r\n        font-size: var(--text-lg);\r\n    }\r\n\r\n    .fb-card-header h3 {\r\n        font-size: var(--text-lg);\r\n    }\r\n\r\n    .fb-empty-icon {\r\n        width: 100px;\r\n        height: 100px;\r\n        font-size: var(--text-3xl);\r\n    }\r\n\r\n    .fb-empty-state h3 {\r\n        font-size: var(--text-xl);\r\n    }\r\n\r\n    .fb-empty-state p {\r\n        font-size: var(--text-base);\r\n    }\r\n\r\n    .fb-debug-title {\r\n        font-size: var(--text-base);\r\n    }\r\n\r\n    .fb-debug-content {\r\n        font-size: var(--text-xs);\r\n    }\r\n\r\n    .fb-video-play-icon {\r\n        width: 50px;\r\n        height: 50px;\r\n        font-size: var(--text-xl);\r\n    }\r\n\t.fb-header .fb-title {\r\n\tfont-size: clamp(var(--text-4xl), 8vw, var(--text-7xl));\r\n\tfont-weight: 900;\r\n\tbackground: var(--gradient-primary);\r\n\tbackground-clip: text;\r\n\t-webkit-background-clip: text;\r\n\t-webkit-text-fill-color: transparent;\r\n\tmargin-bottom: var(--space-6);\r\n\tletter-spacing: -0.04em;\r\n\tline-height: 0.9;\r\n\tposition: relative;\r\n\tmargin-top: 40px;\r\n}\r\n}\r\n\r\n@media (max-width: 400px) {\r\n    .fb-container {\r\n        padding: var(--space-3);\r\n    }\r\n\r\n    .fb-feature-viewer-wrapper .fb-av-search-form {\r\n        flex-direction: column;\r\n    }\r\n\r\n    .fb-feature-viewer-wrapper .fb-av-input-group {\r\n        margin-bottom: var(--space-3);\r\n    }\r\n\r\n    .fb-feature-viewer-wrapper .fb-av-analyze-btn {\r\n        width: 100%;\r\n    }\r\n\r\n    .fb-header .fb-title {\r\n        font-size: var(--text-3xl);\r\n    }\r\n\r\n    .fb-header .fb-subtitle {\r\n        font-size: var(--text-lg);\r\n    }\r\n\r\n    .fb-group-cover {\r\n        height: 200px;\r\n    }\r\n\r\n    .fb-cover-section {\r\n        height: 200px;\r\n    }\r\n\r\n    .fb-profile-picture {\r\n        width: 100px;\r\n        height: 100px;\r\n    }\r\n\r\n    .fb-profile-ring {\r\n        inset: -5px;\r\n    }\r\n\r\n    .fb-profile-status-indicator {\r\n        width: 18px;\r\n        height: 18px;\r\n        bottom: 6px;\r\n        right: 6px;\r\n    }\r\n\r\n    .fb-profile-name {\r\n        font-size: var(--text-xl);\r\n    }\r\n\r\n    .fb-profile-actions {\r\n        flex-direction: column;\r\n        width: 100%;\r\n    }\r\n\r\n    .fb-action-btn {\r\n        width: 100%;\r\n        justify-content: center;\r\n    }\r\n\r\n    .fb-media-grid,\r\n    .fb-video-grid,\r\n    .fb-photos-grid {\r\n        grid-template-columns: 1fr;\r\n    }\r\n\r\n    .fb-stats-grid,\r\n    .fb-summary-stats {\r\n        grid-template-columns: 1fr;\r\n    }\r\n\r\n    .fb-download-actions {\r\n        flex-direction: column;\r\n        width: 100%;\r\n    }\r\n\r\n    .fb-download-btn {\r\n        width: 100%;\r\n    }\r\n\r\n    \/* Further element-specific adjustments *\/\r\n    .fb-group-info-overlay {\r\n        padding: var(--space-8);\r\n    }\r\n\r\n    .fb-group-title {\r\n        font-size: var(--text-3xl);\r\n    }\r\n\r\n    .fb-group-subtitle {\r\n        font-size: var(--text-base);\r\n    }\r\n\r\n    .fb-stat-card {\r\n        padding: var(--space-6);\r\n    }\r\n\r\n    .fb-stat-icon {\r\n        width: 50px;\r\n        height: 50px;\r\n        font-size: var(--text-xl);\r\n    }\r\n\r\n    .fb-stat-number {\r\n        font-size: var(--text-xl);\r\n    }\r\n\r\n    .fb-group-description {\r\n        font-size: var(--text-base);\r\n    }\r\n\r\n    .fb-visit-btn {\r\n        padding: var(--space-3) var(--space-6);\r\n        font-size: var(--text-base);\r\n    }\r\n\r\n    .fb-tab-btn {\r\n        padding: var(--space-4) var(--space-6);\r\n        font-size: var(--text-base);\r\n    }\r\n\r\n    .fb-media-summary {\r\n        padding: var(--space-8);\r\n    }\r\n\r\n    .fb-summary-title {\r\n        font-size: var(--text-2xl);\r\n    }\r\n\r\n    .fb-summary-description {\r\n        font-size: var(--text-base);\r\n    }\r\n\r\n    .fb-summary-stat-number {\r\n        font-size: var(--text-2xl);\r\n    }\r\n\r\n    .fb-media-image-container {\r\n        aspect-ratio: 16\/9; \/* Slightly wider for smaller screens *\/\r\n    }\r\n\r\n    .fb-media-info,\r\n    .fb-video-info,\r\n    .fb-photoinfo,\r\n    .fb-card-content,\r\n    .fb-post-content {\r\n        padding: var(--space-4);\r\n    }\r\n\r\n    .fb-quality-indicator {\r\n        font-size: var(--text-xs);\r\n    }\r\n\r\n    .fb-download-btn {\r\n        font-size: var(--text-sm);\r\n    }\r\n\r\n    .fb-video-title,\r\n    .fb-post-author,\r\n    .fb-card-header h3 {\r\n        font-size: var(--text-base);\r\n    }\r\n\r\n    .fb-video-description,\r\n    .fb-post-date,\r\n    .fb-photometa,\r\n    .fb-about-text p {\r\n        font-size: var(--text-xs);\r\n    }\r\n\r\n    .fb-quality-badge,\r\n    .fb-format-badge {\r\n        font-size: var(--text-xxs); \/* Even smaller if needed *\/\r\n        padding: var(--space-1) var(--space-2);\r\n    }\r\n\r\n    .fb-video-download-btn,\r\n    .fb-copy-btn {\r\n        padding: var(--space-2) var(--space-4);\r\n        font-size: var(--text-sm);\r\n    }\r\n\r\n    .fb-photomodal-info {\r\n        padding: var(--space-6);\r\n    }\r\n\r\n    .fb-photomodal-title {\r\n        font-size: var(--text-xl);\r\n    }\r\n\r\n    .fb-photomodal-stat-value {\r\n        font-size: var(--text-lg);\r\n    }\r\n\r\n    .fb-photomodal-stat-label {\r\n        font-size: var(--text-xs);\r\n    }\r\n\r\n    .fb-photomodal-action {\r\n        font-size: var(--text-sm);\r\n        padding: var(--space-3) var(--space-6);\r\n    }\r\n\r\n    .fb-empty-state h3 {\r\n        font-size: var(--text-xl);\r\n    }\r\n\r\n    .fb-empty-state p {\r\n        font-size: var(--text-base);\r\n    }\r\n\t.fb-header .fb-title {\r\n\tfont-size: clamp(var(--text-4xl), 8vw, var(--text-7xl));\r\n\tfont-weight: 900;\r\n\tbackground: var(--gradient-primary);\r\n\tbackground-clip: text;\r\n\t-webkit-background-clip: text;\r\n\t-webkit-text-fill-color: transparent;\r\n\tmargin-bottom: var(--space-6);\r\n\tletter-spacing: -0.04em;\r\n\tline-height: 0.9;\r\n\tposition: relative;\r\n\tmargin-top: 40px;\r\n}\r\n}\r\n\r\n@media (max-width: 375px) {\r\n    .fb-container {\r\n        padding: var(--space-2);\r\n    }\r\n\r\n    .fb-header {\r\n        margin-bottom: var(--space-12);\r\n    }\r\n\r\n    .fb-header .fb-title {\r\n        font-size: var(--text-2xl);\r\n    }\r\n\r\n    .fb-header .fb-subtitle {\r\n        font-size: var(--text-base);\r\n    }\r\n\r\n    .fb-search-section {\r\n        padding: var(--space-4);\r\n    }\r\n\r\n    .fb-group-details,\r\n    .fb-profile-info-section {\r\n        padding: var(--space-4);\r\n    }\r\n\r\n    .fb-profile-picture {\r\n        width: 80px;\r\n        height: 80px;\r\n    }\r\n\r\n    .fb-profile-ring {\r\n        inset: -4px;\r\n    }\r\n\r\n    .fb-profile-status-indicator {\r\n        width: 16px;\r\n        height: 16px;\r\n        bottom: 4px;\r\n        right: 4px;\r\n    }\r\n\r\n    .fb-profile-name {\r\n        font-size: var(--text-lg);\r\n    }\r\n\r\n    .fb-profile-actions {\r\n        gap: var(--space-2);\r\n    }\r\n\r\n    .fb-action-btn {\r\n        padding: var(--space-2) var(--space-4);\r\n        font-size: var(--text-sm);\r\n    }\r\n\r\n    .fb-nav-tabs {\r\n        padding: var(--space-1);\r\n    }\r\n\r\n    .fb-nav-tab {\r\n        padding: var(--space-2) var(--space-4);\r\n        font-size: var(--text-sm);\r\n    }\r\n\r\n    .fb-tab-content {\r\n        padding: var(--space-4);\r\n    }\r\n\r\n    .fb-stats-grid,\r\n    .fb-summary-stats,\r\n    .fb-about-grid,\r\n    .fb-media-grid,\r\n    .fb-video-grid,\r\n    .fb-photos-grid {\r\n        grid-template-columns: 1fr;\r\n        gap: var(--space-4);\r\n    }\r\n\r\n    .fb-stat-card,\r\n    .fb-media-card,\r\n    .fb-video-card,\r\n    .fb-photoitem,\r\n    .fb-about-card,\r\n    .fb-post-item {\r\n        padding: var(--space-4);\r\n    }\r\n\r\n    .fb-download-btn {\r\n        padding: var(--space-3) var(--space-6);\r\n        font-size: var(--text-sm);\r\n    }\r\n\r\n    .fb-post-profile-pic {\r\n        width: 32px;\r\n        height: 32px;\r\n    }\r\n\r\n    .fb-card-icon {\r\n        width: 32px;\r\n        height: 32px;\r\n        font-size: var(--text-base);\r\n    }\r\n\r\n    .fb-empty-icon {\r\n        width: 80px;\r\n        height: 80px;\r\n        font-size: var(--text-2xl);\r\n    }\r\n\r\n    .fb-empty-state h3 {\r\n        font-size: var(--text-lg);\r\n    }\r\n\r\n    .fb-empty-state p {\r\n        font-size: var(--text-sm);\r\n    }\r\n\r\n    .fb-video-thumbnail {\r\n        height: 180px;\r\n    }\r\n\r\n    .fb-video-play-icon {\r\n        width: 40px;\r\n        height: 40px;\r\n        font-size: var(--text-lg);\r\n    }\r\n\r\n    .fb-download-progress-modal {\r\n        min-width: unset;\r\n        width: 90vw;\r\n        left: 50%;\r\n        transform: translateX(-50%);\r\n        top: var(--space-4);\r\n    }\r\n\t.fb-header .fb-title {\r\n\tfont-size: clamp(var(--text-4xl), 8vw, var(--text-7xl));\r\n\tfont-weight: 900;\r\n\tbackground: var(--gradient-primary);\r\n\tbackground-clip: text;\r\n\t-webkit-background-clip: text;\r\n\t-webkit-text-fill-color: transparent;\r\n\tmargin-bottom: var(--space-6);\r\n\tletter-spacing: -0.04em;\r\n\tline-height: 0.9;\r\n\tposition: relative;\r\n\tmargin-top: 40px;\r\n}\r\n}\r\n    <\/style>\r\n\r\n    <div class=\"fb-feature-viewer-wrapper\">\r\n        <div class=\"bg-pattern\"><\/div>\r\n        <div class=\"bg-overlay\"><\/div>\r\n\r\n        <div class=\"fb-container\">\r\n            <header class=\"fb-header\">\r\n                <h1 class=\"fb-title\">Facebook Feature Viewer \u2013 Explore All Features Free<\/h1>\r\n                <p class=\"fb-subtitle\">Analyze Facebook profiles, groups and pages with advanced analytics and beautiful visualizations<\/p>\r\n            <\/header>\r\n\r\n            <section class=\"fb-search-section\">\r\n                <form class=\"fb-av-search-form\" onsubmit=\"analyzeUrl(event)\">\r\n                    <div class=\"fb-av-input-group\">\r\n                        <input type=\"text\" inputmode=\"url\" id=\"urlInput\" class=\"fb-av-url-input\"\r\n                            placeholder=\"Enter Facebook group or profile URL...\" autocomplete=\"off\" spellcheck=\"false\" required>\r\n                    <\/div>\r\n                    <button type=\"submit\" class=\"fb-av-analyze-btn\" id=\"analyzeBtn\">\r\n                        <span>Analyze<\/span>\r\n                    <\/button>\r\n                <\/form>\r\n                <div id=\"errorMessage\" class=\"fb-error-message\" style=\"display: none;\"><\/div>\r\n            <\/section>\r\n\r\n            <div id=\"loadingSection\" class=\"fb-loading\" style=\"display: none;\">\r\n                <div class=\"fb-loading-spinner\"><\/div>\r\n                <div class=\"fb-loading-text\">Analyzing data...<\/div>\r\n            <\/div>\r\n\r\n            <!-- Group Content Container -->\r\n            <main id=\"groupContent\" style=\"display: none;\">\r\n                <!-- Dynamic group content will be inserted here -->\r\n            <\/main>\r\n\r\n            <!-- Profile Content Container -->\r\n            <main id=\"profileContent\" style=\"display: none;\">\r\n                <!-- Dynamic profile content will be inserted here -->\r\n            <\/main>\r\n        <\/div>\r\n\r\n        <!-- Photo Modal -->\r\n        <div id=\"fb-photomodal\" class=\"fb-photomodal\">\r\n            <div class=\"fb-photomodal-content\">\r\n                <button class=\"fb-photomodal-close\" onclick=\"closePhotoModal()\">\r\n                    <i class=\"fas fa-times\"><\/i>\r\n                <\/button>\r\n                <img decoding=\"async\" id=\"fb-photomodal-image\" class=\"fb-photomodal-image\" src=\"\/placeholder.svg\" alt=\"Photo\">\r\n                <div class=\"fb-photomodal-info\">\r\n                    <div class=\"fb-photomodal-header\">\r\n                        <h3 id=\"fb-photomodal-title\" class=\"fb-photomodal-title\">Photo Details<\/h3>\r\n                    <\/div>\r\n                    <div id=\"fb-photomodal-stats\" class=\"fb-photomodal-stats\">\r\n                        <!-- Stats will be populated dynamically -->\r\n                    <\/div>\r\n                    <div class=\"fb-photomodal-actions\">\r\n                        <button class=\"fb-photomodal-action primary\" onclick=\"downloadCurrentPhoto()\">\r\n                            <i class=\"fas fa-download\"><\/i>\r\n                            Download Original\r\n                        <\/button>\r\n                        <button class=\"fb-photomodal-action\" onclick=\"shareCurrentPhoto()\">\r\n                            <i class=\"fas fa-share\"><\/i>\r\n                            Share Photo\r\n                        <\/button>\r\n                        <button class=\"fb-photomodal-action\" onclick=\"viewOnFacebook()\">\r\n                            <i class=\"fab fa-facebook\"><\/i>\r\n                            View on Facebook\r\n                        <\/button>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <!-- Download Progress Modal -->\r\n        <div id=\"download-progress-modal\" class=\"fb-download-progress-modal\">\r\n            <div class=\"fb-download-progress-header\">\r\n                <i class=\"fas fa-download\"><\/i>\r\n                <span id=\"download-progress-title\" class=\"fb-download-progress-title\">Downloading...<\/span>\r\n            <\/div>\r\n            <div class=\"fb-download-progress-bar\">\r\n                <div id=\"download-progress-fill\" class=\"fb-download-progress-fill\"><\/div>\r\n            <\/div>\r\n            <div id=\"download-progress-text\" class=\"fb-download-progress-text\">Preparing download...<\/div>\r\n            <button id=\"download-cancel-btn\" class=\"fb-download-cancel-btn\" style=\"display: none;\">Cancel<\/button>\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <script>\r\n        \/\/ Global variables\r\n        let currentUrl = '';\r\n        let currentType = ''; \/\/ 'group' or 'profile'\r\n        let currentGroupId = null;\r\n        let allHDVideos = [];\r\n        let videosLoaded = false;\r\n        let reelsLoaded = false;\r\n        let profileData = null;\r\n        let currentPhotoData = null;\r\n        let currentUsername = '';\r\n        let downloadAbortController = null;\r\n        const FACEBOOK_API_URL = 'https:\/\/tools.xrespond.com\/api\/facebook\/all-details';\r\n        const API_REQUEST_TIMEOUT_MS = 45000;\r\n        const MIN_MEDIA_DIMENSION = 200;\r\n\r\n        async function fetchFacebookApi(payload) {\r\n            const endpoints = getConfiguredApiEndpoints();\r\n            const failures = [];\r\n\r\n            for (const endpoint of endpoints) {\r\n                try {\r\n                    const response = await fetchWithTimeout(endpoint.url, {\r\n                        method: 'POST',\r\n                        headers: {\r\n                            'Content-Type': 'application\/json',\r\n                            'Accept': 'application\/json'\r\n                        },\r\n                        body: JSON.stringify(payload)\r\n                    }, API_REQUEST_TIMEOUT_MS);\r\n\r\n                    const rawBody = await response.text();\r\n\r\n                    if (!response.ok) {\r\n                        const message = extractApiErrorMessage(rawBody, `HTTP error ${response.status}`);\r\n                        failures.push({ endpoint, status: response.status, message });\r\n                        continue;\r\n                    }\r\n\r\n                    let data;\r\n                    try {\r\n                        data = rawBody ? JSON.parse(rawBody) : {};\r\n                    } catch (error) {\r\n                        failures.push({ endpoint, message: 'Invalid JSON response from the data service' });\r\n                        continue;\r\n                    }\r\n\r\n                    if (data?.status !== 'success') {\r\n                        failures.push({ endpoint, message: data?.message || 'Facebook API request failed' });\r\n                        continue;\r\n                    }\r\n\r\n                    if (!Array.isArray(data?.data?.data)) {\r\n                        failures.push({ endpoint, message: 'Facebook API returned an unexpected payload' });\r\n                        continue;\r\n                    }\r\n\r\n                    return data;\r\n                } catch (error) {\r\n                    failures.push({\r\n                        endpoint,\r\n                        message: getNetworkFailureMessage(error),\r\n                        originalError: error\r\n                    });\r\n                }\r\n            }\r\n\r\n            throw buildApiRequestError(failures);\r\n        }\r\n\r\n        function getConfiguredApiEndpoints() {\r\n            const configuredEndpoints = Array.isArray(window.FACEBOOK_API_ENDPOINTS) && window.FACEBOOK_API_ENDPOINTS.length\r\n                ? window.FACEBOOK_API_ENDPOINTS\r\n                : [FACEBOOK_API_URL];\r\n\r\n            const endpoints = configuredEndpoints\r\n                .map((endpoint, index) => {\r\n                    if (typeof endpoint === 'string') {\r\n                        return {\r\n                            label: index === 0 ? 'Primary data API' : `Data API ${index + 1}`,\r\n                            url: endpoint\r\n                        };\r\n                    }\r\n\r\n                    return {\r\n                        label: endpoint?.label || endpoint?.name || `Data API ${index + 1}`,\r\n                        url: endpoint?.url || ''\r\n                    };\r\n                })\r\n                .filter(endpoint => endpoint.url);\r\n\r\n            return endpoints.length ? endpoints : [{ label: 'Primary data API', url: FACEBOOK_API_URL }];\r\n        }\r\n\r\n        function fetchWithTimeout(url, options, timeoutMs) {\r\n            const controller = new AbortController();\r\n            const timeoutId = window.setTimeout(() => controller.abort(), timeoutMs);\r\n\r\n            return fetch(url, {\r\n                ...options,\r\n                signal: controller.signal\r\n            }).finally(() => window.clearTimeout(timeoutId));\r\n        }\r\n\r\n        function getNetworkFailureMessage(error) {\r\n            if (error?.name === 'AbortError') {\r\n                return 'The data service took too long to respond. Please try again.';\r\n            }\r\n\r\n            if (error instanceof TypeError || \/failed to fetch\/i.test(error?.message || '')) {\r\n                return 'The data service is unreachable or blocked by the browser. Configure a same-origin API proxy if this domain is restricted.';\r\n            }\r\n\r\n            return error?.message || 'The request could not be completed.';\r\n        }\r\n\r\n        function buildApiRequestError(failures) {\r\n            const lastFailure = failures[failures.length - 1] || {};\r\n            const statusPrefix = lastFailure.status ? `HTTP ${lastFailure.status}: ` : '';\r\n            const detail = `${statusPrefix}${lastFailure.message || 'Unable to fetch Facebook data.'}`;\r\n            const error = new Error(detail);\r\n            error.failures = failures;\r\n\r\n            if (\/access denied\/i.test(detail)) {\r\n                error.userMessage = 'The data service rejected this request. Use the approved live domain or configure a server-side proxy for this endpoint.';\r\n            } else if (\/unreachable|blocked|too long\/i.test(detail)) {\r\n                error.userMessage = detail;\r\n            } else {\r\n                error.userMessage = detail;\r\n            }\r\n\r\n            return error;\r\n        }\r\n\r\n        function extractApiErrorMessage(rawBody, fallbackMessage) {\r\n            try {\r\n                const parsed = rawBody ? JSON.parse(rawBody) : null;\r\n                return parsed?.message || parsed?.error || fallbackMessage;\r\n            } catch (error) {\r\n                return rawBody || fallbackMessage;\r\n            }\r\n        }\r\n\r\n        \/\/ URL Detection and Analysis\r\n        function normalizeFacebookUrl(rawUrl) {\r\n            let normalizedUrl = (rawUrl || '').trim();\r\n\r\n            if (!normalizedUrl) {\r\n                throw new Error('Enter a Facebook profile, page, or group URL.');\r\n            }\r\n\r\n            if (!\/^https?:\\\/\\\/\/i.test(normalizedUrl)) {\r\n                normalizedUrl = `https:\/\/${normalizedUrl.replace(\/^\\\/+\/, '')}`;\r\n            }\r\n\r\n            let parsedUrl;\r\n            try {\r\n                parsedUrl = new URL(normalizedUrl);\r\n            } catch (error) {\r\n                throw new Error('Enter a valid Facebook URL.');\r\n            }\r\n\r\n            const host = parsedUrl.hostname.toLowerCase().replace(\/^www\\.\/, '');\r\n            const isFacebookHost = host === 'facebook.com' ||\r\n                host === 'm.facebook.com' ||\r\n                host === 'mobile.facebook.com' ||\r\n                host === 'web.facebook.com' ||\r\n                host === 'fb.com';\r\n\r\n            if (!isFacebookHost) {\r\n                throw new Error('Only Facebook profile, page, and group URLs are supported.');\r\n            }\r\n\r\n            parsedUrl.protocol = 'https:';\r\n            parsedUrl.hostname = 'www.facebook.com';\r\n            return parsedUrl.toString();\r\n        }\r\n\r\n        function detectUrlType(url) {\r\n            let parsedUrl;\r\n            try {\r\n                parsedUrl = new URL(normalizeFacebookUrl(url));\r\n            } catch (error) {\r\n                return 'unknown';\r\n            }\r\n\r\n            const pathParts = parsedUrl.pathname.split('\/').filter(Boolean);\r\n            const firstSegment = (pathParts[0] || '').toLowerCase();\r\n            const reservedSegments = new Set([\r\n                'watch',\r\n                'marketplace',\r\n                'events',\r\n                'gaming',\r\n                'messages',\r\n                'notifications',\r\n                'friends',\r\n                'reel',\r\n                'reels',\r\n                'stories'\r\n            ]);\r\n\r\n            if (firstSegment === 'groups') {\r\n                return 'group';\r\n            }\r\n\r\n            if (firstSegment === 'profile.php' && parsedUrl.searchParams.get('id')) {\r\n                return 'profile';\r\n            }\r\n\r\n            if (firstSegment === 'people' && pathParts.length >= 2) {\r\n                return 'profile';\r\n            }\r\n\r\n            if (firstSegment && !reservedSegments.has(firstSegment)) {\r\n                return 'profile';\r\n            }\r\n\r\n            return 'unknown';\r\n        }\r\n\r\n        function analyzeUrl(event) {\r\n            if (event) event.preventDefault();\r\n\r\n            const urlInput = document.getElementById('urlInput');\r\n            let url;\r\n\r\n            try {\r\n                url = normalizeFacebookUrl(urlInput.value);\r\n                urlInput.value = url;\r\n            } catch (error) {\r\n                currentUrl = '';\r\n                currentType = '';\r\n                showError(error.message);\r\n                return;\r\n            }\r\n\r\n            currentUrl = url;\r\n            currentType = detectUrlType(url);\r\n\r\n            \/\/ Clear previous data\r\n            clearAllData();\r\n\r\n            \/\/ Show loading\r\n            document.getElementById('loadingSection').style.display = 'block';\r\n            document.getElementById('groupContent').style.display = 'none';\r\n            document.getElementById('profileContent').style.display = 'none';\r\n            document.getElementById('errorMessage').style.display = 'none';\r\n\r\n            const analyzeBtn = document.getElementById('analyzeBtn');\r\n            analyzeBtn.disabled = true;\r\n            analyzeBtn.innerHTML = '<span>Analyzing...<\/span>';\r\n\r\n            if (currentType === 'group') {\r\n                fetchGroupData(url);\r\n            } else if (currentType === 'profile') {\r\n                currentUsername = extractUsernameFromUrl(url);\r\n                fetchProfileData(url);\r\n            } else {\r\n                showError('Please enter a valid Facebook group or profile URL');\r\n                hideLoading();\r\n            }\r\n        }\r\n\r\n        function clearAllData() {\r\n            \/\/ Reset group variables\r\n            currentGroupId = null;\r\n            allHDVideos = [];\r\n            videosLoaded = false;\r\n            reelsLoaded = false;\r\n\r\n            \/\/ Reset profile variables\r\n            profileData = null;\r\n            currentPhotoData = null;\r\n            currentUsername = '';\r\n\r\n            \/\/ Clear containers\r\n            document.getElementById('groupContent').innerHTML = '';\r\n            document.getElementById('profileContent').innerHTML = '';\r\n        }\r\n\r\n        function hideLoading() {\r\n            document.getElementById('loadingSection').style.display = 'none';\r\n            const analyzeBtn = document.getElementById('analyzeBtn');\r\n            analyzeBtn.disabled = false;\r\n            analyzeBtn.innerHTML = '<span>Analyze<\/span>';\r\n        }\r\n\r\n        function showError(message) {\r\n            const errorDiv = document.getElementById('errorMessage');\r\n            errorDiv.textContent = message;\r\n            errorDiv.style.display = 'block';\r\n            hideLoading();\r\n        }\r\n\r\n        \/\/ Group Functions\r\n        async function fetchGroupData(url) {\r\n            try {\r\n                const data = await fetchFacebookApi({ url });\r\n                const groupInfo = extractGroupInfo(data);\r\n                const allImages = extractAllImages(data);\r\n                const uniqueImages = getUniqueImages(allImages).filter(shouldKeepMediaItem);\r\n\r\n                displayGroupInfo({\r\n                    ...groupInfo,\r\n                    allImages: uniqueImages,\r\n                    totalImages: allImages.length\r\n                }, data);\r\n\r\n                hideLoading();\r\n                document.getElementById('groupContent').style.display = 'block';\r\n\r\n            } catch (error) {\r\n                console.error('Group fetch error:', error);\r\n                showError('Error fetching group data: ' + (error.userMessage || error.message));\r\n            }\r\n        }\r\n\r\n        function extractGroupInfo(data) {\r\n            const groupInfo = {\r\n                name: 'Unknown Group',\r\n                type: 'Unknown',\r\n                privacy: 'Unknown',\r\n                membersCount: 'Unknown',\r\n                description: 'No description available',\r\n                coverImage: '',\r\n                profileImage: ''\r\n            };\r\n\r\n            if (!data?.data?.data) {\r\n                return groupInfo;\r\n            }\r\n\r\n            for (const item of data.data.data) {\r\n                if (item.result?.data) {\r\n                    const resultData = item.result.data;\r\n\r\n                    if (resultData.group?.profile_header_renderer?.group) {\r\n                        const headerGroup = resultData.group.profile_header_renderer.group;\r\n\r\n                        if (headerGroup.featurable_title?.text) {\r\n                            groupInfo.name = headerGroup.featurable_title.text;\r\n                        } else if (headerGroup.name) {\r\n                            groupInfo.name = headerGroup.name;\r\n                        }\r\n\r\n                        if (headerGroup.group_member_profiles?.formatted_count_text) {\r\n                            groupInfo.membersCount = headerGroup.group_member_profiles.formatted_count_text;\r\n                        }\r\n\r\n                        \/\/ Use the new helper function to find the best cover image\r\n                        groupInfo.coverImage = findTopCoverImage(data);\r\n\r\n                        if (headerGroup.profile_picture?.uri) {\r\n                            groupInfo.profileImage = headerGroup.profile_picture.uri;\r\n                        }\r\n\r\n                        if (headerGroup.privacy_type) {\r\n                            groupInfo.privacy = headerGroup.privacy_type;\r\n                            groupInfo.type = headerGroup.privacy_type;\r\n                        }\r\n                    }\r\n\r\n                    if (resultData.group?.id) {\r\n                        currentGroupId = resultData.group.id;\r\n                    }\r\n                }\r\n            }\r\n\r\n            return groupInfo;\r\n        }\r\n\r\n        function extractAllImages(obj) {\r\n            const images = [];\r\n\r\n            if (!obj || typeof obj !== 'object') {\r\n                return images;\r\n            }\r\n\r\n            if (Array.isArray(obj)) {\r\n                obj.forEach(item => {\r\n                    images.push(...extractAllImages(item));\r\n                });\r\n                return images;\r\n            }\r\n\r\n            for (const [key, value] of Object.entries(obj)) {\r\n                if (key === 'prefetch_uris_v2' && Array.isArray(value)) {\r\n                    value.forEach(uriObj => {\r\n                        const image = createImageRecord(uriObj?.uri, uriObj?.width, uriObj?.height, 'prefetch');\r\n                        if (image) {\r\n                            images.push(image);\r\n                        }\r\n                    });\r\n                } else if (key === 'image' && value?.uri) {\r\n                    const image = createImageRecord(value.uri, value.width, value.height, 'image');\r\n                    if (image) {\r\n                        images.push(image);\r\n                    }\r\n                } else if (key === 'uri' && typeof value === 'string') {\r\n                    const image = createImageRecord(value, obj.width, obj.height, 'direct');\r\n                    if (image) {\r\n                        images.push(image);\r\n                    }\r\n                } else {\r\n                    images.push(...extractAllImages(value));\r\n                }\r\n            }\r\n\r\n            return images;\r\n        }\r\n\r\n        function createImageRecord(uri, width = 0, height = 0, type = 'image') {\r\n            const normalizedUri = normalizeImageUri(uri);\r\n            if (!isLikelyFacebookMediaUrl(normalizedUri)) {\r\n                return null;\r\n            }\r\n\r\n            const resolution = extractResolution(normalizedUri);\r\n            const finalWidth = Number(width) || resolution?.width || 0;\r\n            const finalHeight = Number(height) || resolution?.height || 0;\r\n\r\n            return {\r\n                uri: normalizedUri,\r\n                type,\r\n                width: finalWidth,\r\n                height: finalHeight,\r\n                resolution,\r\n                quality: getQualityScore(normalizedUri, finalWidth, finalHeight)\r\n            };\r\n        }\r\n\r\n        function normalizeImageUri(uri) {\r\n            return typeof uri === 'string' ? uri.trim() : '';\r\n        }\r\n\r\n        function isLikelyFacebookMediaUrl(uri) {\r\n            try {\r\n                const url = new URL(uri);\r\n                const host = url.hostname.toLowerCase();\r\n                const pathname = url.pathname.toLowerCase();\r\n                const isFacebookMediaHost = host.includes('fbcdn.net') || host.startsWith('scontent.');\r\n                const isStaticAsset = host.startsWith('static.') || pathname.includes('\/rsrc.php');\r\n                return isFacebookMediaHost && !isStaticAsset;\r\n            } catch (error) {\r\n                return false;\r\n            }\r\n        }\r\n\r\n        function extractResolution(url) {\r\n            try {\r\n                const urlObj = new URL(url);\r\n                const candidates = [urlObj.searchParams.get('stp') || '', urlObj.pathname, urlObj.href];\r\n                const patterns = [\r\n                    \/(?:^|[_\/?&-])[sp](\\d+)x(\\d+)(?:$|[_?&-])\/i,\r\n                    \/(\\d+)x(\\d+)\/i\r\n                ];\r\n\r\n                for (const candidate of candidates) {\r\n                    for (const pattern of patterns) {\r\n                        const match = candidate.match(pattern);\r\n                        if (!match) continue;\r\n\r\n                        const width = parseInt(match[1], 10);\r\n                        const height = parseInt(match[2], 10);\r\n\r\n                        if (Number.isFinite(width) && Number.isFinite(height)) {\r\n                            return {\r\n                                width,\r\n                                height,\r\n                                total: width * height\r\n                            };\r\n                        }\r\n                    }\r\n                }\r\n                return null;\r\n            } catch (error) {\r\n                return null;\r\n            }\r\n        }\r\n\r\n        function getQualityScore(url, width = 0, height = 0) {\r\n            let score = 0;\r\n\r\n            const totalPixels = width * height;\r\n            score += Math.min(totalPixels \/ 1000000, 10);\r\n\r\n            if (url.includes('_n.jpg') || url.includes('_n.png')) score += 5;\r\n            if (url.includes('dst-jpg') || url.includes('dst-png')) score += 3;\r\n            if (!url.includes('s280x280') && !url.includes('s320x320')) score += 2;\r\n            if (url.includes('s640x640') || url.includes('s1080x1080') || url.includes('p960x960')) score += 4;\r\n            if (url.includes('_o.jpg') || url.includes('_o.png')) score += 8;\r\n\r\n            if (url.includes('s80x80') || url.includes('s74x74')) score -= 5;\r\n            if (url.includes('tt6')) score -= 1;\r\n\r\n            return Math.max(score, 0);\r\n        }\r\n\r\n        function getUniqueImages(allImages) {\r\n            const uniqueImages = [];\r\n            const seenUris = new Set();\r\n\r\n            allImages.forEach(img => {\r\n                const normalizedUri = normalizeImageUri(img.uri);\r\n                if (!normalizedUri || seenUris.has(normalizedUri)) {\r\n                    return;\r\n                }\r\n\r\n                seenUris.add(normalizedUri);\r\n                uniqueImages.push({\r\n                    ...img,\r\n                    uri: normalizedUri\r\n                });\r\n            });\r\n\r\n            return uniqueImages.sort(sortImagesByQuality);\r\n        }\r\n\r\n        function sortImagesByQuality(a, b) {\r\n            const qualityDifference = (b.quality || 0) - (a.quality || 0);\r\n            if (qualityDifference !== 0) {\r\n                return qualityDifference;\r\n            }\r\n\r\n            return ((b.width || 0) * (b.height || 0)) - ((a.width || 0) * (a.height || 0));\r\n        }\r\n\r\n        function shouldKeepMediaItem(media) {\r\n            const hasKnownSize = media.width > 0 && media.height > 0;\r\n            if (!hasKnownSize) {\r\n                return true;\r\n            }\r\n\r\n            return media.width > MIN_MEDIA_DIMENSION && media.height > MIN_MEDIA_DIMENSION;\r\n        }\r\n\r\n        function formatMediaDimensions(width, height) {\r\n            if (width > 0 && height > 0) {\r\n                return `${width}\u00d7${height}`;\r\n            }\r\n\r\n            return 'Unknown size';\r\n        }\r\n\r\n        function displayGroupInfo(groupInfo, apiData) {\r\n            const groupContent = document.getElementById('groupContent');\r\n            const {\r\n                name, type, privacy, membersCount, description,\r\n                coverImage, allImages, totalImages\r\n            } = groupInfo;\r\n\r\n            const html = `\r\n            <div class=\"fb-group-header\">\r\n                <div class=\"fb-group-cover\">\r\n                    ${coverImage ? `<img decoding=\"async\" src=\"${escapeHtml(coverImage)}\" alt=\"${escapeHtml(name)}\" onerror=\"this.style.display='none';\">` : ''}\r\n                    <div class=\"fb-group-cover-overlay\"><\/div>\r\n                    <div class=\"fb-group-info-overlay\">\r\n                        <h1 class=\"fb-group-title\">${escapeHtml(name)}<\/h1>\r\n                        <p class=\"fb-group-subtitle\">${escapeHtml(membersCount)} members \u2022 ${escapeHtml(type)}<\/p>\r\n                    <\/div>\r\n                <\/div>\r\n                <div class=\"fb-group-details\">\r\n                    <div class=\"fb-stats-grid\">\r\n                        <div class=\"fb-stat-card\" style=\"--delay: 1\">\r\n                            <div class=\"fb-stat-icon\">\ud83d\udc65<\/div>\r\n                            <span class=\"fb-stat-number\">${escapeHtml(membersCount)}<\/span>\r\n                            <span class=\"fb-stat-label\">Members<\/span>\r\n                        <\/div>\r\n                        <div class=\"fb-stat-card\" style=\"--delay: 2\">\r\n                            <div class=\"fb-stat-icon\">\ud83d\udd12<\/div>\r\n                            <span class=\"fb-stat-number\">${escapeHtml(type)}<\/span>\r\n                            <span class=\"fb-stat-label\">Privacy<\/span>\r\n                        <\/div>\r\n                        <div class=\"fb-stat-card\" style=\"--delay: 3\">\r\n                            <div class=\"fb-stat-icon\">\ud83d\udcf7<\/div>\r\n                            <span class=\"fb-stat-number\">${allImages.length}<\/span>\r\n                            <span class=\"fb-stat-label\">Images<\/span>\r\n                        <\/div>\r\n                        <div class=\"fb-stat-card\" style=\"--delay: 4\">\r\n                            <div class=\"fb-stat-icon\">\u2b50<\/div>\r\n                            <span class=\"fb-stat-number\">${allImages.filter(img => img.quality > 5).length}<\/span>\r\n                            <span class=\"fb-stat-label\">High Quality<\/span>\r\n                        <\/div>\r\n                    <\/div>\r\n                    <div class=\"fb-group-description\">\r\n                        ${escapeHtml(description)}\r\n                    <\/div>\r\n                    <a href=\"${escapeHtml(currentUrl)}\" target=\"_blank\" class=\"fb-visit-btn\">\r\n                        <span>Visit Group<\/span>\r\n                        <span>\u2192<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <nav class=\"fb-nav-tabs\">\r\n                <div class=\"fb-tab-list\">\r\n                    <button class=\"fb-tab-btn active\" onclick=\"switchTab('photos')\">\r\n                        \ud83d\udcf7 Photos (${allImages.length})\r\n                    <\/button>\r\n                    <button class=\"fb-tab-btn\" onclick=\"switchTab('videos')\">\r\n                        \ud83c\udfa5 Videos\r\n                    <\/button>\r\n                    \r\n                <\/div>\r\n\r\n                <div id=\"photosTab\" class=\"fb-tab-content active\">\r\n                    ${allImages.length > 0 ? `\r\n                        <div class=\"fb-media-summary\">\r\n                            <h2 class=\"fb-summary-title\">Photo Collection<\/h2>\r\n                            <p class=\"fb-summary-description\">Discovered ${allImages.length} images from this group<\/p>\r\n                            <div class=\"fb-summary-stats\">\r\n                                <div class=\"fb-summary-stat\">\r\n                                    <span class=\"fb-summary-stat-number\">${allImages.length}<\/span>\r\n                                    <span class=\"fb-summary-stat-label\">Total Images<\/span>\r\n                                <\/div>\r\n                                <div class=\"fb-summary-stat\">\r\n                                    <span class=\"fb-summary-stat-number\">${allImages.filter(img => img.quality > 7).length}<\/span>\r\n                                    <span class=\"fb-summary-stat-label\">High Quality<\/span>\r\n                                <\/div>\r\n                                <div class=\"fb-summary-stat\">\r\n                                    <span class=\"fb-summary-stat-number\">${Math.round(allImages.reduce((sum, img) => sum + img.quality, 0) \/ allImages.length)}<\/span>\r\n                                    <span class=\"fb-summary-stat-label\">Avg Quality<\/span>\r\n                                <\/div>\r\n                                <div class=\"fb-summary-stat\">\r\n                                    <span class=\"fb-summary-stat-number\">${allImages.filter(img => img.width > 1000).length}<\/span>\r\n                                    <span class=\"fb-summary-stat-label\">HD Images<\/span>\r\n                                <\/div>\r\n                            <\/div>\r\n                        <\/div>\r\n                        <div class=\"fb-media-grid\">\r\n                            ${allImages.map((img, index) => `\r\n                                <div class=\"fb-media-card\" style=\"--index: ${index}\">\r\n                                    <div class=\"fb-media-image-container\">\r\n                                        <img decoding=\"async\" src=\"${escapeHtml(img.uri)}\" alt=\"Group media ${index + 1}\" class=\"fb-media-image\" onerror=\"this.parentElement.style.display='none'\">\r\n                                        <div class=\"fb-media-hover-overlay\">\r\n                                            <div class=\"fb-quality-indicator\">\r\n                                                Quality Score: ${img.quality.toFixed(1)}\/10\r\n                                            <\/div>\r\n                                            <div class=\"fb-download-actions\">\r\n                                                <button class=\"fb-download-btn\" onclick=\"downloadImage('${escapeHtml(img.uri)}', 'image-${index + 1}.jpg', this)\">\r\n                                                    <span class=\"fb-btn-icon\">\ud83d\udcbe<\/span>\r\n                                                    <span>Download<\/span>\r\n                                                <\/button>\r\n                                            <\/div>\r\n                                        <\/div>\r\n                                    <\/div>\r\n                                    <div class=\"fb-media-info\">\r\n                                        <div class=\"fb-media-meta\">\r\n                                            <span class=\"fb-resolution-badge\">${formatMediaDimensions(img.width, img.height)}<\/span>\r\n                                            <span class=\"fb-type-badge\">${img.type}<\/span>\r\n                                        <\/div>\r\n                                    <\/div>\r\n                                <\/div>\r\n                            `).join('')}\r\n                        <\/div>\r\n                    ` : `\r\n                        <div class=\"fb-empty-state\">\r\n                            <div class=\"fb-empty-icon\">\ud83d\udcf7<\/div>\r\n                            <h3>No Photos Found<\/h3>\r\n                            <p>This group doesn't have any accessible photos or the content is private.<\/p>\r\n                        <\/div>\r\n                    `}\r\n                <\/div>\r\n\r\n                <div id=\"videosTab\" class=\"fb-tab-content\">\r\n                    <div id=\"videosLoading\" class=\"fb-loading\" style=\"display: none;\">\r\n                        <div class=\"fb-loading-spinner\"><\/div>\r\n                        <div class=\"fb-loading-text\">Loading videos...<\/div>\r\n                    <\/div>\r\n                    <div id=\"videosError\" class=\"fb-error-message\" style=\"display: none;\"><\/div>\r\n                    <div id=\"videosContent\">\r\n                        <div class=\"fb-empty-state\">\r\n                            <div class=\"fb-empty-icon\">\ud83c\udfa5<\/div>\r\n                            <h3>Videos<\/h3>\r\n                            <p>Click here to load videos from this group.<\/p>\r\n                        <\/div>\r\n                    <\/div>\r\n                    <div id=\"videosSkeleton\" class=\"fb-videos-skeleton\">\r\n                        <div class=\"fb-videos-grid-skeleton\">\r\n                            <div class=\"fb-video-skeleton\">\r\n                                <div class=\"fb-video-thumbnail-skeleton fb-skeleton-loading\"><\/div>\r\n                                <div class=\"fb-video-info-skeleton\">\r\n                                    <div class=\"fb-skeleton-line fb-skeleton-loading\"><\/div>\r\n                                    <div class=\"fb-skeleton-line short fb-skeleton-loading\"><\/div>\r\n                                <\/div>\r\n                            <\/div>\r\n                            <div class=\"fb-video-skeleton\">\r\n                                <div class=\"fb-video-thumbnail-skeleton fb-skeleton-loading\"><\/div>\r\n                                <div class=\"fb-video-info-skeleton\">\r\n                                    <div class=\"fb-skeleton-line fb-skeleton-loading\"><\/div>\r\n                                    <div class=\"fb-skeleton-line short fb-skeleton-loading\"><\/div>\r\n                                <\/div>\r\n                            <\/div>\r\n                            <div class=\"fb-video-skeleton\">\r\n                                <div class=\"fb-video-thumbnail-skeleton fb-skeleton-loading\"><\/div>\r\n                                <div class=\"fb-video-info-skeleton\">\r\n                                    <div class=\"fb-skeleton-line fb-skeleton-loading\"><\/div>\r\n                                    <div class=\"fb-skeleton-line short fb-skeleton-loading\"><\/div>\r\n                                <\/div>\r\n                            <\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/nav>\r\n        `;\r\n\r\n            groupContent.innerHTML = html;\r\n        }\r\n\r\n        \/\/ Profile Functions\r\n        function extractUsernameFromUrl(url) {\r\n            try {\r\n                const parsedUrl = new URL(normalizeFacebookUrl(url));\r\n                const pathParts = parsedUrl.pathname.split('\/').filter(Boolean);\r\n\r\n                \/\/ Handle profile.php?id= format\r\n                if ((pathParts[0] || '').toLowerCase() === 'profile.php') {\r\n                    return parsedUrl.searchParams.get('id') || '';\r\n                }\r\n\r\n                \/\/ Handle people\/ format\r\n                if ((pathParts[0] || '').toLowerCase() === 'people') {\r\n                    return pathParts[2] || pathParts[1] || '';\r\n                }\r\n\r\n                \/\/ Handle regular username format\r\n                return pathParts[0] || '';\r\n            } catch (error) {\r\n                console.error('Error extracting username:', error);\r\n                return '';\r\n            }\r\n        }\r\n\r\n        async function fetchProfileData(url) {\r\n            try {\r\n                const data = await fetchFacebookApi({ url });\r\n                processProfileData(data.data);\r\n            } catch (error) {\r\n                console.error('Profile fetch error:', error);\r\n                showError('Error fetching profile data: ' + (error.userMessage || error.message));\r\n            }\r\n        }\r\n\r\n        function processProfileData(data) {\r\n            try {\r\n                profileData = parseProfileData(data);\r\n                displayProfileData(profileData);\r\n                hideLoading();\r\n                document.getElementById('profileContent').style.display = 'block';\r\n            } catch (error) {\r\n                showError('Error processing profile data: ' + error.message);\r\n                console.error('Processing Error:', error);\r\n            }\r\n        }\r\n\r\n        function parseProfileData(data) {\r\n            const profileData = {\r\n                basicInfo: extractBasicProfileInfo(data),\r\n                aboutInfo: extractAboutInfo(data),\r\n                photos: extractProfilePhotos(data),\r\n                posts: extractPosts(data),\r\n                videos: extractVideos(data),\r\n                reels: extractReels(data)\r\n            };\r\n\r\n            return profileData;\r\n        }\r\n\r\n        function extractBasicProfileInfo(data) {\r\n            const basicInfo = {\r\n                name: '',\r\n                profilePicture: '',\r\n                coverPhoto: '',\r\n                stats: [],\r\n                isVerified: false\r\n            };\r\n\r\n            try {\r\n                \/\/ Find user data in the response\r\n                for (const item of data.data) {\r\n\r\n                    \/\/ Look for user profile header data\r\n                    if (item.result &&\r\n                        item.result.data &&\r\n                        item.result.data.user &&\r\n                        item.result.data.user.profile_header_renderer &&\r\n                        item.result.data.user.profile_header_renderer.user) {\r\n\r\n                        const userData = item.result.data.user.profile_header_renderer.user;\r\n\r\n                        \/\/ Extract name\r\n                        basicInfo.name = userData.name || 'Unknown Name';\r\n\r\n                        \/\/ Check if verified\r\n                        basicInfo.isVerified = userData.show_verified_badge_on_profile || false;\r\n\r\n                        \/\/ Extract profile picture\r\n                        if (userData.profilePicLarge && userData.profilePicLarge.uri) {\r\n                            basicInfo.profilePicture = userData.profilePicLarge.uri;\r\n                        }\r\n\r\n                        \/\/ Extract cover photo\r\n                        if (userData.cover_photo && userData.cover_photo.photo && userData.cover_photo.photo.image) {\r\n                            basicInfo.coverPhoto = userData.cover_photo.photo.image.uri;\r\n                        }\r\n\r\n                        \/\/ Extract stats (followers, following, etc.)\r\n                        if (userData.profile_social_context && userData.profile_social_context.content) {\r\n                            userData.profile_social_context.content.forEach(item => {\r\n                                if (item.text && item.text.text) {\r\n                                    basicInfo.stats.push(item.text.text);\r\n                                }\r\n                            });\r\n                        }\r\n\r\n                        break;\r\n                    }\r\n                }\r\n            } catch (error) {\r\n                console.error('Error extracting basic info:', error);\r\n            }\r\n\r\n\r\n            return basicInfo;\r\n        }\r\n\r\n        function extractAboutInfo(data) {\r\n            const aboutInfo = {\r\n                bio: '',\r\n                work: [],\r\n                education: [],\r\n                places: [],\r\n                contact: [],\r\n                basic: []\r\n            };\r\n\r\n            try {\r\n                function searchForAboutData(obj) {\r\n                    if (!obj || typeof obj !== 'object') return;\r\n\r\n                    \/\/ Look for bio\/description\r\n                    if (obj.bio && typeof obj.bio === 'string') {\r\n                        aboutInfo.bio = obj.bio;\r\n                    }\r\n\r\n                    \/\/ Look for work information\r\n                    if (obj.work && Array.isArray(obj.work)) {\r\n                        aboutInfo.work = obj.work;\r\n                    } else if (obj.employer && obj.position) {\r\n                        aboutInfo.work.push({\r\n                            employer: obj.employer,\r\n                            position: obj.position\r\n                        });\r\n                    }\r\n\r\n                    \/\/ Look for education\r\n                    if (obj.education && Array.isArray(obj.education)) {\r\n                        aboutInfo.education = obj.education;\r\n                    } else if (obj.school) {\r\n                        aboutInfo.education.push({\r\n                            school: obj.school,\r\n                            type: obj.type || 'Education'\r\n                        });\r\n                    }\r\n\r\n                    \/\/ Recursively search\r\n                    for (const key in obj) {\r\n                        if (typeof obj[key] === 'object') {\r\n                            searchForAboutData(obj[key]);\r\n                        }\r\n                    }\r\n                }\r\n\r\n                searchForAboutData(data);\r\n\r\n            } catch (error) {\r\n                console.error('Error extracting about info:', error);\r\n            }\r\n\r\n            return aboutInfo;\r\n        }\r\n\r\n        function extractProfilePhotos(data) {\r\n            const photos = [];\r\n            const seenUrls = new Set();\r\n\r\n            function pushPhoto(candidate) {\r\n                const image = createImageRecord(\r\n                    candidate?.url || candidate?.uri,\r\n                    candidate?.width,\r\n                    candidate?.height,\r\n                    candidate?.type || 'photo'\r\n                );\r\n\r\n                if (!image || !shouldKeepMediaItem(image) || seenUrls.has(image.uri)) {\r\n                    return;\r\n                }\r\n\r\n                seenUrls.add(image.uri);\r\n                photos.push({\r\n                    id: candidate?.id || `photo-${photos.length}`,\r\n                    url: image.uri,\r\n                    width: image.width || 0,\r\n                    height: image.height || 0,\r\n                    likes: Number(candidate?.likes) || 0,\r\n                    comments: Number(candidate?.comments) || 0,\r\n                    created_time: candidate?.created_time || new Date().toISOString(),\r\n                    quality: image.quality || 0\r\n                });\r\n            }\r\n\r\n            try {\r\n                const allImages = getUniqueImages(extractAllImages(data)).filter(shouldKeepMediaItem);\r\n\r\n                allImages.forEach((img, index) => {\r\n                    pushPhoto({\r\n                        id: `photo-${index}`,\r\n                        url: img.uri,\r\n                        width: img.width,\r\n                        height: img.height,\r\n                        quality: img.quality\r\n                    });\r\n                });\r\n\r\n                function searchForPhotos(obj) {\r\n                    if (!obj || typeof obj !== 'object') return;\r\n\r\n                    if (obj.photos && Array.isArray(obj.photos)) {\r\n                        obj.photos.forEach(photo => {\r\n                            if (photo.image && photo.image.uri) {\r\n                                pushPhoto({\r\n                                    id: photo.id || Math.random().toString(36),\r\n                                    url: photo.image.uri,\r\n                                    width: photo.image.width || 0,\r\n                                    height: photo.image.height || 0,\r\n                                    likes: photo.feedback ? photo.feedback.like_count : 0,\r\n                                    comments: photo.feedback ? photo.feedback.comment_count : 0,\r\n                                    created_time: photo.created_time || new Date().toISOString()\r\n                                });\r\n                            }\r\n                        });\r\n                    }\r\n\r\n                    \/\/ Look for media in posts\r\n                    if (obj.attachments && Array.isArray(obj.attachments)) {\r\n                        obj.attachments.forEach(attachment => {\r\n                            if (attachment.media && attachment.media.image) {\r\n                                pushPhoto({\r\n                                    id: Math.random().toString(36),\r\n                                    url: attachment.media.image.src || attachment.media.image.uri,\r\n                                    width: attachment.media.image.width || 0,\r\n                                    height: attachment.media.image.height || 0,\r\n                                    likes: 0,\r\n                                    comments: 0,\r\n                                    created_time: new Date().toISOString()\r\n                                });\r\n                            }\r\n                        });\r\n                    }\r\n\r\n                    \/\/ Recursively search\r\n                    for (const key in obj) {\r\n                        if (typeof obj[key] === 'object') {\r\n                            searchForPhotos(obj[key]);\r\n                        }\r\n                    }\r\n                }\r\n\r\n                searchForPhotos(data);\r\n\r\n            } catch (error) {\r\n                console.error('Error extracting profile photos:', error);\r\n            }\r\n\r\n            return photos\r\n                .sort((a, b) => (b.quality || 0) - (a.quality || 0))\r\n                .slice(0, 50);\r\n        }\r\n\r\n        function extractPosts(data) {\r\n            const posts = [];\r\n\r\n            try {\r\n                \/\/ Find posts data in the response\r\n                for (const item of data.data) {\r\n                    \/\/ Look for timeline feed data\r\n                    if (item.result &&\r\n                        item.result.data &&\r\n                        item.result.data.user &&\r\n                        item.result.data.user.timeline_list_feed_units &&\r\n                        item.result.data.user.timeline_list_feed_units.edges) {\r\n\r\n                        const edges = item.result.data.user.timeline_list_feed_units.edges;\r\n\r\n                        \/\/ Process each edge\r\n                        edges.forEach(edge => {\r\n                            if (edge.node &&\r\n                                edge.node.__typename === \"Story\" &&\r\n                                edge.node.comet_sections &&\r\n                                edge.node.comet_sections.content &&\r\n                                edge.node.comet_sections.content.story) {\r\n\r\n                                const story = edge.node.comet_sections.content.story;\r\n\r\n                                \/\/ Extract post data\r\n                                const post = {\r\n                                    id: edge.node.post_id || edge.node.id || '',\r\n                                    author: {\r\n                                        name: '',\r\n                                        profilePicture: ''\r\n                                    },\r\n                                    creationTime: 0,\r\n                                    message: '',\r\n                                    attachments: [],\r\n                                    stats: {\r\n                                        likes: 0,\r\n                                        comments: 0,\r\n                                        shares: 0\r\n                                    }\r\n                                };\r\n\r\n                                \/\/ Extract creation time\r\n                                if (edge.node.comet_sections.context_layout &&\r\n                                    edge.node.comet_sections.context_layout.story) {\r\n                                    post.creationTime = edge.node.comet_sections.context_layout.story.creation_time || 0;\r\n                                }\r\n\r\n                                \/\/ Extract message\r\n                                if (story.message && story.message.text) {\r\n                                    post.message = story.message.text;\r\n                                }\r\n\r\n                                \/\/ Extract author info\r\n                                if (story.actors && story.actors.length > 0) {\r\n                                    post.author.name = story.actors[0].name || '';\r\n\r\n                                    \/\/ Look for profile picture in different locations\r\n                                    if (story.actors[0].profile_picture) {\r\n                                        post.author.profilePicture = story.actors[0].profile_picture.uri;\r\n                                    } else if (edge.node.comet_sections.context_layout &&\r\n                                        edge.node.comet_sections.context_layout.story &&\r\n                                        edge.node.comet_sections.context_layout.story.comet_sections &&\r\n                                        edge.node.comet_sections.context_layout.story.comet_sections.actor_photo) {\r\n                                        const actorPhoto = edge.node.comet_sections.context_layout.story.comet_sections.actor_photo;\r\n                                        if (actorPhoto.story && actorPhoto.story.actors && actorPhoto.story.actors[0] && actorPhoto.story.actors[0].profile_picture) {\r\n                                            post.author.profilePicture = actorPhoto.story.actors[0].profile_picture.uri;\r\n                                        }\r\n                                    }\r\n                                }\r\n\r\n                                \/\/ Extract attachments\r\n                                if (story.attachments && story.attachments.length > 0) {\r\n                                    story.attachments.forEach(attachment => {\r\n                                        if (attachment.styles &&\r\n                                            attachment.styles.attachment &&\r\n                                            attachment.styles.attachment.media) {\r\n\r\n                                            const media = attachment.styles.attachment.media;\r\n\r\n                                            if (media.__typename === 'Photo' && media.image) {\r\n                                                post.attachments.push({\r\n                                                    type: 'photo',\r\n                                                    uri: media.image.uri,\r\n                                                    width: media.image.width || 0,\r\n                                                    height: media.image.height || 0\r\n                                                });\r\n                                            } else if (media.__typename === 'Video' && media.thumbnailImage) {\r\n                                                post.attachments.push({\r\n                                                    type: 'video',\r\n                                                    thumbnailUri: media.thumbnailImage.uri,\r\n                                                    width: media.width || 0,\r\n                                                    height: media.height || 0,\r\n                                                    duration: media.playable_duration_in_ms || 0\r\n                                                });\r\n                                            }\r\n                                        }\r\n                                    });\r\n                                }\r\n\r\n                                \/\/ Extract stats\r\n                                if (story.feedback &&\r\n                                    story.feedback.story_ufi_container &&\r\n                                    story.feedback.story_ufi_container.feedback) {\r\n\r\n                                    const feedback = story.feedback.story_ufi_container.feedback;\r\n\r\n                                    \/\/ Likes\r\n                                    if (feedback.reaction_count && feedback.reaction_count.count) {\r\n                                        post.stats.likes = feedback.reaction_count.count;\r\n                                    } else if (feedback.i18n_reaction_count) {\r\n                                        \/\/ Try to parse from i18n format (e.g., \"19K\")\r\n                                        const match = feedback.i18n_reaction_count.match(\/(\\d+)([KM])?\/);\r\n                                        if (match) {\r\n                                            let count = parseInt(match[1]);\r\n                                            if (match[2] === 'K') count *= 1000;\r\n                                            if (match[2] === 'M') count *= 1000000;\r\n                                            post.stats.likes = count;\r\n                                        }\r\n                                    }\r\n\r\n                                    \/\/ Comments\r\n                                    if (feedback.comment_rendering_instance &&\r\n                                        feedback.comment_rendering_instance.comments &&\r\n                                        feedback.comment_rendering_instance.comments.total_count) {\r\n\r\n                                        post.stats.comments = feedback.comment_rendering_instance.comments.total_count;\r\n                                    }\r\n\r\n                                    \/\/ Shares\r\n                                    if (feedback.share_count && feedback.share_count.count) {\r\n                                        post.stats.shares = feedback.share_count.count;\r\n                                    } else if (feedback.i18n_share_count) {\r\n                                        \/\/ Try to parse from i18n format (e.g., \"2.8K\")\r\n                                        const match = feedback.i18n_share_count.match(\/(\\d+(\\.\\d+)?)([KM])?\/);\r\n                                        if (match) {\r\n                                            let count = parseFloat(match[1]);\r\n                                            if (match[3] === 'K') count *= 1000;\r\n                                            if (match[3] === 'M') count *= 1000000;\r\n                                            post.stats.shares = Math.round(count);\r\n                                        }\r\n                                    }\r\n                                }\r\n\r\n                                posts.push(post);\r\n                            }\r\n                        });\r\n                    }\r\n                }\r\n            } catch (error) {\r\n                console.error('Error extracting posts:', error);\r\n            }\r\n\r\n            return posts;\r\n        }\r\n\r\n        \/\/ Function to extract videos (from profile data - legacy)\r\n        function extractVideos(data) {\r\n            const videos = [];\r\n\r\n            try {\r\n                \/\/ Look for videos in timeline feed units\r\n                for (const item of data.data) {\r\n                    if (item.result &&\r\n                        item.result.data &&\r\n                        item.result.data.user &&\r\n                        item.result.data.user.timeline_list_feed_units &&\r\n                        item.result.data.user.timeline_list_feed_units.edges) {\r\n\r\n                        const edges = item.result.data.user.timeline_list_feed_units.edges;\r\n\r\n                        edges.forEach(edge => {\r\n                            if (edge.node &&\r\n                                edge.node.__typename === \"Story\" &&\r\n                                edge.node.comet_sections &&\r\n                                edge.node.comet_sections.content &&\r\n                                edge.node.comet_sections.content.story &&\r\n                                edge.node.comet_sections.content.story.attachments) {\r\n\r\n                                const story = edge.node.comet_sections.content.story;\r\n\r\n                                story.attachments.forEach(attachment => {\r\n                                    if (attachment.styles &&\r\n                                        attachment.styles.attachment &&\r\n                                        attachment.styles.attachment.media &&\r\n                                        attachment.styles.attachment.media.__typename === 'Video') {\r\n\r\n                                        const media = attachment.styles.attachment.media;\r\n\r\n                                        \/\/ Skip reels for the videos section\r\n                                        if (media.is_huddle ||\r\n                                            media.is_soundbites_video ||\r\n                                            media.is_looping ||\r\n                                            (story.message &&\r\n                                                story.message.text &&\r\n                                                story.message.text.toLowerCase().includes('reel'))) {\r\n                                            return;\r\n                                        }\r\n\r\n                                        \/\/ Get thumbnail\r\n                                        let thumbnailUri = '';\r\n                                        if (media.thumbnailImage) {\r\n                                            thumbnailUri = media.thumbnailImage.uri;\r\n                                        } else if (media.preferred_thumbnail && media.preferred_thumbnail.image) {\r\n                                            thumbnailUri = media.preferred_thumbnail.image.uri;\r\n                                        }\r\n\r\n                                        \/\/ Get playable URL from media object\r\n                                        let videoUrl = media.playable_url || '';\r\n\r\n                                        \/\/ Get creation time\r\n                                        let creationTime = 0;\r\n                                        if (story.creation_time) {\r\n                                            creationTime = story.creation_time;\r\n                                        } else if (edge.node.comet_sections.context_layout &&\r\n                                            edge.node.comet_sections.context_layout.story) {\r\n                                            creationTime = edge.node.comet_sections.context_layout.story.creation_time || 0;\r\n                                        } else if (media.publish_time) {\r\n                                            creationTime = media.publish_time;\r\n                                        }\r\n\r\n                                        \/\/ Get title\r\n                                        let title = 'Video';\r\n                                        if (story.message && story.message.text) {\r\n                                            const lines = story.message.text.split('\\n');\r\n                                            title = lines[0].trim();\r\n                                        }\r\n\r\n                                        \/\/ Get stats\r\n                                        let likes = 0;\r\n                                        let views = 0;\r\n\r\n                                        if (story.feedback &&\r\n                                            story.feedback.story_ufi_container &&\r\n                                            story.feedback.story_ufi_container.feedback) {\r\n\r\n                                            const feedback = story.feedback.story_ufi_container.feedback;\r\n\r\n                                            \/\/ Likes\r\n                                            if (feedback.reaction_count && feedback.reaction_count.count) {\r\n                                                likes = feedback.reaction_count.count;\r\n                                            } else if (feedback.i18n_reaction_count) {\r\n                                                \/\/ Try to parse from i18n format (e.g., \"19K\")\r\n                                                const match = feedback.i18n_reaction_count.match(\/(\\d+)([KM])?\/);\r\n                                                if (match) {\r\n                                                    let count = parseInt(match[1]);\r\n                                                    if (match[2] === 'K') count *= 1000;\r\n                                                    if (match[2] === 'M') count *= 1000000;\r\n                                                    likes = count;\r\n                                                }\r\n                                            }\r\n\r\n                                            \/\/ Views\r\n                                            if (feedback.video_view_count) {\r\n                                                views = feedback.video_view_count;\r\n                                            }\r\n                                        }\r\n\r\n                                        \/\/ If we have video view count directly on the media\r\n                                        if (media.video_view_count) {\r\n                                            views = media.video_view_count;\r\n                                        }\r\n\r\n                                        videos.push({\r\n                                            id: media.id || edge.node.post_id || edge.node.id || '',\r\n                                            title: title,\r\n                                            description: story.message && story.message.text ? story.message.text : '',\r\n                                            thumbnailUri: thumbnailUri,\r\n                                            videoUrl: videoUrl,\r\n                                            width: media.width || 0,\r\n                                            height: media.height || 0,\r\n                                            duration: media.playable_duration_in_ms || 0,\r\n                                            creationTime: creationTime,\r\n                                            stats: {\r\n                                                likes: likes,\r\n                                                views: views\r\n                                            }\r\n                                        });\r\n                                    }\r\n                                });\r\n                            }\r\n                        });\r\n                    }\r\n                }\r\n\r\n            } catch (error) {\r\n                console.error('Error extracting videos:', error);\r\n            }\r\n\r\n            return videos;\r\n        }\r\n\r\n        \/\/ Enhanced function to extract videos from API response\r\n        function extractVideosFromAPI(data) {\r\n            const videos = [];\r\n\r\n            try {\r\n                console.log('Full API response for videos:', data);\r\n\r\n                if (data && data.data && Array.isArray(data.data)) {\r\n                    for (const item of data.data) {\r\n                        \/\/ Check for latest_videos structure\r\n                        if (item.result &&\r\n                            item.result.data &&\r\n                            item.result.data.latest_videos &&\r\n                            item.result.data.latest_videos.edges) {\r\n\r\n                            const edges = item.result.data.latest_videos.edges;\r\n                            console.log('Found latest_videos edges:', edges);\r\n\r\n                            edges.forEach(edge => {\r\n                                if (edge.node) {\r\n                                    const videoNode = edge.node;\r\n\r\n                                    \/\/ Extract basic video info\r\n                                    const videoData = {\r\n                                        id: videoNode.id || '',\r\n                                        title: 'Video',\r\n                                        description: '',\r\n                                        thumbnailUri: '',\r\n                                        videoUrl: '',\r\n                                        width: 0,\r\n                                        height: 0,\r\n                                        duration: 0,\r\n                                        creationTime: videoNode.publish_time || 0,\r\n                                        stats: {\r\n                                            likes: 0,\r\n                                            views: videoNode.play_count || 0\r\n                                        }\r\n                                    };\r\n\r\n                                    \/\/ Extract thumbnail\r\n                                    if (videoNode.image && videoNode.image.uri) {\r\n                                        videoData.thumbnailUri = videoNode.image.uri;\r\n                                    }\r\n\r\n                                    \/\/ Extract title from savable_title\r\n                                    if (videoNode.savable_title && videoNode.savable_title.text) {\r\n                                        videoData.title = videoNode.savable_title.text;\r\n                                    }\r\n\r\n                                    \/\/ Extract duration\r\n                                    if (videoNode.video_thumbnail_overlays_renderer &&\r\n                                        videoNode.video_thumbnail_overlays_renderer.video &&\r\n                                        videoNode.video_thumbnail_overlays_renderer.video.playable_duration_in_ms) {\r\n                                        videoData.duration = videoNode.video_thumbnail_overlays_renderer.video.playable_duration_in_ms;\r\n                                    }\r\n\r\n                                    \/\/ Extract video URL and other details from creation_story\r\n                                    if (videoNode.creation_story && videoNode.creation_story.attachments) {\r\n                                        videoNode.creation_story.attachments.forEach(attachment => {\r\n                                            if (attachment.target && attachment.target.__typename === 'Video') {\r\n                                                const target = attachment.target;\r\n\r\n                                                \/\/ Get playable URL\r\n                                                if (target.playable_url) {\r\n                                                    videoData.videoUrl = target.playable_url;\r\n                                                }\r\n\r\n                                                \/\/ Get dimensions\r\n                                                if (target.width) videoData.width = target.width;\r\n                                                if (target.height) videoData.height = target.height;\r\n\r\n                                                \/\/ Get thumbnail if not already found\r\n                                                if (!videoData.thumbnailUri && target.image && target.image.uri) {\r\n                                                    videoData.thumbnailUri = target.image.uri;\r\n                                                }\r\n                                            }\r\n                                        });\r\n\r\n                                        \/\/ Extract message\/description\r\n                                        if (videoNode.creation_story.message && videoNode.creation_story.message.text) {\r\n                                            videoData.description = videoNode.creation_story.message.text;\r\n                                            \/\/ Use first line as title if no title found\r\n                                            if (videoData.title === 'Video') {\r\n                                                const lines = videoData.description.split('\\n');\r\n                                                videoData.title = lines[0].trim() || 'Video';\r\n                                            }\r\n                                        }\r\n                                    }\r\n\r\n                                    \/\/ Extract reaction stats\r\n                                    if (videoNode.feedback && videoNode.feedback.reaction_count) {\r\n                                        videoData.stats.likes = videoNode.feedback.reaction_count.count || 0;\r\n                                    }\r\n\r\n                                    \/\/ Only add if we have essential data\r\n                                    if (videoData.thumbnailUri || videoData.videoUrl) {\r\n                                        console.log('Adding video:', videoData);\r\n                                        videos.push(videoData);\r\n                                    }\r\n                                }\r\n                            });\r\n                        }\r\n\r\n                        \/\/ Also check for all_videos structure (alternative format)\r\n                        if (item.result &&\r\n                            item.result.data &&\r\n                            item.result.data.all_videos &&\r\n                            item.result.data.all_videos.edges) {\r\n\r\n                            const edges = item.result.data.all_videos.edges;\r\n                            console.log('Found all_videos edges:', edges);\r\n\r\n                            edges.forEach(edge => {\r\n                                if (edge.node && edge.node.channel_tab_thumbnail_renderer) {\r\n                                    const videoNode = edge.node.channel_tab_thumbnail_renderer.video;\r\n\r\n                                    \/\/ Extract basic video info\r\n                                    const videoData = {\r\n                                        id: videoNode.id || '',\r\n                                        title: 'Video',\r\n                                        description: '',\r\n                                        thumbnailUri: '',\r\n                                        videoUrl: '',\r\n                                        width: 0,\r\n                                        height: 0,\r\n                                        duration: 0,\r\n                                        creationTime: videoNode.publish_time || 0,\r\n                                        stats: {\r\n                                            likes: 0,\r\n                                            views: videoNode.play_count || 0\r\n                                        }\r\n                                    };\r\n\r\n                                    \/\/ Extract thumbnail\r\n                                    if (videoNode.image && videoNode.image.uri) {\r\n                                        videoData.thumbnailUri = videoNode.image.uri;\r\n                                    }\r\n\r\n                                    \/\/ Extract title from savable_title\r\n                                    if (videoNode.savable_title && videoNode.savable_title.text) {\r\n                                        videoData.title = videoNode.savable_title.text;\r\n                                    }\r\n\r\n                                    \/\/ Extract duration\r\n                                    if (videoNode.video_thumbnail_overlays_renderer &&\r\n                                        videoNode.video_thumbnail_overlays_renderer.video &&\r\n                                        videoNode.video_thumbnail_overlays_renderer.video.playable_duration_in_ms) {\r\n                                        videoData.duration = videoNode.video_thumbnail_overlays_renderer.video.playable_duration_in_ms;\r\n                                    }\r\n\r\n                                    \/\/ Extract video URL and other details from creation_story\r\n                                    if (videoNode.creation_story && videoNode.creation_story.attachments) {\r\n                                        videoNode.creation_story.attachments.forEach(attachment => {\r\n                                            if (attachment.target && attachment.target.__typename === 'Video') {\r\n                                                const target = attachment.target;\r\n\r\n                                                \/\/ Get playable URL\r\n                                                if (target.playable_url) {\r\n                                                    videoData.videoUrl = target.playable_url;\r\n                                                }\r\n\r\n                                                \/\/ Get dimensions\r\n                                                if (target.width) videoData.width = target.width;\r\n                                                if (target.height) videoData.height = target.height;\r\n\r\n                                                \/\/ Get thumbnail if not already found\r\n                                                if (!videoData.thumbnailUri && target.image && target.image.uri) {\r\n                                                    videoData.thumbnailUri = target.image.uri;\r\n                                                }\r\n                                            }\r\n                                        });\r\n\r\n                                        \/\/ Extract message\/description\r\n                                        if (videoNode.creation_story.message && videoNode.creation_story.message.text) {\r\n                                            videoData.description = videoNode.creation_story.message.text;\r\n                                            \/\/ Use first line as title if no title found\r\n                                            if (videoData.title === 'Video') {\r\n                                                const lines = videoData.description.split('\\n');\r\n                                                videoData.title = lines[0].trim() || 'Video';\r\n                                            }\r\n                                        }\r\n                                    }\r\n\r\n                                    \/\/ Extract reaction stats\r\n                                    if (videoNode.feedback && videoNode.feedback.reaction_count) {\r\n                                        videoData.stats.likes = videoNode.feedback.reaction_count.count || 0;\r\n                                    }\r\n\r\n                                    \/\/ Only add if we have essential data\r\n                                    if (videoData.thumbnailUri || videoData.videoUrl) {\r\n                                        console.log('Adding video:', videoData);\r\n                                        videos.push(videoData);\r\n                                    }\r\n                                }\r\n                            });\r\n                        }\r\n                    }\r\n                }\r\n\r\n                console.log('Final extracted videos:', videos);\r\n\r\n            } catch (error) {\r\n                console.error('Error extracting videos from API:', error);\r\n            }\r\n\r\n            return videos;\r\n        }\r\n\r\n        \/\/ Function to extract reels\r\n        function extractReels(data) {\r\n            const reels = [];\r\n\r\n            try {\r\n                console.log('Full API response for reels:', data);\r\n\r\n                if (data && data.data && Array.isArray(data.data)) {\r\n                    for (const item of data.data) {\r\n                        \/\/ Look for reels in the main data structure\r\n                        if (item.result &&\r\n                            item.result.data &&\r\n                            item.result.data.node &&\r\n                            item.result.data.node.all_collections &&\r\n                            item.result.data.node.all_collections.nodes) {\r\n\r\n                            const collections = item.result.data.node.all_collections.nodes;\r\n\r\n                            for (const collection of collections) {\r\n                                if (collection.style_renderer &&\r\n                                    collection.style_renderer.collection &&\r\n                                    collection.style_renderer.collection.aggregated_fb_shorts &&\r\n                                    collection.style_renderer.collection.aggregated_fb_shorts.edges) {\r\n\r\n                                    const reelsEdges = collection.style_renderer.collection.aggregated_fb_shorts.edges;\r\n                                    console.log('Found reels edges:', reelsEdges);\r\n\r\n                                    reelsEdges.forEach(edge => {\r\n                                        if (edge.profile_reel_node && edge.profile_reel_node.node) {\r\n                                            const reelNode = edge.profile_reel_node.node;\r\n                                            console.log('Processing reel node:', reelNode);\r\n\r\n                                            const reelData = {\r\n                                                id: reelNode.id || '',\r\n                                                thumbnailUri: '',\r\n                                                videoUrl: '',\r\n                                                duration: 0,\r\n                                                title: 'Reel',\r\n                                                views: 0,\r\n                                                creationTime: reelNode.creation_time || 0\r\n                                            };\r\n\r\n                                            \/\/ Extract video data from short_form_video_context\r\n                                            if (reelNode.short_form_video_context &&\r\n                                                reelNode.short_form_video_context.playback_video) {\r\n\r\n                                                const video = reelNode.short_form_video_context.playback_video;\r\n\r\n                                                \/\/ Extract thumbnail\r\n                                                if (video.thumbnailImage && video.thumbnailImage.uri) {\r\n                                                    reelData.thumbnailUri = video.thumbnailImage.uri;\r\n                                                }\r\n\r\n                                                \/\/ Extract video URLs from videoDeliveryLegacyFields\r\n                                                if (video.videoDeliveryLegacyFields) {\r\n                                                    const delivery = video.videoDeliveryLegacyFields;\r\n\r\n                                                    if (delivery.browser_native_hd_url) {\r\n                                                        reelData.videoUrl = delivery.browser_native_hd_url;\r\n                                                    } else if (delivery.browser_native_sd_url) {\r\n                                                        reelData.videoUrl = delivery.browser_native_sd_url;\r\n                                                    }\r\n                                                }\r\n\r\n                                                \/\/ Extract duration\r\n                                                if (video.playable_duration_in_ms) {\r\n                                                    reelData.duration = video.playable_duration_in_ms;\r\n                                                } else if (video.length_in_second) {\r\n                                                    reelData.duration = video.length_in_second * 1000;\r\n                                                }\r\n\r\n                                                \/\/ Extract permalink URL as fallback\r\n                                                if (video.permalink_url) {\r\n                                                    reelData.videoUrl = reelData.videoUrl || video.permalink_url;\r\n                                                }\r\n                                            }\r\n\r\n                                            \/\/ Extract video data from attachments\r\n                                            if (reelNode.attachments && reelNode.attachments.length > 0) {\r\n                                                const attachment = reelNode.attachments[0];\r\n                                                if (attachment.media && attachment.media.__typename === 'Video') {\r\n                                                    const media = attachment.media;\r\n\r\n                                                    \/\/ Extract thumbnail if not already found\r\n                                                    if (!reelData.thumbnailUri && media.first_frame_thumbnail) {\r\n                                                        reelData.thumbnailUri = media.first_frame_thumbnail;\r\n                                                    }\r\n\r\n                                                    \/\/ Extract shareable URL\r\n                                                    if (media.shareable_url) {\r\n                                                        reelData.videoUrl = reelData.videoUrl || media.shareable_url;\r\n                                                    }\r\n\r\n                                                    \/\/ Extract duration if not already found\r\n                                                    if (!reelData.duration && media.playable_duration_in_ms) {\r\n                                                        reelData.duration = media.playable_duration_in_ms;\r\n                                                    }\r\n                                                }\r\n                                            }\r\n\r\n                                            \/\/ Extract title from message\r\n                                            if (reelNode.message && reelNode.message.text) {\r\n                                                reelData.title = reelNode.message.text.split('\\n')[0].trim() || 'Reel';\r\n                                            }\r\n\r\n                                            \/\/ Extract views from feedback\r\n                                            if (reelNode.feedback && reelNode.feedback.unified_reactors) {\r\n                                                reelData.views = reelNode.feedback.unified_reactors.count || 0;\r\n                                            }\r\n\r\n                                            \/\/ Extract play count from short_form_video_context\r\n                                            if (reelNode.short_form_video_context &&\r\n                                                reelNode.short_form_video_context.play_count_reduced) {\r\n                                                reelData.views = parseInt(reelNode.short_form_video_context.play_count_reduced) || reelData.views;\r\n                                            }\r\n\r\n                                            \/\/ Only add if we have essential data\r\n                                            if (reelData.thumbnailUri || reelData.videoUrl) {\r\n                                                console.log('Adding reel:', reelData);\r\n                                                reels.push(reelData);\r\n                                            } else {\r\n                                                console.log('Skipping reel due to missing essential data:', reelData);\r\n                                            }\r\n                                        }\r\n                                    });\r\n                                }\r\n                            }\r\n                        }\r\n                    }\r\n                }\r\n\r\n                console.log('Final extracted reels:', reels);\r\n\r\n            } catch (error) {\r\n                console.error('Error extracting reels:', error);\r\n            }\r\n\r\n            return reels;\r\n        }\r\n\r\n        function displayProfileData(profileData) {\r\n            console.log(profileData);\r\n            const profileContent = document.getElementById('profileContent');\r\n\r\n            const html = `\r\n            <div class=\"fb-profile-container\">\r\n                <!-- Cover Photo Section -->\r\n                <div class=\"fb-cover-section\">\r\n                    <div class=\"fb-cover-photo\" style=\"background-image: url('${profileData.basicInfo.coverPhoto || '\/placeholder.svg?height=400&width=1200'}')\"><\/div>\r\n                    <div class=\"fb-cover-overlay\"><\/div>\r\n                    <div class=\"fb-cover-gradient\"><\/div>\r\n                <\/div>\r\n\r\n                <!-- Profile Info Section -->\r\n                <div class=\"fb-profile-info-section\">\r\n                    <div class=\"fb-profile-header\">\r\n                        <div class=\"fb-profile-picture-container\">\r\n                            <div class=\"fb-profile-picture\" style=\"background-image: url('${profileData.basicInfo.profilePicture || '\/placeholder.svg?height=160&width=160'}')\"><\/div>\r\n                            <div class=\"fb-profile-ring\"><\/div>\r\n                            <div class=\"fb-profile-status-indicator\"><\/div>\r\n                        <\/div>\r\n\r\n                        <div class=\"fb-profile-details\">\r\n                            <h1 class=\"fb-profile-name ${profileData.basicInfo.isVerified ? 'fb-verified-badge' : ''}\">${escapeHtml(profileData.basicInfo.name || currentUsername)}<\/h1>\r\n                            <div class=\"fb-profile-stats\">\r\n                                <span class=\"fb-stat-badge\">${profileData.photos.length} Photos<\/span>\r\n                                <span class=\"fb-stat-badge\">${profileData.videos.length} Videos<\/span>\r\n                                <span class=\"fb-stat-badge\">${profileData.reels.length} Reels<\/span>\r\n                                <span class=\"fb-stat-badge\">${profileData.posts.length} Posts<\/span>\r\n                            <\/div>\r\n                            <div class=\"fb-profile-actions\">\r\n                                <button class=\"fb-action-btn primary\">\r\n                                    <i class=\"fas fa-user-plus\"><\/i>\r\n                                    <span>Follow<\/span>\r\n                                <\/button>\r\n                                <button class=\"fb-action-btn secondary\">\r\n                                    <i class=\"fas fa-share\"><\/i>\r\n                                    <span>Share<\/span>\r\n                                <\/button>\r\n                                <button class=\"fb-action-btn secondary\" onclick=\"exportProfileData()\">\r\n                                    <i class=\"fas fa-download\"><\/i>\r\n                                    <span>Export<\/span>\r\n                                <\/button>\r\n                            <\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n\r\n                    <!-- Navigation Tabs -->\r\n                    <div class=\"fb-profile-navigation\">\r\n                        <div class=\"fb-profile-nav-tabs\">\r\n                            <button class=\"fb-nav-tab active\" data-tab=\"photos\" onclick=\"switchProfileTab('photos')\">\r\n                                <i class=\"fas fa-images\"><\/i>\r\n                                <span>Photos<\/span>\r\n                                <div class=\"fb-nav-indicator\"><\/div>\r\n                            <\/button>\r\n                            <button class=\"fb-nav-tab\" data-tab=\"posts\" onclick=\"switchProfileTab('posts')\">\r\n                                <i class=\"fas fa-newspaper\"><\/i>\r\n                                <span>Posts<\/span>\r\n                                <div class=\"fb-nav-indicator\"><\/div>\r\n                            <\/button>\r\n                            <button class=\"fb-nav-tab\" data-tab=\"videos\" onclick=\"switchProfileTab('videos')\">\r\n                                <i class=\"fas fa-video\"><\/i>\r\n                                <span>Videos<\/span>\r\n                                <div class=\"fb-nav-indicator\"><\/div>\r\n                            <\/button>\r\n                            <button class=\"fb-nav-tab\" data-tab=\"reels\" onclick=\"switchProfileTab('reels')\">\r\n                                <i class=\"fas fa-film\"><\/i>\r\n                                <span>Reels<\/span>\r\n                                <div class=\"fb-nav-indicator\"><\/div>\r\n                            <\/button>\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <!-- Tab Content -->\r\n                <div class=\"fb-tab-content-container\">\r\n                    <!-- Photos Tab -->\r\n                    <div id=\"profile-photos-tab\" class=\"fb-tab-content active\">\r\n                        <div class=\"fb-content-header\">\r\n                            <div class=\"fb-content-title\">\r\n                                <i class=\"fas fa-images\"><\/i>\r\n                                <h2>Photo Gallery<\/h2>\r\n                            <\/div>\r\n                            <div class=\"fb-content-stats\">\r\n                                <div class=\"fb-stat-item\">\r\n                                    <i class=\"fas fa-camera\"><\/i>\r\n                                    <span>${profileData.photos.length} Photos<\/span>\r\n                                <\/div>\r\n                            <\/div>\r\n                        <\/div>\r\n\r\n                        ${profileData.photos.length > 0 ? `\r\n                            <div class=\"fb-photos-grid\">\r\n                                ${profileData.photos.map((photo, index) => `\r\n                                    <div class=\"fb-photoitem\" onclick=\"openPhotoModal('${photo.url}', ${index})\">\r\n                                        <div class=\"fb-photoimage-container\">\r\n                                            <img decoding=\"async\" src=\"${photo.url}\" alt=\"Photo ${index + 1}\" class=\"fb-photoimage\" onerror=\"this.parentElement.parentElement.style.display='none'\">\r\n                                            <div class=\"fb-photooverlay\">\r\n                                                <div class=\"fb-photoactions\">\r\n                                                    <button class=\"fb-photoaction-btn\" onclick=\"event.stopPropagation(); downloadImage('${photo.url}', 'photo-${index + 1}.jpg', this)\">\r\n                                                        <i class=\"fas fa-download\"><\/i>\r\n                                                    <\/button>\r\n                                                    <button class=\"fb-photoaction-btn\" onclick=\"event.stopPropagation(); sharePhoto('${photo.url}')\">\r\n                                                        <i class=\"fas fa-share\"><\/i>\r\n                                                    <\/button>\r\n                                                <\/div>\r\n                                            <\/div>\r\n                                        <\/div>\r\n                                        <div class=\"fb-photoinfo\">\r\n                                            <div class=\"fb-photostats\">\r\n                                                <div class=\"fb-photoengagement\">\r\n                                                    <div class=\"fb-photoengagement-item\">\r\n                                                        <i class=\"fas fa-heart\"><\/i>\r\n                                                        <span>${photo.likes}<\/span>\r\n                                                    <\/div>\r\n                                                    <div class=\"fb-photoengagement-item\">\r\n                                                        <i class=\"fas fa-comment\"><\/i>\r\n                                                        <span>${photo.comments}<\/span>\r\n                                                    <\/div>\r\n                                                <\/div>\r\n                                            <\/div>\r\n                                            <div class=\"fb-photometa\">\r\n                                                <span class=\"fb-photodimensions\">${formatMediaDimensions(photo.width, photo.height)}<\/span>\r\n                                                <span>${formatDate(photo.created_time)}<\/span>\r\n                                            <\/div>\r\n                                        <\/div>\r\n                                    <\/div>\r\n                                `).join('')}\r\n                            <\/div>\r\n                        ` : `\r\n                            <div class=\"fb-no-data-message\">\r\n                                No photos found for this profile.\r\n                            <\/div>\r\n                        `}\r\n                    <\/div>\r\n\r\n                    <!-- Posts Tab -->\r\n                    <div id=\"profile-posts-tab\" class=\"fb-tab-content\">\r\n                        <div class=\"fb-content-header\">\r\n                            <div class=\"fb-content-title\">\r\n                                <i class=\"fas fa-newspaper\"><\/i>\r\n                                <h2>Recent Posts<\/h2>\r\n                            <\/div>\r\n                            <div class=\"fb-content-stats\">\r\n                                <div class=\"fb-stat-item\">\r\n                                    <i class=\"fas fa-edit\"><\/i>\r\n                                    <span>${profileData.posts.length} Posts<\/span>\r\n                                <\/div>\r\n                            <\/div>\r\n                        <\/div>\r\n\r\n                        ${profileData.posts.length > 0 ? `\r\n                            <div class=\"fb-posts-container\">\r\n                                ${profileData.posts.map((post, index) => `\r\n                                    <div class=\"fb-post-item\">\r\n                                        <div class=\"fb-post-header\">\r\n                                            <div class=\"fb-post-profile-pic\" style=\"background-image: url('${profileData.basicInfo.profilePicture || '\/placeholder.svg?height=48&width=48'}')\">\r\n                                                ${!profileData.basicInfo.profilePicture ? '<i class=\"fas fa-user\"><\/i>' : ''}\r\n                                            <\/div>\r\n                                            <div class=\"fb-post-info\">\r\n                                                <div class=\"fb-post-author\">${escapeHtml(profileData.basicInfo.name || currentUsername)}<\/div>\r\n                                                <div class=\"fb-post-date\">${formatDate(post.creationTime * 1000)}<\/div>\r\n                                            <\/div>\r\n                                        <\/div>\r\n                                        \r\n                                        ${post.message ? `<div class=\"fb-post-content\">${escapeHtml(post.message)}<\/div>` : ''}\r\n                                        \r\n                                        ${post.attachments.map(attachment => {\r\n                if (attachment.type === 'photo') {\r\n                    return `<img decoding=\"async\" src=\"${attachment.uri}\" alt=\"Post image\" class=\"fb-post-image\">`;\r\n                }\r\n                return '';\r\n            }).join('')}\r\n                                        \r\n                                        <div class=\"fb-post-stats\">\r\n                                            <div class=\"fb-stat-item\">\r\n                                                <i class=\"fas fa-heart\"><\/i>\r\n                                                <span>${post.stats.likes} likes<\/span>\r\n                                            <\/div>\r\n                                            <div class=\"fb-stat-item\">\r\n                                                <i class=\"fas fa-comment\"><\/i>\r\n                                                <span>${post.stats.comments} comments<\/span>\r\n                                            <\/div>\r\n                                            <div class=\"fb-stat-item\">\r\n                                                <i class=\"fas fa-share\"><\/i>\r\n                                                <span>${post.stats.shares} shares<\/span>\r\n                                            <\/div>\r\n                                        <\/div>\r\n                                    <\/div>\r\n                                `).join('')}\r\n                            <\/div>\r\n                        ` : `\r\n                            <div class=\"fb-no-data-message\">\r\n                                No posts found for this profile.\r\n                            <\/div>\r\n                        `}\r\n                    <\/div>\r\n\r\n                    <!-- Videos Tab -->\r\n                    <div id=\"profile-videos-tab\" class=\"fb-tab-content\">\r\n                        <div class=\"fb-content-header\">\r\n                            <div class=\"fb-content-title\">\r\n                                <i class=\"fas fa-video\"><\/i>\r\n                                <h2>Video Collection<\/h2>\r\n                            <\/div>\r\n                            <div class=\"fb-content-stats\">\r\n                                <div class=\"fb-stat-item\">\r\n                                    <i class=\"fas fa-play-circle\"><\/i>\r\n                                    <span id=\"video-count\">${profileData.videos.length} Videos<\/span>\r\n                                <\/div>\r\n                            <\/div>\r\n                        <\/div>\r\n\r\n                        <div id=\"videos-skeleton\" class=\"fb-videos-skeleton\">\r\n                            <div class=\"fb-videos-grid-skeleton\">\r\n                                <div class=\"fb-video-skeleton\">\r\n                                    <div class=\"fb-video-thumbnail-skeleton fb-skeleton-loading\"><\/div>\r\n                                    <div class=\"fb-video-info-skeleton\">\r\n                                        <div class=\"fb-skeleton-line fb-skeleton-loading\"><\/div>\r\n                                        <div class=\"fb-skeleton-line short fb-skeleton-loading\"><\/div>\r\n                                    <\/div>\r\n                                <\/div>\r\n                                <div class=\"fb-video-skeleton\">\r\n                                    <div class=\"fb-video-thumbnail-skeleton fb-skeleton-loading\"><\/div>\r\n                                    <div class=\"fb-video-info-skeleton\">\r\n                                        <div class=\"fb-skeleton-line fb-skeleton-loading\"><\/div>\r\n                                        <div class=\"fb-skeleton-line short fb-skeleton-loading\"><\/div>\r\n                                    <\/div>\r\n                                <\/div>\r\n                                <div class=\"fb-video-skeleton\">\r\n                                    <div class=\"fb-video-thumbnail-skeleton fb-skeleton-loading\"><\/div>\r\n                                    <div class=\"fb-video-info-skeleton\">\r\n                                        <div class=\"fb-skeleton-line fb-skeleton-loading\"><\/div>\r\n                                        <div class=\"fb-skeleton-line short fb-skeleton-loading\"><\/div>\r\n                                    <\/div>\r\n                                <\/div>\r\n                            <\/div>\r\n                        <\/div>\r\n\r\n                        <div id=\"profile-videos-container\" class=\"fb-video-grid\">\r\n                            ${profileData.videos.length > 0 ? profileData.videos.map((video, index) => `\r\n                                <div class=\"fb-video-card\" style=\"--index: ${index}\" data-video-index=\"${index}\">\r\n                                    <div class=\"fb-video-thumbnail\" style=\"background-image: url('${video.thumbnailUri || '\/placeholder.svg?height=200&width=350'}')\" onclick=\"playVideoInline(${index}, 'profile')\">\r\n                                        <div class=\"fb-video-play-icon\">\r\n                                            <i class=\"fas fa-play\"><\/i>\r\n                                        <\/div>\r\n                                        <div class=\"fb-video-quality-badge\">${video.height >= 720 ? 'HD' : 'SD'}<\/div>\r\n                                        <div class=\"fb-video-duration\">${formatDuration(video.duration)}<\/div>\r\n                                        <div class=\"fb-video-overlay\">\r\n                                            <div class=\"fb-video-actions\">\r\n                                                <button class=\"fb-video-action-btn\" onclick=\"event.stopPropagation(); downloadVideo(${index}, 'profile')\" title=\"Download Video\">\r\n                                                    <i class=\"fas fa-download\"><\/i>\r\n                                                <\/button>\r\n                                                <button class=\"fb-video-action-btn\" onclick=\"event.stopPropagation(); shareVideo(${index}, 'profile')\" title=\"Share Video\">\r\n                                                    <i class=\"fas fa-share\"><\/i>\r\n                                                <\/button>\r\n                                            <\/div>\r\n                                        <\/div>\r\n                                    <\/div>\r\n                                    ${video.videoUrl ? `\r\n                                        <video \r\n                                            class=\"fb-video-player\" \r\n                                            style=\"display: none;\" \r\n                                            controls \r\n                                            preload=\"metadata\"\r\n                                            data-src=\"${video.videoUrl}\"\r\n                                        >\r\n                                            <source src=\"${video.videoUrl}\" type=\"video\/mp4\">\r\n                                            Your browser does not support the video tag.\r\n                                        <\/video>\r\n                                    ` : ''}\r\n                                    <div class=\"fb-video-info\">\r\n                                        <div class=\"fb-video-title\">${escapeHtml(truncateText(video.title))}<\/div>\r\n                                        ${video.description && video.description.trim() ? `\r\n                                            <div class=\"fb-video-description\">${escapeHtml(video.description.trim())}<\/div>\r\n                                        ` : ''}\r\n                                        <div class=\"fb-video-stats\">\r\n                                            <div class=\"fb-video-engagement\">\r\n                                                ${video.stats && video.stats.likes > 0 ? `\r\n                                                    <div class=\"fb-video-engagement-item\">\r\n                                                        <i class=\"fas fa-heart\"><\/i>\r\n                                                        <span>${formatNumber(video.stats.likes)}<\/span>\r\n                                                    <\/div>\r\n                                                ` : ''}\r\n                                                ${video.stats && video.stats.views > 0 ? `\r\n                                                    <div class=\"fb-video-engagement-item\">\r\n                                                        <i class=\"fas fa-eye\"><\/i>\r\n                                                        <span>${formatNumber(video.stats.views)} views<\/span>\r\n                                                    <\/div>\r\n                                                ` : ''}\r\n                                            <\/div>\r\n                                            ${video.videoUrl ? `\r\n                                                <button class=\"fb-video-download-btn\" onclick=\"downloadVideo(${index}, 'profile')\">\r\n                                                    <i class=\"fas fa-download\"><\/i>\r\n                                                    Download\r\n                                                <\/button>\r\n                                            ` : ''}\r\n                                        <\/div>\r\n                                        <div class=\"fb-video-meta\">\r\n                                            ${video.creationTime ? `<div>${formatTimeAgo(video.creationTime * 1000)}<\/div>` : ''}\r\n                                            <div>${formatMediaDimensions(video.width, video.height)}<\/div>\r\n                                        <\/div>\r\n                                    <\/div>\r\n                                <\/div>\r\n                            `).join('') : `\r\n                                <div class=\"fb-no-data-message\">\r\n                                    No videos found for this profile.\r\n                                <\/div>\r\n                            `}\r\n                        <\/div>\r\n                    <\/div>\r\n\r\n                    <!-- Reels Tab -->\r\n                    <div id=\"profile-reels-tab\" class=\"fb-tab-content\">\r\n                        <div class=\"fb-content-header\">\r\n                            <div class=\"fb-content-title\">\r\n                                <i class=\"fas fa-film\"><\/i>\r\n                                <h2>Reels Collection<\/h2>\r\n                            <\/div>\r\n                            <div class=\"fb-content-stats\">\r\n                                <div class=\"fb-stat-item\">\r\n                                    <i class=\"fas fa-video\"><\/i>\r\n                                    <span id=\"reels-count\">${profileData.reels.length} Reels<\/span>\r\n                                <\/div>\r\n                            <\/div>\r\n                        <\/div>\r\n\r\n                        <div id=\"reels-skeleton\" class=\"fb-reels-skeleton\">\r\n                            <div class=\"fb-reels-grid-skeleton\">\r\n                                <div class=\"fb-reel-skeleton\">\r\n                                    <div class=\"fb-reel-thumbnail-skeleton fb-skeleton-loading\"><\/div>\r\n                                    <div class=\"fb-reel-info-skeleton\">\r\n                                        <div class=\"fb-skeleton-line fb-skeleton-loading\"><\/div>\r\n                                        <div class=\"fb-skeleton-line short fb-skeleton-loading\"><\/div>\r\n                                    <\/div>\r\n                                <\/div>\r\n                                <div class=\"fb-reel-skeleton\">\r\n                                    <div class=\"fb-reel-thumbnail-skeleton fb-skeleton-loading\"><\/div>\r\n                                    <div class=\"fb-reel-info-skeleton\">\r\n                                        <div class=\"fb-skeleton-line fb-skeleton-loading\"><\/div>\r\n                                        <div class=\"fb-skeleton-line short fb-skeleton-loading\"><\/div>\r\n                                    <\/div>\r\n                                <\/div>\r\n                                <div class=\"fb-reel-skeleton\">\r\n                                    <div class=\"fb-reel-thumbnail-skeleton fb-skeleton-loading\"><\/div>\r\n                                    <div class=\"fb-reel-info-skeleton\">\r\n                                        <div class=\"fb-skeleton-line fb-skeleton-loading\"><\/div>\r\n                                        <div class=\"fb-skeleton-line short fb-skeleton-loading\"><\/div>\r\n                                    <\/div>\r\n                                <\/div>\r\n                            <\/div>\r\n                        <\/div>\r\n\r\n                        <div id=\"profile-reels-container\" class=\"fb-video-grid\">\r\n                            ${profileData.reels.length > 0 ? profileData.reels.map((reel, index) => `\r\n                                <div class=\"fb-video-card\" style=\"--index: ${index}\" data-reel-index=\"${index}\">\r\n                                    <div class=\"fb-video-thumbnail\" style=\"background-image: url('${reel.thumbnailUri || '\/placeholder.svg?height=200&width=350'}')\" onclick=\"playReelInline(${index}, 'profile')\">\r\n                                        <div class=\"fb-video-play-icon\">\r\n                                            <i class=\"fas fa-play\"><\/i>\r\n                                        <\/div>\r\n                                        <div class=\"fb-reel-badge\">REEL<\/div>\r\n                                        <div class=\"fb-video-duration\">${formatDuration(reel.duration)}<\/div>\r\n                                        <div class=\"fb-video-overlay\">\r\n                                            <div class=\"fb-video-actions\">\r\n                                                <button class=\"fb-video-action-btn\" onclick=\"event.stopPropagation(); downloadReel(${index}, 'profile')\" title=\"Download Reel\">\r\n                                                    <i class=\"fas fa-download\"><\/i>\r\n                                                <\/button>\r\n                                                <button class=\"fb-video-action-btn\" onclick=\"event.stopPropagation(); shareReel(${index}, 'profile')\" title=\"Share Reel\">\r\n                                                    <i class=\"fas fa-share\"><\/i>\r\n                                                <\/button>\r\n                                            <\/div>\r\n                                        <\/div>\r\n                                    <\/div>\r\n                                    ${reel.videoUrl ? `\r\n                                        <video \r\n                                            class=\"fb-video-player\" \r\n                                            style=\"display: none;\" \r\n                                            controls \r\n                                            loop\r\n                                            muted\r\n                                            preload=\"metadata\"\r\n                                            data-src=\"${reel.videoUrl}\"\r\n                                        >\r\n                                            <source src=\"${reel.videoUrl}\" type=\"video\/mp4\">\r\n                                            Your browser does not support the video tag.\r\n                                        <\/video>\r\n                                    ` : ''}\r\n                                    <div class=\"fb-video-info\">\r\n                                        <div class=\"fb-video-title\">${escapeHtml(truncateText(reel.title))}<\/div>\r\n                                        ${reel.description && reel.description.trim() ? `\r\n                                            <div class=\"fb-video-description\">${escapeHtml(reel.description.trim())}<\/div>\r\n                                        ` : ''}\r\n                                        <div class=\"fb-video-stats\">\r\n                                            <div class=\"fb-video-engagement\">\r\n                                                ${reel.views > 0 ? `\r\n                                                    <div class=\"fb-video-engagement-item\">\r\n                                                        <i class=\"fas fa-eye\"><\/i>\r\n                                                        <span>${formatNumber(reel.views)} views<\/span>\r\n                                                    <\/div>\r\n                                                ` : ''}\r\n                                            <\/div>\r\n                                            ${reel.videoUrl ? `\r\n                                                <button class=\"fb-video-download-btn\" onclick=\"downloadReel(${index}, 'profile')\">\r\n                                                    <i class=\"fas fa-download\"><\/i>\r\n                                                    Download\r\n                                                <\/button>\r\n                                            ` : ''}\r\n                                        <\/div>\r\n                                        <div class=\"fb-video-meta\">\r\n                                            ${reel.creationTime ? `<div>${formatTimeAgo(reel.creationTime * 1000)}<\/div>` : ''}\r\n                                        <\/div>\r\n                                    <\/div>\r\n                                <\/div>\r\n                            `).join('') : `\r\n                                <div class=\"fb-no-data-message\">\r\n                                    No reels found for this profile.\r\n                                <\/div>\r\n                            `}\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        `;\r\n\r\n            profileContent.innerHTML = html;\r\n        }\r\n\r\n        \/\/ Tab Switching Functions\r\n        function switchTab(tabName) {\r\n            \/\/ For group tabs\r\n            document.querySelectorAll('.fb-tab-btn').forEach(btn => btn.classList.remove('active'));\r\n            document.querySelectorAll('.fb-tab-content').forEach(content => content.classList.remove('active'));\r\n\r\n            const tabBtn = document.querySelector(`[onclick=\"switchTab('${tabName}')\"]`);\r\n            const tabContent = document.getElementById(tabName + 'Tab');\r\n\r\n            if (tabBtn) tabBtn.classList.add('active');\r\n            if (tabContent) tabContent.classList.add('active');\r\n\r\n            \/\/ Load videos when videos tab is clicked for groups\r\n            if (tabName === 'videos' && !videosLoaded && currentGroupId && currentType === 'group') {\r\n                fetchGroupVideos();\r\n            }\r\n\r\n            \/\/ Load reels when reels tab is clicked for groups\r\n            if (tabName === 'reels' && !reelsLoaded && currentGroupId && currentType === 'group') {\r\n                fetchGroupReels();\r\n            }\r\n        }\r\n\r\n        function switchProfileTab(tabName) {\r\n            \/\/ For profile tabs\r\n            document.querySelectorAll('.fb-nav-tab').forEach(btn => btn.classList.remove('active'));\r\n            document.querySelectorAll('.fb-tab-content').forEach(content => content.classList.remove('active'));\r\n\r\n            const tabBtn = document.querySelector(`[data-tab=\"${tabName}\"]`);\r\n            const tabContent = document.getElementById(`profile-${tabName}-tab`);\r\n\r\n            if (tabBtn) tabBtn.classList.add('active');\r\n            if (tabContent) tabContent.classList.add('active');\r\n\r\n            \/\/ Load videos when videos tab is clicked for profiles\r\n            if (tabName === 'videos' && currentUsername && currentType === 'profile') {\r\n                document.getElementById('videos-skeleton').style.display = 'block';\r\n                document.getElementById('profile-videos-container').style.display = 'none';\r\n\r\n                setTimeout(() => {\r\n                    fetchVideosData(currentUsername);\r\n                }, 500);\r\n            }\r\n\r\n            \/\/ Load reels when reels tab is clicked for profiles\r\n            if (tabName === 'reels' && currentUsername && currentType === 'profile') {\r\n                document.getElementById('reels-skeleton').style.display = 'block';\r\n                document.getElementById('profile-reels-container').style.display = 'none';\r\n\r\n                setTimeout(() => {\r\n                    fetchReelsData(currentUsername);\r\n                }, 500);\r\n            }\r\n        }\r\n\r\n        \/\/ Group Video Functions\r\n        async function fetchGroupVideos() {\r\n            if (!currentGroupId || videosLoaded) return;\r\n\r\n            document.getElementById('videosContent').style.display = 'none';\r\n            document.getElementById('videosError').style.display = 'none';\r\n            document.getElementById('videosSkeleton').style.display = 'block';\r\n\r\n            try {\r\n                const videosUrl = `https:\/\/www.facebook.com\/groups\/${currentGroupId}\/media\/videos`;\r\n\r\n                const data = await fetchFacebookApi({ url: videosUrl });\r\n\r\n                document.getElementById('videosSkeleton').style.display = 'none';\r\n                document.getElementById('videosContent').style.display = 'block';\r\n                const videoUrls = extractVideoUrls(data);\r\n                videosLoaded = true;\r\n\r\n                if (videoUrls.length > 0) {\r\n                    await fetchDownloadInfo(videoUrls);\r\n                } else {\r\n                    document.getElementById('videosContent').innerHTML = '<div class=\"fb-empty-state\"><div class=\"fb-empty-icon\">\ud83c\udfa5<\/div><h3>No videos found<\/h3><p>This group doesn\\'t have any videos or they\\'re not accessible.<\/p><\/div>';\r\n                }\r\n\r\n            } catch (error) {\r\n                document.getElementById('videosSkeleton').style.display = 'none';\r\n                document.getElementById('videosContent').style.display = 'block';\r\n                document.getElementById('videosContent').innerHTML = `<div class=\"fb-empty-state\"><div class=\"fb-empty-icon\">\u274c<\/div><h3>Error loading videos<\/h3><p>${escapeHtml(error.userMessage || error.message)}<\/p><\/div>`;\r\n                console.error('Error fetching videos:', error);\r\n            }\r\n        }\r\n\r\n\r\n        function extractVideoUrls(data) {\r\n            const videoUrls = [];\r\n\r\n            const searchForVideoUrls = (obj) => {\r\n                if (typeof obj !== 'object' || obj === null) return;\r\n\r\n                for (const key in obj) {\r\n                    if (typeof obj[key] === 'string' && obj[key].includes('facebook.com') && obj[key].includes('\/videos\/')) {\r\n                        const completeVideoUrlPattern = \/https:\\\/\\\/www\\.facebook\\.com\\\/[^\\\/]+\\\/videos\\\/\\d+[^\\s]*\/;\r\n                        if (completeVideoUrlPattern.test(obj[key])) {\r\n                            videoUrls.push(obj[key]);\r\n                        }\r\n                    } else if (typeof obj[key] === 'object') {\r\n                        searchForVideoUrls(obj[key]);\r\n                    }\r\n                }\r\n            };\r\n\r\n            searchForVideoUrls(data);\r\n            return [...new Set(videoUrls)].slice(0, 6);\r\n        }\r\n\r\n\r\n        async function fetchDownloadInfo(videoUrls) {\r\n            const videosContentDiv = document.getElementById('videosContent');\r\n            videosContentDiv.innerHTML = '<div class=\"fb-loading\"><div class=\"fb-loading-spinner\"><\/div><div class=\"fb-loading-text\">Getting HD videos...<\/div><\/div>';\r\n\r\n            try {\r\n                const allResponses = [];\r\n\r\n                for (const videoUrl of videoUrls) {\r\n                    try {\r\n                        const response = await fetch('https:\/\/tools.xrespond.com\/api\/social\/all\/downloader', {\r\n                            method: 'POST',\r\n                            headers: {\r\n                                'Content-Type': 'application\/json',\r\n                                'Accept': 'application\/json'\r\n                            },\r\n                            body: JSON.stringify({ url: videoUrl })\r\n                        });\r\n\r\n                        if (response.ok) {\r\n                            const data = await response.json();\r\n                            allResponses.push({\r\n                                videoUrl: videoUrl,\r\n                                response: data,\r\n                                success: true\r\n                            });\r\n                        }\r\n                    } catch (error) {\r\n                        console.error('Error fetching video:', videoUrl, error);\r\n                    }\r\n                }\r\n\r\n                displayHDVideosGrid(allResponses);\r\n\r\n            } catch (error) {\r\n                document.getElementById('videosContent').innerHTML = '<div class=\"fb-empty-state\"><div class=\"fb-empty-icon\">\u274c<\/div><h3>Error loading videos<\/h3><p>Error fetching download information.<\/p><\/div>';\r\n            }\r\n        }\r\n\r\n\r\n        function displayHDVideosGrid(responses) {\r\n            const videosContentDiv = document.getElementById('videosContent');\r\n            allHDVideos = [];\r\n            let html = '';\r\n\r\n            responses.forEach((item, index) => {\r\n                if (!item.success) return;\r\n\r\n                const hdMediaItems = extractHDMediaItems(item.response);\r\n\r\n                hdMediaItems.forEach((mediaItem, mediaIndex) => {\r\n                    const videoId = `video-${index}-${mediaIndex}`;\r\n                    const downloadId = `download-${index}-${mediaIndex}`;\r\n                    const filename = `facebook_video_${index}_${mediaIndex}.${mediaItem.format ? mediaItem.format.toLowerCase() : 'mp4'}`;\r\n\r\n                    allHDVideos.push({\r\n                        url: mediaItem.url,\r\n                        filename: filename,\r\n                        format: mediaItem.format\r\n                    });\r\n\r\n                    html += `\r\n                <div class=\"fb-video-card\" style=\"--index: ${index}\">\r\n                    <video id=\"${videoId}\" controls preload=\"metadata\">\r\n                        <source src=\"${mediaItem.url}\" type=\"video\/${mediaItem.format ? mediaItem.format.toLowerCase() : 'mp4'}\">\r\n                        Your browser does not support the video tag.\r\n                    <\/video>\r\n                    <div class=\"fb-video-info\">\r\n                        <div class=\"fb-video-title\">Video ${index + 1}${mediaIndex > 0 ? '.' + (mediaIndex + 1) : ''}<\/div>\r\n                        <div class=\"fb-video-badges\">\r\n                            ${mediaItem.quality ? `<span class=\"fb-quality-badge\">${mediaItem.quality}<\/span>` : ''}\r\n                            ${mediaItem.format ? `<span class=\"fb-format-badge\">${mediaItem.format}<\/span>` : ''}\r\n                        <\/div>\r\n                        <div class=\"fb-video-actions\">\r\n                            <button id=\"${downloadId}\" onclick=\"downloadVideoFromUrl('${mediaItem.url}', '${filename}', '${downloadId}')\" class=\"fb-video-download-btn\">\r\n                                <span>\u2b07\ufe0f Download<\/span>\r\n                                <div class=\"fb-download-progress\" style=\"width: 0%;\"><\/div>\r\n                            <\/button>\r\n                            <button onclick=\"copyToClipboard('${mediaItem.url}')\" class=\"fb-copy-btn\">\ud83d\udccb<\/button>\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n            `;\r\n                });\r\n            });\r\n\r\n            if (allHDVideos.length > 0) {\r\n                html = `\r\n            <button onclick=\"downloadAllVideos()\" class=\"fb-download-all-btn\" id=\"downloadAllBtn\">\r\n                \u2b07\ufe0f Download All Videos (${allHDVideos.length})\r\n            <\/button>\r\n            <div class=\"fb-media-grid\">\r\n                ${html}\r\n            <\/div>\r\n        `;\r\n            } else {\r\n                html = '<div class=\"fb-empty-state\"><div class=\"fb-empty-icon\">\ud83c\udfa5<\/div><h3>No HD videos found<\/h3><p>No HD quality videos are available for download.<\/p><\/div>';\r\n            }\r\n\r\n            videosContentDiv.innerHTML = html;\r\n        }\r\n\r\n\r\n        function extractHDMediaItems(response) {\r\n            const hdMediaItems = [];\r\n\r\n            try {\r\n                if (!response || !response.medias || !Array.isArray(response.medias)) {\r\n                    return hdMediaItems;\r\n                }\r\n\r\n                response.medias.forEach(media => {\r\n                    if (media && media.url && media.quality && media.quality.toUpperCase() === 'HD') {\r\n                        hdMediaItems.push({\r\n                            url: media.url,\r\n                            quality: media.quality,\r\n                            format: media.format || 'mp4',\r\n                            thumbnail: response.thumbnail || null\r\n                        });\r\n                    }\r\n                });\r\n\r\n                return hdMediaItems;\r\n            } catch (error) {\r\n                console.error('Error extracting HD media items:', error);\r\n                return hdMediaItems;\r\n            }\r\n        }\r\n\r\n        \/\/ Download functions\r\n        async function downloadVideoFromUrl(url, filename, buttonId) {\r\n            const button = document.getElementById(buttonId);\r\n            const progressBar = button.querySelector('.fb-download-progress');\r\n            const buttonText = button.querySelector('span');\r\n\r\n            try {\r\n                button.disabled = true;\r\n                buttonText.textContent = '\u23f3 Downloading...';\r\n                progressBar.style.width = '10%';\r\n\r\n                const response = await fetch(url);\r\n                if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`);\r\n\r\n                progressBar.style.width = '50%';\r\n                const blob = await response.blob();\r\n                progressBar.style.width = '80%';\r\n\r\n                const blobUrl = window.URL.createObjectURL(blob);\r\n                const a = document.createElement('a');\r\n                a.href = blobUrl;\r\n                a.download = filename;\r\n                a.style.display = 'none';\r\n\r\n                document.body.appendChild(a);\r\n                a.click();\r\n                document.body.removeChild(a);\r\n                window.URL.revokeObjectURL(blobUrl);\r\n\r\n                progressBar.style.width = '100%';\r\n                buttonText.textContent = '\u2705 Downloaded!';\r\n\r\n                setTimeout(() => {\r\n                    button.disabled = false;\r\n                    buttonText.textContent = '\u2b07\ufe0f Download';\r\n                    progressBar.style.width = '0%';\r\n                }, 2000);\r\n\r\n            } catch (error) {\r\n                button.disabled = false;\r\n                buttonText.textContent = '\u274c Failed';\r\n                progressBar.style.width = '0%';\r\n\r\n                setTimeout(() => {\r\n                    buttonText.textContent = '\u2b07\ufe0f Download';\r\n                }, 3000);\r\n            }\r\n        }\r\n\r\n\r\n        async function downloadAllVideos() {\r\n            const button = document.getElementById('downloadAllBtn');\r\n            if (allHDVideos.length === 0) return;\r\n\r\n            try {\r\n                button.disabled = true;\r\n                button.innerHTML = '\u23f3 Downloading All...';\r\n\r\n                for (const video of allHDVideos) {\r\n                    try {\r\n                        const response = await fetch(video.url);\r\n                        if (response.ok) {\r\n                            const blob = await response.blob();\r\n                            const blobUrl = window.URL.createObjectURL(blob);\r\n\r\n                            const a = document.createElement('a');\r\n                            a.href = blobUrl;\r\n                            a.download = video.filename;\r\n                            a.style.display = 'none';\r\n\r\n                            document.body.appendChild(a);\r\n                            a.click();\r\n                            document.body.removeChild(a);\r\n                            window.URL.revokeObjectURL(blobUrl);\r\n\r\n                            await new Promise(resolve => setTimeout(resolve, 500));\r\n                        }\r\n                    } catch (error) {\r\n                        console.error('Error downloading video:', video.filename, error);\r\n                    }\r\n                }\r\n\r\n                button.innerHTML = '\u2705 All Downloaded!';\r\n\r\n                setTimeout(() => {\r\n                    button.disabled = false;\r\n                    button.innerHTML = `\u2b07\ufe0f Download All Videos (${allHDVideos.length})`;\r\n                }, 3000);\r\n\r\n            } catch (error) {\r\n                button.disabled = false;\r\n                button.innerHTML = `\u2b07\ufe0f Download All Videos (${allHDVideos.length})`;\r\n            }\r\n        }\r\n\r\n\r\n        function copyToClipboard(text) {\r\n            navigator.clipboard.writeText(text).then(() => {\r\n                alert('\ud83d\udccb Copied to clipboard!');\r\n            }).catch(() => {\r\n                const textArea = document.createElement('textarea');\r\n                textArea.value = text;\r\n                document.body.appendChild(textArea);\r\n                textArea.select();\r\n                document.execCommand('copy');\r\n                document.body.removeChild(textArea);\r\n                alert('\ud83d\udccb Copied to clipboard!');\r\n            });\r\n        }\r\n\r\n        \/\/ Group Reels Functions\r\n        async function fetchGroupReels() {\r\n            if (!currentGroupId || reelsLoaded) return;\r\n\r\n            document.getElementById('reelsContent').style.display = 'none';\r\n            document.getElementById('reelsError').style.display = 'none';\r\n            document.getElementById('reelsSkeleton').style.display = 'block';\r\n\r\n            try {\r\n                const reelsUrl = `https:\/\/www.facebook.com\/groups\/${currentGroupId}\/reels_tab`;\r\n\r\n                const data = await fetchFacebookApi({ url: reelsUrl });\r\n\r\n                document.getElementById('reelsSkeleton').style.display = 'none';\r\n                document.getElementById('reelsContent').style.display = 'block';\r\n                const reels = extractReels(data);\r\n                reelsLoaded = true;\r\n\r\n                if (reels.length > 0) {\r\n                    displayGroupReels(reels);\r\n                } else {\r\n                    document.getElementById('reelsContent').innerHTML = '<div class=\"fb-empty-state\"><div class=\"fb-empty-icon\">\ud83c\udfac<\/div><h3>No reels found<\/h3><p>This group doesn\\'t have any reels or they\\'re not accessible.<\/p><\/div>';\r\n                }\r\n\r\n            } catch (error) {\r\n                document.getElementById('reelsSkeleton').style.display = 'none';\r\n                document.getElementById('reelsContent').style.display = 'block';\r\n                document.getElementById('reelsContent').innerHTML = `<div class=\"fb-empty-state\"><div class=\"fb-empty-icon\">\u274c<\/div><h3>Error loading reels<\/h3><p>${escapeHtml(error.userMessage || error.message)}<\/p><\/div>`;\r\n                console.error('Error fetching reels:', error);\r\n            }\r\n        }\r\n\r\n        function displayGroupVideos(videos) {\r\n            const videosContent = document.getElementById('videosContent');\r\n\r\n            const html = `\r\n            <div class=\"fb-media-summary\">\r\n                <h2 class=\"fb-summary-title\">Video Collection<\/h2>\r\n                <p class=\"fb-summary-description\">Discovered ${videos.length} videos from this group<\/p>\r\n                <div class=\"fb-summary-stats\">\r\n                    <div class=\"fb-summary-stat\">\r\n                        <span class=\"fb-summary-stat-number\">${videos.length}<\/span>\r\n                        <span class=\"fb-summary-stat-label\">Total Videos<\/span>\r\n                    <\/div>\r\n                    <div class=\"fb-summary-stat\">\r\n                        <span class=\"fb-summary-stat-number\">${videos.filter(v => v.height >= 720).length}<\/span>\r\n                        <span class=\"fb-summary-stat-label\">HD Videos<\/span>\r\n                    <\/div>\r\n                    <div class=\"fb-summary-stat\">\r\n                        <span class=\"fb-summary-stat-number\">${videos.filter(v => v.videoUrl).length}<\/span>\r\n                        <span class=\"fb-summary-stat-label\">Downloadable<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n            \r\n            <div class=\"fb-video-grid\">\r\n                ${videos.map((video, index) => `\r\n                    <div class=\"fb-video-card\" style=\"--index: ${index}\" data-video-index=\"${index}\">\r\n                        <div class=\"fb-video-thumbnail\" style=\"background-image: url('${video.thumbnailUri || '\/placeholder.svg?height=200&width=350'}')\" onclick=\"playVideoInline(${index}, 'group')\">\r\n                            <div class=\"fb-video-play-icon\">\r\n                                <i class=\"fas fa-play\"><\/i>\r\n                            <\/div>\r\n                            <div class=\"fb-video-quality-badge\">${video.height >= 720 ? 'HD' : 'SD'}<\/div>\r\n                            <div class=\"fb-video-duration\">${formatDuration(video.duration)}<\/div>\r\n                            <div class=\"fb-video-overlay\">\r\n                                <div class=\"fb-video-actions\">\r\n                                    <button class=\"fb-video-action-btn\" onclick=\"event.stopPropagation(); downloadVideo(${index}, 'group')\" title=\"Download Video\">\r\n                                        <i class=\"fas fa-download\"><\/i>\r\n                                    <\/button>\r\n                                    <button class=\"fb-video-action-btn\" onclick=\"event.stopPropagation(); shareVideo(${index}, 'group')\" title=\"Share Video\">\r\n                                        <i class=\"fas fa-share\"><\/i>\r\n                                    <\/button>\r\n                                <\/div>\r\n                            <\/div>\r\n                        <\/div>\r\n                        ${video.videoUrl ? `\r\n                            <video \r\n                                class=\"fb-video-player\" \r\n                                style=\"display: none;\" \r\n                                controls \r\n                                preload=\"metadata\"\r\n                                data-src=\"${video.videoUrl}\"\r\n                            >\r\n                                <source src=\"${video.videoUrl}\" type=\"video\/mp4\">\r\n                                Your browser does not support the video tag.\r\n                            <\/video>\r\n                        ` : ''}\r\n                        <div class=\"fb-video-info\">\r\n                            <div class=\"fb-video-title\">${escapeHtml(truncateText(video.title))}<\/div>\r\n                            ${video.description && video.description.trim() ? `\r\n                                <div class=\"fb-video-description\">${escapeHtml(video.description.trim())}<\/div>\r\n                            ` : ''}\r\n                            <div class=\"fb-video-stats\">\r\n                                <div class=\"fb-video-engagement\">\r\n                                    ${video.stats && video.stats.likes > 0 ? `\r\n                                        <div class=\"fb-video-engagement-item\">\r\n                                            <i class=\"fas fa-heart\"><\/i>\r\n                                            <span>${formatNumber(video.stats.likes)}<\/span>\r\n                                        <\/div>\r\n                                    ` : ''}\r\n                                    ${video.stats && video.stats.views > 0 ? `\r\n                                        <div class=\"fb-video-engagement-item\">\r\n                                            <i class=\"fas fa-eye\"><\/i>\r\n                                            <span>${formatNumber(video.stats.views)} views<\/span>\r\n                                        <\/div>\r\n                                    ` : ''}\r\n                                <\/div>\r\n                                ${video.videoUrl ? `\r\n                                    <button class=\"fb-video-download-btn\" onclick=\"downloadVideo(${index}, 'group')\">\r\n                                        <i class=\"fas fa-download\"><\/i>\r\n                                        Download\r\n                                    <\/button>\r\n                                ` : ''}\r\n                            <\/div>\r\n                            <div class=\"fb-video-meta\">\r\n                                ${video.creationTime ? `<div>${formatTimeAgo(video.creationTime * 1000)}<\/div>` : ''}\r\n                                <div>${formatMediaDimensions(video.width, video.height)}<\/div>\r\n                            <\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n                `).join('')}\r\n            <\/div>\r\n        `;\r\n\r\n            videosContent.innerHTML = html;\r\n\r\n            \/\/ Store videos data globally for download functionality\r\n            window.groupVideosData = videos;\r\n        }\r\n\r\n        function displayGroupReels(reels) {\r\n            const reelsContent = document.getElementById('reelsContent');\r\n\r\n            const html = `\r\n            <div class=\"fb-media-summary\">\r\n                <h2 class=\"fb-summary-title\">Reels Collection<\/h2>\r\n                <p class=\"fb-summary-description\">Discovered ${reels.length} reels from this group<\/p>\r\n                <div class=\"fb-summary-stats\">\r\n                    <div class=\"fb-summary-stat\">\r\n                        <span class=\"fb-summary-stat-number\">${reels.length}<\/span>\r\n                        <span class=\"fb-summary-stat-label\">Total Reels<\/span>\r\n                    <\/div>\r\n                    <div class=\"fb-summary-stat\">\r\n                        <span class=\"fb-summary-stat-number\">${reels.filter(r => r.videoUrl).length}<\/span>\r\n                        <span class=\"fb-summary-stat-label\">Downloadable<\/span>\r\n                    <\/div>\r\n                    <div class=\"fb-summary-stat\">\r\n                        <span class=\"fb-summary-stat-number\">${formatTotalViews(reels)}<\/span>\r\n                        <span class=\"fb-summary-stat-label\">Total Views<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n            \r\n            <div class=\"fb-video-grid\">\r\n                ${reels.map((reel, index) => `\r\n                    <div class=\"fb-video-card\" style=\"--index: ${index}\" data-reel-index=\"${index}\">\r\n                        <div class=\"fb-video-thumbnail\" style=\"background-image: url('${reel.thumbnailUri || '\/placeholder.svg?height=200&width=350'}')\" onclick=\"playReelInline(${index}, 'group')\">\r\n                            <div class=\"fb-video-play-icon\">\r\n                                <i class=\"fas fa-play\"><\/i>\r\n                            <\/div>\r\n                            <div class=\"fb-reel-badge\">REEL<\/div>\r\n                            <div class=\"fb-video-duration\">${formatDuration(reel.duration)}<\/div>\r\n                            <div class=\"fb-video-overlay\">\r\n                                <div class=\"fb-video-actions\">\r\n                                    <button class=\"fb-video-action-btn\" onclick=\"event.stopPropagation(); downloadReel(${index}, 'group')\" title=\"Download Reel\">\r\n                                        <i class=\"fas fa-download\"><\/i>\r\n                                    <\/button>\r\n                                    <button class=\"fb-video-action-btn\" onclick=\"event.stopPropagation(); shareReel(${index}, 'group')\" title=\"Share Reel\">\r\n                                        <i class=\"fas fa-share\"><\/i>\r\n                                    <\/button>\r\n                                <\/div>\r\n                            <\/div>\r\n                        <\/div>\r\n                        ${reel.videoUrl ? `\r\n                            <video \r\n                                class=\"fb-video-player\" \r\n                                style=\"display: none;\" \r\n                                controls \r\n                                loop\r\n                                muted\r\n                                preload=\"metadata\"\r\n                                data-src=\"${reel.videoUrl}\"\r\n                            >\r\n                                <source src=\"${reel.videoUrl}\" type=\"video\/mp4\">\r\n                                Your browser does not support the video tag.\r\n                            <\/video>\r\n                        ` : ''}\r\n                        <div class=\"fb-video-info\">\r\n                            <div class=\"fb-video-title\">${escapeHtml(truncateText(reel.title))}<\/div>\r\n                            ${reel.description && reel.description.trim() ? `\r\n                                <div class=\"fb-video-description\">${escapeHtml(reel.description.trim())}<\/div>\r\n                            ` : ''}\r\n                            <div class=\"fb-video-stats\">\r\n                                <div class=\"fb-video-engagement\">\r\n                                    ${reel.views > 0 ? `\r\n                                        <div class=\"fb-video-engagement-item\">\r\n                                            <i class=\"fas fa-eye\"><\/i>\r\n                                            <span>${formatNumber(reel.views)} views<\/span>\r\n                                        <\/div>\r\n                                    ` : ''}\r\n                                <\/div>\r\n                                ${reel.videoUrl ? `\r\n                                    <button class=\"fb-video-download-btn\" onclick=\"downloadReel(${index}, 'group')\">\r\n                                        <i class=\"fas fa-download\"><\/i>\r\n                                        Download\r\n                                    <\/button>\r\n                                ` : ''}\r\n                            <\/div>\r\n                            <div class=\"fb-video-meta\">\r\n                                ${reel.creationTime ? `<div>${formatTimeAgo(reel.creationTime * 1000)}<\/div>` : ''}\r\n                            <\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n                `).join('')}\r\n            <\/div>\r\n        `;\r\n\r\n            reelsContent.innerHTML = html;\r\n\r\n            \/\/ Store reels data globally for download functionality\r\n            window.groupReelsData = reels;\r\n        }\r\n\r\n        \/\/ Function to fetch videos data specifically for profiles\r\n        async function fetchVideosData(username) {\r\n            if (!username) {\r\n                console.error('No username available for videos fetch');\r\n                return;\r\n            }\r\n\r\n            try {\r\n                \/\/ Construct videos URL\r\n                const videosUrl = `https:\/\/www.facebook.com\/${username}\/videos`;\r\n                console.log('Fetching videos from:', videosUrl);\r\n\r\n                const data = await fetchFacebookApi({ url: videosUrl });\r\n\r\n                document.getElementById('videos-skeleton').style.display = 'none';\r\n                document.getElementById('profile-videos-container').style.display = 'grid';\r\n                console.log('Videos API response:', data);\r\n\r\n                const videosData = extractVideosFromAPI(data.data);\r\n                console.log('Processed videos data:', videosData);\r\n\r\n                if (profileData) {\r\n                    profileData.videos = videosData;\r\n                }\r\n\r\n                document.getElementById('video-count').textContent = `${videosData.length} Videos`;\r\n\r\n                const videosContainer = document.getElementById('profile-videos-container');\r\n                if (videosData.length > 0) {\r\n                    const videosHtml = videosData.map((video, index) => `\r\n                        <div class=\"fb-video-card\" style=\"--index: ${index}\" data-video-index=\"${index}\">\r\n                            <div class=\"fb-video-thumbnail\" style=\"background-image: url('${video.thumbnailUri || '\/placeholder.svg?height=200&width=350'}')\" onclick=\"playVideoInline(${index}, 'profile')\">\r\n                                <div class=\"fb-video-play-icon\">\r\n                                    <i class=\"fas fa-play\"><\/i>\r\n                                <\/div>\r\n                                <div class=\"fb-video-quality-badge\">${video.height >= 720 ? 'HD' : 'SD'}<\/div>\r\n                                <div class=\"fb-video-duration\">${formatDuration(video.duration)}<\/div>\r\n                                <div class=\"fb-video-overlay\">\r\n                                    <div class=\"fb-video-actions\">\r\n                                        <button class=\"fb-video-action-btn\" onclick=\"event.stopPropagation(); downloadVideo(${index}, 'profile')\" title=\"Download Video\">\r\n                                            <i class=\"fas fa-download\"><\/i>\r\n                                        <\/button>\r\n                                        <button class=\"fb-video-action-btn\" onclick=\"event.stopPropagation(); shareVideo(${index}, 'profile')\" title=\"Share Video\">\r\n                                            <i class=\"fas fa-share\"><\/i>\r\n                                        <\/button>\r\n                                    <\/div>\r\n                                <\/div>\r\n                            <\/div>\r\n                            ${video.videoUrl ? `\r\n                                <video \r\n                                    class=\"fb-video-player\" \r\n                                    style=\"display: none;\" \r\n                                    controls \r\n                                    preload=\"metadata\"\r\n                                    data-src=\"${video.videoUrl}\"\r\n                                >\r\n                                    <source src=\"${video.videoUrl}\" type=\"video\/mp4\">\r\n                                    Your browser does not support the video tag.\r\n                                <\/video>\r\n                            ` : ''}\r\n                            <div class=\"fb-video-info\">\r\n                                <div class=\"fb-video-title\">${escapeHtml(truncateText(video.title))}<\/div>\r\n                                ${video.description && video.description.trim() ? `\r\n                                    <div class=\"fb-video-description\">${escapeHtml(video.description.trim())}<\/div>\r\n                                ` : ''}\r\n                                <div class=\"fb-video-stats\">\r\n                                    <div class=\"fb-video-engagement\">\r\n                                        ${video.stats && video.stats.likes > 0 ? `\r\n                                            <div class=\"fb-video-engagement-item\">\r\n                                                <i class=\"fas fa-heart\"><\/i>\r\n                                                <span>${formatNumber(video.stats.likes)}<\/span>\r\n                                            <\/div>\r\n                                        ` : ''}\r\n                                        ${video.stats && video.stats.views > 0 ? `\r\n                                            <div class=\"fb-video-engagement-item\">\r\n                                                <i class=\"fas fa-eye\"><\/i>\r\n                                                <span>${formatNumber(video.stats.views)} views<\/span>\r\n                                            <\/div>\r\n                                        ` : ''}\r\n                                    <\/div>\r\n                                    ${video.videoUrl ? `\r\n                                        <button class=\"fb-video-download-btn\" onclick=\"downloadVideo(${index}, 'profile')\">\r\n                                            <i class=\"fas fa-download\"><\/i>\r\n                                            Download\r\n                                        <\/button>\r\n                                    ` : ''}\r\n                                <\/div>\r\n                                <div class=\"fb-video-meta\">\r\n                                    ${video.creationTime ? `<div>${formatTimeAgo(video.creationTime * 1000)}<\/div>` : ''}\r\n                                    <div>${formatMediaDimensions(video.width, video.height)}<\/div>\r\n                                <\/div>\r\n                            <\/div>\r\n                        <\/div>\r\n                    `).join('');\r\n\r\n                    videosContainer.innerHTML = videosHtml;\r\n                    window.profileVideosData = videosData;\r\n                } else {\r\n                    videosContainer.innerHTML = '<div class=\"fb-no-data-message\">No videos found for this profile.<\/div>';\r\n                }\r\n            } catch (error) {\r\n                console.error('Error fetching videos data:', error);\r\n                document.getElementById('videos-skeleton').style.display = 'none';\r\n                document.getElementById('profile-videos-container').style.display = 'grid';\r\n                document.getElementById('profile-videos-container').innerHTML = `<div class=\"fb-no-data-message\">Error loading videos: ${escapeHtml(error.userMessage || error.message)}<\/div>`;\r\n            }\r\n        }\r\n\r\n        \/\/ Function to fetch reels data specifically for profiles\r\n        async function fetchReelsData(username) {\r\n            if (!username) {\r\n                console.error('No username available for reels fetch');\r\n                return;\r\n            }\r\n\r\n            try {\r\n                \/\/ Construct reels URL\r\n                const reelsUrl = `https:\/\/www.facebook.com\/${username}\/reels`;\r\n                console.log('Fetching reels from:', reelsUrl);\r\n\r\n                const data = await fetchFacebookApi({ url: reelsUrl });\r\n\r\n                document.getElementById('reels-skeleton').style.display = 'none';\r\n                document.getElementById('profile-reels-container').style.display = 'grid';\r\n                console.log('Reels API response:', data);\r\n\r\n                const reelsData = extractReels(data.data);\r\n                console.log('Processed reels data:', reelsData);\r\n\r\n                if (profileData) {\r\n                    profileData.reels = reelsData;\r\n                }\r\n\r\n                document.getElementById('reels-count').textContent = `${reelsData.length} Reels`;\r\n\r\n                const reelsContainer = document.getElementById('profile-reels-container');\r\n                if (reelsData.length > 0) {\r\n                    const reelsHtml = reelsData.map((reel, index) => `\r\n                        <div class=\"fb-video-card\" style=\"--index: ${index}\" data-reel-index=\"${index}\">\r\n                            <div class=\"fb-video-thumbnail\" style=\"background-image: url('${reel.thumbnailUri || '\/placeholder.svg?height=200&width=350'}')\" onclick=\"playReelInline(${index}, 'profile')\">\r\n                                <div class=\"fb-video-play-icon\">\r\n                                    <i class=\"fas fa-play\"><\/i>\r\n                                <\/div>\r\n                                <div class=\"fb-reel-badge\">REEL<\/div>\r\n                                <div class=\"fb-video-duration\">${formatDuration(reel.duration)}<\/div>\r\n                                <div class=\"fb-video-overlay\">\r\n                                    <div class=\"fb-video-actions\">\r\n                                        <button class=\"fb-video-action-btn\" onclick=\"event.stopPropagation(); downloadReel(${index}, 'profile')\" title=\"Download Reel\">\r\n                                            <i class=\"fas fa-download\"><\/i>\r\n                                        <\/button>\r\n                                        <button class=\"fb-video-action-btn\" onclick=\"event.stopPropagation(); shareReel(${index}, 'profile')\" title=\"Share Reel\">\r\n                                            <i class=\"fas fa-share\"><\/i>\r\n                                        <\/button>\r\n                                    <\/div>\r\n                                <\/div>\r\n                            <\/div>\r\n                            ${reel.videoUrl ? `\r\n                                <video \r\n                                    class=\"fb-video-player\" \r\n                                    style=\"display: none;\" \r\n                                    controls \r\n                                    loop\r\n                                    muted\r\n                                    preload=\"metadata\"\r\n                                    data-src=\"${reel.videoUrl}\"\r\n                                >\r\n                                    <source src=\"${reel.videoUrl}\" type=\"video\/mp4\">\r\n                                    Your browser does not support the video tag.\r\n                                <\/video>\r\n                            ` : ''}\r\n                            <div class=\"fb-video-info\">\r\n                                <div class=\"fb-video-title\">${escapeHtml(truncateText(reel.title))}<\/div>\r\n                                <div class=\"fb-video-stats\">\r\n                                    <div class=\"fb-video-engagement\">\r\n                                        ${reel.views > 0 ? `\r\n                                            <div class=\"fb-video-engagement-item\">\r\n                                                <i class=\"fas fa-eye\"><\/i>\r\n                                                <span>${formatNumber(reel.views)} views<\/span>\r\n                                            <\/div>\r\n                                        ` : ''}\r\n                                    <\/div>\r\n                                    ${reel.videoUrl ? `\r\n                                        <button class=\"fb-video-download-btn\" onclick=\"downloadReel(${index}, 'profile')\">\r\n                                            <i class=\"fas fa-download\"><\/i>\r\n                                            Download\r\n                                        <\/button>\r\n                                    ` : ''}\r\n                                <\/div>\r\n                                <div class=\"fb-video-meta\">\r\n                                    ${reel.creationTime ? `<div>${formatTimeAgo(reel.creationTime * 1000)}<\/div>` : ''}\r\n                                <\/div>\r\n                            <\/div>\r\n                        <\/div>\r\n                    `).join('');\r\n\r\n                    reelsContainer.innerHTML = reelsHtml;\r\n                    window.profileReelsData = reelsData;\r\n                } else {\r\n                    reelsContainer.innerHTML = '<div class=\"fb-no-data-message\">No reels found for this profile.<\/div>';\r\n                }\r\n            } catch (error) {\r\n                console.error('Error fetching reels data:', error);\r\n                document.getElementById('reels-skeleton').style.display = 'none';\r\n                document.getElementById('profile-reels-container').style.display = 'grid';\r\n                document.getElementById('profile-reels-container').innerHTML = `<div class=\"fb-no-data-message\">Error loading reels: ${escapeHtml(error.userMessage || error.message)}<\/div>`;\r\n            }\r\n        }\r\n\r\n        \/\/ Video Playback Functions\r\n        function pauseOtherVideos(currentVideoPlayer) {\r\n            document.querySelectorAll('video.fb-video-player').forEach(otherVideo => {\r\n                if (otherVideo !== currentVideoPlayer && !otherVideo.paused) {\r\n                    otherVideo.pause();\r\n                    const otherContainer = otherVideo.closest('.fb-video-card');\r\n                    if (otherContainer) {\r\n                        const otherThumbnail = otherContainer.querySelector('.fb-video-thumbnail');\r\n                        if (otherThumbnail) {\r\n                            otherVideo.style.display = 'none';\r\n                            otherThumbnail.style.display = 'flex';\r\n                        }\r\n                    }\r\n                }\r\n            });\r\n        }\r\n\r\n        function playVideoInline(index, type) {\r\n            let videoData;\r\n            let container;\r\n\r\n            if (type === 'group') {\r\n                videoData = window.groupVideosData;\r\n                container = document.querySelector(`[data-video-index=\"${index}\"]`);\r\n            } else if (type === 'profile') {\r\n                videoData = window.profileVideosData || (profileData ? profileData.videos : []);\r\n                container = document.querySelector(`[data-video-index=\"${index}\"]`);\r\n            }\r\n\r\n            if (!videoData || !videoData[index] || !container) {\r\n                console.error('Video data not found');\r\n                return;\r\n            }\r\n\r\n            const video = videoData[index];\r\n            const thumbnail = container.querySelector('.fb-video-thumbnail');\r\n            const videoPlayer = container.querySelector('.fb-video-player');\r\n\r\n            if (!videoPlayer || !video.videoUrl) {\r\n                console.error('Video player or URL not found');\r\n                return;\r\n            }\r\n\r\n            pauseOtherVideos(videoPlayer);\r\n\r\n            \/\/ Hide thumbnail and show video player\r\n            thumbnail.style.display = 'none';\r\n            videoPlayer.style.display = 'block';\r\n\r\n            \/\/ Load video source if not already loaded\r\n            if (!videoPlayer.src && videoPlayer.dataset.src) {\r\n                videoPlayer.src = videoPlayer.dataset.src;\r\n            }\r\n\r\n            \/\/ Play the video\r\n            videoPlayer.play().catch(error => {\r\n                console.error('Error playing video:', error);\r\n                \/\/ Show thumbnail again if video fails to play\r\n                thumbnail.style.display = 'block';\r\n                videoPlayer.style.display = 'none';\r\n            });\r\n\r\n            \/\/ Add event listener to show thumbnail when video ends\r\n            videoPlayer.addEventListener('ended', function () {\r\n                thumbnail.style.display = 'block';\r\n                videoPlayer.style.display = 'none';\r\n            });\r\n\r\n            \/\/ Add event listener to show thumbnail when video is paused\r\n            videoPlayer.addEventListener('pause', function () {\r\n                if (videoPlayer.currentTime === 0 || videoPlayer.ended) {\r\n                    thumbnail.style.display = 'block';\r\n                    videoPlayer.style.display = 'none';\r\n                }\r\n            });\r\n        }\r\n\r\n        function playReelInline(index, type) {\r\n            let reelData;\r\n            let container;\r\n\r\n            if (type === 'group') {\r\n                reelData = window.groupReelsData;\r\n                container = document.querySelector(`[data-reel-index=\"${index}\"]`);\r\n            } else if (type === 'profile') {\r\n                reelData = window.profileReelsData || (profileData ? profileData.reels : []);\r\n                container = document.querySelector(`[data-reel-index=\"${index}\"]`);\r\n            }\r\n\r\n            if (!reelData || !reelData[index] || !container) {\r\n                console.error('Reel data not found');\r\n                return;\r\n            }\r\n\r\n            const reel = reelData[index];\r\n            const thumbnail = container.querySelector('.fb-video-thumbnail');\r\n            const videoPlayer = container.querySelector('.fb-video-player');\r\n\r\n            if (!videoPlayer || !reel.videoUrl) {\r\n                console.error('Video player or URL not found');\r\n                return;\r\n            }\r\n\r\n            pauseOtherVideos(videoPlayer);\r\n\r\n            \/\/ Hide thumbnail and show video player\r\n            thumbnail.style.display = 'none';\r\n            videoPlayer.style.display = 'block';\r\n\r\n            \/\/ Load video source if not already loaded\r\n            if (!videoPlayer.src && videoPlayer.dataset.src) {\r\n                videoPlayer.src = videoPlayer.dataset.src;\r\n            }\r\n\r\n            \/\/ Play the video\r\n            videoPlayer.play().catch(error => {\r\n                console.error('Error playing reel:', error);\r\n                \/\/ Show thumbnail again if video fails to play\r\n                thumbnail.style.display = 'block';\r\n                videoPlayer.style.display = 'none';\r\n            });\r\n\r\n            \/\/ Add event listener to show thumbnail when video ends (reels loop, so this might not trigger)\r\n            videoPlayer.addEventListener('ended', function () {\r\n                thumbnail.style.display = 'block';\r\n                videoPlayer.style.display = 'none';\r\n            });\r\n\r\n            \/\/ Add event listener to show thumbnail when video is paused\r\n            videoPlayer.addEventListener('pause', function () {\r\n                if (videoPlayer.currentTime === 0 || videoPlayer.ended) {\r\n                    thumbnail.style.display = 'block';\r\n                    videoPlayer.style.display = 'none';\r\n                }\r\n            });\r\n        }\r\n\r\n        \/\/ Download Functions with Progress Indicator\r\n        function showDownloadProgress(filename) {\r\n            const modal = document.getElementById('download-progress-modal');\r\n            const title = document.getElementById('download-progress-title');\r\n            const fill = document.getElementById('download-progress-fill');\r\n            const text = document.getElementById('download-progress-text');\r\n\r\n            title.textContent = `Downloading ${filename}`;\r\n            fill.style.width = '0%';\r\n            text.textContent = 'Preparing download...';\r\n            modal.classList.add('active');\r\n\r\n            return {\r\n                updateProgress: (percent, status) => {\r\n                    fill.style.width = `${percent}%`;\r\n                    text.textContent = status;\r\n                },\r\n                complete: () => {\r\n                    fill.style.width = '100%';\r\n                    text.textContent = 'Download complete!';\r\n                    setTimeout(() => {\r\n                        modal.classList.remove('active');\r\n                    }, 2000);\r\n                },\r\n                error: (message) => {\r\n                    text.textContent = `Error: ${message}`;\r\n                    setTimeout(() => {\r\n                        modal.classList.remove('active');\r\n                    }, 3000);\r\n                }\r\n            };\r\n        }\r\n\r\n        async function downloadImage(url, filename, button) {\r\n            const progress = showDownloadProgress(filename);\r\n\r\n            try {\r\n                \/\/ Update button state\r\n                const originalText = button.innerHTML;\r\n                button.innerHTML = '<span class=\"fb-btn-icon\">\u23f3<\/span><span>Downloading...<\/span>';\r\n                button.disabled = true;\r\n\r\n                progress.updateProgress(10, 'Fetching image...');\r\n\r\n                const response = await fetch(url);\r\n                if (!response.ok) throw new Error('Network response was not ok');\r\n\r\n                progress.updateProgress(50, 'Processing image...');\r\n\r\n                const blob = await response.blob();\r\n\r\n                progress.updateProgress(80, 'Preparing download...');\r\n\r\n                const downloadUrl = window.URL.createObjectURL(blob);\r\n                const a = document.createElement('a');\r\n                a.href = downloadUrl;\r\n                a.download = filename;\r\n                document.body.appendChild(a);\r\n                a.click();\r\n                document.body.removeChild(a);\r\n                window.URL.revokeObjectURL(downloadUrl);\r\n\r\n                progress.complete();\r\n\r\n                \/\/ Restore button state\r\n                button.innerHTML = originalText;\r\n                button.disabled = false;\r\n\r\n            } catch (error) {\r\n                console.error('Download failed:', error);\r\n                progress.error('Download failed');\r\n\r\n                \/\/ Restore button state\r\n                button.innerHTML = originalText;\r\n                button.disabled = false;\r\n            }\r\n        }\r\n\r\n        function downloadVideo(index, type) {\r\n            let videoData;\r\n\r\n            if (type === 'group') {\r\n                videoData = window.groupVideosData;\r\n            } else if (type === 'profile') {\r\n                videoData = window.profileVideosData || (profileData ? profileData.videos : []);\r\n            }\r\n\r\n            if (!videoData || !videoData[index]) {\r\n                console.error('Video data not found');\r\n                return;\r\n            }\r\n\r\n            const video = videoData[index];\r\n            if (!video.videoUrl) {\r\n                alert('Video URL not available for download');\r\n                return;\r\n            }\r\n\r\n            const filename = `video-${index + 1}-${video.title.replace(\/[^a-z0-9]\/gi, '_').toLowerCase()}.mp4`;\r\n            downloadVideoFile(video.videoUrl, filename);\r\n        }\r\n\r\n        function downloadReel(index, type) {\r\n            let reelData;\r\n\r\n            if (type === 'group') {\r\n                reelData = window.groupReelsData;\r\n            } else if (type === 'profile') {\r\n                reelData = window.profileReelsData || (profileData ? profileData.reels : []);\r\n            }\r\n\r\n            if (!reelData || !reelData[index]) {\r\n                console.error('Reel data not found');\r\n                return;\r\n            }\r\n\r\n            const reel = reelData[index];\r\n            if (!reel.videoUrl) {\r\n                alert('Reel URL not available for download');\r\n                return;\r\n            }\r\n\r\n            const filename = `reel-${index + 1}-${reel.title.replace(\/[^a-z0-9]\/gi, '_').toLowerCase()}.mp4`;\r\n            downloadVideoFile(reel.videoUrl, filename);\r\n        }\r\n\r\n        async function downloadVideoFile(url, filename) {\r\n            const progress = showDownloadProgress(filename);\r\n            downloadAbortController = new AbortController();\r\n            const signal = downloadAbortController.signal;\r\n\r\n            const cancelButton = document.getElementById('download-cancel-btn');\r\n            cancelButton.style.display = 'block';\r\n            cancelButton.onclick = () => {\r\n                downloadAbortController.abort();\r\n            };\r\n\r\n            try {\r\n                progress.updateProgress(10, 'Fetching video...');\r\n\r\n                const response = await fetch(url, { signal });\r\n                if (!response.ok) throw new Error('Network response was not ok');\r\n\r\n                const contentLength = response.headers.get('content-length');\r\n                const total = parseInt(contentLength, 10);\r\n                let loaded = 0;\r\n\r\n                const reader = response.body.getReader();\r\n                const chunks = [];\r\n\r\n                while (true) {\r\n                    const { done, value } = await reader.read();\r\n\r\n                    if (done) break;\r\n\r\n                    chunks.push(value);\r\n                    loaded += value.length;\r\n\r\n                    if (total) {\r\n                        const percent = Math.round((loaded \/ total) * 100);\r\n                        progress.updateProgress(percent, `Downloading... ${formatBytes(loaded)} \/ ${formatBytes(total)}`);\r\n                    } else {\r\n                        progress.updateProgress(50, `Downloading... ${formatBytes(loaded)}`);\r\n                    }\r\n                }\r\n\r\n                progress.updateProgress(90, 'Processing video...');\r\n\r\n                const blob = new Blob(chunks);\r\n                const downloadUrl = window.URL.createObjectURL(blob);\r\n                const a = document.createElement('a');\r\n                a.href = downloadUrl;\r\n                a.download = filename;\r\n                document.body.appendChild(a);\r\n                a.click();\r\n                document.body.removeChild(a);\r\n                window.URL.revokeObjectURL(downloadUrl);\r\n\r\n                progress.complete();\r\n\r\n            } catch (error) {\r\n                if (error.name === 'AbortError') {\r\n                    progress.error('Download canceled');\r\n                } else {\r\n                    console.error('Video download failed:', error);\r\n                    progress.error('Download failed');\r\n                }\r\n            } finally {\r\n                cancelButton.style.display = 'none';\r\n                downloadAbortController = null;\r\n            }\r\n        }\r\n\r\n        \/\/ Share Functions\r\n        function shareVideo(index, type) {\r\n            let videoData;\r\n\r\n            if (type === 'group') {\r\n                videoData = window.groupVideosData;\r\n            } else if (type === 'profile') {\r\n                videoData = window.profileVideosData || (profileData ? profileData.videos : []);\r\n            }\r\n\r\n            if (!videoData || !videoData[index]) {\r\n                console.error('Video data not found');\r\n                return;\r\n            }\r\n\r\n            const video = videoData[index];\r\n\r\n            if (navigator.share) {\r\n                navigator.share({\r\n                    title: video.title,\r\n                    text: video.description || 'Check out this video!',\r\n                    url: video.videoUrl || window.location.href\r\n                }).catch(console.error);\r\n            } else {\r\n                \/\/ Fallback: copy to clipboard\r\n                const shareText = `${video.title}\\n${video.videoUrl || window.location.href}`;\r\n                navigator.clipboard.writeText(shareText).then(() => {\r\n                    alert('Video link copied to clipboard!');\r\n                }).catch(() => {\r\n                    alert('Unable to share video');\r\n                });\r\n            }\r\n        }\r\n\r\n        function shareReel(index, type) {\r\n            let reelData;\r\n\r\n            if (type === 'group') {\r\n                reelData = window.groupReelsData;\r\n            } else if (type === 'profile') {\r\n                reelData = window.profileReelsData || (profileData ? profileData.reels : []);\r\n            }\r\n\r\n            if (!reelData || !reelData[index]) {\r\n                console.error('Reel data not found');\r\n                return;\r\n            }\r\n\r\n            const reel = reelData[index];\r\n\r\n            if (navigator.share) {\r\n                navigator.share({\r\n                    title: reel.title,\r\n                    text: 'Check out this reel!',\r\n                    url: reel.videoUrl || window.location.href\r\n                }).catch(console.error);\r\n            } else {\r\n                \/\/ Fallback: copy to clipboard\r\n                const shareText = `${reel.title}\\n${reel.videoUrl || window.location.href}`;\r\n                navigator.clipboard.writeText(shareText).then(() => {\r\n                    alert('Reel link copied to clipboard!');\r\n                }).catch(() => {\r\n                    alert('Unable to share reel');\r\n                });\r\n            }\r\n        }\r\n\r\n        \/\/ Photo Modal Functions\r\n        function openPhotoModal(photoUrl, index) {\r\n            const modal = document.getElementById('fb-photomodal');\r\n            const modalImage = document.getElementById('fb-photomodal-image');\r\n            const modalTitle = document.getElementById('fb-photomodal-title');\r\n            const modalStats = document.getElementById('fb-photomodal-stats');\r\n\r\n            \/\/ Set current photo data\r\n            currentPhotoData = {\r\n                url: photoUrl,\r\n                index: index\r\n            };\r\n\r\n            \/\/ Update modal content\r\n            modalImage.src = photoUrl;\r\n            modalTitle.textContent = `Photo ${index + 1}`;\r\n\r\n            \/\/ Update stats if available\r\n            let photo = null;\r\n            if (profileData && profileData.photos && profileData.photos[index]) {\r\n                photo = profileData.photos[index];\r\n            }\r\n\r\n            if (photo) {\r\n                modalStats.innerHTML = `\r\n                <div class=\"fb-photomodal-stat\">\r\n                    <div class=\"fb-photomodal-stat-value\">${photo.likes}<\/div>\r\n                    <div class=\"fb-photomodal-stat-label\">Likes<\/div>\r\n                <\/div>\r\n                <div class=\"fb-photomodal-stat\">\r\n                    <div class=\"fb-photomodal-stat-value\">${photo.comments}<\/div>\r\n                    <div class=\"fb-photomodal-stat-label\">Comments<\/div>\r\n                <\/div>\r\n                <div class=\"fb-photomodal-stat\">\r\n                    <div class=\"fb-photomodal-stat-value\">${formatMediaDimensions(photo.width, photo.height)}<\/div>\r\n                    <div class=\"fb-photomodal-stat-label\">Resolution<\/div>\r\n                <\/div>\r\n                <div class=\"fb-photomodal-stat\">\r\n                    <div class=\"fb-photomodal-stat-value\">${formatDate(photo.created_time)}<\/div>\r\n                    <div class=\"fb-photomodal-stat-label\">Date<\/div>\r\n                <\/div>\r\n            `;\r\n            } else {\r\n                modalStats.innerHTML = `\r\n                <div class=\"fb-photomodal-stat\">\r\n                    <div class=\"fb-photomodal-stat-value\">N\/A<\/div>\r\n                    <div class=\"fb-photomodal-stat-label\">Likes<\/div>\r\n                <\/div>\r\n                <div class=\"fb-photomodal-stat\">\r\n                    <div class=\"fb-photomodal-stat-value\">N\/A<\/div>\r\n                    <div class=\"fb-photomodal-stat-label\">Comments<\/div>\r\n                <\/div>\r\n            `;\r\n            }\r\n\r\n            \/\/ Show modal\r\n            modal.classList.add('active');\r\n\r\n            \/\/ Add escape key listener\r\n            document.addEventListener('keydown', handleModalKeydown);\r\n        }\r\n\r\n        function closePhotoModal() {\r\n            const modal = document.getElementById('fb-photomodal');\r\n            modal.classList.remove('active');\r\n            currentPhotoData = null;\r\n\r\n            \/\/ Remove escape key listener\r\n            document.removeEventListener('keydown', handleModalKeydown);\r\n        }\r\n\r\n        function handleModalKeydown(event) {\r\n            if (event.key === 'Escape') {\r\n                closePhotoModal();\r\n            }\r\n        }\r\n\r\n        function downloadCurrentPhoto() {\r\n            if (!currentPhotoData) return;\r\n\r\n            const filename = `photo-${currentPhotoData.index + 1}.jpg`;\r\n            downloadImage(currentPhotoData.url, filename, {\r\n                innerHTML: '<i class=\"fas fa-download\"><\/i> Download Original',\r\n                disabled: false\r\n            });\r\n        }\r\n\r\n        function shareCurrentPhoto() {\r\n            if (!currentPhotoData) return;\r\n\r\n            if (navigator.share) {\r\n                navigator.share({\r\n                    title: `Photo ${currentPhotoData.index + 1}`,\r\n                    text: 'Check out this photo!',\r\n                    url: currentPhotoData.url\r\n                }).catch(console.error);\r\n            } else {\r\n                navigator.clipboard.writeText(currentPhotoData.url).then(() => {\r\n                    alert('Photo link copied to clipboard!');\r\n                }).catch(() => {\r\n                    alert('Unable to share photo');\r\n                });\r\n            }\r\n        }\r\n\r\n        function viewOnFacebook() {\r\n            if (currentUrl) {\r\n                window.open(currentUrl, '_blank');\r\n            }\r\n        }\r\n\r\n        function sharePhoto(photoUrl) {\r\n            if (navigator.share) {\r\n                navigator.share({\r\n                    title: 'Photo',\r\n                    text: 'Check out this photo!',\r\n                    url: photoUrl\r\n                }).catch(console.error);\r\n            } else {\r\n                navigator.clipboard.writeText(photoUrl).then(() => {\r\n                    alert('Photo link copied to clipboard!');\r\n                }).catch(() => {\r\n                    alert('Unable to share photo');\r\n                });\r\n            }\r\n        }\r\n\r\n        \/\/ Export Functions\r\n        function exportProfileData() {\r\n            if (!profileData) {\r\n                alert('No profile data available to export');\r\n                return;\r\n            }\r\n\r\n            const exportData = {\r\n                profile: {\r\n                    name: profileData.basicInfo.name,\r\n                    username: currentUsername,\r\n                    profilePicture: profileData.basicInfo.profilePicture,\r\n                    coverPhoto: profileData.basicInfo.coverPhoto,\r\n                    isVerified: profileData.basicInfo.isVerified\r\n                },\r\n                stats: {\r\n                    photos: profileData.photos.length,\r\n                    videos: profileData.videos.length,\r\n                    reels: profileData.reels.length,\r\n                    posts: profileData.posts.length\r\n                },\r\n                photos: profileData.photos.map(photo => ({\r\n                    url: photo.url,\r\n                    width: photo.width,\r\n                    height: photo.height,\r\n                    likes: photo.likes,\r\n                    comments: photo.comments,\r\n                    created_time: photo.created_time\r\n                })),\r\n                videos: profileData.videos.map(video => ({\r\n                    title: video.title,\r\n                    thumbnailUri: video.thumbnailUri,\r\n                    videoUrl: video.videoUrl,\r\n                    duration: video.duration,\r\n                    stats: video.stats,\r\n                    creationTime: video.creationTime\r\n                })),\r\n                reels: profileData.reels.map(reel => ({\r\n                    title: reel.title,\r\n                    thumbnailUri: reel.thumbnailUri,\r\n                    videoUrl: reel.videoUrl,\r\n                    duration: reel.duration,\r\n                    views: reel.views,\r\n                    creationTime: reel.creationTime\r\n                })),\r\n                exportedAt: new Date().toISOString()\r\n            };\r\n\r\n            const dataStr = JSON.stringify(exportData, null, 2);\r\n            const dataBlob = new Blob([dataStr], { type: 'application\/json' });\r\n            const url = URL.createObjectURL(dataBlob);\r\n\r\n            const a = document.createElement('a');\r\n            a.href = url;\r\n            a.download = `${currentUsername || 'profile'}_data_${new Date().toISOString().split('T')[0]}.json`;\r\n            document.body.appendChild(a);\r\n            a.click();\r\n            document.body.removeChild(a);\r\n            URL.revokeObjectURL(url);\r\n        }\r\n\r\n        \/\/ Utility Functions\r\n        function escapeHtml(text) {\r\n            if (!text) return '';\r\n               const map = {\r\n        '&': '&' + 'amp;',\r\n        '<': '&' + 'lt;',\r\n        '>': '&' + 'gt;',\r\n        '\"': '&' + 'quot;',\r\n        \"'\": '&' + '#039;'\r\n    };\r\n            return text.replace(\/[&<>\"']\/g, function (m) { return map[m]; });\r\n        }\r\n\r\n        function truncateText(text, length = 100) {\r\n            if (!text || text.length <= length) {\r\n                return text;\r\n            }\r\n            return text.substring(0, length) + '...';\r\n        }\r\n\r\n        function formatDate(timestamp) {\r\n            if (!timestamp) return 'Unknown';\r\n            const date = new Date(timestamp);\r\n            return date.toLocaleDateString('en-US', {\r\n                year: 'numeric',\r\n                month: 'short',\r\n                day: 'numeric'\r\n            });\r\n        }\r\n\r\n        function formatTimeAgo(timestamp) {\r\n            if (!timestamp) return 'Unknown';\r\n            const now = new Date();\r\n            const date = new Date(timestamp);\r\n            const diffInSeconds = Math.floor((now - date) \/ 1000);\r\n\r\n            if (diffInSeconds < 60) return 'Just now';\r\n            if (diffInSeconds < 3600) return `${Math.floor(diffInSeconds \/ 60)}m ago`;\r\n            if (diffInSeconds < 86400) return `${Math.floor(diffInSeconds \/ 3600)}h ago`;\r\n            if (diffInSeconds < 2592000) return `${Math.floor(diffInSeconds \/ 86400)}d ago`;\r\n            if (diffInSeconds < 31536000) return `${Math.floor(diffInSeconds \/ 2592000)}mo ago`;\r\n            return `${Math.floor(diffInSeconds \/ 31536000)}y ago`;\r\n        }\r\n\r\n        function formatDuration(milliseconds) {\r\n            if (!milliseconds) return '0:00';\r\n            const seconds = Math.floor(milliseconds \/ 1000);\r\n            const minutes = Math.floor(seconds \/ 60);\r\n            const remainingSeconds = seconds % 60;\r\n            return `${minutes}:${remainingSeconds.toString().padStart(2, '0')}`;\r\n        }\r\n\r\n        function formatNumber(num) {\r\n            if (!num) return '0';\r\n            if (num >= 1000000) return (num \/ 1000000).toFixed(1) + 'M';\r\n            if (num >= 1000) return (num \/ 1000).toFixed(1) + 'K';\r\n            return num.toString();\r\n        }\r\n\r\n        function formatBytes(bytes) {\r\n            if (bytes === 0) return '0 Bytes';\r\n            const k = 1024;\r\n            const sizes = ['Bytes', 'KB', 'MB', 'GB'];\r\n            const i = Math.floor(Math.log(bytes) \/ Math.log(k));\r\n            return parseFloat((bytes \/ Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];\r\n        }\r\n\r\n        function formatTotalViews(reels) {\r\n            const total = reels.reduce((sum, reel) => sum + (reel.views || 0), 0);\r\n            return formatNumber(total);\r\n        }\r\n\r\n        \/\/ Click outside modal to close\r\n        document.getElementById('fb-photomodal').addEventListener('click', function (event) {\r\n            if (event.target === this) {\r\n                closePhotoModal();\r\n            }\r\n        });\r\n\r\n        \/\/ Initialize page\r\n        document.addEventListener('DOMContentLoaded', function () {\r\n            console.log('Facebook Feature Viewer loaded');\r\n\r\n            \/\/ Add some sample URLs for testing\r\n            const urlInput = document.getElementById('urlInput');\r\n            urlInput.addEventListener('focus', function () {\r\n                if (!this.value) {\r\n                    this.placeholder = 'e.g., https:\/\/www.facebook.com\/groups\/example or https:\/\/www.facebook.com\/username';\r\n                }\r\n            });\r\n\r\n            urlInput.addEventListener('blur', function () {\r\n                if (!this.value) {\r\n                    this.placeholder = 'Enter Facebook group or profile URL...';\r\n                }\r\n            });\r\n        });\r\n\r\n        \/\/ Global error handler\r\n        window.addEventListener('error', function (event) {\r\n            console.error('Global error:', event.error);\r\n        });\r\n\r\n        \/\/ Global unhandled promise rejection handler\r\n        window.addEventListener('unhandledrejection', function (event) {\r\n            console.error('Unhandled promise rejection:', event.reason);\r\n        });\r\n\r\n        function findTopCoverImage(data) {\r\n            const images = getUniqueImages(extractAllImages(data)).filter(shouldKeepMediaItem);\r\n            return images.length > 0 ? images[0].uri : '';\r\n        }\r\n    <\/script>\r\n\r\n<!-- Content Section Section Start From Here  -->\r\n\r\n\r\n<!-- Content Section Section Start From Here  -->\r\n\r\n<!-- Supportive Content Sections for Facebook Feature Viewer -->\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.0\/css\/all.min.css\">\r\n\r\n<div class=\"fv-content-area\">\r\n    <style>\r\n        .fv-content-area {\r\n            font-family: 'Inter', sans-serif;\r\n            width: 100%;\r\n            line-height: 1.6;\r\n            color: #1c2a4a; \/* Inherited from primary-800 *\/\r\n        }\r\n\r\n        .fv-content-area * {\r\n            box-sizing: border-box;\r\n            margin: 0;\r\n            padding: 0;\r\n        }\r\n\r\n        \/* Standardized Section Styling *\/\r\n        .fv-section {\r\n            width: 100%;\r\n            padding: clamp(50px, 8vw, 90px) 20px;\r\n        }\r\n\r\n        .fv-container {\r\n            max-width: 1200px;\r\n            margin: 0 auto;\r\n        }\r\n\r\n        \/* WH Type Gradient Headings *\/\r\n        .fv-hd-group {\r\n            text-align: center;\r\n            margin-bottom: clamp(40px, 6vw, 60px);\r\n        }\r\n\r\n        .fv-main-hd {\r\n            font-size: clamp(1.75rem, 4vw, 2.75rem);\r\n            font-weight: 800;\r\n            margin-bottom: 1rem;\r\n            background: linear-gradient(135deg, #4267B2 0%, #1877F2 100%);\r\n            -webkit-background-clip: text;\r\n            -webkit-text-fill-color: transparent;\r\n            line-height: 1.2;\r\n        }\r\n\r\n        .fv-sub-hd {\r\n            font-size: clamp(0.95rem, 1.5vw, 1.1rem);\r\n            color: #65676B; \/* Inherited from text-secondary *\/\r\n            max-width: 800px;\r\n            margin: 0 auto;\r\n        }\r\n\r\n        \/* Grid Layouts *\/\r\n        .fv-grid {\r\n            display: grid;\r\n            grid-template-columns: repeat(4, 1fr);\r\n            gap: 25px;\r\n        }\r\n\r\n        @media (max-width: 1024px) { .fv-grid { grid-template-columns: repeat(2, 1fr); } }\r\n        @media (max-width: 600px) { .fv-grid { grid-template-columns: 1fr; } }\r\n\r\n        \/* Card Base Styling *\/\r\n        .fv-card {\r\n            border-radius: 10px;\r\n            padding: 30px 20px;\r\n            transition: all 0.4s ease;\r\n            position: relative;\r\n            animation: fvFadeIn 0.8s ease forwards;\r\n        }\r\n\r\n        .fv-icon {\r\n            font-size: 2.5rem;\r\n            color: #4267B2; \/* Tool Primary Color *\/\r\n            margin-bottom: 20px;\r\n            display: inline-block;\r\n            transition: all 0.5s ease;\r\n        }\r\n\r\n        .fv-card-title {\r\n            font-size: 1.25rem;\r\n            font-weight: 700;\r\n            color: #050505;\r\n            margin-bottom: 10px;\r\n        }\r\n\r\n        .fv-card-text {\r\n            font-size: 0.95rem;\r\n            color: #65676B;\r\n        }\r\n\r\n        @keyframes fvFadeIn {\r\n            from { opacity: 0; transform: translateY(20px); }\r\n            to { opacity: 1; transform: translateY(0); }\r\n        }\r\n\r\n        \/* =========================================\r\n           SECTION 1: BG #fff, Card #f0f7ff\r\n           Interaction: Card lift with layered shadow\r\n           Icon: Icon slight rotate\r\n        ========================================= *\/\r\n        .fv-sec-1 { background-color: #ffffff; }\r\n        .fv-card-s1 { background-color: #f0f4ff; text-align: center; border: 1px solid #e0e7ff; }\r\n        \r\n        .fv-card-s1:hover {\r\n            transform: translateY(-12px);\r\n            box-shadow: 0 10px 15px -3px rgba(66, 103, 178, 0.1), \r\n                        0 20px 25px -5px rgba(66, 103, 178, 0.05);\r\n        }\r\n        \r\n        .fv-card-s1:hover .fv-icon {\r\n            transform: rotate(15deg) scale(1.1);\r\n        }\r\n\r\n        \/* =========================================\r\n           SECTION 2: BG #f0f7ff, Card #fff\r\n           Interaction: Magnetic hover tilt (Subtle scale)\r\n           Icon: Elastic bounce tap\r\n        ========================================= *\/\r\n        .fv-sec-2 { background-color: #f0f4ff; }\r\n        .fv-card-s2 { background-color: #ffffff; text-align: left; border: 1px solid #dddfe2; display: flex; flex-direction: column; gap: 5px; }\r\n\r\n        .fv-card-s2:hover {\r\n            transform: scale(1.03);\r\n            box-shadow: 0 15px 30px rgba(0, 0, 0, 0.05);\r\n            z-index: 2;\r\n        }\r\n\r\n        @keyframes elasticBounce {\r\n            0% { transform: scale(1); }\r\n            30% { transform: scale(1.25, 0.75); }\r\n            50% { transform: scale(0.8, 1.2); }\r\n            100% { transform: scale(1); }\r\n        }\r\n\r\n        .fv-card-s2:hover .fv-icon {\r\n            animation: elasticBounce 0.8s ease both;\r\n        }\r\n\r\n        \/* =========================================\r\n           SECTION 3: BG #fff, Card #f0f7ff\r\n           Interaction: Diagonal light sweep\r\n           Icon: Inner shadow press effect (active)\r\n        ========================================= *\/\r\n        .fv-sec-3 { background-color: #ffffff; }\r\n        .fv-card-s3 { background-color: #f0f4ff; text-align: center; border: 1px solid #e0e7ff; overflow: hidden; }\r\n\r\n        .fv-card-s3::before {\r\n            content: '';\r\n            position: absolute;\r\n            top: 0; left: -100%;\r\n            width: 100%; height: 100%;\r\n            background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.6), transparent);\r\n            transition: 0.6s;\r\n        }\r\n\r\n        .fv-card-s3:hover::before {\r\n            left: 100%;\r\n        }\r\n\r\n        .fv-card-s3:active {\r\n            transform: scale(0.97);\r\n            box-shadow: inset 4px 4px 10px rgba(0, 0, 0, 0.05);\r\n        }\r\n\r\n        .fv-card-s3:hover .fv-icon {\r\n            filter: drop-shadow(0 0 8px rgba(66, 103, 178, 0.3));\r\n        }\r\n\r\n    <\/style>\r\n\r\n    <!-- SECTION 1 -->\r\n\t<section class=\"fv-section fv-sec-1\">\r\n        <div class=\"fv-container\">\r\n        \r\n        <\/div>\r\n\t<\/section>\r\n    <section class=\"fv-section fv-sec-1\">\r\n        <div class=\"fv-container\">\r\n            <div class=\"fv-hd-group\">\r\n                <h2 class=\"fv-main-hd\">What Features Does the Facebook Feature Viewer Offer?<\/h2>\r\n                <p class=\"fv-sub-hd\">Explore the advanced toolkit specifically developed to help you visualize, analyze, and save high-resolution social data instantly.<\/p>\r\n            <\/div>\r\n            \r\n            <div class=\"fv-grid\">\r\n                <div class=\"fv-card fv-card-s1\">\r\n                    <i class=\"fa-solid fa-id-card-clip fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">Profile Indexer<\/h3>\r\n                    <p class=\"fv-card-text\">Instantly extract public profile metadata and unique identification strings that are usually hidden.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s1\">\r\n                    <i class=\"fa-solid fa-image fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">HD Media Reveal<\/h3>\r\n                    <p class=\"fv-card-text\">Access original high-definition profile pictures and cover photos directly from the CDN servers.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s1\">\r\n                    <i class=\"fa-solid fa-users-viewfinder fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">Group Scraper<\/h3>\r\n                    <p class=\"fv-card-text\">Analyze public group member participation and privacy settings with a single click search.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s1\">\r\n                    <i class=\"fa-solid fa-clapperboard fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">Reel Extraction<\/h3>\r\n                    <p class=\"fv-card-text\">Detect and download short-form video Reels that are often restricted in standard mobile views.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s1\">\r\n                    <i class=\"fa-solid fa-clock-rotate-left fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">Timeline History<\/h3>\r\n                    <p class=\"fv-card-text\">View an organized chronological history of public status updates and wall posts effectively.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s1\">\r\n                    <i class=\"fa-solid fa-shield-halved fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">Privacy Audit<\/h3>\r\n                    <p class=\"fv-card-text\">Examine what public data points your profile is leaking and secure your digital social footprint.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s1\">\r\n                    <i class=\"fa-solid fa-chart-line fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">Engagement Stats<\/h3>\r\n                    <p class=\"fv-card-text\">Get visualized charts showing interaction ratios, including likes, care, and heart reactions.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s1\">\r\n                    <i class=\"fa-solid fa-file-export fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">Data Portability<\/h3>\r\n                    <p class=\"fv-card-text\">Download all analyzed profile information into professional JSON formats for external reporting.<\/p>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <!-- SECTION 2 -->\r\n    <section class=\"fv-section fv-sec-2\">\r\n        <div class=\"fv-container\">\r\n            <div class=\"fv-hd-group\">\r\n                <h2 class=\"fv-main-hd\">Why Choose Our Advanced Facebook Feature Viewer?<\/h2>\r\n                <p class=\"fv-sub-hd\">Experience a seamless and private way to explore Facebook collections, profiles, and media-rich groups with professional speed.<\/p>\r\n            <\/div>\r\n            \r\n            <div class=\"fv-grid\">\r\n                <div class=\"fv-card fv-card-s2\">\r\n                    <i class=\"fa-solid fa-user-secret fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">Total Anonymity<\/h3>\r\n                    <p class=\"fv-card-text\">Browse and analyze profiles with stealth. Your identity remains 100% hidden during every search.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s2\">\r\n                    <i class=\"fa-solid fa-unlock-keyhole fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">No Login Needed<\/h3>\r\n                    <p class=\"fv-card-text\">Access deep social insights without connecting your personal Facebook account or credentials.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s2\">\r\n                    <i class=\"fa-solid fa-bolt-lightning fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">Turbo Fetching<\/h3>\r\n                    <p class=\"fv-card-text\">Our high-speed API architecture ensures data is retrieved and displayed in under 3 seconds.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s2\">\r\n                    <i class=\"fa-solid fa-mobile-screen-button fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">Responsive UI<\/h3>\r\n                    <p class=\"fv-card-text\">Optimized for premium performance across iPhone, Android, tablets, and modern desktop browsers.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s2\">\r\n                    <i class=\"fa-solid fa-cloud-arrow-down fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">HD Downloads<\/h3>\r\n                    <p class=\"fv-card-text\">Retrieve original high-definition media files that bypassing standard browser pixel compression.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s2\">\r\n                    <i class=\"fa-solid fa-mask fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">Zero Footprint<\/h3>\r\n                    <p class=\"fv-card-text\">We do not store your search history or cached images. Every look-up is fresh, isolated, and private.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s2\">\r\n                    <i class=\"fa-solid fa-earth-americas fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">Global Access<\/h3>\r\n                    <p class=\"fv-card-text\">Works perfectly across all regions. View profile features from any country without facing blocks.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s2\">\r\n                    <i class=\"fa-solid fa-wand-magic-sparkles fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">Ad-Free Design<\/h3>\r\n                    <p class=\"fv-card-text\">Enjoy a professional, distraction-free environment focused entirely on your data results.<\/p>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <!-- SECTION 3 -->\r\n    <section class=\"fv-section fv-sec-3\">\r\n        <div class=\"fv-container\">\r\n            <div class=\"fv-hd-group\">\r\n                <h2 class=\"fv-main-hd\">Safe and Professional Uses for the Feature Viewer<\/h2>\r\n                <p class=\"fv-sub-hd\">Our tool is designed for digital marketers, safety auditors, and researchers who require reliable social data ethically.<\/p>\r\n            <\/div>\r\n            \r\n            <div class=\"fv-grid\">\r\n                <div class=\"fv-card fv-card-s3\">\r\n                    <i class=\"fa-solid fa-magnifying-glass-chart fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">Market Research<\/h3>\r\n                    <p class=\"fv-card-text\">Understand competitor group activity and engagement patterns without alerting the account owners.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s3\">\r\n                    <i class=\"fa-solid fa-children fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">Parental Audit<\/h3>\r\n                    <p class=\"fv-card-text\">Monitor the public digital footprint of your children to ensure they are safe in social environments.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s3\">\r\n                    <i class=\"fa-solid fa-id-card-clip fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">Identity Verification<\/h3>\r\n                    <p class=\"fv-card-text\">Verify the creation date and public history of profiles before engaging in professional networking.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s3\">\r\n                    <i class=\"fa-solid fa-box-archive fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">Account Recovery<\/h3>\r\n                    <p class=\"fv-card-text\">Save and backup high-resolution memories from your own old profiles where access has been lost.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s3\">\r\n                    <i class=\"fa-solid fa-bullhorn fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">Brand Protection<\/h3>\r\n                    <p class=\"fv-card-text\">Track how your brand name or likeness is being discussed in public Facebook groups anonymously.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s3\">\r\n                    <i class=\"fa-solid fa-scale-balanced fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">Legal Compliance<\/h3>\r\n                    <p class=\"fv-card-text\">Gather public social data for documentation and research purposes following standard web protocols.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s3\">\r\n                    <i class=\"fa-solid fa-microchip fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">AI Powered Parsing<\/h3>\r\n                    <p class=\"fv-card-text\">Our backend logic recognizes the highest quality media streams available for crystal clear viewing.<\/p>\r\n                <\/div>\r\n                <div class=\"fv-card fv-card-s3\">\r\n                    <i class=\"fa-solid fa-server fv-icon\"><\/i>\r\n                    <h3 class=\"fv-card-title\">SSL Encryption<\/h3>\r\n                    <p class=\"fv-card-text\">All search queries are protected by 256-bit encryption, keeping your research activities secure.<\/p>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n<\/div>\r\n<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":5,"featured_media":0,"parent":6663,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"om_disable_all_campaigns":false,"footnotes":""},"class_list":["post-6839","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/raistheme.com\/wp-json\/wp\/v2\/pages\/6839","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/raistheme.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/raistheme.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/raistheme.com\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/raistheme.com\/wp-json\/wp\/v2\/comments?post=6839"}],"version-history":[{"count":5,"href":"https:\/\/raistheme.com\/wp-json\/wp\/v2\/pages\/6839\/revisions"}],"predecessor-version":[{"id":6884,"href":"https:\/\/raistheme.com\/wp-json\/wp\/v2\/pages\/6839\/revisions\/6884"}],"up":[{"embeddable":true,"href":"https:\/\/raistheme.com\/wp-json\/wp\/v2\/pages\/6663"}],"wp:attachment":[{"href":"https:\/\/raistheme.com\/wp-json\/wp\/v2\/media?parent=6839"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}