GitHub GitFut

Adds GitFut scouting cards on GitHub profiles and avatar hovercards
Fra og med 16.07.2026. Se den nyeste version.
Visit the author's site for support, ask a question, post a review, or report the script.
Wrap lines
// ==UserScript==
// @name              GitHub GitFut
// @name:ru           GitHub GitFut
// @name:zh-CN        GitHub GitFut
// @name:es           GitHub GitFut
// @name:pt-BR        GitHub GitFut
// @name:de           GitHub GitFut
// @name:fr           GitHub GitFut
// @name:ja           GitHub GitFut
// @name:ko           GitHub GitFut
// @name:pl           GitHub GitFut
// @namespace         https://github.com/NemoKing1210/github-gitfut
// @version           1.9.0
// @description       Adds GitFut scouting cards on GitHub profiles and avatar hovercards
// @description:ru    Добавляет карточки GitFut на профили GitHub и в поповеры аватаров
// @description:zh-CN 在 GitHub 个人资料页与头像悬停卡片中显示 GitFut 球探信息
// @description:es    Añade cartas GitFut en perfiles y hovercards de avatar de GitHub
// @description:pt-BR  Adiciona cartas GitFut nos perfis e hovercards de avatar do GitHub
// @description:de     Zeigt GitFut-Karten auf GitHub-Profilen und Avatar-Hovercards
// @description:fr     Ajoute les cartes GitFut sur les profils et hovercards d’avatar GitHub
// @description:ja     GitHubプロフィールとアバターホバーカードにGitFut情報を表示
// @description:ko     GitHub 프로필과 아바타 호버카드에 GitFut 스카우트 정보를 표시
// @description:pl     Dodaje karty GitFut na profilach i hovercardach awatarów GitHub
// @author             NemoKing1210
// @tag                github
// @tag                gitfut
// @homepageURL        https://github.com/NemoKing1210/github-gitfut
// @supportURL         https://github.com/NemoKing1210/github-gitfut/issues
// @license            MIT
// @icon               https://gitfut.com/favicon.ico
// @match              https://github.com/*
// @match              https://gist.github.com/*
// @grant              GM_xmlhttpRequest
// @grant              GM_getValue
// @grant              GM_setValue
// @grant              GM_addStyle
// @grant              GM_registerMenuCommand
// @connect            gitfut.com
// @run-at             document-idle
// @noframes
// ==/UserScript==

(function () {
  'use strict';

  const API_BASE = 'https://gitfut.com/api/card';
  const SITE_BASE = 'https://gitfut.com';
  const REPO_URL = 'https://github.com/NemoKing1210/github-gitfut';
  const CACHE_KEY = 'gf_github_cache_v1';
  const SETTINGS_KEY = 'gf_github_settings';
  /** Soft budget for cache progress UI (GM storage itself may allow more). */
  const CACHE_BUDGET_BYTES = 5 * 1024 * 1024;
  /** Fallback if GM_info is unavailable — keep in sync with @version. */
  const SCRIPT_VERSION =
    (typeof GM_info !== 'undefined' && GM_info?.script?.version) || '1.9.0';
  const CACHE_HOURS_MAX = 168;
  const DEFAULT_SETTINGS = {
    cacheHours: 12,
    showHovercard: true,
    cardTheme: 'standard',
    locale: 'auto',
  };
  const CARD_THEMES = ['standard', 'github', 'fifa', 'neon'];
  const MAX_CONCURRENT = 2;
  const REQUEST_DELAY_MS = 100;
  const CACHE_PERSIST_MS = 1000;
  const SCAN_DEBOUNCE_MS = 400;
  const PANEL_ID = 'gf-profile-panel';
  const HOVERCARD_BLOCK_ID = 'gf-hovercard-block';

  const RESERVED_PATHS = new Set([
    'about', 'account', 'actions', 'apps', 'blog', 'cache', 'codespaces', 'collections',
    'contact', 'copilot', 'customer', 'dashboard', 'developer', 'discussions', 'docs',
    'education', 'enterprise', 'events', 'explore', 'features', 'files', 'funding',
    'gist', 'home', 'issues', 'join', 'login', 'logout', 'marketplace', 'mcp',
    'new', 'notifications', 'organizations', 'orgs', 'packages', 'pages', 'pricing',
    'pulls', 'readme', 'search', 'security', 'sessions', 'settings', 'site', 'sponsors',
    'stars', 'topics', 'trending', 'users', 'watching', 'workflows',
  ]);

  const FINISH_COLORS = {
    bronze: {
      accent: '#CD7F32',
      ink: '#2A1A0C',
      soft: 'rgba(205,127,50,0.16)',
      glow: 'rgba(205,127,50,0.28)',
      deep: '#5a3412',
      shine: 'rgba(255,198,120,0.45)',
      tier: 1,
    },
    silver: {
      accent: '#AAB2BD',
      ink: '#1F242B',
      soft: 'rgba(170,178,189,0.2)',
      glow: 'rgba(180,190,205,0.4)',
      deep: '#3a4250',
      shine: 'rgba(255,255,255,0.55)',
      tier: 2,
    },
    gold: {
      accent: '#E6B422',
      ink: '#3A2806',
      soft: 'rgba(230,180,34,0.22)',
      glow: 'rgba(230,180,34,0.55)',
      deep: '#7a5608',
      shine: 'rgba(255,236,160,0.7)',
      tier: 3,
    },
    totw: {
      accent: '#E03E52',
      ink: '#4A0A14',
      soft: 'rgba(224,62,82,0.2)',
      glow: 'rgba(224,62,82,0.55)',
      deep: '#6a1020',
      shine: 'rgba(255,140,160,0.65)',
      tier: 4,
    },
    toty: {
      accent: '#3B7AFF',
      ink: '#10254F',
      soft: 'rgba(59,122,255,0.22)',
      glow: 'rgba(59,122,255,0.6)',
      deep: '#0a1f5c',
      shine: 'rgba(160,200,255,0.75)',
      tier: 5,
    },
    icon: {
      accent: '#F3D688',
      ink: '#2A1A45',
      soft: 'rgba(243,214,136,0.24)',
      glow: 'rgba(180,120,255,0.55)',
      deep: '#3a1a70',
      shine: 'rgba(255,240,200,0.85)',
      tier: 6,
    },
    founder: {
      accent: '#FF5A7A',
      ink: '#3A0A18',
      soft: 'rgba(255,90,122,0.22)',
      glow: 'rgba(255,90,122,0.6)',
      deep: '#5a1028',
      shine: 'rgba(255,180,200,0.8)',
      tier: 7,
    },
  };
  const FINISH_KEYS = Object.keys(FINISH_COLORS);
  const FINISH_CLASS_RE = /^gf-(?:hc|panel)-finish--/;

  const STAT_ORDER = [
    ['pac', 'PAC'],
    ['sho', 'SHO'],
    ['pas', 'PAS'],
    ['dri', 'DRI'],
    ['def', 'DEF'],
    ['phy', 'PHY'],
  ];

  const SUPPORTED_LOCALES = ['en', 'ru', 'zh', 'es', 'pt', 'de', 'fr', 'ja', 'ko', 'pl'];

  /** Native labels for the language picker (not translated per UI locale). */
  const LOCALE_NATIVE_NAMES = {
    en: 'English',
    ru: 'Русский',
    zh: '中文',
    es: 'Español',
    pt: 'Português',
    de: 'Deutsch',
    fr: 'Français',
    ja: '日本語',
    ko: '한국어',
    pl: 'Polski',
  };

  const TRANSLATIONS = {
    en: {
      loading: 'Scouting…',
      loadError: 'Scout failed',
      notFound: 'Not scouted',
      overall: 'OVR',
      position: 'POS',
      finish: 'Finish',
      archetype: 'Archetype',
      language: 'Language',
      playstyles: 'Playstyles',
      metrics: 'Scouting metrics',
      openReport: 'Open full scout report',
      duel: 'Duel a rival',
      menuSettings: 'GitHub GitFut — Settings',
      navMenuItem: 'GitFut settings',
      panelTitle: 'GitFut',
      panelSubtitle: 'Scouting · cache · display',
      close: 'Close',
      cancel: 'Cancel',
      save: 'Save',
      saveReload: 'Save & Reload page',
      sectionDisplay: 'Display',
      uiLanguage: 'Language',
      uiLanguageHint: 'Language for GitFut panels, hovercards, and settings. Auto follows the browser.',
      uiLanguageAuto: 'Auto (browser)',
      sectionCache: 'Cache',
      showHovercard: 'Show GitFut in avatar hovercards',
      showHovercardHint: 'Injects OVR, position, and stats into GitHub’s user popover on avatar hover.',
      cardTheme: 'Card style',
      cardThemeHint: 'Standard, GitHub (subtle Primer look), FIFA (metallic), or Neon (glow).',
      cardThemeStandard: 'Standard',
      cardThemeGithub: 'GitHub',
      cardThemeFifa: 'FIFA',
      cardThemeNeon: 'Neon',
      on: 'ON',
      off: 'OFF',
      cacheHours: 'Cache duration (hours)',
      cacheHoursHint: 'How long to reuse GitFut API results. 0 disables cache.',
      clearCache: 'Clear cache',
      cacheCleared: 'Cache cleared ({count})',
      cacheEmpty: 'Cache is empty',
      cacheClearHint: 'Removes all stored GitFut lookups from this browser profile.',
      version: 'Version {version}',
      cacheCards: '{count} cards cached',
      cacheStorage: '{used} used · {free} free',
      cacheStorageHint: 'Local card-cache size vs a soft {budget} budget.',
      repoLink: 'GitHub',
      repoAbout: 'Source code, updates, and issue reports',
      skillMoves: 'Skill moves',
      weakFoot: 'Weak foot',
      workRate: 'Work rate',
      style: 'Style',
    },
    ru: {
      loading: 'Скаутинг…',
      loadError: 'Ошибка скаутинга',
      notFound: 'Нет карточки',
      overall: 'OVR',
      position: 'ПОЗ',
      finish: 'Тир',
      archetype: 'Архетип',
      language: 'Язык',
      playstyles: 'Стили',
      metrics: 'Метрики скаутинга',
      openReport: 'Открыть полный отчёт',
      duel: 'Дуэль с соперником',
      menuSettings: 'GitHub GitFut — Настройки',
      navMenuItem: 'Настройки GitFut',
      panelTitle: 'GitFut',
      panelSubtitle: 'Скаутинг · кэш · отображение',
      close: 'Закрыть',
      cancel: 'Отмена',
      save: 'Сохранить',
      saveReload: 'Сохранить и перезагрузить',
      sectionDisplay: 'Отображение',
      uiLanguage: 'Язык',
      uiLanguageHint: 'Язык панелей GitFut, hovercard и настроек. Авто — как в браузере.',
      uiLanguageAuto: 'Авто (браузер)',
      sectionCache: 'Кэш',
      showHovercard: 'GitFut в поповере аватара',
      showHovercardHint: 'Добавляет OVR, позицию и статы в нативный hovercard GitHub при наведении на аватар.',
      cardTheme: 'Оформление карточек',
      cardThemeHint: 'Стандартный, GitHub (спокойный Primer), FIFA (металл) или Неон (свечение).',
      cardThemeStandard: 'Стандартный вид',
      cardThemeGithub: 'GitHub',
      cardThemeFifa: 'FIFA',
      cardThemeNeon: 'Неон',
      on: 'ВКЛ',
      off: 'ВЫКЛ',
      cacheHours: 'Время кэша (часы)',
      cacheHoursHint: 'Как долго переиспользовать ответы API. 0 отключает кэш.',
      clearCache: 'Очистить кэш',
      cacheCleared: 'Кэш очищен ({count})',
      cacheEmpty: 'Кэш пуст',
      cacheClearHint: 'Удаляет все сохранённые запросы GitFut в этом профиле браузера.',
      version: 'Версия {version}',
      cacheCards: 'Карточек в кэше: {count}',
      cacheStorage: '{used} занято · {free} свободно',
      cacheStorageHint: 'Размер локального кэша карточек относительно лимита {budget}.',
      repoLink: 'GitHub',
      repoAbout: 'Исходники, обновления и баг-репорты',
      skillMoves: 'Финты',
      weakFoot: 'Слабая нога',
      workRate: 'Работоспособность',
      style: 'Стиль',
    },
    zh: {
      loading: '球探中…',
      loadError: '球探失败',
      notFound: '无卡片',
      overall: 'OVR',
      position: '位置',
      finish: '品质',
      archetype: '原型',
      language: '语言',
      playstyles: '风格',
      metrics: '球探指标',
      openReport: '打开完整报告',
      duel: '对决对手',
      menuSettings: 'GitHub GitFut — 设置',
      navMenuItem: 'GitFut 设置',
      panelTitle: 'GitFut',
      panelSubtitle: '球探 · 缓存 · 显示',
      close: '关闭',
      cancel: '取消',
      save: '保存',
      saveReload: '保存并刷新',
      sectionDisplay: '显示',
      uiLanguage: '语言',
      uiLanguageHint: 'GitFut 面板、悬停卡片与设置的界面语言。自动跟随浏览器。',
      uiLanguageAuto: '自动（浏览器）',
      sectionCache: '缓存',
      showHovercard: '在头像悬停卡片中显示 GitFut',
      showHovercardHint: '悬停头像时在 GitHub 用户弹层中注入 OVR、位置与属性。',
      cardTheme: '卡片样式',
      cardThemeHint: '资料页与悬停卡片球探面板的视觉风格。',
      cardThemeStandard: '标准',
      cardThemeGithub: 'GitHub',
      cardThemeFifa: 'FIFA',
      cardThemeNeon: '霓虹',
      on: '开',
      off: '关',
      cacheHours: '缓存时长（小时）',
      cacheHoursHint: '复用 API 结果的时长。0 禁用缓存。',
      clearCache: '清空缓存',
      cacheCleared: '已清空 ({count})',
      cacheEmpty: '缓存为空',
      cacheClearHint: '删除本浏览器配置中保存的 GitFut 查询。',
      version: '版本 {version}',
      cacheCards: '已缓存 {count} 张',
      cacheStorage: '已用 {used} · 剩余 {free}',
      cacheStorageHint: '本地卡片缓存相对软上限 {budget}。',
      repoLink: 'GitHub',
      repoAbout: '源码、更新与问题反馈',
      skillMoves: '花式',
      weakFoot: '逆足',
      workRate: '积极性',
      style: '风格',
    },
    es: {
      loading: 'Scouting…',
      loadError: 'Scout fallido',
      notFound: 'Sin carta',
      overall: 'OVR',
      position: 'POS',
      finish: 'Acabado',
      archetype: 'Arquetipo',
      language: 'Lenguaje',
      playstyles: 'Estilos',
      metrics: 'Métricas',
      openReport: 'Abrir informe completo',
      duel: 'Duelo',
      menuSettings: 'GitHub GitFut — Ajustes',
      navMenuItem: 'Ajustes de GitFut',
      panelTitle: 'GitFut',
      panelSubtitle: 'Scouting · caché · pantalla',
      close: 'Cerrar',
      cancel: 'Cancelar',
      save: 'Guardar',
      saveReload: 'Guardar y recargar',
      sectionDisplay: 'Pantalla',
      uiLanguage: 'Idioma',
      uiLanguageHint: 'Idioma de paneles GitFut, hovercards y ajustes. Auto sigue el navegador.',
      uiLanguageAuto: 'Auto (navegador)',
      sectionCache: 'Caché',
      showHovercard: 'Mostrar GitFut en hovercards de avatar',
      showHovercardHint: 'Inyecta OVR, posición y stats en el popover nativo de GitHub.',
      cardTheme: 'Estilo de carta',
      cardThemeHint: 'Acabado visual del panel en perfil y hovercard.',
      cardThemeStandard: 'Estándar',
      cardThemeGithub: 'GitHub',
      cardThemeFifa: 'FIFA',
      cardThemeNeon: 'Neón',
      on: 'ON',
      off: 'OFF',
      cacheHours: 'Duración de caché (horas)',
      cacheHoursHint: 'Cuánto reutilizar resultados de la API. 0 desactiva.',
      clearCache: 'Vaciar caché',
      cacheCleared: 'Caché vaciada ({count})',
      cacheEmpty: 'Caché vacía',
      cacheClearHint: 'Elimina búsquedas GitFut de este perfil.',
      version: 'Versión {version}',
      cacheCards: '{count} cartas en caché',
      cacheStorage: '{used} usados · {free} libres',
      cacheStorageHint: 'Tamaño de la caché local frente a un tope blando de {budget}.',
      repoLink: 'GitHub',
      repoAbout: 'Código, actualizaciones e issues',
      skillMoves: 'Regates',
      weakFoot: 'Pie malo',
      workRate: 'Trabajo',
      style: 'Estilo',
    },
    pt: {
      loading: 'Scouting…',
      loadError: 'Scout falhou',
      notFound: 'Sem carta',
      overall: 'OVR',
      position: 'POS',
      finish: 'Acabamento',
      archetype: 'Arquétipo',
      language: 'Linguagem',
      playstyles: 'Estilos',
      metrics: 'Métricas',
      openReport: 'Abrir relatório completo',
      duel: 'Duelo',
      menuSettings: 'GitHub GitFut — Configurações',
      navMenuItem: 'Configurações do GitFut',
      panelTitle: 'GitFut',
      panelSubtitle: 'Scouting · cache · exibição',
      close: 'Fechar',
      cancel: 'Cancelar',
      save: 'Salvar',
      saveReload: 'Salvar e recarregar',
      sectionDisplay: 'Exibição',
      uiLanguage: 'Idioma',
      uiLanguageHint: 'Idioma dos painéis GitFut, hovercards e configurações. Auto segue o navegador.',
      uiLanguageAuto: 'Auto (navegador)',
      sectionCache: 'Cache',
      showHovercard: 'Mostrar GitFut nos hovercards de avatar',
      showHovercardHint: 'Injeta OVR, posição e stats no popover nativo do GitHub.',
      cardTheme: 'Estilo da carta',
      cardThemeHint: 'Visual do painel no perfil e no hovercard.',
      cardThemeStandard: 'Padrão',
      cardThemeGithub: 'GitHub',
      cardThemeFifa: 'FIFA',
      cardThemeNeon: 'Neon',
      on: 'ON',
      off: 'OFF',
      cacheHours: 'Duração do cache (horas)',
      cacheHoursHint: 'Por quanto tempo reutilizar a API. 0 desativa.',
      clearCache: 'Limpar cache',
      cacheCleared: 'Cache limpo ({count})',
      cacheEmpty: 'Cache vazio',
      cacheClearHint: 'Remove buscas GitFut deste perfil.',
      version: 'Versão {version}',
      cacheCards: '{count} cartas em cache',
      cacheStorage: '{used} usados · {free} livres',
      cacheStorageHint: 'Tamanho do cache local vs orçamento suave de {budget}.',
      repoLink: 'GitHub',
      repoAbout: 'Código, atualizações e issues',
      skillMoves: 'Habilidades',
      weakFoot: 'Pé fraco',
      workRate: 'Dedicação',
      style: 'Estilo',
    },
    de: {
      loading: 'Scouting…',
      loadError: 'Scout fehlgeschlagen',
      notFound: 'Keine Karte',
      overall: 'OVR',
      position: 'POS',
      finish: 'Finish',
      archetype: 'Archetyp',
      language: 'Sprache',
      playstyles: 'Spielstile',
      metrics: 'Scout-Metriken',
      openReport: 'Vollen Bericht öffnen',
      duel: 'Duell',
      menuSettings: 'GitHub GitFut — Einstellungen',
      navMenuItem: 'GitFut-Einstellungen',
      panelTitle: 'GitFut',
      panelSubtitle: 'Scouting · Cache · Anzeige',
      close: 'Schließen',
      cancel: 'Abbrechen',
      save: 'Speichern',
      saveReload: 'Speichern & neu laden',
      sectionDisplay: 'Anzeige',
      uiLanguage: 'Sprache',
      uiLanguageHint: 'Sprache für GitFut-Panels, Hovercards und Einstellungen. Auto folgt dem Browser.',
      uiLanguageAuto: 'Auto (Browser)',
      sectionCache: 'Cache',
      showHovercard: 'GitFut in Avatar-Hovercards zeigen',
      showHovercardHint: 'Fügt OVR, Position und Stats in GitHubs User-Popover ein.',
      cardTheme: 'Kartenstil',
      cardThemeHint: 'Optik der Scout-Panels auf Profil und Hovercard.',
      cardThemeStandard: 'Standard',
      cardThemeGithub: 'GitHub',
      cardThemeFifa: 'FIFA',
      cardThemeNeon: 'Neon',
      on: 'AN',
      off: 'AUS',
      cacheHours: 'Cache-Dauer (Stunden)',
      cacheHoursHint: 'Wie lange API-Ergebnisse wiederverwendet werden. 0 = aus.',
      clearCache: 'Cache leeren',
      cacheCleared: 'Cache geleert ({count})',
      cacheEmpty: 'Cache ist leer',
      cacheClearHint: 'Löscht gespeicherte GitFut-Lookups.',
      version: 'Version {version}',
      cacheCards: '{count} Karten im Cache',
      cacheStorage: '{used} belegt · {free} frei',
      cacheStorageHint: 'Lokaler Karten-Cache gegenüber Soft-Limit {budget}.',
      repoLink: 'GitHub',
      repoAbout: 'Quellcode, Updates und Issues',
      skillMoves: 'Tricks',
      weakFoot: 'Schwachfuß',
      workRate: 'Einsatz',
      style: 'Stil',
    },
    fr: {
      loading: 'Scouting…',
      loadError: 'Échec du scout',
      notFound: 'Pas de carte',
      overall: 'OVR',
      position: 'POS',
      finish: 'Finition',
      archetype: 'Archétype',
      language: 'Langage',
      playstyles: 'Styles',
      metrics: 'Métriques',
      openReport: 'Ouvrir le rapport complet',
      duel: 'Duel',
      menuSettings: 'GitHub GitFut — Réglages',
      navMenuItem: 'Réglages GitFut',
      panelTitle: 'GitFut',
      panelSubtitle: 'Scouting · cache · affichage',
      close: 'Fermer',
      cancel: 'Annuler',
      save: 'Enregistrer',
      saveReload: 'Enregistrer et recharger',
      sectionDisplay: 'Affichage',
      uiLanguage: 'Langue',
      uiLanguageHint: 'Langue des panneaux GitFut, hovercards et réglages. Auto suit le navigateur.',
      uiLanguageAuto: 'Auto (navigateur)',
      sectionCache: 'Cache',
      showHovercard: 'Afficher GitFut dans les hovercards d’avatar',
      showHovercardHint: 'Injecte OVR, poste et stats dans le popover natif de GitHub.',
      cardTheme: 'Style de carte',
      cardThemeHint: 'Apparence des panneaux scout sur profil et hovercard.',
      cardThemeStandard: 'Standard',
      cardThemeGithub: 'GitHub',
      cardThemeFifa: 'FIFA',
      cardThemeNeon: 'Néon',
      on: 'ON',
      off: 'OFF',
      cacheHours: 'Durée du cache (heures)',
      cacheHoursHint: 'Durée de réutilisation de l’API. 0 désactive.',
      clearCache: 'Vider le cache',
      cacheCleared: 'Cache vidé ({count})',
      cacheEmpty: 'Cache vide',
      cacheClearHint: 'Supprime les recherches GitFut de ce profil.',
      version: 'Version {version}',
      cacheCards: '{count} cartes en cache',
      cacheStorage: '{used} utilisés · {free} libres',
      cacheStorageHint: 'Taille du cache local vs budget souple de {budget}.',
      repoLink: 'GitHub',
      repoAbout: 'Code, mises à jour et issues',
      skillMoves: 'Gestes',
      weakFoot: 'Pied faible',
      workRate: 'Intensité',
      style: 'Style',
    },
    ja: {
      loading: 'スカウティング…',
      loadError: 'スカウト失敗',
      notFound: 'カードなし',
      overall: 'OVR',
      position: 'ポジ',
      finish: 'フィニッシュ',
      archetype: 'アーキタイプ',
      language: '言語',
      playstyles: 'プレースタイル',
      metrics: 'スカウト指標',
      openReport: 'フルレポートを開く',
      duel: 'デュエル',
      menuSettings: 'GitHub GitFut — 設定',
      navMenuItem: 'GitFutの設定',
      panelTitle: 'GitFut',
      panelSubtitle: 'スカウト · キャッシュ · 表示',
      close: '閉じる',
      cancel: 'キャンセル',
      save: '保存',
      saveReload: '保存して再読込',
      sectionDisplay: '表示',
      uiLanguage: '言語',
      uiLanguageHint: 'GitFutパネル・ホバーカード・設定の表示言語。自動はブラウザに合わせます。',
      uiLanguageAuto: '自動（ブラウザ）',
      sectionCache: 'キャッシュ',
      showHovercard: 'アバターホバーカードにGitFutを表示',
      showHovercardHint: 'アバターホバー時にGitHubのユーザーポップオーバーへOVR等を挿入。',
      cardTheme: 'カードスタイル',
      cardThemeHint: 'プロフィールとホバーカードの見た目。',
      cardThemeStandard: 'スタンダード',
      cardThemeGithub: 'GitHub',
      cardThemeFifa: 'FIFA',
      cardThemeNeon: 'ネオン',
      on: 'ON',
      off: 'OFF',
      cacheHours: 'キャッシュ時間（時間）',
      cacheHoursHint: 'API結果の再利用時間。0で無効。',
      clearCache: 'キャッシュ削除',
      cacheCleared: '削除しました ({count})',
      cacheEmpty: 'キャッシュは空です',
      cacheClearHint: 'このブラウザのGitFut照会を削除します。',
      version: 'バージョン {version}',
      cacheCards: 'キャッシュ済み: {count} 件',
      cacheStorage: '使用 {used} · 空き {free}',
      cacheStorageHint: 'ローカルカードキャッシュとソフト上限 {budget}。',
      repoLink: 'GitHub',
      repoAbout: 'ソース・更新・Issue',
      skillMoves: 'スキル',
      weakFoot: 'ウィークフット',
      workRate: 'ワークレート',
      style: 'スタイル',
    },
    ko: {
      loading: '스카우팅…',
      loadError: '스카우트 실패',
      notFound: '카드 없음',
      overall: 'OVR',
      position: '포지션',
      finish: '피니시',
      archetype: '아키타입',
      language: '언어',
      playstyles: '플레이스타일',
      metrics: '스카우트 지표',
      openReport: '전체 리포트 열기',
      duel: '듀얼',
      menuSettings: 'GitHub GitFut — 설정',
      navMenuItem: 'GitFut 설정',
      panelTitle: 'GitFut',
      panelSubtitle: '스카우팅 · 캐시 · 표시',
      close: '닫기',
      cancel: '취소',
      save: '저장',
      saveReload: '저장 후 새로고침',
      sectionDisplay: '표시',
      uiLanguage: '언어',
      uiLanguageHint: 'GitFut 패널·호버카드·설정의 표시 언어. 자동은 브라우저를 따릅니다.',
      uiLanguageAuto: '자동 (브라우저)',
      sectionCache: '캐시',
      showHovercard: '아바타 호버카드에 GitFut 표시',
      showHovercardHint: '아바타 호버 시 GitHub 사용자 팝오버에 OVR·포지션·스탯을 넣습니다.',
      cardTheme: '카드 스타일',
      cardThemeHint: '프로필·호버카드 스카우트 패널의 시각 스타일.',
      cardThemeStandard: '기본',
      cardThemeGithub: 'GitHub',
      cardThemeFifa: 'FIFA',
      cardThemeNeon: '네온',
      on: 'ON',
      off: 'OFF',
      cacheHours: '캐시 시간(시간)',
      cacheHoursHint: 'API 결과 재사용 시간. 0이면 비활성.',
      clearCache: '캐시 비우기',
      cacheCleared: '비움 ({count})',
      cacheEmpty: '캐시가 비어 있음',
      cacheClearHint: '이 브라우저의 GitFut 조회를 삭제합니다.',
      version: '버전 {version}',
      cacheCards: '캐시된 카드 {count}개',
      cacheStorage: '사용 {used} · 남음 {free}',
      cacheStorageHint: '로컬 카드 캐시와 소프트 한도 {budget}.',
      repoLink: 'GitHub',
      repoAbout: '소스, 업데이트, 이슈',
      skillMoves: '스킬',
      weakFoot: '약발',
      workRate: '활동량',
      style: '스타일',
    },
    pl: {
      loading: 'Scouting…',
      loadError: 'Scout nieudany',
      notFound: 'Brak karty',
      overall: 'OVR',
      position: 'POZ',
      finish: 'Wykończenie',
      archetype: 'Archetyp',
      language: 'Język',
      playstyles: 'Style gry',
      metrics: 'Metryki',
      openReport: 'Otwórz pełny raport',
      duel: 'Pojedynek',
      menuSettings: 'GitHub GitFut — Ustawienia',
      navMenuItem: 'Ustawienia GitFut',
      panelTitle: 'GitFut',
      panelSubtitle: 'Scouting · cache · wyświetlanie',
      close: 'Zamknij',
      cancel: 'Anuluj',
      save: 'Zapisz',
      saveReload: 'Zapisz i odśwież',
      sectionDisplay: 'Wyświetlanie',
      uiLanguage: 'Język',
      uiLanguageHint: 'Język paneli GitFut, hovercard i ustawień. Auto — według przeglądarki.',
      uiLanguageAuto: 'Auto (przeglądarka)',
      sectionCache: 'Cache',
      showHovercard: 'Pokaż GitFut w hovercardach awatara',
      showHovercardHint: 'Wstawia OVR, pozycję i staty do natywnego popovera GitHub.',
      cardTheme: 'Styl karty',
      cardThemeHint: 'Wygląd paneli scout na profilu i w hovercard.',
      cardThemeStandard: 'Standardowy',
      cardThemeGithub: 'GitHub',
      cardThemeFifa: 'FIFA',
      cardThemeNeon: 'Neon',
      on: 'WŁ',
      off: 'WYŁ',
      cacheHours: 'Czas cache (godziny)',
      cacheHoursHint: 'Jak długo ponownie używać API. 0 wyłącza.',
      clearCache: 'Wyczyść cache',
      cacheCleared: 'Wyczyszczono ({count})',
      cacheEmpty: 'Cache pusty',
      cacheClearHint: 'Usuwa zapisane zapytania GitFut.',
      version: 'Wersja {version}',
      cacheCards: 'Karty w cache: {count}',
      cacheStorage: '{used} zajęte · {free} wolne',
      cacheStorageHint: 'Rozmiar lokalnego cache względem limitu {budget}.',
      repoLink: 'GitHub',
      repoAbout: 'Kod, aktualizacje i zgłoszenia',
      skillMoves: 'Sztuczki',
      weakFoot: 'Słaba noga',
      workRate: 'Zaangażowanie',
      style: 'Styl',
    },
  };

  function detectBrowserLocale() {
    const candidates = [navigator.language, ...(navigator.languages || [])];
    for (const candidate of candidates) {
      const raw = String(candidate).toLowerCase();
      const primary = raw.split('-')[0];
      if (SUPPORTED_LOCALES.includes(primary)) return primary;
      if (raw.startsWith('zh')) return 'zh';
      if (raw.startsWith('pt')) return 'pt';
    }
    return 'en';
  }

  function normalizeUiLocale(value) {
    const raw = String(value ?? 'auto').toLowerCase().trim();
    if (!raw || raw === 'auto') return 'auto';
    const primary = raw.split('-')[0];
    if (SUPPORTED_LOCALES.includes(primary)) return primary;
    if (raw.startsWith('zh')) return 'zh';
    if (raw.startsWith('pt')) return 'pt';
    return 'auto';
  }

  function resolveActiveLocale(pref) {
    const normalized = normalizeUiLocale(pref);
    return normalized === 'auto' ? detectBrowserLocale() : normalized;
  }

  /** @type {typeof DEFAULT_SETTINGS} */
  let settings = loadSettings();
  let locale = resolveActiveLocale(settings.locale);
  let panelOpen = false;

  function t(key, vars) {
    let text = TRANSLATIONS[locale]?.[key] ?? TRANSLATIONS.en[key] ?? key;
    if (vars && typeof vars === 'object') {
      for (const [name, value] of Object.entries(vars)) {
        text = text.replace(new RegExp(`\\{${name}\\}`, 'g'), String(value));
      }
    }
    return text;
  }

  function normalizeCacheHours(value) {
    const n = Math.round(Number(value));
    if (!Number.isFinite(n) || n < 0) return DEFAULT_SETTINGS.cacheHours;
    return Math.min(n, CACHE_HOURS_MAX);
  }

  function normalizeCardTheme(value) {
    const key = String(value || '').toLowerCase();
    return CARD_THEMES.includes(key) ? key : DEFAULT_SETTINGS.cardTheme;
  }

  function applyCardTheme() {
    const theme = normalizeCardTheme(settings.cardTheme);
    document.documentElement.dataset.gfCardTheme = theme;
    document.documentElement.classList.toggle('gf-card-theme-github', theme === 'github');
    document.documentElement.classList.toggle('gf-card-theme-fifa', theme === 'fifa');
    document.documentElement.classList.toggle('gf-card-theme-neon', theme === 'neon');
  }

  function loadSettings() {
    const raw = GM_getValue(SETTINGS_KEY, null);
    if (!raw || typeof raw !== 'object') return { ...DEFAULT_SETTINGS };
    return {
      ...DEFAULT_SETTINGS,
      ...raw,
      cacheHours: normalizeCacheHours(raw.cacheHours),
      showHovercard:
        typeof raw.showHovercard === 'boolean'
          ? raw.showHovercard
          : raw.showInlineBadges !== false,
      cardTheme: normalizeCardTheme(raw.cardTheme),
      locale: normalizeUiLocale(raw.locale),
    };
  }

  function saveSettings(next) {
    settings = {
      ...settings,
      ...next,
      cacheHours: normalizeCacheHours(next.cacheHours ?? settings.cacheHours),
      showHovercard:
        typeof next.showHovercard === 'boolean'
          ? next.showHovercard
          : settings.showHovercard !== false,
      cardTheme: normalizeCardTheme(
        next.cardTheme !== undefined ? next.cardTheme : settings.cardTheme
      ),
      locale: normalizeUiLocale(
        next.locale !== undefined ? next.locale : settings.locale
      ),
    };
    GM_setValue(SETTINGS_KEY, settings);
    locale = resolveActiveLocale(settings.locale);
    applyCardTheme();
    updateSettingsMenuState();
  }

  function getCacheTtlMs() {
    const hours = normalizeCacheHours(settings.cacheHours);
    return hours > 0 ? hours * 60 * 60 * 1000 : 0;
  }

  /** @type {Map<string, Promise<object|null>>} */
  const inflight = new Map();
  /** @type {Array<{ task: () => Promise<unknown>, resolve: Function, reject: Function }>} */
  const queue = [];
  let activeRequests = 0;
  /** @type {Record<string, unknown>|null} */
  let memoryCache = null;
  let cacheDirty = false;
  let cachePersistTimer = null;
  let scanTimer = null;
  let mutationObserver = null;
  let hovercardObserver = null;
  /** @type {number} */
  let hovercardSeq = 0;

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

  function finishMeta(finish) {
    return FINISH_COLORS[finish] || FINISH_COLORS.bronze;
  }

  function isValidUsername(login) {
    if (!login || typeof login !== 'string') return false;
    const name = login.trim();
    if (name.length < 1 || name.length > 39) return false;
    if (RESERVED_PATHS.has(name.toLowerCase())) return false;
    return /^[A-Za-z0-9](?:[A-Za-z0-9]|-(?=[A-Za-z0-9])){0,38}$/.test(name);
  }

  function getLoggedInUsername() {
    const meta = document.querySelector('meta[name="user-login"]');
    const login = meta?.getAttribute('content')?.trim();
    return login && isValidUsername(login) ? login : null;
  }

  /** @param {string} opponentLogin */
  function buildDuelUrl(opponentLogin) {
    const opponent = String(opponentLogin || '').trim();
    if (!opponent || !isValidUsername(opponent)) {
      return `${SITE_BASE}`;
    }
    const me = getLoggedInUsername();
    if (me && me.toLowerCase() !== opponent.toLowerCase()) {
      return `${SITE_BASE}/${encodeURIComponent(me)}/vs/${encodeURIComponent(opponent)}`;
    }
    return `${SITE_BASE}/${encodeURIComponent(opponent)}/vs`;
  }

  function getProfileUsername() {
    if (location.hostname === 'gist.github.com') {
      const parts = location.pathname.split('/').filter(Boolean);
      return parts[0] && isValidUsername(parts[0]) ? parts[0] : null;
    }
    const parts = location.pathname.split('/').filter(Boolean);
    if (parts.length !== 1) return null;
    return isValidUsername(parts[0]) ? parts[0] : null;
  }

  function extractUsernameFromHref(href) {
    try {
      const url = new URL(href, location.origin);
      if (!/^(?:www\.)?github\.com$/.test(url.hostname) && url.hostname !== 'gist.github.com') {
        return null;
      }
      const parts = url.pathname.split('/').filter(Boolean);
      if (!parts.length) return null;
      if (parts.length === 1 || (url.hostname === 'gist.github.com' && parts.length >= 1)) {
        return isValidUsername(parts[0]) ? parts[0] : null;
      }
      return null;
    } catch {
      return null;
    }
  }

  function loadMemoryCache() {
    if (memoryCache) return memoryCache;
    const raw = GM_getValue(CACHE_KEY, null);
    memoryCache = raw && typeof raw === 'object' ? raw : {};
    return memoryCache;
  }

  function persistCacheNow() {
    if (!cacheDirty || !memoryCache) return;
    GM_setValue(CACHE_KEY, memoryCache);
    cacheDirty = false;
  }

  function schedulePersistCache() {
    cacheDirty = true;
    if (cachePersistTimer) clearTimeout(cachePersistTimer);
    cachePersistTimer = setTimeout(() => {
      cachePersistTimer = null;
      persistCacheNow();
    }, CACHE_PERSIST_MS);
  }

  function getCached(login) {
    const cache = loadMemoryCache();
    const key = login.toLowerCase();
    const entry = cache[key];
    if (!entry || typeof entry !== 'object') return null;
    const ttl = getCacheTtlMs();
    if (ttl <= 0) return null;
    if (Date.now() - (entry.ts || 0) > ttl) {
      delete cache[key];
      schedulePersistCache();
      return null;
    }
    return entry.data ?? null;
  }

  function setCached(login, data) {
    const cache = loadMemoryCache();
    cache[login.toLowerCase()] = { ts: Date.now(), data };
    schedulePersistCache();
  }

  function clearCardCache() {
    const cache = loadMemoryCache();
    const count = Object.keys(cache).length;
    memoryCache = {};
    cacheDirty = true;
    persistCacheNow();
    return count;
  }

  function formatBytes(bytes) {
    const n = Math.max(0, Number(bytes) || 0);
    if (n < 1024) return `${Math.round(n)} B`;
    if (n < 1024 * 1024) return `${(n / 1024).toFixed(n < 10 * 1024 ? 1 : 0)} KB`;
    return `${(n / (1024 * 1024)).toFixed(2)} MB`;
  }

  function getCacheStats() {
    const cache = loadMemoryCache();
    const count = Object.keys(cache).length;
    let used = 0;
    try {
      used = new TextEncoder().encode(JSON.stringify(cache)).length;
    } catch {
      used = JSON.stringify(cache).length;
    }
    const budget = CACHE_BUDGET_BYTES;
    const free = Math.max(0, budget - used);
    const usedRatio = budget > 0 ? Math.min(1, used / budget) : 0;
    const freeRatio = budget > 0 ? Math.max(0, 1 - usedRatio) : 0;
    return { count, used, free, budget, usedRatio, freeRatio };
  }

  function updateCacheStatsUI() {
    const panel = document.getElementById('gf-panel');
    if (!panel) return;
    const stats = getCacheStats();
    const countEl = panel.querySelector('#gf-cache-count');
    const storageEl = panel.querySelector('#gf-cache-storage');
    const bar = panel.querySelector('#gf-cache-bar');
    const fill = panel.querySelector('#gf-cache-bar-fill');
    if (countEl) countEl.textContent = t('cacheCards', { count: stats.count });
    if (storageEl) {
      storageEl.textContent = t('cacheStorage', {
        used: formatBytes(stats.used),
        free: formatBytes(stats.free),
      });
    }
    if (bar && fill) {
      const pct = Math.round(stats.freeRatio * 100);
      fill.style.width = `${pct}%`;
      bar.setAttribute('aria-valuenow', String(pct));
      bar.setAttribute('aria-valuetext', t('cacheStorage', {
        used: formatBytes(stats.used),
        free: formatBytes(stats.free),
      }));
      bar.classList.toggle('is-warn', stats.usedRatio >= 0.7 && stats.usedRatio < 0.9);
      bar.classList.toggle('is-full', stats.usedRatio >= 0.9);
    }
  }

  function enqueue(task) {
    return new Promise((resolve, reject) => {
      queue.push({ task, resolve, reject });
      pumpQueue();
    });
  }

  function pumpQueue() {
    while (activeRequests < MAX_CONCURRENT && queue.length) {
      const item = queue.shift();
      activeRequests += 1;
      Promise.resolve()
        .then(() => new Promise((r) => setTimeout(r, REQUEST_DELAY_MS)))
        .then(() => item.task())
        .then(item.resolve, item.reject)
        .finally(() => {
          activeRequests -= 1;
          pumpQueue();
        });
    }
  }

  function gmGetJson(url) {
    return new Promise((resolve, reject) => {
      GM_xmlhttpRequest({
        method: 'GET',
        url,
        headers: { Accept: 'application/json' },
        onload(res) {
          if (res.status === 404) {
            resolve(null);
            return;
          }
          if (res.status < 200 || res.status >= 300) {
            reject(new Error(`HTTP ${res.status}`));
            return;
          }
          try {
            resolve(JSON.parse(res.responseText));
          } catch (err) {
            reject(err);
          }
        },
        onerror: () => reject(new Error('Network error')),
        ontimeout: () => reject(new Error('Timeout')),
      });
    });
  }

  function fetchCard(login) {
    const key = login.toLowerCase();
    const cached = getCached(login);
    if (cached !== null && cached !== undefined) {
      return Promise.resolve(cached);
    }
    if (inflight.has(key)) return inflight.get(key);

    const promise = enqueue(() => gmGetJson(`${API_BASE}/${encodeURIComponent(login)}`))
      .then((data) => {
        setCached(login, data);
        return data;
      })
      .finally(() => inflight.delete(key));

    inflight.set(key, promise);
    return promise;
  }

  GM_addStyle(`
    :root {
      --gf-radius: 16px;
      --gf-font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
      --gf-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
    }

    #${PANEL_ID} {
      position: relative;
      isolation: isolate;
      font-family: var(--gf-font);
      margin: 0 0 16px;
      border: 1px solid color-mix(
        in srgb,
        var(--gf-finish-accent, #CD7F32) 48%,
        var(--borderColor-default, var(--color-border-default, #d0d7de))
      );
      border-radius: var(--gf-radius);
      background:
        radial-gradient(
          120% 80% at 0% 0%,
          var(--gf-finish-soft, rgba(205,127,50,0.16)),
          transparent 55%
        ),
        radial-gradient(
          90% 70% at 100% 100%,
          color-mix(in srgb, var(--gf-finish-glow, rgba(205,127,50,0.28)) 32%, transparent),
          transparent 60%
        ),
        var(--bgColor-default, var(--color-canvas-default, #fff));
      overflow: hidden;
      box-shadow:
        var(--gf-panel-outer-glow, 0 0 0 transparent),
        var(--gf-panel-ring, 0 0 0 1px transparent),
        0 8px 24px rgba(1, 4, 9, 0.1);
      transition: box-shadow 0.25s ease, border-color 0.25s ease, background 0.25s ease;
    }

    #${PANEL_ID}.is-expanding {
      transition:
        height 0.42s cubic-bezier(0.22, 1, 0.36, 1),
        margin-bottom 0.42s cubic-bezier(0.22, 1, 0.36, 1),
        opacity 0.3s ease,
        box-shadow 0.25s ease,
        border-color 0.25s ease,
        background 0.25s ease;
      will-change: height, opacity, margin-bottom;
    }

    #${PANEL_ID} > .gf-panel-theme-fx {
      position: absolute;
      inset: 0;
      border-radius: inherit;
      overflow: hidden;
      pointer-events: none;
      z-index: 0;
    }

    #${PANEL_ID} > .gf-panel-theme-fx + * {
      position: relative;
      z-index: 1;
    }

    .gf-panel-theme-fx__shine {
      position: absolute;
      inset: 0;
      background: linear-gradient(
        115deg,
        transparent 35%,
        var(--gf-finish-shine, rgba(255,255,255,0.35)) 48%,
        transparent 62%
      );
      background-size: 220% 100%;
      background-position: 120% 0;
      opacity: 0;
    }

    #${PANEL_ID}.gf-panel-finish--bronze {
      --gf-hc-shine-opacity: 0;
      --gf-panel-ring: inset 0 0 0 1px color-mix(in srgb, var(--gf-finish-accent) 24%, transparent);
      --gf-panel-outer-glow: 0 0 0 transparent;
    }

    #${PANEL_ID}.gf-panel-finish--silver {
      --gf-hc-shine-opacity: 0.16;
      --gf-panel-ring: inset 0 0 0 1px color-mix(in srgb, var(--gf-finish-accent) 36%, transparent);
      --gf-panel-outer-glow: 0 0 18px color-mix(in srgb, var(--gf-finish-glow) 40%, transparent);
    }

    #${PANEL_ID}.gf-panel-finish--gold {
      --gf-hc-shine-opacity: 0.3;
      --gf-panel-ring: inset 0 0 0 1px color-mix(in srgb, var(--gf-finish-accent) 50%, transparent);
      --gf-panel-outer-glow:
        0 0 22px color-mix(in srgb, var(--gf-finish-glow) 65%, transparent),
        0 0 40px color-mix(in srgb, var(--gf-finish-glow) 24%, transparent);
    }

    #${PANEL_ID}.gf-panel-finish--totw {
      --gf-hc-shine-opacity: 0.26;
      --gf-panel-ring: inset 0 0 0 1px color-mix(in srgb, var(--gf-finish-accent) 55%, transparent);
      --gf-panel-outer-glow:
        0 0 24px color-mix(in srgb, var(--gf-finish-glow) 70%, transparent),
        0 0 48px color-mix(in srgb, var(--gf-finish-glow) 28%, transparent);
    }

    #${PANEL_ID}.gf-panel-finish--toty {
      --gf-hc-shine-opacity: 0.36;
      --gf-panel-ring: inset 0 0 0 1px color-mix(in srgb, var(--gf-finish-accent) 60%, transparent);
      --gf-panel-outer-glow:
        0 0 28px color-mix(in srgb, var(--gf-finish-glow) 75%, transparent),
        0 0 56px color-mix(in srgb, var(--gf-finish-glow) 32%, transparent);
    }

    #${PANEL_ID}.gf-panel-finish--icon,
    #${PANEL_ID}.gf-panel-finish--founder {
      --gf-hc-shine-opacity: 0.42;
      --gf-panel-ring:
        inset 0 0 0 1px color-mix(in srgb, var(--gf-finish-accent) 68%, transparent),
        inset 0 0 28px color-mix(in srgb, var(--gf-finish-soft) 50%, transparent);
      --gf-panel-outer-glow:
        0 0 30px color-mix(in srgb, var(--gf-finish-glow) 80%, transparent),
        0 0 60px color-mix(in srgb, var(--gf-finish-glow) 36%, transparent);
    }

    #${PANEL_ID}.gf-panel-finish--gold .gf-panel-theme-fx__shine,
    #${PANEL_ID}.gf-panel-finish--totw .gf-panel-theme-fx__shine,
    #${PANEL_ID}.gf-panel-finish--toty .gf-panel-theme-fx__shine,
    #${PANEL_ID}.gf-panel-finish--icon .gf-panel-theme-fx__shine,
    #${PANEL_ID}.gf-panel-finish--founder .gf-panel-theme-fx__shine {
      animation: gf-hc-shine-sweep 1.8s ease-in-out 1 forwards;
    }

    #${PANEL_ID}.gf-panel-finish--totw {
      animation: gf-panel-pulse-totw 2.4s ease-in-out infinite;
    }

    #${PANEL_ID}.gf-panel-finish--icon {
      animation: gf-panel-pulse-icon 2.8s ease-in-out infinite;
    }

    #${PANEL_ID}.gf-panel-finish--founder {
      animation: gf-panel-pulse-founder 2.2s ease-in-out infinite;
    }

    @keyframes gf-panel-pulse-totw {
      0%, 100% {
        box-shadow:
          0 0 20px color-mix(in srgb, var(--gf-finish-glow) 50%, transparent),
          0 0 36px color-mix(in srgb, var(--gf-finish-glow) 20%, transparent),
          inset 0 0 0 1px color-mix(in srgb, var(--gf-finish-accent) 50%, transparent),
          0 8px 24px rgba(1, 4, 9, 0.1);
      }
      50% {
        box-shadow:
          0 0 32px color-mix(in srgb, var(--gf-finish-glow) 80%, transparent),
          0 0 56px color-mix(in srgb, var(--gf-finish-glow) 36%, transparent),
          inset 0 0 0 1px color-mix(in srgb, var(--gf-finish-accent) 72%, transparent),
          0 10px 28px rgba(1, 4, 9, 0.14);
      }
    }

    @keyframes gf-panel-pulse-icon {
      0%, 100% {
        box-shadow:
          0 0 26px color-mix(in srgb, var(--gf-finish-glow) 55%, transparent),
          0 0 46px color-mix(in srgb, var(--gf-finish-accent) 24%, transparent),
          inset 0 0 22px color-mix(in srgb, var(--gf-finish-soft) 38%, transparent),
          0 8px 24px rgba(1, 4, 9, 0.12);
      }
      50% {
        box-shadow:
          0 0 40px color-mix(in srgb, var(--gf-finish-glow) 88%, transparent),
          0 0 68px color-mix(in srgb, var(--gf-finish-accent) 42%, transparent),
          inset 0 0 34px color-mix(in srgb, var(--gf-finish-soft) 52%, transparent),
          0 12px 30px rgba(1, 4, 9, 0.16);
      }
    }

    @keyframes gf-panel-pulse-founder {
      0%, 100% {
        box-shadow:
          0 0 28px color-mix(in srgb, var(--gf-finish-glow) 60%, transparent),
          0 0 50px color-mix(in srgb, var(--gf-finish-accent) 26%, transparent),
          inset 0 0 24px color-mix(in srgb, var(--gf-finish-soft) 42%, transparent),
          0 8px 24px rgba(1, 4, 9, 0.12);
      }
      50% {
        box-shadow:
          0 0 44px color-mix(in srgb, var(--gf-finish-glow) 92%, transparent),
          0 0 74px color-mix(in srgb, var(--gf-finish-accent) 46%, transparent),
          inset 0 0 38px color-mix(in srgb, var(--gf-finish-soft) 58%, transparent),
          0 12px 32px rgba(1, 4, 9, 0.18);
      }
    }

    .gf-panel__inner {
      position: relative;
      z-index: 1;
    }

    .gf-panel__head {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 14px 14px 12px;
      border-bottom: 1px solid color-mix(in srgb, var(--gf-finish-accent, #CD7F32) 22%, transparent);
      background: linear-gradient(
        180deg,
        color-mix(in srgb, var(--gf-finish-soft, rgba(205,127,50,0.16)) 55%, transparent),
        transparent
      );
    }

    .gf-panel__ovr {
      flex: 0 0 auto;
      min-width: 56px;
      padding: 9px 11px;
      border-radius: 12px;
      background:
        linear-gradient(
          145deg,
          var(--gf-finish-shine, rgba(255,255,255,0.35)),
          var(--gf-finish-accent, #CD7F32) 40%,
          var(--gf-finish-deep, #5a3412)
        );
      color: var(--gf-finish-ink, #2A1A0C);
      text-align: center;
      line-height: 1.05;
      box-shadow:
        inset 0 1px 0 color-mix(in srgb, var(--gf-finish-shine) 55%, transparent),
        0 0 0 1px color-mix(in srgb, var(--gf-finish-deep) 35%, transparent),
        var(--gf-panel-ovr-glow, none);
    }

    #${PANEL_ID}.gf-panel-finish--silver .gf-panel__ovr,
    #${PANEL_ID}.gf-panel-finish--gold .gf-panel__ovr {
      --gf-panel-ovr-glow: 0 0 14px color-mix(in srgb, var(--gf-finish-glow) 55%, transparent);
    }

    #${PANEL_ID}.gf-panel-finish--totw .gf-panel__ovr,
    #${PANEL_ID}.gf-panel-finish--toty .gf-panel__ovr,
    #${PANEL_ID}.gf-panel-finish--icon .gf-panel__ovr,
    #${PANEL_ID}.gf-panel-finish--founder .gf-panel__ovr {
      --gf-panel-ovr-glow:
        0 0 18px color-mix(in srgb, var(--gf-finish-glow) 75%, transparent),
        0 0 30px color-mix(in srgb, var(--gf-finish-glow) 35%, transparent);
    }

    .gf-panel__ovr-value {
      display: block;
      font-size: 24px;
      font-weight: 800;
      letter-spacing: -0.03em;
      font-variant-numeric: tabular-nums;
      text-shadow: 0 1px 0 color-mix(in srgb, var(--gf-finish-shine) 40%, transparent);
    }

    .gf-panel__ovr-label {
      display: block;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.08em;
      opacity: 0.8;
      text-transform: uppercase;
    }

    .gf-panel__meta {
      min-width: 0;
      flex: 1;
    }

    .gf-panel__title-row {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 6px 8px;
    }

    .gf-panel__name {
      font-size: 15px;
      font-weight: 700;
      color: var(--fgColor-default, var(--color-fg-default, #1f2328));
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .gf-chip {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      padding: 2px 8px;
      border-radius: 999px;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.02em;
      border: 1px solid color-mix(in srgb, var(--gf-finish-accent, #CD7F32) 50%, transparent);
      background: color-mix(in srgb, var(--gf-finish-accent, #CD7F32) 16%, transparent);
      color: var(--fgColor-default, var(--color-fg-default, #1f2328));
      text-transform: uppercase;
    }

    #${PANEL_ID}.gf-panel-finish--gold .gf-chip,
    #${PANEL_ID}.gf-panel-finish--totw .gf-chip,
    #${PANEL_ID}.gf-panel-finish--toty .gf-chip,
    #${PANEL_ID}.gf-panel-finish--icon .gf-chip,
    #${PANEL_ID}.gf-panel-finish--founder .gf-chip {
      box-shadow: 0 0 8px color-mix(in srgb, var(--gf-finish-glow) 28%, transparent);
    }

    .gf-panel__blurb {
      margin: 5px 0 0;
      font-size: 12px;
      color: var(--fgColor-muted, var(--color-fg-muted, #656d76));
      line-height: 1.4;
    }

    .gf-panel__body {
      padding: 12px 14px 14px;
    }

    .gf-stats {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 6px;
      margin: 0 0 12px;
    }

    .gf-stat {
      border-radius: 10px;
      padding: 8px 8px;
      text-align: center;
      background: color-mix(
        in srgb,
        var(--gf-finish-soft, rgba(205,127,50,0.16)) 32%,
        var(--bgColor-muted, var(--color-canvas-subtle, #f6f8fa))
      );
      border: 1px solid color-mix(in srgb, var(--gf-finish-accent, #CD7F32) 20%, transparent);
    }

    #${PANEL_ID}.gf-panel-finish--toty .gf-stat,
    #${PANEL_ID}.gf-panel-finish--icon .gf-stat,
    #${PANEL_ID}.gf-panel-finish--founder .gf-stat {
      border-color: color-mix(in srgb, var(--gf-finish-accent) 38%, transparent);
      box-shadow: inset 0 0 12px color-mix(in srgb, var(--gf-finish-soft) 38%, transparent);
    }

    .gf-stat__value {
      display: block;
      font-size: 16px;
      font-weight: 800;
      font-variant-numeric: tabular-nums;
      letter-spacing: -0.02em;
      color: var(--fgColor-default, var(--color-fg-default, #1f2328));
    }

    .gf-stat__key {
      display: block;
      margin-top: 1px;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.06em;
      color: var(--fgColor-muted, var(--color-fg-muted, #656d76));
    }

    .gf-attrs {
      display: grid;
      gap: 6px;
      margin: 0 0 12px;
      padding: 10px 11px;
      border-radius: 10px;
      font-size: 12px;
      color: var(--fgColor-default, var(--color-fg-default, #1f2328));
      background: color-mix(
        in srgb,
        var(--gf-finish-soft, rgba(205,127,50,0.16)) 18%,
        var(--bgColor-muted, var(--color-canvas-subtle, #f6f8fa))
      );
      border: 1px solid color-mix(in srgb, var(--gf-finish-accent, #CD7F32) 14%, transparent);
    }

    .gf-attrs__row {
      display: flex;
      justify-content: space-between;
      gap: 10px;
    }

    .gf-attrs__label {
      color: var(--fgColor-muted, var(--color-fg-muted, #656d76));
    }

    .gf-attrs__value {
      font-weight: 600;
      text-align: right;
      font-variant-numeric: tabular-nums;
    }

    .gf-playstyles {
      display: flex;
      flex-wrap: wrap;
      gap: 5px;
      margin: 0 0 12px;
    }

    .gf-playstyle {
      font-size: 11px;
      font-weight: 600;
      padding: 3px 8px;
      border-radius: 999px;
      background: var(--bgColor-default, var(--color-canvas-default, #fff));
      border: 1px solid var(--borderColor-default, var(--color-border-default, #d0d7de));
      color: var(--fgColor-default, var(--color-fg-default, #1f2328));
    }

    .gf-playstyle.is-plus {
      border-color: color-mix(in srgb, var(--gf-finish-accent, #CD7F32) 55%, transparent);
      background: color-mix(in srgb, var(--gf-finish-accent, #CD7F32) 14%, transparent);
      box-shadow: 0 0 8px color-mix(in srgb, var(--gf-finish-glow) 22%, transparent);
    }


    .gf-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    .gf-btn-link {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      padding: 7px 12px;
      border-radius: 8px;
      font-size: 12px;
      font-weight: 600;
      text-decoration: none !important;
      border: 1px solid var(--borderColor-default, var(--color-border-default, #d0d7de));
      background: var(--bgColor-default, var(--color-canvas-default, #fff));
      color: var(--fgColor-default, var(--color-fg-default, #1f2328)) !important;
      transition: background 0.15s ease, box-shadow 0.15s ease;
    }

    .gf-btn-link:hover {
      background: var(--control-transparent-bgColor-hover, rgba(208,215,222,0.32));
    }

    .gf-btn-link--primary {
      border-color: transparent;
      background:
        linear-gradient(
          145deg,
          var(--gf-finish-shine, rgba(255,255,255,0.35)),
          var(--gf-finish-accent, #CD7F32) 45%,
          var(--gf-finish-deep, #5a3412)
        );
      color: var(--gf-finish-ink, #2A1A0C) !important;
      box-shadow: 0 0 14px color-mix(in srgb, var(--gf-finish-glow) 38%, transparent);
    }

    .gf-btn-link--primary:hover {
      filter: brightness(1.06);
      background:
        linear-gradient(
          145deg,
          var(--gf-finish-shine, rgba(255,255,255,0.35)),
          var(--gf-finish-accent, #CD7F32) 45%,
          var(--gf-finish-deep, #5a3412)
        );
    }

    .gf-panel__status {
      padding: 16px 14px;
      font-size: 13px;
      color: var(--fgColor-muted, var(--color-fg-muted, #656d76));
    }

    .gf-panel__status.is-error {
      color: var(--fgColor-danger, var(--color-danger-fg, #d1242f));
    }

    #${PANEL_ID} .gf-panel-skel .gf-skel {
      display: block;
      border-radius: 6px;
      background: linear-gradient(
        90deg,
        color-mix(in srgb, var(--fgColor-muted, #656d76) 10%, transparent) 0%,
        color-mix(in srgb, var(--fgColor-muted, #656d76) 22%, transparent) 45%,
        color-mix(in srgb, var(--fgColor-muted, #656d76) 10%, transparent) 90%
      );
      background-size: 220% 100%;
      animation: gf-skel-shimmer 1.35s ease-in-out infinite;
    }

    #${PANEL_ID} .gf-skel--panel-ovr {
      flex: 0 0 auto;
      width: 56px;
      height: 50px;
      border-radius: 12px;
    }

    #${PANEL_ID} .gf-skel--panel-name {
      width: 42%;
      height: 14px;
      border-radius: 4px;
    }

    #${PANEL_ID} .gf-skel--panel-chip {
      width: 48px;
      height: 18px;
      border-radius: 999px;
    }

    #${PANEL_ID} .gf-skel--panel-blurb {
      width: 78%;
      height: 11px;
      margin-top: 8px;
    }

    #${PANEL_ID} .gf-skel--panel-stat {
      height: 48px;
      border-radius: 10px;
    }

    #${PANEL_ID} .gf-skel--panel-attr {
      height: 12px;
      border-radius: 4px;
    }

    #${PANEL_ID} .gf-skel--panel-btn {
      width: 108px;
      height: 30px;
      border-radius: 8px;
    }

    #${PANEL_ID} .gf-skel--panel-btn-sm {
      width: 64px;
    }

    .Popover-message.gf-hc-themed {
      position: relative;
      isolation: isolate;
      border-radius: 16px !important;
      border-color: color-mix(
        in srgb,
        var(--gf-finish-accent, #CD7F32) 58%,
        var(--borderColor-default, #d0d7de)
      ) !important;
      background:
        radial-gradient(
          120% 80% at 0% 0%,
          var(--gf-finish-soft, rgba(205,127,50,0.16)),
          transparent 55%
        ),
        radial-gradient(
          90% 70% at 100% 100%,
          color-mix(in srgb, var(--gf-finish-glow, rgba(205,127,50,0.28)) 35%, transparent),
          transparent 60%
        ),
        var(--bgColor-default, var(--color-canvas-default, #fff)) !important;
      box-shadow:
        var(--gf-hc-outer-glow, 0 0 0 transparent),
        var(--gf-hc-ring, 0 0 0 1px transparent),
        0 10px 28px rgba(1, 4, 9, 0.2) !important;
      transition: box-shadow 0.25s ease, border-color 0.25s ease, background 0.25s ease;
    }

    .Popover-message.gf-hc-themed > .gf-hc-theme-fx {
      position: absolute;
      inset: 0;
      border-radius: inherit;
      overflow: hidden;
      pointer-events: none;
      z-index: 0;
    }

    .Popover-message.gf-hc-themed > .gf-hc-theme-fx + * {
      position: relative;
      z-index: 1;
    }

    .gf-hc-theme-fx__shine {
      position: absolute;
      inset: 0;
      background: linear-gradient(
        115deg,
        transparent 35%,
        var(--gf-finish-shine, rgba(255,255,255,0.35)) 48%,
        transparent 62%
      );
      background-size: 220% 100%;
      background-position: 120% 0;
      opacity: 0;
    }

    .Popover-message.gf-hc-finish--bronze {
      --gf-hc-shine-opacity: 0;
      --gf-hc-ring: inset 0 0 0 1px color-mix(in srgb, var(--gf-finish-accent) 28%, transparent);
      --gf-hc-outer-glow: 0 0 0 transparent;
    }

    .Popover-message.gf-hc-finish--silver {
      --gf-hc-shine-opacity: 0.18;
      --gf-hc-ring: inset 0 0 0 1px color-mix(in srgb, var(--gf-finish-accent) 40%, transparent);
      --gf-hc-outer-glow: 0 0 16px color-mix(in srgb, var(--gf-finish-glow) 45%, transparent);
    }

    .Popover-message.gf-hc-finish--gold {
      --gf-hc-shine-opacity: 0.32;
      --gf-hc-ring: inset 0 0 0 1px color-mix(in srgb, var(--gf-finish-accent) 55%, transparent);
      --gf-hc-outer-glow:
        0 0 22px color-mix(in srgb, var(--gf-finish-glow) 70%, transparent),
        0 0 40px color-mix(in srgb, var(--gf-finish-glow) 28%, transparent);
    }

    .Popover-message.gf-hc-finish--totw {
      --gf-hc-shine-opacity: 0.28;
      --gf-hc-ring: inset 0 0 0 1px color-mix(in srgb, var(--gf-finish-accent) 60%, transparent);
      --gf-hc-outer-glow:
        0 0 24px color-mix(in srgb, var(--gf-finish-glow) 75%, transparent),
        0 0 48px color-mix(in srgb, var(--gf-finish-glow) 30%, transparent);
    }

    .Popover-message.gf-hc-finish--toty {
      --gf-hc-shine-opacity: 0.38;
      --gf-hc-ring: inset 0 0 0 1px color-mix(in srgb, var(--gf-finish-accent) 65%, transparent);
      --gf-hc-outer-glow:
        0 0 28px color-mix(in srgb, var(--gf-finish-glow) 80%, transparent),
        0 0 56px color-mix(in srgb, var(--gf-finish-glow) 35%, transparent);
    }

    .Popover-message.gf-hc-finish--icon,
    .Popover-message.gf-hc-finish--founder {
      --gf-hc-shine-opacity: 0.45;
      --gf-hc-ring:
        inset 0 0 0 1px color-mix(in srgb, var(--gf-finish-accent) 70%, transparent),
        inset 0 0 28px color-mix(in srgb, var(--gf-finish-soft) 55%, transparent);
      --gf-hc-outer-glow:
        0 0 32px color-mix(in srgb, var(--gf-finish-glow) 85%, transparent),
        0 0 64px color-mix(in srgb, var(--gf-finish-glow) 40%, transparent);
    }

    .Popover-message.gf-hc-finish--gold .gf-hc-theme-fx__shine,
    .Popover-message.gf-hc-finish--totw .gf-hc-theme-fx__shine,
    .Popover-message.gf-hc-finish--toty .gf-hc-theme-fx__shine,
    .Popover-message.gf-hc-finish--icon .gf-hc-theme-fx__shine,
    .Popover-message.gf-hc-finish--founder .gf-hc-theme-fx__shine {
      animation: gf-hc-shine-sweep 1.8s ease-in-out 1 forwards;
    }

    .Popover-message.gf-hc-finish--totw {
      animation: gf-hc-pulse-totw 2.4s ease-in-out infinite;
    }

    .Popover-message.gf-hc-finish--icon {
      animation: gf-hc-pulse-icon 2.8s ease-in-out infinite;
    }

    .Popover-message.gf-hc-finish--founder {
      animation: gf-hc-pulse-founder 2.2s ease-in-out infinite;
    }

    @keyframes gf-hc-shine-sweep {
      0% { background-position: 130% 0; opacity: 0; }
      12% { opacity: var(--gf-hc-shine-opacity, 0.3); }
      55% {
        background-position: -30% 0;
        opacity: calc(var(--gf-hc-shine-opacity, 0.3) * 1.15);
      }
      100% { background-position: -30% 0; opacity: 0; }
    }

    @keyframes gf-hc-pulse-totw {
      0%, 100% {
        box-shadow:
          0 0 22px color-mix(in srgb, var(--gf-finish-glow) 55%, transparent),
          0 0 40px color-mix(in srgb, var(--gf-finish-glow) 22%, transparent),
          inset 0 0 0 1px color-mix(in srgb, var(--gf-finish-accent) 55%, transparent),
          0 10px 28px rgba(1, 4, 9, 0.2);
      }
      50% {
        box-shadow:
          0 0 34px color-mix(in srgb, var(--gf-finish-glow) 85%, transparent),
          0 0 60px color-mix(in srgb, var(--gf-finish-glow) 40%, transparent),
          inset 0 0 0 1px color-mix(in srgb, var(--gf-finish-accent) 75%, transparent),
          0 12px 32px rgba(1, 4, 9, 0.24);
      }
    }

    @keyframes gf-hc-pulse-icon {
      0%, 100% {
        box-shadow:
          0 0 28px color-mix(in srgb, var(--gf-finish-glow) 60%, transparent),
          0 0 50px color-mix(in srgb, var(--gf-finish-accent) 28%, transparent),
          inset 0 0 24px color-mix(in srgb, var(--gf-finish-soft) 40%, transparent),
          0 10px 28px rgba(1, 4, 9, 0.22);
      }
      50% {
        box-shadow:
          0 0 42px color-mix(in srgb, var(--gf-finish-glow) 90%, transparent),
          0 0 72px color-mix(in srgb, var(--gf-finish-accent) 45%, transparent),
          inset 0 0 36px color-mix(in srgb, var(--gf-finish-soft) 55%, transparent),
          0 14px 34px rgba(1, 4, 9, 0.26);
      }
    }

    @keyframes gf-hc-pulse-founder {
      0%, 100% {
        box-shadow:
          0 0 30px color-mix(in srgb, var(--gf-finish-glow) 65%, transparent),
          0 0 54px color-mix(in srgb, var(--gf-finish-accent) 30%, transparent),
          inset 0 0 26px color-mix(in srgb, var(--gf-finish-soft) 45%, transparent),
          0 10px 28px rgba(1, 4, 9, 0.22);
      }
      50% {
        box-shadow:
          0 0 46px color-mix(in srgb, var(--gf-finish-glow) 95%, transparent),
          0 0 78px color-mix(in srgb, var(--gf-finish-accent) 48%, transparent),
          inset 0 0 40px color-mix(in srgb, var(--gf-finish-soft) 60%, transparent),
          0 14px 36px rgba(1, 4, 9, 0.28);
      }
    }

    #${HOVERCARD_BLOCK_ID} {
      position: relative;
      z-index: 1;
      margin-top: 12px;
      padding: 12px 10px 10px;
      margin-left: -4px;
      margin-right: -4px;
      border-radius: 14px;
      border-top: 1px solid color-mix(in srgb, var(--gf-finish-accent, #CD7F32) 35%, transparent);
      background:
        linear-gradient(
          180deg,
          color-mix(in srgb, var(--gf-finish-soft, rgba(205,127,50,0.16)) 70%, transparent),
          transparent 85%
        );
      font-family: var(--gf-font);
      box-shadow: var(--gf-hc-block-glow, none);
    }

    #${HOVERCARD_BLOCK_ID}.gf-hc-finish--gold,
    #${HOVERCARD_BLOCK_ID}.gf-hc-finish--totw,
    #${HOVERCARD_BLOCK_ID}.gf-hc-finish--toty {
      --gf-hc-block-glow: inset 0 0 20px color-mix(in srgb, var(--gf-finish-soft) 45%, transparent);
    }

    #${HOVERCARD_BLOCK_ID}.gf-hc-finish--icon,
    #${HOVERCARD_BLOCK_ID}.gf-hc-finish--founder {
      --gf-hc-block-glow:
        inset 0 0 28px color-mix(in srgb, var(--gf-finish-soft) 60%, transparent),
        0 0 18px color-mix(in srgb, var(--gf-finish-glow) 25%, transparent);
    }

    #${HOVERCARD_BLOCK_ID} .gf-hc__head {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 8px;
    }

    #${HOVERCARD_BLOCK_ID} .gf-hc__ovr {
      flex: 0 0 auto;
      min-width: 44px;
      padding: 6px 8px;
      border-radius: 8px;
      background:
        linear-gradient(
          145deg,
          var(--gf-finish-shine, rgba(255,255,255,0.35)),
          var(--gf-finish-accent, #CD7F32) 40%,
          var(--gf-finish-deep, #5a3412)
        );
      color: var(--gf-finish-ink, #2A1A0C);
      text-align: center;
      line-height: 1.05;
      box-shadow:
        inset 0 1px 0 color-mix(in srgb, var(--gf-finish-shine) 55%, transparent),
        0 0 0 1px color-mix(in srgb, var(--gf-finish-deep) 35%, transparent),
        var(--gf-hc-ovr-glow, none);
    }

    #${HOVERCARD_BLOCK_ID}.gf-hc-finish--silver .gf-hc__ovr,
    #${HOVERCARD_BLOCK_ID}.gf-hc-finish--gold .gf-hc__ovr {
      --gf-hc-ovr-glow: 0 0 12px color-mix(in srgb, var(--gf-finish-glow) 55%, transparent);
    }

    #${HOVERCARD_BLOCK_ID}.gf-hc-finish--totw .gf-hc__ovr,
    #${HOVERCARD_BLOCK_ID}.gf-hc-finish--toty .gf-hc__ovr,
    #${HOVERCARD_BLOCK_ID}.gf-hc-finish--icon .gf-hc__ovr,
    #${HOVERCARD_BLOCK_ID}.gf-hc-finish--founder .gf-hc__ovr {
      --gf-hc-ovr-glow:
        0 0 16px color-mix(in srgb, var(--gf-finish-glow) 75%, transparent),
        0 0 28px color-mix(in srgb, var(--gf-finish-glow) 35%, transparent);
    }

    #${HOVERCARD_BLOCK_ID} .gf-hc__ovr-value {
      display: block;
      font-size: 18px;
      font-weight: 800;
      letter-spacing: -0.03em;
      font-variant-numeric: tabular-nums;
      text-shadow: 0 1px 0 color-mix(in srgb, var(--gf-finish-shine) 40%, transparent);
    }

    #${HOVERCARD_BLOCK_ID} .gf-hc__ovr-label {
      display: block;
      font-size: 9px;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      opacity: 0.8;
    }

    #${HOVERCARD_BLOCK_ID} .gf-hc__meta {
      min-width: 0;
      flex: 1;
    }

    #${HOVERCARD_BLOCK_ID} .gf-hc__chips {
      display: flex;
      flex-wrap: wrap;
      gap: 5px;
      margin-bottom: 2px;
    }

    #${HOVERCARD_BLOCK_ID} .gf-chip {
      border-color: color-mix(in srgb, var(--gf-finish-accent, #CD7F32) 50%, transparent);
      background: color-mix(in srgb, var(--gf-finish-accent, #CD7F32) 16%, transparent);
    }

    #${HOVERCARD_BLOCK_ID}.gf-hc-finish--gold .gf-chip,
    #${HOVERCARD_BLOCK_ID}.gf-hc-finish--totw .gf-chip,
    #${HOVERCARD_BLOCK_ID}.gf-hc-finish--toty .gf-chip,
    #${HOVERCARD_BLOCK_ID}.gf-hc-finish--icon .gf-chip,
    #${HOVERCARD_BLOCK_ID}.gf-hc-finish--founder .gf-chip {
      box-shadow: 0 0 8px color-mix(in srgb, var(--gf-finish-glow) 30%, transparent);
    }

    #${HOVERCARD_BLOCK_ID} .gf-hc__blurb {
      margin: 0;
      font-size: 11px;
      line-height: 1.35;
      color: var(--fgColor-muted, var(--color-fg-muted, #656d76));
    }

    #${HOVERCARD_BLOCK_ID} .gf-hc__stats {
      display: grid;
      grid-template-columns: repeat(6, minmax(0, 1fr));
      gap: 4px;
      margin: 0 0 8px;
    }

    #${HOVERCARD_BLOCK_ID} .gf-hc__stat {
      text-align: center;
      padding: 5px 2px;
      border-radius: 6px;
      background: color-mix(
        in srgb,
        var(--gf-finish-soft, rgba(205,127,50,0.16)) 35%,
        var(--bgColor-muted, var(--color-canvas-subtle, #f6f8fa))
      );
      border: 1px solid color-mix(in srgb, var(--gf-finish-accent, #CD7F32) 22%, transparent);
    }

    #${HOVERCARD_BLOCK_ID}.gf-hc-finish--toty .gf-hc__stat,
    #${HOVERCARD_BLOCK_ID}.gf-hc-finish--icon .gf-hc__stat,
    #${HOVERCARD_BLOCK_ID}.gf-hc-finish--founder .gf-hc__stat {
      border-color: color-mix(in srgb, var(--gf-finish-accent) 40%, transparent);
      box-shadow: inset 0 0 10px color-mix(in srgb, var(--gf-finish-soft) 40%, transparent);
    }

    #${HOVERCARD_BLOCK_ID} .gf-hc__stat-value {
      display: block;
      font-size: 13px;
      font-weight: 800;
      font-variant-numeric: tabular-nums;
      color: var(--fgColor-default, var(--color-fg-default, #1f2328));
    }

    #${HOVERCARD_BLOCK_ID} .gf-hc__stat-key {
      display: block;
      font-size: 9px;
      font-weight: 700;
      letter-spacing: 0.04em;
      color: var(--fgColor-muted, var(--color-fg-muted, #656d76));
    }

    #${HOVERCARD_BLOCK_ID} .gf-hc__actions {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
    }

    #${HOVERCARD_BLOCK_ID} .gf-hc__link {
      display: inline-flex;
      align-items: center;
      padding: 4px 8px;
      border-radius: 6px;
      font-size: 11px;
      font-weight: 600;
      text-decoration: none !important;
      border: 1px solid var(--borderColor-default, var(--color-border-default, #d0d7de));
      background: var(--bgColor-default, var(--color-canvas-default, #fff));
      color: var(--fgColor-default, var(--color-fg-default, #1f2328)) !important;
    }

    #${HOVERCARD_BLOCK_ID} .gf-hc__link--primary {
      border-color: transparent;
      background:
        linear-gradient(
          145deg,
          var(--gf-finish-shine, rgba(255,255,255,0.35)),
          var(--gf-finish-accent, #CD7F32) 45%,
          var(--gf-finish-deep, #5a3412)
        );
      color: var(--gf-finish-ink, #2A1A0C) !important;
      box-shadow: 0 0 12px color-mix(in srgb, var(--gf-finish-glow) 40%, transparent);
    }

    #${HOVERCARD_BLOCK_ID} .gf-hc__status {
      font-size: 12px;
      color: var(--fgColor-muted, var(--color-fg-muted, #656d76));
    }

    #${HOVERCARD_BLOCK_ID} .gf-hc__status.is-error {
      color: var(--fgColor-danger, var(--color-danger-fg, #d1242f));
    }

    #${HOVERCARD_BLOCK_ID} .gf-skel {
      display: block;
      border-radius: 6px;
      background: linear-gradient(
        90deg,
        color-mix(in srgb, var(--fgColor-muted, #656d76) 10%, transparent) 0%,
        color-mix(in srgb, var(--fgColor-muted, #656d76) 22%, transparent) 45%,
        color-mix(in srgb, var(--fgColor-muted, #656d76) 10%, transparent) 90%
      );
      background-size: 220% 100%;
      animation: gf-skel-shimmer 1.35s ease-in-out infinite;
    }

    #${HOVERCARD_BLOCK_ID} .gf-skel--ovr {
      flex: 0 0 auto;
      width: 44px;
      height: 42px;
      border-radius: 8px;
    }

    #${HOVERCARD_BLOCK_ID} .gf-skel--chip {
      width: 52px;
      height: 18px;
      border-radius: 999px;
    }

    #${HOVERCARD_BLOCK_ID} .gf-skel--blurb {
      width: 88%;
      height: 10px;
      margin-top: 6px;
    }

    #${HOVERCARD_BLOCK_ID} .gf-skel--blurb-short {
      width: 62%;
      margin-top: 5px;
    }

    #${HOVERCARD_BLOCK_ID} .gf-skel--stat {
      height: 36px;
      border-radius: 6px;
    }

    #${HOVERCARD_BLOCK_ID} .gf-skel--btn {
      width: 92px;
      height: 24px;
      border-radius: 6px;
    }

    #${HOVERCARD_BLOCK_ID} .gf-skel--btn-sm {
      width: 48px;
    }

    @keyframes gf-skel-shimmer {
      0% { background-position: 100% 0; }
      100% { background-position: -100% 0; }
    }

    @media (prefers-reduced-motion: reduce) {
      .Popover-message.gf-hc-themed,
      .Popover-message.gf-hc-themed .gf-hc-theme-fx__shine {
        animation: none !important;
      }

      #${PANEL_ID},
      #${PANEL_ID} .gf-panel-theme-fx__shine {
        animation: none !important;
      }

      #${HOVERCARD_BLOCK_ID} .gf-skel,
      #${PANEL_ID} .gf-skel {
        animation: none !important;
        background: color-mix(in srgb, var(--fgColor-muted, #656d76) 14%, transparent);
      }
    }

    /* FIFA theme: metallic finish colors like FUT cards, no glow / shine / pulse */
    html.gf-card-theme-fifa #${PANEL_ID},
    html.gf-card-theme-fifa .Popover-message.gf-hc-themed {
      --gf-panel-outer-glow: 0 0 0 transparent !important;
      --gf-panel-ring: 0 0 0 transparent !important;
      --gf-panel-ovr-glow: none !important;
      --gf-hc-outer-glow: 0 0 0 transparent !important;
      --gf-hc-ring: 0 0 0 transparent !important;
      --gf-hc-ovr-glow: none !important;
      --gf-hc-block-glow: none !important;
      --gf-hc-shine-opacity: 0 !important;
      animation: none !important;
    }

    html.gf-card-theme-fifa #${PANEL_ID} .gf-panel-theme-fx,
    html.gf-card-theme-fifa .Popover-message.gf-hc-themed > .gf-hc-theme-fx,
    html.gf-card-theme-fifa .gf-panel-theme-fx__shine,
    html.gf-card-theme-fifa .gf-hc-theme-fx__shine {
      display: none !important;
    }

    html.gf-card-theme-fifa #${PANEL_ID}.gf-panel-finish--bronze,
    html.gf-card-theme-fifa .Popover-message.gf-hc-finish--bronze {
      --gf-fifa-ink: #2A1810;
      --gf-fifa-muted: #6B4A32;
      --gf-fifa-border: #8B5A2B;
      --gf-fifa-ovr-top: #D4A574;
      --gf-fifa-ovr-bot: #8B5A2B;
      --gf-fifa-ovr-ink: #1F120A;
      --gf-fifa-stat: rgba(139, 90, 43, 0.18);
      --gf-fifa-chip: rgba(139, 90, 43, 0.22);
      background: linear-gradient(165deg, #E8C9A0 0%, #C9956C 42%, #A67C52 100%) !important;
      border-color: var(--gf-fifa-border) !important;
      color: var(--gf-fifa-ink);
      box-shadow: inset 0 1px 0 rgba(255, 240, 220, 0.45), 0 2px 8px rgba(90, 50, 20, 0.18) !important;
    }

    html.gf-card-theme-fifa #${PANEL_ID}.gf-panel-finish--silver,
    html.gf-card-theme-fifa .Popover-message.gf-hc-finish--silver {
      --gf-fifa-ink: #1A1E24;
      --gf-fifa-muted: #5A6270;
      --gf-fifa-border: #8A93A0;
      --gf-fifa-ovr-top: #E8ECF0;
      --gf-fifa-ovr-bot: #8A93A0;
      --gf-fifa-ovr-ink: #1A1E24;
      --gf-fifa-stat: rgba(90, 98, 112, 0.16);
      --gf-fifa-chip: rgba(90, 98, 112, 0.2);
      background: linear-gradient(165deg, #F2F4F7 0%, #C5CBD4 45%, #9AA3B0 100%) !important;
      border-color: var(--gf-fifa-border) !important;
      color: var(--gf-fifa-ink);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7), 0 2px 8px rgba(40, 50, 70, 0.14) !important;
    }

    html.gf-card-theme-fifa #${PANEL_ID}.gf-panel-finish--gold,
    html.gf-card-theme-fifa .Popover-message.gf-hc-finish--gold {
      --gf-fifa-ink: #2A2008;
      --gf-fifa-muted: #7A6520;
      --gf-fifa-border: #C9A227;
      --gf-fifa-ovr-top: #FFE28A;
      --gf-fifa-ovr-bot: #C9A227;
      --gf-fifa-ovr-ink: #2A2008;
      --gf-fifa-stat: rgba(201, 162, 39, 0.22);
      --gf-fifa-chip: rgba(201, 162, 39, 0.28);
      background: linear-gradient(165deg, #FFE9A8 0%, #E8C547 42%, #C9A227 100%) !important;
      border-color: var(--gf-fifa-border) !important;
      color: var(--gf-fifa-ink);
      box-shadow: inset 0 1px 0 rgba(255, 248, 220, 0.65), 0 2px 8px rgba(120, 90, 20, 0.16) !important;
    }

    html.gf-card-theme-fifa #${PANEL_ID}.gf-panel-finish--totw,
    html.gf-card-theme-fifa .Popover-message.gf-hc-finish--totw {
      --gf-fifa-ink: #F5F5F5;
      --gf-fifa-muted: #B0B0B0;
      --gf-fifa-border: #E03E52;
      --gf-fifa-ovr-top: #F0D060;
      --gf-fifa-ovr-bot: #C9A227;
      --gf-fifa-ovr-ink: #1A1405;
      --gf-fifa-stat: rgba(224, 62, 82, 0.22);
      --gf-fifa-chip: rgba(224, 62, 82, 0.28);
      background: linear-gradient(165deg, #3A3A3A 0%, #1E1E1E 50%, #121212 100%) !important;
      border-color: var(--gf-fifa-border) !important;
      color: var(--gf-fifa-ink);
      box-shadow: inset 0 0 0 1px rgba(224, 62, 82, 0.35), 0 2px 10px rgba(0, 0, 0, 0.35) !important;
    }

    html.gf-card-theme-fifa #${PANEL_ID}.gf-panel-finish--toty,
    html.gf-card-theme-fifa .Popover-message.gf-hc-finish--toty {
      --gf-fifa-ink: #E8F0FF;
      --gf-fifa-muted: #9BB4DE;
      --gf-fifa-border: #3B7AFF;
      --gf-fifa-ovr-top: #7EB0FF;
      --gf-fifa-ovr-bot: #2A5FD4;
      --gf-fifa-ovr-ink: #0A1630;
      --gf-fifa-stat: rgba(59, 122, 255, 0.28);
      --gf-fifa-chip: rgba(59, 122, 255, 0.32);
      background: linear-gradient(165deg, #1A3A6E 0%, #0B1B3D 55%, #071228 100%) !important;
      border-color: var(--gf-fifa-border) !important;
      color: var(--gf-fifa-ink);
      box-shadow: inset 0 0 0 1px rgba(59, 122, 255, 0.4), 0 2px 10px rgba(8, 20, 50, 0.4) !important;
    }

    html.gf-card-theme-fifa #${PANEL_ID}.gf-panel-finish--icon,
    html.gf-card-theme-fifa .Popover-message.gf-hc-finish--icon {
      --gf-fifa-ink: #F5E6C8;
      --gf-fifa-muted: #C4B08A;
      --gf-fifa-border: #F3D688;
      --gf-fifa-ovr-top: #F3D688;
      --gf-fifa-ovr-bot: #B8944A;
      --gf-fifa-ovr-ink: #2A1A45;
      --gf-fifa-stat: rgba(180, 120, 255, 0.22);
      --gf-fifa-chip: rgba(243, 214, 136, 0.28);
      background: linear-gradient(165deg, #4A2A7A 0%, #2A1A4A 50%, #1A0F30 100%) !important;
      border-color: var(--gf-fifa-border) !important;
      color: var(--gf-fifa-ink);
      box-shadow: inset 0 0 0 1px rgba(243, 214, 136, 0.35), 0 2px 10px rgba(30, 15, 60, 0.4) !important;
    }

    html.gf-card-theme-fifa #${PANEL_ID}.gf-panel-finish--founder,
    html.gf-card-theme-fifa .Popover-message.gf-hc-finish--founder {
      --gf-fifa-ink: #FFE4EC;
      --gf-fifa-muted: #E0A0B0;
      --gf-fifa-border: #FF5A7A;
      --gf-fifa-ovr-top: #FF8AA0;
      --gf-fifa-ovr-bot: #D43055;
      --gf-fifa-ovr-ink: #3A0A18;
      --gf-fifa-stat: rgba(255, 90, 122, 0.28);
      --gf-fifa-chip: rgba(255, 90, 122, 0.32);
      background: linear-gradient(165deg, #5A2030 0%, #3A0A18 55%, #250610 100%) !important;
      border-color: var(--gf-fifa-border) !important;
      color: var(--gf-fifa-ink);
      box-shadow: inset 0 0 0 1px rgba(255, 90, 122, 0.4), 0 2px 10px rgba(40, 8, 18, 0.4) !important;
    }

    html.gf-card-theme-fifa #${PANEL_ID} .gf-panel__head {
      border-bottom-color: color-mix(in srgb, var(--gf-fifa-border, #8B5A2B) 45%, transparent) !important;
      background: linear-gradient(
        180deg,
        color-mix(in srgb, var(--gf-fifa-ovr-top, #D4A574) 22%, transparent),
        transparent
      ) !important;
    }

    html.gf-card-theme-fifa #${PANEL_ID} .gf-panel__name,
    html.gf-card-theme-fifa #${PANEL_ID} .gf-stat__value,
    html.gf-card-theme-fifa #${PANEL_ID} .gf-attrs,
    html.gf-card-theme-fifa #${PANEL_ID} .gf-attrs__value,
    html.gf-card-theme-fifa #${HOVERCARD_BLOCK_ID} .gf-hc__stat-value {
      color: var(--gf-fifa-ink, inherit) !important;
    }

    html.gf-card-theme-fifa #${PANEL_ID} .gf-panel__blurb,
    html.gf-card-theme-fifa #${PANEL_ID} .gf-stat__key,
    html.gf-card-theme-fifa #${PANEL_ID} .gf-attrs__label,
    html.gf-card-theme-fifa #${HOVERCARD_BLOCK_ID} .gf-hc__blurb,
    html.gf-card-theme-fifa #${HOVERCARD_BLOCK_ID} .gf-hc__stat-key {
      color: var(--gf-fifa-muted, inherit) !important;
    }

    html.gf-card-theme-fifa #${PANEL_ID} .gf-panel__ovr,
    html.gf-card-theme-fifa #${HOVERCARD_BLOCK_ID} .gf-hc__ovr {
      background: linear-gradient(180deg, var(--gf-fifa-ovr-top), var(--gf-fifa-ovr-bot)) !important;
      color: var(--gf-fifa-ovr-ink) !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.35),
        0 0 0 1px color-mix(in srgb, var(--gf-fifa-border) 55%, #000) !important;
      text-shadow: none !important;
    }

    html.gf-card-theme-fifa #${PANEL_ID} .gf-panel__ovr-value,
    html.gf-card-theme-fifa #${HOVERCARD_BLOCK_ID} .gf-hc__ovr-value {
      text-shadow: none !important;
      color: inherit !important;
    }

    html.gf-card-theme-fifa #${PANEL_ID} .gf-chip,
    html.gf-card-theme-fifa #${HOVERCARD_BLOCK_ID} .gf-chip,
    html.gf-card-theme-fifa .gf-playstyle.is-plus {
      box-shadow: none !important;
      border-color: color-mix(in srgb, var(--gf-fifa-border) 70%, transparent) !important;
      background: var(--gf-fifa-chip) !important;
      color: var(--gf-fifa-ink) !important;
    }

    html.gf-card-theme-fifa .gf-playstyle:not(.is-plus) {
      border-color: color-mix(in srgb, var(--gf-fifa-border) 40%, transparent) !important;
      background: color-mix(in srgb, var(--gf-fifa-ink) 6%, transparent) !important;
      color: var(--gf-fifa-ink) !important;
    }

    html.gf-card-theme-fifa #${PANEL_ID} .gf-stat,
    html.gf-card-theme-fifa #${HOVERCARD_BLOCK_ID} .gf-hc__stat {
      box-shadow: none !important;
      border-color: color-mix(in srgb, var(--gf-fifa-border) 40%, transparent) !important;
      background: var(--gf-fifa-stat) !important;
    }

    html.gf-card-theme-fifa #${PANEL_ID} .gf-attrs {
      box-shadow: none !important;
      border-color: color-mix(in srgb, var(--gf-fifa-border) 35%, transparent) !important;
      background: var(--gf-fifa-stat) !important;
    }

    html.gf-card-theme-fifa #${HOVERCARD_BLOCK_ID} {
      border-top-color: color-mix(in srgb, var(--gf-fifa-border) 50%, transparent) !important;
      background: linear-gradient(
        180deg,
        color-mix(in srgb, var(--gf-fifa-ovr-top, transparent) 18%, transparent),
        transparent 80%
      ) !important;
      box-shadow: none !important;
    }

    html.gf-card-theme-fifa #${PANEL_ID} .gf-btn-link {
      border-color: color-mix(in srgb, var(--gf-fifa-border) 45%, transparent) !important;
      background: color-mix(in srgb, var(--gf-fifa-ink) 8%, transparent) !important;
      color: var(--gf-fifa-ink) !important;
    }

    html.gf-card-theme-fifa #${PANEL_ID} .gf-btn-link:hover {
      background: color-mix(in srgb, var(--gf-fifa-ink) 14%, transparent) !important;
    }

    html.gf-card-theme-fifa #${HOVERCARD_BLOCK_ID} .gf-hc__link {
      border-color: color-mix(in srgb, var(--gf-fifa-border) 45%, transparent) !important;
      background: color-mix(in srgb, var(--gf-fifa-ink) 8%, transparent) !important;
      color: var(--gf-fifa-ink) !important;
    }

    html.gf-card-theme-fifa #${PANEL_ID} .gf-btn-link--primary,
    html.gf-card-theme-fifa #${HOVERCARD_BLOCK_ID} .gf-hc__link--primary {
      border-color: transparent !important;
      background: linear-gradient(180deg, var(--gf-fifa-ovr-top), var(--gf-fifa-ovr-bot)) !important;
      color: var(--gf-fifa-ovr-ink) !important;
      box-shadow: none !important;
      filter: none !important;
    }

    html.gf-card-theme-fifa #${PANEL_ID} .gf-btn-link--primary:hover,
    html.gf-card-theme-fifa #${HOVERCARD_BLOCK_ID} .gf-hc__link--primary:hover {
      filter: brightness(1.05) !important;
      background: linear-gradient(180deg, var(--gf-fifa-ovr-top), var(--gf-fifa-ovr-bot)) !important;
    }

    /* Neon theme: dark glass + finish-colored neon glow */
    html.gf-card-theme-neon #${PANEL_ID},
    html.gf-card-theme-neon .Popover-message.gf-hc-themed {
      --gf-neon: #FF9F43;
      --gf-neon-ink: #FFE8D0;
      --gf-neon-muted: #B89878;
      --gf-panel-outer-glow: 0 0 0 transparent !important;
      --gf-panel-ring: 0 0 0 transparent !important;
      --gf-panel-ovr-glow: none !important;
      --gf-hc-outer-glow: 0 0 0 transparent !important;
      --gf-hc-ring: 0 0 0 transparent !important;
      --gf-hc-ovr-glow: none !important;
      --gf-hc-block-glow: none !important;
      --gf-hc-shine-opacity: 0 !important;
      animation: none !important;
      color: var(--gf-neon-ink);
      border-color: color-mix(in srgb, var(--gf-neon) 75%, #fff) !important;
      background:
        radial-gradient(120% 80% at 0% 0%, color-mix(in srgb, var(--gf-neon) 28%, transparent), transparent 55%),
        radial-gradient(90% 70% at 100% 100%, color-mix(in srgb, var(--gf-neon) 18%, transparent), transparent 60%),
        linear-gradient(165deg, #161622 0%, #0B0B14 100%) !important;
      box-shadow:
        0 0 0 1px color-mix(in srgb, var(--gf-neon) 55%, transparent),
        0 0 18px color-mix(in srgb, var(--gf-neon) 45%, transparent),
        0 0 42px color-mix(in srgb, var(--gf-neon) 22%, transparent),
        inset 0 0 28px color-mix(in srgb, var(--gf-neon) 10%, transparent) !important;
    }

    html.gf-card-theme-neon #${PANEL_ID}.gf-panel-finish--bronze,
    html.gf-card-theme-neon .Popover-message.gf-hc-finish--bronze {
      --gf-neon: #FF9F43;
      --gf-neon-ink: #FFE8D0;
      --gf-neon-muted: #C4A07A;
    }

    html.gf-card-theme-neon #${PANEL_ID}.gf-panel-finish--silver,
    html.gf-card-theme-neon .Popover-message.gf-hc-finish--silver {
      --gf-neon: #B8C4FF;
      --gf-neon-ink: #EEF1FF;
      --gf-neon-muted: #9AA3C8;
    }

    html.gf-card-theme-neon #${PANEL_ID}.gf-panel-finish--gold,
    html.gf-card-theme-neon .Popover-message.gf-hc-finish--gold {
      --gf-neon: #FFD60A;
      --gf-neon-ink: #FFF6C8;
      --gf-neon-muted: #C9B45A;
    }

    html.gf-card-theme-neon #${PANEL_ID}.gf-panel-finish--totw,
    html.gf-card-theme-neon .Popover-message.gf-hc-finish--totw {
      --gf-neon: #FF2E63;
      --gf-neon-ink: #FFD6E0;
      --gf-neon-muted: #D08098;
    }

    html.gf-card-theme-neon #${PANEL_ID}.gf-panel-finish--toty,
    html.gf-card-theme-neon .Popover-message.gf-hc-finish--toty {
      --gf-neon: #00F0FF;
      --gf-neon-ink: #D7FBFF;
      --gf-neon-muted: #74B8C4;
    }

    html.gf-card-theme-neon #${PANEL_ID}.gf-panel-finish--icon,
    html.gf-card-theme-neon .Popover-message.gf-hc-finish--icon {
      --gf-neon: #C77DFF;
      --gf-neon-ink: #F3E6FF;
      --gf-neon-muted: #B090D0;
    }

    html.gf-card-theme-neon #${PANEL_ID}.gf-panel-finish--founder,
    html.gf-card-theme-neon .Popover-message.gf-hc-finish--founder {
      --gf-neon: #FF6BCB;
      --gf-neon-ink: #FFE3F4;
      --gf-neon-muted: #D090B8;
    }

    html.gf-card-theme-neon #${PANEL_ID} .gf-panel-theme-fx,
    html.gf-card-theme-neon .Popover-message.gf-hc-themed > .gf-hc-theme-fx {
      display: block !important;
    }

    html.gf-card-theme-neon .gf-panel-theme-fx__shine,
    html.gf-card-theme-neon .gf-hc-theme-fx__shine {
      display: block !important;
      animation: none !important;
      background: radial-gradient(
        60% 50% at 50% 0%,
        color-mix(in srgb, var(--gf-neon) 35%, transparent),
        transparent 70%
      ) !important;
      background-size: 100% 100% !important;
      background-position: 0 0 !important;
      opacity: 0.7 !important;
    }

    html.gf-card-theme-neon #${PANEL_ID}.gf-panel-finish--totw,
    html.gf-card-theme-neon #${PANEL_ID}.gf-panel-finish--toty,
    html.gf-card-theme-neon #${PANEL_ID}.gf-panel-finish--icon,
    html.gf-card-theme-neon #${PANEL_ID}.gf-panel-finish--founder,
    html.gf-card-theme-neon .Popover-message.gf-hc-finish--totw,
    html.gf-card-theme-neon .Popover-message.gf-hc-finish--toty,
    html.gf-card-theme-neon .Popover-message.gf-hc-finish--icon,
    html.gf-card-theme-neon .Popover-message.gf-hc-finish--founder {
      animation: gf-neon-pulse 2.6s ease-in-out infinite !important;
    }

    @keyframes gf-neon-pulse {
      0%, 100% {
        box-shadow:
          0 0 0 1px color-mix(in srgb, var(--gf-neon) 55%, transparent),
          0 0 16px color-mix(in srgb, var(--gf-neon) 40%, transparent),
          0 0 36px color-mix(in srgb, var(--gf-neon) 18%, transparent),
          inset 0 0 24px color-mix(in srgb, var(--gf-neon) 8%, transparent);
      }
      50% {
        box-shadow:
          0 0 0 1px color-mix(in srgb, var(--gf-neon) 80%, transparent),
          0 0 26px color-mix(in srgb, var(--gf-neon) 65%, transparent),
          0 0 56px color-mix(in srgb, var(--gf-neon) 32%, transparent),
          inset 0 0 34px color-mix(in srgb, var(--gf-neon) 14%, transparent);
      }
    }

    html.gf-card-theme-neon #${PANEL_ID} .gf-panel__head {
      border-bottom-color: color-mix(in srgb, var(--gf-neon) 35%, transparent) !important;
      background: linear-gradient(
        180deg,
        color-mix(in srgb, var(--gf-neon) 16%, transparent),
        transparent
      ) !important;
    }

    html.gf-card-theme-neon #${PANEL_ID} .gf-panel__name,
    html.gf-card-theme-neon #${PANEL_ID} .gf-stat__value,
    html.gf-card-theme-neon #${PANEL_ID} .gf-attrs,
    html.gf-card-theme-neon #${PANEL_ID} .gf-attrs__value,
    html.gf-card-theme-neon #${HOVERCARD_BLOCK_ID} .gf-hc__stat-value {
      color: var(--gf-neon-ink) !important;
    }

    html.gf-card-theme-neon #${PANEL_ID} .gf-panel__blurb,
    html.gf-card-theme-neon #${PANEL_ID} .gf-stat__key,
    html.gf-card-theme-neon #${PANEL_ID} .gf-attrs__label,
    html.gf-card-theme-neon #${HOVERCARD_BLOCK_ID} .gf-hc__blurb,
    html.gf-card-theme-neon #${HOVERCARD_BLOCK_ID} .gf-hc__stat-key {
      color: var(--gf-neon-muted) !important;
    }

    html.gf-card-theme-neon #${PANEL_ID} .gf-panel__ovr,
    html.gf-card-theme-neon #${HOVERCARD_BLOCK_ID} .gf-hc__ovr {
      background: color-mix(in srgb, var(--gf-neon) 18%, #0A0A12) !important;
      color: var(--gf-neon) !important;
      box-shadow:
        0 0 0 1px color-mix(in srgb, var(--gf-neon) 70%, transparent),
        0 0 14px color-mix(in srgb, var(--gf-neon) 55%, transparent),
        inset 0 0 12px color-mix(in srgb, var(--gf-neon) 18%, transparent) !important;
      text-shadow: 0 0 10px color-mix(in srgb, var(--gf-neon) 70%, transparent) !important;
    }

    html.gf-card-theme-neon #${PANEL_ID} .gf-panel__ovr-value,
    html.gf-card-theme-neon #${PANEL_ID} .gf-panel__ovr-label,
    html.gf-card-theme-neon #${HOVERCARD_BLOCK_ID} .gf-hc__ovr-value,
    html.gf-card-theme-neon #${HOVERCARD_BLOCK_ID} .gf-hc__ovr-label {
      color: inherit !important;
      text-shadow: inherit !important;
    }

    html.gf-card-theme-neon #${PANEL_ID} .gf-chip,
    html.gf-card-theme-neon #${HOVERCARD_BLOCK_ID} .gf-chip,
    html.gf-card-theme-neon .gf-playstyle.is-plus {
      border-color: color-mix(in srgb, var(--gf-neon) 65%, transparent) !important;
      background: color-mix(in srgb, var(--gf-neon) 14%, transparent) !important;
      color: var(--gf-neon-ink) !important;
      box-shadow: 0 0 10px color-mix(in srgb, var(--gf-neon) 28%, transparent) !important;
    }

    html.gf-card-theme-neon .gf-playstyle:not(.is-plus) {
      border-color: color-mix(in srgb, var(--gf-neon) 35%, transparent) !important;
      background: color-mix(in srgb, var(--gf-neon) 8%, transparent) !important;
      color: var(--gf-neon-ink) !important;
    }

    html.gf-card-theme-neon #${PANEL_ID} .gf-stat,
    html.gf-card-theme-neon #${HOVERCARD_BLOCK_ID} .gf-hc__stat,
    html.gf-card-theme-neon #${PANEL_ID} .gf-attrs {
      border-color: color-mix(in srgb, var(--gf-neon) 35%, transparent) !important;
      background: color-mix(in srgb, var(--gf-neon) 10%, #0A0A12) !important;
      box-shadow: inset 0 0 12px color-mix(in srgb, var(--gf-neon) 8%, transparent) !important;
    }

    html.gf-card-theme-neon #${HOVERCARD_BLOCK_ID} {
      border-top-color: color-mix(in srgb, var(--gf-neon) 40%, transparent) !important;
      background: linear-gradient(
        180deg,
        color-mix(in srgb, var(--gf-neon) 14%, transparent),
        transparent 85%
      ) !important;
      box-shadow: none !important;
    }

    html.gf-card-theme-neon #${PANEL_ID} .gf-btn-link,
    html.gf-card-theme-neon #${HOVERCARD_BLOCK_ID} .gf-hc__link {
      border-color: color-mix(in srgb, var(--gf-neon) 45%, transparent) !important;
      background: color-mix(in srgb, var(--gf-neon) 10%, transparent) !important;
      color: var(--gf-neon-ink) !important;
    }

    html.gf-card-theme-neon #${PANEL_ID} .gf-btn-link:hover,
    html.gf-card-theme-neon #${HOVERCARD_BLOCK_ID} .gf-hc__link:hover {
      background: color-mix(in srgb, var(--gf-neon) 18%, transparent) !important;
    }

    html.gf-card-theme-neon #${PANEL_ID} .gf-btn-link--primary,
    html.gf-card-theme-neon #${HOVERCARD_BLOCK_ID} .gf-hc__link--primary {
      border-color: transparent !important;
      background: color-mix(in srgb, var(--gf-neon) 22%, #0A0A12) !important;
      color: var(--gf-neon) !important;
      box-shadow:
        0 0 0 1px color-mix(in srgb, var(--gf-neon) 60%, transparent),
        0 0 16px color-mix(in srgb, var(--gf-neon) 40%, transparent) !important;
      text-shadow: 0 0 8px color-mix(in srgb, var(--gf-neon) 50%, transparent);
      filter: none !important;
    }

    html.gf-card-theme-neon #${PANEL_ID} .gf-btn-link--primary:hover,
    html.gf-card-theme-neon #${HOVERCARD_BLOCK_ID} .gf-hc__link--primary:hover {
      filter: brightness(1.08) !important;
      background: color-mix(in srgb, var(--gf-neon) 28%, #0A0A12) !important;
    }

    @media (prefers-reduced-motion: reduce) {
      html.gf-card-theme-neon #${PANEL_ID},
      html.gf-card-theme-neon .Popover-message.gf-hc-themed {
        animation: none !important;
      }
    }

    /* GitHub theme: Primer tokens, no glow / shine / finish flash */
    html.gf-card-theme-github #${PANEL_ID},
    html.gf-card-theme-github .Popover-message.gf-hc-themed {
      --gf-panel-outer-glow: 0 0 0 transparent !important;
      --gf-panel-ring: 0 0 0 transparent !important;
      --gf-panel-ovr-glow: none !important;
      --gf-hc-outer-glow: 0 0 0 transparent !important;
      --gf-hc-ring: 0 0 0 transparent !important;
      --gf-hc-ovr-glow: none !important;
      --gf-hc-block-glow: none !important;
      --gf-hc-shine-opacity: 0 !important;
      animation: none !important;
      color: var(--fgColor-default, var(--color-fg-default, #1f2328));
      border-color: var(--borderColor-default, var(--color-border-default, #d0d7de)) !important;
      border-radius: 6px !important;
      background: var(--bgColor-default, var(--color-canvas-default, #fff)) !important;
      box-shadow: none !important;
    }

    html.gf-card-theme-github #${PANEL_ID} .gf-panel-theme-fx,
    html.gf-card-theme-github .Popover-message.gf-hc-themed > .gf-hc-theme-fx,
    html.gf-card-theme-github .gf-panel-theme-fx__shine,
    html.gf-card-theme-github .gf-hc-theme-fx__shine {
      display: none !important;
    }

    html.gf-card-theme-github #${PANEL_ID} .gf-panel__head {
      background: transparent !important;
      border-bottom-color: var(--borderColor-muted, var(--color-border-muted, rgba(27,31,36,0.15))) !important;
      padding: 12px;
    }

    html.gf-card-theme-github #${PANEL_ID} .gf-panel__name,
    html.gf-card-theme-github #${PANEL_ID} .gf-stat__value,
    html.gf-card-theme-github #${PANEL_ID} .gf-attrs,
    html.gf-card-theme-github #${PANEL_ID} .gf-attrs__value,
    html.gf-card-theme-github #${HOVERCARD_BLOCK_ID} .gf-hc__stat-value {
      color: var(--fgColor-default, var(--color-fg-default, #1f2328)) !important;
    }

    html.gf-card-theme-github #${PANEL_ID} .gf-panel__blurb,
    html.gf-card-theme-github #${PANEL_ID} .gf-stat__key,
    html.gf-card-theme-github #${PANEL_ID} .gf-attrs__label,
    html.gf-card-theme-github #${HOVERCARD_BLOCK_ID} .gf-hc__blurb,
    html.gf-card-theme-github #${HOVERCARD_BLOCK_ID} .gf-hc__stat-key {
      color: var(--fgColor-muted, var(--color-fg-muted, #656d76)) !important;
    }

    html.gf-card-theme-github #${PANEL_ID} .gf-panel__ovr,
    html.gf-card-theme-github #${HOVERCARD_BLOCK_ID} .gf-hc__ovr {
      background: color-mix(
        in srgb,
        var(--gf-finish-accent, #656d76) 20%,
        var(--bgColor-muted, var(--color-canvas-subtle, #f6f8fa))
      ) !important;
      color: var(--gf-finish-accent, var(--fgColor-default, #1f2328)) !important;
      border: 1px solid color-mix(
        in srgb,
        var(--gf-finish-accent, #656d76) 70%,
        var(--borderColor-default, var(--color-border-default, #d0d7de))
      ) !important;
      border-radius: 6px !important;
      box-shadow: none !important;
      min-width: 48px;
      padding: 6px 8px;
    }

    html.gf-card-theme-github #${PANEL_ID} .gf-panel__ovr-value,
    html.gf-card-theme-github #${HOVERCARD_BLOCK_ID} .gf-hc__ovr-value {
      text-shadow: none !important;
      font-weight: 700;
      letter-spacing: -0.02em;
      color: var(--gf-finish-accent, var(--fgColor-default, #1f2328)) !important;
    }

    html.gf-card-theme-github #${PANEL_ID} .gf-panel__ovr-label,
    html.gf-card-theme-github #${HOVERCARD_BLOCK_ID} .gf-hc__ovr-label {
      opacity: 0.9;
      color: var(--gf-finish-accent, var(--fgColor-muted, #656d76)) !important;
      font-weight: 600;
    }

    html.gf-card-theme-github #${PANEL_ID} .gf-chip,
    html.gf-card-theme-github #${HOVERCARD_BLOCK_ID} .gf-chip,
    html.gf-card-theme-github .gf-playstyle.is-plus {
      box-shadow: none !important;
      border-radius: 2em !important;
      border-color: var(--borderColor-default, var(--color-border-default, #d0d7de)) !important;
      background: var(--bgColor-muted, var(--color-canvas-subtle, #f6f8fa)) !important;
      color: var(--fgColor-default, var(--color-fg-default, #1f2328)) !important;
    }

    html.gf-card-theme-github #${PANEL_ID} .gf-chip--finish,
    html.gf-card-theme-github #${HOVERCARD_BLOCK_ID} .gf-chip--finish {
      border-color: color-mix(
        in srgb,
        var(--gf-finish-accent, #656d76) 28%,
        var(--borderColor-default, #d0d7de)
      ) !important;
      background: color-mix(
        in srgb,
        var(--gf-finish-accent, #656d76) 8%,
        var(--bgColor-muted, #f6f8fa)
      ) !important;
    }

    html.gf-card-theme-github #${PANEL_ID} .gf-stat,
    html.gf-card-theme-github #${HOVERCARD_BLOCK_ID} .gf-hc__stat {
      box-shadow: none !important;
      border-color: var(--borderColor-muted, var(--color-border-muted, rgba(27,31,36,0.15))) !important;
      background: var(--bgColor-muted, var(--color-canvas-subtle, #f6f8fa)) !important;
      border-radius: 6px !important;
    }

    html.gf-card-theme-github #${PANEL_ID} .gf-attrs {
      box-shadow: none !important;
      border-color: var(--borderColor-muted, var(--color-border-muted, rgba(27,31,36,0.15))) !important;
      background: var(--bgColor-muted, var(--color-canvas-subtle, #f6f8fa)) !important;
      border-radius: 6px !important;
    }

    html.gf-card-theme-github #${HOVERCARD_BLOCK_ID} {
      border-top-color: var(--borderColor-muted, var(--color-border-muted, rgba(27,31,36,0.15))) !important;
      background: transparent !important;
      box-shadow: none !important;
    }

    html.gf-card-theme-github #${PANEL_ID} .gf-btn-link,
    html.gf-card-theme-github #${HOVERCARD_BLOCK_ID} .gf-hc__link {
      border-color: var(--borderColor-default, var(--color-border-default, #d0d7de)) !important;
      background: var(--button-default-bgColor-rest, var(--color-btn-bg, #f6f8fa)) !important;
      color: var(--fgColor-default, var(--color-fg-default, #1f2328)) !important;
      border-radius: 6px !important;
      box-shadow: none !important;
      filter: none !important;
    }

    html.gf-card-theme-github #${PANEL_ID} .gf-btn-link:hover,
    html.gf-card-theme-github #${HOVERCARD_BLOCK_ID} .gf-hc__link:hover {
      background: var(--button-default-bgColor-hover, var(--color-btn-hover-bg, #f3f4f6)) !important;
      border-color: var(--button-default-borderColor-hover, var(--color-btn-hover-border, #d0d7de)) !important;
      filter: none !important;
    }

    html.gf-card-theme-github #${PANEL_ID} .gf-btn-link--primary,
    html.gf-card-theme-github #${HOVERCARD_BLOCK_ID} .gf-hc__link--primary {
      border-color: var(--button-primary-borderColor-rest, rgba(31, 35, 40, 0.15)) !important;
      background: var(--button-primary-bgColor-rest, var(--color-btn-primary-bg, #1f883d)) !important;
      color: var(--button-primary-fgColor-rest, var(--color-btn-primary-text, #fff)) !important;
      box-shadow: none !important;
      filter: none !important;
    }

    html.gf-card-theme-github #${PANEL_ID} .gf-btn-link--primary:hover,
    html.gf-card-theme-github #${HOVERCARD_BLOCK_ID} .gf-hc__link--primary:hover {
      background: var(--button-primary-bgColor-hover, var(--color-btn-primary-hover-bg, #1a7f37)) !important;
      border-color: var(--button-primary-borderColor-hover, rgba(31, 35, 40, 0.15)) !important;
      filter: none !important;
    }

    html.gf-card-theme-github #${PANEL_ID} .gf-playstyle,
    html.gf-card-theme-github #${HOVERCARD_BLOCK_ID} .gf-playstyle {
      border-color: var(--borderColor-muted, rgba(27,31,36,0.15)) !important;
      background: var(--bgColor-muted, #f6f8fa) !important;
      color: var(--fgColor-default, #1f2328) !important;
      box-shadow: none !important;
    }

    #gf-user-menu-item .gf-nav-dot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: var(--fgColor-muted, #8b949e);
      display: inline-block;
      flex-shrink: 0;
    }

    #gf-user-menu-item .gf-nav-dot.is-on {
      background: #3fb950;
    }

    .gf-settings-panel {
      position: fixed;
      z-index: 10000;
      width: 360px;
      max-width: calc(100vw - 16px);
      border-radius: 12px;
      border: 1px solid var(--borderColor-default, var(--color-border-default, #d0d7de));
      background: var(--bgColor-default, var(--color-canvas-default, #fff));
      box-shadow: 0 16px 40px rgba(1,4,9,0.28);
      font-family: var(--gf-font);
      color: var(--fgColor-default, var(--color-fg-default, #1f2328));
    }

    .gf-settings-panel[hidden] { display: none !important; }

    .gf-settings-panel__header {
      display: flex;
      justify-content: space-between;
      gap: 12px;
      padding: 14px 14px 10px;
      border-bottom: 1px solid var(--borderColor-muted, rgba(27,31,36,0.08));
    }

    .gf-settings-panel__title {
      font-size: 15px;
      font-weight: 700;
    }

    .gf-settings-panel__subtitle {
      margin-top: 2px;
      font-size: 12px;
      color: var(--fgColor-muted, var(--color-fg-muted, #656d76));
    }

    .gf-settings-panel__version {
      margin-top: 4px;
      font-size: 11px;
      font-weight: 600;
      font-variant-numeric: tabular-nums;
      letter-spacing: 0.02em;
      color: var(--fgColor-muted, var(--color-fg-muted, #656d76));
    }

    .gf-cache-stats {
      margin: 0 0 12px;
      padding: 10px 11px;
      border-radius: 8px;
      border: 1px solid var(--borderColor-muted, rgba(27,31,36,0.08));
      background: var(--bgColor-muted, var(--color-canvas-subtle, #f6f8fa));
    }

    .gf-cache-stats__count {
      font-size: 13px;
      font-weight: 600;
      color: var(--fgColor-default, var(--color-fg-default, #1f2328));
    }

    .gf-cache-stats__storage {
      margin: 4px 0 0;
      font-size: 12px;
      font-variant-numeric: tabular-nums;
      color: var(--fgColor-muted, var(--color-fg-muted, #656d76));
    }

    .gf-cache-stats__bar {
      margin-top: 8px;
      height: 8px;
      border-radius: 999px;
      overflow: hidden;
      background: color-mix(in srgb, var(--fgColor-muted, #656d76) 16%, transparent);
    }

    .gf-cache-stats__bar-fill {
      height: 100%;
      width: 100%;
      border-radius: inherit;
      background: #3fb950;
      transition: width 0.25s ease, background 0.25s ease;
    }

    .gf-cache-stats__bar.is-warn .gf-cache-stats__bar-fill {
      background: #d29922;
    }

    .gf-cache-stats__bar.is-full .gf-cache-stats__bar-fill {
      background: #cf222e;
    }

    .gf-cache-stats__hint {
      margin: 6px 0 0;
    }

    .gf-settings-panel__close {
      border: 0;
      background: transparent;
      font-size: 20px;
      line-height: 1;
      cursor: pointer;
      color: var(--fgColor-muted, #656d76);
    }

    .gf-settings-panel__section {
      padding: 12px 14px;
    }

    .gf-settings-panel__section-title {
      margin-bottom: 8px;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--fgColor-muted, #656d76);
    }

    .gf-field {
      display: grid;
      gap: 6px;
      margin-bottom: 8px;
    }

    .gf-field__label {
      font-size: 12px;
      font-weight: 600;
    }

    .gf-field input[type="number"],
    .gf-field select {
      width: 100%;
      padding: 7px 9px;
      border-radius: 6px;
      border: 1px solid var(--borderColor-default, #d0d7de);
      background: var(--bgColor-default, #fff);
      color: inherit;
    }

    .gf-hint {
      margin: 0 0 8px;
      font-size: 12px;
      color: var(--fgColor-muted, #656d76);
      line-height: 1.35;
    }

    .gf-switch {
      display: flex;
      align-items: center;
      gap: 10px;
      cursor: pointer;
      font-size: 13px;
      font-weight: 600;
    }

    .gf-switch input { accent-color: #238636; }

    .gf-pill {
      margin-left: auto;
      font-size: 11px;
      font-weight: 700;
      padding: 2px 7px;
      border-radius: 999px;
      background: var(--bgColor-muted, #f6f8fa);
      color: var(--fgColor-muted, #656d76);
    }

    .gf-pill.is-on {
      background: rgba(46,160,67,0.15);
      color: #1a7f37;
    }

    .gf-row {
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .gf-settings-panel__divider {
      height: 1px;
      background: var(--borderColor-muted, rgba(27,31,36,0.08));
      margin: 0 14px;
    }

    .gf-settings-panel__footer {
      padding: 12px 14px 14px;
    }

    .gf-settings-panel__footer-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    .gf-btn {
      appearance: none;
      border: 1px solid var(--borderColor-default, #d0d7de);
      background: var(--bgColor-muted, #f6f8fa);
      color: inherit;
      border-radius: 6px;
      padding: 7px 10px;
      font-size: 12px;
      font-weight: 600;
      cursor: pointer;
    }

    .gf-btn--ghost { background: transparent; }
    .gf-btn--danger {
      border-color: rgba(209,36,47,0.35);
      color: #cf222e;
      background: rgba(209,36,47,0.06);
    }
    .gf-btn--green {
      border-color: transparent;
      background: #238636;
      color: #fff;
    }

    .gf-cache-status {
      min-height: 1.2em;
      margin: 6px 0 0;
      font-size: 12px;
      color: var(--fgColor-muted, #656d76);
    }

    .gf-settings-panel__footer-divider {
      height: 1px;
      margin: 12px 0;
      background: var(--borderColor-muted, rgba(27,31,36,0.08));
    }

    .gf-settings-panel__repo {
      display: grid;
      gap: 2px;
      text-decoration: none !important;
      color: inherit !important;
    }

    .gf-settings-panel__repo-title { font-size: 13px; font-weight: 700; }
    .gf-settings-panel__repo-desc {
      font-size: 12px;
      color: var(--fgColor-muted, #656d76);
    }

    @media (prefers-reduced-motion: reduce) {
      #${PANEL_ID}, #${HOVERCARD_BLOCK_ID}, .gf-btn-link { transition: none !important; }
    }
  `);

  function normalizeFinish(finish) {
    const key = String(finish || 'bronze').toLowerCase();
    return FINISH_KEYS.includes(key) ? key : 'bronze';
  }

  function applyFinishVars(el, finish) {
    const meta = finishMeta(finish);
    el.style.setProperty('--gf-finish-accent', meta.accent);
    el.style.setProperty('--gf-finish-ink', meta.ink);
    el.style.setProperty('--gf-finish-soft', meta.soft);
    el.style.setProperty('--gf-finish-glow', meta.glow);
    el.style.setProperty('--gf-finish-deep', meta.deep);
    el.style.setProperty('--gf-finish-shine', meta.shine);
  }

  function clearFinishClasses(el) {
    if (!el?.classList) return;
    el.classList.remove('gf-hc-themed');
    for (const cls of [...el.classList]) {
      if (FINISH_CLASS_RE.test(cls)) el.classList.remove(cls);
    }
  }

  function clearHovercardTheme(popover) {
    const message = popover?.querySelector?.('.Popover-message') || popover;
    if (!(message instanceof HTMLElement)) return;
    clearFinishClasses(message);
    delete message.dataset.gfFinish;
    message.querySelector('.gf-hc-theme-fx')?.remove();
    for (const key of [
      '--gf-finish-accent',
      '--gf-finish-ink',
      '--gf-finish-soft',
      '--gf-finish-glow',
      '--gf-finish-deep',
      '--gf-finish-shine',
    ]) {
      message.style.removeProperty(key);
    }
  }

  function ensureHovercardThemeFx(message) {
    let fx = message.querySelector(':scope > .gf-hc-theme-fx');
    if (!fx) {
      fx = document.createElement('div');
      fx.className = 'gf-hc-theme-fx';
      fx.setAttribute('aria-hidden', 'true');
      message.insertBefore(fx, message.firstChild);
    }
    fx.innerHTML = '<div class="gf-hc-theme-fx__shine"></div>';
    return fx;
  }

  function applyHovercardTheme(popover, finish) {
    const message = popover?.querySelector?.('.Popover-message');
    if (!(message instanceof HTMLElement)) return;
    const key = normalizeFinish(finish);
    clearFinishClasses(message);
    message.classList.add('gf-hc-themed', `gf-hc-finish--${key}`);
    message.dataset.gfFinish = key;
    applyFinishVars(message, key);
    ensureHovercardThemeFx(message);
  }

  function renderStars(count) {
    const n = Math.max(0, Math.min(5, Number(count) || 0));
    return '★'.repeat(n) + '☆'.repeat(5 - n);
  }

  function buildProfilePanel(card) {
    const root = document.createElement('div');
    root.id = PANEL_ID;
    const finish = normalizeFinish(card.finish);
    root.classList.add(`gf-panel-finish--${finish}`);
    applyFinishVars(root, finish);
    root.dataset.gfFinish = finish;

    const report = card.report || {};
    const work = report.workRate || {};
    const playstyles = Array.isArray(report.playstyles) ? report.playstyles : [];
    const finishLabel = card.finishLabel || String(card.finish || '').toUpperCase();
    const cardUrl = `${SITE_BASE}/${encodeURIComponent(card.login)}`;
    const duelUrl = buildDuelUrl(card.login);
    const statsHtml = STAT_ORDER.map(
      ([key, label]) => `
        <div class="gf-stat">
          <span class="gf-stat__value">${escapeHtml(card.stats?.[key] ?? '—')}</span>
          <span class="gf-stat__key">${label}</span>
        </div>`
    ).join('');

    const playstylesHtml = playstyles.length
      ? `<div class="gf-playstyles" aria-label="${escapeHtml(t('playstyles'))}">
          ${playstyles
            .map(
              (ps) =>
                `<span class="gf-playstyle${ps.plus ? ' is-plus' : ''}" title="${escapeHtml(ps.reason || '')}">${escapeHtml(ps.name)}${ps.plus ? '+' : ''}</span>`
            )
            .join('')}
        </div>`
      : '';


    root.innerHTML = `
      <div class="gf-panel-theme-fx" aria-hidden="true"><div class="gf-panel-theme-fx__shine"></div></div>
      <div class="gf-panel__inner">
        <div class="gf-panel__head">
          <div class="gf-panel__ovr" title="${escapeHtml(t('overall'))}">
            <span class="gf-panel__ovr-value">${escapeHtml(card.overall)}</span>
            <span class="gf-panel__ovr-label">${escapeHtml(t('overall'))}</span>
          </div>
          <div class="gf-panel__meta">
            <div class="gf-panel__title-row">
              <span class="gf-panel__name">${escapeHtml(card.name || card.login)}</span>
              <span class="gf-chip">${escapeHtml(card.position || '—')}</span>
              <span class="gf-chip gf-chip--finish">${escapeHtml(finishLabel)}</span>
            </div>
            <p class="gf-panel__blurb">${escapeHtml(card.archetype || '')}${card.archetypeBlurb ? ` — ${escapeHtml(card.archetypeBlurb)}` : ''}</p>
          </div>
        </div>
        <div class="gf-panel__body">
          <div class="gf-stats">${statsHtml}</div>
          <div class="gf-attrs">
            <div class="gf-attrs__row"><span class="gf-attrs__label">${escapeHtml(t('skillMoves'))}</span><span class="gf-attrs__value">${escapeHtml(renderStars(report.skillMoves))}</span></div>
            <div class="gf-attrs__row"><span class="gf-attrs__label">${escapeHtml(t('weakFoot'))}</span><span class="gf-attrs__value">${escapeHtml(renderStars(report.weakFoot))}</span></div>
            <div class="gf-attrs__row"><span class="gf-attrs__label">${escapeHtml(t('workRate'))}</span><span class="gf-attrs__value">${escapeHtml(`${work.attack || '—'} / ${work.defense || '—'}`)}</span></div>
            <div class="gf-attrs__row"><span class="gf-attrs__label">${escapeHtml(t('style'))}</span><span class="gf-attrs__value">${escapeHtml(report.style || '—')}</span></div>
            ${
              card.topLanguage
                ? `<div class="gf-attrs__row"><span class="gf-attrs__label">${escapeHtml(t('language'))}</span><span class="gf-attrs__value">${escapeHtml(card.topLanguage)}</span></div>`
                : ''
            }
          </div>
          ${playstylesHtml}
          <div class="gf-actions">
            <a class="gf-btn-link gf-btn-link--primary" href="${escapeHtml(cardUrl)}" target="_blank" rel="noopener noreferrer">${escapeHtml(t('openReport'))}</a>
            <a class="gf-btn-link" href="${escapeHtml(duelUrl)}" target="_blank" rel="noopener noreferrer">${escapeHtml(t('duel'))}</a>
          </div>
        </div>
      </div>
    `;
    return root;
  }

  function buildLoadingPanel() {
    const root = document.createElement('div');
    root.id = PANEL_ID;
    root.dataset.gfState = 'loading';
    root.innerHTML = `
      <div class="gf-panel__inner gf-panel-skel" role="status" aria-busy="true" aria-label="${escapeHtml(t('loading'))}">
        <div class="gf-panel__head">
          <div class="gf-skel gf-skel--panel-ovr" aria-hidden="true"></div>
          <div class="gf-panel__meta">
            <div class="gf-panel__title-row">
              <span class="gf-skel gf-skel--panel-name" aria-hidden="true"></span>
              <span class="gf-skel gf-skel--panel-chip" aria-hidden="true"></span>
              <span class="gf-skel gf-skel--panel-chip" aria-hidden="true"></span>
            </div>
            <div class="gf-skel gf-skel--panel-blurb" aria-hidden="true"></div>
          </div>
        </div>
        <div class="gf-panel__body">
          <div class="gf-stats">
            <div class="gf-skel gf-skel--panel-stat" aria-hidden="true"></div>
            <div class="gf-skel gf-skel--panel-stat" aria-hidden="true"></div>
            <div class="gf-skel gf-skel--panel-stat" aria-hidden="true"></div>
            <div class="gf-skel gf-skel--panel-stat" aria-hidden="true"></div>
            <div class="gf-skel gf-skel--panel-stat" aria-hidden="true"></div>
            <div class="gf-skel gf-skel--panel-stat" aria-hidden="true"></div>
          </div>
          <div class="gf-attrs">
            <div class="gf-skel gf-skel--panel-attr" aria-hidden="true" style="width:100%"></div>
            <div class="gf-skel gf-skel--panel-attr" aria-hidden="true" style="width:92%"></div>
            <div class="gf-skel gf-skel--panel-attr" aria-hidden="true" style="width:86%"></div>
            <div class="gf-skel gf-skel--panel-attr" aria-hidden="true" style="width:78%"></div>
          </div>
          <div class="gf-actions">
            <span class="gf-skel gf-skel--panel-btn" aria-hidden="true"></span>
            <span class="gf-skel gf-skel--panel-btn gf-skel--panel-btn-sm" aria-hidden="true"></span>
          </div>
        </div>
      </div>
    `;
    return root;
  }

  function buildStatusPanel(text, isError) {
    const root = document.createElement('div');
    root.id = PANEL_ID;
    root.innerHTML = `<div class="gf-panel__status${isError ? ' is-error' : ''}">${escapeHtml(text)}</div>`;
    return root;
  }

  function findProfileMount() {
    const area = document.querySelector('.js-profile-editable-area');
    if (!area) return null;
    const followBlock = area.querySelector('.flex-order-1.flex-md-order-none');
    if (followBlock) return { parent: area, before: followBlock.nextSibling };
    const details = area.querySelector('.vcard-details');
    if (details) return { parent: area, before: details };
    return { parent: area, before: null };
  }

  function prefersReducedMotion() {
    return window.matchMedia('(prefers-reduced-motion: reduce)').matches;
  }

  function revealProfilePanel(node, fromHeight) {
    if (!(node instanceof HTMLElement)) return;
    if (prefersReducedMotion()) return;

    const startH = Math.max(0, Number(fromHeight) || 0);
    node.style.overflow = 'hidden';
    node.style.height = 'auto';
    const endH = Math.round(node.getBoundingClientRect().height);
    const startMargin = startH < 1 ? 0 : 16;
    const endMargin = 16;

    if (Math.abs(endH - startH) < 2 && startMargin === endMargin) {
      node.style.height = '';
      node.style.overflow = '';
      node.style.marginBottom = '';
      node.style.opacity = '';
      return;
    }

    node.classList.add('is-expanding');
    node.style.height = `${startH}px`;
    node.style.marginBottom = `${startMargin}px`;
    if (startH < 1) node.style.opacity = '0';
    void node.offsetHeight;

    node.style.height = `${endH}px`;
    node.style.marginBottom = `${endMargin}px`;
    node.style.opacity = '1';

    let settled = false;
    const settle = () => {
      if (settled) return;
      settled = true;
      node.classList.remove('is-expanding');
      node.style.height = '';
      node.style.overflow = '';
      node.style.marginBottom = '';
      node.style.opacity = '';
      node.removeEventListener('transitionend', onEnd);
    };
    const onEnd = (event) => {
      if (event.target !== node) return;
      if (event.propertyName !== 'height' && event.propertyName !== 'margin-bottom') return;
      settle();
    };
    node.addEventListener('transitionend', onEnd);
    window.setTimeout(settle, 550);
  }

  function mountProfilePanel(node) {
    const existing = document.getElementById(PANEL_ID);
    const fromHeight = existing ? existing.getBoundingClientRect().height : 0;
    if (existing) existing.remove();
    const mount = findProfileMount();
    if (!mount) return false;
    mount.parent.insertBefore(node, mount.before);
    requestAnimationFrame(() => {
      requestAnimationFrame(() => revealProfilePanel(node, fromHeight));
    });
    return true;
  }

  async function hydrateProfile(username) {
    if (!document.getElementById(PANEL_ID)) {
      mountProfilePanel(buildLoadingPanel());
    }

    try {
      const card = await fetchCard(username);
      if (getProfileUsername()?.toLowerCase() !== username.toLowerCase()) return;
      if (!card) {
        mountProfilePanel(buildStatusPanel(t('notFound'), false));
        return;
      }
      mountProfilePanel(buildProfilePanel(card));
    } catch {
      if (getProfileUsername()?.toLowerCase() === username.toLowerCase()) {
        mountProfilePanel(buildStatusPanel(t('loadError'), true));
      }
    }
  }

  function getHovercardLogin(popover) {
    const hydro = popover.querySelector('[data-hydro-view]');
    if (hydro) {
      try {
        const data = JSON.parse(hydro.getAttribute('data-hydro-view') || '');
        const login = data?.payload?.card_user_login;
        if (login && isValidUsername(login)) return login;
      } catch {
        /* ignore */
      }
    }

    const avatar = popover.querySelector('a.user-hovercard-avatar, img.user-hovercard-avatar-image');
    if (avatar) {
      const href = avatar.getAttribute('href') || avatar.closest('a')?.getAttribute('href');
      const fromHref = href ? extractUsernameFromHref(href) : null;
      if (fromHref) return fromHref;
      const alt = avatar.getAttribute('alt') || '';
      const m = alt.match(/^@?([A-Za-z0-9-]{1,39})$/);
      if (m && isValidUsername(m[1])) return m[1];
    }

    const loginLink = popover.querySelector('section[aria-label="User login and name"] a.Link--primary');
    if (loginLink) {
      const fromHref = extractUsernameFromHref(loginLink.href);
      if (fromHref) return fromHref;
    }

    return null;
  }

  function findHovercardMount(popover) {
    const hydro = popover.querySelector('[data-hydro-view]');
    if (hydro) return hydro;
    return popover.querySelector('.Popover-message > div > div') || popover.querySelector('.Popover-message');
  }

  function isVisibleHovercard(popover) {
    if (!popover || !(popover instanceof HTMLElement)) return false;
    if (popover.style.display === 'none') return false;
    const style = window.getComputedStyle(popover);
    return style.display !== 'none' && style.visibility !== 'hidden';
  }

  function renderHovercardContent(block, card) {
    const finish = normalizeFinish(card.finish);
    clearFinishClasses(block);
    block.classList.add(`gf-hc-finish--${finish}`);
    applyFinishVars(block, finish);
    block.dataset.gfFinish = finish;

    const finishLabel = card.finishLabel || finish.toUpperCase();
    const cardUrl = `${SITE_BASE}/${encodeURIComponent(card.login)}`;
    const duelUrl = buildDuelUrl(card.login);
    const statsHtml = STAT_ORDER.map(
      ([key, label]) => `
        <div class="gf-hc__stat">
          <span class="gf-hc__stat-value">${escapeHtml(card.stats?.[key] ?? '—')}</span>
          <span class="gf-hc__stat-key">${label}</span>
        </div>`
    ).join('');

    block.innerHTML = `
      <div class="gf-hc__head">
        <div class="gf-hc__ovr" title="${escapeHtml(t('overall'))}">
          <span class="gf-hc__ovr-value">${escapeHtml(card.overall)}</span>
          <span class="gf-hc__ovr-label">${escapeHtml(t('overall'))}</span>
        </div>
        <div class="gf-hc__meta">
          <div class="gf-hc__chips">
            <span class="gf-chip">${escapeHtml(card.position || '—')}</span>
            <span class="gf-chip gf-chip--finish">${escapeHtml(finishLabel)}</span>
            ${card.topLanguage ? `<span class="gf-chip">${escapeHtml(card.topLanguage)}</span>` : ''}
          </div>
          <p class="gf-hc__blurb">${escapeHtml(card.archetype || '')}${
            card.archetypeBlurb ? ` — ${escapeHtml(card.archetypeBlurb)}` : ''
          }</p>
        </div>
      </div>
      <div class="gf-hc__stats">${statsHtml}</div>
      <div class="gf-hc__actions">
        <a class="gf-hc__link gf-hc__link--primary" href="${escapeHtml(cardUrl)}" target="_blank" rel="noopener noreferrer">${escapeHtml(t('openReport'))}</a>
        <a class="gf-hc__link" href="${escapeHtml(duelUrl)}" target="_blank" rel="noopener noreferrer">${escapeHtml(t('duel'))}</a>
      </div>
    `;

    const popover = block.closest('.Popover.js-hovercard-content');
    if (popover) applyHovercardTheme(popover, finish);
  }

  function renderHovercardSkeleton() {
    return `
      <div class="gf-hc__skel" role="status" aria-busy="true" aria-label="${escapeHtml(t('loading'))}">
        <div class="gf-hc__head">
          <div class="gf-skel gf-skel--ovr" aria-hidden="true"></div>
          <div class="gf-hc__meta">
            <div class="gf-hc__chips">
              <span class="gf-skel gf-skel--chip" aria-hidden="true"></span>
              <span class="gf-skel gf-skel--chip" aria-hidden="true"></span>
            </div>
            <div class="gf-skel gf-skel--blurb" aria-hidden="true"></div>
            <div class="gf-skel gf-skel--blurb gf-skel--blurb-short" aria-hidden="true"></div>
          </div>
        </div>
        <div class="gf-hc__stats">
          <div class="gf-skel gf-skel--stat" aria-hidden="true"></div>
          <div class="gf-skel gf-skel--stat" aria-hidden="true"></div>
          <div class="gf-skel gf-skel--stat" aria-hidden="true"></div>
          <div class="gf-skel gf-skel--stat" aria-hidden="true"></div>
          <div class="gf-skel gf-skel--stat" aria-hidden="true"></div>
          <div class="gf-skel gf-skel--stat" aria-hidden="true"></div>
        </div>
        <div class="gf-hc__actions">
          <span class="gf-skel gf-skel--btn" aria-hidden="true"></span>
          <span class="gf-skel gf-skel--btn gf-skel--btn-sm" aria-hidden="true"></span>
        </div>
      </div>
    `;
  }

  async function hydrateHovercardBlock(block, login) {
    const seq = ++hovercardSeq;
    block.dataset.gfLogin = login.toLowerCase();
    block.dataset.gfState = 'loading';
    block.innerHTML = renderHovercardSkeleton();

    try {
      const card = await fetchCard(login);
      if (seq !== hovercardSeq) return;
      if (block.dataset.gfLogin !== login.toLowerCase()) return;
      if (!document.contains(block)) return;
      if (!card) {
        block.dataset.gfState = 'done';
        block.innerHTML = `<div class="gf-hc__status">${escapeHtml(t('notFound'))}</div>`;
        return;
      }
      renderHovercardContent(block, card);
      block.dataset.gfState = 'ready';
    } catch {
      if (seq !== hovercardSeq) return;
      if (!document.contains(block)) return;
      block.dataset.gfState = 'done';
      block.innerHTML = `<div class="gf-hc__status is-error">${escapeHtml(t('loadError'))}</div>`;
    }
  }

  function injectIntoHovercard(popover) {
    if (!settings.showHovercard) {
      popover.querySelector(`#${HOVERCARD_BLOCK_ID}`)?.remove();
      clearHovercardTheme(popover);
      return;
    }
    if (!isVisibleHovercard(popover)) {
      clearHovercardTheme(popover);
      return;
    }
    if (!popover.querySelector('.user-hovercard-avatar, [data-hydro-view*="user-hovercard"]')) {
      clearHovercardTheme(popover);
      return;
    }

    const login = getHovercardLogin(popover);
    if (!login) return;

    const mount = findHovercardMount(popover);
    if (!mount) return;

    let block = mount.querySelector(`#${HOVERCARD_BLOCK_ID}`);
    if (
      block &&
      block.dataset.gfLogin === login.toLowerCase() &&
      (block.dataset.gfState === 'loading' ||
        block.dataset.gfState === 'ready' ||
        block.dataset.gfState === 'done')
    ) {
      // Re-apply theme if GitHub rebuilt the Popover-message chrome
      if (block.dataset.gfState === 'ready' && block.dataset.gfFinish) {
        const message = popover.querySelector('.Popover-message');
        if (message && message.dataset.gfFinish !== block.dataset.gfFinish) {
          applyHovercardTheme(popover, block.dataset.gfFinish);
        }
      }
      return;
    }

    if (!block) {
      block = document.createElement('div');
      block.id = HOVERCARD_BLOCK_ID;
      mount.appendChild(block);
    }

    hydrateHovercardBlock(block, login);
  }

  function scanHovercards() {
    document.querySelectorAll('.Popover.js-hovercard-content').forEach((popover) => {
      injectIntoHovercard(popover);
    });
  }

  function ensureHovercardObserver() {
    if (hovercardObserver) return;
    let timer = null;
    hovercardObserver = new MutationObserver((mutations) => {
      let relevant = false;
      for (const mutation of mutations) {
        const target = mutation.target;
        if (target instanceof Element) {
          if (
            target.classList?.contains('js-hovercard-content') ||
            target.classList?.contains('Popover-message') ||
            target.closest?.('.Popover.js-hovercard-content')
          ) {
            relevant = true;
            break;
          }
        }
        for (const node of mutation.addedNodes) {
          if (!(node instanceof Element)) continue;
          if (
            node.classList?.contains('js-hovercard-content') ||
            node.querySelector?.('.js-hovercard-content, .user-hovercard-avatar')
          ) {
            relevant = true;
            break;
          }
        }
        if (relevant) break;
      }
      if (!relevant) return;
      if (timer) clearTimeout(timer);
      timer = setTimeout(() => {
        timer = null;
        scanHovercards();
      }, 50);
    });
    hovercardObserver.observe(document.body, {
      childList: true,
      subtree: true,
      attributes: true,
      attributeFilter: ['style', 'class'],
    });
  }

  function scanPage() {
    const username = getProfileUsername();
    if (username) {
      const existing = document.getElementById(PANEL_ID);
      const currentLogin = existing?.querySelector('.gf-panel__name')?.textContent?.trim();
      if (!existing || (existing.dataset.gfUser || '').toLowerCase() !== username.toLowerCase()) {
        if (existing) existing.remove();
        const loading = buildLoadingPanel();
        loading.dataset.gfUser = username;
        mountProfilePanel(loading);
        hydrateProfile(username).then(() => {
          const panel = document.getElementById(PANEL_ID);
          if (panel) panel.dataset.gfUser = username;
        });
      } else if (!currentLogin && existing.dataset.gfState !== 'loading' && !existing.querySelector('.gf-panel__status')) {
        hydrateProfile(username);
      }
    } else {
      document.getElementById(PANEL_ID)?.remove();
    }

    scanHovercards();
    ensureUserMenuItem();
  }

  function scheduleScan() {
    if (scanTimer) clearTimeout(scanTimer);
    scanTimer = setTimeout(() => {
      scanTimer = null;
      scanPage();
    }, SCAN_DEBOUNCE_MS);
  }

  function getGlobalUserMenu() {
    const header = document.getElementById('global-nav-user-menu-header');
    if (header) {
      const dialog = header.closest('[role="dialog"]');
      if (dialog) return dialog;
    }
    return document.querySelector(
      '[role="dialog"][aria-labelledby="global-nav-user-menu-header"]'
    );
  }

  function closeGlobalUserMenu() {
    const menu = getGlobalUserMenu();
    if (!menu) return;

    const closeBtn = menu.querySelector('[data-component="Dialog.CloseButton"]');
    if (closeBtn instanceof HTMLElement && closeBtn.offsetParent !== null) {
      closeBtn.click();
      return;
    }

    const triggers = document.querySelectorAll('header button[aria-expanded="true"], .AppHeader button[aria-expanded="true"]');
    for (const trigger of triggers) {
      if (!(trigger instanceof HTMLElement)) continue;
      trigger.click();
      if (!getGlobalUserMenu()) return;
    }

    menu.dispatchEvent(
      new KeyboardEvent('keydown', { key: 'Escape', bubbles: true, cancelable: true })
    );
  }

  function settingsAreCustomized() {
    return (
      settings.cacheHours !== DEFAULT_SETTINGS.cacheHours ||
      settings.showHovercard !== DEFAULT_SETTINGS.showHovercard ||
      normalizeCardTheme(settings.cardTheme) !== DEFAULT_SETTINGS.cardTheme ||
      normalizeUiLocale(settings.locale) !== DEFAULT_SETTINGS.locale
    );
  }

  function ensureUserMenuItem() {
    const menu = getGlobalUserMenu();
    if (!menu) return null;
    if (menu.querySelector('#gf-user-menu-item')) {
      updateSettingsMenuState();
      return menu.querySelector('#gf-user-menu-item');
    }

    const list = menu.querySelector('ul[data-component="ActionList"]');
    if (!list) return null;

    const buttonItems = [...list.querySelectorAll('li[data-component="ActionList.Item"]')].filter(
      (li) => li.querySelector(':scope > button')
    );
    // Prefer a later action button (e.g. Feature preview) over the status row.
    const sampleLi = buttonItems[buttonItems.length - 1] || buttonItems[0];
    if (!sampleLi) return null;

    const li = /** @type {HTMLElement} */ (sampleLi.cloneNode(true));
    li.id = 'gf-user-menu-item';
    li.removeAttribute('hidden');
    li.classList.remove('hide-whenRegular', 'd-md-none', 'd-lg-none');

    const btn = li.querySelector('button');
    if (!(btn instanceof HTMLButtonElement)) return null;
    btn.removeAttribute('id');
    btn.removeAttribute('aria-labelledby');
    btn.removeAttribute('aria-describedby');
    btn.removeAttribute('aria-expanded');
    btn.removeAttribute('aria-haspopup');
    btn.type = 'button';

    const label = li.querySelector('[data-component="ActionList.Item.Label"]');
    if (label) {
      label.textContent = t('navMenuItem');
      label.removeAttribute('id');
    }

    let visual = li.querySelector('[data-component="ActionList.LeadingVisual"]');
    if (!visual) {
      visual = document.createElement('span');
      visual.setAttribute('data-component', 'ActionList.LeadingVisual');
      visual.className =
        sampleLi.querySelector('[data-component="ActionList.LeadingVisual"]')?.className ||
        'prc-ActionList-LeadingVisual-NBr28 prc-ActionList-VisualWrap-bdCsS';
      const spacer = btn.querySelector('[class*="Spacer"]');
      if (spacer?.nextSibling) btn.insertBefore(visual, spacer.nextSibling);
      else btn.insertBefore(visual, btn.firstChild);
    }

    visual.innerHTML =
      '<svg data-component="Octicon" aria-hidden="true" focusable="false" class="octicon" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align: text-bottom">' +
      '<path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0Zm0 1.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13Z"/>' +
      '<path d="M8 3.25a.75.75 0 0 1 .67.415l.9 1.8 1.99.29a.75.75 0 0 1 .416 1.279l-1.44 1.404.34 1.982a.75.75 0 0 1-1.088.791L8 10.347l-1.788.94a.75.75 0 0 1-1.088-.79l.34-1.983-1.44-1.404a.75.75 0 0 1 .416-1.28l1.99-.289.9-1.8A.75.75 0 0 1 8 3.25Z"/>' +
      '</svg>';


    let trailing = li.querySelector('[data-component="ActionList.TrailingVisual"]');
    const sub = li.querySelector('[data-component="ActionList.Item--DividerContainer"]');
    if (!trailing && sub) {
      trailing = document.createElement('span');
      trailing.setAttribute('data-component', 'ActionList.TrailingVisual');
      trailing.className =
        sampleLi.querySelector('[data-component="ActionList.TrailingVisual"]')?.className ||
        'prc-ActionList-TrailingVisual-jwT9C prc-ActionList-VisualWrap-bdCsS';
      sub.appendChild(trailing);
    }
    if (trailing) {
      trailing.innerHTML =
        '<span class="gf-nav-dot" id="gf-settings-dot" aria-hidden="true"></span>';
    }

    btn.addEventListener('click', (e) => {
      e.preventDefault();
      e.stopPropagation();
      closeGlobalUserMenu();
      window.setTimeout(() => togglePanel(true), 50);
    });

    const settingsLink = [...list.querySelectorAll('a[href]')].find((a) => {
      try {
        return new URL(a.href, location.origin).pathname === '/settings/profile';
      } catch {
        return a.getAttribute('href') === '/settings/profile';
      }
    });
    const settingsLi = settingsLink?.closest('li');
    const signOutLink = [...list.querySelectorAll('a[href]')].find((a) => {
      try {
        return new URL(a.href, location.origin).pathname === '/logout';
      } catch {
        return a.getAttribute('href') === '/logout';
      }
    });
    const signOutLi = signOutLink?.closest('li');

    if (settingsLi) {
      settingsLi.after(li);
    } else if (signOutLi) {
      signOutLi.before(li);
    } else {
      list.appendChild(li);
    }

    ensurePanel();
    updateSettingsMenuState();
    return li;
  }

  function updateSettingsMenuState() {
    const dot = document.getElementById('gf-settings-dot');
    if (!dot) return;
    const customized = settingsAreCustomized();
    dot.classList.toggle('is-on', customized);
    dot.title = customized ? t('on') : t('off');
  }

  function ensurePanel() {
    if (document.getElementById('gf-panel')) return;

    const panel = document.createElement('div');
    panel.id = 'gf-panel';
    panel.className = 'gf-settings-panel';
    panel.hidden = true;
    panel.innerHTML = `
      <div class="gf-settings-panel__header">
        <div>
          <div class="gf-settings-panel__title">${escapeHtml(t('panelTitle'))}</div>
          <div class="gf-settings-panel__subtitle">${escapeHtml(t('panelSubtitle'))}</div>
          <div class="gf-settings-panel__version">${escapeHtml(t('version', { version: SCRIPT_VERSION }))}</div>
        </div>
        <button type="button" class="gf-settings-panel__close" data-gf="close" aria-label="${escapeHtml(t('close'))}">×</button>
      </div>

      <div class="gf-settings-panel__section">
        <div class="gf-settings-panel__section-title">${escapeHtml(t('sectionDisplay'))}</div>
        <label class="gf-field">
          <span class="gf-field__label">${escapeHtml(t('uiLanguage'))}</span>
          <select id="gf-ui-locale">
            <option value="auto">${escapeHtml(t('uiLanguageAuto'))}</option>
            ${SUPPORTED_LOCALES.map(
              (code) =>
                `<option value="${code}">${escapeHtml(LOCALE_NATIVE_NAMES[code] || code)}</option>`
            ).join('')}
          </select>
        </label>
        <p class="gf-hint">${escapeHtml(t('uiLanguageHint'))}</p>
        <label class="gf-field">
          <span class="gf-field__label">${escapeHtml(t('cardTheme'))}</span>
          <select id="gf-card-theme">
            <option value="standard">${escapeHtml(t('cardThemeStandard'))}</option>
            <option value="github">${escapeHtml(t('cardThemeGithub'))}</option>
            <option value="fifa">${escapeHtml(t('cardThemeFifa'))}</option>
            <option value="neon">${escapeHtml(t('cardThemeNeon'))}</option>
          </select>
        </label>
        <p class="gf-hint">${escapeHtml(t('cardThemeHint'))}</p>
        <div class="gf-row" style="margin-bottom:10px">
          <label class="gf-switch">
            <input type="checkbox" id="gf-show-hovercard" />
            <span>${escapeHtml(t('showHovercard'))}</span>
          </label>
          <span class="gf-pill" id="gf-show-hovercard-pill">${escapeHtml(t('off'))}</span>
        </div>
        <p class="gf-hint">${escapeHtml(t('showHovercardHint'))}</p>
      </div>

      <div class="gf-settings-panel__divider"></div>

      <div class="gf-settings-panel__section">
        <div class="gf-settings-panel__section-title">${escapeHtml(t('sectionCache'))}</div>
        <div class="gf-cache-stats" id="gf-cache-stats">
          <div class="gf-cache-stats__count" id="gf-cache-count"></div>
          <p class="gf-cache-stats__storage" id="gf-cache-storage"></p>
          <div
            class="gf-cache-stats__bar"
            id="gf-cache-bar"
            role="progressbar"
            aria-valuemin="0"
            aria-valuemax="100"
            aria-valuenow="100"
            aria-label="${escapeHtml(t('cacheStorageHint', { budget: formatBytes(CACHE_BUDGET_BYTES) }))}"
          >
            <div class="gf-cache-stats__bar-fill" id="gf-cache-bar-fill"></div>
          </div>
          <p class="gf-hint gf-cache-stats__hint">${escapeHtml(t('cacheStorageHint', { budget: formatBytes(CACHE_BUDGET_BYTES) }))}</p>
        </div>
        <label class="gf-field">
          <span class="gf-field__label">${escapeHtml(t('cacheHours'))}</span>
          <input type="number" id="gf-cache-hours" min="0" max="${CACHE_HOURS_MAX}" step="1" placeholder="12" inputmode="numeric" />
        </label>
        <p class="gf-hint">${escapeHtml(t('cacheHoursHint'))}</p>
        <button type="button" class="gf-btn gf-btn--danger" data-gf="clear-cache">${escapeHtml(t('clearCache'))}</button>
        <p class="gf-hint">${escapeHtml(t('cacheClearHint'))}</p>
        <p class="gf-cache-status" id="gf-cache-status" aria-live="polite"></p>
      </div>

      <div class="gf-settings-panel__footer">
        <div class="gf-settings-panel__footer-actions">
          <button type="button" class="gf-btn gf-btn--ghost" data-gf="close">${escapeHtml(t('cancel'))}</button>
          <button type="button" class="gf-btn" data-gf="save">${escapeHtml(t('save'))}</button>
          <button type="button" class="gf-btn gf-btn--green" data-gf="save-run">${escapeHtml(t('saveReload'))}</button>
        </div>
        <div class="gf-settings-panel__footer-divider" role="separator"></div>
        <a class="gf-settings-panel__repo" href="${REPO_URL}" target="_blank" rel="noopener noreferrer">
          <span class="gf-settings-panel__repo-title">${escapeHtml(t('repoLink'))}</span>
          <span class="gf-settings-panel__repo-desc">${escapeHtml(t('repoAbout'))}</span>
        </a>
      </div>
    `;
    document.body.appendChild(panel);

    panel.addEventListener('click', (e) => e.stopPropagation());
    panel.querySelectorAll('[data-gf="close"]').forEach((el) =>
      el.addEventListener('click', () => togglePanel(false))
    );
    panel.querySelector('[data-gf="save"]').addEventListener('click', () => {
      const localeChanged = persistPanelForm();
      if (localeChanged) {
        location.reload();
        return;
      }
      togglePanel(false);
    });
    panel.querySelector('[data-gf="save-run"]').addEventListener('click', () => {
      persistPanelForm();
      togglePanel(false);
      location.reload();
    });
    panel.querySelector('[data-gf="clear-cache"]').addEventListener('click', () => {
      const count = clearCardCache();
      const status = panel.querySelector('#gf-cache-status');
      if (status) status.textContent = count > 0 ? t('cacheCleared', { count }) : t('cacheEmpty');
      updateCacheStatsUI();
    });

    panel.querySelector('#gf-show-hovercard').addEventListener('change', syncDisplayPills);

    document.addEventListener('click', (e) => {
      if (!panelOpen) return;
      const menuItem = document.getElementById('gf-user-menu-item');
      if (
        panel.contains(/** @type {Node} */ (e.target)) ||
        menuItem?.contains(/** @type {Node} */ (e.target))
      ) {
        return;
      }
      togglePanel(false);
    });
    document.addEventListener('keydown', (e) => {
      if (e.key === 'Escape' && panelOpen) togglePanel(false);
    });
  }

  function syncDisplayPills() {
    const panel = document.getElementById('gf-panel');
    if (!panel) return;
    const hoverOn = panel.querySelector('#gf-show-hovercard').checked;
    const hoverPill = panel.querySelector('#gf-show-hovercard-pill');
    hoverPill.textContent = hoverOn ? t('on') : t('off');
    hoverPill.classList.toggle('is-on', hoverOn);
  }

  function fillPanelForm() {
    const panel = document.getElementById('gf-panel');
    if (!panel) return;
    panel.querySelector('#gf-ui-locale').value = normalizeUiLocale(settings.locale);
    panel.querySelector('#gf-show-hovercard').checked = settings.showHovercard !== false;
    panel.querySelector('#gf-card-theme').value = normalizeCardTheme(settings.cardTheme);
    panel.querySelector('#gf-cache-hours').value = String(normalizeCacheHours(settings.cacheHours));
    const status = panel.querySelector('#gf-cache-status');
    if (status) status.textContent = '';
    syncDisplayPills();
    updateCacheStatsUI();
  }

  /** @returns {boolean} true if UI locale preference changed (caller should reload) */
  function persistPanelForm() {
    const panel = document.getElementById('gf-panel');
    if (!panel) return false;
    const prevLocale = normalizeUiLocale(settings.locale);
    saveSettings({
      locale: panel.querySelector('#gf-ui-locale').value,
      showHovercard: panel.querySelector('#gf-show-hovercard').checked,
      cardTheme: panel.querySelector('#gf-card-theme').value,
      cacheHours: normalizeCacheHours(panel.querySelector('#gf-cache-hours').value),
    });
    return normalizeUiLocale(settings.locale) !== prevLocale;
  }

  function togglePanel(force) {
    ensurePanel();
    const panel = document.getElementById('gf-panel');
    if (!panel) return;

    panelOpen = typeof force === 'boolean' ? force : !panelOpen;
    panel.hidden = !panelOpen;

    if (panelOpen) {
      fillPanelForm();
      positionPanel();
    }
  }

  function positionPanel() {
    const panel = document.getElementById('gf-panel');
    if (!panel) return;

    const width = 360;
    const anchor =
      document.getElementById('gf-user-menu-item') ||
      getGlobalUserMenu() ||
      document.querySelector('header .AppHeader-user, header [data-component="Avatar"], header img.avatar');

    let left;
    let top;
    if (anchor) {
      const rect = anchor.getBoundingClientRect();
      left = rect.right - width;
      top = rect.bottom + 8;
      if (top < 56) top = 56;
    } else {
      left = window.innerWidth - width - 16;
      top = 56;
    }

    if (left < 8) left = 8;
    if (left + width > window.innerWidth - 8) left = window.innerWidth - width - 8;
    if (top + 40 > window.innerHeight - 8) top = Math.max(8, window.innerHeight - 40);

    panel.style.top = `${Math.round(top)}px`;
    panel.style.left = `${Math.round(left)}px`;
  }

  function onSoftNavigation() {
    scheduleScan();
    ensureUserMenuItem();
  }

  function init() {
    loadMemoryCache();
    applyCardTheme();
    window.addEventListener('pagehide', persistCacheNow);
    ensurePanel();
    ensureUserMenuItem();

    if (typeof GM_registerMenuCommand === 'function') {
      GM_registerMenuCommand(t('menuSettings'), () => {
        togglePanel(true);
      });
    }

    scheduleScan();
    ensureHovercardObserver();

    mutationObserver = new MutationObserver((mutations) => {
      let relevant = false;
      for (const mutation of mutations) {
        if (mutation.type !== 'childList') continue;
        for (const node of mutation.addedNodes) {
          if (!(node instanceof Element)) continue;
          if (
            node.id === PANEL_ID ||
            node.id === 'gf-panel' ||
            node.id === 'gf-user-menu-item' ||
            node.id === HOVERCARD_BLOCK_ID
          ) {
            continue;
          }
          if (
            node.id === 'global-nav-user-menu-header' ||
            node.getAttribute?.('aria-labelledby') === 'global-nav-user-menu-header' ||
            (node.matches?.('ul[data-component="ActionList"]') && getGlobalUserMenu()?.contains(node)) ||
            node.querySelector?.(
              '#global-nav-user-menu-header, [aria-labelledby="global-nav-user-menu-header"]'
            )
          ) {
            ensureUserMenuItem();
            continue;
          }
          if (
            node.matches?.(
              '.js-profile-editable-area, .Layout-sidebar, .Popover.js-hovercard-content, main'
            ) ||
            node.querySelector?.(
              '.js-profile-editable-area, .Popover.js-hovercard-content'
            )
          ) {
            relevant = true;
            break;
          }
        }
        if (relevant) break;
      }
      if (!relevant) return;
      scheduleScan();
    });
    mutationObserver.observe(document.body, { childList: true, subtree: true });

    document.addEventListener('turbo:load', onSoftNavigation);
    document.addEventListener('turbo:render', onSoftNavigation);
    document.addEventListener('pjax:end', onSoftNavigation);
    document.addEventListener('soft-nav:success', onSoftNavigation);
    window.addEventListener('popstate', onSoftNavigation);
  }

  init();
})();