Function saveAIToken

web/scripts/ragnar_modern.js:12900–12952

()

            if (badge) { badge.classList.remove('hidden'); }
            if (summary) {
                summary.innerHTML = '<p class="text-sm text-green-400">Authentication is enabled. Database is encrypted and hardware-bound. Expand to manage.</p>';
            }
        } else {
            if (badge) { badge.classList.add('hidden'); }
            if (summary) {
                summary.innerHTML = '<p class="text-sm text-red-400">Set up authentication to protect your Ragnar instance. Once enabled, all access will require login. The database will be encrypted and bound to this hardware.</p>';
            }
        }

        if (!status.configured) {
            // Show setup form
            container.innerHTML = `
                <div class="mb-4">
                    <div class="p-3 rounded-lg bg-yellow-900/30 border border-yellow-700 text-sm text-yellow-300 mb-4">
                        Warning: Once authentication is enabled, you will need your password or recovery codes to access Ragnar.
                        Make sure to save your recovery codes in a safe place.
                    </div>
                </div>
                <form id="auth-setup-form" onsubmit="handleAuthSetup(event)" class="space-y-4">
                    <div>
                        <label class="block text-sm font-medium text-gray-300 mb-2">Username</label>
                        <input type="text" id="setup-username" required autocomplete="username"
                               class="w-full px-4 py-2 rounded-lg bg-slate-700 border border-slate-600 text-white placeholder-gray-400 focus:ring-2 focus:ring-sky-500 focus:border-transparent outline-none"
                               placeholder="Choose a username">
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-300 mb-2">Password</label>
                        <input type="password" id="setup-password" required minlength="8" autocomplete="new-password"
                               class="w-full px-4 py-2 rounded-lg bg-slate-700 border border-slate-600 text-white placeholder-gray-400 focus:ring-2 focus:ring-sky-500 focus:border-transparent outline-none"
                               placeholder="Minimum 8 characters">
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-300 mb-2">Confirm Password</label>
                        <input type="password" id="setup-confirm-password" required minlength="8" autocomplete="new-password"
                               class="w-full px-4 py-2 rounded-lg bg-slate-700 border border-slate-600 text-white placeholder-gray-400 focus:ring-2 focus:ring-sky-500 focus:border-transparent outline-none"
                               placeholder="Confirm password">
                    </div>
                    <div id="setup-status" class="hidden p-3 rounded-lg text-sm"></div>
                    <button type="submit" id="setup-btn"
                            class="w-full bg-sky-600 hover:bg-sky-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors">
                        Enable Authentication
                    </button>
                </form>
            `;
        } else {
            // Show management panel
            let hwBadge = status.hw_match
                ? '<span class="text-green-400 text-xs">Hardware matched</span>'
                : '<span class="text-red-400 text-xs">Hardware mismatch!</span>';

            container.innerHTML = `
                <div class="space-y-4">
                    <div class="flex items-center justify-between">
                        <div>
                            <span class="text-green-400 font-medium">Authentication Enabled</span>
                            <span class="mx-2 text-gray-500">|</span>