diff --git a/extension/options/options.html b/extension/options/options.html
new file mode 100644
index 0000000..27e5136
--- /dev/null
+++ b/extension/options/options.html
@@ -0,0 +1,41 @@
+
+
+
+
+ FabledCurator — Settings
+
+
+
+ FabledCurator extension
+
+
+
+ Find this on FC → Settings → Maintenance → Browser extension.
+
+
+
+ Generate or rotate on FC → Settings → Maintenance → Browser extension.
+
+
+
+
+
+
+
+
+
+
+
diff --git a/extension/options/options.js b/extension/options/options.js
new file mode 100644
index 0000000..4798183
--- /dev/null
+++ b/extension/options/options.js
@@ -0,0 +1,46 @@
+document.addEventListener('DOMContentLoaded', async () => {
+ const stored = await browser.storage.local.get(['apiUrl', 'apiKey']);
+ document.getElementById('api-url').value = stored.apiUrl || '';
+ document.getElementById('api-key').value = stored.apiKey || '';
+
+ document.getElementById('save-btn').addEventListener('click', save);
+ document.getElementById('test-btn').addEventListener('click', test);
+});
+
+async function save() {
+ const apiUrl = document.getElementById('api-url').value.trim().replace(/\/+$/, '');
+ const apiKey = document.getElementById('api-key').value.trim();
+ if (!apiUrl || !apiKey) {
+ showStatus('Both fields are required.', 'err');
+ return;
+ }
+ await browser.storage.local.set({ apiUrl, apiKey });
+ await browser.storage.local.remove(['lastConnectionTest', 'lastConnectionStatus']);
+ showStatus('Saved.', 'ok');
+}
+
+async function test() {
+ const apiUrl = document.getElementById('api-url').value.trim().replace(/\/+$/, '');
+ const apiKey = document.getElementById('api-key').value.trim();
+ if (!apiUrl || !apiKey) {
+ showStatus('Fill both fields first.', 'err');
+ return;
+ }
+ try {
+ const r = await fetch(`${apiUrl}/credentials`, {
+ method: 'GET',
+ headers: { 'X-Extension-Key': apiKey },
+ });
+ if (r.ok) showStatus(`Connected — HTTP ${r.status}.`, 'ok');
+ else showStatus(`HTTP ${r.status}: ${r.statusText}`, 'err');
+ } catch (e) {
+ showStatus(`Cannot reach ${apiUrl}: ${e.message}`, 'err');
+ }
+}
+
+function showStatus(text, kind) {
+ const el = document.getElementById('status');
+ el.textContent = text;
+ el.className = `status ${kind}`;
+ el.style.display = 'block';
+}