app.js

// ===== LOGGING SYSTEM =====
const LogLevel = {
    DEBUG: 'debug',
    INFO: 'info',
    WARN: 'warn',
    ERROR: 'error'
};

const SENSITIVE_IPC_KEYS = new Set([
    'password',
    'currentPassword',
    'newPassword',
    'confirmPassword',
    'code',
    'state',
    'authorizationUrl',
    'accessToken',
    'access_token',
    'refreshToken',
    'refresh_token',
    'token',
    'sessionToken',
    'session_token',
    'userId',
    'user_id',
    'username',
    'email',
    'user',
]);

function sanitizeIpcValue(value) {
    if (Array.isArray(value)) {
        return value.map(sanitizeIpcValue);
    }
    if (!value || typeof value !== 'object') {
        return value;
    }
    const sanitized = {};
    for (const [key, innerValue] of Object.entries(value)) {
        sanitized[key] = SENSITIVE_IPC_KEYS.has(key)
            ? '[redacted]'
            : sanitizeIpcValue(innerValue);
    }
    return sanitized;
}

function sanitizeIpcPayload(command, payload) {
    if (!payload || typeof payload !== 'object') return payload;
    if (typeof command === 'string' && command.startsWith('Auth')) {
        return sanitizeIpcValue(payload);
    }
    if (command === 'GetUiConfig' && Object.prototype.hasOwnProperty.call(payload, 'authState')) {
        return {
            ...payload,
            authState: sanitizeIpcValue(payload.authState)
        };
    }
    return payload;
}

function sanitizeIpcEventData(event, data) {
    if (event === 'AuthStateChanged') {
        return {
            authenticated: !!(data && data.authenticated),
            provider: data && typeof data.provider === 'string' ? data.provider : null,
            user: data && data.user ? '[redacted]' : null
        };
    }
    return data;
}

const logger = {
    _queue: [],
    _initialized: false,
    _uiLogging: true,
    _ipcTracing: false,
    
    async _sendToRust(level, message, context = null) {
        if (!this._uiLogging) {
            return false;
        }
        if (window.__LAUNCHER__) {
            try {
                await window.__LAUNCHER__.invoke("LogMessage", {
                    level,
                    message,
                    context: context ? JSON.stringify(context) : null
                });
                return true;
            } catch (e) {
                // Rust logging failed, will fall back to console
                return false;
            }
        }
        return false;
    },
    
    _formatMessage(level, message, context) {
        const timestamp = new Date().toISOString();
        const prefix = `[${timestamp}] [${level.toUpperCase()}]`;
        if (context) {
            return `${prefix} ${message} | ${JSON.stringify(context)}`;
        }
        return `${prefix} ${message}`;
    },
    
    async _log(level, message, context = null) {
        // Try Rust first
        const sentToRust = await this._sendToRust(level, message, context);
        
        // Always log to console as well (for dev tools)
        const formatted = this._formatMessage(level, message, context);
        switch (level) {
            case LogLevel.DEBUG:
                console.debug(formatted);
                break;
            case LogLevel.INFO:
                console.info(formatted);
                break;
            case LogLevel.WARN:
                console.warn(formatted);
                break;
            case LogLevel.ERROR:
                console.error(formatted);
                break;
            default:
                console.log(formatted);
        }
    },
    
    debug(message, context = null) {
        this._log(LogLevel.DEBUG, message, context);
    },
    
    info(message, context = null) {
        this._log(LogLevel.INFO, message, context);
    },
    
    warn(message, context = null) {
        this._log(LogLevel.WARN, message, context);
    },
    
    error(message, context = null) {
        this._log(LogLevel.ERROR, message, context);
    },
    
    // IPC-specific logging
    ipcCall(command, args = null) {
        if (!this._ipcTracing) return;
        this._log(LogLevel.DEBUG, `IPC Call: JS → Rust`, {
            command,
            args: sanitizeIpcPayload(command, args)
        });
    },
    
    ipcResult(command, result = null, error = null) {
        if (!this._ipcTracing) return;
        if (error) {
            // Extract error message properly - handle Error objects, strings, and plain objects
            var errorMsg = error;
            if (error instanceof Error) {
                errorMsg = error.message || error.toString();
            } else if (typeof error === 'object' && error !== null) {
                errorMsg = error.message || error.error || JSON.stringify(error);
            }
            this._log(LogLevel.ERROR, `IPC Error: ${command}`, { error: errorMsg });
        } else {
            this._log(LogLevel.DEBUG, `IPC Result: ${command}`, {
                result: sanitizeIpcPayload(command, result)
            });
        }
    },
    
    ipcEvent(event, data = null) {
        if (!this._ipcTracing) return;
        this._log(LogLevel.DEBUG, `IPC Event: Rust → JS`, {
            event,
            data: sanitizeIpcEventData(event, data)
        });
    }
};


// ===== GLOBAL ERROR HANDLERS =====
function logGlobalError(details, errorType = "error") {
    const message = details && (details.message || details.reason || details) || "Unknown error";
    const stack = (details && (details.stack || (details.error && details.error.stack) || (details.reason && details.reason.stack))) || null;
    const filename = details && details.filename;
    const lineno = details && details.lineno;
    const colno = details && details.colno;
    
    // Log locally
    logger.error("Global error", { message, stack, filename, lineno, colno });
    
    // Forward to Rust for centralized error tracking
    if (window.__LAUNCHER__ && typeof window.__LAUNCHER__.invoke === 'function') {
        try {
            window.__LAUNCHER__.invoke('LogMessage', {
                level: 'error',
                message: `[JS ${errorType}] ${message}`,
                context: JSON.stringify({
                    stack: stack,
                    filename: filename,
                    lineno: lineno,
                    colno: colno,
                    type: errorType
                })
            }).catch(function() { /* Ignore IPC errors during error reporting */ });
        } catch (e) {
            // Ignore errors during error reporting to prevent infinite loops
        }
    }
}

function showUiCrashOverlay(message, details = {}) {
    if (typeof document === "undefined") {
        return;
    }

    const root = document.body || document.documentElement;
    if (!root) {
        return;
    }

    let overlay = document.getElementById("uiCrashOverlay");
    if (!overlay) {
        overlay = document.createElement("div");
        overlay.id = "uiCrashOverlay";
        overlay.setAttribute("role", "alertdialog");
        overlay.setAttribute("aria-live", "assertive");
        overlay.style.cssText = [
            "position:fixed",
            "inset:0",
            "z-index:2147483647",
            "display:flex",
            "align-items:center",
            "justify-content:center",
            "padding:24px",
            "background:rgba(10,10,15,0.96)",
            "backdrop-filter:blur(10px)"
        ].join(";");
        root.appendChild(overlay);
    }

    const safeMessage = String(message || "Unexpected launcher error");
    const safeDetails = details && details.stack ? String(details.stack) : "";
    overlay.innerHTML = `
        <div style="width:min(560px,100%);background:#14141f;border:1px solid #252535;border-radius:16px;padding:24px;box-shadow:0 20px 60px rgba(0,0,0,0.45);color:#e8e8f0;font-family:Inter,'Segoe UI',sans-serif;">
            <div style="font-size:20px;font-weight:700;margin-bottom:8px;">Launcher UI ran into a problem</div>
            <div style="font-size:14px;line-height:1.6;color:#b8b8c8;margin-bottom:16px;">${safeMessage}</div>
            <div style="font-size:13px;line-height:1.5;color:#8f8fa3;margin-bottom:20px;">You can safely reload the launcher UI. If the problem keeps happening, close and reopen the launcher.</div>
            ${safeDetails ? `<pre style="max-height:180px;overflow:auto;white-space:pre-wrap;background:#0f0f18;border:1px solid #1f1f2d;border-radius:10px;padding:12px;color:#9d9db3;font-size:12px;margin:0 0 20px;">${safeDetails}</pre>` : ""}
            <div style="display:flex;gap:12px;justify-content:flex-end;">
                <button id="uiCrashReloadBtn" style="border:none;border-radius:10px;padding:10px 16px;background:#7c5cff;color:white;font-weight:600;cursor:pointer;">Reload UI</button>
                <button id="uiCrashCloseBtn" style="border:1px solid #2a2a38;border-radius:10px;padding:10px 16px;background:#181824;color:#e8e8f0;font-weight:600;cursor:pointer;">Close Launcher</button>
            </div>
        </div>
    `;

    overlay.querySelector("#uiCrashReloadBtn")?.addEventListener("click", () => {
        requestReload();
    });
    overlay.querySelector("#uiCrashCloseBtn")?.addEventListener("click", () => {
        closeWindow();
    });
    reportFatalFrontendProblem(message, {
        errorType: details.errorType || "fatal-ui-problem",
        stack: details.stack || null,
        filename: details.filename || null,
        line: details.line,
        column: details.column
    });
}

function reportFatalFrontendProblem(message, details = {}) {
    if (!window.__LAUNCHER__ || typeof window.__LAUNCHER__.invoke !== "function") {
        return Promise.resolve();
    }

    return window.__LAUNCHER__.invoke("ReportUiCrash", {
        page: "main",
        errorType: details.errorType || "fatal-ui-problem",
        message: String(message || "Unexpected launcher UI error"),
        stack: details.stack || null,
        filename: details.filename || null,
        line: Number.isInteger(details.line) ? details.line : null,
        column: Number.isInteger(details.column) ? details.column : null
    }).catch(function() {});
}



if (typeof window !== "undefined") {
    // Global error handler for uncaught exceptions
    window.addEventListener("error", (event) => {
        const message = event.message || "Unexpected UI error";
        logGlobalError({
            message,
            stack: event.error && event.error.stack,
            filename: event.filename,
            lineno: event.lineno,
            colno: event.colno,
            error: event.error
        }, "uncaught-exception");
        showUiCrashOverlay(message, {
            errorType: "uncaught-exception",
            stack: event.error && event.error.stack,
            filename: event.filename,
            line: event.lineno,
            column: event.colno
        });
    });

    // Unhandled promise rejection handler
    window.addEventListener("unhandledrejection", (event) => {
        const message = event.reason && (event.reason.message || String(event.reason)) || "Unexpected async UI error";
        logGlobalError({
            message,
            stack: event.reason && event.reason.stack,
            reason: event.reason
        }, "unhandled-rejection");
        showUiCrashOverlay(message, {
            errorType: "unhandled-rejection",
            stack: event.reason && event.reason.stack
        });
    });
    
    // // Console error override to capture console.error calls
    // const originalConsoleError = console.error;
    // console.error = function(...args) {
    //     originalConsoleError.apply(console, args);
    //     // Forward significant console errors to Rust (avoid recursion by checking)
    //     if (args.length > 0 && !String(args[0]).includes('[IPC]')) {
    //         const message = args.map(arg => {
    //             if (typeof arg === 'object') {
    //                 try { return JSON.stringify(arg); } catch { return String(arg); }
    //             }
    //             return String(arg);
    //         }).join(' ');
            
    //         if (window.__LAUNCHER__ && typeof window.__LAUNCHER__.invoke === 'function') {
    //             try {
    //                 window.__LAUNCHER__.invoke('LogMessage', {
    //                     level: 'error',
    //                     message: '[JS console.error] ' + message.substring(0, 500),
    //                     context: null
    //                 }).catch(function() {});
    //             } catch (e) {}
    //         }
    //     }
    // };
}
// ===== IPC WRAPPER WITH LOGGING =====
const ipcBridge = {
    async invoke(command, args = null) {
        logger.ipcCall(command, args);
        
        if (!window.__LAUNCHER__) {
            logger.warn(`IPC unavailable for command: ${command}`);
            return null;
        }
        
        try {
            const result = await window.__LAUNCHER__.invoke(command, args);
            logger.ipcResult(command, result);
            return result;
        } catch (error) {
            logger.ipcResult(command, null, error);
            throw error;
        }
    },
    
    on(event, handler) {
        if (!window.__LAUNCHER__) {
            logger.warn(`Cannot register event handler - IPC unavailable: ${event}`);
            return;
        }
        
        window.__LAUNCHER__.on(event, (data) => {
            logger.ipcEvent(event, data);
            handler(data);
        });
    }
};

// ===== STATE MANAGEMENT =====
const AppState = {
    STARTUP: 'startup',
    READY: 'ready',
    EULA_PENDING: 'eula_pending',
    AUTH_PENDING: 'auth_pending',
    CHECKING: 'checking_manifest',
    UPDATE_AVAILABLE: 'update_available',
    DOWNLOADING: 'downloading',
    VERIFYING: 'verifying',
    APPLYING: 'patching',
    LAUNCH_READY: 'launch_ready',
    LAUNCHING: 'launching',
    MAINTENANCE: 'maintenance',
    ERROR: 'error'
};

// ===== APPLICATION STATE =====
const state = {
    current: AppState.READY,
    isDownloading: false,
    downloadPaused: false,
    currentSlideIndex: 0,
    currentTab: 'news',
    currentLang: 'en',
    currentTheme: 'dark',
    sliderInterval: null,
    sliderProgressInterval: null,
    sliderPaused: false,
    sliderProgressValue: 0,
    slideDuration: 6000,
    translations: {},
    newsItems: [],
    changelogItems: [],
    plugins: [],
    links: {},
    serverOnline: false,
    availableLanguages: ['en'],
    version: '1.0.0',
    gameVersion: null,
    manifestVersion: null,
    stage: 'production',
    splashShownKey: null,
    splashConfig: null,
    popupNoticeShownKey: null,
    popupNoticeConfig: null,
    noticeShownKeys: new Set(),
    maintenanceMode: false,
    maintenanceMessage: null,
    authConfig: null,
    launcherUpdate: null,
    launcherUpdateForced: false,
    launcherUpdateCheckPending: false,
    launcherUpdateCheckError: null,
    authState: {
        authenticated: false,
        provider: null,
        userId: null,
        username: null,
        email: null,
        user: null
    },
    authModal: {
        open: false,
        mode: 'login',
        oauthProvider: null,
        awaitingCode: false,
        authorizationUrl: null
    },
    startup: {
        checkForUpdates: true,
        minimizeToTray: false,
        launchOnBoot: false
    },
    logging: {
        uiLogging: true,
        ipcTracing: false
    },
    hasSettingsManager: false,
};

// ===== MANIFEST LOADING OVERLAY =====
// Shown until the remote manifest fetch resolves (success, error, or skipped).
// Guards are idempotent — safe to call multiple times.
let _manifestOverlayDismissed = false;

function dismissManifestOverlay() {
    if (_manifestOverlayDismissed) return;
    _manifestOverlayDismissed = true;
    const overlay = document.getElementById('manifestLoadingOverlay');
    if (!overlay) return;
    overlay.classList.add('hidden');
    // Remove from layout after transition completes (250ms defined in CSS)
    setTimeout(() => overlay.classList.add('gone'), 300);
}

function updateManifestOverlayStatus(key, fallback) {
    if (_manifestOverlayDismissed) return;
    const el = document.getElementById('manifestLoadingStatus');
    if (el) el.textContent = t(key) || fallback;
}


function updateAuxButtons() {
    const pauseResumeBtn = $('#pauseResumeBtn');
    const pauseResumeIcon = $('#pauseResumeIcon');
    const utilitiesBtn = $('#utilitiesBtn');

    const isBusy =
        state.current === AppState.CHECKING ||
        state.current === AppState.DOWNLOADING ||
        state.current === AppState.VERIFYING ||
        state.current === AppState.APPLYING ||
        state.current === AppState.LAUNCHING ||
        state.current === AppState.EULA_PENDING ||
        state.current === AppState.AUTH_PENDING;

    if (pauseResumeBtn && pauseResumeIcon) {
        const show = state.current === AppState.DOWNLOADING;
        pauseResumeBtn.style.display = show ? '' : 'none';

        if (show) {
            const isPaused = !!state.downloadPaused;
            pauseResumeBtn.disabled = false;
            pauseResumeBtn.setAttribute('title', isPaused ? (t('button.resume') || 'Resume') : (t('button.pause') || 'Pause'));
            pauseResumeBtn.setAttribute('data-tooltip', pauseResumeBtn.getAttribute('title'));

            pauseResumeIcon.innerHTML = isPaused
                ? '<polygon points="5 3 19 12 5 21 5 3"/>'
                : '<rect x="6" y="4" width="4" height="16"/><rect x="14" y="4" width="4" height="16"/>';
        }
    }

    if (utilitiesBtn) {
        utilitiesBtn.disabled = isBusy;
        if (isBusy) {
            const wrapper = $('#utilitiesWrapper');
            if (wrapper) wrapper.classList.remove('open');
        }
    }
}

function updateGameSettingsItem() {
    const item = $('#gameSettingsItem');
    if (!item) return;
    if (state.hasSettingsManager) {
        item.classList.remove('folder-option-disabled');
    } else {
        item.classList.add('folder-option-disabled');
    }
}

// ===== HELPER FUNCTIONS =====
function t(key, params = {}) {
    const template = state.translations[key] || key;
    return template.replace(/\{(\w+)\}/g, (_, k) =>
        params[k] !== undefined ? params[k] : `{${k}}`
    );
}

// Picks the localized value for `field` from item.i18n[currentLang], with
// base-language fallback (e.g. "de-AT" -> "de") and default to item[field].
function getLocalized(item, field) {
    if (item.i18n) {
        const lang = state.currentLang;
        const exact = item.i18n[lang];
        if (exact != null && exact[field] != null) return exact[field];
        const base = lang.indexOf('-') !== -1 ? lang.split('-')[0] : null;
        if (base) {
            const baseEntry = item.i18n[base];
            if (baseEntry != null && baseEntry[field] != null) return baseEntry[field];
        }
    }
    const v = item[field];
    return v != null ? v : '';
}

function tf(key, fallback, params = {}) {
    const value = t(key, params);
    return value === key ? fallback : value;
}

function launcherUpdateRequiredVersion() {
    const update = state.launcherUpdate || {};
    return update.minVersion || update.min_version || update.version || state.version;
}

function launcherUpdateRequiredStatus() {
    const version = launcherUpdateRequiredVersion();
    return tf(
        "status.launcher_update_required",
        `Launcher ${version} is required. Update to continue.`,
        { version }
    );
}

function normalizeStateForForcedLauncherUpdate(nextState) {
    if (!state.launcherUpdateForced) return nextState;
    if (nextState === AppState.APPLYING || nextState === AppState.ERROR) return nextState;
    return AppState.UPDATE_AVAILABLE;
}

function $(selector) {
    return document.querySelector(selector);
}

function $$(selector) {
    return document.querySelectorAll(selector);
}

function setText(id, value) {
    const el = document.getElementById(id);
    if (el) el.textContent = value;
}

function formatErrorMessage(error) {
    if (!error) return "Unknown error";
    if (typeof error === 'string') return error;
    if (error instanceof Error) return error.message || error.toString();
    if (typeof error === 'object') {
        if (typeof error.error === 'string') return error.error;
        if (error.error) return formatErrorMessage(error.error);
        if (typeof error.message === 'string') return error.message;
        if (typeof error.reason === 'string') return error.reason;
        if (typeof error.code === 'string' || typeof error.code === 'number') return String(error.code);
        try {
            const serialized = JSON.stringify(error);
            return serialized === '{}' ? "Unknown error" : serialized;
        } catch {
            // ignore
        }
    }
    const fallback = String(error);
    return fallback === "[object Object]" ? "Unknown error" : fallback;
}

function escapeHtml(value) {
    return String(value ?? '')
        .replace(/&/g, '&amp;')
        .replace(/</g, '&lt;')
        .replace(/>/g, '&gt;')
        .replace(/"/g, '&quot;')
        .replace(/'/g, '&#39;');
}


function buildCdnRegionOptions(selectedRegion, cdnStatus) {
    const selectedCdnRegion = selectedRegion || 'auto';
    const cdnRegions = Array.from(new Set(
        (Array.isArray(cdnStatus) ? cdnStatus : [])
            .map(cdn => typeof cdn.region === 'string' ? cdn.region.trim() : '')
            .filter(Boolean)
    ));

    if (selectedCdnRegion !== 'auto' && !cdnRegions.includes(selectedCdnRegion)) {
        cdnRegions.push(selectedCdnRegion);
    }

    cdnRegions.sort((a, b) => a.localeCompare(b));

    return [
        `<option value="auto" ${selectedCdnRegion === 'auto' ? 'selected' : ''}>${escapeHtml(t("settings.cdn_auto") || "Auto")}</option>`,
        ...cdnRegions.map(region => {
            const safeRegion = escapeHtml(region);
            return `<option value="${safeRegion}" ${region === selectedCdnRegion ? 'selected' : ''}>${safeRegion}</option>`;
        })
    ].join('');
}


function formatBytes(bytes) {
    if (bytes === 0) return "0 B";
    const k = 1024;
    const sizes = ["B", "KB", "MB", "GB"];
    const i = Math.floor(Math.log(bytes) / Math.log(k));
    return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + " " + sizes[i];
}

function formatSpeed(bytesPerSec) {
    return formatBytes(bytesPerSec) + "/s";
}

function formatETA(seconds) {
    if (!seconds || seconds <= 0) return "--";
    if (seconds < 60) return `${Math.round(seconds)}s`;
    if (seconds < 3600) return `${Math.floor(seconds / 60)}m ${Math.round(seconds % 60)}s`;
    return `${Math.floor(seconds / 3600)}h ${Math.floor((seconds % 3600) / 60)}m`;
}

// ===== WINDOW CONTROLS =====
function minimizeWindow() {
    ipcBridge.invoke("MinimizeWindow").catch(err => logger.error("MinimizeWindow failed", { error: err }));
}

function closeWindow() {
    ipcBridge.invoke("CloseWindow").catch(() => window.close());
}

// ===== THEME MANAGEMENT =====
function getSystemThemePreference() {
    try {
        if (typeof window !== 'undefined' && typeof window.matchMedia === 'function') {
            return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
        }
    } catch (err) {
        logger?.debug?.('Could not read system theme preference', { error: String(err) });
    }
    return 'dark';
}

function resolveThemePreference(theme) {
    return theme === 'light' || theme === 'dark' ? theme : getSystemThemePreference();
}

function applyTheme(theme) {
    const resolvedTheme = resolveThemePreference(theme);
    const isDark = resolvedTheme === 'dark';
    document.body.classList.toggle('light-theme', !isDark);
    state.currentTheme = resolvedTheme;
    logger.debug("Theme applied", { theme: resolvedTheme });
}

function toggleTheme() {
    const newTheme = state.currentTheme === 'dark' ? 'light' : 'dark';
    applyTheme(newTheme);
    
    // Save theme preference via settings
    ipcBridge.invoke("SaveSettings", { settings: { theme: newTheme } })
        .then(() => {
            logger.info("Theme preference saved", { theme: newTheme });
        })
        .catch(err => {
            logger.warn("Failed to save theme preference", { error: err });
        });
}

async function loadThemePreference() {
    applyTheme(getSystemThemePreference());
    try {
        const settings = await ipcBridge.invoke("GetSettings");
        applyTheme(settings && settings.theme);
    } catch (err) {
        logger.debug("Could not load theme preference, using system default", { error: err });
    }
}

// ===== NAVIGATION =====
function openLink(type) {
    if (typeof type !== 'string' || !type.trim()) {
        logger.warn('openLink called with invalid type');
        return;
    }

    const normalizedType = type.toLowerCase();
    if (normalizedType === 'register' && state.authConfig) {
        const endpoints = state.authConfig.endpoints || {};
        if (state.authState.authenticated) {
            if (endpoints.changePasswordUrl) {
                showAuthModal('change-password');
            }
            return;
        }
        if (endpoints.registerUrl) {
            showAuthModal('register');
        }
        return;
    }

    const url = state.links[normalizedType];
    if (!url) {
        logger.warn(`No URL configured for link type: ${type}`);
        showToast(t("error.link_not_configured") || "Link not available", "warning");
        return;
    }

    openExternalUrl(url)
        .then(() => {
            logger.debug(`Opened external URL: ${type}`);
        })
        .catch((err) => {
            logger.error(`Failed to open URL: ${err}`);
            showToast(t("error.open_url_failed") || "Could not open link", "error");
        });
}

async function openExternalUrl(url) {
    if (!isValidUrl(url)) {
        throw new Error(t("error.invalid_url") || "Invalid URL");
    }
    try {
        await ipcBridge.invoke("OpenExternalUrl", { url });
    } catch (err) {
        logger.warn(`Failed to open URL via IPC, trying fallback: ${err}`);
        const newWindow = window.open(url, "_blank", "noopener,noreferrer");
        if (!newWindow) {
            throw new Error(t("error.popup_blocked") || "Popup blocked - please allow popups");
        }
    }
}

function isValidUrl(url) {
    if (typeof url !== 'string') return false;
    try {
        const parsed = new URL(url);
        return ['http:', 'https:', 'mailto:'].includes(parsed.protocol);
    } catch {
        return false;
    }
}

function isValidHttpUrl(url) {
    if (typeof url !== 'string') return false;
    try {
        const parsed = new URL(url);
        return parsed.protocol === 'http:' || parsed.protocol === 'https:';
    } catch {
        return false;
    }
}

function normalizeSplashConfig(raw) {
    if (!raw || typeof raw !== 'object') return null;

    const enabled = raw.enabled === true;
    if (!enabled) return { enabled: false };

    const title = typeof raw.title === 'string' ? raw.title.trim() : '';
    const message = typeof raw.message === 'string' ? raw.message.trim() : '';
    const imageUrl = isValidHttpUrl(raw.imageUrl) ? raw.imageUrl : null;
    const ctaLabel = typeof raw.ctaLabel === 'string' ? raw.ctaLabel.trim() : '';
    const ctaUrl = isValidUrl(raw.ctaUrl) ? raw.ctaUrl : null;
    const durationSeconds = Number.isFinite(raw.durationSeconds)
        ? Math.max(1, Math.min(60, Math.floor(raw.durationSeconds)))
        : 3;
    let dismissible = raw.dismissible !== false;
    if (!dismissible && !(ctaLabel && ctaUrl)) {
        dismissible = true;
    }

    if (!title && !message && !imageUrl) return null;

    return {
        enabled,
        title,
        message,
        imageUrl,
        ctaLabel,
        ctaUrl,
        dismissible,
        durationSeconds
    };
}

function normalizePopupNoticeConfig(raw) {
    if (!raw || typeof raw !== 'object') return null;

    const enabled = raw.enabled === true;
    if (!enabled) return { enabled: false };

    const imageUrl = isValidHttpUrl(raw.imageUrl) ? raw.imageUrl : null;
    if (!imageUrl) return null;

    const imageAlt = typeof raw.imageAlt === 'string' ? raw.imageAlt.trim() : '';
    const ctaLabel = typeof raw.ctaLabel === 'string' ? raw.ctaLabel.trim() : '';
    const ctaUrl = isValidUrl(raw.ctaUrl) ? raw.ctaUrl : null;
    let dismissible = raw.dismissible !== false;
    if (!dismissible && !(ctaLabel && ctaUrl)) {
        dismissible = true;
    }

    return {
        enabled,
        imageUrl,
        imageAlt,
        ctaLabel,
        ctaUrl,
        dismissible
    };
}

function getSplashKey(splash, manifestVersion) {
    const versionKey = typeof manifestVersion === 'string' && manifestVersion.trim()
        ? manifestVersion.trim()
        : 'unversioned';
    return `${versionKey}:${JSON.stringify({
        title: splash.title,
        message: splash.message,
        imageUrl: splash.imageUrl,
        durationSeconds: splash.durationSeconds,
        ctaLabel: splash.ctaLabel,
        ctaUrl: splash.ctaUrl
    })}`;
}

function getPopupNoticeKey(popupNotice, manifestVersion) {
    const versionKey = typeof manifestVersion === 'string' && manifestVersion.trim()
        ? manifestVersion.trim()
        : 'unversioned';
    return `${versionKey}:${JSON.stringify({
        imageUrl: popupNotice.imageUrl,
        imageAlt: popupNotice.imageAlt,
        ctaLabel: popupNotice.ctaLabel,
        ctaUrl: popupNotice.ctaUrl
    })}`;
}

function applySplashConfig(raw, manifestVersion) {
    const splash = normalizeSplashConfig(raw);
    if (!splash || !splash.enabled) {
        state.splashConfig = null;
        state.splashShownKey = null;
        hideSplash();
        return;
    }

    splash.splashKey = getSplashKey(splash, manifestVersion);
    state.splashConfig = splash;
}

function applyPopupNoticeConfig(raw, manifestVersion) {
    const popupNotice = normalizePopupNoticeConfig(raw);
    if (!popupNotice || !popupNotice.enabled) {
        state.popupNoticeConfig = null;
        state.popupNoticeShownKey = null;
        hidePopupNotice();
        return;
    }

    popupNotice.popupNoticeKey = getPopupNoticeKey(popupNotice, manifestVersion);
    state.popupNoticeConfig = popupNotice;
}

function delay(ms) {
    return new Promise((resolve) => setTimeout(resolve, ms));
}

function showSplash(config, splashKey) {
    if (!config) return;

    const overlay = renderSplashOverlay(config);
    overlay.classList.add('visible');
    state.splashShownKey = splashKey || getSplashKey(config);
}

async function showLaunchSplashBeforeGameStart() {
    const splash = state.splashConfig;
    if (!splash || !splash.enabled || state.splashShownKey === splash.splashKey) {
        return false;
    }

    showSplash(splash, splash.splashKey);
    await delay(splash.durationSeconds * 1000);
    hideSplash();
    return true;
}

function hideSplash() {
    const overlay = document.getElementById('splashOverlay');
    if (overlay) {
        overlay.classList.remove('visible');
    }
}

function renderSplashOverlay(config) {
    let overlay = document.getElementById('splashOverlay');
    if (!overlay) {
        overlay = document.createElement('div');
        overlay.id = 'splashOverlay';
        overlay.className = 'splash-overlay';
        document.body.appendChild(overlay);
    }

    overlay.innerHTML = '';

    const card = document.createElement('div');
    card.className = 'splash-card';
    if (!config.imageUrl) {
        card.classList.add('no-media');
    }

    if (config.imageUrl) {
        const media = document.createElement('div');
        media.className = 'splash-media';
        const img = document.createElement('img');
img.alt = config.title || t("ui.aria_splash");
        img.src = config.imageUrl;
        media.appendChild(img);
        card.appendChild(media);
    }

    const body = document.createElement('div');
    body.className = 'splash-body';

    if (config.title) {
        const title = document.createElement('h2');
        title.className = 'splash-title';
        title.textContent = config.title;
        body.appendChild(title);
    }

    if (config.message) {
        const message = document.createElement('p');
        message.className = 'splash-message';
        message.textContent = config.message;
        body.appendChild(message);
    }

    const actions = document.createElement('div');
    actions.className = 'splash-actions';

    if (config.ctaUrl && config.ctaLabel) {
        const ctaBtn = document.createElement('button');
        ctaBtn.className = 'btn btn-primary';
        ctaBtn.type = 'button';
        ctaBtn.textContent = config.ctaLabel;
        ctaBtn.addEventListener('click', () => {
            ipcBridge.invoke("OpenExternalUrl", { url: config.ctaUrl })
                .catch((err) => logger.warn("Failed to open splash CTA", { error: err }));
        });
        actions.appendChild(ctaBtn);
    }

    if (config.dismissible) {
        const dismissBtn = document.createElement('button');
        dismissBtn.className = 'btn btn-secondary';
        dismissBtn.type = 'button';
        dismissBtn.textContent = t("button.dismiss") || "Continue";
        dismissBtn.addEventListener('click', hideSplash);
        actions.appendChild(dismissBtn);
    }

    if (actions.childElementCount > 0) {
        body.appendChild(actions);
    }

    card.appendChild(body);

    const closeBtn = document.createElement('button');
    closeBtn.className = 'splash-close';
    closeBtn.type = 'button';
closeBtn.setAttribute('aria-label', t("tooltip.close"));
    closeBtn.innerHTML = `
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
            <line x1="18" y1="6" x2="6" y2="18"></line>
            <line x1="6" y1="6" x2="18" y2="18"></line>
        </svg>
    `;
    if (config.dismissible) {
        closeBtn.addEventListener('click', hideSplash);
    } else {
        closeBtn.classList.add('hidden');
    }

    card.appendChild(closeBtn);
    overlay.appendChild(card);

    overlay.onclick = (event) => {
        if (event.target === overlay && config.dismissible) {
            hideSplash();
        }
    };

    return overlay;
}

function showPendingPopupNotice() {
    const popupNotice = state.popupNoticeConfig;
    if (!popupNotice || !popupNotice.enabled || state.popupNoticeShownKey === popupNotice.popupNoticeKey) {
        return false;
    }

    const overlay = renderPopupNoticeOverlay(popupNotice);
    overlay.classList.add('visible');
    state.popupNoticeShownKey = popupNotice.popupNoticeKey;
    return true;
}

function hidePopupNotice() {
    const overlay = document.getElementById('popupNoticeOverlay');
    if (overlay) {
        overlay.classList.remove('visible');
    }
}

function renderPopupNoticeOverlay(config) {
    let overlay = document.getElementById('popupNoticeOverlay');
    if (!overlay) {
        overlay = document.createElement('div');
        overlay.id = 'popupNoticeOverlay';
        overlay.className = 'popup-notice-overlay';
        document.body.appendChild(overlay);
    }

    overlay.innerHTML = '';

    const card = document.createElement('div');
    card.className = 'popup-notice-card';

    const img = document.createElement('img');
    img.className = 'popup-notice-image';
img.alt = config.imageAlt || t("ui.aria_notice");
    img.src = config.imageUrl;
    card.appendChild(img);

    if (config.ctaUrl && config.ctaLabel) {
        const ctaBtn = document.createElement('button');
        ctaBtn.className = 'btn btn-primary popup-notice-cta';
        ctaBtn.type = 'button';
        ctaBtn.textContent = config.ctaLabel;
        ctaBtn.addEventListener('click', () => {
            ipcBridge.invoke("OpenExternalUrl", { url: config.ctaUrl })
                .catch((err) => logger.warn("Failed to open popup notice CTA", { error: err }));
        });
        card.appendChild(ctaBtn);
    }

    const closeBtn = document.createElement('button');
    closeBtn.className = 'popup-notice-close';
    closeBtn.type = 'button';
closeBtn.setAttribute('aria-label', t("tooltip.close"));
    closeBtn.innerHTML = `
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
            <line x1="18" y1="6" x2="6" y2="18"></line>
            <line x1="6" y1="6" x2="18" y2="18"></line>
        </svg>
    `;
    if (config.dismissible) {
        closeBtn.addEventListener('click', hidePopupNotice);
    } else {
        closeBtn.classList.add('hidden');
    }

    card.appendChild(closeBtn);
    overlay.appendChild(card);

    overlay.onclick = (event) => {
        if (event.target === overlay && config.dismissible) {
            hidePopupNotice();
        }
    };

    return overlay;
}

function hasAuthEnabled() {
    return !!(state.authConfig && state.authConfig.enabled);
}

function isAuthenticated() {
    return !!state.authState.authenticated;
}

function isForcedAuth() {
    return !!(state.authConfig && state.authConfig.forced);
}

function isAuthRequiredError(error) {
    const message = formatErrorMessage(error).toLowerCase();
    return message.includes('authentication required') || message.includes('e_auth_required');
}

function isLicenseRequiredError(error) {
    const message = formatErrorMessage(error).toLowerCase();
    return message.includes('license required') || message.includes('e_license_required');
}

function normalizeAuthenticationConfig(raw) {
    if (!raw || typeof raw !== 'object' || raw.enabled !== true) return null;

    const sanitizeHttpUrl = (value) => (isValidHttpUrl(value) ? value : null);
    const sanitizeText = (value, maxLength = 160) => {
        if (typeof value !== 'string') return '';
        const trimmed = value.trim();
        return trimmed ? trimmed.slice(0, maxLength) : '';
    };
    const sanitizeColor = (value) => {
        if (typeof value !== 'string') return null;
        const trimmed = value.trim();
        return /^#[0-9a-fA-F]{6}$/.test(trimmed) ? trimmed : null;
    };

    const endpoints = raw.endpoints && typeof raw.endpoints === 'object' ? raw.endpoints : {};
    const providers = Array.isArray(raw.oauthProviders) ? raw.oauthProviders : [];
    const ui = raw.ui && typeof raw.ui === 'object' ? raw.ui : {};

    return {
        enabled: true,
        forced: raw.forced === true,
        persistSession: raw.persistSession === true,
        sessionTtlSeconds: Number.isFinite(raw.sessionTtlSeconds) ? raw.sessionTtlSeconds : null,
        callbackScheme: sanitizeText(raw.callbackScheme, 32),
        endpoints: {
            loginUrl: sanitizeHttpUrl(endpoints.loginUrl),
            registerUrl: sanitizeHttpUrl(endpoints.registerUrl),
            forgotPasswordUrl: sanitizeHttpUrl(endpoints.forgotPasswordUrl),
            changePasswordUrl: sanitizeHttpUrl(endpoints.changePasswordUrl),
            oauthCompleteUrl: sanitizeHttpUrl(endpoints.oauthCompleteUrl),
            logoutUrl: sanitizeHttpUrl(endpoints.logoutUrl),
            userInfoUrl: sanitizeHttpUrl(endpoints.userInfoUrl)
        },
        oauthProviders: providers
            .filter(provider => provider && typeof provider === 'object' && provider.enabled !== false)
            .map(provider => ({
                id: sanitizeText(provider.id, 32).toLowerCase(),
                label: sanitizeText(provider.label, 64) || sanitizeText(provider.id, 32),
                authorizationUrl: sanitizeHttpUrl(provider.authorizationUrl),
                clientId: sanitizeText(provider.clientId, 256),
                redirectUri: typeof provider.redirectUri === 'string' ? provider.redirectUri.trim() : '',
                scopes: Array.isArray(provider.scopes)
                    ? provider.scopes
                        .filter(scope => typeof scope === 'string' && scope.trim())
                        .map(scope => scope.trim())
                        .slice(0, 16)
                    : []
            }))
            .filter(provider => provider.id),
        ui: {
            title: sanitizeText(ui.title, 80),
            subtitle: sanitizeText(ui.subtitle, 160),
            logoUrl: sanitizeHttpUrl(ui.logoUrl),
            backgroundImageUrl: sanitizeHttpUrl(ui.backgroundImageUrl),
            accentColor: sanitizeColor(ui.accentColor)
        }
    };
}

function applyAuthState(raw) {
    const next = raw && typeof raw === 'object' ? raw : {};
    state.authState = {
        authenticated: next.authenticated === true,
        provider: typeof next.provider === 'string' ? next.provider : null,
        userId: null,
        username: typeof next.username === 'string' ? next.username : null,
        email: typeof next.email === 'string' ? next.email : null,
        user: null
    };

    if (state.authState.authenticated) {
        state.authModal.awaitingCode = false;
        state.authModal.oauthProvider = null;
        state.authModal.authorizationUrl = null;
        if (state.current === AppState.AUTH_PENDING) {
            updateStatus(tf('status.authenticated', 'Signed in successfully'));
        }
        closeAuthModal(true);
    }

    updateButtonState();
    updateAuthNavVisibility();
}

function updateAuthNavVisibility() {
    const registerBtn = document.querySelector('.auth-register-btn');
    if (!registerBtn) return;

    const applyRegisterState = (visible, label, tooltipKey = 'nav.register') => {
        registerBtn.hidden = !visible;
        registerBtn.title = label;
        registerBtn.setAttribute('aria-label', label);
        registerBtn.dataset.tooltipI18n = tooltipKey;
        registerBtn.dataset.tooltip = label;
    };

    const authConfig = state.authConfig;
    if (!authConfig) {
        applyRegisterState(Boolean(state.links && state.links.register), t('nav.register') || 'Register');
        return;
    }

    const endpoints = authConfig.endpoints || {};
    const canManageAccount = state.authState.authenticated
        ? Boolean(endpoints.changePasswordUrl)
        : Boolean(endpoints.registerUrl);
    const label = state.authState.authenticated && canManageAccount
        ? tf('auth.change_password_title', 'Change Password')
        : (t('nav.register') || 'Register');
    const tooltipKey = state.authState.authenticated && canManageAccount
        ? 'auth.change_password_title'
        : 'nav.register';

    applyRegisterState(canManageAccount, label, tooltipKey);
}

function shouldLockAuthModal() {
    return isForcedAuth() && !isAuthenticated();
}

function getAuthUserLabel() {
    return state.authState.username || state.authState.email || state.authState.provider || tf('auth.user', 'Player');
}

function authBrandInitials(label) {
    const words = String(label || '')
        .trim()
        .split(/\s+/)
        .filter(Boolean);
    const initials = words
        .slice(0, 2)
        .map(word => word.charAt(0))
        .join('')
        .toUpperCase();
    return initials || 'GG';
}

function wireAuthImageFallbacks(modal) {
    if (!modal) return;

    const mediaImage = modal.querySelector('.auth-modal-media-img');
    if (mediaImage) {
        const media = mediaImage.closest('.auth-modal-media');
        const markMediaLoaded = () => {
            if (media) media.classList.add('is-loaded');
        };
        const markMediaFailed = () => {
            if (media) media.classList.add('is-failed');
            mediaImage.remove();
        };

        if (mediaImage.complete) {
            mediaImage.naturalWidth > 0 ? markMediaLoaded() : markMediaFailed();
        } else {
            mediaImage.addEventListener('load', markMediaLoaded, { once: true });
            mediaImage.addEventListener('error', markMediaFailed, { once: true });
        }
    }

    const logoImage = modal.querySelector('.auth-logo');
    if (logoImage) {
        const logoShell = logoImage.closest('.auth-logo-shell');
        const markLogoLoaded = () => {
            if (logoShell) logoShell.classList.add('has-logo');
            logoImage.classList.add('is-loaded');
        };
        const markLogoFailed = () => {
            if (logoShell) logoShell.classList.add('logo-failed');
            logoImage.remove();
        };

        if (logoImage.complete) {
            logoImage.naturalWidth > 0 ? markLogoLoaded() : markLogoFailed();
        } else {
            logoImage.addEventListener('load', markLogoLoaded, { once: true });
            logoImage.addEventListener('error', markLogoFailed, { once: true });
        }
    }
}

function renderAuthProviderIcon(providerId) {
    const id = String(providerId || '').toLowerCase();
    if (id === 'google') {
        return `
            <svg class="auth-oauth-icon google" viewBox="0 0 24 24" aria-hidden="true" focusable="false">
                <path fill="#4285F4" d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z"/>
                <path fill="#34A853" d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z"/>
                <path fill="#FBBC05" d="M5.84 14.1c-.22-.66-.35-1.36-.35-2.1s.13-1.44.35-2.1V7.06H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.94l3.66-2.84z"/>
                <path fill="#EA4335" d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.06L5.84 9.9C6.71 7.3 9.14 5.38 12 5.38z"/>
            </svg>
        `;
    }
    if (id === 'discord') {
        return `
            <svg class="auth-oauth-icon discord" viewBox="0 0 24 24" aria-hidden="true" focusable="false">
                <path fill="currentColor" d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0 12.64 12.64 0 0 0-.617-1.25.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057 19.9 19.9 0 0 0 5.993 3.03.078.078 0 0 0 .084-.028 14.09 14.09 0 0 0 1.226-1.994.076.076 0 0 0-.041-.106 13.107 13.107 0 0 1-1.872-.892.077.077 0 0 1-.008-.128 10.2 10.2 0 0 0 .372-.292.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127 12.299 12.299 0 0 1-1.873.892.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028 19.839 19.839 0 0 0 6.002-3.03.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.956-2.419 2.157-2.419 1.21 0 2.176 1.096 2.157 2.42 0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.955-2.419 2.157-2.419 1.21 0 2.176 1.096 2.157 2.42 0 1.333-.946 2.418-2.157 2.418z"/>
            </svg>
        `;
    }
    return '<span class="auth-oauth-marker" aria-hidden="true"></span>';
}

function renderAuthProviderButtons() {
    const providers = state.authConfig?.oauthProviders || [];
    if (!providers.length || state.authModal.mode === 'change-password') return '';

    return `
        <div class="auth-oauth-divider">
            <span>${escapeHtml(tf('auth.or_continue_with', 'or continue with'))}</span>
        </div>
        <div class="auth-oauth-grid">
            ${providers.map((provider) => `
                <button type="button" class="auth-oauth-btn" data-auth-oauth="${escapeHtml(provider.id)}">
                    ${renderAuthProviderIcon(provider.id)}
                    <span class="auth-oauth-label">${escapeHtml(provider.label)}</span>
                </button>
            `).join('')}
        </div>
    `;
}

function renderOAuthCompletionPanel() {
    if (!state.authModal.awaitingCode || !state.authModal.oauthProvider) return '';
    const provider = state.authConfig?.oauthProviders?.find(item => item.id === state.authModal.oauthProvider);
    const providerLabel = provider?.label || state.authModal.oauthProvider;
    return `
        <div class="auth-oauth-complete">
            <p class="auth-helper-text">${escapeHtml(tf('auth.oauth_waiting_help', `Finish ${providerLabel} sign-in in your browser. The launcher will complete sign-in automatically when the browser returns to the app.`))}</p>
            <div class="auth-inline-actions">
                <button type="button" class="btn btn-secondary auth-inline-btn" data-auth-open-browser="1">${escapeHtml(tf('auth.open_browser_again', 'Open browser again'))}</button>
            </div>
        </div>
    `;
}

function renderAuthModal(mode) {
    const auth = state.authConfig || { ui: {}, oauthProviders: [] };
    const ui = auth.ui || {};
    const accentStyle = ui.accentColor ? ` style="--auth-accent:${escapeHtml(ui.accentColor)}"` : '';
    const brandLabel = ui.title || tf('app.title', 'GGWP Launcher');
    const brandInitials = authBrandInitials(brandLabel);
    const titleByMode = {
        login: tf('auth.login_title', 'Sign In'),
        register: tf('auth.register_title', 'Create Account'),
        forgot: tf('auth.forgot_title', 'Reset Password'),
        'change-password': tf('auth.change_password_title', 'Change Password')
    };
    const subtitleByMode = {
        login: ui.subtitle || tf('auth.login_subtitle', 'Sign in before updating or launching the game.'),
        register: tf('auth.register_subtitle', 'Create your launcher account to get started.'),
        forgot: tf('auth.forgot_subtitle', 'We will send password reset instructions to your email.'),
        'change-password': tf('auth.change_password_subtitle', 'Update your password for this launcher account.')
    };
    const modalTitle = titleByMode[mode] || tf('auth.login_title', 'Sign In');
    const modalSubtitle = subtitleByMode[mode] || '';
    const hideClose = shouldLockAuthModal();
    const backToLoginLabel = tf('auth.back_to_login', 'Back to login');
    const showHeaderBack = mode === 'register';
    const showGuestAction = mode === 'login' && !isForcedAuth();
    const continueAsGuestLabel = tf('auth.continue_as_guest', 'Continue as guest');
    const showAccountCard = isAuthenticated() && mode === 'change-password';
    const endpoints = auth.endpoints || {};
    const canRegister = Boolean(endpoints.registerUrl);
    const canRecoverPassword = Boolean(endpoints.forgotPasswordUrl);
    const canChangePassword = Boolean(endpoints.changePasswordUrl);
    const footerLinks = {
        login: `
            ${canRegister ? `<button type="button" class="auth-link-btn" data-auth-mode="register">${escapeHtml(tf('auth.create_account', 'Create account'))}</button>` : ''}
            ${canRecoverPassword ? `<button type="button" class="auth-link-btn" data-auth-mode="forgot">${escapeHtml(tf('auth.forgot_password_link', 'Forgot password?'))}</button>` : ''}
        `,
        register: '',
        forgot: `
            <button type="button" class="auth-link-btn" data-auth-mode="login">${escapeHtml(tf('auth.back_to_login', 'Back to login'))}</button>
            ${canRegister ? `<button type="button" class="auth-link-btn" data-auth-mode="register">${escapeHtml(tf('auth.create_account', 'Create account'))}</button>` : ''}
        `,
        'change-password': `
            <button type="button" class="auth-link-btn danger" data-auth-logout="1">${escapeHtml(tf('auth.logout', 'Log out'))}</button>
        `
    };

    let fieldsHtml = '';
    let submitLabel = tf('auth.submit', 'Continue');

    if (mode === 'login') {
        submitLabel = tf('auth.login_submit', 'Sign In');
        fieldsHtml = `
            <div class="auth-field">
                <label for="authUsername">${escapeHtml(tf('auth.username_or_email', 'Username or email'))}</label>
                <input id="authUsername" name="username" type="text" autocomplete="username" required>
            </div>
            <div class="auth-field">
                <label for="authPassword">${escapeHtml(tf('auth.password', 'Password'))}</label>
                <input id="authPassword" name="password" type="password" autocomplete="current-password" required>
            </div>
            <div class="auth-field auth-field-checkbox">
                <label class="auth-checkbox-label">
                    <input id="authKeepLoggedIn" name="keepLoggedIn" type="checkbox" ${state.authConfig?.persistSession ? 'checked' : ''}>
                    <span class="auth-checkbox-text">${escapeHtml(tf('auth.keep_me_logged_in', 'Keep me logged in'))}</span>
                </label>
            </div>
        `;
    } else if (mode === 'register') {
        submitLabel = tf('auth.register_submit', 'Register');
        fieldsHtml = `
            <div class="auth-field">
                <label for="authRegisterUsername">${escapeHtml(tf('auth.username', 'Username'))}</label>
                <input id="authRegisterUsername" name="username" type="text" autocomplete="username" required>
            </div>
            <div class="auth-field">
                <label for="authRegisterEmail">${escapeHtml(tf('auth.email', 'Email'))}</label>
                <input id="authRegisterEmail" name="email" type="email" autocomplete="email" required>
            </div>
            <div class="auth-field">
                <label for="authRegisterPassword">${escapeHtml(tf('auth.password', 'Password'))}</label>
                <input id="authRegisterPassword" name="password" type="password" autocomplete="new-password" required>
            </div>
            <div class="auth-field">
                <label for="authRegisterConfirm">${escapeHtml(tf('auth.confirm_password', 'Confirm password'))}</label>
                <input id="authRegisterConfirm" name="confirmPassword" type="password" autocomplete="new-password" required>
            </div>
        `;
    } else if (mode === 'forgot') {
        submitLabel = tf('auth.forgot_submit', 'Send reset link');
        fieldsHtml = `
            <div class="auth-field">
                <label for="authForgotEmail">${escapeHtml(tf('auth.email', 'Email'))}</label>
                <input id="authForgotEmail" name="email" type="email" autocomplete="email" required>
            </div>
        `;
    } else if (mode === 'change-password' && canChangePassword) {
        submitLabel = tf('auth.change_password_submit', 'Change Password');
        fieldsHtml = `
            <div class="auth-field">
                <label for="authCurrentPassword">${escapeHtml(tf('auth.current_password', 'Current password'))}</label>
                <input id="authCurrentPassword" name="currentPassword" type="password" autocomplete="current-password" required>
            </div>
            <div class="auth-field">
                <label for="authNewPassword">${escapeHtml(tf('auth.new_password', 'New password'))}</label>
                <input id="authNewPassword" name="newPassword" type="password" autocomplete="new-password" required>
            </div>
            <div class="auth-field">
                <label for="authConfirmPassword">${escapeHtml(tf('auth.confirm_password', 'Confirm password'))}</label>
                <input id="authConfirmPassword" name="confirmPassword" type="password" autocomplete="new-password" required>
            </div>
        `;
    } else if (mode === 'change-password') {
        fieldsHtml = `<p class="auth-helper-text">${escapeHtml(tf('auth.change_password_unavailable', 'Password changes are not available from this launcher.'))}</p>`;
        submitLabel = '';
    }
    const formActionsHtml = showGuestAction
        ? `<div class="auth-form-actions">
                <button type="submit" class="btn btn-primary auth-submit-btn">${escapeHtml(submitLabel)}</button>
                <button type="button" class="btn btn-secondary auth-guest-btn" data-auth-guest="1">${escapeHtml(continueAsGuestLabel)}</button>
            </div>`
        : `<button type="submit" class="btn btn-primary auth-submit-btn">${escapeHtml(submitLabel)}</button>`;


    const formHtml = mode === 'change-password' && !canChangePassword
        ? fieldsHtml
        : `<form class="auth-form" data-auth-form="${escapeHtml(mode)}">
                    ${fieldsHtml}
                    ${formActionsHtml}
                </form>`;
    return `
        <div class="modal-content auth-modal"${accentStyle}>
            ${ui.backgroundImageUrl ? `<div class="auth-modal-media" aria-hidden="true"><img class="auth-modal-media-img" data-auth-image="media" src="${escapeHtml(ui.backgroundImageUrl)}" alt=""></div>` : ''}
            <div class="modal-header auth-modal-header">
                <div class="auth-brand">
                    <div class="auth-logo-shell" aria-hidden="true">
                        ${ui.logoUrl ? `<img class="auth-logo" data-auth-image="logo" src="${escapeHtml(ui.logoUrl)}" alt="">` : ''}
                        <span class="auth-logo-fallback">${escapeHtml(brandInitials)}</span>
                    </div>
                    <div class="auth-heading">
                        <h2>${escapeHtml(modalTitle)}</h2>
                        ${modalSubtitle ? `<p class="auth-subtitle" data-tooltip="${escapeHtml(modalSubtitle)}"><span class="auth-subtitle-text">${escapeHtml(modalSubtitle)}</span></p>` : ''}
                    </div>
                </div>
                <div class="auth-header-actions">
                    ${showHeaderBack ? `<button type="button" class="modal-close auth-header-back" data-auth-mode="login" data-tooltip="${escapeHtml(backToLoginLabel)}" aria-label="${escapeHtml(backToLoginLabel)}">↩</button>` : ''}
                    <button type="button" class="modal-close ${hideClose ? 'hidden' : ''}" data-auth-close="1" aria-label="${escapeHtml(tf('tooltip.close', 'Close'))}">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                            <line x1="18" y1="6" x2="6" y2="18"/>
                            <line x1="6" y1="6" x2="18" y2="18"/>
                        </svg>
                    </button>
                </div>
            </div>
            <div class="modal-body auth-modal-body">
                ${showAccountCard ? `
                    <div class="auth-account-card">
                        <div class="auth-account-title">${escapeHtml(tf('auth.signed_in_as', 'Signed in as'))}</div>
                        <div class="auth-account-value">${escapeHtml(getAuthUserLabel())}</div>
                    </div>
                ` : ''}
                ${formHtml}
                ${renderAuthProviderButtons()}
                ${renderOAuthCompletionPanel()}
            </div>
            <div class="modal-footer auth-modal-footer">
                ${footerLinks[mode] || ''}
            </div>
        </div>
    `;
}

function resolveAuthMode(mode) {
    const endpoints = state.authConfig?.endpoints || {};
    if (mode === 'register' && !endpoints.registerUrl) return 'login';
    if (mode === 'forgot' && !endpoints.forgotPasswordUrl) return 'login';
    return mode;
}

function showAuthModal(mode = 'login') {
    const requestedMode = resolveAuthMode(mode);
    const resolvedMode = isAuthenticated() && requestedMode === 'login' ? 'change-password' : requestedMode;
    state.authModal.open = true;
    state.authModal.mode = resolvedMode;

    let modal = document.getElementById('authModal');
    if (!modal) {
        modal = document.createElement('div');
        modal.id = 'authModal';
        modal.className = 'modal-overlay auth-modal-overlay';
        document.body.appendChild(modal);
    }

    modal.innerHTML = renderAuthModal(resolvedMode);
    wireAuthImageFallbacks(modal);
    modal.style.display = 'flex';

    modal.querySelectorAll('[data-auth-close]').forEach((button) => {
        button.addEventListener('click', () => closeAuthModal());
    });
    modal.querySelectorAll('[data-auth-mode]').forEach((button) => {
        button.addEventListener('click', () => switchAuthMode(button.getAttribute('data-auth-mode')));
    });
    modal.querySelectorAll('[data-auth-oauth]').forEach((button) => {
        button.addEventListener('click', () => startOAuthLogin(button.getAttribute('data-auth-oauth')));
    });
    modal.querySelectorAll('[data-auth-open-browser]').forEach((button) => {
        button.addEventListener('click', async () => {
            if (state.authModal.oauthProvider) {
                await startOAuthLogin(state.authModal.oauthProvider);
            }
        });
    });
    modal.querySelectorAll('[data-auth-logout]').forEach((button) => {
        button.addEventListener('click', logoutAuth);
    });
    modal.querySelectorAll('[data-auth-guest]').forEach((button) => {
        button.addEventListener('click', continueAsGuest);
    });

    const form = modal.querySelector('[data-auth-form]');
    if (form) {
        form.addEventListener('submit', handleAuthFormSubmit);
    }

    modal.onclick = (event) => {
        if (event.target === modal && !shouldLockAuthModal()) {
            closeAuthModal();
        }
    };
}

function closeAuthModal(force = false) {
    if (!force && shouldLockAuthModal()) return;
    state.authModal.open = false;
    state.authModal.awaitingCode = false;
    state.authModal.oauthProvider = null;
    state.authModal.authorizationUrl = null;
    const modal = document.getElementById('authModal');
    if (modal) {
        modal.innerHTML = '';
        modal.style.display = 'none';
    }
}

function continueAsGuest() {
    closeAuthModal(true);
    if (state.current === AppState.AUTH_PENDING && !isForcedAuth()) {
        setAppState(AppState.READY);
        updateStatus(t('status.ready'));
    }
}

function switchAuthMode(mode) {
    state.authModal.awaitingCode = false;
    state.authModal.oauthProvider = null;
    state.authModal.authorizationUrl = null;
    showAuthModal(mode);
}

async function handleAuthFormSubmit(event) {
    event.preventDefault();
    const form = event.currentTarget;
    const mode = form?.getAttribute('data-auth-form');

    try {
        if (mode === 'login') {
            const username = document.getElementById('authUsername')?.value?.trim();
            const password = document.getElementById('authPassword')?.value || '';
            const keepLoggedIn = document.getElementById('authKeepLoggedIn')?.checked ?? true;
            if (!username || !password) throw new Error(tf('auth.validation_missing', 'Please complete all required fields.'));
            await ipcBridge.invoke('AuthLogin', { username, password, keepLoggedIn });
            showToast(tf('auth.login_success', 'Signed in successfully'), 'success');
        } else if (mode === 'register') {
            const username = document.getElementById('authRegisterUsername')?.value?.trim();
            const email = document.getElementById('authRegisterEmail')?.value?.trim();
            const password = document.getElementById('authRegisterPassword')?.value || '';
            const confirmPassword = document.getElementById('authRegisterConfirm')?.value || '';
            if (!username || !email || !password || !confirmPassword) throw new Error(tf('auth.validation_missing', 'Please complete all required fields.'));
            if (password !== confirmPassword) throw new Error(tf('auth.validation_password_mismatch', 'Passwords do not match.'));
            await ipcBridge.invoke('AuthRegister', { username, email, password });
            showToast(tf('auth.register_success', 'Account created successfully'), 'success');
        } else if (mode === 'forgot') {
            const email = document.getElementById('authForgotEmail')?.value?.trim();
            if (!email) throw new Error(tf('auth.validation_missing', 'Please complete all required fields.'));
            await ipcBridge.invoke('AuthForgotPassword', { email });
            showToast(tf('auth.forgot_success', 'Password reset instructions sent'), 'success');
            switchAuthMode('login');
        } else if (mode === 'change-password') {
            const currentPassword = document.getElementById('authCurrentPassword')?.value || '';
            const newPassword = document.getElementById('authNewPassword')?.value || '';
            const confirmPassword = document.getElementById('authConfirmPassword')?.value || '';
            if (!currentPassword || !newPassword || !confirmPassword) throw new Error(tf('auth.validation_missing', 'Please complete all required fields.'));
            if (newPassword !== confirmPassword) throw new Error(tf('auth.validation_password_mismatch', 'Passwords do not match.'));
            await ipcBridge.invoke('AuthChangePassword', { currentPassword, newPassword });
            showToast(tf('auth.change_password_success', 'Password updated successfully'), 'success');
            closeAuthModal(true);
        }
    } catch (error) {
        showToast(formatErrorMessage(error), 'error');
    }
}

async function startOAuthLogin(providerId) {
    if (!providerId) return;
    try {
        const result = await ipcBridge.invoke('AuthOAuthStart', { provider: providerId });
        if ((result && result.authenticated === true) || state.authState.authenticated) {
            showToast(tf('auth.login_success', 'Signed in successfully'), 'success');
            return;
        }
        state.authModal.oauthProvider = providerId;
        state.authModal.awaitingCode = true;
        state.authModal.authorizationUrl = null;
        showToast(tf('auth.oauth_browser_opened', 'Finish sign-in in your browser. The launcher will complete sign-in automatically.'), 'info');
        showAuthModal(state.authModal.mode);
    } catch (error) {
        showToast(formatErrorMessage(error), 'error');
    }
}


async function logoutAuth() {
    try {
        await ipcBridge.invoke('AuthLogout');
        showToast(tf('auth.logout_success', 'Signed out successfully'), 'info');
        if (state.authConfig) {
            switchAuthMode('login');
        }
    } catch (error) {
        showToast(formatErrorMessage(error), 'error');
    }
}

// ===== SETTINGS MANAGEMENT =====
const settingsState = {
    isOpen: false,
    loading: false,
    data: null
};

async function openSettings() {
    if (settingsState.isOpen) return;
    
    settingsState.loading = true;
    try {
        const [settings, cdnStatus] = await Promise.all([
            ipcBridge.invoke("GetSettings"),
            ipcBridge.invoke("GetCdnStatus").catch(() => [])
        ]);
        if (settings) {
            settingsState.data = settings;
            showSettingsModal(settings, Array.isArray(cdnStatus) ? cdnStatus : []);
        }
    } catch (err) {
        logger.error("Failed to load settings", { error: String(err) });
        showToast(t("error.settings_load_failed") || "Failed to load settings", "error");
    } finally {
        settingsState.loading = false;
    }
}

async function saveSettings(newSettings) {
    try {
        await ipcBridge.invoke("SaveSettings", { settings: newSettings });
        settingsState.data = { ...settingsState.data, ...newSettings };
        showToast(t("ui.settings_saved") || "Settings saved", "success");
        closeSettingsModal();
    } catch (err) {
        logger.error("Failed to save settings", { error: String(err) });
        showToast(t("error.settings_save_failed") || "Failed to save settings", "error");
    }
}


async function confirmNative(title, message) {
    const response = await ipcBridge.invoke("ConfirmDialog", { title, message });
    return Boolean(response && response.confirmed === true);
}

async function resetSettings() {
    const confirmed = await confirmNative(
        t("ui.reset_settings_title") || "Reset Settings",
        t("ui.confirm_reset_settings") || "Reset all settings to defaults?"
    );
    if (!confirmed) return;
    
    try {
        await ipcBridge.invoke("ResetSettings");
        const settings = await ipcBridge.invoke("GetSettings");
        settingsState.data = settings;
        if (settings.logging) {
            logger._uiLogging = settings.logging.uiLogging !== false;
            logger._ipcTracing = settings.logging.ipcTracing === true;
        }
        showToast(t("ui.settings_reset") || "Settings reset to defaults", "success");
        closeSettingsModal();
    } catch (err) {
        logger.error("Failed to reset settings", { error: String(err) });
        showToast(t("error.settings_reset_failed") || "Failed to reset settings", "error");
    }
}

function showSettingsModal(settings, cdnStatus = []) {
    settingsState.isOpen = true;
    
    // Create modal if it doesn't exist
    let modal = document.getElementById('settingsModal');
    if (!modal) {
        modal = document.createElement('div');
        modal.id = 'settingsModal';
        modal.className = 'modal-overlay';
        document.body.appendChild(modal);
    }
    
    const bandwidthValue = settings.bandwidth?.limit 
        ? (settings.bandwidth.limit / 1024 / 1024).toFixed(1) 
        : '';

    const cdnRegionOptions = buildCdnRegionOptions(settings.cdnRegion, cdnStatus);
    
    
    modal.innerHTML = `
        <div class="modal-content settings-modal">
            <div class="modal-header">
                <h2>${t("settings.title") || "Settings"}</h2>
                <button class="modal-close" onclick="closeSettingsModal()">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                        <line x1="18" y1="6" x2="6" y2="18"/>
                        <line x1="6" y1="6" x2="18" y2="18"/>
                    </svg>
                </button>
            </div>
            <div class="modal-body">
                <div class="settings-section">
                    <h3>${t("settings.download") || "Download"}</h3>
                    <div class="settings-row">
                        <label>${t("settings.bandwidth_limit") || "Bandwidth Limit (MB/s)"}</label>
                        <input type="number" id="settingsBandwidth" value="${bandwidthValue}" 
                               placeholder="${t("settings.unlimited") || "Unlimited"}" min="0" step="0.5">
                    </div>
                    <div class="settings-row">
                        <label>${t("settings.auto_bandwidth") || "Auto-adjust bandwidth"}</label>
                        <input type="checkbox" id="settingsAutoBandwidth" ${settings.bandwidth?.auto ? 'checked' : ''}>
                    </div>
                    <div class="settings-row">
                        <label>${t("settings.concurrent_downloads") || "Concurrent Downloads"}</label>
                        <input type="number" id="settingsConcurrency" value="${settings.concurrency?.downloads || 4}" min="1" max="16">
                    </div>
                    <div class="settings-row">
                        <label>${t("settings.download_execution") || "Download Execution"}</label>
                        <select id="settingsDownloadExecution">
                            <option value="threadPool" ${(settings.download?.executionMode || 'threadPool') === 'threadPool' ? 'selected' : ''}>${t("settings.thread_pool") || "Thread pool"}</option>
                            <option value="oneByOne" ${settings.download?.executionMode === 'oneByOne' ? 'selected' : ''}>${t("settings.one_by_one") || "One by one"}</option>
                        </select>
                    </div>
                    <div class="settings-row">
                        <label>${t("settings.write_mode") || "Write Mode"}</label>
                        <select id="settingsWriteMode">
                            <option value="directToDisk" ${(settings.download?.writeMode || 'directToDisk') === 'directToDisk' ? 'selected' : ''}>${t("settings.direct_to_disk") || "Direct to disk"}</option>
                            <option value="memoryBuffer" ${settings.download?.writeMode === 'memoryBuffer' ? 'selected' : ''}>${t("settings.memory_buffer") || "Memory buffer"}</option>
                        </select>
                    </div>
                    <div class="settings-row">
                        <label>${t("settings.cdn_region") || "CDN Region"}</label>
                        <select id="settingsCdnRegion">
                            ${cdnRegionOptions}
                        </select>
                    </div>
                </div>
                <div class="settings-section">
                    <h3>${t("settings.appearance") || "Appearance"}</h3>
                    <div class="settings-row">
                        <label>${t("settings.theme") || "Theme"}</label>
                        <select id="settingsTheme">
                            <option value="dark" ${settings.theme === 'dark' ? 'selected' : ''}>${t("settings.theme_dark") || "Dark"}</option>
                            <option value="light" ${settings.theme === 'light' ? 'selected' : ''}>${t("settings.theme_light") || "Light"}</option>
                        </select>
                    </div>
                    <div class="settings-row">
                        <label>${t("settings.custom_chrome") || "Custom Chrome"}</label>
                        <input type="checkbox" id="settingsCustomChrome" ${settings.customChrome ? 'checked' : ''}>
                    </div>
                    <div class="settings-row">
                        <label>${t("settings.resizable") || "Resizable Window"}</label>
                        <input type="checkbox" id="settingsResizable" ${settings.resizable !== false ? 'checked' : ''}>
                    </div>
                    <div class="settings-row">
                        <label>${t("settings.transparent") || "Transparent Window"}</label>
                        <input type="checkbox" id="settingsTransparent" ${settings.transparent ? 'checked' : ''}>
                    </div>
                    <div class="settings-row">
                        <label>${t("settings.start_hidden") || "Start Hidden"}</label>
                        <input type="checkbox" id="settingsStartHidden" ${settings.startHidden ? 'checked' : ''}>
                    </div>
                </div>
                <div class="settings-section">
                    <h3>${t("settings.notifications") || "Notifications"}</h3>
                    <div class="settings-row">
                        <label>${t("settings.notifications_enabled") || "Enable Notifications"}</label>
                        <input type="checkbox" id="settingsNotificationsEnabled" ${settings.notifications?.enabled !== false ? 'checked' : ''}>
                    </div>
                    <div class="settings-row">
                        <label>${t("settings.notification_download_complete") || "Download Complete"}</label>
                        <input type="checkbox" id="settingsNotificationDownloadComplete" ${settings.notifications?.downloadComplete !== false ? 'checked' : ''}>
                    </div>
                    <div class="settings-row">
                        <label>${t("settings.notification_update_available") || "Update Available"}</label>
                        <input type="checkbox" id="settingsNotificationUpdateAvailable" ${settings.notifications?.updateAvailable !== false ? 'checked' : ''}>
                    </div>
                    <div class="settings-row">
                        <label>${t("settings.notification_errors") || "Errors"}</label>
                        <input type="checkbox" id="settingsNotificationErrors" ${settings.notifications?.errors !== false ? 'checked' : ''}>
                    </div>
                </div>
                <div class="settings-section">
                    <h3>${t("settings.startup") || "Startup"}</h3>
                    <div class="settings-row">
                        <label>${t("settings.check_for_updates") || "Check for Updates on Start"}</label>
                        <input type="checkbox" id="settingsCheckForUpdates" ${settings.startup?.checkForUpdates !== false ? 'checked' : ''}>
                    </div>
                    <div class="settings-row">
                        <label>${t("settings.minimize_to_tray") || "Minimize to Tray"}</label>
                        <input type="checkbox" id="settingsMinimizeToTray" ${settings.startup?.minimizeToTray ? 'checked' : ''}>
                    </div>
                    <div class="settings-row">
                        <label>${t("settings.launch_on_boot") || "Launch on Boot"}</label>
                        <input type="checkbox" id="settingsLaunchOnBoot" ${settings.startup?.launchOnBoot ? 'checked' : ''}>
                    </div>
                </div>
                <div class="settings-section">
                    <h3>${t("settings.logging") || "Logging"}</h3>
                    <div class="settings-row">
                        <label>${t("settings.ui_logging") || "UI Logging"}</label>
                        <input type="checkbox" id="settingsUiLogging" ${settings.logging?.uiLogging !== false ? 'checked' : ''}>
                    </div>
                    <div class="settings-row">
                        <label>${t("settings.ipc_tracing") || "IPC Tracing"}</label>
                        <input type="checkbox" id="settingsIpcTracing" ${settings.logging?.ipcTracing ? 'checked' : ''}>
                    </div>
                </div>
                <div class="settings-section">
                    <h3>${t("settings.game") || "Game"}</h3>
                    <div class="settings-row">
                        <label>${t("settings.game_settings_manager") || "Game Settings Manager"}</label>
                        <button class="btn btn-secondary btn-sm" onclick="launchGameSettingsManager()">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="width:14px;height:14px;margin-right:6px;">
                                <path d="M12 20h9"/><path d="M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z"/>
                            </svg>
                            ${t("button.open") || "Open"}
                        </button>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button class="btn btn-secondary" onclick="resetSettings()">${t("button.reset") || "Reset"}</button>
                <button class="btn btn-primary" onclick="applySettings()">${t("button.save") || "Save"}</button>
            </div>
        </div>
    `;
    
    modal.style.display = 'flex';
    logger.debug("Settings modal opened");
}

function closeSettingsModal() {
    settingsState.isOpen = false;
    const modal = document.getElementById('settingsModal');
    if (modal) {
        modal.style.display = 'none';
    }
}

function applySettings() {
    const bandwidthInput = document.getElementById('settingsBandwidth');
    const autoBandwidth = document.getElementById('settingsAutoBandwidth');
    const concurrency = document.getElementById('settingsConcurrency');
    const downloadExecution = document.getElementById('settingsDownloadExecution');
    const writeMode = document.getElementById('settingsWriteMode');
    const theme = document.getElementById('settingsTheme');
    const cdnRegion = document.getElementById('settingsCdnRegion');
    const customChrome = document.getElementById('settingsCustomChrome');
    const resizable = document.getElementById('settingsResizable');
    const transparent = document.getElementById('settingsTransparent');
    const startHidden = document.getElementById('settingsStartHidden');
    const notificationsEnabled = document.getElementById('settingsNotificationsEnabled');
    const notificationDownloadComplete = document.getElementById('settingsNotificationDownloadComplete');
    const notificationUpdateAvailable = document.getElementById('settingsNotificationUpdateAvailable');
    const notificationErrors = document.getElementById('settingsNotificationErrors');
    const checkForUpdates = document.getElementById('settingsCheckForUpdates');
    const minimizeToTray = document.getElementById('settingsMinimizeToTray');
    const launchOnBoot = document.getElementById('settingsLaunchOnBoot');
    const uiLogging = document.getElementById('settingsUiLogging');
    const ipcTracing = document.getElementById('settingsIpcTracing');
    
    const newSettings = {};
    
    // Bandwidth limit (convert MB/s to bytes/s)
    if (bandwidthInput) {
        const mbps = parseFloat(bandwidthInput.value);
        newSettings.bandwidth = {
            limit: mbps > 0 ? Math.round(mbps * 1024 * 1024) : null,
            auto: autoBandwidth?.checked || false
        };
    }
    
    // Concurrency
    if (concurrency) {
        const count = parseInt(concurrency.value, 10);
        if (count >= 1 && count <= 16) {
            newSettings.concurrency = { downloads: count };
        }
    }

    // Download behavior
    if (downloadExecution || writeMode) {
        newSettings.download = {
            executionMode: downloadExecution?.value || 'threadPool',
            writeMode: writeMode?.value || 'directToDisk'
        };
    }
    
    // Theme
    if (theme) {
        newSettings.theme = theme.value;
    }

    // CDN region
    if (cdnRegion) {
        newSettings.cdnRegion = cdnRegion.value || 'auto';
    }

    newSettings.ui = {
        customChrome: customChrome?.checked || false,
        resizable: resizable ? resizable.checked : true,
        transparent: transparent?.checked || false,
        startHidden: startHidden?.checked || false
    };

    newSettings.notifications = {
        enabled: notificationsEnabled ? notificationsEnabled.checked : true,
        downloadComplete: notificationDownloadComplete ? notificationDownloadComplete.checked : true,
        updateAvailable: notificationUpdateAvailable ? notificationUpdateAvailable.checked : true,
        errors: notificationErrors ? notificationErrors.checked : true
    };

    newSettings.startup = {
        checkForUpdates: checkForUpdates ? checkForUpdates.checked : true,
        minimizeToTray: minimizeToTray?.checked || false,
        launchOnBoot: launchOnBoot?.checked || false
    };

    newSettings.logging = {
        uiLogging: uiLogging ? uiLogging.checked : true,
        ipcTracing: ipcTracing?.checked || false
    };

    logger._uiLogging = newSettings.logging.uiLogging;
    logger._ipcTracing = newSettings.logging.ipcTracing;
    
    saveSettings(newSettings);
}

async function getDownloadStats() {
    try {
        return await ipcBridge.invoke("GetDownloadStats");
    } catch (err) {
        logger.debug("Failed to get download stats", { error: String(err) });
        return null;
    }
}

function toggleFolderDropdown() {
    const wrapper = $('#folderWrapper');
    if (!wrapper) return;

    wrapper.classList.toggle('open');

    // Close on outside click
    const closeHandler = (e) => {
        if (!wrapper.contains(e.target)) {
            wrapper.classList.remove('open');
            document.removeEventListener('click', closeHandler);
        }
    };

    if (wrapper.classList.contains('open')) {
        setTimeout(() => document.addEventListener('click', closeHandler), 0);
    }
}

function toggleUtilitiesDropdown() {
    const wrapper = $('#utilitiesWrapper');
    if (!wrapper) return;

    wrapper.classList.toggle('open');

    const closeHandler = (e) => {
        if (!wrapper.contains(e.target)) {
            wrapper.classList.remove('open');
            document.removeEventListener('click', closeHandler);
        }
    };

    if (wrapper.classList.contains('open')) {
        setTimeout(() => document.addEventListener('click', closeHandler), 0);
    }
}

async function openFolderAction(type) {
    // Close dropdown first
    const wrapper = $('#folderWrapper');
    if (wrapper) wrapper.classList.remove('open');

    try {
        let path = null;

        switch (type) {
            case 'game':
                const installResult = await ipcBridge.invoke("GetInstallPath");
                if (installResult && installResult.path) {
                    path = installResult.path;
                }
                break;

            case 'launcher':
                // Open the launcher's own directory (where the exe is located)
                path = '.';
                break;

            case 'logs':
                // Open logs folder - typically in AppData or launcher directory
                const cacheResult = await ipcBridge.invoke("GetCachePath", { key: "logs" });
                if (cacheResult && cacheResult.path) {
                    path = cacheResult.path;
                } else {
                    // Fallback to launcher directory logs
                    path = './logs';
                }
                break;

            case 'config':
                // Open config folder
                const configResult = await ipcBridge.invoke("GetCachePath", { key: "config" });
                if (configResult && configResult.path) {
                    path = configResult.path;
                } else {
                    // Fallback to launcher directory
                    path = '.';
                }
                break;

            default:
                logger.warn(`Unknown folder type: ${type}`);
                return;
        }

        if (path) {
            await ipcBridge.invoke("OpenFolder", { path });
            logger.debug(`Opened folder: ${type}`, { path });
        } else {
            showToast(t("error.folder_not_found") || "Folder not found", "warning");
        }
    } catch (err) {
        logger.error(`Failed to open ${type} folder`, { error: err });
        showToast(t("error.open_folder_failed") || "Failed to open folder", "error");
    }
}

async function openFolder() {
    // Legacy function - redirect to game folder
    await openFolderAction('game');
}


// ===== TABS =====
function switchTab(tabName) {
    state.currentTab = tabName;
    
    // Update tab buttons
    $$('.nav-tab').forEach(tab => {
        tab.classList.toggle('active', tab.dataset.tab === tabName);
    });
    
    // Update tab panels
    $$('.tab-panel').forEach(panel => {
        panel.classList.toggle('active', panel.id === `${tabName}-panel`);
    });
}

// ===== LANGUAGE =====
const LANGUAGE_META = {
    en: { label: 'English', native: 'English', flag: 'us' },
    tr: { label: 'Turkish', native: 'Türkçe', flag: 'tr' },
    de: { label: 'German', native: 'Deutsch', flag: 'de' },
    es: { label: 'Spanish', native: 'Español', flag: 'es' },
    fr: { label: 'French', native: 'Français', flag: 'fr' },
    pt: { label: 'Portuguese', native: 'Português', flag: 'pt' },
    zh: { label: 'Chinese', native: '中文', flag: 'cn' }
};

function normalizeLanguageCode(lang) {
    return String(lang || '').trim().toLowerCase().replace('_', '-');
}

function getSystemLanguagePreference(languages = null) {
    const preferred = Array.isArray(languages) && languages.length
        ? languages
        : [
            ...(Array.isArray(navigator.languages) ? navigator.languages : []),
            navigator.language
        ];

    for (const raw of preferred) {
        const normalized = normalizeLanguageCode(raw);
        if (!normalized) continue;
        const exact = state.availableLanguages.find(lang => normalizeLanguageCode(lang) === normalized);
        if (exact) return exact;
        const base = normalized.split('-')[0];
        const baseMatch = state.availableLanguages.find(lang => normalizeLanguageCode(lang).split('-')[0] === base);
        if (baseMatch) return baseMatch;
    }

    return null;
}


function getLanguageMeta(code) {
    const normalized = (code || '').toLowerCase();
    const shortCode = normalized.split('-')[0];
    const meta = LANGUAGE_META[normalized] || LANGUAGE_META[shortCode] || {};
    const displayCode = shortCode || normalized || '??';
    const flagKey = meta.flag || shortCode || normalized || 'un';
    return {
        code: displayCode ? displayCode.toUpperCase() : '??',
        label: meta.label || displayCode.toUpperCase(),
        native: meta.native || meta.label || displayCode.toUpperCase(),
        flagClass: `fi fi-${flagKey}`
    };
}

function updateLangButton() {
    const meta = getLanguageMeta(state.currentLang);
    const langCurrent = $('#langCurrent');
    if (!langCurrent) return;
    
    const flagEl = langCurrent.querySelector('.lang-flag');
    const codeEl = langCurrent.querySelector('.lang-current-code');
    const nameEl = langCurrent.querySelector('.lang-current-name');
    
    if (flagEl) flagEl.className = `lang-flag ${meta.flagClass}`;
    if (codeEl) codeEl.textContent = meta.code;
    if (nameEl) nameEl.textContent = meta.label;
}

function toggleLangDropdown() {
    const btn = $('.lang-btn');
    if (!btn) return;

    renderLanguageOptions();
    btn.classList.toggle('open');
    
    // Close on outside click
    const closeHandler = (e) => {
        if (!btn.contains(e.target)) {
            btn.classList.remove('open');
            document.removeEventListener('click', closeHandler);
        }
    };
    
    if (btn.classList.contains('open')) {
        setTimeout(() => document.addEventListener('click', closeHandler), 0);
    }
}

async function changeLanguage(lang) {
    const selectedLang = (lang || 'en').toLowerCase();
    state.currentLang = selectedLang;
    const langBtn = $('.lang-btn');
    if (langBtn) langBtn.classList.remove('open');
    
    renderLanguageOptions();
    updateLangButton();
    
    try {
        await ipcBridge.invoke("SetLanguage", { lang: selectedLang });
        // Translations will be updated via LanguageChanged event
    } catch (err) {
        logger.warn("Failed to set language", { error: err, lang });
    }
}

async function selectInitialLanguage(config = {}) {
    if (config.languageExplicit === true) return;
    const systemLang = getSystemLanguagePreference();
    if (!systemLang || systemLang === state.currentLang) return;
    await changeLanguage(systemLang);
}


function applyTranslations() {
    document.title = t("app.title");
    setText("titleLogo", t("app.title"));
    document.documentElement.lang = state.currentLang;
    updateLangButton();
    
    // Update all data-i18n elements
    $$("[data-i18n]").forEach(el => {
        const key = el.getAttribute("data-i18n");
        el.textContent = t(key);
    });
    
    // Update tooltips via custom data-tooltip only; remove title to avoid native OS/browser tooltips
    $$("[data-tooltip-i18n]").forEach(el => {
        const key = el.getAttribute("data-tooltip-i18n");
        const translated = t(key);
        el.setAttribute("aria-label", translated);
        el.setAttribute("data-tooltip", translated);
        el.removeAttribute("title");
    });
    
    // Update button states based on current app state
    updateButtonState();
    // Re-render localized content with new language
    renderSlides();
    renderChangelog();
}

async function loadTranslations() {
    try {
        const res = await ipcBridge.invoke("GetTranslations");
        if (res && res.translations) {
            state.translations = res.translations;
            state.currentLang = typeof res.lang === 'string' ? res.lang.toLowerCase() : state.currentLang;
            logger.info("Translations loaded", { lang: state.currentLang, keyCount: Object.keys(state.translations).length });
        } else {
            logger.warn("No translations received from backend");
        }
    } catch (err) {
        logger.error("Failed to load translations", { error: err });
    }
    updateLangButton();
    applyTranslations();
}

async function loadAvailableLanguages() {
    try {
        const res = await ipcBridge.invoke("GetAvailableLanguages");
        if (res && res.languages) {
            // Handle both old format (string[]) and new format (LanguageInfo[])
            const languages = Array.isArray(res.languages) ? res.languages : [];
            const normalized = languages.map(lang => {
                if (typeof lang === 'string') {
                    return lang.toLowerCase();
                } else if (lang && typeof lang === 'object') {
                    // New LanguageInfo format: { code, native_name, flag_code }
                    const code = (lang.code || '').toLowerCase();
                    // Update LANGUAGE_META dynamically with server data
                    if (code && (lang.english_name || lang.native_name)) {
                        LANGUAGE_META[code] = {
                            label: lang.english_name || lang.native_name || code.toUpperCase(),
                            native: lang.native_name || lang.english_name || code.toUpperCase(),
                            flag: lang.flag_code || code
                        };
                    }
                    return code;
                }
                return null;
            }).filter(Boolean);
            state.availableLanguages = normalized.length ? normalized : ['en'];
            renderLanguageOptions();
            logger.info("Available languages loaded", { languages: state.availableLanguages });
        }
    } catch (err) {
        logger.warn("Failed to load available languages", { error: err });
    }
}

function renderLanguageOptions() {
    const dropdown = $('.lang-dropdown');
    if (!dropdown) return;
    
    const list = dropdown.querySelector('.lang-option-list');
    if (!list) return;

    const languages = (state.availableLanguages && state.availableLanguages.length) ? state.availableLanguages : ['en'];
    const sortedLangs = [...languages].sort((a, b) => {
        const nameA = getLanguageMeta(a).label || a;
        const nameB = getLanguageMeta(b).label || b;
        return nameA.localeCompare(nameB);
    });

    const selectedLang = languages.includes(state.currentLang) ? state.currentLang : (sortedLangs[0] || 'en');

    list.innerHTML = sortedLangs.map(lang => {
        const meta = getLanguageMeta(lang);
        const isActive = lang === selectedLang;
        return `
            <div class="lang-option ${isActive ? 'active' : ''}" 
                 data-lang="${lang}" 
                 onclick="changeLanguage('${lang}')">
                <div class="lang-option-main">
                    <span class="lang-flag ${meta.flagClass}"></span>
                    <div class="lang-text">
                        <span class="lang-name">${meta.label}</span>
                        <span class="lang-native">${meta.native}</span>
                    </div>
                </div>
                <span class="lang-check">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3">
                        <polyline points="5 12 10 17 19 7"/>
                    </svg>
                </span>
            </div>
        `;
    }).join('');

    updateLangButton();

    const firstOption = list.querySelector('.lang-option');
    if (firstOption) {
        const optionHeight = firstOption.getBoundingClientRect().height || 44;
        const gutter = 12;
        list.style.maxHeight = `${Math.round(optionHeight * 4 + gutter)}px`;
    }
}

// ===== NEWS SLIDER =====
function initSlider() {
    renderSlides();
    updateSliderCounter();
    if (state.newsItems.length > 1) {
        startAutoSlide();
    }
}

function renderSlides() {
    const container = $('#newsSlides');
    if (!container) return;
    
    if (state.newsItems.length === 0) {
        container.innerHTML = `
            <div class="news-slide" data-index="0">
                <div class="news-image">
                    <div class="news-image-placeholder">🎮</div>
                </div>
                <div class="news-content">
                    <div class="news-date">${new Date().toLocaleDateString()}</div>
                    <h3 class="news-title">${t("app.title")}</h3>
                    <p class="news-description">${t("status.ready")}</p>
                </div>
            </div>
        `;
        return;
    }
    
    container.innerHTML = state.newsItems.map((item, i) => {
        const date = item.date ? new Date(item.date).toLocaleDateString() : '';
        const title = getLocalized(item, 'title');
        const content = getLocalized(item, 'content') || getLocalized(item, 'description');
        const badge = getLocalized(item, 'badge');
        return `
            <div class="news-slide" data-index="${i}">
                <div class="news-image">
                    ${item.image ? `<img src="${item.image}" alt="${title}">` : '<div class="news-image-placeholder">🎮</div>'}
                    ${badge ? `<span class="news-badge">${badge}</span>` : ''}
                </div>
                <div class="news-content">
                    <div class="news-date">${date}</div>
                    <h3 class="news-title">${title}</h3>
                    <p class="news-description">${content}</p>
                </div>
            </div>
        `;
    }).join('');
}

function updateSliderCounter() {
    const counter = $('#sliderCounter');
    const total = Math.max(state.newsItems.length, 1);
    if (counter) {
        counter.textContent = `${state.currentSlideIndex + 1} / ${total}`;
    }
}

function updateSliderProgress(percent) {
    const bar = $('#sliderProgressBar');
    if (bar) bar.style.width = percent + '%';
}

function goToSlide(index) {
    const total = Math.max(state.newsItems.length, 1);
    state.currentSlideIndex = Math.max(0, Math.min(index, total - 1));
    const slides = $('#newsSlides');
    if (slides) {
        slides.style.transform = `translateX(-${state.currentSlideIndex * 100}%)`;
    }
    updateSliderCounter();
    resetSliderProgress();
}

function nextSlide() {
    const total = Math.max(state.newsItems.length, 1);
    const next = (state.currentSlideIndex + 1) % total;
    goToSlide(next);
}

function prevSlide() {
    const total = Math.max(state.newsItems.length, 1);
    const prev = (state.currentSlideIndex - 1 + total) % total;
    goToSlide(prev);
}

function resetSliderProgress() {
    state.sliderProgressValue = 0;
    updateSliderProgress(0);
}

function startAutoSlide() {
    if (state.sliderInterval) clearInterval(state.sliderInterval);
    if (state.sliderProgressInterval) clearInterval(state.sliderProgressInterval);
    
    resetSliderProgress();
    
    // Progress bar animation
    const incrementProgress = () => {
        if (state.sliderPaused || document.hidden) return;
        state.sliderProgressValue += 100 / (state.slideDuration / 50);
        updateSliderProgress(Math.min(state.sliderProgressValue, 100));
    };
    
    incrementProgress();
    state.sliderProgressInterval = setInterval(incrementProgress, 50);
    
    // Auto advance
    state.sliderInterval = setInterval(() => {
        if (state.sliderPaused || document.hidden) return;
        nextSlide();
    }, state.slideDuration);
}

function stopAutoSlide() {
    if (state.sliderInterval) {
        clearInterval(state.sliderInterval);
        state.sliderInterval = null;
    }
    if (state.sliderProgressInterval) {
        clearInterval(state.sliderProgressInterval);
        state.sliderProgressInterval = null;
    }
}

function toggleSliderPause() {
    state.sliderPaused = !state.sliderPaused;
    const btn = $('#sliderPauseBtn');
    if (btn) {
        btn.innerHTML = state.sliderPaused 
            ? '<svg viewBox="0 0 24 24" fill="currentColor"><polygon points="5 3 19 12 5 21 5 3"/></svg>'
            : '<svg viewBox="0 0 24 24" fill="currentColor"><rect x="6" y="4" width="4" height="16"/><rect x="14" y="4" width="4" height="16"/></svg>';
    }
}

// ===== CHANGELOG =====
function renderChangelog() {
    const container = $('#changelogList');
    if (!container) return;
    
    if (state.changelogItems.length === 0) {
        container.innerHTML = `
            <div class="changelog-item">
                <div class="changelog-header">
                    <span class="changelog-version">v${state.version}</span>
                    <span class="changelog-date">${new Date().toLocaleDateString()}</span>
                </div>
                <p class="changelog-text">${t("status.ready")}</p>
            </div>
        `;
        return;
    }
    
    container.innerHTML = state.changelogItems.map(item => {
        const date = item.date ? new Date(item.date).toLocaleDateString() : '';
        const text = getLocalized(item, 'text') || getLocalized(item, 'content');
        const detailUrl = typeof item.detailUrl === 'string' ? item.detailUrl.trim() : '';
        const isClickable = detailUrl.length > 0;
        return `
            <div class="changelog-item ${isClickable ? 'has-detail' : ''}"
                 ${isClickable ? `data-detail-url="${escapeHtml(detailUrl)}" role="button" tabindex="0" onclick="openChangelogDetail(this.dataset.detailUrl)" onkeydown="handleChangelogKeydown(event, this.dataset.detailUrl)"` : ''}>
                <div class="changelog-header">
                    <span class="changelog-version">${item.version}</span>
                    <span class="changelog-date">${date}</span>
                </div>
                <p class="changelog-text">${text}</p>
            </div>
        `;
    }).join('');
}

function openChangelogDetail(url) {
    openExternalUrl(url)
        .then(() => {
            logger.debug("Opened changelog detail URL");
        })
        .catch((err) => {
            logger.error(`Failed to open changelog detail URL: ${err}`);
            showToast(t("error.open_url_failed") || "Could not open link", "error");
        });
}

function handleChangelogKeydown(event, url) {
    if (event.key === 'Enter' || event.key === ' ') {
        event.preventDefault();
        openChangelogDetail(url);
    }
}

// ===== PLUGINS / ADDONS =====
function getPluginActionLabel(plugin) {
    const actionType = plugin && plugin.action && plugin.action.type;
    switch (actionType) {
        case 'url':
        case 'executable':
            return t("button.launch") || "Launch";
        case 'copyText':
            return t("button.copy") || "Copy";
        default:
            return t("ui.details") || "Details";
    }
}

function normalizePlugins(rawPlugins) {
    if (!Array.isArray(rawPlugins)) return [];
    return rawPlugins
        .filter(plugin =>
            plugin &&
            typeof plugin === 'object' &&
            typeof plugin.id === 'string' &&
            typeof plugin.title === 'string'
        )
        .slice(0, 64)
        .map(plugin => ({
            id: plugin.id.trim(),
            title: plugin.title.trim(),
            description: typeof plugin.description === 'string' ? plugin.description.trim() : '',
            icon: typeof plugin.icon === 'string' ? plugin.icon.trim() : '',
            enabled: plugin.enabled !== false,
            action: plugin.action && typeof plugin.action === 'object' ? plugin.action : { type: 'none' }
        }))
        .filter(plugin => plugin.id && plugin.title);
}

function renderPlugins() {
    const container = $('#pluginGrid');
    if (!container) return;

    if (state.plugins.length === 0) {
        container.innerHTML = `
            <div class="plugin-empty">
                <div class="plugin-empty-title">${escapeHtml(t("plugins.empty_title") || "No plugins configured")}</div>
                <div class="plugin-empty-text">${escapeHtml(t("plugins.empty_text") || "Platform integrations appear here when the manifest provides them.")}</div>
            </div>
        `;
        return;
    }

    container.innerHTML = state.plugins.map(plugin => {
        const iconText = (plugin.icon || plugin.title).slice(0, 2).toUpperCase();
        const disabled = !plugin.enabled;
        return `
            <article class="plugin-card ${disabled ? 'disabled' : ''}">
                <div class="plugin-icon">${escapeHtml(iconText)}</div>
                <div class="plugin-card-body">
                    <h3 class="plugin-title">${escapeHtml(plugin.title)}</h3>
                    <p class="plugin-description">${escapeHtml(plugin.description)}</p>
                </div>
                <button class="btn btn-secondary btn-sm plugin-action" onclick="runPluginAction(${escapeHtml(JSON.stringify(plugin.id))})" ${disabled ? 'disabled' : ''}>
                    ${escapeHtml(disabled ? (t("plugins.disabled") || "Disabled") : getPluginActionLabel(plugin))}
                </button>
            </article>
        `;
    }).join('');
}

async function runPluginAction(id) {
    try {
        await ipcBridge.invoke("RunPluginAction", { id });
        showToast(t("plugins.action_complete") || "Plugin action complete", "success");
    } catch (err) {
        const errorMsg = formatErrorMessage(err);
        logger.error("Failed to run plugin action", { id, error: errorMsg });
        showToast(errorMsg, "error");
    }
}

// ===== PROGRESS & STATUS =====
const PROGRESS_STATE_CLASSES = [
    'progress-state-idle',
    'progress-state-downloading',
    'progress-state-verifying',
    'progress-state-patching',
    'progress-state-complete',
    'progress-state-error'
];

function normalizeProgressPercent(percent) {
    const value = Number(percent);
    if (!Number.isFinite(value)) return 0;
    return Math.max(0, Math.min(100, value));
}

function resolveProgressStateClass(percent = null, progressState = state.current) {
    if (progressState === AppState.ERROR) return 'progress-state-error';
    if (progressState === AppState.LAUNCH_READY || (percent !== null && normalizeProgressPercent(percent) >= 100)) {
        return 'progress-state-complete';
    }

    switch (progressState) {
        case AppState.DOWNLOADING:
            return 'progress-state-downloading';
        case AppState.CHECKING:
        case AppState.VERIFYING:
            return 'progress-state-verifying';
        case AppState.APPLYING:
            return 'progress-state-patching';
        default:
            return 'progress-state-idle';
    }
}

function updateProgressVisualState(percent = null, progressState = state.current) {
    const bar = $('#progressBar');
    if (!bar) return;

    bar.classList.remove(...PROGRESS_STATE_CLASSES);
    bar.classList.add(resolveProgressStateClass(percent, progressState));
}

function updateProgress(percent, progressState = state.current) {
    const bar = $('#progressBar');
    const safePercent = normalizeProgressPercent(percent);
    if (bar) {
        bar.style.width = safePercent + "%";
        bar.classList.toggle('active', state.isDownloading && safePercent > 0 && safePercent < 100);
        updateProgressVisualState(safePercent, progressState);
    }
}

function updateDownloadStats(speed, downloaded, total, eta, currentFile) {
    // Update size display
    const sizeEl = $('#downloadSize');
    if (sizeEl) {
        sizeEl.textContent = total > 0 ? `${formatBytes(downloaded || 0)} / ${formatBytes(total)}` : '';
    }
    
    // Update speed in progress bar
    const speedEl = $('#progressSpeed');
    if (speedEl) {
        speedEl.textContent = state.isDownloading && speed > 0 ? formatSpeed(speed) : '';
    }
    
    // Update ETA if available
    const etaEl = $('#downloadEta');
    if (etaEl) {
        etaEl.textContent = state.isDownloading && eta > 0 ? formatETA(eta) : '';
    }
}

function updateStatus(text) {
    const safeText = typeof text === 'string' ? text : formatErrorMessage(text);
    setText("statusText", safeText);
}

function normalizeVersionLabel(value) {
    if (typeof value !== 'string') return null;
    const trimmed = value.trim();
    if (!trimmed) return null;
    return trimmed.toLowerCase().startsWith('v') ? trimmed : `v${trimmed}`;
}

function normalizeStageLabel(value) {
    if (typeof value !== 'string') return null;
    const trimmed = value.trim();
    return trimmed ? trimmed.toUpperCase() : null;
}

function updateVersionStageInfo() {
    const versionEl = $('#versionValue');
    const stageEl = $('#stageValue');
    if (!versionEl || !stageEl) return;

    versionEl.textContent = normalizeVersionLabel(state.gameVersion) || normalizeVersionLabel(state.version) || 'v0.0.0';
    stageEl.textContent = normalizeStageLabel(state.stage) || 'PRODUCTION';
}

function setAppState(newState) {
    state.current = normalizeStateForForcedLauncherUpdate(newState);
    updateButtonState();

    const bar = $('#progressBar');
    if (bar) {
        const currentPercent = normalizeProgressPercent(parseFloat(bar.style.width));
        bar.classList.toggle('active', state.isDownloading && currentPercent > 0 && currentPercent < 100);
        updateProgressVisualState(currentPercent, state.current);
    }
}

function updateButtonState() {
    const launchBtn = $('#launchBtn');
    const launchBtnText = $('#launchBtnText');

    if (!launchBtn || !launchBtnText) return;

    if (state.launcherUpdateCheckPending && !state.launcherUpdateForced) {
        launchBtn.classList.add("downloading");
        launchBtn.disabled = true;
        launchBtnText.textContent = t("button.checking") || "CHECKING...";
        state.isDownloading = false;
    } else if (state.launcherUpdateForced) {
        if (state.current === AppState.APPLYING) {
            launchBtn.classList.add("downloading");
            launchBtn.disabled = true;
            launchBtnText.textContent = tf("button.updating_launcher", "UPDATING LAUNCHER...");
            state.isDownloading = true;
        } else {
            launchBtn.classList.remove("downloading");
            launchBtn.disabled = false;
            launchBtnText.textContent = tf("button.update_launcher", "UPDATE LAUNCHER");
            state.isDownloading = false;
        }
    } else {
        switch (state.current) {
            case AppState.STARTUP:
            case AppState.READY:
            case AppState.LAUNCH_READY:
                launchBtn.classList.remove("downloading");
                launchBtn.disabled = false;
                launchBtnText.textContent = t("button.launch") || "START GAME";
                state.isDownloading = false;
                break;
            case AppState.CHECKING:
                launchBtn.classList.add("downloading");
                launchBtn.disabled = true;
                launchBtnText.textContent = t("button.checking") || "CHECKING...";
                break;
            case AppState.UPDATE_AVAILABLE:
                launchBtn.classList.remove("downloading");
                launchBtn.disabled = false;
                launchBtnText.textContent = t("button.download") || "UPDATE";
                break;
            case AppState.DOWNLOADING:
            case AppState.VERIFYING:
            case AppState.APPLYING:
                launchBtn.classList.add("downloading");
                launchBtn.disabled = true;
                launchBtnText.textContent = t("button.downloading") || "DOWNLOADING...";
                state.isDownloading = true;
                break;
            case AppState.MAINTENANCE:
                launchBtn.classList.remove("downloading");
                launchBtn.disabled = true;
                launchBtnText.textContent = t("error.maintenance") || "Maintenance";
                state.isDownloading = false;
                break;
            case AppState.LAUNCHING:
                launchBtn.disabled = true;
                launchBtnText.textContent = t("status.launching") || "LAUNCHING...";
                state.isDownloading = false;
                break;
            case AppState.ERROR:
                launchBtn.classList.remove("downloading");
                launchBtn.disabled = false;
                launchBtnText.textContent = t("button.retry") || "RETRY";
                state.isDownloading = false;
                break;
            case AppState.EULA_PENDING:
                launchBtn.disabled = true;
                state.isDownloading = false;
                break;
            case AppState.AUTH_PENDING:
                launchBtn.classList.remove("downloading");
                launchBtn.disabled = false;
                launchBtnText.textContent = tf("button.login", "SIGN IN");
                state.isDownloading = false;
                break;
        }
    }

    const stats = $('#downloadStats');
    const progressContainer = $('#progressContainer');
    if (stats) stats.classList.toggle('visible', state.isDownloading);
    if (progressContainer) progressContainer.classList.toggle('visible', state.isDownloading);

    updateAuxButtons();
}

async function toggleDownloadPause() {
    try {
        if (state.current !== AppState.DOWNLOADING) return;

        let isPaused = !!state.downloadPaused;
        try {
            const res = await ipcBridge.invoke("IsDownloadPaused");
            if (res && typeof res.paused === 'boolean') isPaused = res.paused;
        } catch (_) {}

        if (isPaused) {
            await ipcBridge.invoke("ResumeDownload");
        } else {
            await ipcBridge.invoke("PauseDownload");
        }
    } catch (err) {
        const errorText = formatErrorMessage(err);
        logger.warn("Pause/resume failed", { error: errorText });
        showToast(errorText, "error");
    }
}

async function repairFiles() {
    const wrapper = $('#utilitiesWrapper');
    if (wrapper) wrapper.classList.remove('open');
    try {
        await ipcBridge.invoke("RepairFiles");
        showToast(t("toast.repair_started") || "Repair started", "info");
    } catch (err) {
        const errorText = formatErrorMessage(err);
        logger.error("Repair failed", { error: errorText });
        showToast(errorText, "error");
    }
}

async function createDesktopShortcut() {
    const wrapper = $('#utilitiesWrapper');
    if (wrapper) wrapper.classList.remove('open');
    try {
        const res = await ipcBridge.invoke("CreateDesktopShortcut");
        const path = res && typeof res.path === 'string' ? res.path : null;
        showToast(
            t("toast.desktop_shortcut_created", { path: path || "" }) ||
                (path ? `Desktop shortcut created: ${path}` : "Desktop shortcut created"),
            "success"
        );
    } catch (err) {
        const errorText = formatErrorMessage(err);
        logger.error("Create desktop shortcut failed", { error: errorText });
        showToast(errorText, "error");
    }
}

async function uninstallGame() {
    const wrapper = $('#utilitiesWrapper');
    if (wrapper) wrapper.classList.remove('open');
    const confirmText =
        t("ui.confirm_uninstall") ||
        "Uninstall the game? This will remove installed files and cached downloads.";
    const confirmed = await confirmNative(t("ui.uninstall_title") || "Uninstall Game", confirmText);
    if (!confirmed) return;

    try {
        const res = await ipcBridge.invoke("Uninstall");
        const removedFiles = res && typeof res.deleted_files === 'number' ? res.deleted_files : null;
        const removedDirs = res && typeof res.deleted_dirs === 'number' ? res.deleted_dirs : null;

        updateProgress(0);
        setAppState(AppState.READY);
        updateStatus(t("status.ready"));

        const msg =
            (t("toast.uninstall_complete", {
                files: removedFiles ?? 0,
                dirs: removedDirs ?? 0
            }) ||
                null) ??
            "Uninstall complete";

        showToast(msg, "success");
    } catch (err) {
        const errorText = formatErrorMessage(err);
        logger.error("Uninstall failed", { error: errorText });
        showToast(errorText, "error");
    }
}

// ===== TOAST NOTIFICATIONS =====
const notificationHistory = [];
const MAX_NOTIFICATION_HISTORY = 50;

const toastIcons = {
    success: '<path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"/><polyline points="22 4 12 14.01 9 11.01"/>',
    error: '<circle cx="12" cy="12" r="10"/><line x1="15" y1="9" x2="9" y2="15"/><line x1="9" y1="9" x2="15" y2="15"/>',
    warning: '<path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"/><line x1="12" y1="9" x2="12" y2="13"/><line x1="12" y1="17" x2="12.01" y2="17"/>',
    info: '<circle cx="12" cy="12" r="10"/><line x1="12" y1="16" x2="12" y2="12"/><line x1="12" y1="8" x2="12.01" y2="8"/>'
};

function normalizeNoticeType(type) {
    const normalized = typeof type === 'string' ? type.trim().toLowerCase() : 'info';
    if (normalized === 'success' || normalized === 'warning' || normalized === 'error' || normalized === 'info') {
        return normalized;
    }
    if (normalized === 'maintenance') return 'warning';
    return 'info';
}

function normalizeManifestNotices(raw) {
    if (!Array.isArray(raw)) return [];
    return raw
        .filter((item) => item && typeof item === 'object')
        .map((item) => {
            const message = typeof item.message === 'string' ? item.message.trim() : '';
            if (!message) return null;
            return {
                id: typeof item.id === 'string' && item.id.trim() ? item.id.trim() : null,
                type: normalizeNoticeType(item.type),
                message,
                createdAt: typeof item.createdAt === 'string' ? item.createdAt : null,
                expiresAt: typeof item.expiresAt === 'string' ? item.expiresAt : null
            };
        })
        .filter(Boolean)
        .slice(0, 50);
}

function getManifestNoticeKey(notice, manifestVersion) {
    const versionKey = typeof manifestVersion === 'string' && manifestVersion.trim()
        ? manifestVersion.trim()
        : 'unversioned';
    return `${versionKey}:${notice.id || JSON.stringify({
        type: notice.type,
        message: notice.message,
        createdAt: notice.createdAt,
        expiresAt: notice.expiresAt
    })}`;
}

function addNotification(message, type = "info", options = {}) {
    const notification = {
        id: options.id || Date.now(),
        message,
        type: normalizeNoticeType(type),
        timestamp: options.timestamp || new Date(),
        read: options.read === true
    };
    notificationHistory.unshift(notification);
    if (notificationHistory.length > MAX_NOTIFICATION_HISTORY) {
        notificationHistory.pop();
    }
    updateNotificationBadge();

    const panel = $('#notificationPanel');
    if (panel && panel.classList.contains('open')) {
        renderNotificationHistory();
    }

    return notification;
}

function applyManifestNoticeList(raw, manifestVersion) {
    const notices = normalizeManifestNotices(raw);
    let added = 0;
    for (const notice of notices) {
        const noticeKey = getManifestNoticeKey(notice, manifestVersion);
        if (state.noticeShownKeys.has(noticeKey)) continue;
        state.noticeShownKeys.add(noticeKey);
        addNotification(notice.message, notice.type, {
            id: notice.id || undefined,
            timestamp: notice.createdAt ? new Date(notice.createdAt) : new Date()
        });
        showToast(notice.message, notice.type, { skipHistory: true });
        added++;
    }
    return added;
}

function applyMaintenanceState(enabled, message) {
    state.maintenanceMode = enabled === true;
    state.maintenanceMessage = typeof message === 'string' && message.trim()
        ? message.trim()
        : (t("error.maintenance") || "Server is under maintenance");

    if (state.maintenanceMode) {
        updateStatus(state.maintenanceMessage);
        setAppState(AppState.MAINTENANCE);
        return;
    }

    if (state.current === AppState.MAINTENANCE) {
        setAppState(AppState.READY);
        updateStatus(t("status.ready") || "Ready");
    }
}

function showToast(message, type = "info", options = {}) {
    const container = $('#toastContainer');
    if (!container) return;
    const normalizedType = normalizeNoticeType(type);
    const safeMessage = typeof message === 'string' ? message : formatErrorMessage(message);

    if (!options.skipHistory) {
        addNotification(safeMessage, normalizedType);
    }

    const toast = document.createElement("div");
    toast.className = `toast ${normalizedType}`;
    toast.style.cursor = 'pointer';

    const icon = document.createElementNS("http://www.w3.org/2000/svg", "svg");
    icon.setAttribute("viewBox", "0 0 24 24");
    icon.setAttribute("fill", "none");
    icon.setAttribute("stroke", "currentColor");
    icon.setAttribute("stroke-width", "2");
    icon.innerHTML = toastIcons[normalizedType] || toastIcons.info;

    const messageEl = document.createElement("span");
    messageEl.textContent = safeMessage;

    toast.appendChild(icon);
    toast.appendChild(messageEl);
    
    // Click to dismiss
    const dismissToast = () => {
        if (!toast.classList.contains('hiding')) {
            toast.classList.add('hiding');
            setTimeout(() => toast.remove(), 300);
        }
    };
    toast.addEventListener('click', dismissToast);
    
    container.appendChild(toast);
    
    // Auto-dismiss after 4 seconds
    const autoHideTimeout = setTimeout(() => {
        dismissToast();
    }, 4000);
    
    // Clear timeout if manually dismissed
    toast.addEventListener('click', () => clearTimeout(autoHideTimeout), { once: true });
}

function updateNotificationBadge() {
    const badge = $('#notificationBadge');
    if (badge) {
        const unreadCount = notificationHistory.filter(n => !n.read).length;
        badge.textContent = unreadCount > 9 ? '9+' : unreadCount;
        badge.style.display = unreadCount > 0 ? 'flex' : 'none';
    }
}

function toggleNotificationPanel() {
    const panel = $('#notificationPanel');
    if (!panel) return;
    
    const isOpen = panel.classList.toggle('open');
    
    if (isOpen) {
        renderNotificationHistory();
        // Mark all as read
        notificationHistory.forEach(n => n.read = true);
        updateNotificationBadge();
    }
    
    // Close on outside click
    const closeHandler = (e) => {
        const wrapper = $('#notificationWrapper');
        if (wrapper && !wrapper.contains(e.target)) {
            panel.classList.remove('open');
            document.removeEventListener('click', closeHandler);
        }
    };
    
    if (isOpen) {
        setTimeout(() => document.addEventListener('click', closeHandler), 0);
    }
}

function renderNotificationHistory() {
    const list = $('#notificationList');
    if (!list) return;

    list.innerHTML = '';
    if (notificationHistory.length === 0) {
        const empty = document.createElement('div');
        empty.className = 'notification-empty';
empty.textContent = t("notifications.empty");
        list.appendChild(empty);
        return;
    }

    notificationHistory.forEach((n) => {
        const item = document.createElement('div');
        item.className = `notification-item ${normalizeNoticeType(n.type)}`;

        const icon = document.createElementNS("http://www.w3.org/2000/svg", "svg");
        icon.setAttribute("viewBox", "0 0 24 24");
        icon.setAttribute("fill", "none");
        icon.setAttribute("stroke", "currentColor");
        icon.setAttribute("stroke-width", "2");
        icon.innerHTML = toastIcons[normalizeNoticeType(n.type)] || toastIcons.info;

        const content = document.createElement('div');
        content.className = 'notification-content';

        const message = document.createElement('span');
        message.className = 'notification-message';
        message.textContent = typeof n.message === 'string' ? n.message : formatErrorMessage(n.message);

        const time = document.createElement('span');
        time.className = 'notification-time';
        time.textContent = getTimeAgo(n.timestamp);

        content.appendChild(message);
        content.appendChild(time);
        item.appendChild(icon);
        item.appendChild(content);
        list.appendChild(item);
    });
}

function clearNotificationHistory() {
    notificationHistory.length = 0;
    updateNotificationBadge();
    renderNotificationHistory();
}

function getTimeAgo(date) {
    const seconds = Math.floor((new Date() - date) / 1000);
if (seconds < 60) return t("time.just_now");
const minutes = Math.floor(seconds / 60);
if (minutes < 60) return t("time.minutes_ago", { count: minutes });
const hours = Math.floor(minutes / 60);
if (hours < 24) return t("time.hours_ago", { count: hours });
return t("time.days_ago", { count: Math.floor(hours / 24) });
}

// ===== DEBUG =====
let debugInterval = null;

function toggleDebugDropdown() {
    const wrapper = $('#debugWrapper');
    if (!wrapper) return;

    wrapper.classList.toggle('open');
    
    // Close on outside click
    const closeHandler = (e) => {
        if (!wrapper.contains(e.target)) {
            wrapper.classList.remove('open');
            document.removeEventListener('click', closeHandler);
        }
    };
    
    if (wrapper.classList.contains('open')) {
        setTimeout(() => document.addEventListener('click', closeHandler), 0);
    }
}

function closeDebugDropdown() {
    const wrapper = $('#debugWrapper');
    if (wrapper) wrapper.classList.remove('open');
}

// Progress Simulation
function debugSimulateDownload() {
    closeDebugDropdown();
    
    if (state.isDownloading) {
        state.isDownloading = false;
        if (debugInterval) {
            clearInterval(debugInterval);
            debugInterval = null;
        }
        updateProgress(0);
        updateDownloadStats(0, 0, 0, 0, null);
        setAppState(AppState.READY);
        updateStatus(t("status.ready"));
        showToast("Debug: Download simulation stopped", "info");
        return;
    }
    
    state.isDownloading = true;
    setAppState(AppState.DOWNLOADING);
    updateStatus(t("status.downloading"));
    showToast("Debug: Simulating download progress", "info");
    
    let progress = 0;
    const total = 100 * 1024 * 1024;
    debugInterval = setInterval(() => {
        if (!state.isDownloading) {
            clearInterval(debugInterval);
            debugInterval = null;
            return;
        }
        
        progress += Math.random() * 5 + 2;
        if (progress >= 100) {
            progress = 100;
            clearInterval(debugInterval);
            debugInterval = null;
            state.isDownloading = false;
            updateProgress(100);
            setAppState(AppState.LAUNCH_READY);
            updateStatus(t("ui.download_complete"));
            showToast(t("toast.download_complete") || "Download complete!", "success");
            return;
        }
        
        const downloaded = (progress / 100) * total;
        const speed = Math.random() * 5 * 1024 * 1024 + 1024 * 1024;
        const eta = (total - downloaded) / speed;
        
        updateProgress(progress);
        updateDownloadStats(speed, downloaded, total, eta, "debug_file.pak");
    }, 200);
}

function debugSimulateVerify() {
    closeDebugDropdown();
    
    if (state.isDownloading) {
        showToast("Debug: Stop current simulation first", "warning");
        return;
    }
    
    state.isDownloading = true;
    setAppState(AppState.VERIFYING);
    updateStatus(t("status.verifying") || "Verifying files...");
    showToast("Debug: Simulating verification", "info");
    
    let progress = 0;
    debugInterval = setInterval(() => {
        if (!state.isDownloading) {
            clearInterval(debugInterval);
            debugInterval = null;
            return;
        }
        
        progress += Math.random() * 8 + 4;
        if (progress >= 100) {
            progress = 100;
            clearInterval(debugInterval);
            debugInterval = null;
            state.isDownloading = false;
            updateProgress(100);
            setAppState(AppState.LAUNCH_READY);
            updateStatus(t("status.verified") || "Verification complete");
            showToast("Debug: Verification complete!", "success");
            return;
        }
        
        updateProgress(progress);
        setText("progressSpeed", `Checking file ${Math.floor(progress)}%`);
    }, 150);
}

function debugResetProgress() {
    closeDebugDropdown();
    
    if (debugInterval) {
        clearInterval(debugInterval);
        debugInterval = null;
    }
    state.isDownloading = false;
    updateProgress(0);
    updateDownloadStats(0, 0, 0, 0, null);
    setAppState(AppState.READY);
    updateStatus(t("status.ready"));
    showToast("Debug: Progress reset", "info");
}

// Mock Data
function debugLoadMockNews() {
    closeDebugDropdown();
    
    state.newsItems = [
        {
            title: "Season 3 Update Released!",
            content: "New champions, balance changes, and exciting game modes await you in the latest update.",
            date: new Date().toISOString(),
            image: "https://picsum.photos/800/400?random=1",
            badge: "NEW"
        },
        {
            title: "Weekend Tournament Announced",
            content: "Join the community tournament this weekend for a chance to win exclusive rewards and prizes.",
            date: new Date(Date.now() - 86400000).toISOString(),
            image: "https://picsum.photos/800/400?random=2",
            badge: "EVENT"
        },
        {
            title: "Server Maintenance Complete",
            content: "All servers are back online with improved performance and stability. Thank you for your patience!",
            date: new Date(Date.now() - 172800000).toISOString(),
            image: "https://picsum.photos/800/400?random=3"
        },
        {
            title: "New Skins Collection",
            content: "Check out the brand new cosmic skins collection available now in the store.",
            date: new Date(Date.now() - 259200000).toISOString(),
            image: "https://picsum.photos/800/400?random=4",
            badge: "SHOP"
        }
    ];
    
    initSlider();
    showToast(`Debug: Loaded ${state.newsItems.length} mock news items`, "success");
}

function debugLoadMockChangelog() {
    closeDebugDropdown();
    
    state.changelogItems = [
        {
            version: "v2.5.0",
            date: new Date().toISOString(),
            changes: "Major update: New game engine, improved graphics, 60 FPS support, redesigned UI, bug fixes."
        },
        {
            version: "v2.4.2",
            date: new Date(Date.now() - 604800000).toISOString(),
            changes: "Hotfix: Fixed critical crash on startup, resolved memory leak, improved network stability."
        },
        {
            version: "v2.4.1",
            date: new Date(Date.now() - 1209600000).toISOString(),
            changes: "Balance patch: Adjusted champion stats, fixed ability interactions, improved matchmaking."
        },
        {
            version: "v2.4.0",
            date: new Date(Date.now() - 2419200000).toISOString(),
            changes: "New features: Added spectator mode, replay system, and improved friend list functionality."
        },
        {
            version: "v2.3.5",
            date: new Date(Date.now() - 3628800000).toISOString(),
            changes: "Performance improvements: Reduced loading times, optimized asset streaming, fixed lag spikes."
        }
    ];
    
    renderChangelog();
    switchTab('changelog');
    showToast(`Debug: Loaded ${state.changelogItems.length} mock changelog entries`, "success");
}

function debugClearContent() {
    closeDebugDropdown();
    
    state.newsItems = [];
    state.changelogItems = [];
    initSlider();
    renderChangelog();
    showToast("Debug: All content cleared", "info");
}

// App State
function debugSetState(stateName) {
    closeDebugDropdown();
    
    const stateMap = {
        'ready': AppState.READY,
        'update_available': AppState.UPDATE_AVAILABLE,
        'error': AppState.ERROR,
        'downloading': AppState.DOWNLOADING,
        'verifying': AppState.VERIFYING,
        'launch_ready': AppState.LAUNCH_READY
    };
    
    const newState = stateMap[stateName];
    if (newState) {
        setAppState(newState);
        
        // Set appropriate status text
        switch (newState) {
            case AppState.READY:
                updateStatus(t("status.ready"));
                break;
            case AppState.UPDATE_AVAILABLE:
                updateStatus(t("status.update_available") || "Update available");
                setText("downloadSize", "256.5 MB");
                break;
            case AppState.ERROR:
                updateStatus(t("ui.error_prefix", { error: "Debug error state" }) || "Error: Debug error state");
                break;
            case AppState.LAUNCH_READY:
                updateStatus(t("status.ready_to_play") || "Ready to play");
                break;
        }
        
        showToast(`Debug: State set to "${stateName}"`, "info");
    }
}

// UI Testing
function debugShowToasts() {
    closeDebugDropdown();
    
    showToast("This is an info toast message", "info");
    setTimeout(() => showToast("This is a success toast message", "success"), 300);
    setTimeout(() => showToast("This is a warning toast message", "warning"), 600);
    setTimeout(() => showToast("This is an error toast message", "error"), 900);
}

function debugToggleServerStatus() {
    closeDebugDropdown();
    
    state.serverOnline = !state.serverOnline;
    updateServerStatusUI();
    showToast(`Debug: Server status set to ${state.serverOnline ? "online" : "offline"}`, "info");
}

function debugLogState() {
    closeDebugDropdown();
    
    const stateSnapshot = {
        current: state.current,
        isDownloading: state.isDownloading,
        currentSlideIndex: state.currentSlideIndex,
        currentTab: state.currentTab,
        currentLang: state.currentLang,
        serverOnline: state.serverOnline,
        newsCount: state.newsItems.length,
        changelogCount: state.changelogItems.length,
        availableLanguages: state.availableLanguages,
        version: state.version
    };
    
    console.group("🔧 Debug: Application State");
    console.table(stateSnapshot);
    console.log("Full state object:", state);
    console.groupEnd();
    
    showToast("Debug: State logged to console (F12)", "info");
}

// Legacy function for backwards compatibility
function toggleDebugDownload() {
    debugSimulateDownload();
}

// ===== MAIN ACTIONS =====
function handleMainAction() {
    if (state.launcherUpdateCheckPending && !state.launcherUpdateForced) {
        updateStatus(t("status.checking_manifest"));
        return;
    }
    if (state.launcherUpdateForced) {
        applyLauncherUpdate();
        return;
    }
    switch (state.current) {
        case AppState.UPDATE_AVAILABLE:
            startDownload();
            break;
        case AppState.READY:
        case AppState.LAUNCH_READY:
            launchGame();
            break;
        case AppState.AUTH_PENDING:
            showAuthModal('login');
            break;
        case AppState.ERROR:
            if (state.launcherUpdateCheckError) {
                retryLauncherUpdateCheck();
            } else {
                checkForUpdates();
            }
            break;
        default:
            console.log("No action for current state:", state.current);
    }
}

async function applyLauncherUpdate() {
    try {
        setAppState(AppState.APPLYING);
        updateStatus(tf("status.launcher_update_applying", "Applying required launcher update..."));
        await ipcBridge.invoke("ApplyLauncherUpdate", {});
    } catch (err) {
        const errorText = formatErrorMessage(err);
        logger.error("Failed to apply launcher update", { error: errorText });
        showToast(errorText, "error");
        updateStatus(errorText);
        setAppState(AppState.UPDATE_AVAILABLE);
    }
}

async function retryLauncherUpdateCheck() {
    try {
        state.launcherUpdateCheckPending = true;
        state.launcherUpdateCheckError = null;
        updateButtonState();
        updateStatus(t("status.checking_manifest"));
        await ipcBridge.invoke("CheckLauncherUpdate");
        const snapshot = await syncRuntimeState();
        if (state.launcherUpdateForced) {
            setAppState(AppState.UPDATE_AVAILABLE);
            updateStatus(launcherUpdateRequiredStatus());
            return;
        }
        if (snapshot && state.launcherUpdateCheckError) {
            setAppState(AppState.ERROR);
            updateStatus(t("ui.error_prefix", { error: state.launcherUpdateCheckError }));
            return;
        }

        state.launcherUpdateCheckPending = false;
        await checkForUpdates();
    } catch (err) {
        const errorText = formatErrorMessage(err);
        logger.error("Failed to recheck launcher update", { error: errorText });
        await syncRuntimeState();
        state.launcherUpdateCheckPending = false;
        if (state.launcherUpdateForced) {
            setAppState(AppState.UPDATE_AVAILABLE);
            updateStatus(launcherUpdateRequiredStatus());
            return;
        }
        if (state.launcherUpdateCheckError) {
            setAppState(AppState.ERROR);
            updateStatus(t("ui.error_prefix", { error: state.launcherUpdateCheckError }));
            return;
        }
        state.launcherUpdateCheckError = errorText;
        setAppState(AppState.ERROR);
        updateStatus(t("ui.error_prefix", { error: errorText }));
    }
}

function handleOfflineRedirect(response) {
    if (!response || response.offline !== true || typeof response.offlineUrl !== 'string') {
        return false;
    }

    logger.warn("Connectivity unavailable; loading offline UI", {
        reason: response.reason || 'offline',
        message: response.message || null
    });
    window.location.replace(response.offlineUrl);
    return true;
}


async function checkForUpdates() {
    try {
        if (state.launcherUpdateForced) {
            updateStatus(launcherUpdateRequiredStatus());
            return;
        }
        if (state.launcherUpdateCheckPending) {
            updateStatus(t("status.checking_manifest"));
            return;
        }
        setAppState(AppState.CHECKING);
        updateStatus(t("status.checking_manifest"));
        const manifestResult = await ipcBridge.invoke("CheckManifest");
        if (handleOfflineRedirect(manifestResult)) {
            return;
        }
    } catch (err) {
        const errorText = formatErrorMessage(err);
        logger.error("Failed to check manifest", { error: errorText });
        if (isAuthRequiredError(err) || state.current === AppState.AUTH_PENDING) {
            setAppState(AppState.AUTH_PENDING);
            updateStatus(tf('status.auth_pending', 'Sign in required'));
            showAuthModal('login');
            return;
        }
        if (isLicenseRequiredError(err)) {
            setAppState(AppState.ERROR);
            updateStatus(t("ui.error_prefix", { error: errorText }));
            showToast(errorText, "error");
            return;
        }
        setAppState(AppState.ERROR);
        updateStatus(t("ui.error_prefix", { error: errorText }));
    }
}

async function startDownload() {
    setAppState(AppState.DOWNLOADING);
    updateStatus(t("status.downloading"));
    
    try {
        await ipcBridge.invoke("StartDownload");
        updateStatus(t("ui.download_started"));
    } catch (err) {
        const errorText = formatErrorMessage(err);
        logger.error("Download failed", { error: errorText });
        updateStatus(t("ui.error_prefix", { error: errorText }));
        setAppState(AppState.ERROR);
        showToast(t("toast.error"), "error");
    }
}

async function launchGame() {
    setAppState(AppState.LAUNCHING);
    updateStatus(t("status.launching"));
    
    try {
        await showLaunchSplashBeforeGameStart();
        await ipcBridge.invoke("LaunchGame");
        updateStatus(t("ui.game_launched"));
        showToast(t("ui.game_launched"), "success");
        setTimeout(() => setAppState(AppState.LAUNCH_READY), 2000);
    } catch (err) {
        const errorMsg = formatErrorMessage(err);
        logger.error("Game launch failed", { error: errorMsg });
        if (isAuthRequiredError(err) || state.current === AppState.AUTH_PENDING) {
            setAppState(AppState.AUTH_PENDING);
            updateStatus(tf('status.auth_pending', 'Sign in required'));
            showAuthModal('login');
            return;
        }
        if (isLicenseRequiredError(err)) {
            updateStatus(t("ui.launch_failed", { error: errorMsg }));
            setAppState(AppState.ERROR);
            showToast(errorMsg, "error");
            return;
        }
        updateStatus(t("ui.launch_failed", { error: errorMsg }));
        setAppState(AppState.ERROR);
        showToast(t("ui.launch_failed", { error: errorMsg }), "error");
    }
}

async function launchGameSettingsManager() {
    const wrapper = $('#utilitiesWrapper');
    if (wrapper) wrapper.classList.remove('open');
    if (!state.hasSettingsManager) {
        showToast(t("ui.settings_manager_not_configured") || "Game settings manager is not configured for this title", "info");
        return;
    }
    try {
        await ipcBridge.invoke("LaunchGameSettingsManager");
        showToast(t("ui.settings_manager_launched") || "Game Settings Manager launched", "success");
    } catch (err) {
        const errorMsg = formatErrorMessage(err);
        logger.error("Failed to launch game settings manager", { error: errorMsg });
        showToast(t("ui.settings_manager_failed") || "Failed to launch settings manager", "error");
    }
}

// ===== EVENT HANDLERS =====
function buildStateMap() {
    return {
        "startup": AppState.STARTUP,
        "ready": AppState.READY,
        "eula_pending": AppState.EULA_PENDING,
        "auth_pending": AppState.AUTH_PENDING,
        "checking_manifest": AppState.CHECKING,
        "update_available": AppState.UPDATE_AVAILABLE,
        "downloading": AppState.DOWNLOADING,
        "verifying": AppState.VERIFYING,
        "patching": AppState.APPLYING,
        "launch_ready": AppState.LAUNCH_READY,
        "launching": AppState.LAUNCHING,
        "maintenance": AppState.MAINTENANCE,
        "error": AppState.ERROR,
        "complete": AppState.LAUNCH_READY
    };
}

async function syncRuntimeState() {
    if (!window.__LAUNCHER__) return null;

    try {
        const snapshot = await ipcBridge.invoke("GetState");
        if (!snapshot) return null;

        const stateMap = buildStateMap();
        state.current = stateMap[snapshot.state] || state.current;
        state.launcherUpdateCheckPending = Boolean(snapshot.launcherUpdateCheckPending);
        state.launcherUpdateCheckError =
            typeof snapshot.launcherUpdateCheckError === "string"
                ? snapshot.launcherUpdateCheckError
                : null;
        state.launcherUpdateForced = Boolean(snapshot.launcherUpdateForced);

        if (state.launcherUpdateForced && snapshot.launcherUpdate) {
            state.launcherUpdate = {
                ...snapshot.launcherUpdate,
                forced: true
            };
            state.current = AppState.UPDATE_AVAILABLE;
        } else {
            state.launcherUpdate = null;
        }

        return snapshot;
    } catch (err) {
        logger.warn("Failed to sync runtime state", { error: formatErrorMessage(err) });
        return null;
    }
}

function scheduleInitialManifestCheck(delayMs = 500) {
    setTimeout(async () => {
        const snapshot = await syncRuntimeState();
        if (state.launcherUpdateForced) return;
        if (snapshot && snapshot.state === "error") return;
        if (snapshot && snapshot.launcherUpdateCheckPending) {
            scheduleInitialManifestCheck(delayMs);
            return;
        }
        await checkForUpdates();
    }, delayMs);
}

function registerEventHandlers() {
    if (!window.__LAUNCHER__) {
        logger.warn("IPC bridge not available - running in demo mode");
        return;
    }

    ipcBridge.on("LanguageChanged", (data) => {
        if (data && data.translations) {
            state.translations = data.translations;
            state.currentLang = typeof data.lang === 'string' ? data.lang.toLowerCase() : state.currentLang;
            renderLanguageOptions();
            updateLangButton();
            applyTranslations();
            logger.info("Language changed", { lang: data.lang });
        }
    });



    ipcBridge.on("StateChanged", (data) => {
        const stateMap = buildStateMap();
        const newState = stateMap[data.state] || AppState.READY;
        setAppState(newState);
        if (state.launcherUpdateForced && state.current === AppState.UPDATE_AVAILABLE) {
            updateStatus(launcherUpdateRequiredStatus());
            return;
        }

        // Dismiss the loading overlay once we leave startup/checking phase
        if (data.state !== 'startup' && data.state !== 'checking_manifest') {
            dismissManifestOverlay();
        } else if (data.state === 'checking_manifest') {
            updateManifestOverlayStatus('status.checking_manifest', 'Checking for updates...');
        }

        const statusKey = `status.${data.state}`;
        const statusText = t(statusKey);
        if (statusText !== statusKey) {
            updateStatus(statusText);
        } else if (data.state === "auth_pending") {
            updateStatus(tf('status.auth_pending', 'Sign in required'));
        }

        if (data.state === "update_available") {
            showToast(t("toast.update_available") || "Update available!", "info");
        }
    });

    ipcBridge.on("DownloadProgress", (data) => {
        const total = data.total_bytes || 0;
        const done = data.downloaded_bytes || 0;
        const percent = total > 0 ? Math.min(100, (done / total) * 100) : 0;
        
        updateProgress(percent, AppState.DOWNLOADING);
        updateDownloadStats(data.download_speed || 0, done, total, data.eta_seconds, data.current_file);
        updateStatus(t("status.downloading"));
    });

    ipcBridge.on("FileProgress", (data) => {
        const percent = data.total > 0 ? Math.min(100, (data.downloaded / data.total) * 100) : 0;
        updateProgress(percent, AppState.DOWNLOADING);
        updateDownloadStats(data.speed || 0, data.downloaded, data.total, data.eta, data.file);
    });

    ipcBridge.on("DownloadComplete", () => {
        updateProgress(100);
        updateStatus(t("ui.download_complete"));
        setAppState(AppState.LAUNCH_READY);
        showToast(t("toast.download_complete") || "Download complete!", "success");
    });

    ipcBridge.on("DownloadPaused", () => {
        state.downloadPaused = true;
        updateAuxButtons();
        updateStatus(t("status.paused") || "Download paused");
        showToast(t("toast.download_paused") || "Download paused", "info");
    });

    ipcBridge.on("DownloadResumed", () => {
        state.downloadPaused = false;
        updateAuxButtons();
        updateStatus(t("status.downloading"));
        showToast(t("toast.download_resumed") || "Download resumed", "info");
    });

    ipcBridge.on("VerificationProgress", (data) => {
        const percent = data.total > 0 ? Math.min(100, (data.current / data.total) * 100) : 0;
        updateProgress(percent, AppState.VERIFYING);
        updateStatus(t("ui.verifying_file", { file: data.file_name, current: data.current, total: data.total }));
    });

    ipcBridge.on("VerificationComplete", (data) => {
        if (data.success) {
            updateStatus(t("notification.verify_success.title") || "Verification complete");
            showToast(t("notification.verify_success.body") || "All files verified", "success");
        } else {
            const failedCount = data.failed_files ? data.failed_files.length : 0;
            updateStatus(t("notification.verify_failed.title") || "Verification failed");
            showToast(t("notification.verify_failed.body", { count: failedCount }) || `${failedCount} files failed`, "error");
        }
    });

    ipcBridge.on("PatchingProgress", (data) => {
        const percent = data.total > 0 ? Math.min(100, (data.current / data.total) * 100) : 0;
        updateProgress(percent, AppState.APPLYING);
        updateStatus(t("ui.patching_file", { file: data.file_name, current: data.current, total: data.total }));
    });

    ipcBridge.on("PatchingComplete", () => {
        updateStatus(t("notification.patch_complete.title") || "Update applied");
        showToast(t("notification.patch_complete.body") || "Game files updated", "success");
    });

    ipcBridge.on("Error", (data) => {
        const errorMsg = formatErrorMessage(data && (data.message || data.error || data));
        // Dismiss overlay on error so the user can see the error state
        dismissManifestOverlay();
        if (state.maintenanceMode) {
            updateStatus(state.maintenanceMessage || errorMsg);
            return;
        }
        setAppState(AppState.ERROR);
        updateStatus(t("ui.error_prefix", { error: errorMsg }));
        showToast(errorMsg, "error");

        if (data.suggestion) {
            logger.info("Recovery suggestion", { suggestion: data.suggestion });
        }
    });

    ipcBridge.on("ManifestInfo", (data) => {
        logger.info("Manifest info received", { version: data.version, maintenance: data.maintenance });
        // Manifest fetched successfully — hide the loading overlay
        dismissManifestOverlay();
        if (data.version && typeof data.version === 'string') {
            state.manifestVersion = data.version;
            updateVersionStageInfo();
        }
        if (data.news) {
            state.newsItems = Array.isArray(data.news) ? data.news : [];
            renderSlides();
            updateSliderCounter();
        }
        if (data.splash) {
            applySplashConfig(data.splash, data.version);
        }
        if (data.popupNotice) {
            applyPopupNoticeConfig(data.popupNotice, data.version);
            showPendingPopupNotice();
        }
        if (data.noticeList) {
            applyManifestNoticeList(data.noticeList, data.version);
        }
        if (Object.prototype.hasOwnProperty.call(data, 'plugins')) {
            state.plugins = normalizePlugins(data.plugins);
            renderPlugins();
        }
        if (Object.prototype.hasOwnProperty.call(data, 'authentication')) {
            state.authConfig = normalizeAuthenticationConfig(data.authentication);
            updateAuthNavVisibility();
        }
        if (Object.prototype.hasOwnProperty.call(data, 'hasSettingsManager')) {
            state.hasSettingsManager = data.hasSettingsManager === true;
            updateGameSettingsItem();
        }
        applyMaintenanceState(data.maintenance === true, data.maintenance_message);
    });

    ipcBridge.on("ThemeChanged", (data) => {
        if (data.theme) {
            applyTheme(data.theme);
            logger.info("Theme changed via IPC", { theme: data.theme });
        } else if (data.css_class) {
            // Legacy support
            const theme = data.css_class.includes('light') ? 'light' : 'dark';
            applyTheme(theme);
            logger.info("Theme changed via IPC (legacy)", { theme });
        }
    });

    ipcBridge.on("EulaRequired", (data) => {
        logger.info("EULA required", data);
        // Manifest resolved; EULA gate is next
        dismissManifestOverlay();
    });

    ipcBridge.on("AuthRequired", (data) => {
        logger.info("Authentication required", data);
        // Manifest resolved; auth gate is next
        dismissManifestOverlay();
        if (Object.prototype.hasOwnProperty.call(data, 'authentication')) {
            state.authConfig = normalizeAuthenticationConfig(data.authentication);
            updateAuthNavVisibility();
        }
        setAppState(AppState.AUTH_PENDING);
        updateStatus(tf('status.auth_pending', 'Sign in required'));
        showAuthModal('login');
    });

    ipcBridge.on("AuthStateChanged", (data) => {
        applyAuthState(data);
    });
    ipcBridge.on("LauncherUpdateAvailable", (data) => {
        state.launcherUpdate = data;
        state.launcherUpdateForced = Boolean(data.forced);
        state.launcherUpdateCheckPending = false;
        state.launcherUpdateCheckError = null;
        const message = tf("toast.launcher_update", `Launcher update available: ${data.version}`, { version: data.version });
        showToast(message, data.forced ? "warning" : "info");

        if (data.forced) {
            setAppState(AppState.UPDATE_AVAILABLE);
            updateStatus(launcherUpdateRequiredStatus());
        }
    });
}

// ===== KEYBOARD SHORTCUTS =====
function requestReload() {
    ipcBridge.invoke("ReloadUI").catch(() => window.location.reload());
}

// ===== SERVER STATUS =====
async function checkServerStatus() {
    try {
        const result = await ipcBridge.invoke("GetServerStatus");
        if (result) {
            state.serverOnline = result.online;
            updateServerStatusUI();
        }
    } catch (err) {
        logger.warn("Failed to check server status", { error: err });
        state.serverOnline = false;
        updateServerStatusUI();
    }
}

function updateServerStatusUI() {
    const dot = $('#serverStatusDot');
    const text = $('#serverStatusText');
    
    if (dot) {
        dot.classList.toggle('offline', !state.serverOnline);
    }
    
    if (text) {
        text.textContent = state.serverOnline 
            ? (t("server.online") || "Online") 
            : (t("server.offline") || "Offline");
    }
}

// ===== UI CONFIG LOADING =====
async function loadUiConfig() {
    try {
        const config = await ipcBridge.invoke("GetUiConfig");
        if (!config) {
            logger.warn("GetUiConfig returned empty response");
            return;
        }
        
        // Safely extract version
        if (config.version && typeof config.version === 'string') {
            state.version = config.version;
        }

        if (config.manifestVersion && typeof config.manifestVersion === 'string') {
            state.manifestVersion = config.manifestVersion;
        }

        if (config.gameVersion && typeof config.gameVersion === 'string') {
            state.gameVersion = config.gameVersion;
        }

        if (config.stage && typeof config.stage === 'string') {
            state.stage = config.stage;
        }
        updateVersionStageInfo();

        if (config.startup && typeof config.startup === 'object') {
            state.startup.checkForUpdates = config.startup.checkForUpdates !== false;
            state.startup.minimizeToTray = config.startup.minimizeToTray === true;
            state.startup.launchOnBoot = config.startup.launchOnBoot === true;
        }

        if (config.logging && typeof config.logging === 'object') {
            state.logging.uiLogging = config.logging.uiLogging !== false;
            state.logging.ipcTracing = config.logging.ipcTracing === true;
            logger._uiLogging = state.logging.uiLogging;
            logger._ipcTracing = state.logging.ipcTracing;
        }
        
        // Safely extract language
        if (config.language && typeof config.language === 'string') {
            state.currentLang = normalizeLanguageCode(config.language);
            updateLangButton();
            renderLanguageOptions();
        }

        await selectInitialLanguage(config);
        
        // Safely extract slider interval with bounds checking
        if (typeof config.sliderInterval === 'number' && config.sliderInterval > 0) {
            // Clamp between 3 and 30 seconds
            state.slideDuration = Math.max(3000, Math.min(30000, config.sliderInterval));
        }
        
        // Parse links from manifest with validation
        if (config.links && Array.isArray(config.links)) {
            state.links = {};
            config.links.forEach(link => {
                if (link && typeof link.label === 'string' && typeof link.url === 'string') {
                    const label = link.label.toLowerCase().trim();
                    if (label && isValidUrl(link.url)) {
                        state.links[label] = link.url;
                    }
                }
            });
        }
        
        // Parse news from manifest with validation
        if (config.news && Array.isArray(config.news)) {
            state.newsItems = config.news.filter(item => 
                item && typeof item === 'object' && typeof item.title === 'string'
            ).slice(0, 20); // Limit to 20 news items
        }

        if (config.splash) {
            applySplashConfig(config.splash, config.manifestVersion || config.version);
        }

        if (config.popupNotice) {
            applyPopupNoticeConfig(config.popupNotice, config.manifestVersion || config.version);
        }

        if (config.noticeList) {
            applyManifestNoticeList(config.noticeList, config.manifestVersion || config.version);
        }

        if (Object.prototype.hasOwnProperty.call(config, 'authentication')) {
            state.authConfig = normalizeAuthenticationConfig(config.authentication);
            updateAuthNavVisibility();
        }
        if (Object.prototype.hasOwnProperty.call(config, 'authState')) {
            applyAuthState(config.authState);
        }

        if (Object.prototype.hasOwnProperty.call(config, 'hasSettingsManager')) {
            state.hasSettingsManager = config.hasSettingsManager === true;
            updateGameSettingsItem();
        }
        
        logger.info("UI config loaded", { 
            version: config.version, 
            linksCount: Object.keys(state.links).length,
            newsCount: state.newsItems.length 
        });
    } catch (err) {
        logger.warn("Failed to load UI config", { error: String(err) });
    }
}

// Load changelog from manifest info
async function loadChangelog() {
    try {
        const manifestInfo = await ipcBridge.invoke("GetManifestInfo");
        if (!manifestInfo) return;

        // Check if manifest has changelog array
        if (manifestInfo.changelog && Array.isArray(manifestInfo.changelog)) {
            state.changelogItems = manifestInfo.changelog.filter(item =>
                item && typeof item === 'object' && typeof item.version === 'string'
            ).slice(0, 50); // Limit to 50 changelog entries
            renderChangelog();
            logger.debug("Changelog loaded", { count: state.changelogItems.length });
        }
    } catch (err) {
        logger.debug("Failed to load changelog from manifest", { error: String(err) });
    }
}

async function loadPlugins() {
    try {
        const manifestInfo = await ipcBridge.invoke("GetManifestInfo");
        if (!manifestInfo) return;
        state.plugins = normalizePlugins(manifestInfo.plugins);
        renderPlugins();
    } catch (err) {
        logger.debug("Failed to load plugins from manifest", { error: String(err) });
    }
}

// ===== INITIALIZATION =====
async function init() {
    logger.info("Initializing GGWP Launcher UI...");

    try {
        // Register event handlers first
        registerEventHandlers();

        // Load theme preference early
        await loadThemePreference();

        // Load translations from Rust
        await loadTranslations();
        // Refresh overlay status text now that translations are available
        updateManifestOverlayStatus('status.checking_manifest', 'Checking for updates...');

        // Load available languages
        await loadAvailableLanguages();
        await syncRuntimeState();

        // Load UI configuration (links, news from manifest)
        await loadUiConfig();
        updateGameSettingsItem();

        // Load changelog from manifest
        await loadChangelog();
        await loadPlugins();

        // Initialize UI components
        initSlider();
        renderChangelog();

        // Check server status
        await checkServerStatus();

        updateAuthNavVisibility();

        // Preserve any earlier state pushed from Rust during initialization.
        setAppState(state.current);
        if (state.launcherUpdateForced) {
            updateStatus(launcherUpdateRequiredStatus());
        } else if (state.launcherUpdateCheckPending) {
            updateStatus(t("status.checking_manifest"));
        } else if (state.launcherUpdateCheckError) {
            updateStatus(t("ui.error_prefix", { error: state.launcherUpdateCheckError }));
        } else if (state.current === AppState.READY) {
            updateStatus(t("status.ready"));
        }
        showPendingPopupNotice();

        // Auto-check for updates after initialization when enabled by config.
        if (state.startup.checkForUpdates) {
            scheduleInitialManifestCheck();
        } else {
            // No manifest fetch will occur — reveal the UI immediately
            dismissManifestOverlay();
        }

        // If IPC bridge is unavailable (demo/offline mode), reveal UI immediately
        if (!window.__LAUNCHER__) {
            dismissManifestOverlay();
        }

        logger.info("UI initialization complete");
    } catch (err) {
        logger.error("UI initialization failed", { error: String(err) });
        // Reveal UI so user sees the error state instead of a stuck spinner
        dismissManifestOverlay();
        setAppState(AppState.ERROR);
        updateStatus(t("error.init_failed") || "Initialization failed");
        showToast(t("error.init_failed") || "Failed to initialize UI", "error");
    }
}

// Event Listeners
document.addEventListener("DOMContentLoaded", init);

document.addEventListener("keydown", (e) => {
    if ((e.ctrlKey || e.metaKey) && e.key.toLowerCase() === "r") {
        e.preventDefault();
        requestReload();
    }
});

// Pause slider on visibility change
document.addEventListener("visibilitychange", () => {
    if (document.hidden) {
        stopAutoSlide();
    } else if (state.newsItems.length > 1) {
        startAutoSlide();
    }
});

// Periodic server status check
setInterval(checkServerStatus, 30000);

// ===== IPC & CRITICAL TESTS (Development) =====
// Run: window.IPCTests.run()
(function() {
    'use strict';

    const TestResults = { passed: 0, failed: 0, skipped: 0, errors: [] };

    function assert(condition, message) {
        if (!condition) throw new Error(message || 'Assertion failed');
    }

    function assertEqual(actual, expected, message) {
        if (actual !== expected) throw new Error(message || `Expected ${JSON.stringify(expected)} but got ${JSON.stringify(actual)}`);
    }

    function assertType(value, type, message) {
        if (typeof value !== type) throw new Error(message || `Expected type ${type} but got ${typeof value}`);
    }

    function assertNotNull(value, message) {
        if (value === null || value === undefined) throw new Error(message || 'Value should not be null/undefined');
    }

    function test(name, fn) {
        try {
            fn();
            TestResults.passed++;
            console.log(`✓ ${name}`);
        } catch (e) {
            TestResults.failed++;
            TestResults.errors.push({ name, error: e.message });
            console.error(`✗ ${name}: ${e.message}`);
        }
    }

    function skip(name, reason) {
        TestResults.skipped++;
        console.log(`○ ${name} (skipped: ${reason})`);
    }

    async function asyncTest(name, fn, timeoutMs = 5000) {
        try {
            await Promise.race([
                fn(),
                new Promise((_, reject) => setTimeout(() => reject(new Error('Timeout')), timeoutMs))
            ]);
            TestResults.passed++;
            console.log(`✓ ${name}`);
        } catch (e) {
            TestResults.failed++;
            TestResults.errors.push({ name, error: e.message });
            console.error(`✗ ${name}: ${e.message}`);
        }
    }

    function runTests() {
        TestResults.passed = 0;
        TestResults.failed = 0;
        TestResults.skipped = 0;
        TestResults.errors = [];
        console.log('Running IPC & Critical Tests...\n');

        // ===== IPC MESSAGE FORMAT TESTS =====
        console.log('--- IPC Message Format ---');

        test('IPC envelope structure', function() {
            const envelope = { id: 'test-id', cmd: 'GetState', payload: null };
            assertType(envelope.id, 'string');
            assertType(envelope.cmd, 'string');
            assert(envelope.payload === null || typeof envelope.payload === 'object');
        });

        test('IPC envelope serialization roundtrip', function() {
            const envelope = { id: 'uuid-123', cmd: 'SetLanguage', payload: { lang: 'tr' } };
            const json = JSON.stringify(envelope);
            const parsed = JSON.parse(json);
            assertEqual(parsed.id, envelope.id);
            assertEqual(parsed.cmd, envelope.cmd);
            assertEqual(parsed.payload.lang, 'tr');
        });

        test('LogMessage command format', function() {
            const cmd = {
                id: 'log-1', cmd: 'LogMessage',
                payload: { level: 'error', message: 'Test error', context: '{"stack":"at test:1"}' }
            };
            const json = JSON.stringify(cmd);
            assert(json.includes('"level":"error"'));
            assert(json.includes('"message":"Test error"'));
        });

        test('Complex nested payload', function() {
            const envelope = {
                id: 'complex-1', cmd: 'SaveSettings',
                payload: {
                    settings: {
                        bandwidth: { limit: 1048576, auto: true },
                        concurrency: { downloads: 4, verifications: 2 },
                        theme: 'dark',
                        cdnRegion: 'tr'
                    }
                }
            };
            const parsed = JSON.parse(JSON.stringify(envelope));
            assertEqual(parsed.payload.settings.bandwidth.limit, 1048576);
            assertEqual(parsed.payload.settings.bandwidth.auto, true);
            assertEqual(parsed.payload.settings.concurrency.downloads, 4);
            assertEqual(parsed.payload.settings.cdnRegion, 'tr');
        });

        test('CDN region options preserve saved region when status is empty', function() {
            const html = buildCdnRegionOptions('tr', []);
            assert(html.includes('value="tr" selected'), 'saved region should remain selectable and selected');
            assert(html.includes('value="auto"'), 'auto option should remain available');
        });

        // ===== IPC EVENT FORMAT TESTS =====
        console.log('\n--- IPC Event Format ---');

        test('StateChanged event', function() {
            const event = { event: 'StateChanged', data: { state: 'downloading' } };
            assertEqual(event.event, 'StateChanged');
            assertEqual(event.data.state, 'downloading');
        });

        test('Forced launcher update keeps usable states locked to update CTA', function() {
            const previousForced = state.launcherUpdateForced;
            try {
                state.launcherUpdateForced = true;
                assertEqual(
                    normalizeStateForForcedLauncherUpdate(AppState.READY),
                    AppState.UPDATE_AVAILABLE
                );
                assertEqual(
                    normalizeStateForForcedLauncherUpdate(AppState.LAUNCH_READY),
                    AppState.UPDATE_AVAILABLE
                );
                assertEqual(
                    normalizeStateForForcedLauncherUpdate(AppState.APPLYING),
                    AppState.APPLYING
                );
            } finally {
                state.launcherUpdateForced = previousForced;
            }
        });

        test('DownloadProgress event all fields', function() {
            const event = {
                event: 'DownloadProgress',
                data: {
                    total_files: 100, completed_files: 50, failed_files: 2,
                    total_bytes: 1000000, downloaded_bytes: 500000,
                    download_speed: 125000.5, eta_seconds: 4
                }
            };
            assertEqual(event.data.total_files, 100);
            assertEqual(event.data.completed_files, 50);
            assertEqual(event.data.failed_files, 2);
            assertType(event.data.download_speed, 'number');
        });

        test('Error event with all fields', function() {
            const event = {
                event: 'Error',
                data: { message: 'Network error', suggestion: 'Check connection', error_code: 'E_NETWORK' }
            };
            assertEqual(event.data.message, 'Network error');
            assertEqual(event.data.suggestion, 'Check connection');
            assertEqual(event.data.error_code, 'E_NETWORK');
        });

        test('Error event with null optional fields', function() {
            const event = { event: 'Error', data: { message: 'Unknown', suggestion: null, error_code: null } };
            assertEqual(event.data.suggestion, null);
            assertEqual(event.data.error_code, null);
        });

        test('VerificationComplete event', function() {
            const event = {
                event: 'VerificationComplete',
                data: { success: false, failed_files: ['file1.dat', 'file2.pak'] }
            };
            assertEqual(event.data.success, false);
            assertEqual(event.data.failed_files.length, 2);
        });

        test('LanguageChanged event', function() {
            const event = {
                event: 'LanguageChanged',
                data: { lang: 'de', translations: { 'button.start': 'Starten' } }
            };
            assertEqual(event.data.lang, 'de');
            assertEqual(event.data.translations['button.start'], 'Starten');
        });

        test('version and stage info renders beside launch button', function() {
            const info = $('#versionStageInfo');
            const launchBtn = $('#launchBtn');
            assertNotNull(info, 'version/stage info element should exist');
            assertNotNull(launchBtn, 'launch button should exist');
            assert(info.compareDocumentPosition(launchBtn) & Node.DOCUMENT_POSITION_FOLLOWING, 'version/stage info should appear before launch button');
        });

        test('updateVersionStageInfo shows game version and stage', function() {
            assertType(updateVersionStageInfo, 'function', 'updateVersionStageInfo should exist');
            state.version = '1.2.3';
            state.gameVersion = '1.9.0';
            state.manifestVersion = '2.0.0';
            state.stage = 'staging';
            updateVersionStageInfo();
            assertEqual($('#versionValue').textContent, 'v1.9.0');
            assertEqual($('#stageValue').textContent, 'STAGING');
        });

        test('popup notice and launch splash use separate timing', function() {
            const existingPopup = document.getElementById('popupNoticeOverlay');
            const existingSplash = document.getElementById('splashOverlay');
            if (existingPopup) existingPopup.remove();
            if (existingSplash) existingSplash.remove();
            state.popupNoticeShownKey = null;
            state.popupNoticeConfig = null;
            state.splashShownKey = null;
            state.splashConfig = null;

            applySplashConfig({
                enabled: true,
                title: 'Starting Game',
                imageUrl: 'https://cdn.example.com/game-init.jpg',
                durationSeconds: 2,
                dismissible: false
            }, 'test-version');

            applyPopupNoticeConfig({
                enabled: true,
                imageUrl: 'https://cdn.example.com/startup-offer.jpg',
                imageAlt: 'Startup offer',
                dismissible: true
            }, 'test-version');

            assertEqual(document.getElementById('splashOverlay'), null, 'launch splash must not show during launcher init');
            showPendingPopupNotice();
            assertNotNull(document.getElementById('popupNoticeOverlay'), 'popup notice should show after launcher init');
            assertEqual(document.getElementById('splashOverlay'), null, 'popup notice must not reuse splash overlay');

            hidePopupNotice();
        });

        test('launch splash stores configured duration for pre-game delay', function() {
            const existingSplash = document.getElementById('splashOverlay');
            if (existingSplash) existingSplash.remove();
            state.splashShownKey = null;
            state.splashConfig = null;
            applySplashConfig({
                enabled: true,
                title: 'Starting Game',
                imageUrl: 'https://cdn.example.com/game-init.jpg',
                durationSeconds: 4,
                dismissible: false
            }, 'test-version-duration');

            assertEqual(state.splashConfig.durationSeconds, 4, 'launch splash duration should come from manifest');
            assertEqual(document.getElementById('splashOverlay'), null, 'launch splash should stay hidden until launchGame');
        });

        test('manifest notice list adds notification history entries', function() {
            notificationHistory.length = 0;
            state.noticeShownKeys = new Set();
            applyManifestNoticeList([
                {
                    id: 'ann-1',
                    type: 'warning',
                    message: 'Maintenance starts tonight.',
                    createdAt: '2026-05-09T12:00:00Z'
                },
                {
                    id: 'blank',
                    type: 'info',
                    message: '   '
                }
            ], 'notice-version');

            assertEqual(notificationHistory.length, 1);
            assertEqual(notificationHistory[0].message, 'Maintenance starts tonight.');
            assertEqual(notificationHistory[0].type, 'warning');
        });

        test('notification history renders notice messages as text', function() {
            const list = $('#notificationList');
            assertNotNull(list, 'notification list should exist');
            notificationHistory.length = 0;
            addNotification('<img src=x onerror="window.__noticeXss = true">', 'warning');

            renderNotificationHistory();

            assertEqual(list.querySelectorAll('img').length, 0);
            assert(list.textContent.includes('<img src=x onerror="window.__noticeXss = true">'), 'message should be rendered literally');
        });


        test('maintenance mode disables launch action and shows message', function() {
            const launchBtn = $('#launchBtn');
            const launchBtnText = $('#launchBtnText');
            const statusText = $('#statusText');
            assertNotNull(launchBtn, 'launch button should exist');
            assertNotNull(launchBtnText, 'launch button text should exist');
            assertNotNull(statusText, 'status text should exist');

            applyMaintenanceState(true, 'Servers are down for maintenance.');

            assertEqual(state.current, AppState.MAINTENANCE);
            assertEqual(launchBtn.disabled, true);
            assertEqual(launchBtnText.textContent, t("error.maintenance") || 'Maintenance');
            assertEqual(statusText.textContent, 'Servers are down for maintenance.');

            applyMaintenanceState(false, null);
        });

        test('StateChanged maintenance maps to maintenance app state', function() {
            const stateMap = buildStateMap();
            assertEqual(stateMap.maintenance, AppState.MAINTENANCE);
        });

        test('StateChanged auth pending maps to auth app state', function() {
            const stateMap = buildStateMap();
            assertEqual(stateMap.auth_pending, AppState.AUTH_PENDING);
        });

        test('normalizeAuthenticationConfig keeps google and discord providers', function() {
            const auth = normalizeAuthenticationConfig({
                enabled: true,
                forced: true,
                ui: { title: 'Game Launcher' },
                oauthProviders: [
                    { id: 'google', label: 'Google', authorizationUrl: 'https://accounts.google.com/o/oauth2/v2/auth' },
                    { id: 'discord', label: 'Discord', authorizationUrl: 'https://discord.com/oauth2/authorize' }
                ]
            });
            assertEqual(auth.forced, true);
            assertEqual(auth.oauthProviders.length, 2);
            assertEqual(auth.oauthProviders[0].id, 'google');
            assertEqual(auth.oauthProviders[1].id, 'discord');
        });

        test('oauth waiting panel does not ask for callback URL or code', function() {
            state.authConfig = normalizeAuthenticationConfig({
                enabled: true,
                callbackScheme: 'ggwp-auth',
                oauthProviders: [
                    { id: 'google', label: 'Google', authorizationUrl: 'https://accounts.google.com/o/oauth2/v2/auth', redirectUri: 'ggwp-auth://oauth/google' }
                ]
            });
            assertEqual(state.authConfig.callbackScheme, 'ggwp-auth');
            state.authModal.awaitingCode = true;
            state.authModal.oauthProvider = 'google';

            const html = renderOAuthCompletionPanel();
            assert(!html.includes('textarea'), 'OAuth panel should not render manual code textarea');
            assert(!html.includes('data-auth-complete-oauth'), 'OAuth panel should not render manual complete button');
            assert(html.includes('data-auth-open-browser'), 'OAuth panel should keep browser retry action');
        });

        test('auth footer hides unavailable register and forgot actions', function() {
            state.authConfig = normalizeAuthenticationConfig({
                enabled: true,
                endpoints: {
                    loginUrl: 'https://auth.example.com/launcher/login'
                }
            });
            state.authModal.awaitingCode = false;
            const html = renderAuthModal('login');
            assert(!html.includes('data-auth-mode=\"register\"'), 'register link should be hidden without registerUrl');
            assert(!html.includes('data-auth-mode=\"forgot\"'), 'forgot link should be hidden without forgotPasswordUrl');
        });

        test('authenticated account view hides change-password form without endpoint', function() {
            state.authConfig = normalizeAuthenticationConfig({
                enabled: true,
                endpoints: {
                    loginUrl: 'https://auth.example.com/launcher/login'
                }
            });
            state.authState = {
                authenticated: true,
                provider: 'google',
                userId: 'user-1',
                username: 'PlayerOne',
                email: 'player@example.com',
                user: { id: 'user-1' }
            };
            const html = renderAuthModal('change-password');
            assert(!html.includes('authCurrentPassword'), 'change-password form should be hidden without changePasswordUrl');
            assert(html.includes('data-auth-logout'), 'logout action should remain available');
        });

        test('auth IPC result sanitizer redacts account profile fields', function() {
            const sanitized = sanitizeIpcPayload('GetUiConfig', {
                authState: {
                    authenticated: true,
                    userId: 'user-1',
                    username: 'PlayerOne',
                    email: 'player@example.com',
                    user: { id: 'user-1' }
                }
            });
            assertEqual(sanitized.authState.userId, '[redacted]');
            assertEqual(sanitized.authState.username, '[redacted]');
            assertEqual(sanitized.authState.email, '[redacted]');
            assertEqual(sanitized.authState.user, '[redacted]');
        });

        test('disabled splash config clears stale launch splash', function() {
            state.splashShownKey = null;
            state.splashConfig = null;

            applySplashConfig({
                enabled: true,
                title: 'Starting Game',
                imageUrl: 'https://cdn.example.com/game-init.jpg',
                durationSeconds: 4,
                dismissible: false
            }, 'test-version-duration');
            applySplashConfig({ enabled: false }, 'test-version-duration');

            assertEqual(state.splashConfig, null, 'disabled splash config should clear stale splash');
            assertEqual(state.splashShownKey, null, 'disabled splash config should clear stale shown key');
        });

        test('disabled popup notice config clears stale startup notice', function() {
            state.popupNoticeShownKey = null;
            state.popupNoticeConfig = null;

            applyPopupNoticeConfig({
                enabled: true,
                imageUrl: 'https://cdn.example.com/startup-offer.jpg',
                imageAlt: 'Startup offer',
                dismissible: true
            }, 'test-version');
            applyPopupNoticeConfig({ enabled: false }, 'test-version');

            assertEqual(state.popupNoticeConfig, null, 'disabled popup notice config should clear stale notice');
            assertEqual(state.popupNoticeShownKey, null, 'disabled popup notice config should clear stale shown key');
        });



        // ===== BRIDGE API TESTS =====
        console.log('\n--- Bridge API ---');

        test('__LAUNCHER__ object exists', function() {
            if (!window.__LAUNCHER__) { skip('__LAUNCHER__ not available', 'bridge not loaded'); return; }
            assertNotNull(window.__LAUNCHER__);
        });

        test('__LAUNCHER__ has required methods', function() {
            if (!window.__LAUNCHER__) { skip('methods check', 'no bridge'); return; }
            assertType(window.__LAUNCHER__.invoke, 'function', 'invoke missing');
            assertType(window.__LAUNCHER__.on, 'function', 'on missing');
            assertType(window.__LAUNCHER__.off, 'function', 'off missing');
            assertType(window.__LAUNCHER__.once, 'function', 'once missing');
            assertType(window.__LAUNCHER__.isAvailable, 'function', 'isAvailable missing');
        });

        test('__LAUNCHER__.isAvailable returns boolean', function() {
            if (!window.__LAUNCHER__) { skip('isAvailable', 'no bridge'); return; }
            assertType(window.__LAUNCHER__.isAvailable(), 'boolean');
        });

        test('__LAUNCHER_RESOLVE__ exists', function() {
            if (!window.__LAUNCHER_RESOLVE__) { skip('__LAUNCHER_RESOLVE__', 'not available'); return; }
            assertType(window.__LAUNCHER_RESOLVE__, 'function');
        });

        test('__LAUNCHER_EVENT__ exists', function() {
            if (!window.__LAUNCHER_EVENT__) { skip('__LAUNCHER_EVENT__', 'not available'); return; }
            assertType(window.__LAUNCHER_EVENT__, 'function');
        });

        test('__LAUNCHER_CALLBACKS__ storage', function() {
            if (!window.__LAUNCHER_CALLBACKS__) { skip('callbacks storage', 'not available'); return; }
            assertType(window.__LAUNCHER_CALLBACKS__, 'object');
        });

        // ===== CALLBACK MANAGEMENT TESTS =====
        console.log('\n--- Callback Management ---');

        test('Callback resolution cleans up', function() {
            if (!window.__LAUNCHER_RESOLVE__ || !window.__LAUNCHER_CALLBACKS__) {
                skip('callback cleanup', 'bridge not ready'); return;
            }
            const testId = 'test-cleanup-' + Date.now();
            let resolved = false;
            window.__LAUNCHER_CALLBACKS__[testId] = {
                resolve: function(r) { resolved = true; },
                reject: function(e) {},
                _timestamp: Date.now(),
                _command: 'Test'
            };
            window.__LAUNCHER_RESOLVE__(testId, { ok: true }, null);
            assert(resolved, 'resolve should be called');
            assert(!window.__LAUNCHER_CALLBACKS__[testId], 'callback should be deleted');
        });

        test('Callback rejection cleans up', function() {
            if (!window.__LAUNCHER_RESOLVE__ || !window.__LAUNCHER_CALLBACKS__) {
                skip('callback reject', 'bridge not ready'); return;
            }
            const testId = 'test-reject-' + Date.now();
            let rejected = false;
            let errorData = null;
            window.__LAUNCHER_CALLBACKS__[testId] = {
                resolve: function(r) {},
                reject: function(e) { rejected = true; errorData = e; },
                _timestamp: Date.now(),
                _command: 'Test'
            };
            window.__LAUNCHER_RESOLVE__(testId, null, 'Test error');
            assert(rejected, 'reject should be called');
            assertEqual(errorData.error, 'Test error');
            assert(!window.__LAUNCHER_CALLBACKS__[testId], 'callback should be deleted');
        });

        test('Non-existent callback ID is ignored', function() {
            if (!window.__LAUNCHER_RESOLVE__) { skip('non-existent cb', 'no bridge'); return; }
            // Should not throw
            window.__LAUNCHER_RESOLVE__('non-existent-id-12345', { ok: true }, null);
            assert(true, 'no error thrown');
        });

        // ===== EVENT HANDLER TESTS =====
        console.log('\n--- Event Handlers ---');

        test('Event handler registration', function() {
            if (!window.__LAUNCHER__) { skip('event registration', 'no bridge'); return; }
            const handler = function() {};
            window.__LAUNCHER__.on('TestRegister', handler);
            assert(window.__LAUNCHER__._handlers['TestRegister'], 'handler array should exist');
            assert(window.__LAUNCHER__._handlers['TestRegister'].includes(handler), 'handler should be in array');
            window.__LAUNCHER__.off('TestRegister', handler);
        });

        test('Event handler removal', function() {
            if (!window.__LAUNCHER__) { skip('event removal', 'no bridge'); return; }
            const handler = function() {};
            window.__LAUNCHER__.on('TestRemove', handler);
            window.__LAUNCHER__.off('TestRemove', handler);
            assert(!window.__LAUNCHER__._handlers['TestRemove'] || 
                   !window.__LAUNCHER__._handlers['TestRemove'].includes(handler), 'handler should be removed');
        });

        test('Event handler receives data', function() {
            if (!window.__LAUNCHER__ || !window.__LAUNCHER_EVENT__) {
                skip('event receive', 'no bridge'); return;
            }
            let received = null;
            const handler = function(data) { received = data; };
            window.__LAUNCHER__.on('TestReceive', handler);
            window.__LAUNCHER_EVENT__({ event: 'TestReceive', data: { value: 42 } });
            assertEqual(received.value, 42);
            window.__LAUNCHER__.off('TestReceive', handler);
        });

        test('Multiple handlers on same event', function() {
            if (!window.__LAUNCHER__ || !window.__LAUNCHER_EVENT__) {
                skip('multi handlers', 'no bridge'); return;
            }
            let count = 0;
            const h1 = function() { count++; };
            const h2 = function() { count++; };
            window.__LAUNCHER__.on('TestMulti', h1);
            window.__LAUNCHER__.on('TestMulti', h2);
            window.__LAUNCHER_EVENT__({ event: 'TestMulti', data: {} });
            assertEqual(count, 2);
            window.__LAUNCHER__.off('TestMulti', h1);
            window.__LAUNCHER__.off('TestMulti', h2);
        });

        test('Handler error does not break other handlers', function() {
            if (!window.__LAUNCHER__ || !window.__LAUNCHER_EVENT__) {
                skip('handler error isolation', 'no bridge'); return;
            }
            let secondCalled = false;
            const badHandler = function() { throw new Error('Intentional'); };
            const goodHandler = function() { secondCalled = true; };
            window.__LAUNCHER__.on('TestErrorIsolation', badHandler);
            window.__LAUNCHER__.on('TestErrorIsolation', goodHandler);
            window.__LAUNCHER_EVENT__({ event: 'TestErrorIsolation', data: {} });
            assert(secondCalled, 'second handler should still be called');
            window.__LAUNCHER__.off('TestErrorIsolation');
        });

        // ===== GLOBAL ERROR HANDLER TESTS =====
        console.log('\n--- Global Error Handlers ---');

        test('logGlobalError function exists', function() {
            assertType(logGlobalError, 'function', 'logGlobalError should exist');
        });

        test('logGlobalError handles Error object', function() {
            const err = new Error('Test error');
            err.stack = 'Error: Test\n    at test:1:1';
            // Should not throw
            logGlobalError({ message: err.message, stack: err.stack, error: err }, 'test');
            assert(true, 'no error thrown');
        });

        test('logGlobalError handles string', function() {
            logGlobalError('Simple string error', 'test');
            assert(true, 'no error thrown');
        });

        test('logGlobalError handles null/undefined', function() {
            logGlobalError(null, 'test');
            logGlobalError(undefined, 'test');
            assert(true, 'no error thrown');
        });

        // ===== LOGGER TESTS =====
        console.log('\n--- Logger ---');

        test('logger object exists', function() {
            assertNotNull(logger);
            assertType(logger.debug, 'function');
            assertType(logger.info, 'function');
            assertType(logger.warn, 'function');
            assertType(logger.error, 'function');
        });

        test('logger.ipcCall exists', function() {
            assertType(logger.ipcCall, 'function');
        });

        test('logger.ipcResult exists', function() {
            assertType(logger.ipcResult, 'function');
        });

        test('logger.ipcEvent exists', function() {
            assertType(logger.ipcEvent, 'function');
        });

        // ===== ipcBridge TESTS =====
        console.log('\n--- ipcBridge Wrapper ---');

        test('ipcBridge object exists', function() {
            assertNotNull(ipcBridge);
            assertType(ipcBridge.invoke, 'function');
            assertType(ipcBridge.on, 'function');
        });

        test('ipcBridge.invoke returns Promise', function() {
            if (!window.__LAUNCHER__) { skip('invoke promise', 'no bridge'); return; }
            const result = ipcBridge.invoke('GetState');
            assert(result instanceof Promise, 'should return Promise');
        });

        // ===== HELPER FUNCTION TESTS =====
        console.log('\n--- Helper Functions ---');

        test('formatBytes handles zero', function() {
            assertEqual(formatBytes(0), '0 B');
        });

        test('formatBytes handles bytes', function() {
            assertEqual(formatBytes(500), '500 B');
        });

        test('formatBytes handles KB', function() {
            const result = formatBytes(2048);
            assert(result.includes('KB'), 'should format as KB');
        });

        test('formatBytes handles MB', function() {
            const result = formatBytes(5 * 1024 * 1024);
            assert(result.includes('MB'), 'should format as MB');
        });

        test('formatSpeed includes /s', function() {
            const result = formatSpeed(1024);
            assert(result.includes('/s'), 'should include /s');
        });

        test('formatETA handles zero', function() {
            assertEqual(formatETA(0), '--');
        });

        test('formatETA handles seconds', function() {
            const result = formatETA(45);
            assert(result.includes('s'), 'should include s');
        });

        test('formatETA handles minutes', function() {
            const result = formatETA(125);
            assert(result.includes('m'), 'should include m');
        });

        test('isValidUrl accepts http', function() {
            assert(isValidUrl('http://example.com'), 'http should be valid');
        });

        test('progress percent is clamped for display', function() {
            assertEqual(normalizeProgressPercent(-10), 0);
            assertEqual(normalizeProgressPercent(125), 100);
            assertEqual(normalizeProgressPercent('42'), 42);
            assertEqual(normalizeProgressPercent('not-a-number'), 0);
        });

        test('progress state class follows app state', function() {
            const prev = state.current;

            state.current = AppState.READY;
            assertEqual(resolveProgressStateClass(0), 'progress-state-idle');
            state.current = AppState.DOWNLOADING;
            assertEqual(resolveProgressStateClass(25), 'progress-state-downloading');
            state.current = AppState.VERIFYING;
            assertEqual(resolveProgressStateClass(25), 'progress-state-verifying');
            state.current = AppState.APPLYING;
            assertEqual(resolveProgressStateClass(25), 'progress-state-patching');
            state.current = AppState.ERROR;
            assertEqual(resolveProgressStateClass(25), 'progress-state-error');
            state.current = AppState.DOWNLOADING;
            assertEqual(resolveProgressStateClass(100), 'progress-state-complete');

            state.current = prev;
        });

        test('updateProgress applies matching progress state class', function() {
            const bar = $('#progressBar');
            assertNotNull(bar, 'progress bar should exist');

            const prevState = state.current;
            const prevDownloading = state.isDownloading;
            const prevWidth = bar.style.width;
            const prevClassName = bar.className;

            state.current = AppState.DOWNLOADING;
            state.isDownloading = true;
            updateProgress(42);
            assertEqual(bar.style.width, '42%');
            assert(bar.classList.contains('progress-state-downloading'), 'download state should use download progress color');
            assert(bar.classList.contains('active'), 'in-progress download should animate');

            state.current = AppState.ERROR;
            updateProgress(42);
            assert(bar.classList.contains('progress-state-error'), 'error state should use error progress color');

            state.current = prevState;
            state.isDownloading = prevDownloading;
            bar.style.width = prevWidth;
            bar.className = prevClassName;
        });

        test('isValidUrl accepts https', function() {
            assert(isValidUrl('https://example.com'), 'https should be valid');
        });

        test('isValidUrl accepts mailto', function() {
            assert(isValidUrl('mailto:test@example.com'), 'mailto should be valid');
        });

        test('isValidUrl rejects javascript', function() {
            assert(!isValidUrl('javascript:alert(1)'), 'javascript should be invalid');
        });

        test('isValidUrl rejects file', function() {
            assert(!isValidUrl('file:///etc/passwd'), 'file should be invalid');
        });

        test('isValidUrl handles invalid input', function() {
            assert(!isValidUrl(null), 'null should be invalid');
            assert(!isValidUrl(undefined), 'undefined should be invalid');
            assert(!isValidUrl(''), 'empty should be invalid');
            assert(!isValidUrl('not-a-url'), 'non-url should be invalid');
        });


        test('register nav hides when auth and register link are absent', function() {
            const registerBtn = document.querySelector('.auth-register-btn');
            assertNotNull(registerBtn, 'register button should exist');

            const prevAuthConfig = state.authConfig;
            const prevAuthState = { ...state.authState };
            const prevLinks = state.links;
            const prevHidden = registerBtn.hidden;
            const prevTitle = registerBtn.title;
            const prevAria = registerBtn.getAttribute('aria-label');
            const prevTooltipI18n = registerBtn.dataset.tooltipI18n;
            const prevTooltip = registerBtn.dataset.tooltip;

            state.authConfig = null;
            state.authState = { ...state.authState, authenticated: false };
            state.links = {};

            updateAuthNavVisibility();

            assert(registerBtn.hidden, 'register button should hide when no auth register endpoint or external register link exists');

            state.authConfig = prevAuthConfig;
            state.authState = prevAuthState;
            state.links = prevLinks;
            registerBtn.hidden = prevHidden;
            registerBtn.title = prevTitle;
            if (prevAria === null) {
                registerBtn.removeAttribute('aria-label');
            } else {
                registerBtn.setAttribute('aria-label', prevAria);
            }
            registerBtn.dataset.tooltipI18n = prevTooltipI18n;
            registerBtn.dataset.tooltip = prevTooltip;
        });

        // ===== STATE MANAGEMENT TESTS =====
        console.log('\n--- State Management ---');

        test('AppState enum exists', function() {
            assertNotNull(AppState);
            assertNotNull(AppState.READY);
            assertNotNull(AppState.DOWNLOADING);
            assertNotNull(AppState.ERROR);
        });

        test('state object exists', function() {
            assertNotNull(state);
            assertNotNull(state.current);
        });

        test('setAppState updates state', function() {
            const prev = state.current;
            setAppState(AppState.READY);
            assertEqual(state.current, AppState.READY);
            state.current = prev; // restore
        });

        // ===== EDGE CASES =====
        console.log('\n--- Edge Cases ---');

        test('Unicode preservation', function() {
            const data = { message: '日本語テスト - Ελληνικά - العربية - 中文 - émojis: 🎮' };
            const parsed = JSON.parse(JSON.stringify(data));
            assert(parsed.message.includes('日本語'));
            assert(parsed.message.includes('🎮'));
        });

        test('Special characters in paths', function() {
            const data = { path: 'C:\\Users\\Test\\Documents\\Game Files\\save.dat' };
            const parsed = JSON.parse(JSON.stringify(data));
            assert(parsed.path.includes('C:\\'));
        });

        test('Escaped quotes', function() {
            const data = { msg: 'He said "hello" and \'goodbye\'' };
            const parsed = JSON.parse(JSON.stringify(data));
            assert(parsed.msg.includes('"hello"'));
        });

        test('Large numbers', function() {
            const data = { bytes: 9007199254740991 }; // MAX_SAFE_INTEGER
            const parsed = JSON.parse(JSON.stringify(data));
            assertEqual(parsed.bytes, 9007199254740991);
        });

        test('Empty arrays and objects', function() {
            const data = { files: [], config: {} };
            const parsed = JSON.parse(JSON.stringify(data));
            assertEqual(parsed.files.length, 0);
            assertEqual(Object.keys(parsed.config).length, 0);
        });

        // ===== RESULTS =====
        console.log('\n========================================');
        console.log(`IPC Tests: ${TestResults.passed} passed, ${TestResults.failed} failed, ${TestResults.skipped} skipped`);
        console.log('========================================');
        if (TestResults.failed > 0) {
            console.log('\nFailed Tests:');
            TestResults.errors.forEach(e => console.log(`  ✗ ${e.name}: ${e.error}`));
        }
        return TestResults;
    }

    // ===== ASYNC IPC TRANSACTION TESTS =====
    // These tests perform actual round-trip IPC calls to Rust
    async function runAsyncTests() {
        console.log('\n\nRunning Async IPC Transaction Tests...\n');
        const asyncResults = { passed: 0, failed: 0, skipped: 0, errors: [] };

        async function asyncTest(name, fn, timeoutMs = 10000) {
            if (!window.__LAUNCHER__ || !window.__LAUNCHER__.isAvailable()) {
                asyncResults.skipped++;
                console.log(`○ ${name} (skipped: IPC not available)`);
                return;
            }
            try {
                await Promise.race([
                    fn(),
                    new Promise((_, reject) => setTimeout(() => reject(new Error('Timeout')), timeoutMs))
                ]);
                asyncResults.passed++;
                console.log(`✓ ${name}`);
            } catch (e) {
                asyncResults.failed++;
                asyncResults.errors.push({ name, error: e.message });
                console.error(`✗ ${name}: ${e.message}`);
            }
        }

        // ===== JS → Rust COMMAND TESTS =====
        console.log('--- JS → Rust Commands ---');

        await asyncTest('GetState returns valid state', async function() {
            const result = await ipcBridge.invoke('GetState');
            assertNotNull(result, 'result should not be null');
            assertNotNull(result.state, 'state field should exist');
            assertType(result.state, 'string', 'state should be string');
        });

        await asyncTest('GetTranslations returns lang and translations', async function() {
            const result = await ipcBridge.invoke('GetTranslations');
            assertNotNull(result, 'result should not be null');
            assertNotNull(result.lang, 'lang field should exist');
            assertNotNull(result.translations, 'translations field should exist');
            assertType(result.lang, 'string', 'lang should be string');
            assertType(result.translations, 'object', 'translations should be object');
        });

        await asyncTest('GetAvailableLanguages returns array', async function() {
            const result = await ipcBridge.invoke('GetAvailableLanguages');
            assertNotNull(result, 'result should not be null');
            assertNotNull(result.languages, 'languages field should exist');
            assert(Array.isArray(result.languages), 'languages should be array');
            assert(result.languages.length > 0, 'should have at least one language');
        });

        await asyncTest('GetUiConfig returns config object', async function() {
            const result = await ipcBridge.invoke('GetUiConfig');
            assertNotNull(result, 'result should not be null');
            assertNotNull(result.version, 'version should exist');
        });

        await asyncTest('GetSettings returns settings object', async function() {
            const result = await ipcBridge.invoke('GetSettings');
            assertNotNull(result, 'result should not be null');
            // Should have bandwidth and concurrency
            assertNotNull(result.bandwidth, 'bandwidth should exist');
            assertNotNull(result.concurrency, 'concurrency should exist');
        });

        await asyncTest('GetServerStatus returns online status', async function() {
            const result = await ipcBridge.invoke('GetServerStatus');
            assertNotNull(result, 'result should not be null');
            assertType(result.online, 'boolean', 'online should be boolean');
            assertNotNull(result.status, 'status field should exist');
        });

        await asyncTest('GetInstallPath returns path', async function() {
            const result = await ipcBridge.invoke('GetInstallPath');
            assertNotNull(result, 'result should not be null');
            assertNotNull(result.path, 'path field should exist');
            assertType(result.path, 'string', 'path should be string');
        });

        await asyncTest('GetBandwidthLimit returns limit info', async function() {
            const result = await ipcBridge.invoke('GetBandwidthLimit');
            assertNotNull(result, 'result should not be null');
            assertEqual(result.status, 'ok', 'status should be ok');
        });

        await asyncTest('CheckConnection returns connection status', async function() {
            const result = await ipcBridge.invoke('CheckConnection');
            assertNotNull(result, 'result should not be null');
            assertType(result.connected, 'boolean', 'connected should be boolean');
        });

        await asyncTest('IsDownloadPaused returns paused status', async function() {
            const result = await ipcBridge.invoke('IsDownloadPaused');
            assertNotNull(result, 'result should not be null');
            assertType(result.paused, 'boolean', 'paused should be boolean');
        });

        await asyncTest('GetProgress returns progress or no_download_active', async function() {
            const result = await ipcBridge.invoke('GetProgress');
            assertNotNull(result, 'result should not be null');
            // Either has progress fields or status: no_download_active
            assert(result.status === 'no_download_active' || result.total_files !== undefined,
                   'should have progress or no_download_active status');
        });

        await asyncTest('GetDownloadStats returns stats', async function() {
            const result = await ipcBridge.invoke('GetDownloadStats');
            assertNotNull(result, 'result should not be null');
            assertType(result.active, 'boolean', 'active should be boolean');
            assertType(result.totalFiles, 'number', 'totalFiles should be number');
        });

        // ===== JS → Rust COMMAND WITH PAYLOAD TESTS =====
        console.log('\n--- JS → Rust Commands with Payload ---');

        await asyncTest('LogMessage command succeeds', async function() {
            const result = await ipcBridge.invoke('LogMessage', {
                level: 'debug',
                message: '[TEST] IPC transaction test message',
                context: JSON.stringify({ test: true, timestamp: Date.now() })
            });
            assertNotNull(result, 'result should not be null');
            assertEqual(result.status, 'logged', 'status should be logged');
        });

        await asyncTest('LogMessage with all levels', async function() {
            const levels = ['debug', 'info', 'warn', 'error'];
            for (const level of levels) {
                const result = await ipcBridge.invoke('LogMessage', {
                    level: level,
                    message: `[TEST] ${level} level test`
                });
                assertEqual(result.status, 'logged', `${level} should succeed`);
            }
        });

        await asyncTest('SetLanguage and verify change', async function() {
            // Get current language first
            const before = await ipcBridge.invoke('GetTranslations');
            const originalLang = before.lang;
            
            // Try setting to English (should always exist)
            const result = await ipcBridge.invoke('SetLanguage', { lang: 'en' });
            assertNotNull(result, 'result should not be null');
            assertEqual(result.status, 'ok', 'status should be ok');
            
            // Restore original if different
            if (originalLang !== 'en') {
                await ipcBridge.invoke('SetLanguage', { lang: originalLang });
            }
        });

        await asyncTest('ComputeBytesHash returns hash', async function() {
            const result = await ipcBridge.invoke('ComputeBytesHash', {
                data: 'test data for hashing',
                algorithm: 'sha256'
            });
            assertNotNull(result, 'result should not be null');
            assertNotNull(result.hash, 'hash should exist');
            assertType(result.hash, 'string', 'hash should be string');
            assert(result.hash.length === 64, 'SHA256 hash should be 64 chars');
        });

        await asyncTest('ComputeBytesHash with different algorithms', async function() {
            const algorithms = ['sha256', 'blake3', 'xxh3'];
            for (const algo of algorithms) {
                try {
                    const result = await ipcBridge.invoke('ComputeBytesHash', {
                        data: 'test',
                        algorithm: algo
                    });
                    assertNotNull(result.hash, `${algo} should return hash`);
                } catch (e) {
                    // Some algorithms might not be available, that's ok
                    console.log(`    (${algo}: ${e.message})`);
                }
            }
        });

        await asyncTest('SanitizeLogPath sanitizes path', async function() {
            const result = await ipcBridge.invoke('SanitizeLogPath', {
                path: 'C:\\Users\\TestUser\\Documents\\game.log'
            });
            assertNotNull(result, 'result should not be null');
            assertNotNull(result.sanitized, 'sanitized path should exist');
        });

        // ===== ERROR HANDLING TESTS =====
        console.log('\n--- Error Handling ---');

        await asyncTest('Invalid command returns error', async function() {
            try {
                await window.__LAUNCHER__.invoke('NonExistentCommand123');
                throw new Error('Should have thrown');
            } catch (e) {
                assert(e.error || e.message, 'should have error message');
            }
        });

        await asyncTest('Missing required payload field returns error', async function() {
            try {
                await window.__LAUNCHER__.invoke('SetLanguage', {}); // missing 'lang'
                throw new Error('Should have thrown');
            } catch (e) {
                assert(e.error || e.message, 'should have error message');
            }
        });

        await asyncTest('Invalid URL in CheckUrlReachable handled', async function() {
            const result = await ipcBridge.invoke('CheckUrlReachable', {
                url: 'https://this-domain-definitely-does-not-exist-12345.com'
            });
            assertNotNull(result, 'result should not be null');
            assertEqual(result.reachable, false, 'unreachable URL should return false');
        });

        // ===== REPLY TIMING TESTS =====
        console.log('\n--- Reply Timing ---');

        await asyncTest('Multiple concurrent requests resolve correctly', async function() {
            const promises = [
                ipcBridge.invoke('GetState'),
                ipcBridge.invoke('GetTranslations'),
                ipcBridge.invoke('GetAvailableLanguages'),
                ipcBridge.invoke('GetSettings'),
                ipcBridge.invoke('GetServerStatus')
            ];
            
            const results = await Promise.all(promises);
            
            assertEqual(results.length, 5, 'should have 5 results');
            assertNotNull(results[0].state, 'GetState should have state');
            assertNotNull(results[1].translations, 'GetTranslations should have translations');
            assert(Array.isArray(results[2].languages), 'GetAvailableLanguages should have array');
            assertNotNull(results[3].bandwidth, 'GetSettings should have bandwidth');
            assertType(results[4].online, 'boolean', 'GetServerStatus should have online');
        });

        await asyncTest('Requests resolve in correct order with IDs', async function() {
            const order = [];
            const p1 = ipcBridge.invoke('GetState').then(r => { order.push(1); return r; });
            const p2 = ipcBridge.invoke('GetTranslations').then(r => { order.push(2); return r; });
            const p3 = ipcBridge.invoke('GetAvailableLanguages').then(r => { order.push(3); return r; });
            
            await Promise.all([p1, p2, p3]);
            
            // All should complete (order may vary due to async)
            assertEqual(order.length, 3, 'all 3 should complete');
            assert(order.includes(1) && order.includes(2) && order.includes(3), 'all requests should resolve');
        });

        // ===== RUST → JS EVENT TESTS =====
        console.log('\n--- Rust → JS Events ---');

        await asyncTest('Event handlers receive events', async function() {
            return new Promise((resolve, reject) => {
                let received = false;
                const timeout = setTimeout(() => {
                    window.__LAUNCHER__.off('StateChanged', handler);
                    // Not a failure - just means no state change occurred during test
                    resolve();
                }, 2000);
                
                const handler = function(data) {
                    received = true;
                    clearTimeout(timeout);
                    window.__LAUNCHER__.off('StateChanged', handler);
                    try {
                        assertNotNull(data.state, 'event should have state');
                        resolve();
                    } catch (e) {
                        reject(e);
                    }
                };
                
                window.__LAUNCHER__.on('StateChanged', handler);
                
                // Trigger a state check which might emit StateChanged
                ipcBridge.invoke('GetState').then(() => {
                    // If no event after 2s, that's ok
                    if (!received) {
                        setTimeout(() => {
                            if (!received) {
                                clearTimeout(timeout);
                                window.__LAUNCHER__.off('StateChanged', handler);
                                resolve(); // Pass - no event during test period is ok
                            }
                        }, 2000);
                    }
                });
            });
        });

        // ===== RESULTS =====
        console.log('\n========================================');
        console.log(`Async IPC Tests: ${asyncResults.passed} passed, ${asyncResults.failed} failed, ${asyncResults.skipped} skipped`);
        console.log('========================================');
        if (asyncResults.failed > 0) {
            console.log('\nFailed Tests:');
            asyncResults.errors.forEach(e => console.log(`  ✗ ${e.name}: ${e.error}`));
        }
        return asyncResults;
    }

    // Combined test runner
    async function runAllTests() {
        const syncResults = runTests();
        const asyncResults = await runAsyncTests();
        
        console.log('\n\n╔══════════════════════════════════════╗');
        console.log('║         COMBINED TEST RESULTS         ║');
        console.log('╠══════════════════════════════════════╣');
        console.log(`║ Sync:  ${String(syncResults.passed).padStart(3)} passed, ${String(syncResults.failed).padStart(3)} failed, ${String(syncResults.skipped).padStart(3)} skipped ║`);
        console.log(`║ Async: ${String(asyncResults.passed).padStart(3)} passed, ${String(asyncResults.failed).padStart(3)} failed, ${String(asyncResults.skipped).padStart(3)} skipped ║`);
        console.log('╠══════════════════════════════════════╣');
        const totalPassed = syncResults.passed + asyncResults.passed;
        const totalFailed = syncResults.failed + asyncResults.failed;
        const totalSkipped = syncResults.skipped + asyncResults.skipped;
        console.log(`║ Total: ${String(totalPassed).padStart(3)} passed, ${String(totalFailed).padStart(3)} failed, ${String(totalSkipped).padStart(3)} skipped ║`);
        console.log('╚══════════════════════════════════════╝');
        
        return { sync: syncResults, async: asyncResults, total: { passed: totalPassed, failed: totalFailed, skipped: totalSkipped } };
    }

    window.IPCTests = { 
        run: runTests,           // Sync tests only
        runAsync: runAsyncTests, // Async IPC tests only  
        runAll: runAllTests,     // Both sync and async
        results: TestResults 
    };
})();