@consilioweb/payload-seo-analyzer 1.10.0 → 1.11.0

package/dist/client.js

@@ -1059,6 +1059,9 @@ var fr = {
     pagesAnalyzed: "pages analys\xE9es",
     markCornerstone: "Marquer pilier",
     unmarkCornerstone: "D\xE9marquer pilier",
+    bulkOptimizeMeta: "Optimiser m\xE9ta (IA)",
+    bulkOptimizing: "Optimisation\u2026",
+    bulkConfirm: "Confirmer ?",
     searchPlaceholder: "Rechercher (titre, slug, keyword)...",
     allCollections: "Toutes les collections",
     allScores: "Tous les scores",
@@ -1651,6 +1654,9 @@ var en = {
     pagesAnalyzed: "pages analyzed",
     markCornerstone: "Mark as cornerstone",
     unmarkCornerstone: "Unmark cornerstone",
+    bulkOptimizeMeta: "Optimize meta (AI)",
+    bulkOptimizing: "Optimizing\u2026",
+    bulkConfirm: "Confirm?",
     searchPlaceholder: "Search (title, slug, keyword)...",
     allCollections: "All collections",
     allScores: "All scores",
@@ -9195,8 +9201,11 @@ function BulkActionBar({
   onExportCsv,
   onMarkCornerstone,
   onUnmarkCornerstone,
+  onOptimizeMeta,
+  optimizing,
   t
 }) {
+  const [confirmOptimize, setConfirmOptimize] = useState(false);
   if (count === 0) return null;
   return /* @__PURE__ */ jsxs(
     "div",
@@ -9242,6 +9251,24 @@ function BulkActionBar({
               children: t.common.exportCsv
             }
           ),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              onClick: () => {
+                if (optimizing) return;
+                if (confirmOptimize) {
+                  setConfirmOptimize(false);
+                  onOptimizeMeta();
+                } else {
+                  setConfirmOptimize(true);
+                  setTimeout(() => setConfirmOptimize(false), 4e3);
+                }
+              },
+              disabled: optimizing,
+              style: { ...btnBase, backgroundColor: "#7c3aed", color: "#fff", opacity: optimizing ? 0.6 : 1 },
+              children: optimizing ? t.seoView.bulkOptimizing : confirmOptimize ? t.seoView.bulkConfirm : `\u2728 ${t.seoView.bulkOptimizeMeta}`
+            }
+          ),
           /* @__PURE__ */ jsx(
             "button",
             {
@@ -9282,6 +9309,7 @@ function SeoView() {
   const [expandedId, setExpandedId] = useState(null);
   const [saving, setSaving] = useState(false);
   const [saveError, setSaveError] = useState(null);
+  const [bulkOptimizing, setBulkOptimizing] = useState(false);
   const PAGE_SIZE = 50;
   const fetchAudit = useCallback(async (forceRefresh = false) => {
     setLoading(true);
@@ -9502,6 +9530,45 @@ function SeoView() {
     },
     [selectedIds, fetchAudit]
   );
+  const handleBulkOptimizeMeta = useCallback(async () => {
+    const keys = Array.from(selectedIds);
+    if (keys.length === 0) return;
+    setBulkOptimizing(true);
+    for (const key of keys) {
+      const [collection, id] = key.split("::");
+      if (!collection || !id || collection.startsWith("global:")) continue;
+      try {
+        const res = await fetch("/api/seo-plugin/ai-optimize", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          credentials: "include",
+          body: JSON.stringify({ collection, id })
+        });
+        if (!res.ok) continue;
+        const data = await res.json();
+        const sug = data.suggestions || {};
+        const patch = {};
+        if (sug.metaTitle || sug.metaDescription) {
+          patch.meta = { title: sug.metaTitle, description: sug.metaDescription };
+        }
+        if (sug.focusKeyword && sug.focusKeyword !== data.current?.focusKeyword) {
+          patch.focusKeyword = sug.focusKeyword;
+        }
+        if (Object.keys(patch).length > 0) {
+          await fetch(`/api/${collection}/${id}`, {
+            method: "PATCH",
+            headers: { "Content-Type": "application/json" },
+            credentials: "include",
+            body: JSON.stringify(patch)
+          });
+        }
+      } catch {
+      }
+    }
+    setBulkOptimizing(false);
+    setSelectedIds(/* @__PURE__ */ new Set());
+    fetchAudit();
+  }, [selectedIds, fetchAudit]);
   const handleInlineSave = useCallback(
     async (item, metaTitle, metaDescription) => {
       setSaving(true);
@@ -10250,6 +10317,8 @@ function SeoView() {
             onExportCsv: handleBulkExportCsv,
             onMarkCornerstone: () => handleBulkCornerstone(true),
             onUnmarkCornerstone: () => handleBulkCornerstone(false),
+            onOptimizeMeta: handleBulkOptimizeMeta,
+            optimizing: bulkOptimizing,
             t
           }
         )
@@ -18469,6 +18538,183 @@ function PerformanceView() {
     }
   );
 }
+var C9 = {
+  text: "var(--theme-text, #1a1a1a)",
+  sub: "var(--theme-elevation-600, #6b7280)",
+  card: "var(--theme-elevation-50, #f9fafb)",
+  bg: "var(--theme-elevation-0, #fff)",
+  border: "var(--theme-elevation-200, #e5e7eb)",
+  violet: "#7c3aed",
+  red: "#ef4444",
+  blue: "#3b82f6"
+};
+var S6 = {
+  fr: {
+    title: "Brief de contenu IA",
+    subtitle: "G\xE9n\xE8re un plan r\xE9dactionnel optimis\xE9 pour un mot-cl\xE9 (plan, entit\xE9s, questions, longueur cible).",
+    placeholder: "Mot-cl\xE9 cible (ex : plombier paris)",
+    generate: "G\xE9n\xE9rer le brief",
+    generating: "G\xE9n\xE9ration\u2026",
+    outline: "Plan sugg\xE9r\xE9",
+    entities: "Entit\xE9s / termes \xE0 couvrir",
+    questions: "Questions \xE0 traiter",
+    links: "Id\xE9es de liens internes",
+    words: "Longueur recommand\xE9e",
+    wordsUnit: "mots",
+    notes: "Conseils",
+    noKey: "Cl\xE9 API Claude requise (ANTHROPIC_API_KEY).",
+    disabled: "Fonction IA d\xE9sactiv\xE9e (features.aiFeatures)."
+  },
+  en: {
+    title: "AI content brief",
+    subtitle: "Generate an optimized writing brief for a keyword (outline, entities, questions, target length).",
+    placeholder: "Target keyword (e.g. paris plumber)",
+    generate: "Generate brief",
+    generating: "Generating\u2026",
+    outline: "Suggested outline",
+    entities: "Entities / terms to cover",
+    questions: "Questions to answer",
+    links: "Internal link ideas",
+    words: "Recommended length",
+    wordsUnit: "words",
+    notes: "Tips",
+    noKey: "Claude API key required (ANTHROPIC_API_KEY).",
+    disabled: "AI feature disabled (features.aiFeatures)."
+  }
+};
+function ContentBriefPanel({ locale }) {
+  const s = S6[locale] ?? S6.fr;
+  const [keyword, setKeyword] = useState("");
+  const [brief, setBrief] = useState(null);
+  const [busy, setBusy] = useState(false);
+  const [error, setError] = useState(null);
+  const generate = async () => {
+    if (!keyword.trim()) return;
+    setBusy(true);
+    setError(null);
+    setBrief(null);
+    try {
+      const res = await fetch("/api/seo-plugin/ai-content-brief", {
+        method: "POST",
+        credentials: "include",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ keyword: keyword.trim() })
+      });
+      if (res.status === 404) {
+        setError(s.disabled);
+        return;
+      }
+      const json = await res.json();
+      if (!res.ok) {
+        setError(json.code === "no_api_key" ? s.noKey : json.error || `Error ${res.status}`);
+        return;
+      }
+      setBrief(json.brief);
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Network error");
+    } finally {
+      setBusy(false);
+    }
+  };
+  const card = {
+    padding: 16,
+    borderRadius: 12,
+    border: `1px solid ${C9.border}`,
+    backgroundColor: C9.card,
+    marginBottom: 20
+  };
+  const chip = {
+    display: "inline-block",
+    fontSize: 11,
+    padding: "3px 8px",
+    borderRadius: 999,
+    backgroundColor: "rgba(59,130,246,0.12)",
+    color: C9.blue,
+    border: `1px solid ${C9.border}`,
+    margin: "0 6px 6px 0"
+  };
+  const h4 = { fontSize: 12, fontWeight: 800, color: C9.text, margin: "14px 0 6px", textTransform: "uppercase" };
+  return /* @__PURE__ */ jsxs("div", { style: card, children: [
+    /* @__PURE__ */ jsx("div", { style: { fontSize: 16, fontWeight: 800, color: C9.text }, children: s.title }),
+    /* @__PURE__ */ jsx("div", { style: { fontSize: 12, color: C9.sub, marginTop: 2, marginBottom: 12 }, children: s.subtitle }),
+    /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 8, flexWrap: "wrap" }, children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          value: keyword,
+          onChange: (e) => setKeyword(e.target.value),
+          onKeyDown: (e) => {
+            if (e.key === "Enter") void generate();
+          },
+          placeholder: s.placeholder,
+          style: {
+            flex: 1,
+            minWidth: 220,
+            padding: "8px 12px",
+            fontSize: 13,
+            borderRadius: 8,
+            border: `1px solid ${C9.border}`,
+            backgroundColor: C9.bg,
+            color: C9.text
+          }
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => void generate(),
+          disabled: busy || !keyword.trim(),
+          style: {
+            padding: "8px 14px",
+            borderRadius: 8,
+            border: `1px solid ${C9.violet}`,
+            backgroundColor: C9.violet,
+            color: "#fff",
+            fontSize: 12,
+            fontWeight: 700,
+            cursor: busy || !keyword.trim() ? "not-allowed" : "pointer",
+            opacity: busy || !keyword.trim() ? 0.6 : 1
+          },
+          children: busy ? s.generating : `\u2728 ${s.generate}`
+        }
+      )
+    ] }),
+    error && /* @__PURE__ */ jsx("div", { style: { color: C9.red, fontSize: 13, fontWeight: 600, marginTop: 10 }, children: error }),
+    brief && /* @__PURE__ */ jsxs("div", { style: { marginTop: 8 }, children: [
+      brief.recommendedWordCount > 0 && /* @__PURE__ */ jsxs("div", { style: { fontSize: 12, color: C9.sub, marginTop: 10 }, children: [
+        s.words,
+        ": ",
+        /* @__PURE__ */ jsxs("b", { style: { color: C9.text }, children: [
+          "~",
+          brief.recommendedWordCount,
+          " ",
+          s.wordsUnit
+        ] })
+      ] }),
+      brief.outline.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("div", { style: h4, children: s.outline }),
+        /* @__PURE__ */ jsx("ul", { style: { margin: 0, paddingLeft: 18, fontSize: 13, color: C9.text, lineHeight: 1.6 }, children: brief.outline.map((o, i) => /* @__PURE__ */ jsx("li", { style: { marginLeft: o.level === "h3" ? 18 : 0, color: o.level === "h3" ? C9.sub : C9.text, fontWeight: o.level === "h2" ? 700 : 400 }, children: o.text }, i)) })
+      ] }),
+      brief.entities.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("div", { style: h4, children: s.entities }),
+        /* @__PURE__ */ jsx("div", { children: brief.entities.map((e, i) => /* @__PURE__ */ jsx("span", { style: chip, children: e }, i)) })
+      ] }),
+      brief.questions.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("div", { style: h4, children: s.questions }),
+        /* @__PURE__ */ jsx("ul", { style: { margin: 0, paddingLeft: 18, fontSize: 13, color: C9.text, lineHeight: 1.6 }, children: brief.questions.map((q, i) => /* @__PURE__ */ jsx("li", { children: q }, i)) })
+      ] }),
+      brief.internalLinkIdeas.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("div", { style: h4, children: s.links }),
+        /* @__PURE__ */ jsx("div", { children: brief.internalLinkIdeas.map((l, i) => /* @__PURE__ */ jsx("span", { style: chip, children: l }, i)) })
+      ] }),
+      brief.notes.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("div", { style: h4, children: s.notes }),
+        /* @__PURE__ */ jsx("ul", { style: { margin: 0, paddingLeft: 18, fontSize: 12, color: C9.sub, lineHeight: 1.6 }, children: brief.notes.map((n, i) => /* @__PURE__ */ jsx("li", { children: n }, i)) })
+      ] })
+    ] })
+  ] });
+}
 var V9 = {
   text: "var(--theme-text, #1a1a1a)",
   textSecondary: "var(--theme-elevation-600, #6b7280)",
@@ -18831,6 +19077,7 @@ function KeywordResearchView() {
             ]
           }
         ),
+        /* @__PURE__ */ jsx(ContentBriefPanel, { locale }),
         /* @__PURE__ */ jsx(
           "div",
           {
@@ -19605,7 +19852,7 @@ var controlBtnStyle = {
   cursor: "pointer",
   lineHeight: 1.4
 };
-var C9 = {
+var C10 = {
   cyan: "#00E5FF",
   black: "#000",
   green: "#22c55e",
@@ -19620,10 +19867,10 @@ var C9 = {
 var TITLE_MIN = 30;
 var TITLE_MAX = 60;
 function getCharColor(len) {
-  if (len === 0) return C9.textSecondary;
-  if (len >= TITLE_MIN && len <= TITLE_MAX) return C9.green;
-  if (len > 0 && len < TITLE_MIN) return C9.orange;
-  return C9.red;
+  if (len === 0) return C10.textSecondary;
+  if (len >= TITLE_MIN && len <= TITLE_MAX) return C10.green;
+  if (len > 0 && len < TITLE_MIN) return C10.orange;
+  return C10.red;
 }
 function getProgressPercent(len) {
   if (len === 0) return 0;
@@ -19631,9 +19878,9 @@ function getProgressPercent(len) {
 }
 function getProgressColor(len) {
   if (len === 0) return "var(--theme-elevation-200, #e5e7eb)";
-  if (len >= TITLE_MIN && len <= TITLE_MAX) return C9.green;
-  if (len < TITLE_MIN) return C9.orange;
-  return C9.red;
+  if (len >= TITLE_MIN && len <= TITLE_MAX) return C10.green;
+  if (len < TITLE_MIN) return C10.orange;
+  return C10.red;
 }
 function MetaTitleField({
   path,
@@ -19704,7 +19951,7 @@ function MetaTitleField({
                   style: {
                     fontSize: 13,
                     fontWeight: 700,
-                    color: C9.textPrimary
+                    color: C10.textPrimary
                   },
                   children: t.metaTitle.label
                 }
@@ -19744,9 +19991,9 @@ function MetaTitleField({
                 fontSize: 14,
                 fontFamily: "inherit",
                 borderRadius: 8,
-                border: `2px solid ${C9.border}`,
-                backgroundColor: C9.surfaceBg,
-                color: C9.textPrimary,
+                border: `2px solid ${C10.border}`,
+                backgroundColor: C10.surfaceBg,
+                color: C10.textPrimary,
                 outline: "none",
                 boxShadow: "2px 2px 0 0 var(--theme-border-color, rgba(0,0,0,1))"
               }
@@ -19764,9 +20011,9 @@ function MetaTitleField({
                 gap: 5,
                 padding: "8px 14px",
                 borderRadius: 8,
-                border: `2px solid ${C9.border}`,
-                backgroundColor: loading ? C9.surface50 : C9.cyan,
-                color: loading ? C9.textSecondary : C9.black,
+                border: `2px solid ${C10.border}`,
+                backgroundColor: loading ? C10.surface50 : C10.cyan,
+                color: loading ? C10.textSecondary : C10.black,
                 fontWeight: 800,
                 fontSize: 11,
                 textTransform: "uppercase",
@@ -19813,7 +20060,7 @@ function MetaTitleField({
               justifyContent: "space-between",
               marginTop: 4,
               fontSize: 10,
-              color: C9.textSecondary
+              color: C10.textSecondary
             },
             children: [
               /* @__PURE__ */ jsxs("span", { children: [
@@ -19847,9 +20094,9 @@ function MetaTitleField({
               borderRadius: 6,
               fontSize: 11,
               fontWeight: 600,
-              color: C9.red,
+              color: C10.red,
               backgroundColor: "rgba(239,68,68,0.08)",
-              border: `1px solid ${C9.red}`
+              border: `1px solid ${C10.red}`
             },
             children: error
           }
@@ -19858,7 +20105,7 @@ function MetaTitleField({
     }
   );
 }
-var C10 = {
+var C11 = {
   cyan: "#00E5FF",
   black: "#000",
   green: "#22c55e",
@@ -19873,10 +20120,10 @@ var C10 = {
 var DESC_MIN = 120;
 var DESC_MAX = 160;
 function getCharColor2(len) {
-  if (len === 0) return C10.textSecondary;
-  if (len >= DESC_MIN && len <= DESC_MAX) return C10.green;
-  if (len > 0 && len < DESC_MIN) return C10.orange;
-  return C10.red;
+  if (len === 0) return C11.textSecondary;
+  if (len >= DESC_MIN && len <= DESC_MAX) return C11.green;
+  if (len > 0 && len < DESC_MIN) return C11.orange;
+  return C11.red;
 }
 function getProgressPercent2(len) {
   if (len === 0) return 0;
@@ -19884,9 +20131,9 @@ function getProgressPercent2(len) {
 }
 function getProgressColor2(len) {
   if (len === 0) return "var(--theme-elevation-200, #e5e7eb)";
-  if (len >= DESC_MIN && len <= DESC_MAX) return C10.green;
-  if (len < DESC_MIN) return C10.orange;
-  return C10.red;
+  if (len >= DESC_MIN && len <= DESC_MAX) return C11.green;
+  if (len < DESC_MIN) return C11.orange;
+  return C11.red;
 }
 function MetaDescriptionField({
   path,
@@ -19957,7 +20204,7 @@ function MetaDescriptionField({
                   style: {
                     fontSize: 13,
                     fontWeight: 700,
-                    color: C10.textPrimary
+                    color: C11.textPrimary
                   },
                   children: t.metaDescription.label
                 }
@@ -19997,9 +20244,9 @@ function MetaDescriptionField({
                 fontSize: 14,
                 fontFamily: "inherit",
                 borderRadius: 8,
-                border: `2px solid ${C10.border}`,
-                backgroundColor: C10.surfaceBg,
-                color: C10.textPrimary,
+                border: `2px solid ${C11.border}`,
+                backgroundColor: C11.surfaceBg,
+                color: C11.textPrimary,
                 outline: "none",
                 resize: "vertical",
                 lineHeight: 1.5,
@@ -20019,9 +20266,9 @@ function MetaDescriptionField({
                 gap: 5,
                 padding: "8px 14px",
                 borderRadius: 8,
-                border: `2px solid ${C10.border}`,
-                backgroundColor: loading ? C10.surface50 : C10.cyan,
-                color: loading ? C10.textSecondary : C10.black,
+                border: `2px solid ${C11.border}`,
+                backgroundColor: loading ? C11.surface50 : C11.cyan,
+                color: loading ? C11.textSecondary : C11.black,
                 fontWeight: 800,
                 fontSize: 11,
                 textTransform: "uppercase",
@@ -20069,7 +20316,7 @@ function MetaDescriptionField({
               justifyContent: "space-between",
               marginTop: 4,
               fontSize: 10,
-              color: C10.textSecondary
+              color: C11.textSecondary
             },
             children: [
               /* @__PURE__ */ jsxs("span", { children: [
@@ -20103,9 +20350,9 @@ function MetaDescriptionField({
               borderRadius: 6,
               fontSize: 11,
               fontWeight: 600,
-              color: C10.red,
+              color: C11.red,
               backgroundColor: "rgba(239,68,68,0.08)",
-              border: `1px solid ${C10.red}`
+              border: `1px solid ${C11.red}`
             },
             children: error
           }
@@ -20114,7 +20361,7 @@ function MetaDescriptionField({
     }
   );
 }
-var C11 = {
+var C12 = {
   cyan: "#00E5FF",
   black: "#000",
   white: "#fff",
@@ -20191,8 +20438,8 @@ function MetaImageField({
               gap: 10,
               padding: "10px 14px",
               borderRadius: 8,
-              border: `2px solid ${C11.border}`,
-              backgroundColor: C11.surfaceBg,
+              border: `2px solid ${C12.border}`,
+              backgroundColor: C12.surfaceBg,
               boxShadow: "2px 2px 0 0 var(--theme-border-color, rgba(0,0,0,1))"
             },
             children: [
@@ -20211,7 +20458,7 @@ function MetaImageField({
                       fontWeight: 900,
                       backgroundColor: hasImage ? "rgba(34,197,94,0.15)" : "rgba(255,138,0,0.15)",
                       color: hasImage ? "#16a34a" : "#d97706",
-                      border: `1px solid ${hasImage ? C11.green : C11.orange}`
+                      border: `1px solid ${hasImage ? C12.green : C12.orange}`
                     },
                     children: hasImage ? "\u2713" : "!"
                   }
@@ -20223,7 +20470,7 @@ function MetaImageField({
                       style: {
                         fontSize: 12,
                         fontWeight: 700,
-                        color: C11.textPrimary
+                        color: C12.textPrimary
                       },
                       children: t.metaImage.label
                     }
@@ -20233,7 +20480,7 @@ function MetaImageField({
                     {
                       style: {
                         fontSize: 10,
-                        color: C11.textSecondary,
+                        color: C12.textSecondary,
                         lineHeight: 1.4
                       },
                       children: hasImage ? t.metaImage.imageSet : t.metaImage.noImage
@@ -20253,9 +20500,9 @@ function MetaImageField({
                     gap: 5,
                     padding: "8px 14px",
                     borderRadius: 8,
-                    border: `2px solid ${C11.border}`,
-                    backgroundColor: loading ? C11.surface50 : success ? C11.green : C11.cyan,
-                    color: loading ? C11.textSecondary : success ? C11.white : C11.black,
+                    border: `2px solid ${C12.border}`,
+                    backgroundColor: loading ? C12.surface50 : success ? C12.green : C12.cyan,
+                    color: loading ? C12.textSecondary : success ? C12.white : C12.black,
                     fontWeight: 800,
                     fontSize: 11,
                     textTransform: "uppercase",
@@ -20282,9 +20529,9 @@ function MetaImageField({
               borderRadius: 6,
               fontSize: 11,
               fontWeight: 600,
-              color: C11.red,
+              color: C12.red,
               backgroundColor: "rgba(239,68,68,0.08)",
-              border: `1px solid ${C11.red}`
+              border: `1px solid ${C12.red}`
             },
             children: error
           }
@@ -20293,7 +20540,7 @@ function MetaImageField({
     }
   );
 }
-var C12 = {
+var C13 = {
   black: "#000",
   white: "#fff",
   green: "#22c55e",
@@ -20307,15 +20554,15 @@ var C12 = {
 function getCompletenessColor(count) {
   switch (count) {
     case 0:
-      return C12.red;
+      return C13.red;
     case 1:
-      return C12.orange;
+      return C13.orange;
     case 2:
-      return C12.yellow;
+      return C13.yellow;
     case 3:
-      return C12.green;
+      return C13.green;
     default:
-      return C12.textSecondary;
+      return C13.textSecondary;
   }
 }
 function getCompletenessLabel(count, ov) {
@@ -20373,8 +20620,8 @@ function OverviewField({
         fontFamily: "var(--font-body, Inter, system-ui, sans-serif)",
         padding: "12px 14px",
         borderRadius: 10,
-        border: `2px solid ${C12.border}`,
-        backgroundColor: C12.surfaceBg,
+        border: `2px solid ${C13.border}`,
+        backgroundColor: C13.surfaceBg,
         boxShadow: "3px 3px 0 0 var(--theme-border-color, rgba(0,0,0,1))",
         marginBottom: 12
       },
@@ -20397,7 +20644,7 @@ function OverviewField({
                     fontWeight: 800,
                     textTransform: "uppercase",
                     letterSpacing: "0.04em",
-                    color: C12.textPrimary
+                    color: C13.textPrimary
                   },
                   children: t.overview.metaCompleteness
                 }
@@ -20412,8 +20659,8 @@ function OverviewField({
                     fontSize: 11,
                     fontWeight: 800,
                     backgroundColor: completenessColor,
-                    color: completenessColor === C12.yellow ? C12.black : C12.white,
-                    border: `2px solid ${C12.border}`,
+                    color: completenessColor === C13.yellow ? C13.black : C13.white,
+                    border: `2px solid ${C13.border}`,
                     textTransform: "uppercase",
                     letterSpacing: "0.03em"
                   },
@@ -20511,7 +20758,7 @@ function OverviewField({
                       style: {
                         fontSize: 12,
                         fontWeight: 600,
-                        color: item.filled ? C12.textPrimary : C12.textSecondary
+                        color: item.filled ? C13.textPrimary : C13.textSecondary
                       },
                       children: item.label
                     }
@@ -20523,7 +20770,7 @@ function OverviewField({
                         marginLeft: "auto",
                         fontSize: 10,
                         fontWeight: 700,
-                        color: item.filled ? C12.green : C12.red,
+                        color: item.filled ? C13.green : C13.red,
                         textTransform: "uppercase",
                         letterSpacing: "0.03em"
                       },
@@ -20540,7 +20787,7 @@ function OverviewField({
     }
   );
 }
-var C13 = {
+var C14 = {
   cyan: "#00E5FF",
   black: "#000",
   white: "#fff",
@@ -20559,10 +20806,10 @@ var G = {
   descGrey: "#4d5156",
   faviconBg: "#e8eaed"};
 function charCountColor2(len, min, max) {
-  if (len >= min && len <= max) return C13.green;
-  if (len > 0 && len < min) return C13.orange;
-  if (len > max) return C13.red;
-  return C13.textSecondary;
+  if (len >= min && len <= max) return C14.green;
+  if (len > 0 && len < min) return C14.orange;
+  if (len > max) return C14.red;
+  return C14.textSecondary;
 }
 function truncateText(text, maxChars) {
   if (text.length <= maxChars) return text;
@@ -20617,8 +20864,8 @@ function SerpPreview({
           padding: "10px 12px",
           cursor: "pointer",
           borderRadius: 8,
-          border: `2px solid ${C13.border}`,
-          backgroundColor: C13.surface50,
+          border: `2px solid ${C14.border}`,
+          backgroundColor: C14.surface50,
           userSelect: "none"
         },
         children: [
@@ -20633,7 +20880,7 @@ function SerpPreview({
                 fontWeight: 800,
                 textTransform: "uppercase",
                 letterSpacing: "0.04em",
-                color: C13.textPrimary
+                color: C14.textPrimary
               },
               children: [
                 /* @__PURE__ */ jsxs(
@@ -20665,7 +20912,7 @@ function SerpPreview({
                 transition: "transform 0.2s",
                 display: "inline-block",
                 transform: open ? "rotate(90deg)" : "none",
-                color: C13.textSecondary
+                color: C14.textSecondary
               },
               children: "\u25B6"
             }
@@ -20698,10 +20945,10 @@ function SerpPreview({
         "div",
         {
           style: {
-            backgroundColor: C13.white,
-            border: `2px solid ${C13.border}`,
+            backgroundColor: C14.white,
+            border: `2px solid ${C14.border}`,
             borderRadius: 12,
-            boxShadow: `3px 3px 0 0 ${C13.border}`,
+            boxShadow: `3px 3px 0 0 ${C14.border}`,
             padding: isDesktop ? 20 : 14,
             maxWidth: isDesktop ? 650 : 380,
             overflow: "hidden"
@@ -20764,7 +21011,7 @@ function SerpPreview({
                         style: {
                           fontSize: 14,
                           fontWeight: 400,
-                          color: C13.black,
+                          color: C14.black,
                           lineHeight: 1.3,
                           whiteSpace: "nowrap",
                           overflow: "hidden",
@@ -20828,7 +21075,7 @@ function SerpPreview({
                   "span",
                   {
                     style: {
-                      color: C13.textSecondary,
+                      color: C14.textSecondary,
                       fontStyle: "italic",
                       fontSize: titleFontSize - 2
                     },
@@ -20857,7 +21104,7 @@ function SerpPreview({
                   "span",
                   {
                     style: {
-                      color: C13.textSecondary,
+                      color: C14.textSecondary,
                       fontStyle: "italic",
                       fontSize: descFontSize - 1
                     },
@@ -20890,7 +21137,7 @@ function SerpPreview({
                   fontSize: 11
                 },
                 children: [
-                  /* @__PURE__ */ jsx("span", { style: { color: C13.textSecondary, fontWeight: 600 }, children: t.serpPreview.previewTitle }),
+                  /* @__PURE__ */ jsx("span", { style: { color: C14.textSecondary, fontWeight: 600 }, children: t.serpPreview.previewTitle }),
                   /* @__PURE__ */ jsxs(
                     "span",
                     {
@@ -20919,7 +21166,7 @@ function SerpPreview({
                   fontSize: 11
                 },
                 children: [
-                  /* @__PURE__ */ jsx("span", { style: { color: C13.textSecondary, fontWeight: 600 }, children: t.serpPreview.previewDescription }),
+                  /* @__PURE__ */ jsx("span", { style: { color: C14.textSecondary, fontWeight: 600 }, children: t.serpPreview.previewDescription }),
                   /* @__PURE__ */ jsxs(
                     "span",
                     {
@@ -20948,14 +21195,14 @@ function SerpPreview({
                   fontSize: 11
                 },
                 children: [
-                  /* @__PURE__ */ jsx("span", { style: { color: C13.textSecondary, fontWeight: 600 }, children: t.serpPreview.url }),
+                  /* @__PURE__ */ jsx("span", { style: { color: C14.textSecondary, fontWeight: 600 }, children: t.serpPreview.url }),
                   /* @__PURE__ */ jsxs(
                     "span",
                     {
                       style: {
                         fontWeight: 700,
                         fontVariantNumeric: "tabular-nums",
-                        color: fullUrl.length <= 75 ? C13.green : C13.red
+                        color: fullUrl.length <= 75 ? C14.green : C14.red
                       },
                       children: [
                         fullUrl.length,
@@ -20990,13 +21237,13 @@ function DeviceButton({
         gap: 5,
         padding: "4px 12px",
         borderRadius: 6,
-        border: `2px solid ${C13.border}`,
+        border: `2px solid ${C14.border}`,
         fontSize: 11,
         fontWeight: 700,
         cursor: "pointer",
-        backgroundColor: active ? C13.cyan : C13.surfaceBg,
-        color: active ? C13.black : C13.textPrimary,
-        boxShadow: active ? `2px 2px 0 0 ${C13.border}` : "none",
+        backgroundColor: active ? C14.cyan : C14.surfaceBg,
+        color: active ? C14.black : C14.textPrimary,
+        boxShadow: active ? `2px 2px 0 0 ${C14.border}` : "none",
         transition: "background-color 0.15s"
       },
       children: [