chore(release): bump version to v1.1.4

- save_metadata_updates now trims/lowercases/dedupes tags on write
- ModelFilterSet tag matching is now case-insensitive (both include/exclude)
- Removed redundant .lower() calls in tag_update_service.py

data/supporters.json

@@ -11,14 +11,15 @@
     "Insomnia Art Designs",
     "2018cfh",
     "Arlecchino Shion",
+    "Charles Blakemore",
     "Rob Williams",
     "W+K+White",
     "$MetaSamsara",
     "wackop",
     "Phil",
     "Carl G.",
-    "Charles Blakemore",
     "stone9k",
+    "Rosenthal",
     "itismyelement",
     "Mozzel",
     "Gingko Biloba",
@@ -28,7 +29,6 @@
     "DM",
     "Sen314",
     "Estragon",
-    "Rosenthal",
     "ClockDaemon",
     "Francisco Tatis",
     "Tobi_Swagg",
@@ -80,11 +80,13 @@
     "Release Cabrakan",
     "JW Sin",
     "Alex",
+    "bh",
     "carozzz",
     "Marlon Daniels",
     "James Dooley",
     "zenbound",
     "Buzzard",
+    "Aaron Bleuer",
     "Adam Shaw",
     "Mark Corneglio",
     "SarcasticHashtag",
@@ -95,6 +97,7 @@
     "James Todd",
     "Wicked Choices by ASLPro3D",
     "FinalyFree",
+    "Weasyl",
     "Steven Pfeiffer",
     "Timmy",
     "Johnny",
@@ -105,7 +108,7 @@
     "Luc Job",
     "dl0901dm",
     "corde",
-    "Nick Walker",
+    "nwalker94",
     "Yushio",
     "Vik71it",
     "Bishoujoker",
@@ -118,9 +121,12 @@
     "BadassArabianMofo",
     "Pascal Dahle",
     "Greg",
+    "Sangheili460",
+    "MagnaInsomnia",
     "Akira_HentAI",
     "lmsupporter",
     "andrew.tappan",
+    "N/A",
     "Greenmoustache",
     "zounic",
     "wfpearl",
@@ -128,20 +134,19 @@
     "Jack B Nimble",
     "JaxMax",
     "contrite831",
-    "bh",
     "Jwk0205",
     "Starkselle",
     "Olive",
-    "Aaron Bleuer",
     "LacesOut!",
     "greebles",
     "Some Guy Named Barry",
     "M Postkasse",
     "Gooohokrbe",
+    "wamekukyouzin",
     "OldBones",
     "Jacob Hoehler",
+    "Dogmaster",
     "Matt Wenzel",
-    "Weasyl",
     "Lex Song",
     "Cory Paza",
     "Gonzalo Andre Allendes Lopez",
@@ -151,20 +156,18 @@
     "Philip Hempel",
     "dan",
     "aai",
+    "Mouthlessman",
     "otaku fra",
     "jean jahren",
     "MiraiKuriyamaSy",
     "Ran C",
     "ViperC",
     "Penfore",
-    "Sangheili460",
-    "MagnaInsomnia",
     "Karl P.",
     "Gordon Cole",
     "Adam Taylor",
     "AbstractAss",
     "Weird_With_A_Beard",
-    "N/A",
     "The Spawn",
     "graysock",
     "Pozadine1",
@@ -187,15 +190,15 @@
     "太郎 ゲーム",
     "Roslynd",
     "jinxedx",
+    "Neco28",
     "Cosmosis",
+    "David Ortega",
     "AELOX",
     "Dankin",
     "Nicfit23",
     "FloPro4Sho",
     "Cristian Vazquez",
-    "wamekukyouzin",
     "drum matthieu",
-    "Dogmaster",
     "Frank Nitty",
     "Magic Noob",
     "Christopher Michel",
@@ -210,7 +213,6 @@
     "Kevin John Duck",
     "Dustin Chen",
     "Blackfish95",
-    "Mouthlessman",
     "Paul Kroll",
     "Bas Imagineer",
     "John Statham",
@@ -232,8 +234,11 @@
     "MJG",
     "David LaVallee",
     "linnfrey",
+    "ae",
+    "Tr4shP4nda",
     "IamAyam",
     "skaterb949",
+    "Brian M",
     "Josef Lanzl",
     "Nerezza",
     "sanborondon",
@@ -248,11 +253,10 @@
     "Tee Gee",
     "Geolog",
     "tarek helmi",
-    "Neco28",
     "Eris3D",
     "Max Marklund",
-    "David Ortega",
     "Pronredn",
+    "Jamie Ogletree",
     "a _",
     "Jeff",
     "lh qwe",
@@ -272,8 +276,6 @@
     "George",
     "dw",
     "地獄の禄",
-    "ae",
-    "Tr4shP4nda",
     "Gamalonia",
     "WRL_SPR",
     "capn",
@@ -289,13 +291,14 @@
     "Hailshem",
     "kudari",
     "Naomi Hale Danchi",
+    "ken",
     "epicgamer0020690",
     "Joshua Porrata",
     "SuBu",
+    "RedPIXel",
     "Richard",
     "奚明 刘",
     "Andrew",
-    "Brian M",
     "Robert Wegemund",
     "Littlehuggy",
     "준희 김",
@@ -303,6 +306,7 @@
     "Thought2Form",
     "Kevin Picco",
     "Sadlip",
+    "Joey Callahan",
     "Tomohiro Baba",
     "m",
     "Noora",
@@ -311,10 +315,10 @@
     "Mattssn",
     "Mikko Hemilä",
     "Jacob McDaniel",
-    "Jamie Ogletree",
     "Temikus",
     "Artokun",
     "Michael Taylor",
+    "Derek Baker",
     "Martial",
     "Michael Anthony Scott",
     "Emil Andersson",
@@ -338,10 +342,8 @@
     "momokai",
     "starbugx",
     "dc7431",
-    "ken",
     "Crocket",
     "keemun",
-    "RedPIXel",
     "Wind",
     "Nexus",
     "Ramneek“Guy”Ashok",
@@ -370,12 +372,13 @@
     "Vir",
     "Skyfire83",
     "Adam Rinehart",
+    "Pitpe11",
+    "TheD1rtyD03",
     "gzmzmvp",
     "Gregory Kozhemiak",
     "Draven T",
     "mrjuan",
     "Eric Whitney",
-    "Joey Callahan",
     "Aquatic Coffee",
     "Ivan Tadic",
     "Mike Simone",
@@ -389,13 +392,13 @@
     "X",
     "Sloan Steddy",
     "hexxish",
-    "Derek Baker",
     "Anthony Faxlandez",
     "battu",
     "Nathan",
     "NICHOLAS BAXLEY",
     "Pat Hen",
     "Xeeosat",
+    "Saya",
     "Ed Wang",
     "Jordan Shaw",
     "g unit",
@@ -411,8 +414,6 @@
     "Raku",
     "smart.edge5178",
     "Menard",
-    "Pitpe11",
-    "TheD1rtyD03",
     "moonpetal",
     "SomeDude",
     "g9p0o",
@@ -444,9 +445,11 @@
     "Shock Shockor",
     "ACTUALLY_the_Real_Willem_Dafoe",
     "Михал Михалыч",
+    "Matt",
     "Goldwaters",
     "Kauffy",
     "Zude",
+    "SPJ",
     "Kyler",
     "Edward Kennedy",
     "Justin Blaylock",
@@ -467,7 +470,6 @@
     "Distortik",
     "Filippo Ferrari",
     "Youguang",
-    "Saya",
     "andrewzpong",
     "BossGame",
     "lrdchs",
@@ -479,6 +481,8 @@
     "Whitepinetrader",
     "POPPIN",
     "nanana",
+    "D",
+    "Dark_Pest",
     "Alex",
     "Karru",
     "ChaChanoKo",
@@ -506,18 +510,20 @@
     "Kalli Core",
     "Christian Schäfer",
     "りん あめ",
-    "Matt",
+    "Joaquin Hierrezuelo",
     "Locrospiel",
     "Frogmilk",
-    "SPJ",
+    "Sean voets",
     "Kor",
     "Joseph Hanson",
+    "John Rednoulf",
     "Kyron Mahan",
     "Bryan Rutkowski",
     "TBitz33",
     "Anonym dkjglfleeoeldldldlkf",
     "Ezokewn",
     "SendingRavens",
+    "Steven",
     "JackJohnnyJim",
     "TenaciousD",
     "Dmitry Ryzhov",
@@ -558,6 +564,9 @@
     "Scott",
     "Muratoraccio",
     "D",
+    "Mobius2020",
+    "ExLightSaber",
+    "YaboiRay",
     "nickname",
     "Sildoren",
     "Darv",
@@ -583,8 +592,6 @@
     "Inkognito",
     "G",
     "Tan+Huynh",
-    "D",
-    "Dark_Pest",
     "Jacky+Ho",
     "generic404",
     "abattoirblues",
@@ -604,12 +611,9 @@
     "Doug Mason",
     "Jeremy Townsend",
     "Dave Abraham",
-    "Joaquin Hierrezuelo",
-    "Sean voets",
     "Owen Gwosdz",
     "Jarrid Lee",
     "Poophead27 Blyat",
-    "John Rednoulf",
     "Spire",
     "AZ Party Oasis",
     "Boba Smith",
@@ -619,11 +623,12 @@
     "Jack Dole",
     "matt",
     "somethingtosay8",
+    "Terminuz",
     "ivistorm",
     "max blo",
     "Sauv",
-    "Steven",
     "CptNeo",
+    "Borte",
     "Maso",
     "Ted Cart",
     "Sage Himeros",
@@ -642,6 +647,7 @@
     "Teriak47",
     "Just me",
     "Raf Stahelin",
+    "Nacho Ferrando",
     "Вячеслав Маринин",
     "Marcos Tortosa Carmona",
     "Dkommander22",
@@ -688,6 +694,8 @@
     "SelfishMedic",
     "adderleighn",
     "EnragedAntelope",
+    "shw",
+    "Celestial+Kitten",
     "bakeliteboy",
     "TequiTequi",
     "Homero+Banda",
@@ -717,9 +725,6 @@
     "PoorStudent",
     "lucites",
     "Alex+Zaw",
-    "Mobius2020",
-    "ExLightSaber",
-    "YaboiRay",
     "Drizzly",
     "Nebuleux",
     "Join+Chun",
@@ -745,6 +750,7 @@
     "Nico",
     "Maximilian Krischan",
     "Banana Joe",
+    "proto merp",
     "_ G3n",
     "Donovan Jenkins",
     "Hans Meier",
@@ -766,6 +772,7 @@
     "jumpd",
     "John C",
     "Rim",
+    "yfx507",
     "Room Light",
     "Jairus Knudsen",
     "Xan Dionysus",
@@ -783,19 +790,20 @@
     "TheFusion",
     "Jean-françois SEMA",
     "3zS4QNQ4",
-    "Terminuz",
     "Kurt",
     "Matt M.",
     "Ivan Imes",
     "J M",
+    "Slacks",
     "Bouya shaka",
+    "john Greene",
     "Faburizu",
     "Jack Lawfield",
     "jimyjomson",
-    "Borte",
     "JaeHyun Jang",
     "Homero Banda",
     "Chase Kwon",
+    "Bob Ling",
     "yyuvuvu",
     "Inyoshu",
     "Chad Barnes",
@@ -821,5 +829,5 @@
     "Somebody",
     "CK"
   ],
-  "totalCount": 818
+  "totalCount": 826
 }

locales/de.json

@@ -251,7 +251,18 @@
             "toggle": "Theme wechseln",
             "switchToLight": "Zu hellem Theme wechseln",
             "switchToDark": "Zu dunklem Theme wechseln",
-            "switchToAuto": "Zu automatischem Theme wechseln"
+            "switchToAuto": "Zu automatischem Theme wechseln",
+            "presets": "Theme-Voreinstellungen",
+            "default": "Standard",
+            "nord": "Nord",
+            "midnight": "Midnight",
+            "monokai": "Monokai",
+            "dracula": "Dracula",
+            "solarized": "Solarized",
+            "mode": "Modus",
+            "light": "Hell",
+            "dark": "Dunkel",
+            "auto": "Auto"
         },
         "actions": {
             "checkUpdates": "Updates prüfen",
@@ -263,6 +274,9 @@
         "civitaiApiKey": "Civitai API Key",
         "civitaiApiKeyPlaceholder": "Geben Sie Ihren Civitai API Key ein",
         "civitaiApiKeyHelp": "Wird für die Authentifizierung beim Herunterladen von Modellen von Civitai verwendet",
+        "civitaiApiKeyConfigured": "Konfiguriert",
+        "civitaiApiKeyNotConfigured": "Nicht konfiguriert",
+        "civitaiApiKeySet": "Einrichten",
         "civitaiHost": {
             "label": "Civitai-Host",
             "help": "Wählen Sie aus, welche Civitai-Seite geöffnet wird, wenn Sie „View on Civitai“-Links verwenden.",
@@ -303,6 +317,7 @@
             "downloads": "Downloads",
             "videoSettings": "Video-Einstellungen",
             "layoutSettings": "Layout-Einstellungen",
+            "licenseIcons": "Lizenzsymbole",
             "misc": "Verschiedenes",
             "backup": "Backups",
             "folderSettings": "Standard-Roots",
@@ -583,6 +598,10 @@
             "label": "Früher Zugriff Updates ausblenden",
             "help": "Nur Early-Access-Updates"
         },
+        "licenseIcons": {
+            "useNewStyle": "Aktualisierte Lizenzsymbole verwenden",
+            "useNewStyleHelp": "Lizenzberechtigungen mit farbigen Indikatoren (neuer Stil) oder nur Einschränkungssymbolen (klassischer Stil) anzeigen. Orientiert sich am aktuellen CivitAI-Design."
+        },
         "misc": {
             "includeTriggerWords": "Trigger Words in LoRA-Syntax einschließen",
             "includeTriggerWordsHelp": "Trainierte Trigger Words beim Kopieren der LoRA-Syntax in die Zwischenablage einschließen",
@@ -997,6 +1016,18 @@
             "storage": "Speicher",
             "insights": "Erkenntnisse"
         },
+        "metrics": {
+            "totalModels": "Modelle gesamt",
+            "totalStorage": "Speicher gesamt",
+            "totalGenerations": "Generationen gesamt",
+            "usageRate": "Nutzungsrate",
+            "loras": "LoRAs",
+            "checkpoints": "Checkpoints",
+            "embeddings": "Embeddings",
+            "uniqueTags": "Einzigartige Tags",
+            "unusedModels": "Ungenutzte Modelle",
+            "avgUsesPerModel": "Ø Nutzungen/Modell"
+        },
         "usage": {
             "mostUsedLoras": "Meistgenutzte LoRAs",
             "mostUsedCheckpoints": "Meistgenutzte Checkpoints",
@@ -1014,13 +1045,77 @@
         },
         "insights": {
             "smartInsights": "Intelligente Erkenntnisse",
-            "recommendations": "Empfehlungen"
+            "recommendations": "Empfehlungen",
+            "noInsights": "Keine Erkenntnisse verfügbar",
+            "unusedLoras": {
+                "high": {
+                    "title": "Hohe Anzahl ungenutzter LoRAs",
+                    "description": "{percent}% Ihrer LoRAs ({count}/{total}) wurden noch nie verwendet.",
+                    "suggestion": "Erwägen Sie, ungenutzte Modelle zu organisieren oder zu archivieren, um Speicherplatz freizugeben."
+                }
+            },
+            "unusedCheckpoints": {
+                "detected": {
+                    "title": "Ungenutzte Checkpoints erkannt",
+                    "description": "{percent}% Ihrer Checkpoints ({count}/{total}) wurden noch nie verwendet.",
+                    "suggestion": "Überprüfen Sie nicht mehr benötigte Checkpoints und erwägen Sie deren Entfernung."
+                }
+            },
+            "unusedEmbeddings": {
+                "high": {
+                    "title": "Hohe Anzahl ungenutzter Embeddings",
+                    "description": "{percent}% Ihrer Embeddings ({count}/{total}) wurden noch nie verwendet.",
+                    "suggestion": "Organisieren oder archivieren Sie ungenutzte Embeddings, um Ihre Sammlung zu optimieren."
+                }
+            },
+            "collection": {
+                "large": {
+                    "title": "Große Sammlung erkannt",
+                    "description": "Ihre Modellsammlung verwendet {size} Speicher.",
+                    "suggestion": "Erwägen Sie externe Speicher- oder Cloud-Lösungen für eine bessere Organisation."
+                }
+            },
+            "activity": {
+                "active": {
+                    "title": "Aktiver Benutzer",
+                    "description": "Sie haben {count} Generationen abgeschlossen!",
+                    "suggestion": "Entdecken und erstellen Sie weiterhin großartige Inhalte mit Ihren Modellen."
+                }
+            }
         },
         "charts": {
             "collectionOverview": "Sammlungsübersicht",
             "baseModelDistribution": "Basis-Modell-Verteilung",
             "usageTrends": "Nutzungstrends (Letzte 30 Tage)",
-            "usageDistribution": "Nutzungsverteilung"
+            "usageDistribution": "Nutzungsverteilung",
+            "date": "Datum",
+            "usageCount": "Nutzungsanzahl",
+            "fileSizeBytes": "Dateigröße (Bytes)",
+            "models": "Modelle",
+            "loraUsage": "LoRA-Nutzung",
+            "checkpointUsage": "Checkpoint-Nutzung",
+            "embeddingUsage": "Embedding-Nutzung"
+        },
+        "modelTypes": {
+            "lora": "LoRA",
+            "locon": "LyCORIS",
+            "dora": "DoRA",
+            "checkpoint": "Checkpoint",
+            "diffusion_model": "Diffusionsmodell",
+            "embedding": "Embeddings"
+        },
+        "placeholders": {
+            "loading": "Lädt...",
+            "noModels": "Keine Modelle gefunden",
+            "errorLoading": "Fehler beim Laden der Daten",
+            "noStorageData": "Keine Speicherdaten verfügbar",
+            "rootFolder": "Root",
+            "chartLibraryMissing": "Diagramm benötigt Chart.js-Bibliothek"
+        },
+        "tooltips": {
+            "tagCount": "{tag}: {count} Modelle",
+            "chartUsage": "{name}: {size}, {count} Nutzungen",
+            "chartPercentage": "{label}: {value} ({pct}%)"
         }
     },
     "modals": {

locales/en.json

@@ -251,7 +251,18 @@
             "toggle": "Toggle theme",
             "switchToLight": "Switch to light theme",
             "switchToDark": "Switch to dark theme",
-            "switchToAuto": "Switch to auto theme"
+            "switchToAuto": "Switch to auto theme",
+            "presets": "Theme Presets",
+            "default": "Default",
+            "nord": "Nord",
+            "midnight": "Midnight",
+            "monokai": "Monokai",
+            "dracula": "Dracula",
+            "solarized": "Solarized",
+            "mode": "Mode",
+            "light": "Light",
+            "dark": "Dark",
+            "auto": "Auto"
         },
         "actions": {
             "checkUpdates": "Check Updates",
@@ -263,6 +274,9 @@
         "civitaiApiKey": "Civitai API Key",
         "civitaiApiKeyPlaceholder": "Enter your Civitai API key",
         "civitaiApiKeyHelp": "Used for authentication when downloading models from Civitai",
+        "civitaiApiKeyConfigured": "Configured",
+        "civitaiApiKeyNotConfigured": "Not configured",
+        "civitaiApiKeySet": "Set up",
         "civitaiHost": {
             "label": "Civitai host",
             "help": "Choose which Civitai site opens when using View on Civitai links.",
@@ -303,6 +317,7 @@
             "downloads": "Downloads",
             "videoSettings": "Video Settings",
             "layoutSettings": "Layout Settings",
+            "licenseIcons": "License Icons",
             "misc": "Miscellaneous",
             "backup": "Backups",
             "folderSettings": "Default Roots",
@@ -583,6 +598,10 @@
             "label": "Hide Early Access Updates",
             "help": "When enabled, models with only early access updates will not show 'Update available' badge"
         },
+        "licenseIcons": {
+            "useNewStyle": "Use updated license icons",
+            "useNewStyleHelp": "Display license permissions with colored indicators (new style) or restriction-only icons (classic style). Mirroring the current CivitAI design."
+        },
         "misc": {
             "includeTriggerWords": "Include Trigger Words in LoRA Syntax",
             "includeTriggerWordsHelp": "Include trained trigger words when copying LoRA syntax to clipboard",
@@ -997,6 +1016,18 @@
             "storage": "Storage",
             "insights": "Insights"
         },
+        "metrics": {
+            "totalModels": "Total Models",
+            "totalStorage": "Total Storage",
+            "totalGenerations": "Total Generations",
+            "usageRate": "Usage Rate",
+            "loras": "LoRAs",
+            "checkpoints": "Checkpoints",
+            "embeddings": "Embeddings",
+            "uniqueTags": "Unique Tags",
+            "unusedModels": "Unused Models",
+            "avgUsesPerModel": "Avg. Uses/Model"
+        },
         "usage": {
             "mostUsedLoras": "Most Used LoRAs",
             "mostUsedCheckpoints": "Most Used Checkpoints",
@@ -1014,13 +1045,77 @@
         },
         "insights": {
             "smartInsights": "Smart Insights",
-            "recommendations": "Recommendations"
+            "recommendations": "Recommendations",
+            "noInsights": "No insights available",
+            "unusedLoras": {
+                "high": {
+                    "title": "High Number of Unused LoRAs",
+                    "description": "{percent}% of your LoRAs ({count}/{total}) have never been used.",
+                    "suggestion": "Consider organizing or archiving unused models to free up storage space."
+                }
+            },
+            "unusedCheckpoints": {
+                "detected": {
+                    "title": "Unused Checkpoints Detected",
+                    "description": "{percent}% of your checkpoints ({count}/{total}) have never been used.",
+                    "suggestion": "Review and consider removing checkpoints you no longer need."
+                }
+            },
+            "unusedEmbeddings": {
+                "high": {
+                    "title": "High Number of Unused Embeddings",
+                    "description": "{percent}% of your embeddings ({count}/{total}) have never been used.",
+                    "suggestion": "Consider organizing or archiving unused embeddings to optimize your collection."
+                }
+            },
+            "collection": {
+                "large": {
+                    "title": "Large Collection Detected",
+                    "description": "Your model collection is using {size} of storage.",
+                    "suggestion": "Consider using external storage or cloud solutions for better organization."
+                }
+            },
+            "activity": {
+                "active": {
+                    "title": "Active User",
+                    "description": "You've completed {count} generations so far!",
+                    "suggestion": "Keep exploring and creating amazing content with your models."
+                }
+            }
         },
         "charts": {
             "collectionOverview": "Collection Overview",
             "baseModelDistribution": "Base Model Distribution",
             "usageTrends": "Usage Trends (Last 30 Days)",
-            "usageDistribution": "Usage Distribution"
+            "usageDistribution": "Usage Distribution",
+            "date": "Date",
+            "usageCount": "Usage Count",
+            "fileSizeBytes": "File Size (bytes)",
+            "models": "Models",
+            "loraUsage": "LoRA Usage",
+            "checkpointUsage": "Checkpoint Usage",
+            "embeddingUsage": "Embedding Usage"
+        },
+        "modelTypes": {
+            "lora": "LoRA",
+            "locon": "LyCORIS",
+            "dora": "DoRA",
+            "checkpoint": "Checkpoint",
+            "diffusion_model": "Diffusion Model",
+            "embedding": "Embeddings"
+        },
+        "placeholders": {
+            "loading": "Loading...",
+            "noModels": "No models found",
+            "errorLoading": "Error loading data",
+            "noStorageData": "No storage data available",
+            "rootFolder": "Root",
+            "chartLibraryMissing": "Chart requires Chart.js library"
+        },
+        "tooltips": {
+            "tagCount": "{tag}: {count} models",
+            "chartUsage": "{name}: {size}, {count} uses",
+            "chartPercentage": "{label}: {value} ({pct}%)"
         }
     },
     "modals": {

locales/es.json

@@ -251,7 +251,18 @@
             "toggle": "Cambiar tema",
             "switchToLight": "Cambiar a tema claro",
             "switchToDark": "Cambiar a tema oscuro",
-            "switchToAuto": "Cambiar a tema automático"
+            "switchToAuto": "Cambiar a tema automático",
+            "presets": "Preajustes de tema",
+            "default": "Predeterminado",
+            "nord": "Nord",
+            "midnight": "Midnight",
+            "monokai": "Monokai",
+            "dracula": "Dracula",
+            "solarized": "Solarized",
+            "mode": "Modo",
+            "light": "Claro",
+            "dark": "Oscuro",
+            "auto": "Auto"
         },
         "actions": {
             "checkUpdates": "Comprobar actualizaciones",
@@ -263,6 +274,9 @@
         "civitaiApiKey": "Clave API de Civitai",
         "civitaiApiKeyPlaceholder": "Introduce tu clave API de Civitai",
         "civitaiApiKeyHelp": "Utilizada para autenticación al descargar modelos de Civitai",
+        "civitaiApiKeyConfigured": "Configurado",
+        "civitaiApiKeyNotConfigured": "No configurado",
+        "civitaiApiKeySet": "Configurar",
         "civitaiHost": {
             "label": "Host de Civitai",
             "help": "Elige qué sitio de Civitai se abre al usar los enlaces de \"View on Civitai\".",
@@ -303,6 +317,7 @@
             "downloads": "Descargas",
             "videoSettings": "Configuración de video",
             "layoutSettings": "Configuración de diseño",
+            "licenseIcons": "Iconos de licencia",
             "misc": "Varios",
             "backup": "Copias de seguridad",
             "folderSettings": "Raíces predeterminadas",
@@ -583,6 +598,10 @@
             "label": "Ocultar actualizaciones de acceso temprano",
             "help": "Solo actualizaciones de acceso temprano"
         },
+        "licenseIcons": {
+            "useNewStyle": "Usar iconos de licencia actualizados",
+            "useNewStyleHelp": "Mostrar permisos de licencia con indicadores de color (nuevo estilo) o solo iconos de restricción (estilo clásico). Refleja el diseño actual de CivitAI."
+        },
         "misc": {
             "includeTriggerWords": "Incluir palabras clave en la sintaxis de LoRA",
             "includeTriggerWordsHelp": "Incluir palabras clave entrenadas al copiar la sintaxis de LoRA al portapapeles",
@@ -997,6 +1016,18 @@
             "storage": "Almacenamiento",
             "insights": "Perspectivas"
         },
+        "metrics": {
+            "totalModels": "Total de modelos",
+            "totalStorage": "Almacenamiento total",
+            "totalGenerations": "Generaciones totales",
+            "usageRate": "Tasa de uso",
+            "loras": "LoRAs",
+            "checkpoints": "Puntos de control",
+            "embeddings": "Embeddings",
+            "uniqueTags": "Etiquetas únicas",
+            "unusedModels": "Modelos no usados",
+            "avgUsesPerModel": "Prom. usos/modelo"
+        },
         "usage": {
             "mostUsedLoras": "LoRAs más utilizados",
             "mostUsedCheckpoints": "Checkpoints más utilizados",
@@ -1014,13 +1045,77 @@
         },
         "insights": {
             "smartInsights": "Perspectivas inteligentes",
-            "recommendations": "Recomendaciones"
+            "recommendations": "Recomendaciones",
+            "noInsights": "No hay información disponible",
+            "unusedLoras": {
+                "high": {
+                    "title": "Alta cantidad de LoRAs no utilizadas",
+                    "description": "El {percent}% de tus LoRAs ({count}/{total}) nunca se han utilizado.",
+                    "suggestion": "Considera organizar o archivar modelos no utilizados para liberar espacio."
+                }
+            },
+            "unusedCheckpoints": {
+                "detected": {
+                    "title": "Puntos de control no utilizados detectados",
+                    "description": "El {percent}% de tus puntos de control ({count}/{total}) nunca se han utilizado.",
+                    "suggestion": "Revisa y considera eliminar los puntos de control que ya no necesites."
+                }
+            },
+            "unusedEmbeddings": {
+                "high": {
+                    "title": "Alta cantidad de Embeddings no utilizados",
+                    "description": "El {percent}% de tus embeddings ({count}/{total}) nunca se han utilizado.",
+                    "suggestion": "Considera organizar o archivar embeddings no utilizados para optimizar tu colección."
+                }
+            },
+            "collection": {
+                "large": {
+                    "title": "Colección grande detectada",
+                    "description": "Tu colección de modelos está usando {size} de almacenamiento.",
+                    "suggestion": "Considera usar almacenamiento externo o soluciones en la nube para una mejor organización."
+                }
+            },
+            "activity": {
+                "active": {
+                    "title": "Usuario activo",
+                    "description": "¡Has completado {count} generaciones hasta ahora!",
+                    "suggestion": "Sigue explorando y creando contenido increíble con tus modelos."
+                }
+            }
         },
         "charts": {
             "collectionOverview": "Resumen de colección",
             "baseModelDistribution": "Distribución de modelo base",
             "usageTrends": "Tendencias de uso (Últimos 30 días)",
-            "usageDistribution": "Distribución de uso"
+            "usageDistribution": "Distribución de uso",
+            "date": "Fecha",
+            "usageCount": "Conteo de uso",
+            "fileSizeBytes": "Tamaño del archivo (bytes)",
+            "models": "Modelos",
+            "loraUsage": "Uso de LoRA",
+            "checkpointUsage": "Uso de Checkpoint",
+            "embeddingUsage": "Uso de Embedding"
+        },
+        "modelTypes": {
+            "lora": "LoRA",
+            "locon": "LyCORIS",
+            "dora": "DoRA",
+            "checkpoint": "Punto de control",
+            "diffusion_model": "Modelo de difusión",
+            "embedding": "Embeddings"
+        },
+        "placeholders": {
+            "loading": "Cargando...",
+            "noModels": "No se encontraron modelos",
+            "errorLoading": "Error al cargar datos",
+            "noStorageData": "No hay datos de almacenamiento disponibles",
+            "rootFolder": "Raíz",
+            "chartLibraryMissing": "El gráfico requiere la librería Chart.js"
+        },
+        "tooltips": {
+            "tagCount": "{tag}: {count} modelos",
+            "chartUsage": "{name}: {size}, {count} usos",
+            "chartPercentage": "{label}: {value} ({pct}%)"
         }
     },
     "modals": {

locales/fr.json

@@ -251,7 +251,18 @@
             "toggle": "Basculer le thème",
             "switchToLight": "Passer au thème clair",
             "switchToDark": "Passer au thème sombre",
-            "switchToAuto": "Passer au thème automatique"
+            "switchToAuto": "Passer au thème automatique",
+            "presets": "Préréglages de thème",
+            "default": "Par défaut",
+            "nord": "Nord",
+            "midnight": "Midnight",
+            "monokai": "Monokai",
+            "dracula": "Dracula",
+            "solarized": "Solarized",
+            "mode": "Mode",
+            "light": "Clair",
+            "dark": "Sombre",
+            "auto": "Auto"
         },
         "actions": {
             "checkUpdates": "Vérifier les mises à jour",
@@ -263,6 +274,9 @@
         "civitaiApiKey": "Clé API Civitai",
         "civitaiApiKeyPlaceholder": "Entrez votre clé API Civitai",
         "civitaiApiKeyHelp": "Utilisée pour l'authentification lors du téléchargement de modèles depuis Civitai",
+        "civitaiApiKeyConfigured": "Configuré",
+        "civitaiApiKeyNotConfigured": "Non configuré",
+        "civitaiApiKeySet": "Configurer",
         "civitaiHost": {
             "label": "Hôte Civitai",
             "help": "Choisissez quel site Civitai s'ouvre lorsque vous utilisez les liens « View on Civitai ».",
@@ -303,6 +317,7 @@
             "downloads": "Téléchargements",
             "videoSettings": "Paramètres vidéo",
             "layoutSettings": "Paramètres d'affichage",
+            "licenseIcons": "Icônes de licence",
             "misc": "Divers",
             "backup": "Sauvegardes",
             "folderSettings": "Racines par défaut",
@@ -583,6 +598,10 @@
             "label": "Masquer les mises à jour en accès anticipé",
             "help": "Seulement les mises à jour en accès anticipé"
         },
+        "licenseIcons": {
+            "useNewStyle": "Utiliser les icônes de licence mises à jour",
+            "useNewStyleHelp": "Afficher les permissions de licence avec des indicateurs colorés (nouveau style) ou des icônes de restriction uniquement (style classique). Reprend le design actuel de CivitAI."
+        },
         "misc": {
             "includeTriggerWords": "Inclure les mots-clés dans la syntaxe LoRA",
             "includeTriggerWordsHelp": "Inclure les mots-clés d'entraînement lors de la copie de la syntaxe LoRA dans le presse-papiers",
@@ -997,6 +1016,18 @@
             "storage": "Stockage",
             "insights": "Aperçus"
         },
+        "metrics": {
+            "totalModels": "Total des modèles",
+            "totalStorage": "Stockage total",
+            "totalGenerations": "Générations totales",
+            "usageRate": "Taux d'utilisation",
+            "loras": "LoRAs",
+            "checkpoints": "Points de contrôle",
+            "embeddings": "Embeddings",
+            "uniqueTags": "Tags uniques",
+            "unusedModels": "Modèles inutilisés",
+            "avgUsesPerModel": "Moy. utilisations/modèle"
+        },
         "usage": {
             "mostUsedLoras": "LoRAs les plus utilisés",
             "mostUsedCheckpoints": "Checkpoints les plus utilisés",
@@ -1014,13 +1045,77 @@
         },
         "insights": {
             "smartInsights": "Aperçus intelligents",
-            "recommendations": "Recommandations"
+            "recommendations": "Recommandations",
+            "noInsights": "Aucun aperçu disponible",
+            "unusedLoras": {
+                "high": {
+                    "title": "Nombre élevé de LoRAs inutilisées",
+                    "description": "{percent}% de vos LoRAs ({count}/{total}) n'ont jamais été utilisées.",
+                    "suggestion": "Envisagez d'organiser ou d'archiver les modèles inutilisés pour libérer de l'espace."
+                }
+            },
+            "unusedCheckpoints": {
+                "detected": {
+                    "title": "Points de contrôle inutilisés détectés",
+                    "description": "{percent}% de vos points de contrôle ({count}/{total}) n'ont jamais été utilisés.",
+                    "suggestion": "Examinez et envisagez de supprimer les points de contrôle dont vous n'avez plus besoin."
+                }
+            },
+            "unusedEmbeddings": {
+                "high": {
+                    "title": "Nombre élevé d'Embeddings inutilisées",
+                    "description": "{percent}% de vos embeddings ({count}/{total}) n'ont jamais été utilisées.",
+                    "suggestion": "Envisagez d'organiser ou d'archiver les embeddings inutilisées pour optimiser votre collection."
+                }
+            },
+            "collection": {
+                "large": {
+                    "title": "Grande collection détectée",
+                    "description": "Votre collection de modèles utilise {size} de stockage.",
+                    "suggestion": "Envisagez d'utiliser un stockage externe ou des solutions cloud pour une meilleure organisation."
+                }
+            },
+            "activity": {
+                "active": {
+                    "title": "Utilisateur actif",
+                    "description": "Vous avez effectué {count} générations jusqu'à présent !",
+                    "suggestion": "Continuez à explorer et à créer du contenu formidable avec vos modèles."
+                }
+            }
         },
         "charts": {
             "collectionOverview": "Aperçu de la collection",
             "baseModelDistribution": "Distribution des modèles de base",
             "usageTrends": "Tendances d'utilisation (30 derniers jours)",
-            "usageDistribution": "Distribution de l'utilisation"
+            "usageDistribution": "Distribution de l'utilisation",
+            "date": "Date",
+            "usageCount": "Nombre d'utilisations",
+            "fileSizeBytes": "Taille du fichier (octets)",
+            "models": "Modèles",
+            "loraUsage": "Utilisation LoRA",
+            "checkpointUsage": "Utilisation Checkpoint",
+            "embeddingUsage": "Utilisation Embedding"
+        },
+        "modelTypes": {
+            "lora": "LoRA",
+            "locon": "LyCORIS",
+            "dora": "DoRA",
+            "checkpoint": "Point de contrôle",
+            "diffusion_model": "Modèle de diffusion",
+            "embedding": "Embeddings"
+        },
+        "placeholders": {
+            "loading": "Chargement...",
+            "noModels": "Aucun modèle trouvé",
+            "errorLoading": "Erreur de chargement des données",
+            "noStorageData": "Aucune donnée de stockage disponible",
+            "rootFolder": "Racine",
+            "chartLibraryMissing": "Le graphique nécessite la bibliothèque Chart.js"
+        },
+        "tooltips": {
+            "tagCount": "{tag}: {count} modèles",
+            "chartUsage": "{name}: {size}, {count} utilisations",
+            "chartPercentage": "{label}: {value} ({pct}%)"
         }
     },
     "modals": {

locales/he.json

@@ -251,7 +251,18 @@
             "toggle": "החלף ערכת נושא",
             "switchToLight": "עבור לערכת נושא בהירה",
             "switchToDark": "עבור לערכת נושא כהה",
-            "switchToAuto": "עבור לערכת נושא אוטומטית"
+            "switchToAuto": "עבור לערכת נושא אוטומטית",
+            "presets": "ערכות נושא מוגדרות",
+            "default": "ברירת מחדל",
+            "nord": "Nord",
+            "midnight": "Midnight",
+            "monokai": "Monokai",
+            "dracula": "Dracula",
+            "solarized": "Solarized",
+            "mode": "מצב",
+            "light": "בהיר",
+            "dark": "כהה",
+            "auto": "אוטומטי"
         },
         "actions": {
             "checkUpdates": "בדוק עדכונים",
@@ -263,6 +274,9 @@
         "civitaiApiKey": "מפתח API של Civitai",
         "civitaiApiKeyPlaceholder": "הזן את מפתח ה-API שלך מ-Civitai",
         "civitaiApiKeyHelp": "משמש לאימות בעת הורדת מודלים מ-Civitai",
+        "civitaiApiKeyConfigured": "מוגדר",
+        "civitaiApiKeyNotConfigured": "לא מוגדר",
+        "civitaiApiKeySet": "הגדר",
         "civitaiHost": {
             "label": "מארח Civitai",
             "help": "בחר איזה אתר של Civitai ייפתח בעת שימוש בקישורי \"View on Civitai\".",
@@ -303,6 +317,7 @@
             "downloads": "הורדות",
             "videoSettings": "הגדרות וידאו",
             "layoutSettings": "הגדרות פריסה",
+            "licenseIcons": "סמלי רישיון",
             "misc": "שונות",
             "backup": "גיבויים",
             "folderSettings": "תיקיות ברירת מחדל",
@@ -583,6 +598,10 @@
             "label": "הסתר עדכוני גישה מוקדמת",
             "help": "רק עדכוני גישה מוקדמת"
         },
+        "licenseIcons": {
+            "useNewStyle": "השתמש בסמלי רישיון מעודכנים",
+            "useNewStyleHelp": "הצג הרשאות רישיון עם מחוונים צבעוניים (סגנון חדש) או סמלי הגבלה בלבד (סגנון קלאסי). משקף את העיצוב העדכני של CivitAI."
+        },
         "misc": {
             "includeTriggerWords": "כלול מילות טריגר בתחביר LoRA",
             "includeTriggerWordsHelp": "כלול מילות טריגר מאומנות בעת העתקת תחביר LoRA ללוח",
@@ -997,6 +1016,18 @@
             "storage": "אחסון",
             "insights": "תובנות"
         },
+        "metrics": {
+            "totalModels": "סה\"כ דגמים",
+            "totalStorage": "סה\"כ אחסון",
+            "totalGenerations": "סה\"כ יצירות",
+            "usageRate": "שיעור שימוש",
+            "loras": "LoRA",
+            "checkpoints": "נקודות ביקורת",
+            "embeddings": "הטמעות",
+            "uniqueTags": "תגיות ייחודיות",
+            "unusedModels": "דגמים שאינם בשימוש",
+            "avgUsesPerModel": "ממוצע שימושים/דגם"
+        },
         "usage": {
             "mostUsedLoras": "LoRAs הנפוצים ביותר",
             "mostUsedCheckpoints": "Checkpoints הנפוצים ביותר",
@@ -1014,13 +1045,77 @@
         },
         "insights": {
             "smartInsights": "תובנות חכמות",
-            "recommendations": "המלצות"
+            "recommendations": "המלצות",
+            "noInsights": "אין תובנות זמינות",
+            "unusedLoras": {
+                "high": {
+                    "title": "כמות גבוהה של LoRAs שאינן בשימוש",
+                    "description": "{percent}% מה-LoRAs שלך ({count}/{total}) מעולם לא נעשה בהם שימוש.",
+                    "suggestion": "שקול לארגן או לאחסן בארכיון מודלים שאינם בשימוש כדי לפנות שטח אחסון."
+                }
+            },
+            "unusedCheckpoints": {
+                "detected": {
+                    "title": "התגלו נקודות ביקורת שאינן בשימוש",
+                    "description": "{percent}% מנקודות הביקורת שלך ({count}/{total}) מעולם לא נעשה בהן שימוש.",
+                    "suggestion": "בדוק ושקול להסיר נקודות ביקורת שאינך צריך עוד."
+                }
+            },
+            "unusedEmbeddings": {
+                "high": {
+                    "title": "כמות גבוהה של Embeddings שאינם בשימוש",
+                    "description": "{percent}% מה-Embeddings שלך ({count}/{total}) מעולם לא נעשה בהם שימוש.",
+                    "suggestion": "שקול לארגן או לאחסן בארכיון Embeddings שאינם בשימוש כדי לייעל את האוסף."
+                }
+            },
+            "collection": {
+                "large": {
+                    "title": "התגלה אוסף גדול",
+                    "description": "אוסף המודלים שלך משתמש ב-{size} של אחסון.",
+                    "suggestion": "שקול להשתמש באחסון חיצוני או בפתרונות ענן לארגון טוב יותר."
+                }
+            },
+            "activity": {
+                "active": {
+                    "title": "משתמש פעיל",
+                    "description": "השלמת {count} יצירות עד כה!",
+                    "suggestion": "המשך לחקור וליצור תוכן מדהים עם המודלים שלך."
+                }
+            }
         },
         "charts": {
             "collectionOverview": "סקירת אוסף",
             "baseModelDistribution": "התפלגות מודלי בסיס",
             "usageTrends": "מגמות שימוש (30 יום אחרונים)",
-            "usageDistribution": "התפלגות שימוש"
+            "usageDistribution": "התפלגות שימוש",
+            "date": "תאריך",
+            "usageCount": "מספר שימושים",
+            "fileSizeBytes": "גודל קובץ (בתים)",
+            "models": "דגמים",
+            "loraUsage": "שימוש ב-LoRA",
+            "checkpointUsage": "שימוש ב-Checkpoint",
+            "embeddingUsage": "שימוש ב-Embedding"
+        },
+        "modelTypes": {
+            "lora": "LoRA",
+            "locon": "LyCORIS",
+            "dora": "DoRA",
+            "checkpoint": "נקודת ביקורת",
+            "diffusion_model": "מודל דיפוזיה",
+            "embedding": "הטמעות"
+        },
+        "placeholders": {
+            "loading": "טוען...",
+            "noModels": "לא נמצאו דגמים",
+            "errorLoading": "שגיאה בטעינת נתונים",
+            "noStorageData": "אין נתוני אחסון זמינים",
+            "rootFolder": "שורש",
+            "chartLibraryMissing": "הגרף דורש את ספריית Chart.js"
+        },
+        "tooltips": {
+            "tagCount": "{tag}: {count} דגמים",
+            "chartUsage": "{name}: {size}, {count} שימושים",
+            "chartPercentage": "{label}: {value} ({pct}%)"
         }
     },
     "modals": {

locales/ja.json

@@ -251,7 +251,18 @@
             "toggle": "テーマの切り替え",
             "switchToLight": "ライトテーマに切り替え",
             "switchToDark": "ダークテーマに切り替え",
-            "switchToAuto": "自動テーマに切り替え"
+            "switchToAuto": "自動テーマに切り替え",
+            "presets": "テーマプリセット",
+            "default": "デフォルト",
+            "nord": "Nord",
+            "midnight": "Midnight",
+            "monokai": "Monokai",
+            "dracula": "Dracula",
+            "solarized": "Solarized",
+            "mode": "モード",
+            "light": "ライト",
+            "dark": "ダーク",
+            "auto": "自動"
         },
         "actions": {
             "checkUpdates": "更新確認",
@@ -263,6 +274,9 @@
         "civitaiApiKey": "Civitai APIキー",
         "civitaiApiKeyPlaceholder": "Civitai APIキーを入力してください",
         "civitaiApiKeyHelp": "Civitaiからモデルをダウンロードするときの認証に使用されます",
+        "civitaiApiKeyConfigured": "設定済み",
+        "civitaiApiKeyNotConfigured": "未設定",
+        "civitaiApiKeySet": "設定",
         "civitaiHost": {
             "label": "Civitai ホスト",
             "help": "「View on Civitai」リンクを使うときに開く Civitai サイトを選択します。",
@@ -303,6 +317,7 @@
             "downloads": "ダウンロード",
             "videoSettings": "動画設定",
             "layoutSettings": "レイアウト設定",
+            "licenseIcons": "ライセンスアイコン",
             "misc": "その他",
             "backup": "バックアップ",
             "folderSettings": "デフォルトルート",
@@ -583,6 +598,10 @@
             "label": "早期アクセス更新を非表示",
             "help": "早期アクセスのみの更新"
         },
+        "licenseIcons": {
+            "useNewStyle": "更新されたライセンスアイコンを使用",
+            "useNewStyleHelp": "カラーインジケーター付きでライセンス許可を表示（新スタイル）するか、制限のみのアイコンを表示（クラシックスタイル）します。現在のCivitAIデザインを反映しています。"
+        },
         "misc": {
             "includeTriggerWords": "LoRA構文にトリガーワードを含める",
             "includeTriggerWordsHelp": "LoRA構文をクリップボードにコピーする際、学習済みトリガーワードを含めます",
@@ -997,6 +1016,18 @@
             "storage": "ストレージ",
             "insights": "インサイト"
         },
+        "metrics": {
+            "totalModels": "モデル総数",
+            "totalStorage": "ストレージ合計",
+            "totalGenerations": "生成回数合計",
+            "usageRate": "使用率",
+            "loras": "LoRA",
+            "checkpoints": "Checkpoint",
+            "embeddings": "Embedding",
+            "uniqueTags": "ユニークタグ",
+            "unusedModels": "未使用モデル",
+            "avgUsesPerModel": "平均使用回数/モデル"
+        },
         "usage": {
             "mostUsedLoras": "最も使用されているLoRA",
             "mostUsedCheckpoints": "最も使用されているCheckpoint",
@@ -1014,13 +1045,77 @@
         },
         "insights": {
             "smartInsights": "スマートインサイト",
-            "recommendations": "推奨事項"
+            "recommendations": "推奨事項",
+            "noInsights": "インサイトはありません",
+            "unusedLoras": {
+                "high": {
+                    "title": "未使用のLoRAが多数あります",
+                    "description": "LoRAの{percent}%（{count}/{total}）が一度も使用されていません。",
+                    "suggestion": "未使用のモデルを整理またはアーカイブしてストレージを解放してください。"
+                }
+            },
+            "unusedCheckpoints": {
+                "detected": {
+                    "title": "未使用のCheckpointを検出",
+                    "description": "Checkpointの{percent}%（{count}/{total}）が一度も使用されていません。",
+                    "suggestion": "不要なCheckpointを確認して削除を検討してください。"
+                }
+            },
+            "unusedEmbeddings": {
+                "high": {
+                    "title": "未使用のEmbeddingが多数あります",
+                    "description": "Embeddingの{percent}%（{count}/{total}）が一度も使用されていません。",
+                    "suggestion": "未使用のEmbeddingを整理またはアーカイブしてコレクションを最適化してください。"
+                }
+            },
+            "collection": {
+                "large": {
+                    "title": "大規模コレクションを検出",
+                    "description": "モデルコレクションが{size}のストレージを使用しています。",
+                    "suggestion": "外部ストレージやクラウドソリューションの使用を検討してください。"
+                }
+            },
+            "activity": {
+                "active": {
+                    "title": "アクティブユーザー",
+                    "description": "これまでに{count}回の生成を完了しました！",
+                    "suggestion": "モデルを使って素晴らしいコンテンツを作り続けてください。"
+                }
+            }
         },
         "charts": {
             "collectionOverview": "コレクション概要",
             "baseModelDistribution": "ベースモデル分布",
             "usageTrends": "使用傾向（過去30日）",
-            "usageDistribution": "使用分布"
+            "usageDistribution": "使用分布",
+            "date": "日付",
+            "usageCount": "使用回数",
+            "fileSizeBytes": "ファイルサイズ（バイト）",
+            "models": "モデル",
+            "loraUsage": "LoRA 使用量",
+            "checkpointUsage": "Checkpoint 使用量",
+            "embeddingUsage": "Embedding 使用量"
+        },
+        "modelTypes": {
+            "lora": "LoRA",
+            "locon": "LyCORIS",
+            "dora": "DoRA",
+            "checkpoint": "Checkpoint",
+            "diffusion_model": "拡散モデル",
+            "embedding": "Embedding"
+        },
+        "placeholders": {
+            "loading": "読み込み中...",
+            "noModels": "モデルが見つかりません",
+            "errorLoading": "データ読み込みエラー",
+            "noStorageData": "ストレージデータがありません",
+            "rootFolder": "ルート",
+            "chartLibraryMissing": "Chart.js ライブラリが必要です"
+        },
+        "tooltips": {
+            "tagCount": "{tag}: {count} モデル",
+            "chartUsage": "{name}: {size}, {count} 回使用",
+            "chartPercentage": "{label}: {value} ({pct}%)"
         }
     },
     "modals": {

locales/ko.json

@@ -251,7 +251,18 @@
             "toggle": "테마 토글",
             "switchToLight": "라이트 테마로 전환",
             "switchToDark": "다크 테마로 전환",
-            "switchToAuto": "자동 테마로 전환"
+            "switchToAuto": "자동 테마로 전환",
+            "presets": "테마 프리셋",
+            "default": "기본",
+            "nord": "Nord",
+            "midnight": "Midnight",
+            "monokai": "Monokai",
+            "dracula": "Dracula",
+            "solarized": "Solarized",
+            "mode": "모드",
+            "light": "라이트",
+            "dark": "다크",
+            "auto": "자동"
         },
         "actions": {
             "checkUpdates": "업데이트 확인",
@@ -263,6 +274,9 @@
         "civitaiApiKey": "Civitai API 키",
         "civitaiApiKeyPlaceholder": "Civitai API 키를 입력하세요",
         "civitaiApiKeyHelp": "Civitai에서 모델을 다운로드할 때 인증에 사용됩니다",
+        "civitaiApiKeyConfigured": "설정됨",
+        "civitaiApiKeyNotConfigured": "설정되지 않음",
+        "civitaiApiKeySet": "설정",
         "civitaiHost": {
             "label": "Civitai 호스트",
             "help": "\"View on Civitai\" 링크를 사용할 때 어떤 Civitai 사이트를 열지 선택합니다.",
@@ -303,6 +317,7 @@
             "downloads": "다운로드",
             "videoSettings": "비디오 설정",
             "layoutSettings": "레이아웃 설정",
+            "licenseIcons": "라이선스 아이콘",
             "misc": "기타",
             "backup": "백업",
             "folderSettings": "기본 루트",
@@ -583,6 +598,10 @@
             "label": "얼리 액세스 업데이트 숨기기",
             "help": "얼리 액세스 업데이트만"
         },
+        "licenseIcons": {
+            "useNewStyle": "업데이트된 라이선스 아이콘 사용",
+            "useNewStyleHelp": "색상 표시기가 있는 라이선스 권한(새 스타일) 또는 제한 전용 아이콘(클래식 스타일)을 표시합니다. 현재 CivitAI 디자인을 반영합니다."
+        },
         "misc": {
             "includeTriggerWords": "LoRA 문법에 트리거 단어 포함",
             "includeTriggerWordsHelp": "LoRA 문법을 클립보드에 복사할 때 학습된 트리거 단어를 포함합니다",
@@ -997,6 +1016,18 @@
             "storage": "저장소",
             "insights": "인사이트"
         },
+        "metrics": {
+            "totalModels": "모델 총계",
+            "totalStorage": "총 저장 공간",
+            "totalGenerations": "총 생성 횟수",
+            "usageRate": "사용률",
+            "loras": "LoRA",
+            "checkpoints": "Checkpoint",
+            "embeddings": "Embedding",
+            "uniqueTags": "고유 태그",
+            "unusedModels": "미사용 모델",
+            "avgUsesPerModel": "모델당 평균 사용"
+        },
         "usage": {
             "mostUsedLoras": "가장 많이 사용된 LoRA",
             "mostUsedCheckpoints": "가장 많이 사용된 Checkpoint",
@@ -1014,13 +1045,77 @@
         },
         "insights": {
             "smartInsights": "스마트 인사이트",
-            "recommendations": "추천"
+            "recommendations": "추천",
+            "noInsights": "인사이트 없음",
+            "unusedLoras": {
+                "high": {
+                    "title": "사용하지 않은 LoRA가 많음",
+                    "description": "LoRA의 {percent}%({count}/{total})가 한 번도 사용되지 않았습니다.",
+                    "suggestion": "사용하지 않는 모델을 정리하거나 보관하여 저장 공간을 확보하세요."
+                }
+            },
+            "unusedCheckpoints": {
+                "detected": {
+                    "title": "사용하지 않은 Checkpoint 감지",
+                    "description": "Checkpoint의 {percent}%({count}/{total})가 한 번도 사용되지 않았습니다.",
+                    "suggestion": "더 이상 필요하지 않은 Checkpoint를 검토하고 제거하세요."
+                }
+            },
+            "unusedEmbeddings": {
+                "high": {
+                    "title": "사용하지 않은 Embedding이 많음",
+                    "description": "Embedding의 {percent}%({count}/{total})가 한 번도 사용되지 않았습니다.",
+                    "suggestion": "사용하지 않는 Embedding을 정리하여 컬렉션을 최적화하세요."
+                }
+            },
+            "collection": {
+                "large": {
+                    "title": "대규모 컬렉션 감지",
+                    "description": "모델 컬렉션이 {size}의 저장 공간을 사용 중입니다.",
+                    "suggestion": "더 나은 관리를 위해 외부 저장소나 클라우드 솔루션을 고려하세요."
+                }
+            },
+            "activity": {
+                "active": {
+                    "title": "활성 사용자",
+                    "description": "지금까지 {count}번의 생성을 완료했습니다!",
+                    "suggestion": "모델로 계속해서 멋진 콘텐츠를 탐색하고 만들어보세요."
+                }
+            }
         },
         "charts": {
             "collectionOverview": "컬렉션 개요",
             "baseModelDistribution": "베이스 모델 분포",
             "usageTrends": "사용량 트렌드 (최근 30일)",
-            "usageDistribution": "사용량 분포"
+            "usageDistribution": "사용량 분포",
+            "date": "날짜",
+            "usageCount": "사용 횟수",
+            "fileSizeBytes": "파일 크기(바이트)",
+            "models": "모델",
+            "loraUsage": "LoRA 사용량",
+            "checkpointUsage": "Checkpoint 사용량",
+            "embeddingUsage": "Embedding 사용량"
+        },
+        "modelTypes": {
+            "lora": "LoRA",
+            "locon": "LyCORIS",
+            "dora": "DoRA",
+            "checkpoint": "Checkpoint",
+            "diffusion_model": "확산 모델",
+            "embedding": "Embedding"
+        },
+        "placeholders": {
+            "loading": "로딩 중...",
+            "noModels": "모델을 찾을 수 없음",
+            "errorLoading": "데이터 로딩 오류",
+            "noStorageData": "저장 데이터 없음",
+            "rootFolder": "루트",
+            "chartLibraryMissing": "Chart.js 라이브러리가 필요합니다"
+        },
+        "tooltips": {
+            "tagCount": "{tag}: {count}개 모델",
+            "chartUsage": "{name}: {size}, {count}회 사용",
+            "chartPercentage": "{label}: {value}({pct}%)"
         }
     },
     "modals": {

locales/ru.json

@@ -251,7 +251,18 @@
             "toggle": "Переключить тему",
             "switchToLight": "Переключить на светлую тему",
             "switchToDark": "Переключить на тёмную тему",
-            "switchToAuto": "Переключить на автоматическую тему"
+            "switchToAuto": "Переключить на автоматическую тему",
+            "presets": "Предустановки тем",
+            "default": "По умолчанию",
+            "nord": "Nord",
+            "midnight": "Midnight",
+            "monokai": "Monokai",
+            "dracula": "Dracula",
+            "solarized": "Solarized",
+            "mode": "Режим",
+            "light": "Светлый",
+            "dark": "Тёмный",
+            "auto": "Авто"
         },
         "actions": {
             "checkUpdates": "Проверить обновления",
@@ -263,6 +274,9 @@
         "civitaiApiKey": "Ключ API Civitai",
         "civitaiApiKeyPlaceholder": "Введите ваш ключ API Civitai",
         "civitaiApiKeyHelp": "Используется для аутентификации при загрузке моделей с Civitai",
+        "civitaiApiKeyConfigured": "Настроен",
+        "civitaiApiKeyNotConfigured": "Не настроен",
+        "civitaiApiKeySet": "Настроить",
         "civitaiHost": {
             "label": "Хост Civitai",
             "help": "Выберите, какой сайт Civitai будет открываться при использовании ссылок «View on Civitai».",
@@ -303,6 +317,7 @@
             "downloads": "Загрузки",
             "videoSettings": "Настройки видео",
             "layoutSettings": "Настройки макета",
+            "licenseIcons": "Значки лицензии",
             "misc": "Разное",
             "backup": "Резервные копии",
             "folderSettings": "Корневые папки",
@@ -583,6 +598,10 @@
             "label": "Скрыть обновления раннего доступа",
             "help": "Только обновления раннего доступа"
         },
+        "licenseIcons": {
+            "useNewStyle": "Использовать обновлённые значки лицензии",
+            "useNewStyleHelp": "Отображать разрешения лицензии с цветными индикаторами (новый стиль) или только значки ограничений (классический стиль). Соответствует текущему дизайну CivitAI."
+        },
         "misc": {
             "includeTriggerWords": "Включать триггерные слова в синтаксис LoRA",
             "includeTriggerWordsHelp": "Включать обученные триггерные слова при копировании синтаксиса LoRA в буфер обмена",
@@ -997,6 +1016,18 @@
             "storage": "Хранение",
             "insights": "Аналитика"
         },
+        "metrics": {
+            "totalModels": "Всего моделей",
+            "totalStorage": "Всего хранилища",
+            "totalGenerations": "Всего генераций",
+            "usageRate": "Коэффициент использования",
+            "loras": "LoRA",
+            "checkpoints": "Контрольные точки",
+            "embeddings": "Эмбеддинги",
+            "uniqueTags": "Уникальные теги",
+            "unusedModels": "Неиспользуемые модели",
+            "avgUsesPerModel": "Сред. использований/модель"
+        },
         "usage": {
             "mostUsedLoras": "Наиболее используемые LoRAs",
             "mostUsedCheckpoints": "Наиболее используемые Checkpoints",
@@ -1014,13 +1045,77 @@
         },
         "insights": {
             "smartInsights": "Умная аналитика",
-            "recommendations": "Рекомендации"
+            "recommendations": "Рекомендации",
+            "noInsights": "Нет доступных данных",
+            "unusedLoras": {
+                "high": {
+                    "title": "Большое количество неиспользуемых LoRA",
+                    "description": "{percent}% ваших LoRA ({count}/{total}) никогда не использовались.",
+                    "suggestion": "Рассмотрите возможность организации или архивирования неиспользуемых моделей для освобождения места."
+                }
+            },
+            "unusedCheckpoints": {
+                "detected": {
+                    "title": "Обнаружены неиспользуемые контрольные точки",
+                    "description": "{percent}% ваших контрольных точек ({count}/{total}) никогда не использовались.",
+                    "suggestion": "Проверьте и удалите ненужные контрольные точки."
+                }
+            },
+            "unusedEmbeddings": {
+                "high": {
+                    "title": "Большое количество неиспользуемых эмбеддингов",
+                    "description": "{percent}% ваших эмбеддингов ({count}/{total}) никогда не использовались.",
+                    "suggestion": "Организуйте или архивируйте неиспользуемые эмбеддинги для оптимизации коллекции."
+                }
+            },
+            "collection": {
+                "large": {
+                    "title": "Обнаружена большая коллекция",
+                    "description": "Ваша коллекция моделей использует {size} хранилища.",
+                    "suggestion": "Рассмотрите внешнее хранилище или облачные решения для лучшей организации."
+                }
+            },
+            "activity": {
+                "active": {
+                    "title": "Активный пользователь",
+                    "description": "Вы завершили {count} генераций!",
+                    "suggestion": "Продолжайте исследовать и создавать удивительный контент с вашими моделями."
+                }
+            }
         },
         "charts": {
             "collectionOverview": "Обзор коллекции",
             "baseModelDistribution": "Распределение базовых моделей",
             "usageTrends": "Тенденции использования (за последние 30 дней)",
-            "usageDistribution": "Распределение использования"
+            "usageDistribution": "Распределение использования",
+            "date": "Дата",
+            "usageCount": "Количество использований",
+            "fileSizeBytes": "Размер файла (байты)",
+            "models": "Модели",
+            "loraUsage": "Использование LoRA",
+            "checkpointUsage": "Использование Checkpoint",
+            "embeddingUsage": "Использование Embedding"
+        },
+        "modelTypes": {
+            "lora": "LoRA",
+            "locon": "LyCORIS",
+            "dora": "DoRA",
+            "checkpoint": "Контрольная точка",
+            "diffusion_model": "Диффузионная модель",
+            "embedding": "Эмбеддинги"
+        },
+        "placeholders": {
+            "loading": "Загрузка...",
+            "noModels": "Модели не найдены",
+            "errorLoading": "Ошибка загрузки данных",
+            "noStorageData": "Нет данных о хранилище",
+            "rootFolder": "Корень",
+            "chartLibraryMissing": "Для графика требуется библиотека Chart.js"
+        },
+        "tooltips": {
+            "tagCount": "{tag}: {count} моделей",
+            "chartUsage": "{name}: {size}, {count} использований",
+            "chartPercentage": "{label}: {value} ({pct}%)"
         }
     },
     "modals": {

locales/zh-CN.json

@@ -251,7 +251,18 @@
             "toggle": "切换主题",
             "switchToLight": "切换到浅色主题",
             "switchToDark": "切换到深色主题",
-            "switchToAuto": "切换到自动主题"
+            "switchToAuto": "切换到自动主题",
+            "presets": "主题预设",
+            "default": "默认",
+            "nord": "Nord",
+            "midnight": "Midnight",
+            "monokai": "Monokai",
+            "dracula": "Dracula",
+            "solarized": "Solarized",
+            "mode": "模式",
+            "light": "浅色",
+            "dark": "深色",
+            "auto": "自动"
         },
         "actions": {
             "checkUpdates": "检查更新",
@@ -263,6 +274,9 @@
         "civitaiApiKey": "Civitai API 密钥",
         "civitaiApiKeyPlaceholder": "请输入你的 Civitai API 密钥",
         "civitaiApiKeyHelp": "用于从 Civitai 下载模型时的身份验证",
+        "civitaiApiKeyConfigured": "已配置",
+        "civitaiApiKeyNotConfigured": "未配置",
+        "civitaiApiKeySet": "设置",
         "civitaiHost": {
             "label": "Civitai 站点",
             "help": "选择使用“在 Civitai 中查看”时默认打开的 Civitai 站点。",
@@ -303,6 +317,7 @@
             "downloads": "下载",
             "videoSettings": "视频设置",
             "layoutSettings": "布局设置",
+            "licenseIcons": "许可协议图标",
             "misc": "其他",
             "backup": "备份",
             "folderSettings": "默认根目录",
@@ -583,6 +598,10 @@
             "label": "隐藏抢先体验更新",
             "help": "抢先体验更新"
         },
+        "licenseIcons": {
+            "useNewStyle": "使用新版许可协议图标",
+            "useNewStyleHelp": "以彩色指示器显示许可权限（新样式），或仅显示限制图标（经典样式）。与当前 CivitAI 设计保持一致。"
+        },
         "misc": {
             "includeTriggerWords": "复制 LoRA 语法时包含触发词",
             "includeTriggerWordsHelp": "复制 LoRA 语法到剪贴板时包含训练触发词",
@@ -997,6 +1016,18 @@
             "storage": "存储",
             "insights": "洞察"
         },
+        "metrics": {
+            "totalModels": "模型总数",
+            "totalStorage": "总存储空间",
+            "totalGenerations": "总生成次数",
+            "usageRate": "使用率",
+            "loras": "LoRA",
+            "checkpoints": "Checkpoint",
+            "embeddings": "Embedding",
+            "uniqueTags": "唯一标签",
+            "unusedModels": "未使用模型",
+            "avgUsesPerModel": "平均使用次数/模型"
+        },
         "usage": {
             "mostUsedLoras": "最常用 LoRA",
             "mostUsedCheckpoints": "最常用 Checkpoint",
@@ -1014,13 +1045,77 @@
         },
         "insights": {
             "smartInsights": "智能洞察",
-            "recommendations": "推荐"
+            "recommendations": "推荐",
+            "noInsights": "暂无可用洞察",
+            "unusedLoras": {
+                "high": {
+                    "title": "大量未使用的 LoRA",
+                    "description": "你的 LoRA 中有 {percent}%（{count}/{total}）从未被使用过。",
+                    "suggestion": "考虑整理或归档未使用的模型以释放存储空间。"
+                }
+            },
+            "unusedCheckpoints": {
+                "detected": {
+                    "title": "检测到未使用的 Checkpoint",
+                    "description": "你的 Checkpoint 中有 {percent}%（{count}/{total}）从未被使用过。",
+                    "suggestion": "审查并考虑删除不再需要的 Checkpoint。"
+                }
+            },
+            "unusedEmbeddings": {
+                "high": {
+                    "title": "大量未使用的 Embedding",
+                    "description": "你的 Embedding 中有 {percent}%（{count}/{total}）从未被使用过。",
+                    "suggestion": "考虑整理或归档未使用的 Embedding 以优化你的收藏。"
+                }
+            },
+            "collection": {
+                "large": {
+                    "title": "检测到大型收藏",
+                    "description": "你的模型收藏正在使用 {size} 的存储空间。",
+                    "suggestion": "考虑使用外部存储或云解决方案以获得更好的组织。"
+                }
+            },
+            "activity": {
+                "active": {
+                    "title": "活跃用户",
+                    "description": "你已经完成了 {count} 次生成！",
+                    "suggestion": "继续探索并用你的模型创作精彩内容。"
+                }
+            }
         },
         "charts": {
             "collectionOverview": "收藏概览",
             "baseModelDistribution": "基础模型分布",
             "usageTrends": "使用趋势（最近30天）",
-            "usageDistribution": "使用分布"
+            "usageDistribution": "使用分布",
+            "date": "日期",
+            "usageCount": "使用次数",
+            "fileSizeBytes": "文件大小（字节）",
+            "models": "模型",
+            "loraUsage": "LoRA 使用量",
+            "checkpointUsage": "Checkpoint 使用量",
+            "embeddingUsage": "Embedding 使用量"
+        },
+        "modelTypes": {
+            "lora": "LoRA",
+            "locon": "LyCORIS",
+            "dora": "DoRA",
+            "checkpoint": "Checkpoint",
+            "diffusion_model": "扩散模型",
+            "embedding": "Embedding"
+        },
+        "placeholders": {
+            "loading": "加载中...",
+            "noModels": "未找到模型",
+            "errorLoading": "数据加载失败",
+            "noStorageData": "暂无存储数据",
+            "rootFolder": "根目录",
+            "chartLibraryMissing": "需要 Chart.js 库来显示图表"
+        },
+        "tooltips": {
+            "tagCount": "{tag}：{count} 个模型",
+            "chartUsage": "{name}：{size}，{count} 次使用",
+            "chartPercentage": "{label}：{value}（{pct}%）"
         }
     },
     "modals": {

locales/zh-TW.json

@@ -251,7 +251,18 @@
             "toggle": "切換主題",
             "switchToLight": "切換至淺色主題",
             "switchToDark": "切換至深色主題",
-            "switchToAuto": "自動主題"
+            "switchToAuto": "自動主題",
+            "presets": "主題預設",
+            "default": "預設",
+            "nord": "Nord",
+            "midnight": "Midnight",
+            "monokai": "Monokai",
+            "dracula": "Dracula",
+            "solarized": "Solarized",
+            "mode": "模式",
+            "light": "淺色",
+            "dark": "深色",
+            "auto": "自動"
         },
         "actions": {
             "checkUpdates": "檢查更新",
@@ -263,6 +274,9 @@
         "civitaiApiKey": "Civitai API 金鑰",
         "civitaiApiKeyPlaceholder": "請輸入您的 Civitai API 金鑰",
         "civitaiApiKeyHelp": "用於從 Civitai 下載模型時的身份驗證",
+        "civitaiApiKeyConfigured": "已設定",
+        "civitaiApiKeyNotConfigured": "未設定",
+        "civitaiApiKeySet": "設定",
         "civitaiHost": {
             "label": "Civitai 站點",
             "help": "選擇使用「在 Civitai 中查看」時預設開啟的 Civitai 站點。",
@@ -303,6 +317,7 @@
             "downloads": "下載",
             "videoSettings": "影片設定",
             "layoutSettings": "版面設定",
+            "licenseIcons": "許可協議圖標",
             "misc": "其他",
             "backup": "備份",
             "folderSettings": "預設根目錄",
@@ -583,6 +598,10 @@
             "label": "隱藏搶先體驗更新",
             "help": "搶先體驗更新"
         },
+        "licenseIcons": {
+            "useNewStyle": "使用新版許可協議圖標",
+            "useNewStyleHelp": "以彩色指示器顯示許可權限（新樣式），或僅顯示限制圖標（經典樣式）。與當前 CivitAI 設計保持一致。"
+        },
         "misc": {
             "includeTriggerWords": "在 LoRA 語法中包含觸發詞",
             "includeTriggerWordsHelp": "複製 LoRA 語法到剪貼簿時包含訓練觸發詞",
@@ -997,6 +1016,18 @@
             "storage": "儲存空間",
             "insights": "洞察"
         },
+        "metrics": {
+            "totalModels": "模型總數",
+            "totalStorage": "總儲存空間",
+            "totalGenerations": "總生成次數",
+            "usageRate": "使用率",
+            "loras": "LoRA",
+            "checkpoints": "Checkpoint",
+            "embeddings": "Embedding",
+            "uniqueTags": "唯一標籤",
+            "unusedModels": "未使用模型",
+            "avgUsesPerModel": "平均使用次數/模型"
+        },
         "usage": {
             "mostUsedLoras": "最常用的 LoRA",
             "mostUsedCheckpoints": "最常用的 Checkpoint",
@@ -1014,13 +1045,77 @@
         },
         "insights": {
             "smartInsights": "智慧洞察",
-            "recommendations": "推薦"
+            "recommendations": "推薦",
+            "noInsights": "暫無可用洞察",
+            "unusedLoras": {
+                "high": {
+                    "title": "大量未使用的 LoRA",
+                    "description": "你的 LoRA 中有 {percent}%（{count}/{total}）從未被使用過。",
+                    "suggestion": "考慮整理或封存未使用的模型以釋放儲存空間。"
+                }
+            },
+            "unusedCheckpoints": {
+                "detected": {
+                    "title": "檢測到未使用的 Checkpoint",
+                    "description": "你的 Checkpoint 中有 {percent}%（{count}/{total}）從未被使用過。",
+                    "suggestion": "審查並考慮刪除不再需要的 Checkpoint。"
+                }
+            },
+            "unusedEmbeddings": {
+                "high": {
+                    "title": "大量未使用的 Embedding",
+                    "description": "你的 Embedding 中有 {percent}%（{count}/{total}）從未被使用過。",
+                    "suggestion": "考慮整理或封存未使用的 Embedding 以優化你的收藏。"
+                }
+            },
+            "collection": {
+                "large": {
+                    "title": "檢測到大型收藏",
+                    "description": "你的模型收藏正在使用 {size} 的儲存空間。",
+                    "suggestion": "考慮使用外部儲存或雲端解決方案以獲得更好的組織。"
+                }
+            },
+            "activity": {
+                "active": {
+                    "title": "活躍用戶",
+                    "description": "你已經完成了 {count} 次生成！",
+                    "suggestion": "繼續探索並用你的模型創作精彩內容。"
+                }
+            }
         },
         "charts": {
             "collectionOverview": "收藏總覽",
             "baseModelDistribution": "基礎模型分布",
             "usageTrends": "使用趨勢（最近 30 天）",
-            "usageDistribution": "使用分布"
+            "usageDistribution": "使用分布",
+            "date": "日期",
+            "usageCount": "使用次數",
+            "fileSizeBytes": "檔案大小（位元組）",
+            "models": "模型",
+            "loraUsage": "LoRA 使用量",
+            "checkpointUsage": "Checkpoint 使用量",
+            "embeddingUsage": "Embedding 使用量"
+        },
+        "modelTypes": {
+            "lora": "LoRA",
+            "locon": "LyCORIS",
+            "dora": "DoRA",
+            "checkpoint": "Checkpoint",
+            "diffusion_model": "擴散模型",
+            "embedding": "Embedding"
+        },
+        "placeholders": {
+            "loading": "載入中...",
+            "noModels": "找不到模型",
+            "errorLoading": "資料載入失敗",
+            "noStorageData": "暫無儲存資料",
+            "rootFolder": "根目錄",
+            "chartLibraryMissing": "需要 Chart.js 函式庫來顯示圖表"
+        },
+        "tooltips": {
+            "tagCount": "{tag}：{count} 個模型",
+            "chartUsage": "{name}：{size}，{count} 次使用",
+            "chartPercentage": "{label}：{value}（{pct}%）"
         }
     },
     "modals": {

py/metadata_collector/node_extractors.py

@@ -901,6 +901,55 @@ class LoraLoaderManagerExtractor(NodeMetadataExtractor):
                 "node_id": node_id
             }
 
+class LoraTextLoaderManagerExtractor(NodeMetadataExtractor):
+    """Extract LoRA metadata from LoraTextLoaderLM (LoRA Text Loader).
+
+    The node accepts a `lora_syntax` STRING containing <lora:name:strength> tags
+    (same format as the ComfyUI prompt), plus an optional `lora_stack`.
+    This extractor parses the syntax string using the same regex as the node.
+    """
+    @staticmethod
+    def extract(node_id, inputs, outputs, metadata):
+        if not inputs:
+            return
+
+        active_loras = []
+
+        # Process lora_stack if available (optional input)
+        if "lora_stack" in inputs:
+            lora_stack = inputs.get("lora_stack", [])
+            for item in lora_stack:
+                # lora_stack entries are (path, model_strength, clip_strength) tuples
+                if isinstance(item, (list, tuple)) and len(item) >= 2:
+                    lora_path = item[0]
+                    model_strength = item[1]
+                    lora_name = os.path.splitext(os.path.basename(lora_path))[0]
+                    active_loras.append({
+                        "name": lora_name,
+                        "strength": round(float(model_strength), 2)
+                    })
+
+        # Process lora_syntax string input
+        if "lora_syntax" in inputs:
+            lora_syntax = inputs.get("lora_syntax", "")
+            if lora_syntax and isinstance(lora_syntax, str):
+                pattern = r"<lora:([^:>]+):([^:>]+)(?::([^:>]+))?>"
+                matches = re.findall(pattern, lora_syntax, re.IGNORECASE)
+                for match in matches:
+                    lora_name = match[0]
+                    model_strength = float(match[1])
+                    active_loras.append({
+                        "name": lora_name,
+                        "strength": round(model_strength, 2)
+                    })
+
+        if active_loras:
+            metadata[LORAS][node_id] = {
+                "lora_list": active_loras,
+                "node_id": node_id
+            }
+
+
 class FluxGuidanceExtractor(NodeMetadataExtractor):
     @staticmethod
     def extract(node_id, inputs, outputs, metadata):
@@ -1146,6 +1195,7 @@ NODE_EXTRACTORS = {
     "UNETLoaderLM": UNETLoaderExtractor,  # LoRA Manager
     "LoraLoader": LoraLoaderExtractor,
     "LoraLoaderLM": LoraLoaderManagerExtractor,
+    "LoraTextLoaderLM": LoraTextLoaderManagerExtractor,
     "RgthreePowerLoraLoader": RgthreePowerLoraLoaderExtractor,
     "TensorRTLoader": TensorRTLoaderExtractor,
     # Conditioning

py/routes/handlers/misc_handlers.py

@@ -49,7 +49,10 @@ from ...utils.constants import (
     VALID_LORA_TYPES,
 )
 from ...utils.civitai_utils import rewrite_preview_url
-from ...utils.example_images_paths import is_valid_example_images_root
+from ...utils.example_images_paths import (
+    find_non_compliant_items_in_example_images_root,
+    is_valid_example_images_root,
+)
 from ...utils.lora_metadata import extract_trained_words
 from ...utils.session_logging import get_standalone_session_log_snapshot
 from ...utils.usage_stats import UsageStats
@@ -1328,6 +1331,9 @@ class SettingsHandler:
             "folder_paths",
             "libraries",
             "active_library",
+            # Sensitive — never expose the actual value to the frontend;
+            # frontend receives a boolean instead (civitai_api_key_set).
+            "civitai_api_key",
         }
     )
 
@@ -1382,6 +1388,9 @@ class SettingsHandler:
                     value = self._settings.get(key)
                     if value is not None:
                         response_data[key] = value
+            # Sensitive fields: only expose a boolean indicating whether set
+            raw_key = self._settings.get("civitai_api_key")
+            response_data["civitai_api_key_set"] = bool(raw_key)
             settings_file = getattr(self._settings, "settings_file", None)
             if settings_file:
                 response_data["settings_file"] = settings_file
@@ -1492,6 +1501,16 @@ class SettingsHandler:
         if not os.path.isdir(folder_path):
             return "Please set a dedicated folder for example images."
         if not self._is_dedicated_example_images_folder(folder_path):
+            offending = find_non_compliant_items_in_example_images_root(folder_path)
+            if offending:
+                items_str = ", ".join(repr(item) for item in offending[:5])
+                if len(offending) > 5:
+                    items_str += f" … and {len(offending) - 5} more"
+                return (
+                    f"The folder contains items that are not valid example image "
+                    f"folders: {items_str}. Please use a dedicated, empty folder "
+                    f"for example images to prevent accidental data loss."
+                )
             return "Please set a dedicated folder for example images."
         return None
 

py/routes/handlers/model_handlers.py

@@ -1272,6 +1272,14 @@ class ModelQueryHandler:
                     license_flags = (model_data or {}).get("license_flags")
                     if license_flags is not None:
                         response_payload["license_flags"] = int(license_flags)
+                    # Include the user's license icon style preference so the
+                    # ComfyUI tooltip can pick the right set without a separate
+                    # API call.
+                    try:
+                        settings = get_settings_manager()
+                        response_payload["use_new_license_icons"] = settings.get("use_new_license_icons", True)
+                    except Exception:
+                        pass
                 return web.json_response(response_payload)
             return web.json_response(
                 {
@@ -1820,6 +1828,39 @@ class ModelDownloadHandler:
             )
             return web.json_response({"success": False, "error": str(exc)}, status=500)
 
+    async def update_download_queue_status(self, request: web.Request) -> web.Response:
+        """Update the status of a queue item (non-terminal transitions).
+
+        Supported transitions include ``queued → downloading``,
+        ``downloading → paused``, ``paused → downloading``, etc.
+        Terminal transitions (``completed``, ``failed``, ``canceled``)
+        should use ``complete_download_in_queue`` instead.
+        """
+        try:
+            download_id = request.query.get("download_id")
+            status = request.query.get("status")
+            if not download_id or not status:
+                return web.json_response(
+                    {
+                        "success": False,
+                        "error": "download_id and status are required",
+                    },
+                    status=400,
+                )
+            service = await DownloadQueueService.get_instance()
+            updated = await service.update_status(download_id, status)
+            if not updated:
+                return web.json_response(
+                    {"success": False, "error": "Download not found in queue"},
+                    status=404,
+                )
+            return web.json_response({"success": True})
+        except Exception as exc:
+            self._logger.error(
+                "Error updating download queue status: %s", exc, exc_info=True
+            )
+            return web.json_response({"success": False, "error": str(exc)}, status=500)
+
 
 class ModelCivitaiHandler:
     """CivitAI integration endpoints."""
@@ -2864,6 +2905,7 @@ class ModelHandlerSet:
             "retry_all_failed_downloads": self.download.retry_all_failed_downloads,
             "complete_download_in_queue": self.download.complete_download_in_queue,
             "get_download_stats": self.download.get_download_stats,
+            "update_download_queue_status": self.download.update_download_queue_status,
             "get_civitai_versions": self.civitai.get_civitai_versions,
             "get_civitai_model_by_version": self.civitai.get_civitai_model_by_version,
             "get_civitai_model_by_hash": self.civitai.get_civitai_model_by_hash,

py/routes/model_route_registrar.py

@@ -138,6 +138,9 @@ COMMON_ROUTE_DEFINITIONS: tuple[RouteDefinition, ...] = (
     RouteDefinition(
         "GET", "/api/lm/downloads/queue/complete", "complete_download_in_queue"
     ),
+    RouteDefinition(
+        "GET", "/api/lm/downloads/queue/status", "update_download_queue_status"
+    ),
     RouteDefinition("POST", "/api/lm/{prefix}/cancel-task", "cancel_task"),
     RouteDefinition("GET", "/{prefix}", "handle_models_page"),
 )

py/routes/stats_routes.py

@@ -11,6 +11,8 @@ from ..config import config
 from ..services.settings_manager import get_settings_manager
 from ..services.server_i18n import server_i18n
 from ..services.service_registry import ServiceRegistry
+from ..services.model_query import normalize_sub_type, resolve_sub_type
+from ..utils.constants import VALID_LORA_SUB_TYPES, VALID_CHECKPOINT_SUB_TYPES
 from ..utils.usage_stats import UsageStats
 
 logger = logging.getLogger(__name__)
@@ -140,6 +142,21 @@ class StatsRoutes:
             # Get usage statistics
             usage_data = await self.usage_stats.get_stats()
             
+            # CivitAI model type distribution across all model types
+            # Use the same logic as the filter panel: normalize_sub_type(resolve_sub_type(entry))
+            # with sub-type validation per model type
+            model_types_counter: Counter[str] = Counter()
+            for entry in lora_cache.raw_data:
+                ntype = normalize_sub_type(resolve_sub_type(entry))
+                if ntype and ntype in VALID_LORA_SUB_TYPES:
+                    model_types_counter[ntype] += 1
+            for entry in checkpoint_cache.raw_data:
+                ntype = normalize_sub_type(resolve_sub_type(entry))
+                if ntype and ntype in VALID_CHECKPOINT_SUB_TYPES:
+                    model_types_counter[ntype] += 1
+            # Embeddings: always count as "embedding" regardless of CivitAI sub-type
+            model_types_counter['embedding'] = len(embedding_cache.raw_data)
+            
             return web.json_response({
                 'success': True,
                 'data': {
@@ -154,7 +171,8 @@ class StatsRoutes:
                     'total_generations': usage_data.get('total_executions', 0),
                     'unused_loras': self._count_unused_models(lora_cache.raw_data, usage_data.get('loras', {})),
                     'unused_checkpoints': self._count_unused_models(checkpoint_cache.raw_data, usage_data.get('checkpoints', {})),
-                    'unused_embeddings': self._count_unused_models(embedding_cache.raw_data, usage_data.get('embeddings', {}))
+                    'unused_embeddings': self._count_unused_models(embedding_cache.raw_data, usage_data.get('embeddings', {})),
+                    'model_types_distribution': dict(model_types_counter.most_common())
                 }
             })
             
@@ -459,9 +477,12 @@ class StatsRoutes:
                 if unused_lora_percent > 50:
                     insights.append({
                         'type': 'warning',
-                        'title': 'High Number of Unused LoRAs',
-                        'description': f'{unused_lora_percent:.1f}% of your LoRAs ({unused_loras}/{total_loras}) have never been used.',
-                        'suggestion': 'Consider organizing or archiving unused models to free up storage space.'
+                        'key': 'insights.unusedLoras.high',
+                        'params': {
+                            'percent': f'{unused_lora_percent:.1f}',
+                            'count': str(unused_loras),
+                            'total': str(total_loras)
+                        }
                     })
             
             if total_checkpoints > 0:
@@ -469,9 +490,12 @@ class StatsRoutes:
                 if unused_checkpoint_percent > 30:
                     insights.append({
                         'type': 'warning',
-                        'title': 'Unused Checkpoints Detected',
-                        'description': f'{unused_checkpoint_percent:.1f}% of your checkpoints ({unused_checkpoints}/{total_checkpoints}) have never been used.',
-                        'suggestion': 'Review and consider removing checkpoints you no longer need.'
+                        'key': 'insights.unusedCheckpoints.detected',
+                        'params': {
+                            'percent': f'{unused_checkpoint_percent:.1f}',
+                            'count': str(unused_checkpoints),
+                            'total': str(total_checkpoints)
+                        }
                     })
             
             if total_embeddings > 0:
@@ -479,9 +503,12 @@ class StatsRoutes:
                 if unused_embedding_percent > 50:
                     insights.append({
                         'type': 'warning',
-                        'title': 'High Number of Unused Embeddings',
-                        'description': f'{unused_embedding_percent:.1f}% of your embeddings ({unused_embeddings}/{total_embeddings}) have never been used.',
-                        'suggestion': 'Consider organizing or archiving unused embeddings to optimize your collection.'
+                        'key': 'insights.unusedEmbeddings.high',
+                        'params': {
+                            'percent': f'{unused_embedding_percent:.1f}',
+                            'count': str(unused_embeddings),
+                            'total': str(total_embeddings)
+                        }
                     })
             
             # Storage insights
@@ -492,18 +519,20 @@ class StatsRoutes:
             if total_size > 100 * 1024 * 1024 * 1024:  # 100GB
                 insights.append({
                     'type': 'info',
-                    'title': 'Large Collection Detected',
-                    'description': f'Your model collection is using {self._format_size(total_size)} of storage.',
-                    'suggestion': 'Consider using external storage or cloud solutions for better organization.'
+                    'key': 'insights.collection.large',
+                    'params': {
+                        'size': self._format_size(total_size)
+                    }
                 })
             
             # Recent activity insight
             if usage_data.get('total_executions', 0) > 100:
                 insights.append({
                     'type': 'success',
-                    'title': 'Active User',
-                    'description': f'You\'ve completed {usage_data["total_executions"]} generations so far!',
-                    'suggestion': 'Keep exploring and creating amazing content with your models.'
+                    'key': 'insights.activity.active',
+                    'params': {
+                        'count': str(usage_data['total_executions'])
+                    }
                 })
             
             return web.json_response({

py/services/download_manager.py

@@ -29,6 +29,7 @@ from .metadata_service import get_default_metadata_provider, get_metadata_provid
 from .downloader import get_downloader, DownloadProgress, DownloadStreamControl
 from .aria2_downloader import Aria2Error, get_aria2_downloader
 from .aria2_transfer_state import Aria2TransferStateStore
+from .download_queue_service import DownloadQueueService
 
 # Download to temporary file first
 import tempfile
@@ -360,6 +361,15 @@ class DownloadManager:
                     if self._active_downloads[task_id].get("transfer_backend") == "aria2":
                         await self._persist_aria2_state(task_id)
 
+                # Update SQLite queue status to 'downloading'
+                try:
+                    queue_service = await DownloadQueueService.get_instance()
+                    await queue_service.update_status(task_id, "downloading")
+                except Exception:
+                    logger.warning(
+                        "Failed to update queue status for %s", task_id, exc_info=True
+                    )
+
                 # Use original download implementation
                 try:
                     # Check for cancellation before starting
@@ -396,6 +406,22 @@ class DownloadManager:
                         if self._active_downloads[task_id].get("transfer_backend") == "aria2":
                             await self._persist_aria2_state(task_id)
 
+                    # Move queue item to history on completion
+                    try:
+                        queue_service = await DownloadQueueService.get_instance()
+                        await queue_service.complete_download(
+                            download_id=task_id,
+                            status=result.get("status", "completed") if result.get("success") else "failed",
+                            error=result.get("error") if not result.get("success") else None,
+                            file_path=result.get("file_path"),
+                            bytes_downloaded=self._active_downloads.get(task_id, {}).get("bytes_downloaded", 0),
+                            total_bytes=self._active_downloads.get(task_id, {}).get("total_bytes"),
+                        )
+                    except Exception:
+                        logger.warning(
+                            "Failed to complete queue item for %s", task_id, exc_info=True
+                        )
+
                     return result
                 except asyncio.CancelledError:
                     # Handle cancellation
@@ -404,6 +430,19 @@ class DownloadManager:
                         self._active_downloads[task_id]["bytes_per_second"] = 0.0
                         if self._active_downloads[task_id].get("transfer_backend") == "aria2":
                             await self._persist_aria2_state(task_id)
+
+                    # Move queue item to history as canceled
+                    try:
+                        queue_service = await DownloadQueueService.get_instance()
+                        await queue_service.complete_download(
+                            download_id=task_id,
+                            status="canceled",
+                        )
+                    except Exception:
+                        logger.warning(
+                            "Failed to cancel queue item for %s", task_id, exc_info=True
+                        )
+
                     logger.info(f"Download cancelled for task {task_id}")
                     raise
                 except Exception as e:
@@ -417,6 +456,22 @@ class DownloadManager:
                         self._active_downloads[task_id]["bytes_per_second"] = 0.0
                         if self._active_downloads[task_id].get("transfer_backend") == "aria2":
                             await self._persist_aria2_state(task_id)
+
+                    # Move queue item to history as failed
+                    try:
+                        queue_service = await DownloadQueueService.get_instance()
+                        await queue_service.complete_download(
+                            download_id=task_id,
+                            status="failed",
+                            error=str(e),
+                            bytes_downloaded=self._active_downloads.get(task_id, {}).get("bytes_downloaded", 0),
+                            total_bytes=self._active_downloads.get(task_id, {}).get("total_bytes"),
+                        )
+                    except Exception:
+                        logger.warning(
+                            "Failed to complete queue item for %s", task_id, exc_info=True
+                        )
+
                     return {"success": False, "error": str(e)}
         finally:
             # Schedule cleanup of download record after delay

py/services/metadata_sync_service.py

@@ -427,7 +427,18 @@ class MetadataSyncService:
         metadata = await metadata_loader(metadata_path)
 
         for key, value in updates.items():
-            if isinstance(value, dict) and isinstance(metadata.get(key), dict):
+            if key == "tags" and isinstance(value, list):
+                # Normalize tags: trim, lowercase, deduplicate
+                normalized = []
+                seen = set()
+                for tag in value:
+                    if isinstance(tag, str):
+                        t = tag.strip().lower()
+                        if t and t not in seen:
+                            normalized.append(t)
+                            seen.add(t)
+                metadata[key] = normalized
+            elif isinstance(value, dict) and isinstance(metadata.get(key), dict):
                 metadata[key].update(value)
             else:
                 metadata[key] = value

py/services/model_query.py

@@ -294,12 +294,14 @@ class ModelFilterSet:
                 for tag, state in tag_filters.items():
                     if not tag:
                         continue
+                    # Normalize to lowercase for case-insensitive matching
+                    normalized = tag.strip().lower()
                     if state == "exclude":
-                        exclude_tags.add(tag)
+                        exclude_tags.add(normalized)
                     else:
-                        include_tags.add(tag)
+                        include_tags.add(normalized)
             else:
-                include_tags = {tag for tag in tag_filters if tag}
+                include_tags = {tag.strip().lower() for tag in tag_filters if tag}
 
             if include_tags:
                 tag_logic = criteria.tag_logic.lower() if criteria.tag_logic else "any"
@@ -318,13 +320,17 @@ class ModelFilterSet:
                                 return True
                             # Otherwise, check if all non-special tags match
                             if non_special_tags:
-                                return all(tag in (item_tags or []) for tag in non_special_tags)
+                                # Case-insensitive: normalize item tags too
+                                normalized_item_tags = {t.strip().lower() for t in (item_tags or []) if isinstance(t, str)}
+                                return all(tag in normalized_item_tags for tag in non_special_tags)
                             return True
-                        # Normal case: all tags must match
-                        return all(tag in (item_tags or []) for tag in non_special_tags)
+                        # Normal case: all tags must match (case-insensitive)
+                        normalized_item_tags = {t.strip().lower() for t in (item_tags or []) if isinstance(t, str)}
+                        return all(tag in normalized_item_tags for tag in non_special_tags)
                     else:
-                        # OR logic (default): item must have ANY include tag
-                        return any(tag in include_tags for tag in (item_tags or []))
+                        # OR logic (default): item must have ANY include tag (case-insensitive)
+                        normalized_item_tags = {t.strip().lower() for t in (item_tags or []) if isinstance(t, str)}
+                        return bool(normalized_item_tags & include_tags)
 
                 items = [item for item in items if matches_include(item.get("tags"))]
 
@@ -333,7 +339,9 @@ class ModelFilterSet:
                 def matches_exclude(item_tags):
                     if not item_tags and "__no_tags__" in exclude_tags:
                         return True
-                    return any(tag in exclude_tags for tag in (item_tags or []))
+                    # Case-insensitive: normalize item tags
+                    normalized_item_tags = {t.strip().lower() for t in (item_tags or []) if isinstance(t, str)}
+                    return bool(normalized_item_tags & exclude_tags)
 
                 items = [
                     item for item in items if not matches_exclude(item.get("tags"))

py/services/settings_manager.py

@@ -105,6 +105,7 @@ DEFAULT_SETTINGS: Dict[str, Any] = {
     "download_skip_base_models": [],
     "backup_auto_enabled": True,
     "backup_retention_count": 5,
+    "use_new_license_icons": True,
 }
 
 
@@ -133,6 +134,9 @@ class SettingsManager:
         self._template_path = (
             Path(__file__).resolve().parents[2] / "settings.json.example"
         )
+        # Known placeholder value in settings.json.example; any file containing
+        # this value should be treated as "not configured".
+        self._TEMPLATE_PLACEHOLDER_API_KEY = "your_civitai_api_key_here"
         self.settings = self._load_settings()
         self._migrate_setting_keys()
         self._ensure_default_settings()
@@ -164,6 +168,12 @@ class SettingsManager:
                     self._original_disk_payload = copy.deepcopy(data)
                     if self._matches_template_payload(data):
                         self._preserve_disk_template = True
+                    # Clean up the template placeholder so it is not treated
+                    # as a real key (affects both the frontend boolean and
+                    # the downloader's Authorization header).
+                    placeholder = self._TEMPLATE_PLACEHOLDER_API_KEY
+                    if data.get("civitai_api_key") == placeholder:
+                        data["civitai_api_key"] = ""
                 return data
             except json.JSONDecodeError as exc:
                 logger.error("Failed to parse settings.json: %s", exc)

py/services/tag_update_service.py

@@ -36,9 +36,9 @@ class TagUpdateService:
             if isinstance(tag, str) and tag.strip():
                 # Convert all tags to lowercase to avoid case sensitivity issues on Windows
                 normalized = tag.strip().lower()
-                if normalized.lower() not in existing_lower:
+                if normalized not in existing_lower:
                     existing_tags.append(normalized)
-                    existing_lower.append(normalized.lower())
+                    existing_lower.append(normalized)
                     tags_added.append(normalized)
 
         metadata["tags"] = existing_tags

py/utils/example_images_paths.py

@@ -12,6 +12,18 @@ from ..services.settings_manager import get_settings_manager
 
 _HEX_PATTERN = re.compile(r"[a-fA-F0-9]{64}")
 
+# Filesystem/metadata files that are never created by the example images system
+# and are safe to ignore during validation. The cleanup service only operates on
+# directories, so these files pose no data-loss risk.
+_SAFE_FILENAMES: frozenset[str] = frozenset({
+    ".DS_Store",       # macOS folder metadata
+    "Thumbs.db",       # Windows thumbnail cache
+    "desktop.ini",     # Windows folder customization
+    ".localized",      # macOS folder name localization
+    ".gitkeep",        # Placeholder to keep empty dirs in git
+    ".gitignore",      # Git ignore rules
+})
+
 logger = logging.getLogger(__name__)
 
 
@@ -180,6 +192,22 @@ def is_hash_folder(name: str) -> bool:
     return bool(_HEX_PATTERN.fullmatch(name or ""))
 
 
+def _is_safe_ignorable_entry(item: str, item_path: str) -> bool:
+    """Return True if *item* is a harmless system/hidden file we can skip.
+
+    These files are never created by the example images system and are safe to
+    ignore because the cleanup/delete operations only act on **directories**,
+    never on individual files (other than ``.download_progress.json``).
+    """
+    if item in _SAFE_FILENAMES:
+        return True
+    # Hide Unix hidden files (dotfiles) that are regular files,
+    # since the cleanup system never deletes or moves files.
+    if item.startswith(".") and os.path.isfile(item_path):
+        return True
+    return False
+
+
 def is_valid_example_images_root(folder_path: str) -> bool:
     """Check whether a folder looks like a dedicated example images root."""
 
@@ -190,9 +218,16 @@ def is_valid_example_images_root(folder_path: str) -> bool:
 
     for item in items:
         item_path = os.path.join(folder_path, item)
+
+        # .download_progress.json is an expected metadata file — check before
+        # the generic dotfile rule so it stays explicitly documented.
         if item == ".download_progress.json" and os.path.isfile(item_path):
             continue
 
+        # Skip harmless system/hidden files — cleanup only touches directories
+        if _is_safe_ignorable_entry(item, item_path):
+            continue
+
         if os.path.isdir(item_path):
             if is_hash_folder(item):
                 continue
@@ -211,6 +246,41 @@ def is_valid_example_images_root(folder_path: str) -> bool:
     return True
 
 
+def find_non_compliant_items_in_example_images_root(folder_path: str) -> list[str]:
+    """Return the names of items that prevent *folder_path* from being a valid
+    example images root, or an empty list if the folder is valid.
+
+    This mirrors ``is_valid_example_images_root`` but **returns** the offending
+    names instead of a boolean, so callers can produce actionable error messages.
+    """
+    try:
+        items = os.listdir(folder_path)
+    except OSError as exc:
+        return [f"<cannot list directory: {exc}>"]
+
+    offending: list[str] = []
+
+    for item in items:
+        item_path = os.path.join(folder_path, item)
+
+        # Same skip rules as is_valid_example_images_root
+        if item == ".download_progress.json" and os.path.isfile(item_path):
+            continue
+        if _is_safe_ignorable_entry(item, item_path):
+            continue
+        if os.path.isdir(item_path):
+            if is_hash_folder(item):
+                continue
+            if item == "_deleted":
+                continue
+            if _library_folder_has_only_hash_dirs(item_path):
+                continue
+
+        offending.append(item)
+
+    return offending
+
+
 def _library_folder_has_only_hash_dirs(path: str) -> bool:
     """Return True when a library subfolder only contains hash folders or metadata files."""
 

pyproject.toml

@@ -1,7 +1,7 @@
 [project]
 name = "comfyui-lora-manager"
 description = "Revolutionize your workflow with the ultimate LoRA companion for ComfyUI!"
-version = "1.1.3"
+version = "1.1.4"
 license = {file = "LICENSE"}
 dependencies = [
     "aiohttp",

static/css/components/batch-import-modal.css

@@ -349,8 +349,8 @@
 }
 
 .progress-percentage {
-    font-size: 1.2em;
-    font-weight: 600;
+    font-size: var(--text-lg);
+    font-weight: var(--weight-semibold);
     color: var(--lora-accent);
 }
 
@@ -365,9 +365,9 @@
 
 .progress-bar {
     height: 100%;
-    background: linear-gradient(90deg, var(--lora-accent), oklch(from var(--lora-accent) calc(l + 0.1) c h));
-    border-radius: 4px;
-    transition: width 0.3s ease;
+    background: var(--lora-accent);
+    border-radius: var(--border-radius-xs);
+    transition: width var(--transition-base);
 }
 
 /* Progress Stats */
@@ -389,27 +389,26 @@
 }
 
 .stat-item.success {
-    border-left: 3px solid #00B87A;
+    border-left: 4px solid var(--color-success);
 }
 
 .stat-item.failed {
-    border-left: 3px solid var(--lora-error);
+    border-left: 4px solid var(--color-error);
 }
 
 .stat-item.skipped {
-    border-left: 3px solid var(--lora-warning);
+    border-left: 4px solid var(--color-warning);
 }
 
 .stat-label {
-    font-size: 0.8em;
-    color: var(--text-color);
-    opacity: 0.7;
+    font-size: var(--text-xs);
+    color: var(--text-secondary);
     margin-bottom: 4px;
 }
 
 .stat-value {
-    font-size: 1.4em;
-    font-weight: 600;
+    font-size: var(--text-lg);
+    font-weight: var(--weight-semibold);
     color: var(--text-color);
 }
 
@@ -425,8 +424,7 @@
 }
 
 .current-item-label {
-    color: var(--text-color);
-    opacity: 0.7;
+    color: var(--text-secondary);
     flex-shrink: 0;
 }
 
@@ -449,27 +447,29 @@
 }
 
 .results-header {
-    text-align: center;
+    display: flex;
+    align-items: center;
+    gap: var(--space-2);
     margin-bottom: var(--space-3);
 }
 
 .results-icon {
-    font-size: 3em;
-    color: #00B87A;
-    margin-bottom: var(--space-1);
+    font-size: var(--text-xl);
+    color: var(--color-success);
+    flex-shrink: 0;
 }
 
 .results-icon.warning {
-    color: var(--lora-warning);
+    color: var(--color-warning);
 }
 
 .results-icon.error {
-    color: var(--lora-error);
+    color: var(--color-error);
 }
 
 .results-title {
-    font-size: 1.3em;
-    font-weight: 600;
+    font-size: var(--text-lg);
+    font-weight: var(--weight-semibold);
     color: var(--text-color);
 }
 
@@ -493,27 +493,26 @@
 }
 
 .result-card.success {
-    border-left: 3px solid #00B87A;
+    border-left: 4px solid var(--color-success);
 }
 
 .result-card.failed {
-    border-left: 3px solid var(--lora-error);
+    border-left: 4px solid var(--color-error);
 }
 
 .result-card.skipped {
-    border-left: 3px solid var(--lora-warning);
+    border-left: 4px solid var(--color-warning);
 }
 
 .result-label {
-    font-size: 0.8em;
-    color: var(--text-color);
-    opacity: 0.7;
+    font-size: var(--text-xs);
+    color: var(--text-secondary);
     margin-bottom: 4px;
 }
 
 .result-value {
-    font-size: 1.4em;
-    font-weight: 600;
+    font-size: var(--text-lg);
+    font-weight: var(--weight-semibold);
     color: var(--text-color);
 }
 
@@ -527,13 +526,13 @@
     display: flex;
     align-items: center;
     justify-content: center;
-    gap: 8px;
-    padding: 10px;
+    gap: var(--space-2);
+    padding: var(--space-2);
     cursor: pointer;
     color: var(--lora-accent);
-    font-weight: 500;
+    font-weight: var(--weight-medium);
     border-radius: var(--border-radius-xs);
-    transition: background 0.2s;
+    transition: background var(--transition-base);
 }
 
 .details-toggle:hover {
@@ -541,7 +540,7 @@
 }
 
 .details-toggle i {
-    transition: transform 0.2s;
+    transition: transform var(--transition-base);
 }
 
 .details-toggle.expanded i {
@@ -561,10 +560,10 @@
 .result-item {
     display: flex;
     align-items: center;
-    gap: 10px;
-    padding: 10px 12px;
+    gap: var(--space-2);
+    padding: var(--space-2) var(--space-3);
     border-bottom: 1px solid var(--border-color);
-    font-size: 0.9em;
+    font-size: var(--text-sm);
 }
 
 .result-item:last-child {
@@ -572,28 +571,23 @@
 }
 
 .result-item-status {
-    width: 24px;
-    height: 24px;
-    border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
-    font-size: 0.8em;
+    font-size: var(--text-sm);
+    flex-shrink: 0;
 }
 
 .result-item-status.success {
-    background: oklch(from #00B87A l c h / 0.2);
-    color: #00B87A;
+    color: var(--color-success);
 }
 
 .result-item-status.failed {
-    background: oklch(from var(--lora-error) l c h / 0.2);
-    color: var(--lora-error);
+    color: var(--color-error);
 }
 
 .result-item-status.skipped {
-    background: oklch(from var(--lora-warning) l c h / 0.2);
-    color: var(--lora-warning);
+    color: var(--color-warning);
 }
 
 .result-item-info {
@@ -610,8 +604,8 @@
 }
 
 .result-item-error {
-    font-size: 0.8em;
-    color: var(--lora-error);
+    font-size: var(--text-xs);
+    color: var(--color-error);
     margin-top: 2px;
 }
 
@@ -661,11 +655,11 @@
 
 /* Completed State */
 .batch-progress-container.completed .progress-bar {
-    background: #00B87A;
+    background: var(--color-success);
 }
 
 .batch-progress-container.completed .status-icon {
-    color: #00B87A;
+    color: var(--color-success);
 }
 
 .batch-progress-container.completed .status-icon i {

static/css/components/duplicates.css

@@ -5,10 +5,10 @@
     position: sticky; /* Keep the sticky position */
     top: var(--space-1);
     width: 100%;
-    background-color: oklch(var(--lora-accent-l) var(--lora-accent-c) var(--lora-accent-h) / 0.1); /* Use accent color with low opacity */
+    background-color: oklch(var(--color-accent-l) var(--color-accent-c) var(--color-accent-h) / 0.1); /* Use accent color with low opacity */
     color: var(--text-color);
-    border-top: 1px solid oklch(var(--lora-accent-l) var(--lora-accent-c) var(--lora-accent-h) / 0.3); /* Add top border with accent color */
-    border-bottom: 1px solid oklch(var(--lora-accent-l) var(--lora-accent-c) var(--lora-accent-h) / 0.4); /* Make bottom border stronger */
+    border-top: 1px solid oklch(var(--color-accent-l) var(--color-accent-c) var(--color-accent-h) / 0.3); /* Add top border with accent color */
+    border-bottom: 1px solid oklch(var(--color-accent-l) var(--color-accent-c) var(--color-accent-h) / 0.4); /* Make bottom border stronger */
     z-index: var(--z-overlay);
     padding: 12px 0;
     box-shadow: var(--shadow-lg); /* Stronger shadow */
@@ -41,7 +41,7 @@
 
 .duplicates-banner i.fa-exclamation-triangle {
     font-size: 18px;
-    color: oklch(var(--lora-warning-l) var(--lora-warning-c) var(--lora-warning-h));
+    color: oklch(var(--color-warning-l) var(--color-warning-c) var(--color-warning-h));
 }
 
 .duplicates-banner .banner-actions {
@@ -70,7 +70,7 @@
 
 .duplicates-banner button.btn-exit-mode:hover {
     background-color: var(--bg-color);
-    border-color: var(--lora-accent-l) var(--lora-accent-c) var(--lora-accent-h);
+    border-color: oklch(var(--color-accent-l) var(--color-accent-c) var(--color-accent-h));
     transform: translateY(-1px);
 }
 
@@ -92,7 +92,7 @@
 }
 
 .duplicates-banner button:hover {
-    border-color: var(--lora-accent-l) var(--lora-accent-c) var(--lora-accent-h);
+    border-color: oklch(var(--color-accent-l) var(--color-accent-c) var(--color-accent-h));
     background: var(--bg-color);
     transform: translateY(-1px);
     box-shadow: var(--shadow-sm);
@@ -117,7 +117,7 @@
 /* Duplicate groups */
 .duplicate-group {
     position: relative;
-    border: 2px solid oklch(var(--lora-warning-l) var(--lora-warning-c) var(--lora-warning-h));
+    border: 2px solid oklch(var(--color-warning-l) var(--color-warning-c) var(--color-warning-h));
     border-radius: var(--border-radius-base);
     padding: 16px;
     margin-bottom: 24px;
@@ -152,7 +152,7 @@
     display: flex;
     justify-content: space-between;
     align-items: center;
-    border-left: 4px solid oklch(var(--lora-warning-l) var(--lora-warning-c) var(--lora-warning-h)); /* Add accent border on the left */
+    border-left: 4px solid oklch(var(--color-warning-l) var(--color-warning-c) var(--color-warning-h)); /* Add accent border on the left */
 }
 
 .duplicate-group-header span:last-child {
@@ -180,7 +180,7 @@
 }
 
 .duplicate-group-header button:hover {
-    border-color: var(--lora-accent-l) var(--lora-accent-c) var(--lora-accent-h);
+    border-color: oklch(var(--color-accent-l) var(--color-accent-c) var(--color-accent-h));
     background: var(--bg-color);
     transform: translateY(-1px);
     box-shadow: var(--shadow-sm);
@@ -235,7 +235,7 @@
 }
 
 .group-toggle-btn:hover {
-    border-color: var(--lora-accent-l) var(--lora-accent-c) var (--lora-accent-h);
+    border-color: oklch(var(--color-accent-l) var(--color-accent-c) var(--color-accent-h));
     transform: translateY(-1px);
     box-shadow: var(--shadow-sm);
 }
@@ -247,16 +247,16 @@
 }
 
 .model-card.duplicate:hover {
-    border-color: var(--lora-accent-l) var(--lora-accent-c) var(--lora-accent-h);
+    border-color: oklch(var(--color-accent-l) var(--color-accent-c) var(--color-accent-h));
 }
 
 .model-card.duplicate.latest {
     border-style: solid;
-    border-color: oklch(var(--lora-warning-l) var(--lora-warning-c) var(--lora-warning-h));
+    border-color: oklch(var(--color-warning-l) var(--color-warning-c) var(--color-warning-h));
 }
 
 .model-card.duplicate-selected {
-    border: 2px solid oklch(var(--lora-accent-l) var(--lora-accent-c) var(--lora-accent-h));
+    border: 2px solid oklch(var(--color-accent-l) var(--color-accent-c) var(--color-accent-h));
     box-shadow: var(--shadow-md);
 }
 
@@ -276,7 +276,7 @@
     position: absolute;
     top: 10px;
     left: 10px;
-    background: oklch(var(--lora-accent-l) var(--lora-accent-c) var(--lora-accent-h));
+    background: oklch(var(--color-accent-l) var(--color-accent-c) var(--color-accent-h));
     color: white;
     font-size: 12px;
     padding: 2px 6px;
@@ -328,7 +328,7 @@
     margin-top: 8px;
     padding-top: 8px;
     border-top: 1px dashed var(--border-color);
-    color: oklch(var(--lora-warning-l) var(--lora-warning-c) var(--lora-warning-h));
+    color: oklch(var(--color-warning-l) var(--color-warning-c) var(--color-warning-h));
     font-weight: bold;
     word-break: break-all; /* Ensure long hashes wrap properly */
 }
@@ -351,12 +351,12 @@
 }
 
 .verification-badge.verified {
-    background-color: oklch(70% 0.2 140); /* Green for verified */
+    background-color: var(--color-success); /* Green for verified */
     color: white;
 }
 
 .verification-badge.mismatch {
-    background-color: oklch(var(--lora-warning-l) var(--lora-warning-c) var(--lora-warning-h));
+    background-color: oklch(var(--color-warning-l) var(--color-warning-c) var(--color-warning-h));
     color: white;
 }
 
@@ -366,7 +366,7 @@
 
 /* Hash Mismatch Styling */
 .model-card.duplicate.hash-mismatch {
-    border: 2px dashed oklch(var(--lora-warning-l) var(--lora-warning-c) var(--lora-warning-h));
+    border: 2px dashed oklch(var(--color-warning-l) var(--color-warning-c) var(--color-warning-h));
     opacity: 0.85;
     position: relative;
 }
@@ -380,8 +380,8 @@
     bottom: 0;
     background: repeating-linear-gradient(
         45deg,
-        oklch(var(--lora-warning-l) var(--lora-warning-c) var(--lora-warning-h) / 0.05),
-        oklch(var(--lora-warning-l) var(--lora-warning-c) var(--lora-warning-h) / 0.05) 10px,
+        oklch(var(--color-warning-l) var(--color-warning-c) var(--color-warning-h) / 0.05),
+        oklch(var(--color-warning-l) var(--color-warning-c) var(--color-warning-h) / 0.05) 10px,
         transparent 10px,
         transparent 20px
     );
@@ -398,7 +398,7 @@
     position: absolute;
     top: 10px;
     left: 10px; /* Changed from right:10px to left:10px */
-    background: oklch(var(--lora-warning-l) var(--lora-warning-c) var(--lora-warning-h));
+    background: oklch(var(--color-warning-l) var(--color-warning-c) var(--color-warning-h));
     color: white;
     font-size: 12px;
     padding: 3px 8px;
@@ -417,7 +417,7 @@
     margin-top: 8px;
     padding-top: 8px;
     border-top: 1px dashed var(--border-color);
-    color: oklch(var(--lora-warning-l) var(--lora-warning-c) var(--lora-warning-h));
+    color: oklch(var(--color-warning-l) var(--color-warning-c) var(--color-warning-h));
     font-weight: bold;
 }
 
@@ -437,7 +437,7 @@
 
 .btn-verify-hashes:hover {
     background: var(--bg-color);
-    border-color: oklch(var(--lora-accent-l) var(--lora-accent-c) var(--lora-accent-h));
+    border-color: oklch(var(--color-accent-l) var(--color-accent-c) var(--color-accent-h));
     transform: translateY(-1px);
 }
 
@@ -498,7 +498,7 @@
 
 .help-icon:hover {
     opacity: 1;
-    color: oklch(var(--lora-accent-l) var(--lora-accent-c) var(--lora-accent-h));
+    color: oklch(var(--color-accent-l) var(--color-accent-c) var(--color-accent-h));
 }
 
 /* Help tooltip */
@@ -573,7 +573,7 @@
 /* In dark mode, add additional distinction */
 html[data-theme="dark"] .duplicates-banner {
     box-shadow: var(--shadow-dark-lg); /* Stronger shadow in dark mode */
-    background-color: oklch(var(--lora-accent-l) var(--lora-accent-c) var(--lora-accent-h) / 0.15); /* Slightly stronger background in dark mode */
+    background-color: oklch(var(--color-accent-l) var(--color-accent-c) var(--color-accent-h) / 0.15); /* Slightly stronger background in dark mode */
 }
 
 html[data-theme="dark"] .duplicate-group {
@@ -598,11 +598,11 @@ html[data-theme="dark"] .help-tooltip {
     background: var(--lora-accent);
     color: white;
     border-color: var(--lora-accent);
-    box-shadow: 0 0 0 2px oklch(var(--lora-accent-l) var(--lora-accent-c) var(--lora-accent-h) / 0.25);
+    box-shadow: 0 0 0 2px oklch(var(--color-accent-l) var(--color-accent-c) var(--color-accent-h) / 0.25);
     position: relative;
     z-index: 5;
 }
 
 #findDuplicatesBtn.active:hover {
-    background: oklch(calc(var(--lora-accent-l) - 5%) var(--lora-accent-c) var(--lora-accent-h));
+    background: oklch(calc(var(--color-accent-l) - 5%) var(--color-accent-c) var(--color-accent-h));
 }

static/css/components/header.css

@@ -283,7 +283,6 @@
 
 .theme-toggle {
   position: relative;
-  /* Ensure relative positioning for the container */
 }
 
 .theme-toggle .light-icon,
@@ -293,17 +292,14 @@
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
-  /* Center perfectly */
   opacity: 0;
   transition: opacity 0.3s ease;
 }
 
-/* Default state shows dark icon */
 .theme-toggle .dark-icon {
   opacity: 1;
 }
 
-/* Light theme shows light icon */
 .theme-toggle.theme-light .light-icon {
   opacity: 1;
 }
@@ -313,7 +309,6 @@
   opacity: 0;
 }
 
-/* Dark theme shows dark icon */
 .theme-toggle.theme-dark .dark-icon {
   opacity: 1;
 }
@@ -323,7 +318,6 @@
   opacity: 0;
 }
 
-/* Auto theme shows auto icon */
 .theme-toggle.theme-auto .auto-icon {
   opacity: 1;
 }
@@ -333,6 +327,201 @@
   opacity: 0;
 }
 
+.theme-popover {
+  display: none;
+  position: fixed;
+  background: var(--surface-base, #ffffff);
+  border: 1px solid var(--border-base, #e0e0e0);
+  border-radius: var(--radius-md, 8px);
+  box-shadow: var(--shadow-xl, 0 4px 16px rgba(0, 0, 0, 0.15));
+  padding: 12px;
+  min-width: 220px;
+  z-index: calc(var(--z-overlay) + 1);
+  animation: theme-popover-in 0.15s ease-out;
+}
+
+.theme-popover.active {
+  display: block;
+}
+
+@keyframes theme-popover-in {
+  from {
+    opacity: 0;
+    transform: translateY(-4px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+.theme-popover-section {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.theme-popover-label {
+  font-size: 0.7rem;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  color: var(--text-secondary, #6c757d);
+}
+
+.theme-popover-divider {
+  height: 1px;
+  background: var(--border-base, #e0e0e0);
+  margin: 10px 0;
+}
+
+.theme-popover-modes {
+  display: flex;
+  gap: 6px;
+}
+
+.theme-mode-btn {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;
+  padding: 8px 4px;
+  border: 1px solid var(--border-base, #e0e0e0);
+  border-radius: var(--radius-sm, 6px);
+  background: var(--surface-elevated, #ffffff);
+  color: var(--text-primary, #333333);
+  cursor: pointer;
+  font-size: 0.75rem;
+  transition: background-color var(--transition-base, 200ms ease),
+              border-color var(--transition-base, 200ms ease),
+              color var(--transition-base, 200ms ease);
+}
+
+.theme-mode-btn i {
+  font-size: 0.9rem;
+}
+
+.theme-mode-btn:hover {
+  background: var(--surface-hover, oklch(95% 0.02 256));
+  border-color: var(--color-accent, oklch(68% 0.28 256));
+}
+
+.theme-mode-btn.active {
+  background: var(--color-accent-subtle, oklch(68% 0.28 256 / 0.12));
+  border-color: var(--color-accent, oklch(68% 0.28 256));
+  color: var(--color-accent, oklch(68% 0.28 256));
+}
+
+.theme-popover-presets {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 6px;
+}
+
+.theme-preset-btn {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;
+  padding: 8px 4px;
+  border: 1px solid var(--border-base, #e0e0e0);
+  border-radius: var(--radius-sm, 6px);
+  background: var(--surface-elevated, #ffffff);
+  color: var(--text-primary, #333333);
+  cursor: pointer;
+  font-size: 0.7rem;
+  transition: background-color var(--transition-base, 200ms ease),
+              border-color var(--transition-base, 200ms ease),
+              color var(--transition-base, 200ms ease);
+}
+
+.theme-preset-btn:hover {
+  background: var(--surface-hover, oklch(95% 0.02 256));
+  border-color: var(--color-accent, oklch(68% 0.28 256));
+}
+
+.theme-preset-btn.active {
+  background: var(--color-accent-subtle, oklch(68% 0.28 256 / 0.12));
+  border-color: var(--color-accent, oklch(68% 0.28 256));
+  color: var(--color-accent, oklch(68% 0.28 256));
+}
+
+.preset-swatch {
+  display: inline-block;
+  width: 22px;
+  height: 22px;
+  border-radius: var(--radius-xs, 4px);
+  border: 1px solid var(--border-subtle, oklch(72% 0.03 256 / 0.45));
+  flex-shrink: 0;
+  transition: transform var(--transition-base, 200ms ease),
+              box-shadow var(--transition-base, 200ms ease);
+}
+
+/* Solid accent colors — each swatch shows the theme's accent color directly.
+   This matches the app's flat, token-driven design language instead of using
+   decorative gradients that clash with the matte aesthetic. */
+
+.preset-swatch-default {
+  background: oklch(68% 0.28 256);
+}
+
+.preset-swatch-nord {
+  background: oklch(62% 0.18 213);
+}
+
+.preset-swatch-midnight {
+  background: oklch(52% 0.15 300);
+}
+
+.preset-swatch-monokai {
+  background: oklch(72% 0.24 190);
+}
+
+.preset-swatch-dracula {
+  background: oklch(68% 0.24 265);
+}
+
+.preset-swatch-solarized {
+  background: oklch(55% 0.18 175);
+}
+
+.theme-preset-btn.active .preset-swatch {
+  box-shadow: 0 0 0 2px var(--color-accent, oklch(68% 0.28 256));
+}
+
+.theme-preset-btn:hover .preset-swatch {
+  transform: scale(1.08);
+}
+
+/* Dark mode: use each preset's dark-mode accent lightness for visibility.
+   These match the --color-accent-l values from [data-theme="dark"][data-theme-preset="..."]
+   in tokens/colors.css so the swatch accurately previews what the theme looks like. */
+
+[data-theme="dark"] .preset-swatch-default {
+  background: oklch(68% 0.28 256);
+}
+
+[data-theme="dark"] .preset-swatch-nord {
+  background: oklch(68% 0.18 213);
+}
+
+[data-theme="dark"] .preset-swatch-midnight {
+  background: oklch(68% 0.14 300);
+}
+
+[data-theme="dark"] .preset-swatch-monokai {
+  background: oklch(72% 0.24 190);
+}
+
+[data-theme="dark"] .preset-swatch-dracula {
+  background: oklch(72% 0.24 265);
+}
+
+[data-theme="dark"] .preset-swatch-solarized {
+  background: oklch(60% 0.18 175);
+}
+
 /* Badge styling */
 .update-badge {
   position: absolute;

static/css/components/import-modal.css

@@ -211,7 +211,7 @@
 
 .lora-item.is-early-access {
     background: rgba(0, 184, 122, 0.05);
-    border-left: 4px solid #00B87A;
+    border-left: 4px solid var(--color-success);
 }
 
 .lora-item.missing-locally {
@@ -310,7 +310,7 @@
 
 .missing-lora-item.is-early-access {
     background: rgba(0, 184, 122, 0.05);
-    border-left: 3px solid #00B87A;
+    border-left: 3px solid var(--color-success);
     padding-left: 10px;
 }
 
@@ -630,7 +630,7 @@
     gap: 12px;
     padding: 12px 16px;
     background: rgba(0, 184, 122, 0.1);
-    border: 1px solid #00B87A;
+    border: 1px solid var(--color-success);
     border-radius: var(--border-radius-sm);
     color: var(--text-color);
     margin-bottom: var(--space-2);
@@ -646,7 +646,7 @@
 
 /* Specific styling for the early access warning container in import modal */
 .early-access-warning .warning-icon {
-    color: #00B87A;
+    color: var(--color-success);
     font-size: 1.2em;
 }
 

static/css/components/lora-modal/lora-modal.css

@@ -72,6 +72,10 @@
     margin-left: auto;
 }
 
+.modal-header-actions .license-permissions {
+    margin-left: auto;
+}
+
 .license-restrictions {
     display: flex;
     align-items: center;
@@ -95,6 +99,41 @@
     transform: translateY(-1px);
 }
 
+/* Set 2 — New style permission indicators */
+.license-permissions {
+    display: flex;
+    gap: 4px;
+    align-items: center;
+}
+
+.license-icon-new {
+    width: 22px;
+    height: 22px;
+    display: inline-block;
+    border-radius: 4px;
+    background-color: var(--text-muted);
+    -webkit-mask: var(--license-icon-image) center/contain no-repeat;
+    mask: var(--license-icon-image) center/contain no-repeat;
+    transition: background-color 0.2s ease, transform 0.2s ease;
+    cursor: default;
+    outline: 2px solid transparent;
+    outline-offset: 1px;
+}
+
+.license-icon-new.allowed {
+    background-color: var(--color-success, #40c057);
+    outline-color: color-mix(in oklch, var(--color-success, #40c057) 30%, transparent);
+}
+
+.license-icon-new.denied {
+    background-color: var(--color-error, #fa5252);
+    outline-color: color-mix(in oklch, var(--color-error, #fa5252) 30%, transparent);
+}
+
+.license-icon-new:hover {
+    transform: translateY(-1px);
+}
+
 /* Info Grid */
 .info-grid {
     display: grid;

static/css/components/lora-modal/tag.css

@@ -17,6 +17,8 @@
   flex-wrap: nowrap;
   gap: 6px;
   align-items: center;
+  min-width: 0;
+  overflow: hidden;
 }
 
 .model-tag-compact {
@@ -28,6 +30,9 @@
   font-size: 0.75em;
   color: var(--text-color);
   white-space: nowrap;
+  max-width: 150px;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 
 /* Style for empty tags placeholder */
@@ -118,8 +123,9 @@
 /* Model Tags Edit Mode */
 .model-tags-header {
   display: flex;
-  justify-content: space-between;
+  justify-content: flex-start;
   align-items: center;
+  overflow: hidden;
 }
 
 .edit-tags-btn {
@@ -132,6 +138,7 @@
   border-radius: var(--border-radius-xs);
   transition: var(--transition-base);
   margin-left: var(--space-1);
+  flex-shrink: 0;
 }
 
 .edit-tags-btn.visible,

static/css/components/metadata-refresh-result.css

@@ -24,11 +24,6 @@
     min-width: 130px;
 }
 
-.stat-card > i {
-    font-size: 1.25em;
-    flex-shrink: 0;
-}
-
 .stat-card-body {
     display: flex;
     flex-direction: column;
@@ -52,40 +47,20 @@
     border-left-color: var(--color-success);
 }
 
-.stat-card-success > i {
-    color: var(--color-success);
-}
-
 .stat-card-failure {
     border-left-color: var(--color-error);
 }
 
-.stat-card-failure > i {
-    color: var(--color-error);
-}
-
 .stat-card-skipped {
     border-left-color: var(--color-warning);
 }
 
-.stat-card-skipped > i {
-    color: var(--color-warning);
-}
-
 .stat-card-total {
-    border-left-color: var(--color-info);
-}
-
-.stat-card-total > i {
-    color: var(--color-info);
+    border-left-color: var(--lora-border);
 }
 
 .stat-card-time {
-    border-left-color: var(--color-accent);
-}
-
-.stat-card-time > i {
-    color: var(--color-accent);
+    border-left-color: var(--lora-border);
 }
 
 .refresh-failures-section {
@@ -122,7 +97,7 @@
     position: sticky;
     top: 0;
     background: var(--lora-surface);
-    border-bottom: 2px solid var(--lora-border);
+    border-bottom: 1px solid var(--lora-border);
     padding: var(--space-1) var(--space-2);
     text-align: left;
     font-weight: var(--weight-semibold);

static/css/components/modal/settings-modal.css

@@ -335,7 +335,12 @@
     }
 }
 
-/* API key input specific styles */
+/* API key input — CSS masking (prevents Chrome password manager triggers) */
+.api-key-masked {
+    -webkit-text-security: disc;
+}
+
+/* API key input specific styles (shared with proxy password) */
 .api-key-input {
     width: 100%; /* Take full width of parent */
     position: relative;
@@ -345,7 +350,7 @@
 
 .api-key-input input {
     width: 100%;
-    padding: 6px 40px 6px 10px; /* Add left padding */
+    padding: 6px 40px 6px 10px; /* Right padding for eye button */
     height: 32px;
     box-sizing: border-box;
     border-radius: var(--border-radius-xs);
@@ -353,6 +358,13 @@
     background-color: var(--lora-surface);
     color: var(--text-color);
     font-size: 0.95em;
+    transition: border-color 0.2s ease, box-shadow 0.2s ease;
+}
+
+.api-key-input input:focus {
+    border-color: var(--lora-accent);
+    outline: none;
+    box-shadow: 0 0 0 2px rgba(var(--lora-accent-rgb, 79, 70, 229), 0.1);
 }
 
 .api-key-input .toggle-visibility {
@@ -364,12 +376,98 @@
     opacity: 0.6;
     cursor: pointer;
     padding: 4px 8px;
+    transition: opacity 0.2s ease;
 }
 
 .api-key-input .toggle-visibility:hover {
     opacity: 1;
 }
 
+/* API key item — stack status/edit views vertically for smooth cross-fade */
+.api-key-item .setting-control {
+    flex-direction: column;
+    align-items: flex-end;
+}
+
+/* API key status display (shown when not editing) */
+.api-key-status {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    width: 100%;
+    justify-content: flex-end;
+    transition: opacity 0.2s ease, transform 0.2s ease, max-height 0.25s ease;
+    max-height: 80px;
+    overflow: hidden;
+}
+
+.api-key-status.is-hidden {
+    opacity: 0;
+    max-height: 0;
+    transform: translateY(-4px);
+    pointer-events: none;
+    margin: 0;
+}
+
+.api-key-status-text {
+    display: inline-flex;
+    align-items: center;
+    gap: 4px;
+    font-size: 0.95em;
+    white-space: nowrap;
+    transition: color 0.2s ease;
+}
+
+/* Status color modifiers — replace inline styles */
+.api-key-status--configured .fa-check-circle {
+    color: var(--lora-success);
+}
+
+.api-key-status--unconfigured .fa-times-circle {
+    color: var(--lora-error);
+}
+
+/* Utility classes for status icon colors (used by JS) */
+.text-success {
+    color: var(--lora-success);
+}
+
+.text-error {
+    color: var(--lora-error);
+}
+
+/* API key inline edit container — flex row with input + buttons */
+.api-key-edit {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    width: 100%;
+    justify-content: flex-end;
+    transition: opacity 0.2s ease, transform 0.2s ease, max-height 0.25s ease;
+    max-height: 80px;
+    overflow: hidden;
+}
+
+.api-key-edit.is-hidden {
+    opacity: 0;
+    max-height: 0;
+    transform: translateY(-4px);
+    pointer-events: none;
+    margin: 0;
+}
+
+.api-key-edit .api-key-input {
+    flex: 1;
+    min-width: 0;
+}
+
+.api-key-edit .primary-btn,
+.api-key-edit .secondary-btn {
+    height: 32px;
+    flex-shrink: 0;
+    white-space: nowrap;
+}
+
 /* Text input wrapper styles for consistent input styling */
 .text-input-wrapper {
     width: 100%;

static/css/components/recipe-modal.css

@@ -9,6 +9,10 @@
     position: relative;
 }
 
+#recipeTagsContainer {
+    width: 100%;
+}
+
 .recipe-modal-header h2 {
     margin: 0 0 var(--space-1);
     padding: var(--space-1);
@@ -95,127 +99,11 @@
     min-width: 0;
 }
 
-.content-editor.tags-editor input {
-    font-size: 0.9em;
-}
-
 /* Remove obsolete button styles */
 .editor-actions {
     display: none;
 }
 
-/* Special styling for tags content */
-.tags-content {
-    display: flex;
-    align-items: center;
-    flex-wrap: nowrap;
-    gap: 8px;
-}
-
-.tags-display {
-    display: flex;
-    flex-wrap: nowrap;
-    gap: 6px;
-    align-items: center;
-    flex: 1;
-    min-width: 0;
-    overflow: hidden;
-}
-
-.no-tags {
-    font-size: 0.85em;
-    color: var(--text-color);
-    opacity: 0.6;
-    font-style: italic;
-}
-
-/* Recipe Tags styles */
-.recipe-tags-container {
-    position: relative;
-    margin-top: 0;
-    margin-bottom: 10px;
-}
-
-.recipe-tags-compact {
-    display: flex;
-    flex-wrap: nowrap;
-    gap: 6px;
-    align-items: center;
-}
-
-.recipe-tag-compact {
-    background: var(--surface-subtle);
-    border: 1px solid rgba(0, 0, 0, 0.1);
-    border-radius: var(--border-radius-xs);
-    padding: 2px 8px;
-    font-size: 0.75em;
-    color: var(--text-color);
-    white-space: nowrap;
-}
-
-[data-theme="dark"] .recipe-tag-compact {
-    background: var(--surface-subtle);
-    border: 1px solid var(--lora-border);
-}
-
-.recipe-tag-more {
-    background: var(--lora-accent);
-    color: var(--lora-text);
-    border-radius: var(--border-radius-xs);
-    padding: 2px 8px;
-    font-size: 0.75em;
-    cursor: pointer;
-    white-space: nowrap;
-    font-weight: 500;
-}
-
-.recipe-tags-tooltip {
-    position: absolute;
-    top: calc(100% + 8px);
-    left: 0;
-    background: var(--card-bg);
-    border: 1px solid var(--border-color);
-    border-radius: var(--border-radius-sm);
-    box-shadow: var(--shadow-dropdown);
-    padding: 10px 14px;
-    max-width: 400px;
-    z-index: 10;
-    opacity: 0;
-    visibility: hidden;
-    transform: translateY(-4px);
-    transition: var(--transition-base);
-    pointer-events: none;
-}
-
-.recipe-tags-tooltip.visible {
-    opacity: 1;
-    visibility: visible;
-    transform: translateY(0);
-    pointer-events: auto;
-}
-
-.tooltip-content {
-    display: flex;
-    flex-wrap: wrap;
-    gap: 6px;
-    max-height: 200px;
-    overflow-y: auto;
-}
-
-.tooltip-tag {
-    background: var(--surface-hover);
-    border: 1px solid rgba(0, 0, 0, 0.1);
-    border-radius: var(--border-radius-xs);
-    padding: 3px 8px;
-    font-size: 0.75em;
-    color: var(--text-color);
-}
-
-[data-theme="dark"] .tooltip-tag {
-    background: var(--surface-hover);
-    border: 1px solid var(--lora-border);
-}
-
 #recipeModal .modal-content {
     display: flex;
     flex-direction: column;
@@ -1153,7 +1041,7 @@
         max-height: 2.4em;
     }
 
-    .recipe-tags-container {
+    #recipeTagsContainer {
         margin-bottom: 6px;
     }
 

static/css/components/sidebar.css

@@ -114,11 +114,10 @@
 .sidebar-hidden-indicator {
     position: fixed;
     left: 0;
-    top: 50%;
-    transform: translateY(-50%);
+    top: 68px; /* Align with sidebar header */
     z-index: var(--z-overlay);
     width: 14px;
-    height: 44px;
+    height: 48px;
     display: flex;
     align-items: center;
     justify-content: center;
@@ -135,7 +134,7 @@
 }
 
 .sidebar-hidden-indicator i {
-    font-size: 9px;
+    font-size: 11px;
     color: var(--text-muted);
     transition: color 0.15s ease;
 }
@@ -144,6 +143,21 @@
     color: white;
 }
 
+/* Subtle breathing animation for first-time discovery */
+@keyframes sidebarBreathing {
+    0%, 100% { opacity: 0.3; }
+    50%      { opacity: 0.65; }
+}
+
+.sidebar-hidden-indicator.breathing {
+    animation: sidebarBreathing 2.5s ease-in-out infinite;
+    animation-delay: 0.5s;
+}
+
+.sidebar-hidden-indicator.breathing:hover {
+    animation: none;
+}
+
 .sidebar-hidden-indicator-tooltip {
     position: absolute;
     left: 100%;

static/css/onboarding.css

@@ -27,8 +27,8 @@
     transition: var(--transition-slow);
     /* Add glow effect */
     box-shadow: 
-        0 0 0 2px rgba(24, 144, 255, 0.3),
-        0 0 20px rgba(24, 144, 255, 0.2),
+        0 0 0 2px color-mix(in oklch, var(--color-accent) 30%, transparent),
+        0 0 20px color-mix(in oklch, var(--color-accent) 20%, transparent),
         inset 0 0 0 1px rgba(255, 255, 255, 0.1);
 }
 
@@ -221,14 +221,14 @@
 @keyframes onboarding-pulse {
     0%, 100% {
         box-shadow: 
-            0 0 0 2px rgba(24, 144, 255, 0.4),
-            0 0 20px rgba(24, 144, 255, 0.3),
+            0 0 0 2px color-mix(in oklch, var(--color-accent) 40%, transparent),
+            0 0 20px color-mix(in oklch, var(--color-accent) 30%, transparent),
             inset 0 0 0 1px rgba(255, 255, 255, 0.1);
     }
     50% {
         box-shadow: 
-            0 0 0 4px rgba(24, 144, 255, 0.6),
-            0 0 30px rgba(24, 144, 255, 0.4),
+            0 0 0 4px color-mix(in oklch, var(--color-accent) 60%, transparent),
+            0 0 30px color-mix(in oklch, var(--color-accent) 40%, transparent),
             inset 0 0 0 1px rgba(255, 255, 255, 0.2);
     }
 }

static/css/tokens/colors.css

@@ -37,13 +37,13 @@
   --color-error-border: color-mix(in oklch, var(--color-error) 50%, transparent);
 
   --color-info: oklch(var(--color-info-l) var(--color-info-c) var(--color-info-h));
-  --color-info-bg: oklch(72% 0.2 220);
-  --color-info-text: oklch(28% 0.03 220);
-  --color-info-glow: oklch(72% 0.2 220 / 0.28);
+  --color-info-bg: oklch(var(--color-info-l) var(--color-info-c) var(--color-info-h));
+  --color-info-text: oklch(28% 0.03 var(--color-info-h));
+  --color-info-glow: oklch(var(--color-info-l) var(--color-info-c) var(--color-info-h) / 0.28);
 
-  --color-skip-refresh-bg: oklch(82% 0.12 45);
-  --color-skip-refresh-text: oklch(35% 0.02 45);
-  --color-skip-refresh-glow: oklch(82% 0.12 45 / 0.15);
+  --color-skip-refresh-bg: oklch(82% 0.12 var(--color-warning-h));
+  --color-skip-refresh-text: oklch(35% 0.02 var(--color-warning-h));
+  --color-skip-refresh-glow: oklch(82% 0.12 var(--color-warning-h) / 0.15);
 }
 
 :root {
@@ -106,12 +106,360 @@
   --status-info-bg: oklch(50% 0.10 190 / 0.25);
   --status-info-border: oklch(55% 0.12 195 / 0.3);
 
-  --color-info-bg: oklch(62% 0.18 220);
-  --color-info-text: oklch(98% 0.02 240);
-  --color-info-glow: oklch(62% 0.18 220 / 0.4);
+  --color-info-bg: oklch(62% 0.18 var(--color-info-h));
+  --color-info-text: oklch(98% 0.02 var(--color-info-h));
+  --color-info-glow: oklch(62% 0.18 var(--color-info-h) / 0.4);
 
   --color-error-bg: color-mix(in oklch, var(--color-error) 15%, transparent);
   --color-error-border: color-mix(in oklch, var(--color-error) 40%, transparent);
 
   --favorite-color: #ffc107;
 }
+
+/* ── Preset: Nord ──────────────────────────────────────────── */
+
+[data-theme-preset="nord"] {
+  --color-accent-h: 213;
+  --color-accent-c: 0.18;
+  --color-accent-l: 62%;
+  --color-warning-h: 35;
+  --color-warning-c: 0.18;
+  --color-success-h: 130;
+  --color-error-l: 62%;
+  --color-error-c: 0.22;
+  --color-error-h: 5;
+  --color-info-h: 195;
+  --color-info-c: 0.18;
+
+  --bg-base: oklch(96% 0.01 240);
+  --bg-elevated: oklch(98% 0.008 240 / 0.95);
+  --bg-hover: oklch(93% 0.02 240);
+  --bg-disabled: oklch(92% 0.01 240);
+
+  --text-primary: oklch(22% 0.03 260);
+  --text-secondary: oklch(48% 0.03 260);
+  --text-inverse: oklch(97% 0.01 240);
+
+  --surface-base: oklch(97% 0.01 240);
+  --surface-elevated: oklch(98% 0.008 240 / 0.95);
+  --surface-hover: oklch(93% 0.02 240);
+  --surface-subtle: oklch(0% 0 0 / 0.03);
+
+  --border-base: oklch(82% 0.03 240);
+  --border-subtle: oklch(82% 0.03 240 / 0.45);
+
+  --favorite-color: oklch(72% 0.14 85);
+  --favorite-glow: oklch(72% 0.14 85 / 0.5);
+}
+
+[data-theme="dark"][data-theme-preset="nord"] {
+  --color-accent-h: 213;
+  --color-accent-c: 0.18;
+  --color-accent-l: 68%;
+  --color-warning-h: 35;
+  --color-warning-c: 0.18;
+  --color-success-h: 130;
+  --color-error-l: 65%;
+  --color-error-c: 0.22;
+  --color-error-h: 5;
+  --color-info-h: 195;
+  --color-info-c: 0.18;
+
+  --bg-base: oklch(20% 0.03 260);
+  --bg-elevated: oklch(24% 0.03 260 / 0.98);
+  --bg-hover: oklch(30% 0.03 260);
+  --bg-disabled: oklch(30% 0.02 260);
+
+  --text-primary: oklch(87% 0.02 240);
+  --text-secondary: oklch(68% 0.02 240);
+  --text-inverse: oklch(20% 0.03 260);
+
+  --surface-base: oklch(26% 0.03 260);
+  --surface-elevated: oklch(24% 0.03 260 / 0.98);
+  --surface-hover: oklch(30% 0.03 260);
+  --surface-subtle: oklch(100% 0 0 / 0.03);
+
+  --border-base: oklch(38% 0.03 260);
+  --border-subtle: oklch(87% 0.02 240 / 0.15);
+
+  --favorite-color: oklch(78% 0.15 85);
+  --favorite-glow: oklch(78% 0.15 85 / 0.5);
+}
+
+/* ── Preset: Midnight ───────────────────────────────────────── */
+
+[data-theme-preset="midnight"] {
+  --color-accent-h: 300;
+  --color-accent-c: 0.15;
+  --color-accent-l: 52%;
+  --color-warning-h: 50;
+  --color-warning-c: 0.18;
+  --color-success-h: 135;
+  --color-error-h: 5;
+  --color-error-l: 62%;
+  --color-error-c: 0.22;
+  --color-info-h: 195;
+  --color-info-c: 0.12;
+
+  --bg-base: oklch(96% 0.01 255);
+  --bg-elevated: oklch(98% 0.008 255 / 0.95);
+  --bg-hover: oklch(93% 0.02 255);
+  --bg-disabled: oklch(92% 0.01 255);
+
+  --text-primary: oklch(22% 0.03 260);
+  --text-secondary: oklch(48% 0.03 260);
+  --text-inverse: oklch(97% 0.01 255);
+
+  --surface-base: oklch(97% 0.01 255);
+  --surface-elevated: oklch(98% 0.008 255 / 0.95);
+  --surface-hover: oklch(93% 0.02 255);
+  --surface-subtle: oklch(0% 0 0 / 0.03);
+
+  --border-base: oklch(80% 0.03 255);
+  --border-subtle: oklch(80% 0.03 255 / 0.45);
+
+  --favorite-color: oklch(72% 0.16 85);
+  --favorite-glow: oklch(72% 0.16 85 / 0.5);
+}
+
+[data-theme="dark"][data-theme-preset="midnight"] {
+  --color-accent-h: 300;
+  --color-accent-c: 0.14;
+  --color-accent-l: 68%;
+  --color-warning-h: 50;
+  --color-warning-c: 0.18;
+  --color-success-h: 135;
+  --color-error-h: 5;
+  --color-error-l: 65%;
+  --color-error-c: 0.22;
+  --color-info-h: 195;
+  --color-info-c: 0.12;
+
+  --bg-base: oklch(18% 0.03 260);
+  --bg-elevated: oklch(22% 0.03 260 / 0.98);
+  --bg-hover: oklch(28% 0.03 260);
+  --bg-disabled: oklch(28% 0.02 260);
+
+  --text-primary: oklch(88% 0.02 255);
+  --text-secondary: oklch(68% 0.02 255);
+  --text-inverse: oklch(18% 0.03 260);
+
+  --surface-base: oklch(24% 0.03 260);
+  --surface-elevated: oklch(22% 0.03 260 / 0.98);
+  --surface-hover: oklch(28% 0.03 260);
+  --surface-subtle: oklch(100% 0 0 / 0.03);
+
+  --border-base: oklch(36% 0.03 260);
+  --border-subtle: oklch(88% 0.02 255 / 0.15);
+
+  --favorite-color: oklch(78% 0.16 85);
+  --favorite-glow: oklch(78% 0.16 85 / 0.5);
+}
+
+/* ── Preset: Monokai ───────────────────────────────────────── */
+
+[data-theme-preset="monokai"] {
+  --color-accent-h: 190;
+  --color-accent-c: 0.24;
+  --color-accent-l: 72%;
+  --color-warning-h: 50;
+  --color-warning-c: 0.22;
+  --color-success-h: 140;
+  --color-error-l: 60%;
+  --color-error-c: 0.22;
+  --color-error-h: 340;
+  --color-info-h: 250;
+
+  --bg-base: oklch(96% 0.01 80);
+  --bg-elevated: oklch(98% 0.005 80 / 0.95);
+  --bg-hover: oklch(93% 0.015 80);
+  --bg-disabled: oklch(92% 0.01 80);
+
+  --text-primary: oklch(20% 0.02 100);
+  --text-secondary: oklch(45% 0.02 100);
+  --text-inverse: oklch(97% 0.01 80);
+
+  --surface-base: oklch(97% 0.008 80);
+  --surface-elevated: oklch(98% 0.005 80 / 0.95);
+  --surface-hover: oklch(93% 0.015 80);
+  --surface-subtle: oklch(0% 0 0 / 0.03);
+
+  --border-base: oklch(80% 0.02 80);
+  --border-subtle: oklch(80% 0.02 80 / 0.45);
+
+  --favorite-color: oklch(72% 0.16 85);
+  --favorite-glow: oklch(72% 0.16 85 / 0.5);
+}
+
+[data-theme="dark"][data-theme-preset="monokai"] {
+  --color-accent-h: 190;
+  --color-accent-c: 0.24;
+  --color-accent-l: 72%;
+  --color-warning-h: 50;
+  --color-warning-c: 0.22;
+  --color-success-h: 140;
+  --color-error-l: 65%;
+  --color-error-c: 0.22;
+  --color-error-h: 340;
+  --color-info-h: 250;
+
+  --bg-base: oklch(18% 0.02 100);
+  --bg-elevated: oklch(22% 0.02 100 / 0.98);
+  --bg-hover: oklch(28% 0.025 100);
+  --bg-disabled: oklch(28% 0.015 100);
+
+  --text-primary: oklch(90% 0.02 80);
+  --text-secondary: oklch(70% 0.02 80);
+  --text-inverse: oklch(18% 0.02 100);
+
+  --surface-base: oklch(24% 0.02 100);
+  --surface-elevated: oklch(22% 0.02 100 / 0.98);
+  --surface-hover: oklch(28% 0.025 100);
+  --surface-subtle: oklch(100% 0 0 / 0.03);
+
+  --border-base: oklch(36% 0.02 100);
+  --border-subtle: oklch(90% 0.02 80 / 0.15);
+
+  --favorite-color: oklch(78% 0.16 85);
+  --favorite-glow: oklch(78% 0.16 85 / 0.5);
+}
+
+/* ── Preset: Dracula ───────────────────────────────────────── */
+
+[data-theme-preset="dracula"] {
+  --color-accent-h: 265;
+  --color-accent-c: 0.24;
+  --color-accent-l: 68%;
+  --color-warning-h: 45;
+  --color-warning-c: 0.22;
+  --color-success-h: 135;
+  --color-error-l: 62%;
+  --color-error-c: 0.22;
+  --color-error-h: 350;
+  --color-info-h: 195;
+
+  --bg-base: oklch(96% 0.01 290);
+  --bg-elevated: oklch(98% 0.008 290 / 0.95);
+  --bg-hover: oklch(93% 0.02 290);
+  --bg-disabled: oklch(92% 0.01 290);
+
+  --text-primary: oklch(22% 0.04 290);
+  --text-secondary: oklch(48% 0.04 290);
+  --text-inverse: oklch(97% 0.01 290);
+
+  --surface-base: oklch(97% 0.01 290);
+  --surface-elevated: oklch(98% 0.008 290 / 0.95);
+  --surface-hover: oklch(93% 0.02 290);
+  --surface-subtle: oklch(0% 0 0 / 0.03);
+
+  --border-base: oklch(80% 0.04 290);
+  --border-subtle: oklch(80% 0.04 290 / 0.45);
+
+  --favorite-color: oklch(72% 0.16 85);
+  --favorite-glow: oklch(72% 0.16 85 / 0.5);
+}
+
+[data-theme="dark"][data-theme-preset="dracula"] {
+  --color-accent-h: 265;
+  --color-accent-c: 0.24;
+  --color-accent-l: 72%;
+  --color-warning-h: 45;
+  --color-warning-c: 0.22;
+  --color-success-h: 135;
+  --color-error-l: 65%;
+  --color-error-c: 0.22;
+  --color-error-h: 350;
+  --color-info-h: 195;
+
+  --bg-base: oklch(18% 0.04 290);
+  --bg-elevated: oklch(22% 0.04 290 / 0.98);
+  --bg-hover: oklch(28% 0.04 290);
+  --bg-disabled: oklch(28% 0.03 290);
+
+  --text-primary: oklch(90% 0.02 290);
+  --text-secondary: oklch(70% 0.03 290);
+  --text-inverse: oklch(18% 0.04 290);
+
+  --surface-base: oklch(24% 0.04 290);
+  --surface-elevated: oklch(22% 0.04 290 / 0.98);
+  --surface-hover: oklch(28% 0.04 290);
+  --surface-subtle: oklch(100% 0 0 / 0.03);
+
+  --border-base: oklch(36% 0.04 290);
+  --border-subtle: oklch(90% 0.02 290 / 0.15);
+
+  --favorite-color: oklch(78% 0.16 85);
+  --favorite-glow: oklch(78% 0.16 85 / 0.5);
+}
+
+/* ── Preset: Solarized ─────────────────────────────────────── */
+
+[data-theme-preset="solarized"] {
+  --color-accent-h: 175;
+  --color-accent-c: 0.18;
+  --color-accent-l: 55%;
+  --color-warning-h: 45;
+  --color-warning-c: 0.20;
+  --color-success-h: 68;
+  --color-error-l: 62%;
+  --color-error-c: 0.22;
+  --color-error-h: 5;
+  --color-info-h: 220;
+  --color-info-c: 0.16;
+  --color-info-l: 68%;
+
+  --bg-base: oklch(95% 0.03 85);
+  --bg-elevated: oklch(97% 0.025 85 / 0.95);
+  --bg-hover: oklch(91% 0.035 85);
+  --bg-disabled: oklch(90% 0.025 85);
+
+  --text-primary: oklch(30% 0.06 200);
+  --text-secondary: oklch(50% 0.04 200);
+  --text-inverse: oklch(95% 0.03 85);
+
+  --surface-base: oklch(96% 0.025 85);
+  --surface-elevated: oklch(97% 0.025 85 / 0.95);
+  --surface-hover: oklch(91% 0.035 85);
+  --surface-subtle: oklch(0% 0 0 / 0.03);
+
+  --border-base: oklch(78% 0.04 85);
+  --border-subtle: oklch(78% 0.04 85 / 0.45);
+
+  --favorite-color: oklch(68% 0.16 75);
+  --favorite-glow: oklch(68% 0.16 75 / 0.5);
+}
+
+[data-theme="dark"][data-theme-preset="solarized"] {
+  --color-accent-h: 175;
+  --color-accent-c: 0.18;
+  --color-accent-l: 60%;
+  --color-warning-h: 45;
+  --color-warning-c: 0.20;
+  --color-success-h: 68;
+  --color-error-l: 65%;
+  --color-error-c: 0.22;
+  --color-error-h: 5;
+  --color-info-h: 220;
+  --color-info-c: 0.16;
+  --color-info-l: 68%;
+
+  --bg-base: oklch(18% 0.05 200);
+  --bg-elevated: oklch(22% 0.05 200 / 0.98);
+  --bg-hover: oklch(28% 0.05 200);
+  --bg-disabled: oklch(28% 0.04 200);
+
+  --text-primary: oklch(72% 0.03 85);
+  --text-secondary: oklch(62% 0.03 85);
+  --text-inverse: oklch(18% 0.05 200);
+
+  --surface-base: oklch(24% 0.05 200);
+  --surface-elevated: oklch(22% 0.05 200 / 0.98);
+  --surface-hover: oklch(28% 0.05 200);
+  --surface-subtle: oklch(100% 0 0 / 0.03);
+
+  --border-base: oklch(36% 0.04 200);
+  --border-subtle: oklch(72% 0.03 85 / 0.15);
+
+  --favorite-color: oklch(72% 0.16 75);
+  --favorite-glow: oklch(72% 0.16 75 / 0.5);
+}

static/images/tabler/brush.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-brush"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 21v-4a4 4 0 1 1 4 4h-4" /><path d="M21 3a16 16 0 0 0 -12.8 10.2" /><path d="M21 3a16 16 0 0 1 -10.2 12.8" /><path d="M10.6 9a9 9 0 0 1 4.4 4.4" /></svg>

static/images/tabler/currency-dollar.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-currency-dollar"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M16.7 8a3 3 0 0 0 -2.7 -2h-4a3 3 0 0 0 0 6h4a3 3 0 0 1 0 6h-4a3 3 0 0 1 -2.7 -2" /><path d="M12 3v3m0 12v3" /></svg>

static/images/tabler/git-merge.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-git-merge"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M5 18a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" /><path d="M5 6a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" /><path d="M15 12a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" /><path d="M7 8l0 8" /><path d="M7 8a4 4 0 0 0 4 4h4" /></svg>

static/images/tabler/license.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-license"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M15 21h-9a3 3 0 0 1 -3 -3v-1h10v2a2 2 0 0 0 4 0v-14a2 2 0 1 1 2 2h-2m2 -4h-11a3 3 0 0 0 -3 3v11" /><path d="M9 7l4 0" /><path d="M9 11l4 0" /></svg>

static/images/tabler/user.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-user"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0" /><path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2" /></svg>

static/js/api/baseModelApi.js

@@ -133,6 +133,16 @@ export class BaseModelApiClient {
             pageState.hasMore = result.hasMore;
             pageState.currentPage = pageState.currentPage + 1;
 
+            // When resetting to page 1, scroll back to the top
+            // This covers: folder selection, filter/sort/search changes,
+            // favorites/update/excluded view toggles, alphabet filter, etc.
+            if (resetPage) {
+                const scrollContainer = document.querySelector('.page-content');
+                if (scrollContainer) {
+                    scrollContainer.scrollTop = 0;
+                }
+            }
+
             if (updateFolders) {
                 sidebarManager.refresh();
             }
@@ -679,39 +689,34 @@ export class BaseModelApiClient {
                 <div class="modal-content metadata-refresh-result-modal">
                     <button class="close" data-action="close-modal">&times;</button>
 
-                    <h2><i class="fas fa-sync-alt"></i> ${translate('modals.metadataFetchSummary.title', {}, 'Metadata Fetch Summary')}</h2>
+                    <h2>${translate('modals.metadataFetchSummary.title', {}, 'Metadata Fetch Summary')}</h2>
 
                     <div class="refresh-summary-stats">
                         <div class="stat-card stat-card-success">
-                            <i class="fas fa-check-circle"></i>
                             <div class="stat-card-body">
                                 <span class="stat-card-label">${translate('modals.metadataFetchSummary.statSuccess', {}, 'Success')}</span>
                                 <span class="stat-card-value">${success}</span>
                             </div>
                         </div>
                         <div class="stat-card stat-card-failure">
-                            <i class="fas fa-times-circle"></i>
                             <div class="stat-card-body">
                                 <span class="stat-card-label">${translate('modals.metadataFetchSummary.statFailed', {}, 'Failed')}</span>
                                 <span class="stat-card-value">${failure_count}</span>
                             </div>
                         </div>
                         <div class="stat-card stat-card-skipped">
-                            <i class="fas fa-forward"></i>
                             <div class="stat-card-body">
                                 <span class="stat-card-label">${translate('modals.metadataFetchSummary.statSkipped', {}, 'Skipped')}</span>
                                 <span class="stat-card-value">${skipped_count}</span>
                             </div>
                         </div>
                         <div class="stat-card stat-card-total">
-                            <i class="fas fa-database"></i>
                             <div class="stat-card-body">
                                 <span class="stat-card-label">${translate('modals.metadataFetchSummary.statTotal', {}, 'Total Scanned')}</span>
                                 <span class="stat-card-value">${total || processed}</span>
                             </div>
                         </div>
                         <div class="stat-card stat-card-time">
-                            <i class="fas fa-clock"></i>
                             <div class="stat-card-body">
                                 <span class="stat-card-label">${translate('modals.metadataFetchSummary.statDuration', {}, 'Duration')}</span>
                                 <span class="stat-card-value">${elapsed_seconds}s</span>

static/js/components/Header.js

@@ -1,9 +1,9 @@
 import { updateService } from '../managers/UpdateService.js';
-import { toggleTheme } from '../utils/uiHelpers.js';
+import { toggleTheme, setPreset, CYCLE_ORDER, PRESET_NAMES } from '../utils/uiHelpers.js';
 import { SearchManager } from '../managers/SearchManager.js';
 import { FilterManager } from '../managers/FilterManager.js';
 import { initPageState } from '../state/index.js';
-import { getStorageItem } from '../utils/storageHelpers.js';
+import { getStorageItem, setStorageItem } from '../utils/storageHelpers.js';
 import { updateElementAttribute } from '../utils/i18nHelpers.js';
 import { renderSupporters } from '../services/supportersService.js';
 
@@ -47,25 +47,8 @@ export class HeaderManager {
     }
     
     initializeCommonElements() {
-      // Handle theme toggle
-      const themeToggle = document.querySelector('.theme-toggle');
-      if (themeToggle) {
-        const currentTheme = getStorageItem('theme') || 'auto';
-        themeToggle.classList.add(`theme-${currentTheme}`);
+      this.initializeThemePopover();
 
-        // Use i18nHelpers to update themeToggle's title
-        this.updateThemeTooltip(themeToggle, currentTheme);
-
-        themeToggle.addEventListener('click', async () => {
-          if (typeof toggleTheme === 'function') {
-            const newTheme = toggleTheme();
-            // Use i18nHelpers to update themeToggle's title
-            this.updateThemeTooltip(themeToggle, newTheme);
-          }
-        });
-      }
-      
-      // Handle settings toggle
       const settingsToggle = document.querySelector('.settings-toggle');
       if (settingsToggle) {
         settingsToggle.addEventListener('click', () => {
@@ -74,22 +57,19 @@ export class HeaderManager {
           }
         });
       }
-      
-      // Handle update toggle
+
       const updateToggle = document.getElementById('updateToggleBtn');
       if (updateToggle) {
         updateToggle.addEventListener('click', () => {
           updateService.toggleUpdateModal();
         });
       }
-      
-      // Handle support toggle
+
       const supportToggle = document.getElementById('supportToggleBtn');
       if (supportToggle) {
         supportToggle.addEventListener('click', async () => {
           if (window.modalManager) {
             window.modalManager.toggleModal('supportModal');
-            // Load supporters data when modal opens
             try {
               await renderSupporters();
             } catch (error) {
@@ -99,41 +79,144 @@ export class HeaderManager {
         });
       }
 
-      // Handle QR code toggle
       const qrToggle = document.getElementById('toggleQRCode');
       const qrContainer = document.getElementById('qrCodeContainer');
-      
-      if (qrToggle && qrContainer) {
-          qrToggle.addEventListener('click', function() {
-              qrContainer.classList.toggle('show');
-              qrToggle.classList.toggle('active');
-              
-              const toggleText = qrToggle.querySelector('.toggle-text');
-              if (qrContainer.classList.contains('show')) {
-                  toggleText.textContent = 'Hide WeChat QR Code';
-                  // Add small delay to ensure DOM is updated before scrolling
-                  setTimeout(() => {
-                      const supportModal = document.querySelector('.support-modal');
-                      if (supportModal) {
-                          supportModal.scrollTo({
-                              top: supportModal.scrollHeight,
-                              behavior: 'smooth'
-                          });
-                      }
-                  }, 250);
-              } else {
-                  toggleText.textContent = 'Show WeChat QR Code';
-              }
-          });
-      }
-      
-      // Hide search functionality on Statistics page
-      this.updateHeaderForPage();
 
-      // Initialize hamburger menu for mobile
+      if (qrToggle && qrContainer) {
+        qrToggle.addEventListener('click', function () {
+          qrContainer.classList.toggle('show');
+          qrToggle.classList.toggle('active');
+
+          const toggleText = qrToggle.querySelector('.toggle-text');
+          if (qrContainer.classList.contains('show')) {
+            toggleText.textContent = 'Hide WeChat QR Code';
+            setTimeout(() => {
+              const supportModal = document.querySelector('.support-modal');
+              if (supportModal) {
+                supportModal.scrollTo({
+                  top: supportModal.scrollHeight,
+                  behavior: 'smooth'
+                });
+              }
+            }, 250);
+          } else {
+            toggleText.textContent = 'Show WeChat QR Code';
+          }
+        });
+      }
+
+      this.updateHeaderForPage();
       this.initializeHamburgerMenu();
     }
 
+    initializeThemePopover() {
+      const themeToggle = document.querySelector('.theme-toggle');
+      const themePopover = document.getElementById('themePopover');
+      if (!themeToggle || !themePopover) return;
+
+      const currentTheme = getStorageItem('theme') || 'auto';
+      const currentPreset = getStorageItem('theme_preset') || 'default';
+      themeToggle.classList.add(`theme-${currentTheme}`);
+      this.updateThemeTooltip(themeToggle, currentTheme);
+      this.updatePopoverActiveStates(currentTheme, currentPreset);
+
+      themeToggle.addEventListener('click', (e) => {
+        e.stopPropagation();
+        const isOpen = themePopover.classList.contains('active');
+        this.closeAllPopovers();
+        if (!isOpen) {
+          this.positionThemePopover();
+          themePopover.classList.add('active');
+        }
+      });
+
+      themePopover.addEventListener('click', (e) => {
+        e.stopPropagation();
+        const modeBtn = e.target.closest('.theme-mode-btn');
+        const presetBtn = e.target.closest('.theme-preset-btn');
+
+        if (modeBtn) {
+          const mode = modeBtn.dataset.mode;
+          this.setThemeMode(mode);
+        } else if (presetBtn) {
+          const preset = presetBtn.dataset.preset;
+          this.setThemePreset(preset);
+        }
+      });
+
+      document.addEventListener('click', (e) => {
+        if (!themeToggle.contains(e.target) && !themePopover.contains(e.target)) {
+          themePopover.classList.remove('active');
+        }
+      });
+
+      // Reposition on resize while popover is active
+      window.addEventListener('resize', () => {
+        if (themePopover.classList.contains('active')) {
+          this.positionThemePopover();
+        }
+      });
+    }
+
+    closeAllPopovers() {
+      const themePopover = document.getElementById('themePopover');
+      if (themePopover) {
+        themePopover.classList.remove('active');
+      }
+    }
+
+    positionThemePopover() {
+      const themeToggle = document.querySelector('.theme-toggle');
+      const themePopover = document.getElementById('themePopover');
+      if (!themeToggle || !themePopover) return;
+      const rect = themeToggle.getBoundingClientRect();
+      // Guard: toggle may be hidden on narrow viewports (≤950px CSS hides .header-controls)
+      if (rect.width === 0 || rect.height === 0) return;
+      themePopover.style.top = (rect.bottom + 8) + 'px';
+      themePopover.style.right = (window.innerWidth - rect.right - 8) + 'px';
+    }
+
+    setThemeMode(mode) {
+      setStorageItem('theme', mode);
+      const htmlElement = document.documentElement;
+      const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+      htmlElement.removeAttribute('data-theme');
+      if (mode === 'dark' || (mode === 'auto' && prefersDark)) {
+        htmlElement.setAttribute('data-theme', 'dark');
+        document.body.dataset.theme = 'dark';
+      } else {
+        htmlElement.setAttribute('data-theme', 'light');
+        document.body.dataset.theme = 'light';
+      }
+      const themeToggle = document.querySelector('.theme-toggle');
+      if (themeToggle) {
+        themeToggle.classList.remove('theme-light', 'theme-dark', 'theme-auto');
+        themeToggle.classList.add(`theme-${mode}`);
+        this.updateThemeTooltip(themeToggle, mode);
+      }
+      this.updateHamburgerThemeIcon();
+      this.updatePopoverActiveStates(mode, getStorageItem('theme_preset') || 'default');
+    }
+
+    setThemePreset(preset) {
+      setPreset(preset);
+      this.updatePopoverActiveStates(getStorageItem('theme') || 'auto', preset);
+      this.updateHamburgerThemeIcon();
+    }
+
+    updatePopoverActiveStates(theme, preset) {
+      const popover = document.getElementById('themePopover');
+      if (!popover) return;
+
+      popover.querySelectorAll('.theme-mode-btn').forEach(btn => {
+        btn.classList.toggle('active', btn.dataset.mode === theme);
+      });
+
+      popover.querySelectorAll('.theme-preset-btn').forEach(btn => {
+        btn.classList.toggle('active', btn.dataset.preset === preset);
+      });
+    }
+
     initializeHamburgerMenu() {
       const hamburgerBtn = document.getElementById('hamburgerMenuBtn');
       const hamburgerDropdown = document.getElementById('hamburgerDropdown');
@@ -188,7 +271,6 @@ export class HeaderManager {
         case 'theme':
           if (typeof toggleTheme === 'function') {
             const newTheme = toggleTheme();
-            // Update theme toggle in header if it exists
             const themeToggle = document.querySelector('.theme-toggle');
             if (themeToggle) {
               themeToggle.classList.remove('theme-light', 'theme-dark', 'theme-auto');
@@ -196,6 +278,7 @@ export class HeaderManager {
               this.updateThemeTooltip(themeToggle, newTheme);
             }
             this.updateHamburgerThemeIcon();
+            this.updatePopoverActiveStates(newTheme, getStorageItem('theme_preset') || 'default');
           }
           break;
         case 'settings':

static/js/components/RecipeModal.js

@@ -7,6 +7,8 @@ import { fetchRecipeDetails, updateRecipeMetadata } from '../api/recipeApi.js';
 import { downloadManager } from '../managers/DownloadManager.js';
 import { MODEL_TYPES } from '../api/apiConfig.js';
 import { openMediaViewer } from './shared/MediaViewer.js';
+import { renderCompactTags, setupTagTooltip } from './shared/utils.js';
+import { setupTagEditMode } from './shared/ModelTags.js';
 
 const ALLOWED_GEN_PARAM_KEYS = new Set([
     'prompt',
@@ -139,14 +141,6 @@ class RecipeModal {
                 this.saveTitleEdit();
             }
 
-            // Handle tags edit
-            const tagsEditor = document.getElementById('recipeTagsEditor');
-            if (tagsEditor && tagsEditor.classList.contains('active') &&
-                !tagsEditor.contains(event.target) &&
-                !event.target.closest('.edit-icon')) {
-                this.saveTagsEdit();
-            }
-
             // Handle reconnect input
             const reconnectContainers = document.querySelectorAll('.lora-reconnect-container');
             reconnectContainers.forEach(container => {
@@ -236,98 +230,10 @@ class RecipeModal {
         this.filePath = hydratedRecipe.file_path;
         this.listFilePath = hydratedRecipe.file_path;
 
-        // Set recipe tags if they exist
-        const tagsCompactElement = document.getElementById('recipeTagsCompact');
-        const tagsTooltipContent = document.getElementById('recipeTagsTooltipContent');
-
-        if (tagsCompactElement) {
-            // Add tags container with edit functionality
-            tagsCompactElement.innerHTML = `
-                <div class="editable-content tags-content">
-                    <div class="tags-display"></div>
-                    <button class="edit-icon" title="Edit tags"><i class="fas fa-pencil-alt"></i></button>
-                </div>
-                <div id="recipeTagsEditor" class="content-editor tags-editor">
-                    <input type="text" class="tags-input" placeholder="Enter tags separated by commas">
-                </div>
-            `;
-
-            const tagsDisplay = tagsCompactElement.querySelector('.tags-display');
-
-            if (hydratedRecipe.tags && hydratedRecipe.tags.length > 0) {
-                // Limit displayed tags to 5, show a "+X more" button if needed
-                const maxVisibleTags = 5;
-                const visibleTags = hydratedRecipe.tags.slice(0, maxVisibleTags);
-                const remainingTags = hydratedRecipe.tags.length > maxVisibleTags ? hydratedRecipe.tags.slice(maxVisibleTags) : [];
-
-                // Add visible tags
-                visibleTags.forEach(tag => {
-                    const tagElement = document.createElement('div');
-                    tagElement.className = 'recipe-tag-compact';
-                    tagElement.textContent = tag;
-                    tagsDisplay.appendChild(tagElement);
-                });
-
-                // Add "more" button if needed
-                if (remainingTags.length > 0) {
-                    const moreButton = document.createElement('div');
-                    moreButton.className = 'recipe-tag-more';
-                    moreButton.textContent = `+${remainingTags.length} more`;
-                    tagsDisplay.appendChild(moreButton);
-
-                    // Add tooltip functionality
-                    moreButton.addEventListener('mouseenter', () => {
-                        document.getElementById('recipeTagsTooltip').classList.add('visible');
-                    });
-
-                    moreButton.addEventListener('mouseleave', () => {
-                        setTimeout(() => {
-                            if (!document.getElementById('recipeTagsTooltip').matches(':hover')) {
-                                document.getElementById('recipeTagsTooltip').classList.remove('visible');
-                            }
-                        }, 300);
-                    });
-
-                    document.getElementById('recipeTagsTooltip').addEventListener('mouseleave', () => {
-                        document.getElementById('recipeTagsTooltip').classList.remove('visible');
-                    });
-
-                    // Add all tags to tooltip
-                    if (tagsTooltipContent) {
-                        tagsTooltipContent.innerHTML = '';
-                        hydratedRecipe.tags.forEach(tag => {
-                            const tooltipTag = document.createElement('div');
-                            tooltipTag.className = 'tooltip-tag';
-                            tooltipTag.textContent = tag;
-                            tagsTooltipContent.appendChild(tooltipTag);
-                        });
-                    }
-                }
-            } else {
-                tagsDisplay.innerHTML = '<div class="no-tags">No tags</div>';
-            }
-
-            // Add event listeners for tags editing
-            const editTagsIcon = tagsCompactElement.querySelector('.edit-icon');
-            const tagsInput = tagsCompactElement.querySelector('.tags-input');
-
-            // Set current tags in the input
-            if (hydratedRecipe.tags && hydratedRecipe.tags.length > 0) {
-                tagsInput.value = hydratedRecipe.tags.join(', ');
-            }
-
-            editTagsIcon.addEventListener('click', () => this.showTagsEditor());
-
-            // Add key event listener for Enter key
-            tagsInput.addEventListener('keydown', (e) => {
-                if (e.key === 'Enter') {
-                    e.preventDefault();
-                    this.saveTagsEdit();
-                } else if (e.key === 'Escape') {
-                    e.preventDefault();
-                    this.cancelTagsEdit();
-                }
-            });
+        // Render tags using shared utility
+        const tagsContainer = document.getElementById('recipeTagsContainer');
+        if (tagsContainer) {
+            this.updateTagsDisplay(tagsContainer, hydratedRecipe.tags || []);
         }
 
         // Set recipe image
@@ -609,17 +515,35 @@ class RecipeModal {
     }
 
     syncTagsDisplay(tags) {
-        const tagsContainer = document.getElementById('recipeTagsCompact');
-        if (!tagsContainer) {
-            return;
-        }
+        const container = document.getElementById('recipeTagsContainer');
+        if (!container) return;
+        this.updateTagsDisplay(container, tags || []);
+    }
 
-        this.updateTagsDisplay(tagsContainer, tags || []);
+    // Re-render tags display using shared utility, wire edit mode with ModelTags
+    updateTagsDisplay(container, tags) {
+        const filePath = this.filePath || '';
 
-        const tagsInput = tagsContainer.querySelector('.tags-input');
-        if (tagsInput) {
-            tagsInput.value = tags && tags.length > 0 ? tags.join(', ') : '';
-        }
+        container.innerHTML = renderCompactTags(tags, filePath);
+
+        // Setup tooltip for all tags
+        setupTagTooltip(container);
+
+        // Wire edit button using shared tag editing (no suggestions for recipes)
+        setupTagEditMode(null, {
+            container: container,
+            showSuggestions: false,
+            normalizeTag: false,
+            saveHandler: async (filePath, tags) => {
+                await updateRecipeMetadata(filePath, { tags }, this.getMetadataUpdateOptions());
+            },
+            onSaved: (tags) => {
+                this.currentRecipe.tags = tags;
+                this.commitField('tags');
+                const c = document.getElementById('recipeTagsContainer');
+                if (c) this.updateTagsDisplay(c, tags);
+            },
+        });
     }
 
     syncPromptField(field, value, placeholder) {
@@ -976,139 +900,6 @@ class RecipeModal {
         }
     }
 
-    // Tags editing methods
-    showTagsEditor() {
-        const tagsContainer = document.getElementById('recipeTagsCompact');
-        if (tagsContainer) {
-            tagsContainer.querySelector('.editable-content').classList.add('hide');
-            const editor = tagsContainer.querySelector('#recipeTagsEditor');
-            editor.classList.add('active');
-            const input = editor.querySelector('input');
-            input.oninput = () => this.markFieldDirty('tags');
-            input.focus();
-        }
-    }
-
-    saveTagsEdit() {
-        const tagsContainer = document.getElementById('recipeTagsCompact');
-        if (tagsContainer) {
-            const editor = tagsContainer.querySelector('#recipeTagsEditor');
-            const input = editor.querySelector('input');
-            const tagsText = input.value.trim();
-
-            // Parse tags
-            let newTags = [];
-            if (tagsText) {
-                newTags = tagsText.split(',')
-                    .map(tag => tag.trim())
-                    .filter(tag => tag.length > 0);
-            }
-
-            // Check if tags changed
-            const oldTags = this.currentRecipe.tags || [];
-            const tagsChanged =
-                newTags.length !== oldTags.length ||
-                newTags.some((tag, index) => tag !== oldTags[index]);
-
-            if (tagsChanged) {
-                // Update the recipe on the server
-                updateRecipeMetadata(this.filePath, { tags: newTags }, this.getMetadataUpdateOptions())
-                    .then(data => {
-                        // Show success toast
-                        showToast('toast.recipes.tagsUpdated', {}, 'success');
-
-                        // Update the current recipe object
-                        this.currentRecipe.tags = newTags;
-                        this.commitField('tags');
-
-                        // Update tags in the UI
-                        this.updateTagsDisplay(tagsContainer, newTags);
-                    })
-                    .catch(error => {
-                        // Error is handled in the API function
-                        this.clearFieldDirty('tags');
-                    });
-            } else {
-                this.clearFieldDirty('tags');
-            }
-
-            // Hide editor
-            editor.classList.remove('active');
-            tagsContainer.querySelector('.editable-content').classList.remove('hide');
-        }
-    }
-
-    // Helper method to update tags display
-    updateTagsDisplay(tagsContainer, tags) {
-        const tagsDisplay = tagsContainer.querySelector('.tags-display');
-        tagsDisplay.innerHTML = '';
-
-        if (tags.length > 0) {
-            // Limit displayed tags to 5, show a "+X more" button if needed
-            const maxVisibleTags = 5;
-            const visibleTags = tags.slice(0, maxVisibleTags);
-            const remainingTags = tags.length > maxVisibleTags ? tags.slice(maxVisibleTags) : [];
-
-            // Add visible tags
-            visibleTags.forEach(tag => {
-                const tagElement = document.createElement('div');
-                tagElement.className = 'recipe-tag-compact';
-                tagElement.textContent = tag;
-                tagsDisplay.appendChild(tagElement);
-            });
-
-            // Add "more" button if needed
-            if (remainingTags.length > 0) {
-                const moreButton = document.createElement('div');
-                moreButton.className = 'recipe-tag-more';
-                moreButton.textContent = `+${remainingTags.length} more`;
-                tagsDisplay.appendChild(moreButton);
-
-                // Update tooltip content
-                const tooltipContent = document.getElementById('recipeTagsTooltipContent');
-                if (tooltipContent) {
-                    tooltipContent.innerHTML = '';
-                    tags.forEach(tag => {
-                        const tooltipTag = document.createElement('div');
-                        tooltipTag.className = 'tooltip-tag';
-                        tooltipTag.textContent = tag;
-                        tooltipContent.appendChild(tooltipTag);
-                    });
-                }
-
-                // Re-add tooltip functionality
-                moreButton.addEventListener('mouseenter', () => {
-                    document.getElementById('recipeTagsTooltip').classList.add('visible');
-                });
-
-                moreButton.addEventListener('mouseleave', () => {
-                    setTimeout(() => {
-                        if (!document.getElementById('recipeTagsTooltip').matches(':hover')) {
-                            document.getElementById('recipeTagsTooltip').classList.remove('visible');
-                        }
-                    }, 300);
-                });
-            }
-        } else {
-            tagsDisplay.innerHTML = '<div class="no-tags">No tags</div>';
-        }
-    }
-
-    cancelTagsEdit() {
-        const tagsContainer = document.getElementById('recipeTagsCompact');
-        if (tagsContainer) {
-            // Reset input value
-            const editor = tagsContainer.querySelector('#recipeTagsEditor');
-            const input = editor.querySelector('input');
-            input.value = this.currentRecipe.tags ? this.currentRecipe.tags.join(', ') : '';
-            this.clearFieldDirty('tags');
-
-            // Hide editor
-            editor.classList.remove('active');
-            tagsContainer.querySelector('.editable-content').classList.remove('hide');
-        }
-    }
-
     setupPromptEditors() {
         const promptConfigs = [
             {

static/js/components/SidebarManager.js

@@ -4,7 +4,7 @@
 import { getStorageItem, setStorageItem } from '../utils/storageHelpers.js';
 import { getModelApiClient } from '../api/modelApiFactory.js';
 import { translate } from '../utils/i18nHelpers.js';
-import { state } from '../state/index.js';
+import { state, getCurrentPageState } from '../state/index.js';
 import { bulkManager } from '../managers/BulkManager.js';
 import { showToast } from '../utils/uiHelpers.js';
 import { performFolderUpdateCheck } from '../utils/updateCheckHelpers.js';
@@ -457,21 +457,69 @@ export class SidebarManager {
 
         try {
             console.log('[SidebarManager] calling apiClient.move, useBulkMove:', useBulkMove);
+            let movedFiles = []; // Array of { original_file_path, new_file_path }
+
             if (useBulkMove) {
-                await this.apiClient.moveBulkModels(this.draggedFilePaths, destination);
+                const results = await this.apiClient.moveBulkModels(this.draggedFilePaths, destination);
+                movedFiles = (results || [])
+                    .filter(r => r.success)
+                    .map(r => ({ original_file_path: r.original_file_path, new_file_path: r.new_file_path }));
             } else {
-                await this.apiClient.moveSingleModel(this.draggedFilePaths[0], destination);
+                const result = await this.apiClient.moveSingleModel(this.draggedFilePaths[0], destination);
+                if (result) {
+                    movedFiles.push({
+                        original_file_path: result.original_file_path || this.draggedFilePaths[0],
+                        new_file_path: result.new_file_path
+                    });
+                }
             }
             console.log('[SidebarManager] apiClient.move successful');
 
-            if (this.pageControls && typeof this.pageControls.resetAndReload === 'function') {
-                console.log('[SidebarManager] calling resetAndReload');
-                await this.pageControls.resetAndReload(true);
-            } else {
-                console.log('[SidebarManager] calling refresh');
-                await this.refresh();
+            // Update VirtualScroller in-place instead of full reload
+            if (movedFiles.length > 0 && state.virtualScroller) {
+                const pageState = getCurrentPageState();
+                const normalizedActive = (pageState.activeFolder || '').replace(/\\/g, '/').replace(/\/$/, '');
+                const isRecursive = pageState.searchOptions?.recursive ?? true;
+                const isFolderFiltered = pageState.activeFolder !== null;
+
+                const normalizedTarget = targetRelativePath.replace(/\\/g, '/').replace(/\/$/, '');
+
+                // Determine if items in the target folder are visible in the current view
+                let itemsRemainVisible = true;
+                if (isFolderFiltered) {
+                    if (isRecursive) {
+                        itemsRemainVisible = normalizedActive === '' ||
+                            normalizedTarget === normalizedActive ||
+                            normalizedTarget.startsWith(normalizedActive + '/');
+                    } else {
+                        itemsRemainVisible = normalizedTarget === normalizedActive;
+                    }
+                }
+
+                if (itemsRemainVisible) {
+                    // Items stay visible — update each item's file_path to reflect new location
+                    for (const moved of movedFiles) {
+                        if (moved.original_file_path && moved.new_file_path) {
+                            state.virtualScroller.updateSingleItem(moved.original_file_path, {
+                                file_path: moved.new_file_path,
+                                folder: normalizedTarget
+                            });
+                        }
+                    }
+                } else {
+                    // Items no longer visible in current folder — remove from VirtualScroller
+                    const pathsToRemove = movedFiles
+                        .map(m => m.original_file_path)
+                        .filter(Boolean);
+                    if (pathsToRemove.length > 0) {
+                        state.virtualScroller.removeMultipleItemsByFilePath(pathsToRemove);
+                    }
+                }
             }
 
+            // Refresh sidebar folder tree only (no model data reload)
+            await this.refresh();
+
             if (this.draggedFromBulk && state.bulkMode && typeof bulkManager?.toggleBulkMode === 'function') {
                 bulkManager.toggleBulkMode();
             }
@@ -530,21 +578,69 @@ export class SidebarManager {
 
         try {
             console.log('[SidebarManager] calling apiClient.move, useBulkMove:', useBulkMove);
+            let movedFiles = []; // Array of { original_file_path, new_file_path }
+
             if (useBulkMove) {
-                await this.apiClient.moveBulkModels(draggedFilePaths, destination);
+                const results = await this.apiClient.moveBulkModels(draggedFilePaths, destination);
+                movedFiles = (results || [])
+                    .filter(r => r.success)
+                    .map(r => ({ original_file_path: r.original_file_path, new_file_path: r.new_file_path }));
             } else {
-                await this.apiClient.moveSingleModel(draggedFilePaths[0], destination);
+                const result = await this.apiClient.moveSingleModel(draggedFilePaths[0], destination);
+                if (result) {
+                    movedFiles.push({
+                        original_file_path: result.original_file_path || draggedFilePaths[0],
+                        new_file_path: result.new_file_path
+                    });
+                }
             }
             console.log('[SidebarManager] apiClient.move successful');
 
-            if (this.pageControls && typeof this.pageControls.resetAndReload === 'function') {
-                console.log('[SidebarManager] calling resetAndReload');
-                await this.pageControls.resetAndReload(true);
-            } else {
-                console.log('[SidebarManager] calling refresh');
-                await this.refresh();
+            // Update VirtualScroller in-place instead of full reload
+            if (movedFiles.length > 0 && state.virtualScroller) {
+                const pageState = getCurrentPageState();
+                const normalizedActive = (pageState.activeFolder || '').replace(/\\/g, '/').replace(/\/$/, '');
+                const isRecursive = pageState.searchOptions?.recursive ?? true;
+                const isFolderFiltered = pageState.activeFolder !== null;
+
+                const normalizedTarget = targetRelativePath.replace(/\\/g, '/').replace(/\/$/, '');
+
+                // Determine if items in the target folder are visible in the current view
+                let itemsRemainVisible = true;
+                if (isFolderFiltered) {
+                    if (isRecursive) {
+                        itemsRemainVisible = normalizedActive === '' ||
+                            normalizedTarget === normalizedActive ||
+                            normalizedTarget.startsWith(normalizedActive + '/');
+                    } else {
+                        itemsRemainVisible = normalizedTarget === normalizedActive;
+                    }
+                }
+
+                if (itemsRemainVisible) {
+                    // Items stay visible — update each item's file_path to reflect new location
+                    for (const moved of movedFiles) {
+                        if (moved.original_file_path && moved.new_file_path) {
+                            state.virtualScroller.updateSingleItem(moved.original_file_path, {
+                                file_path: moved.new_file_path,
+                                folder: normalizedTarget
+                            });
+                        }
+                    }
+                } else {
+                    // Items no longer visible in current folder — remove from VirtualScroller
+                    const pathsToRemove = movedFiles
+                        .map(m => m.original_file_path)
+                        .filter(Boolean);
+                    if (pathsToRemove.length > 0) {
+                        state.virtualScroller.removeMultipleItemsByFilePath(pathsToRemove);
+                    }
+                }
             }
 
+            // Refresh sidebar folder tree only (no model data reload)
+            await this.refresh();
+
             if (draggedFromBulk && state.bulkMode && typeof bulkManager?.toggleBulkMode === 'function') {
                 bulkManager.toggleBulkMode();
             }
@@ -1040,7 +1136,15 @@ export class SidebarManager {
             <span class="sidebar-hidden-indicator-tooltip">${translate('sidebar.showSidebar')}</span>
         `;
 
+        // Subtle breathing animation on first sight to aid discoverability;
+        // stops permanently after user clicks the restore button once
+        const restoreKey = `${this.pageType}_restoreButtonUsed`;
+        if (!getStorageItem(restoreKey, false)) {
+            indicator.classList.add('breathing');
+        }
+
         indicator.addEventListener('click', () => {
+            setStorageItem(restoreKey, true);
             this.toggleHideOnThisPage();
         });
 
@@ -1338,7 +1442,7 @@ export class SidebarManager {
         this.pageControls.pageState.activeFolder = normalizedPath;
         setStorageItem(`${this.pageType}_activeFolder`, normalizedPath);
 
-        // Reload models with new filter
+        // Reload models with new filter (loadMoreWithVirtualScroll will scroll to top)
         await this.pageControls.resetAndReload();
     }
 

static/js/components/shared/ModelModal.js

@@ -234,6 +234,95 @@ function renderLicenseIcons(modelData) {
     </div>`;
 }
 
+// ── Set 2 (new CivitAI-style) permission icons ──
+
+const NEW_LICENSE_ICON_CONFIG = [
+    {
+        key: 'commercial',
+        icon: 'currency-dollar.svg',
+        allowedFn: (license) => {
+            const uses = license.allowCommercialUse || [];
+            return uses.includes('Image') || uses.includes('Sell');
+        },
+        labelAllowed: 'Commercial use allowed',
+        labelDenied: 'No commercial use'
+    },
+    {
+        key: 'genServices',
+        icon: 'brush.svg',
+        allowedFn: (license) => {
+            const uses = license.allowCommercialUse || [];
+            return uses.includes('RentCivit') || uses.includes('Rent');
+        },
+        labelAllowed: 'Generation services allowed',
+        labelDenied: 'No generation services'
+    },
+    {
+        key: 'credit',
+        icon: 'user.svg',
+        allowedFn: (license) => !!license.allowNoCredit,
+        labelAllowed: 'No credit required',
+        labelDenied: 'Creator credit required'
+    },
+    {
+        key: 'derivatives',
+        icon: 'git-merge.svg',
+        allowedFn: (license) => !!license.allowDerivatives,
+        labelAllowed: 'Merges allowed',
+        labelDenied: 'No merges allowed'
+    },
+    {
+        key: 'relicense',
+        icon: 'license.svg',
+        allowedFn: (license) => !!license.allowDifferentLicense,
+        labelAllowed: 'Different permissions allowed on merges',
+        labelDenied: 'Same permissions required on merges'
+    }
+];
+
+function createNewLicenseIconMarkup(icon, allowed, label) {
+    const safeLabel = escapeAttribute(label);
+    const iconPath = `/loras_static/images/tabler/${icon}`;
+    const stateClass = allowed ? 'allowed' : 'denied';
+    return `<span class="license-icon-new ${stateClass}" role="img" aria-label="${safeLabel}" title="${safeLabel}" style="--license-icon-image: url('${iconPath}')"></span>`;
+}
+
+function renderNewLicenseIcons(modelData) {
+    const license = modelData?.civitai?.model;
+    if (!license) {
+        return '';
+    }
+
+    const icons = [];
+    NEW_LICENSE_ICON_CONFIG.forEach((config) => {
+        if (config.key === 'credit' && !hasLicenseField(license, 'allowNoCredit')) {
+            return;
+        }
+        if (config.key === 'derivatives' && !hasLicenseField(license, 'allowDerivatives')) {
+            return;
+        }
+        if (config.key === 'relicense' && !hasLicenseField(license, 'allowDifferentLicense')) {
+            return;
+        }
+        if ((config.key === 'commercial' || config.key === 'genServices') && !hasLicenseField(license, 'allowCommercialUse')) {
+            return;
+        }
+        const allowed = config.allowedFn(license);
+        const label = allowed ? config.labelAllowed : config.labelDenied;
+        icons.push(createNewLicenseIconMarkup(config.icon, allowed, label));
+    });
+
+    if (!icons.length) {
+        return '';
+    }
+
+    const containerLabel = translate('modals.model.license.restrictionsLabel', {}, 'License permissions');
+    const safeContainerLabel = escapeAttribute(containerLabel);
+    return `<div class="license-permissions" aria-label="${safeContainerLabel}" role="group">
+        ${icons.join('\n        ')}
+    </div>`;
+}
+
 /**
  * Display the model modal with the given model data
  * @param {Object} model - Model data object
@@ -264,7 +353,10 @@ export async function showModelModal(model, modelType) {
     };
     const escapedFilePathAttr = escapeAttribute(modelWithFullData.file_path || '');
     const escapedFolderPath = escapeHtml((modelWithFullData.file_path || '').replace(/[^/]+$/, '') || 'N/A');
-    const licenseIcons = renderLicenseIcons(modelWithFullData);
+    const useNewIcons = state.global.settings.use_new_license_icons !== false;
+    const licenseIcons = useNewIcons
+        ? renderNewLicenseIcons(modelWithFullData)
+        : renderLicenseIcons(modelWithFullData);
     const viewOnCivitaiAction = modelWithFullData.from_civitai ? `
 <div class="civitai-view" title="${translate('modals.model.actions.viewOnCivitai', {}, 'View on Civitai')}" data-action="view-civitai" data-filepath="${escapedFilePathAttr}">
     <i class="fas fa-globe"></i> ${translate('modals.model.actions.viewOnCivitaiText', {}, 'View on Civitai')}

static/js/components/shared/ModelTags.js

@@ -29,6 +29,14 @@ let priorityTagSuggestionsLoaded = false;
 let priorityTagSuggestionsPromise = null;
 let activeTagDragState = null;
 
+// Configurable options for tag editing (set by setupTagEditMode)
+let tagEditOptions = {
+    showSuggestions: true,
+    saveHandler: null,
+    onSaved: null,
+    normalizeTag: true,
+};
+
 function normalizeModelTypeKey(modelType) {
     if (!modelType) {
         return '';
@@ -140,13 +148,30 @@ let saveTagsHandler = null;
 
 /**
  * Set up tag editing mode
+ * @param {string|null} modelType - Model type for suggestions (e.g. 'loras', 'checkpoints')
+ * @param {Object} [options] - Optional configuration
+ * @param {boolean} [options.showSuggestions=true] - Show priority tag suggestions dropdown
+ * @param {Function} [options.saveHandler] - Custom save function, async (filePath, tags) => {}
+ * @param {Function} [options.onSaved] - Called after successful save, (tags) => {}
+ * @param {boolean} [options.normalizeTag=true] - Lowercase tag on add
  */
-export function setupTagEditMode(modelType = null) {
-    const editBtn = document.querySelector('.edit-tags-btn');
+export function setupTagEditMode(modelType = null, options = {}) {
+    // Store options for use by saveTags and addNewTag
+    tagEditOptions = {
+        showSuggestions: options.showSuggestions !== false,
+        saveHandler: options.saveHandler || null,
+        onSaved: options.onSaved || null,
+        normalizeTag: options.normalizeTag !== false,
+    };
+
+    const root = options.container || document;
+    const editBtn = root.querySelector('.edit-tags-btn');
     if (!editBtn) return;
 
-    setActiveModelTypeKey(modelType);
-    ensurePriorityTagSuggestions();
+    if (tagEditOptions.showSuggestions) {
+        setActiveModelTypeKey(modelType);
+        ensurePriorityTagSuggestions();
+    }
     
     // Store original tags for restoring on cancel
     let originalTags = [];
@@ -158,7 +183,8 @@ export function setupTagEditMode(modelType = null) {
     
     // Create new handler and store reference
     const editBtnClickHandler = function() {
-        const tagsSection = document.querySelector('.model-tags-container');
+        const tagsSection = this.closest('.model-tags-container');
+        if (!tagsSection) return;
         const isEditMode = tagsSection.classList.toggle('edit-mode');
         const filePath = this.dataset.filePath;
         
@@ -193,16 +219,18 @@ export function setupTagEditMode(modelType = null) {
                 tagsSection.appendChild(editContainer);
                 
                 // Setup the tag input field behavior
-                setupTagInput();
+                setupTagInput(tagsSection);
                 
                 // Create and add preset suggestions dropdown
-                const tagForm = editContainer.querySelector('.metadata-add-form');
-                const suggestionsDropdown = createSuggestionsDropdown(originalTags);
-                tagForm.appendChild(suggestionsDropdown);
+                if (tagEditOptions.showSuggestions) {
+                    const tagForm = editContainer.querySelector('.metadata-add-form');
+                    const suggestionsDropdown = createSuggestionsDropdown(originalTags);
+                    tagForm.appendChild(suggestionsDropdown);
+                }
                 
                 // Setup delete buttons for existing tags
                 setupDeleteButtons();
-                setupTagDragAndDrop();
+                setupTagDragAndDrop(tagsSection);
                 
                 // Transfer click event from original button to the cloned one
                 const newEditBtn = editContainer.querySelector('.metadata-header-btn');
@@ -218,7 +246,7 @@ export function setupTagEditMode(modelType = null) {
                 // Just show the existing edit container
                 tagsEditContainer.style.display = 'block';
                 editBtn.style.display = 'none';
-                setupTagDragAndDrop();
+                setupTagDragAndDrop(tagsSection);
             }
         } else {
             // Exit edit mode
@@ -255,7 +283,7 @@ export function setupTagEditMode(modelType = null) {
     saveTagsHandler = function(e) {
         if (e.target.classList.contains('save-tags-btn') || 
             e.target.closest('.save-tags-btn')) {
-            saveTags();
+            saveTags(e.target);
         }
     };
     
@@ -267,19 +295,28 @@ export function setupTagEditMode(modelType = null) {
 
 /**
  * Save tags
+ * @param {Element} [triggerElement] - The element that triggered the save (e.g. save button)
  */
-async function saveTags() {
-    const editBtn = document.querySelector('.edit-tags-btn');
-    if (!editBtn) return;
+async function saveTags(triggerElement = null) {
+    let editBtn;
+    let scope;
+    if (triggerElement) {
+        scope = triggerElement.closest('.model-tags-container');
+        editBtn = scope ? scope.querySelector('.edit-tags-btn') : document.querySelector('.edit-tags-btn');
+    } else {
+        scope = document.querySelector('.model-tags-container');
+        editBtn = scope ? scope.querySelector('.edit-tags-btn') : null;
+    }
+    if (!editBtn || !scope) return;
     
     const filePath = editBtn.dataset.filePath;
-    const tagElements = document.querySelectorAll('.metadata-item');
+    const tagElements = scope.querySelectorAll('.metadata-item');
     let tags = Array.from(tagElements).map(tag => tag.dataset.tag);
     
     // Flush uncommitted input as a tag so it's not silently lost on save
-    const tagInput = document.querySelector('.metadata-input');
+    const tagInput = scope.querySelector('.metadata-input');
     if (tagInput) {
-        const pendingTag = tagInput.value.trim().toLowerCase();
+        const pendingTag = tagEditOptions.normalizeTag ? tagInput.value.trim().toLowerCase() : tagInput.value.trim();
         if (pendingTag && !tags.includes(pendingTag)) {
             tags.push(pendingTag);
         }
@@ -287,7 +324,7 @@ async function saveTags() {
     }
 
     // Get original tags to compare
-    const originalTagElements = document.querySelectorAll('.tooltip-tag');
+    const originalTagElements = scope.querySelectorAll('.tooltip-tag');
     const originalTags = Array.from(originalTagElements).map(tag => tag.textContent);
     
     // Check if tags have actually changed
@@ -301,59 +338,68 @@ async function saveTags() {
     }
     
     try {
-        // Save tags metadata
-        await getModelApiClient().saveModelMetadata(filePath, { tags: tags });
+        // Use custom save handler if provided, otherwise default model API
+        if (tagEditOptions.saveHandler) {
+            await tagEditOptions.saveHandler(filePath, tags);
+        } else {
+            await getModelApiClient().saveModelMetadata(filePath, { tags: tags });
+        }
         
         // Set flag to skip restoring original tags when exiting edit mode
         editBtn.dataset.skipRestore = "true";
         
-        // Update the compact tags display
-        const compactTagsContainer = document.querySelector('.model-tags-container');
-        if (compactTagsContainer) {
-            // Generate new compact tags HTML
-            const compactTagsDisplay = compactTagsContainer.querySelector('.model-tags-compact');
-            
-            if (compactTagsDisplay) {
-                // Clear current tags
-                compactTagsDisplay.innerHTML = '';
+        // Use custom onSaved if provided (e.g. for recipe dirty state + re-render)
+        if (tagEditOptions.onSaved) {
+            tagEditOptions.onSaved(tags);
+        } else {
+            // Update the compact tags display
+            const compactTagsContainer = scope;
+            if (compactTagsContainer) {
+                // Generate new compact tags HTML
+                const compactTagsDisplay = compactTagsContainer.querySelector('.model-tags-compact');
                 
-                // Add visible tags (up to 5)
-                const visibleTags = tags.slice(0, 5);
-                visibleTags.forEach(tag => {
-                    const span = document.createElement('span');
-                    span.className = 'model-tag-compact';
-                    span.textContent = tag;
-                    compactTagsDisplay.appendChild(span);
-                });
+                if (compactTagsDisplay) {
+                    // Clear current tags
+                    compactTagsDisplay.innerHTML = '';
+                    
+                    // Add visible tags (up to 5)
+                    const visibleTags = tags.slice(0, 5);
+                    visibleTags.forEach(tag => {
+                        const span = document.createElement('span');
+                        span.className = 'model-tag-compact';
+                        span.textContent = tag;
+                        compactTagsDisplay.appendChild(span);
+                    });
+                    
+                    // Add more indicator if needed
+                    const remainingCount = Math.max(0, tags.length - 5);
+                    if (remainingCount > 0) {
+                        const more = document.createElement('span');
+                        more.className = 'model-tag-more';
+                        more.dataset.count = remainingCount;
+                        more.textContent = `+${remainingCount}`;
+                        compactTagsDisplay.appendChild(more);
+                    }
+                }
                 
-                // Add more indicator if needed
-                const remainingCount = Math.max(0, tags.length - 5);
-                if (remainingCount > 0) {
-                    const more = document.createElement('span');
-                    more.className = 'model-tag-more';
-                    more.dataset.count = remainingCount;
-                    more.textContent = `+${remainingCount}`;
-                    compactTagsDisplay.appendChild(more);
+                // Update tooltip content
+                const tooltipContent = compactTagsContainer.querySelector('.tooltip-content');
+                if (tooltipContent) {
+                    tooltipContent.innerHTML = '';
+                    
+                    tags.forEach(tag => {
+                        const span = document.createElement('span');
+                        span.className = 'tooltip-tag';
+                        span.textContent = tag;
+                        tooltipContent.appendChild(span);
+                    });
                 }
             }
             
-            // Update tooltip content
-            const tooltipContent = compactTagsContainer.querySelector('.tooltip-content');
-            if (tooltipContent) {
-                tooltipContent.innerHTML = '';
-                
-                tags.forEach(tag => {
-                    const span = document.createElement('span');
-                    span.className = 'tooltip-tag';
-                    span.textContent = tag;
-                    tooltipContent.appendChild(span);
-                });
-            }
+            // Exit edit mode
+            editBtn.click();
         }
         
-        // Exit edit mode
-        editBtn.click();
-        
         showToast('modelTags.messages.updated', {}, 'success');
     } catch (error) {
         console.error('Error saving tags:', error);
@@ -470,16 +516,19 @@ function renderPriorityTagSuggestions(container, existingTags = []) {
 
 /**
  * Set up tag input behavior
+ * @param {Element} scopeContainer - The .model-tags-container element
  */
-function setupTagInput() {
-    const tagInput = document.querySelector('.metadata-input');
+function setupTagInput(scopeContainer) {
+    const tagInput = scopeContainer
+        ? scopeContainer.querySelector('.metadata-input')
+        : document.querySelector('.metadata-input');
     
     if (tagInput) {
         tagInput.focus();
         tagInput.addEventListener('keydown', function(e) {
             if (e.key === 'Enter') {
                 e.preventDefault();
-                addNewTag(this.value);
+                addNewTag(this.value, this);
                 this.value = ''; // Clear input after adding
             }
         });
@@ -504,9 +553,12 @@ function setupDeleteButtons() {
 
 /**
  * Enable drag-and-drop sorting for tag items
+ * @param {Element} [scopeContainer] - Optional scoped .model-tags-container element
  */
-function setupTagDragAndDrop() {
-    const container = document.querySelector(METADATA_ITEMS_CONTAINER_SELECTOR);
+function setupTagDragAndDrop(scopeContainer) {
+    const container = scopeContainer
+        ? scopeContainer.querySelector(METADATA_ITEMS_CONTAINER_SELECTOR)
+        : document.querySelector(METADATA_ITEMS_CONTAINER_SELECTOR);
     if (!container) {
         return;
     }
@@ -712,12 +764,14 @@ function finishPointerDrag() {
 /**
  * Add a new tag
  * @param {string} tag - Tag to add
+ * @param {Element} [scopeElement] - Element within the correct .model-tags-container for scoping
  */
-function addNewTag(tag) {
-    tag = tag.trim().toLowerCase();
+function addNewTag(tag, scopeElement = null) {
+    tag = tagEditOptions.normalizeTag ? tag.trim().toLowerCase() : tag.trim();
     if (!tag) return;
     
-    const tagsContainer = document.querySelector('.metadata-items');
+    const scope = scopeElement ? scopeElement.closest('.model-tags-container') : document;
+    const tagsContainer = scope.querySelector('.metadata-items');
     if (!tagsContainer) return;
     
     // Validation: Check length
@@ -762,7 +816,7 @@ function addNewTag(tag) {
     });
     
     tagsContainer.appendChild(newTag);
-    setupTagDragAndDrop();
+    setupTagDragAndDrop(scope);
     
     // Update status of items in the suggestions dropdown
     updateSuggestionsDropdown();

static/js/components/shared/utils.js

@@ -78,10 +78,12 @@ export function renderCompactTags(tags, filePath = '') {
 
 /**
  * Set up tag tooltip functionality
+ * @param {Element} [scopeContainer] - Optional container to scope the querySelector
  */
-export function setupTagTooltip() {
-    const tagsContainer = document.querySelector('.model-tags-container');
-    const tooltip = document.querySelector('.model-tags-tooltip');
+export function setupTagTooltip(scopeContainer = null) {
+    const root = scopeContainer || document;
+    const tagsContainer = root.querySelector('.model-tags-container');
+    const tooltip = root.querySelector('.model-tags-tooltip');
     
     if (tagsContainer && tooltip) {
         tagsContainer.addEventListener('mouseenter', () => {

static/js/managers/DoctorManager.js

@@ -327,10 +327,15 @@ export class DoctorManager {
             case 'open-settings':
                 modalManager.showModal('settingsModal');
                 window.setTimeout(() => {
-                    const input = document.getElementById('civitaiApiKey');
-                    if (input) {
-                        input.focus();
-                        input.scrollIntoView({ behavior: 'smooth', block: 'center' });
+                    // Open the API key editor directly
+                    if (typeof settingsManager.editApiKey === 'function') {
+                        settingsManager.editApiKey();
+                    } else {
+                        const input = document.getElementById('civitaiApiKey');
+                        if (input) {
+                            input.focus();
+                            input.scrollIntoView({ behavior: 'smooth', block: 'center' });
+                        }
                     }
                 }, 100);
                 break;

static/js/managers/MoveManager.js

@@ -321,29 +321,94 @@ class MoveManager {
         }
 
         try {
+            let movedFiles = []; // Array of { original_file_path, new_file_path }
+
             if (this.bulkFilePaths) {
                 // Bulk move mode
-                await apiClient.moveBulkModels(this.bulkFilePaths, targetPath, this.useDefaultPath);
-                
+                const results = await apiClient.moveBulkModels(this.bulkFilePaths, targetPath, this.useDefaultPath);
+                movedFiles = (results || [])
+                    .filter(r => r.success)
+                    .map(r => ({ original_file_path: r.original_file_path, new_file_path: r.new_file_path }));
+
                 // Deselect moving items
                 this.bulkFilePaths.forEach(path => bulkManager.deselectItem(path));
             } else {
                 // Single move mode
-                await apiClient.moveSingleModel(this.currentFilePath, targetPath, this.useDefaultPath);
-                
+                const result = await apiClient.moveSingleModel(this.currentFilePath, targetPath, this.useDefaultPath);
+                if (result) {
+                    movedFiles.push({
+                        original_file_path: result.original_file_path || this.currentFilePath,
+                        new_file_path: result.new_file_path
+                    });
+                }
+
                 // Deselect moving item
                 bulkManager.deselectItem(this.currentFilePath);
             }
 
-            // Refresh UI by reloading the current page, same as drag-and-drop behavior
-            // This ensures all metadata (like preview URLs) are correctly formatted by the backend
-            if (sidebarManager.pageControls && typeof sidebarManager.pageControls.resetAndReload === 'function') {
-                await sidebarManager.pageControls.resetAndReload(true);
-            } else if (sidebarManager.lastPageControls && typeof sidebarManager.lastPageControls.resetAndReload === 'function') {
-                await sidebarManager.lastPageControls.resetAndReload(true);
+            // Update VirtualScroller in-place instead of full reload
+            if (movedFiles.length > 0 && state.virtualScroller) {
+                // Get current page state for folder filter check
+                const pageState = getCurrentPageState();
+                const normalizedActive = (pageState.activeFolder || '').replace(/\\/g, '/').replace(/\/$/, '');
+                const isRecursive = pageState.searchOptions?.recursive ?? true;
+                const isFolderFiltered = pageState.activeFolder !== null;
+
+                // Determine which items are still visible after the move
+                const pathsToRemove = [];
+                const pathsToUpdate = []; // { originalPath, newData }
+
+                for (const moved of movedFiles) {
+                    if (!moved.original_file_path) continue;
+
+                    if (isFolderFiltered) {
+                        // Compute relative folder of the new path
+                        const newRelativeFolder = this._getRelativeFolder(moved.new_file_path);
+                        const normalizedNewFolder = newRelativeFolder.replace(/\\/g, '/').replace(/\/$/, '');
+
+                        // Check if the new location is still within the active folder
+                        let stillVisible;
+                        if (isRecursive) {
+                            stillVisible = normalizedActive === '' ||
+                                normalizedNewFolder === normalizedActive ||
+                                normalizedNewFolder.startsWith(normalizedActive + '/');
+                        } else {
+                            stillVisible = normalizedNewFolder === normalizedActive;
+                        }
+
+                        if (stillVisible) {
+                            pathsToUpdate.push({
+                                originalPath: moved.original_file_path,
+                                newData: {
+                                    file_path: moved.new_file_path,
+                                    folder: newRelativeFolder
+                                }
+                            });
+                        } else {
+                            pathsToRemove.push(moved.original_file_path);
+                        }
+                    } else {
+                        // No folder filter active — items remain visible, just update path
+                        pathsToUpdate.push({
+                            originalPath: moved.original_file_path,
+                            newData: {
+                                file_path: moved.new_file_path,
+                                folder: this._getRelativeFolder(moved.new_file_path)
+                            }
+                        });
+                    }
+                }
+
+                // Apply updates to the VirtualScroller
+                if (pathsToRemove.length > 0) {
+                    state.virtualScroller.removeMultipleItemsByFilePath(pathsToRemove);
+                }
+                for (const update of pathsToUpdate) {
+                    state.virtualScroller.updateSingleItem(update.originalPath, update.newData);
+                }
             }
 
-            // Refresh folder tree in sidebar
+            // Refresh folder tree in sidebar (no model data reload)
             await sidebarManager.refresh();
 
             modalManager.closeModal('moveModal');

static/js/managers/SettingsManager.js

@@ -344,9 +344,14 @@ export class SettingsManager {
                     if (mutation.type === 'attributes' && mutation.attributeName === 'style') {
                         this.isOpen = settingsModal.style.display === 'block';
 
-                        // When modal is opened, update checkbox state from current settings
                         if (this.isOpen) {
                             this.loadSettingsToUI();
+                        } else {
+                            // Reset API key edit mode on close
+                            this.cancelEditApiKey(true);
+                            // Clear proxy password on close
+                            const proxyPasswordInput = document.getElementById('proxyPassword');
+                            if (proxyPasswordInput) proxyPasswordInput.value = '';
                         }
                     }
                 });
@@ -820,6 +825,9 @@ export class SettingsManager {
             usePortableCheckbox.checked = !!state.global.settings.use_portable_settings;
         }
 
+        // Update API key status display (do NOT pre-fill the input)
+        this.updateApiKeyStatus();
+
         const civitaiHostSelect = document.getElementById('civitaiHost');
         if (civitaiHostSelect) {
             civitaiHostSelect.value = state.global.settings.civitai_host || 'civitai.com';
@@ -1003,6 +1011,12 @@ export class SettingsManager {
 
         this.loadDownloadBackendSettings();
         this.loadProxySettings();
+
+        // Set license icon style
+        const useNewLicenseIconsCheckbox = document.getElementById('useNewLicenseIcons');
+        if (useNewLicenseIconsCheckbox) {
+            useNewLicenseIconsCheckbox.checked = state.global.settings.use_new_license_icons !== false;
+        }
     }
 
     loadDownloadBackendSettings() {
@@ -2882,16 +2896,97 @@ export class SettingsManager {
         }
     }
 
+    // ── CivitAI API Key management ──────────────────────────────
+
+    updateApiKeyStatus() {
+        const hasKey = !!(state.global.settings.civitai_api_key_set ||
+                          state.global.settings.civitai_api_key);
+        const statusEl = document.getElementById('civitaiApiKeyStatus');
+        const statusText = document.getElementById('civitaiApiKeyStatusText');
+        const actionBtn = document.getElementById('civitaiApiKeyActionBtn');
+        if (!statusText || !actionBtn) return;
+
+        if (hasKey) {
+            statusText.classList.remove('api-key-status--unconfigured');
+            statusText.classList.add('api-key-status--configured');
+            statusText.innerHTML = '<i class="fas fa-check-circle text-success"></i> '
+                + translate('settings.civitaiApiKeyConfigured', {}, 'Configured');
+            actionBtn.textContent = translate('common.actions.change', {}, 'Change');
+        } else {
+            statusText.classList.remove('api-key-status--configured');
+            statusText.classList.add('api-key-status--unconfigured');
+            statusText.innerHTML = '<i class="fas fa-times-circle text-error"></i> '
+                + translate('settings.civitaiApiKeyNotConfigured', {}, 'Not configured');
+            actionBtn.textContent = translate('settings.civitaiApiKeySet', {}, 'Set up');
+        }
+    }
+
+    editApiKey() {
+        const statusEl = document.getElementById('civitaiApiKeyStatus');
+        if (statusEl) statusEl.classList.add('is-hidden');
+        const editContainer = document.getElementById('civitaiApiKeyEdit');
+        if (editContainer) editContainer.classList.remove('is-hidden');
+        // Focus the input
+        const input = document.getElementById('civitaiApiKey');
+        if (input) {
+            input.value = '';  // Never pre-fill the secret
+            setTimeout(() => input.focus(), 50);
+        }
+    }
+
+    cancelEditApiKey(silent) {
+        const editContainer = document.getElementById('civitaiApiKeyEdit');
+        if (editContainer) editContainer.classList.add('is-hidden');
+        const statusContainer = document.getElementById('civitaiApiKeyStatus');
+        if (statusContainer) statusContainer.classList.remove('is-hidden');
+        // Clear any typed value
+        const input = document.getElementById('civitaiApiKey');
+        if (input) input.value = '';
+        if (!silent) {
+            this.updateApiKeyStatus();
+        }
+    }
+
+    async saveApiKey() {
+        const input = document.getElementById('civitaiApiKey');
+        if (!input) return;
+
+        const value = input.value.trim();
+
+        try {
+            await this.saveSetting('civitai_api_key', value);
+            showToast('toast.settings.settingsUpdated',
+                { setting: 'CivitAI API Key' }, 'success');
+        } catch (error) {
+            showToast('toast.settings.settingSaveFailed',
+                { message: error.message }, 'error');
+            return;
+        }
+
+        // Update the in-memory flag so the UI reflects the change
+        state.global.settings.civitai_api_key_set = !!value;
+        this.cancelEditApiKey(true);
+        this.updateApiKeyStatus();
+    }
+
     toggleInputVisibility(button) {
         const input = button.parentElement.querySelector('input');
+        if (!input) return;
         const icon = button.querySelector('i');
-
-        if (input.type === 'password') {
+        if (input.dataset.mask === 'css') {
+            // CSS-masked input (CivitAI API key) — toggle class, not type
+            input.classList.toggle('api-key-masked');
+            if (icon) {
+                icon.className = input.classList.contains('api-key-masked')
+                    ? 'fas fa-eye'
+                    : 'fas fa-eye-slash';
+            }
+        } else if (input.type === 'password') {
             input.type = 'text';
-            icon.className = 'fas fa-eye-slash';
+            if (icon) icon.className = 'fas fa-eye-slash';
         } else {
             input.type = 'password';
-            icon.className = 'fas fa-eye';
+            if (icon) icon.className = 'fas fa-eye';
         }
     }
 
@@ -2947,6 +3042,10 @@ export class SettingsManager {
         const showVersionOnCard = state.global.settings.show_version_on_card !== false;
         document.body.classList.toggle('hide-card-version', !showVersionOnCard);
 
+        // Apply license icon style
+        const useNewLicenseIcons = state.global.settings.use_new_license_icons !== false;
+        document.body.classList.toggle('use-new-license-icons', useNewLicenseIcons);
+
     }
 }
 

static/js/state/index.js

@@ -5,6 +5,7 @@ import { DEFAULT_PATH_TEMPLATES, DEFAULT_PRIORITY_TAG_CONFIG } from '../utils/co
 
 const DEFAULT_SETTINGS_BASE = Object.freeze({
     civitai_api_key: '',
+    civitai_api_key_set: false,
     civitai_host: 'civitai.com',
     download_backend: 'python',
     aria2c_path: '',
@@ -52,6 +53,7 @@ const DEFAULT_SETTINGS_BASE = Object.freeze({
     backup_auto_enabled: true,
     backup_retention_count: 5,
     strip_lora_on_copy: false,
+    use_new_license_icons: true,
 });
 
 export function createDefaultSettings() {

static/js/statistics.js

@@ -1,6 +1,8 @@
 // Statistics page functionality
 import { appCore } from './core.js';
 import { showToast } from './utils/uiHelpers.js';
+import { translate } from './utils/i18nHelpers.js';
+import { i18n } from './i18n/index.js';
 
 // Chart.js import (assuming it's available globally or via CDN)
 // If Chart.js isn't available, we'll need to add it to the project
@@ -124,43 +126,43 @@ export class StatisticsManager {
             {
                 icon: 'fas fa-magic',
                 value: this.data.collection.total_models,
-                label: 'Total Models',
+                label: translate('statistics.metrics.totalModels'),
                 format: 'number'
             },
             {
                 icon: 'fas fa-database',
                 value: this.data.collection.total_size,
-                label: 'Total Storage',
+                label: translate('statistics.metrics.totalStorage'),
                 format: 'size'
             },
             {
                 icon: 'fas fa-play-circle',
                 value: this.data.collection.total_generations,
-                label: 'Total Generations',
+                label: translate('statistics.metrics.totalGenerations'),
                 format: 'number'
             },
             {
                 icon: 'fas fa-chart-line',
                 value: this.calculateUsageRate(),
-                label: 'Usage Rate',
+                label: translate('statistics.metrics.usageRate'),
                 format: 'percentage'
             },
             {
                 icon: 'fas fa-layer-group',
                 value: this.data.collection.lora_count,
-                label: 'LoRAs',
+                label: translate('statistics.metrics.loras'),
                 format: 'number'
             },
             {
                 icon: 'fas fa-check-circle',
                 value: this.data.collection.checkpoint_count,
-                label: 'Checkpoints',
+                label: translate('statistics.metrics.checkpoints'),
                 format: 'number'
             },
             {
                 icon: 'fas fa-code',
                 value: this.data.collection.embedding_count,
-                label: 'Embeddings',
+                label: translate('statistics.metrics.embeddings'),
                 format: 'number'
             }
         ];
@@ -189,18 +191,14 @@ export class StatisticsManager {
             case 'size':
                 return this.formatFileSize(value);
             case 'percentage':
-                return `${value.toFixed(1)}%`;
+                return new Intl.NumberFormat(i18n.getCurrentLocale(), { style: 'percent', maximumFractionDigits: 1 }).format(value / 100);
             default:
                 return value;
         }
     }
 
     formatFileSize(bytes) {
-        if (bytes === 0) return '0 Bytes';
-        const k = 1024;
-        const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
-        const i = Math.floor(Math.log(bytes) / Math.log(k));
-        return parseFloat((bytes / Math.pow(k, i)).toFixed(1)) + ' ' + sizes[i];
+        return i18n.formatFileSize(bytes);
     }
 
     calculateUsageRate() {
@@ -240,6 +238,9 @@ export class StatisticsManager {
         
         // Storage efficiency chart
         this.createStorageEfficiencyChart();
+        
+        // Model types chart (Collection tab)
+        this.createModelTypesChart();
     }
 
     createCollectionPieChart() {
@@ -247,7 +248,7 @@ export class StatisticsManager {
         if (!ctx || !this.data.collection) return;
 
         const data = {
-            labels: ['LoRAs', 'Checkpoints', 'Embeddings'],
+            labels: [translate('statistics.metrics.loras'), translate('statistics.metrics.checkpoints'), translate('statistics.metrics.embeddings')],
             datasets: [{
                 data: [
                     this.data.collection.lora_count, 
@@ -287,28 +288,28 @@ export class StatisticsManager {
         const checkpointData = this.data.baseModels.checkpoints;
         const embeddingData = this.data.baseModels.embeddings;
         
-        const allModels = new Set([
+        const allModels = Array.from(new Set([
             ...Object.keys(loraData), 
             ...Object.keys(checkpointData),
             ...Object.keys(embeddingData)
-        ]);
+        ])).sort();
         
         const data = {
-            labels: Array.from(allModels),
+            labels: allModels,
             datasets: [
                 {
-                    label: 'LoRAs',
-                    data: Array.from(allModels).map(model => loraData[model] || 0),
+                    label: translate('statistics.metrics.loras'),
+                    data: allModels.map(model => loraData[model] || 0),
                     backgroundColor: 'oklch(68% 0.28 256 / 0.7)'
                 },
                 {
-                    label: 'Checkpoints',
-                    data: Array.from(allModels).map(model => checkpointData[model] || 0),
+                    label: translate('statistics.metrics.checkpoints'),
+                    data: allModels.map(model => checkpointData[model] || 0),
                     backgroundColor: 'oklch(68% 0.28 200 / 0.7)'
                 },
                 {
-                    label: 'Embeddings',
-                    data: Array.from(allModels).map(model => embeddingData[model] || 0),
+                    label: translate('statistics.metrics.embeddings'),
+                    data: allModels.map(model => embeddingData[model] || 0),
                     backgroundColor: 'oklch(68% 0.28 120 / 0.7)'
                 }
             ]
@@ -342,21 +343,21 @@ export class StatisticsManager {
             labels: timeline.map(item => new Date(item.date).toLocaleDateString()),
             datasets: [
                 {
-                    label: 'LoRA Usage',
+                    label: translate('statistics.charts.loraUsage'),
                     data: timeline.map(item => item.lora_usage),
                     borderColor: 'oklch(68% 0.28 256)',
                     backgroundColor: 'oklch(68% 0.28 256 / 0.1)',
                     fill: true
                 },
                 {
-                    label: 'Checkpoint Usage',
+                    label: translate('statistics.charts.checkpointUsage'),
                     data: timeline.map(item => item.checkpoint_usage),
                     borderColor: 'oklch(68% 0.28 200)',
                     backgroundColor: 'oklch(68% 0.28 200 / 0.1)',
                     fill: true
                 },
                 {
-                    label: 'Embedding Usage',
+                    label: translate('statistics.charts.embeddingUsage'),
                     data: timeline.map(item => item.embedding_usage),
                     borderColor: 'oklch(68% 0.28 120)',
                     backgroundColor: 'oklch(68% 0.28 120 / 0.1)',
@@ -380,14 +381,14 @@ export class StatisticsManager {
                         display: true,
                         title: {
                             display: true,
-                            text: 'Date'
+                            text: translate('statistics.charts.date')
                         }
                     },
                     y: {
                         display: true,
                         title: {
                             display: true,
-                            text: 'Usage Count'
+                            text: translate('statistics.charts.usageCount')
                         }
                     }
                 }
@@ -413,7 +414,7 @@ export class StatisticsManager {
         const data = {
             labels: allModels.map(model => model.name),
             datasets: [{
-                label: 'Usage Count',
+                label: translate('statistics.charts.usageCount'),
                 data: allModels.map(model => model.usage_count),
                 backgroundColor: allModels.map(model => {
                     switch(model.type) {
@@ -447,7 +448,7 @@ export class StatisticsManager {
         if (!ctx || !this.data.collection) return;
 
         const data = {
-            labels: ['LoRAs', 'Checkpoints', 'Embeddings'],
+            labels: [translate('statistics.metrics.loras'), translate('statistics.metrics.checkpoints'), translate('statistics.metrics.embeddings')],
             datasets: [{
                 data: [
                     this.data.collection.lora_size, 
@@ -501,7 +502,7 @@ export class StatisticsManager {
 
         const data = {
             datasets: [{
-                label: 'Models',
+                label: translate('statistics.charts.models'),
                 data: allData.map(item => ({
                     x: item.size,
                     y: item.usage_count,
@@ -529,14 +530,14 @@ export class StatisticsManager {
                     x: {
                         title: {
                             display: true,
-                            text: 'File Size (bytes)'
+                            text: translate('statistics.charts.fileSizeBytes')
                         },
                         type: 'logarithmic'
                     },
                     y: {
                         title: {
                             display: true,
-                            text: 'Usage Count'
+                            text: translate('statistics.charts.usageCount')
                         }
                     }
                 },
@@ -545,7 +546,69 @@ export class StatisticsManager {
                         callbacks: {
                             label: (context) => {
                                 const point = context.raw;
-                                return `${point.name}: ${this.formatFileSize(point.x)}, ${point.y} uses`;
+                                return translate('statistics.tooltips.chartUsage', { name: point.name, size: this.formatFileSize(point.x), count: point.y });
+                            }
+                        }
+                    }
+                }
+            }
+        });
+    }
+
+    createModelTypesChart() {
+        const ctx = document.getElementById('modelTypesChart');
+        if (!ctx || !this.data.collection || !this.data.collection.model_types_distribution) return;
+
+        const distribution = this.data.collection.model_types_distribution;
+        const typeDisplayNames = {
+            lora: translate('statistics.modelTypes.lora'),
+            locon: translate('statistics.modelTypes.locon'),
+            dora: translate('statistics.modelTypes.dora'),
+            checkpoint: translate('statistics.modelTypes.checkpoint'),
+            diffusion_model: translate('statistics.modelTypes.diffusion_model'),
+            embedding: translate('statistics.modelTypes.embedding')
+        };
+
+        const colorPalette = {
+            lora: 'oklch(68% 0.28 256)',
+            locon: 'oklch(68% 0.25 190)',
+            dora: 'oklch(68% 0.25 330)',
+            checkpoint: 'oklch(68% 0.28 45)',
+            diffusion_model: 'oklch(68% 0.25 280)',
+            embedding: 'oklch(68% 0.25 120)'
+        };
+
+        const labels = Object.keys(distribution).map(k => typeDisplayNames[k] || k);
+        const values = Object.values(distribution);
+        const colors = Object.keys(distribution).map(k => colorPalette[k] || 'oklch(68% 0.15 0)');
+
+        const data = {
+            labels: labels,
+            datasets: [{
+                data: values,
+                backgroundColor: colors,
+                borderColor: getComputedStyle(document.documentElement).getPropertyValue('--border-color'),
+                borderWidth: 2
+            }]
+        };
+
+        this.charts.modelTypes = new Chart(ctx, {
+            type: 'doughnut',
+            data: data,
+            options: {
+                responsive: true,
+                maintainAspectRatio: false,
+                plugins: {
+                    legend: {
+                        position: 'bottom'
+                    },
+                    tooltip: {
+                        callbacks: {
+                            label: (context) => {
+                                const total = context.dataset.data.reduce((a, b) => a + b, 0);
+                                const value = context.parsed;
+                                const pct = ((value / total) * 100).toFixed(1);
+                                return translate('statistics.tooltips.chartPercentage', { label: context.label, value, pct });
                             }
                         }
                     }
@@ -589,7 +652,7 @@ export class StatisticsManager {
         
         // Show loading indicator on initial load
         if (state.offset === 0) {
-            container.innerHTML = '<div class="loading-placeholder"><i class="fas fa-spinner fa-spin"></i> Loading...</div>';
+            container.innerHTML = '<div class="loading-placeholder"><i class="fas fa-spinner fa-spin"></i> ' + translate('statistics.placeholders.loading') + '</div>';
         }
 
         try {
@@ -605,7 +668,7 @@ export class StatisticsManager {
                 }
 
                 if (items.length === 0 && state.offset === 0) {
-                    container.innerHTML = '<div class="loading-placeholder">No models found</div>';
+                    container.innerHTML = '<div class="loading-placeholder">' + translate('statistics.placeholders.noModels') + '</div>';
                     state.hasMore = false;
                 } else if (items.length < state.limit) {
                     state.hasMore = false;
@@ -618,7 +681,7 @@ export class StatisticsManager {
                              onerror="this.src='/loras_static/images/no-preview.png'">
                         <div class="model-info">
                             <div class="model-name" title="${model.name}">${model.name}</div>
-                            <div class="model-meta">${model.base_model} • ${model.folder || 'Root'}</div>
+                            <div class="model-meta">${model.base_model} • ${model.folder || translate('statistics.placeholders.rootFolder')}</div>
                         </div>
                         <div class="model-usage">${model.usage_count}</div>
                     </div>
@@ -630,7 +693,7 @@ export class StatisticsManager {
         } catch (error) {
             console.error(`Error loading ${type} list:`, error);
             if (state.offset === 0) {
-                container.innerHTML = '<div class="loading-placeholder">Error loading data</div>';
+                container.innerHTML = '<div class="loading-placeholder">' + translate('statistics.placeholders.errorLoading') + '</div>';
             }
         } finally {
             state.isLoading = false;
@@ -653,7 +716,7 @@ export class StatisticsManager {
         ].sort((a, b) => b.size - a.size).slice(0, 10);
 
         if (allModels.length === 0) {
-            container.innerHTML = '<div class="loading-placeholder">No storage data available</div>';
+            container.innerHTML = '<div class="loading-placeholder">' + translate('statistics.placeholders.noStorageData') + '</div>';
             return;
         }
 
@@ -661,7 +724,7 @@ export class StatisticsManager {
             <div class="model-item">
                 <div class="model-info">
                     <div class="model-name" title="${model.name}">${model.name}</div>
-                    <div class="model-meta">${model.type} • ${model.base_model}</div>
+                    <div class="model-meta">${translate('statistics.modelTypes.' + model.type.toLowerCase())} • ${model.base_model}</div>
                 </div>
                 <div class="model-usage">${this.formatFileSize(model.size)}</div>
             </div>
@@ -679,7 +742,7 @@ export class StatisticsManager {
             const size = Math.ceil((tagData.count / maxCount) * 5);
             return `
                 <span class="tag-cloud-item size-${size}" 
-                      title="${tagData.tag}: ${tagData.count} models">
+                      title="${translate('statistics.tooltips.tagCount', { tag: tagData.tag, count: tagData.count })}">
                     ${tagData.tag}
                 </span>
             `;
@@ -693,17 +756,30 @@ export class StatisticsManager {
         const insights = this.data.insights.insights;
         
         if (insights.length === 0) {
-            container.innerHTML = '<div class="loading-placeholder">No insights available</div>';
+            container.innerHTML = '<div class="loading-placeholder">' + translate('statistics.insights.noInsights') + '</div>';
             return;
         }
 
-        container.innerHTML = insights.map(insight => `
+        container.innerHTML = insights.map(insight => {
+            const params = insight.params || {};
+            let title, description, suggestion;
+            if (insight.key) {
+                title = translate('statistics.' + insight.key + '.title', params);
+                description = translate('statistics.' + insight.key + '.description', params);
+                suggestion = translate('statistics.' + insight.key + '.suggestion', params);
+            } else {
+                // Backward compatibility for insights without key/params
+                title = insight.title || '';
+                description = insight.description || '';
+                suggestion = insight.suggestion || '';
+            }
+            return `
             <div class="insight-card type-${insight.type}">
-                <div class="insight-title">${insight.title}</div>
-                <div class="insight-description">${insight.description}</div>
-                <div class="insight-suggestion">${insight.suggestion}</div>
+                <div class="insight-title">${title}</div>
+                <div class="insight-description">${description}</div>
+                <div class="insight-suggestion">${suggestion}</div>
             </div>
-        `).join('');
+        `}).join('');
 
         // Render collection analysis cards
         this.renderCollectionAnalysis();
@@ -717,25 +793,25 @@ export class StatisticsManager {
             {
                 icon: 'fas fa-percentage',
                 value: this.calculateUsageRate(),
-                label: 'Usage Rate',
+                label: translate('statistics.metrics.usageRate'),
                 format: 'percentage'
             },
             {
                 icon: 'fas fa-tags',
                 value: this.data.tags?.total_unique_tags || 0,
-                label: 'Unique Tags',
+                label: translate('statistics.metrics.uniqueTags'),
                 format: 'number'
             },
             {
                 icon: 'fas fa-clock',
                 value: this.data.collection.unused_loras + this.data.collection.unused_checkpoints,
-                label: 'Unused Models',
+                label: translate('statistics.metrics.unusedModels'),
                 format: 'number'
             },
             {
                 icon: 'fas fa-chart-line',
                 value: this.calculateAverageUsage(),
-                label: 'Avg. Uses/Model',
+                label: translate('statistics.metrics.avgUsesPerModel'),
                 format: 'decimal'
             }
         ];
@@ -764,7 +840,7 @@ export class StatisticsManager {
         const chartCanvases = document.querySelectorAll('canvas');
         chartCanvases.forEach(canvas => {
             const container = canvas.parentElement;
-            container.innerHTML = '<div class="loading-placeholder"><i class="fas fa-chart-bar"></i> Chart requires Chart.js library</div>';
+            container.innerHTML = '<div class="loading-placeholder"><i class="fas fa-chart-bar"></i> ' + translate('statistics.placeholders.chartLibraryMissing') + '</div>';
         });
     }
 

static/js/utils/VirtualScroller.js

@@ -931,6 +931,38 @@ export class VirtualScroller {
         return true;
     }
 
+    /**
+     * Remove multiple items by their file paths.
+     * More efficient than calling removeItemByFilePath individually.
+     * @param {string[]} filePaths - Array of file paths to remove
+     * @returns {boolean} - True if any items were removed
+     */
+    removeMultipleItemsByFilePath(filePaths) {
+        if (!Array.isArray(filePaths) || filePaths.length === 0 || this.disabled || this.items.length === 0) return false;
+
+        // Build a set for fast lookup
+        const pathsToRemove = new Set(filePaths);
+        const originalLength = this.items.length;
+
+        // Filter out removed items; keep those not in the set
+        this.items = this.items.filter(item => !pathsToRemove.has(item.file_path));
+
+        const removedCount = originalLength - this.items.length;
+        if (removedCount === 0) return false;
+
+        this.totalItems = Math.max(0, this.totalItems - removedCount);
+
+        // Update the spacer height
+        this.updateSpacerHeight();
+
+        // Re-render to fill gaps left by removed items
+        this.clearRenderedItems();
+        this.scheduleRender();
+
+        console.log(`Removed ${removedCount} items from virtual scroller data`);
+        return true;
+    }
+
     // Add keyboard navigation methods
     handlePageUpDown(direction) {
         // Prevent duplicate animations by checking last trigger time

static/js/utils/uiHelpers.js

@@ -197,11 +197,22 @@ export function restoreFolderFilter() {
   }
 }
 
+const CYCLE_ORDER = ['auto', 'light', 'dark'];
+const PRESET_NAMES = ['default', 'nord', 'midnight', 'monokai', 'dracula', 'solarized'];
+
+export { CYCLE_ORDER, PRESET_NAMES };
+
 export function initTheme() {
   const savedTheme = getStorageItem('theme') || 'auto';
+  // Migrate deprecated presets
+  let savedPreset = getStorageItem('theme_preset');
+  if (savedPreset === 'gruvbox') {
+    savedPreset = 'midnight';
+    setStorageItem('theme_preset', 'midnight');
+  }
   applyTheme(savedTheme);
+  applyPreset(savedPreset || 'default');
 
-  // Update theme when system preference changes (for 'auto' mode)
   window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
     const currentTheme = getStorageItem('theme') || 'auto';
     if (currentTheme === 'auto') {
@@ -212,34 +223,44 @@ export function initTheme() {
 
 export function toggleTheme() {
   const currentTheme = getStorageItem('theme') || 'auto';
-  let newTheme;
-
-  if (currentTheme === 'light') {
-    newTheme = 'dark';
-  } else {
-    newTheme = 'light';
-  }
+  const currentIndex = CYCLE_ORDER.indexOf(currentTheme);
+  const nextIndex = (currentIndex + 1) % CYCLE_ORDER.length;
+  const newTheme = CYCLE_ORDER[nextIndex];
 
   setStorageItem('theme', newTheme);
   applyTheme(newTheme);
 
-  // Force a repaint to ensure theme changes are applied immediately
   document.body.style.display = 'none';
-  document.body.offsetHeight; // Trigger a reflow
+  document.body.offsetHeight;
   document.body.style.display = '';
 
   return newTheme;
 }
 
-// Add a new helper function to apply the theme
+export function cyclePreset() {
+  const currentPreset = getStorageItem('theme_preset') || 'default';
+  const currentIndex = PRESET_NAMES.indexOf(currentPreset);
+  const nextIndex = (currentIndex + 1) % PRESET_NAMES.length;
+  const newPreset = PRESET_NAMES[nextIndex];
+
+  setStorageItem('theme_preset', newPreset);
+  applyPreset(newPreset);
+
+  return newPreset;
+}
+
+export function setPreset(name) {
+  if (!PRESET_NAMES.includes(name)) return;
+  setStorageItem('theme_preset', name);
+  applyPreset(name);
+}
+
 function applyTheme(theme) {
   const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
   const htmlElement = document.documentElement;
 
-  // Remove any existing theme attributes
   htmlElement.removeAttribute('data-theme');
 
-  // Apply the appropriate theme
   if (theme === 'dark' || (theme === 'auto' && prefersDark)) {
     htmlElement.setAttribute('data-theme', 'dark');
     document.body.dataset.theme = 'dark';
@@ -248,19 +269,18 @@ function applyTheme(theme) {
     document.body.dataset.theme = 'light';
   }
 
-  // Update the theme-toggle icon state
   updateThemeToggleIcons(theme);
 }
 
-// New function to update theme toggle icons
+function applyPreset(preset) {
+  document.documentElement.setAttribute('data-theme-preset', preset);
+}
+
 function updateThemeToggleIcons(theme) {
   const themeToggle = document.querySelector('.theme-toggle');
   if (!themeToggle) return;
 
-  // Remove any existing active classes
   themeToggle.classList.remove('theme-light', 'theme-dark', 'theme-auto');
-
-  // Add the appropriate class based on current theme
   themeToggle.classList.add(`theme-${theme}`);
 }
 

templates/base.html

@@ -46,16 +46,20 @@
     </script>
     <script>
       (function() {
-        // Apply theme immediately based on stored preference
-        const STORAGE_PREFIX = 'lora_manager_';
-        const savedTheme = localStorage.getItem(STORAGE_PREFIX + 'theme') || 'auto';
-        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        var STORAGE_PREFIX = 'lora_manager_';
+        var savedTheme = localStorage.getItem(STORAGE_PREFIX + 'theme') || 'auto';
+        var savedPreset = localStorage.getItem(STORAGE_PREFIX + 'theme_preset') || 'default';
+        var prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
         
         if (savedTheme === 'dark' || (savedTheme === 'auto' && prefersDark)) {
           document.documentElement.setAttribute('data-theme', 'dark');
         } else {
           document.documentElement.setAttribute('data-theme', 'light');
         }
+
+        if (savedPreset && savedPreset !== 'default') {
+          document.documentElement.setAttribute('data-theme-preset', savedPreset);
+        }
       })();
     </script>
     {% block head_scripts %}{% endblock %}

templates/components/header.html

@@ -120,6 +120,56 @@
   </div>
 </header>
 
+<div class="theme-popover" id="themePopover" role="dialog" aria-label="{{ t('header.theme.toggle') }}">
+  <div class="theme-popover-section">
+    <div class="theme-popover-label">{{ t('header.theme.mode') }}</div>
+    <div class="theme-popover-modes">
+      <button class="theme-mode-btn" data-mode="light" title="{{ t('header.theme.light') }}">
+        <i class="fas fa-sun"></i>
+        <span>{{ t('header.theme.light') }}</span>
+      </button>
+      <button class="theme-mode-btn" data-mode="dark" title="{{ t('header.theme.dark') }}">
+        <i class="fas fa-moon"></i>
+        <span>{{ t('header.theme.dark') }}</span>
+      </button>
+      <button class="theme-mode-btn" data-mode="auto" title="{{ t('header.theme.auto') }}">
+        <i class="fas fa-adjust"></i>
+        <span>{{ t('header.theme.auto') }}</span>
+      </button>
+    </div>
+  </div>
+  <div class="theme-popover-divider"></div>
+  <div class="theme-popover-section">
+    <div class="theme-popover-label">{{ t('header.theme.presets') }}</div>
+    <div class="theme-popover-presets">
+      <button class="theme-preset-btn" data-preset="default" title="{{ t('header.theme.default') }}">
+        <span class="preset-swatch preset-swatch-default"></span>
+        <span>{{ t('header.theme.default') }}</span>
+      </button>
+      <button class="theme-preset-btn" data-preset="nord" title="{{ t('header.theme.nord') }}">
+        <span class="preset-swatch preset-swatch-nord"></span>
+        <span>{{ t('header.theme.nord') }}</span>
+      </button>
+      <button class="theme-preset-btn" data-preset="midnight" title="{{ t('header.theme.midnight') }}">
+        <span class="preset-swatch preset-swatch-midnight"></span>
+        <span>{{ t('header.theme.midnight') }}</span>
+      </button>
+      <button class="theme-preset-btn" data-preset="monokai" title="{{ t('header.theme.monokai') }}">
+        <span class="preset-swatch preset-swatch-monokai"></span>
+        <span>{{ t('header.theme.monokai') }}</span>
+      </button>
+      <button class="theme-preset-btn" data-preset="dracula" title="{{ t('header.theme.dracula') }}">
+        <span class="preset-swatch preset-swatch-dracula"></span>
+        <span>{{ t('header.theme.dracula') }}</span>
+      </button>
+      <button class="theme-preset-btn" data-preset="solarized" title="{{ t('header.theme.solarized') }}">
+        <span class="preset-swatch preset-swatch-solarized"></span>
+        <span>{{ t('header.theme.solarized') }}</span>
+      </button>
+    </div>
+  </div>
+</div>
+
 <!-- Add search options panel with context-aware options -->
 <div id="searchOptionsPanel" class="search-options-panel hidden">
   <div class="options-header">

templates/components/modals/settings_modal.html

@@ -95,22 +95,36 @@
                         <div class="setting-item api-key-item">
                             <div class="setting-row">
                                 <div class="setting-info">
-                                    <label for="civitaiApiKey">{{ t('settings.civitaiApiKey') }}</label>
+                                    <label>{{ t('settings.civitaiApiKey') }}</label>
                                     <i class="fas fa-info-circle info-icon" data-tooltip="{{ t('settings.civitaiApiKeyHelp') }}"></i>
                                 </div>
                                 <div class="setting-control">
-                                    <div class="api-key-input">
-                                        <input type="password" 
-                                            id="civitaiApiKey" 
-                                            placeholder="{{ t('settings.civitaiApiKeyPlaceholder') }}"
-                                            value="{{ settings.get('civitai_api_key', '') }}"
-                                            autocomplete="new-password"
-                                            onblur="settingsManager.saveInputSetting('civitaiApiKey', 'civitai_api_key')"
-                                            onkeydown="if(event.key === 'Enter') { this.blur(); }" />
-                                        <button class="toggle-visibility">
-                                            <i class="fas fa-eye"></i>
+                                    <!-- Status display (shown when not editing) -->
+                                    <div id="civitaiApiKeyStatus" class="api-key-status">
+                                        <span id="civitaiApiKeyStatusText" class="api-key-status-text api-key-status--unconfigured">
+                                            <i class="fas fa-times-circle text-error"></i>
+                                            {{ t('settings.civitaiApiKeyNotConfigured') }}
+                                        </span>
+                                        <button type="button" class="secondary-btn" id="civitaiApiKeyActionBtn" onclick="settingsManager.editApiKey()">
+                                            {{ t('settings.civitaiApiKeySet') }}
                                         </button>
                                     </div>
+                                    <!-- Inline edit view (shown when editing) -->
+                                    <div id="civitaiApiKeyEdit" class="api-key-edit is-hidden">
+                                        <div class="api-key-input">
+                                            <input type="text"
+                                                id="civitaiApiKey"
+                                                class="api-key-masked"
+                                                placeholder="{{ t('settings.civitaiApiKeyPlaceholder') }}"
+                                                autocomplete="off"
+                                                data-mask="css" />
+                                            <button type="button" class="toggle-visibility">
+                                                <i class="fas fa-eye"></i>
+                                            </button>
+                                        </div>
+                                        <button type="button" class="primary-btn" onclick="settingsManager.saveApiKey()">{{ t('common.actions.save') }}</button>
+                                        <button type="button" class="secondary-btn" onclick="settingsManager.cancelEditApiKey()">{{ t('common.actions.cancel') }}</button>
+                                    </div>
                                 </div>
                             </div>
                         </div>
@@ -592,6 +606,30 @@
                             </div>
                         </div>
                         
+                        <!-- License Icons -->
+                        <div class="settings-subsection">
+                            <div class="settings-subsection-header">
+                                <h4>{{ t('settings.sections.licenseIcons') }}</h4>
+                            </div>
+                            <div class="setting-item">
+                                <div class="setting-row">
+                                    <div class="setting-info">
+                                        <label for="useNewLicenseIcons">
+                                        {{ t('settings.licenseIcons.useNewStyle') }}
+                                        <i class="fas fa-info-circle info-icon" data-tooltip="{{ t('settings.licenseIcons.useNewStyleHelp') }}"></i>
+                                    </label>
+                                    </div>
+                                    <div class="setting-control">
+                                        <label class="toggle-switch">
+                                            <input type="checkbox" id="useNewLicenseIcons"
+                                                   onchange="settingsManager.saveToggleSetting('useNewLicenseIcons', 'use_new_license_icons')">
+                                            <span class="toggle-slider"></span>
+                                        </label>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+
                         <!-- Miscellaneous -->
                         <div class="settings-subsection">
                             <div class="settings-subsection-header">

templates/components/recipe_modal.html

@@ -6,13 +6,8 @@
             <h2 id="recipeModalTitle">Recipe Details</h2>
             <!-- Header Actions: populated dynamically in RecipeModal.js -->
             <div class="recipe-header-actions" id="recipeHeaderActions"></div>
-            <!-- Recipe Tags Container -->
-            <div class="recipe-tags-container">
-                <div class="recipe-tags-compact" id="recipeTagsCompact"></div>
-                <div class="recipe-tags-tooltip" id="recipeTagsTooltip">
-                    <div class="tooltip-content" id="recipeTagsTooltipContent"></div>
-                </div>
-            </div>
+            <!-- Recipe Tags Container (rendered by renderCompactTags) -->
+            <div id="recipeTagsContainer"></div>
         </header>
         
         <div class="modal-body">

tests/frontend/components/contextMenu.interactions.test.js

@@ -246,12 +246,7 @@ describe('Interaction-level regression coverage', () => {
         <div class="modal-content">
           <header class="recipe-modal-header">
             <h2 id="recipeModalTitle">Recipe Details</h2>
-            <div class="recipe-tags-container">
-              <div class="recipe-tags-compact" id="recipeTagsCompact"></div>
-              <div class="recipe-tags-tooltip" id="recipeTagsTooltip">
-                <div class="tooltip-content" id="recipeTagsTooltipContent"></div>
-              </div>
-            </div>
+            <div id="recipeTagsContainer"></div>
           </header>
           <div class="modal-body">
             <div class="recipe-top-section">
@@ -375,12 +370,7 @@ describe('Interaction-level regression coverage', () => {
         <div class="modal-content">
           <header class="recipe-modal-header">
             <h2 id="recipeModalTitle">Recipe Details</h2>
-            <div class="recipe-tags-container">
-              <div class="recipe-tags-compact" id="recipeTagsCompact"></div>
-              <div class="recipe-tags-tooltip" id="recipeTagsTooltip">
-                <div class="tooltip-content" id="recipeTagsTooltipContent"></div>
-              </div>
-            </div>
+            <div id="recipeTagsContainer"></div>
           </header>
           <div class="modal-body">
             <div class="recipe-top-section">
@@ -474,12 +464,7 @@ describe('Interaction-level regression coverage', () => {
         <div class="modal-content">
           <header class="recipe-modal-header">
             <h2 id="recipeModalTitle">Recipe Details</h2>
-            <div class="recipe-tags-container">
-              <div class="recipe-tags-compact" id="recipeTagsCompact"></div>
-              <div class="recipe-tags-tooltip" id="recipeTagsTooltip">
-                <div class="tooltip-content" id="recipeTagsTooltipContent"></div>
-              </div>
-            </div>
+            <div id="recipeTagsContainer"></div>
           </header>
           <div class="modal-body">
             <div class="recipe-top-section">
@@ -588,12 +573,7 @@ describe('Interaction-level regression coverage', () => {
         <div class="modal-content">
           <header class="recipe-modal-header">
             <h2 id="recipeModalTitle">Recipe Details</h2>
-            <div class="recipe-tags-container">
-              <div class="recipe-tags-compact" id="recipeTagsCompact"></div>
-              <div class="recipe-tags-tooltip" id="recipeTagsTooltip">
-                <div class="tooltip-content" id="recipeTagsTooltipContent"></div>
-              </div>
-            </div>
+            <div id="recipeTagsContainer"></div>
           </header>
           <div class="modal-body">
             <div class="recipe-top-section">
@@ -682,12 +662,7 @@ describe('Interaction-level regression coverage', () => {
         <div class="modal-content">
           <header class="recipe-modal-header">
             <h2 id="recipeModalTitle">Recipe Details</h2>
-            <div class="recipe-tags-container">
-              <div class="recipe-tags-compact" id="recipeTagsCompact"></div>
-              <div class="recipe-tags-tooltip" id="recipeTagsTooltip">
-                <div class="tooltip-content" id="recipeTagsTooltipContent"></div>
-              </div>
-            </div>
+            <div id="recipeTagsContainer"></div>
           </header>
           <div class="modal-body">
             <div class="recipe-top-section">
@@ -790,12 +765,7 @@ describe('Interaction-level regression coverage', () => {
         <div class="modal-content">
           <header class="recipe-modal-header">
             <h2 id="recipeModalTitle">Recipe Details</h2>
-            <div class="recipe-tags-container">
-              <div class="recipe-tags-compact" id="recipeTagsCompact"></div>
-              <div class="recipe-tags-tooltip" id="recipeTagsTooltip">
-                <div class="tooltip-content" id="recipeTagsTooltipContent"></div>
-              </div>
-            </div>
+            <div id="recipeTagsContainer"></div>
           </header>
           <div class="modal-body">
             <div class="recipe-top-section">
@@ -873,12 +843,10 @@ describe('Interaction-level regression coverage', () => {
     });
 
     recipeModal.markFieldDirty('title');
-    recipeModal.markFieldDirty('tags');
     recipeModal.markFieldDirty('prompt');
     recipeModal.markFieldDirty('negative_prompt');
 
     document.querySelector('#recipeTitleEditor .title-input').value = 'Local Title';
-    document.querySelector('#recipeTagsEditor .tags-input').value = 'local-tag-1, local-tag-2';
     document.getElementById('recipePromptInput').value = 'local prompt';
     document.getElementById('recipeNegativePromptInput').value = 'local negative';
 
@@ -899,7 +867,6 @@ describe('Interaction-level regression coverage', () => {
     await flushAsyncTasks();
 
     expect(document.querySelector('#recipeTitleEditor .title-input').value).toBe('Local Title');
-    expect(document.querySelector('#recipeTagsEditor .tags-input').value).toBe('local-tag-1, local-tag-2');
     expect(document.getElementById('recipePromptInput').value).toBe('local prompt');
     expect(document.getElementById('recipeNegativePromptInput').value).toBe('local negative');
     expect(recipeModal.currentRecipe.title).toBe('Hydrated Title');
@@ -918,12 +885,7 @@ describe('Interaction-level regression coverage', () => {
         <div class="modal-content">
           <header class="recipe-modal-header">
             <h2 id="recipeModalTitle">Recipe Details</h2>
-            <div class="recipe-tags-container">
-              <div class="recipe-tags-compact" id="recipeTagsCompact"></div>
-              <div class="recipe-tags-tooltip" id="recipeTagsTooltip">
-                <div class="tooltip-content" id="recipeTagsTooltipContent"></div>
-              </div>
-            </div>
+            <div id="recipeTagsContainer"></div>
           </header>
           <div class="modal-body">
             <div class="recipe-top-section">
@@ -1057,12 +1019,7 @@ describe('Interaction-level regression coverage', () => {
         <div class="modal-content">
           <header class="recipe-modal-header">
             <h2 id="recipeModalTitle">Recipe Details</h2>
-            <div class="recipe-tags-container">
-              <div class="recipe-tags-compact" id="recipeTagsCompact"></div>
-              <div class="recipe-tags-tooltip" id="recipeTagsTooltip">
-                <div class="tooltip-content" id="recipeTagsTooltipContent"></div>
-              </div>
-            </div>
+            <div id="recipeTagsContainer"></div>
           </header>
           <div class="modal-body">
             <div class="recipe-top-section">
@@ -1170,8 +1127,7 @@ describe('Interaction-level regression coverage', () => {
       <div id="recipeModal" class="modal">
         <div id="recipeModalTitle"></div>
         <div id="recipePreviewContainer"></div>
-        <div id="recipeTagsCompact"></div>
-        <div id="recipeTagsTooltip"><div id="recipeTagsTooltipContent"></div></div>
+        <div id="recipeTagsContainer"></div>
         <div id="recipePrompt"></div>
         <textarea id="recipePromptInput"></textarea>
         <div id="recipeNegativePrompt"></div>
@@ -1224,8 +1180,7 @@ describe('Interaction-level regression coverage', () => {
       <div id="recipeModal" class="modal">
         <div id="recipeModalTitle"></div>
         <div id="recipePreviewContainer"></div>
-        <div id="recipeTagsCompact"></div>
-        <div id="recipeTagsTooltip"><div id="recipeTagsTooltipContent"></div></div>
+        <div id="recipeTagsContainer"></div>
         <div id="recipePrompt"></div>
         <textarea id="recipePromptInput"></textarea>
         <div id="recipeNegativePrompt"></div>
@@ -1300,12 +1255,7 @@ describe('Interaction-level regression coverage', () => {
         <div class="modal-content">
           <header class="recipe-modal-header">
             <h2 id="recipeModalTitle">Recipe Details</h2>
-            <div class="recipe-tags-container">
-              <div class="recipe-tags-compact" id="recipeTagsCompact"></div>
-              <div class="recipe-tags-tooltip" id="recipeTagsTooltip">
-                <div class="tooltip-content" id="recipeTagsTooltipContent"></div>
-              </div>
-            </div>
+            <div id="recipeTagsContainer"></div>
           </header>
           <div class="modal-body">
             <div class="recipe-top-section">
@@ -1418,12 +1368,7 @@ describe('Interaction-level regression coverage', () => {
         <div class="modal-content">
           <header class="recipe-modal-header">
             <h2 id="recipeModalTitle">Recipe Details</h2>
-            <div class="recipe-tags-container">
-              <div class="recipe-tags-compact" id="recipeTagsCompact"></div>
-              <div class="recipe-tags-tooltip" id="recipeTagsTooltip">
-                <div class="tooltip-content" id="recipeTagsTooltipContent"></div>
-              </div>
-            </div>
+            <div id="recipeTagsContainer"></div>
           </header>
           <div class="modal-body">
             <div class="recipe-top-section">
@@ -1541,12 +1486,7 @@ describe('Interaction-level regression coverage', () => {
         <div class="modal-content">
           <header class="recipe-modal-header">
             <h2 id="recipeModalTitle">Recipe Details</h2>
-            <div class="recipe-tags-container">
-              <div class="recipe-tags-compact" id="recipeTagsCompact"></div>
-              <div class="recipe-tags-tooltip" id="recipeTagsTooltip">
-                <div class="tooltip-content" id="recipeTagsTooltipContent"></div>
-              </div>
-            </div>
+            <div id="recipeTagsContainer"></div>
           </header>
           <div class="modal-body">
             <div class="recipe-top-section">
@@ -1654,12 +1594,7 @@ describe('Interaction-level regression coverage', () => {
         <div class="modal-content">
           <header class="recipe-modal-header">
             <h2 id="recipeModalTitle">Recipe Details</h2>
-            <div class="recipe-tags-container">
-              <div class="recipe-tags-compact" id="recipeTagsCompact"></div>
-              <div class="recipe-tags-tooltip" id="recipeTagsTooltip">
-                <div class="tooltip-content" id="recipeTagsTooltipContent"></div>
-              </div>
-            </div>
+            <div id="recipeTagsContainer"></div>
           </header>
           <div class="modal-body">
             <div class="recipe-top-section">
@@ -1776,12 +1711,7 @@ describe('Interaction-level regression coverage', () => {
         <div class="modal-content">
           <header class="recipe-modal-header">
             <h2 id="recipeModalTitle">Recipe Details</h2>
-            <div class="recipe-tags-container">
-              <div class="recipe-tags-compact" id="recipeTagsCompact"></div>
-              <div class="recipe-tags-tooltip" id="recipeTagsTooltip">
-                <div class="tooltip-content" id="recipeTagsTooltipContent"></div>
-              </div>
-            </div>
+            <div id="recipeTagsContainer"></div>
           </header>
           <div class="modal-body">
             <div class="recipe-top-section">
@@ -1878,12 +1808,7 @@ describe('Interaction-level regression coverage', () => {
         <div class="modal-content">
           <header class="recipe-modal-header">
             <h2 id="recipeModalTitle">Recipe Details</h2>
-            <div class="recipe-tags-container">
-              <div class="recipe-tags-compact" id="recipeTagsCompact"></div>
-              <div class="recipe-tags-tooltip" id="recipeTagsTooltip">
-                <div class="tooltip-content" id="recipeTagsTooltipContent"></div>
-              </div>
-            </div>
+            <div id="recipeTagsContainer"></div>
           </header>
           <div class="modal-body">
             <div class="recipe-top-section">
@@ -2007,12 +1932,7 @@ describe('Interaction-level regression coverage', () => {
         <div class="modal-content">
           <header class="recipe-modal-header">
             <h2 id="recipeModalTitle">Recipe Details</h2>
-            <div class="recipe-tags-container">
-              <div class="recipe-tags-compact" id="recipeTagsCompact"></div>
-              <div class="recipe-tags-tooltip" id="recipeTagsTooltip">
-                <div class="tooltip-content" id="recipeTagsTooltipContent"></div>
-              </div>
-            </div>
+            <div id="recipeTagsContainer"></div>
           </header>
           <div class="modal-body">
             <div class="recipe-top-section">

tests/frontend/components/modelModal.licenseIcons.test.js

@@ -101,14 +101,19 @@ vi.mock(API_FACTORY, () => ({
 
 describe('Model modal license rendering', () => {
   let getModelApiClient;
+  let state;
 
   beforeEach(async () => {
     document.body.innerHTML = '';
     ({ getModelApiClient } = await import(API_FACTORY));
     getModelApiClient.mockReset();
+    // Import state and force classic icons for this test
+    const stateModule = await import('../../../static/js/state/index.js');
+    state = stateModule.state;
+    state.global.settings.use_new_license_icons = false;
   });
 
-  it('handles aggregated commercial strings without extra restrictions', async () => {
+  it('handles aggregated commercial strings without extra restrictions (classic style)', async () => {
     const fetchModelMetadata = vi.fn().mockResolvedValue(null);
     getModelApiClient.mockReturnValue({
       fetchModelMetadata,

tests/i18n/test_i18n.py

@@ -80,6 +80,8 @@ FALSE_POSITIVES = {
     "array",
     "object",
     "non.existent.key",
+    "statistics.modelTypes.",
+    "statistics.",
 }
 
 SPECIAL_UI_HELPER_KEYS = {

tests/metadata_collector/test_metadata_collector.py

@@ -733,6 +733,65 @@ def test_lora_manager_cache_updates_when_loras_removed(metadata_registry):
     assert "lora_node" not in metadata[LORAS]
 
 
+def test_lora_text_loader_extracts_loras_from_syntax(metadata_registry):
+    """LoraTextLoaderLM extractor parses <lora:name:strength> tags from lora_syntax string."""
+    metadata_registry.start_collection("prompt1")
+
+    metadata_registry.record_node_execution(
+        "text_loader",
+        "LoraTextLoaderLM",
+        {"lora_syntax": ["<lora:foo:0.8> <lora:bar:1.0>"]},
+        None,
+    )
+
+    metadata = metadata_registry.get_metadata("prompt1")
+
+    assert "text_loader" in metadata[LORAS]
+    lora_list = metadata[LORAS]["text_loader"]["lora_list"]
+    assert len(lora_list) == 2
+    assert lora_list[0] == {"name": "foo", "strength": 0.8}
+    assert lora_list[1] == {"name": "bar", "strength": 1.0}
+
+
+def test_lora_text_loader_extracts_loras_from_lora_stack(metadata_registry):
+    """LoraTextLoaderLM extractor also processes the optional lora_stack input."""
+    metadata_registry.start_collection("prompt1")
+
+    metadata_registry.record_node_execution(
+        "stack_loader",
+        "LoraTextLoaderLM",
+        {
+            "lora_syntax": [""],
+            "lora_stack": (("/models/loras/my-lora.safetensors", 0.6, 0.5),),
+        },
+        None,
+    )
+
+    metadata = metadata_registry.get_metadata("prompt1")
+
+    assert "stack_loader" in metadata[LORAS]
+    lora_list = metadata[LORAS]["stack_loader"]["lora_list"]
+    assert len(lora_list) == 1
+    assert lora_list[0] == {"name": "my-lora", "strength": 0.6}
+
+
+def test_lora_text_loader_handles_empty_syntax(metadata_registry):
+    """LoraTextLoaderLM extractor produces no metadata when no loras are provided."""
+    metadata_registry.start_collection("prompt1")
+
+    metadata_registry.record_node_execution(
+        "empty_loader",
+        "LoraTextLoaderLM",
+        {"lora_syntax": [""]},
+        None,
+    )
+
+    metadata = metadata_registry.get_metadata("prompt1")
+
+    assert "empty_loader" not in metadata[LORAS]
+
+
+
 def test_lora_manager_checkpoint_and_unet_loaders_extract_models(metadata_registry):
     metadata_registry.start_collection("prompt1")
 

tests/routes/__snapshots__/test_api_snapshots.ambr

@@ -26,7 +26,7 @@
     'messages': list([
     ]),
     'settings': dict({
-      'civitai_api_key': 'test-key',
+      'civitai_api_key_set': True,
       'language': 'en',
       'theme': 'dark',
     }),

tests/routes/test_misc_routes.py

@@ -134,8 +134,10 @@ async def test_get_settings_excludes_no_sync_keys():
 
     assert payload["success"] is True
     # Regular settings should be synced
-    assert payload["settings"]["civitai_api_key"] == "abc"
     assert payload["settings"]["regular_setting"] == "value"
+    # civitai_api_key is in _NO_SYNC_KEYS; only the boolean flag is returned
+    assert payload["settings"].get("civitai_api_key") is None
+    assert payload["settings"]["civitai_api_key_set"] is True
     # _NO_SYNC_KEYS should not be synced
     assert "hash_chunk_size_mb" not in payload["settings"]
     assert "folder_paths" not in payload["settings"]

tests/routes/test_stats_routes.py

@@ -302,15 +302,15 @@ async def test_get_insights(stats_routes):
     insights = payload["data"]["insights"]
     assert len(insights) == 3
 
-    titles = {entry["title"] for entry in insights}
-    assert "High Number of Unused LoRAs" in titles
-    assert "Unused Checkpoints Detected" in titles
-    assert "High Number of Unused Embeddings" in titles
+    keys = {entry["key"] for entry in insights}
+    assert "insights.unusedLoras.high" in keys
+    assert "insights.unusedCheckpoints.detected" in keys
+    assert "insights.unusedEmbeddings.high" in keys
 
-    descriptions = {entry["description"] for entry in insights}
-    assert any("2/3" in desc for desc in descriptions)
-    assert any("1/2" in desc for desc in descriptions)
-    assert any("1/1" in desc for desc in descriptions)
+    params_list = [entry["params"] for entry in insights]
+    assert any(p["total"] == "3" for p in params_list)
+    assert any(p["total"] == "2" for p in params_list)
+    assert any(p["total"] == "1" for p in params_list)
 
 
 @pytest.mark.asyncio

tests/utils/test_example_images_paths.py

@@ -9,6 +9,7 @@ import pytest
 from py.services.settings_manager import get_settings_manager
 from py.utils.example_images_paths import (
     ensure_library_root_exists,
+    find_non_compliant_items_in_example_images_root,
     get_model_folder,
     get_model_relative_path,
     is_valid_example_images_root,
@@ -140,3 +141,68 @@ def test_is_valid_example_images_root_accepts_legacy_library_structure(tmp_path,
     (hash_folder / 'image.png').write_text('data', encoding='utf-8')
 
     assert is_valid_example_images_root(str(tmp_path)) is True
+
+
+def test_find_non_compliant_items_returns_empty_for_valid_root(tmp_path, settings_manager):
+    """An empty folder or one with only hash dirs should return []."""
+    settings_manager.settings['example_images_path'] = str(tmp_path)
+
+    # Empty folder
+    assert find_non_compliant_items_in_example_images_root(str(tmp_path)) == []
+
+    # Only hash folders
+    hash_folder = tmp_path / ('f' * 64)
+    hash_folder.mkdir()
+    (hash_folder / 'image.png').write_text('data', encoding='utf-8')
+    assert find_non_compliant_items_in_example_images_root(str(tmp_path)) == []
+
+
+def test_find_non_compliant_items_returns_offending_names(tmp_path, settings_manager):
+    """A folder with non-hash items should return their names."""
+    settings_manager.settings['example_images_path'] = str(tmp_path)
+
+    # Create a valid hash folder so the root is otherwise acceptable
+    hash_folder = tmp_path / ('a' * 64)
+    hash_folder.mkdir()
+
+    # Add an offending file
+    (tmp_path / 'readme.txt').write_text('hello', encoding='utf-8')
+    assert find_non_compliant_items_in_example_images_root(str(tmp_path)) == ['readme.txt']
+
+    # Add an offending directory with content (empty dirs are accepted as
+    # potential legacy library folders by _library_folder_has_only_hash_dirs)
+    offending_dir = tmp_path / 'not_a_hash'
+    offending_dir.mkdir()
+    (offending_dir / 'some_file.txt').write_text('data', encoding='utf-8')
+    items = find_non_compliant_items_in_example_images_root(str(tmp_path))
+    assert 'readme.txt' in items
+    assert 'not_a_hash' in items
+
+
+def test_find_non_compliant_items_ignores_hidden_files(tmp_path, settings_manager):
+    """Hidden/system files should not appear in offending list."""
+    settings_manager.settings['example_images_path'] = str(tmp_path)
+
+    # .DS_Store is an allowed file
+    (tmp_path / '.DS_Store').write_text('', encoding='utf-8')
+    assert find_non_compliant_items_in_example_images_root(str(tmp_path)) == []
+
+    # Thumbs.db too
+    (tmp_path / 'Thumbs.db').write_text('', encoding='utf-8')
+    assert find_non_compliant_items_in_example_images_root(str(tmp_path)) == []
+
+
+def test_find_non_compliant_items_accepts_download_progress_json(tmp_path, settings_manager):
+    """.download_progress.json should be recognised as a valid metadata file."""
+    settings_manager.settings['example_images_path'] = str(tmp_path)
+
+    (tmp_path / '.download_progress.json').write_text('{}', encoding='utf-8')
+    assert find_non_compliant_items_in_example_images_root(str(tmp_path)) == []
+
+
+def test_find_non_compliant_items_reports_directory_error(tmp_path):
+    """When the directory cannot be listed, return an explanatory message."""
+    non_existent = tmp_path / 'does-not-exist'
+    result = find_non_compliant_items_in_example_images_root(str(non_existent))
+    assert len(result) == 1
+    assert 'cannot list directory' in result[0]

web/comfyui/lm_styles.css

@@ -73,6 +73,40 @@
   mask: var(--license-icon-image) center/contain no-repeat;
 }
 
+/* Set 2 — new style license overlay */
+.lm-tooltip__license-overlay-new {
+  position: absolute;
+  top: 8px;
+  left: 8px;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px;
+  padding: 5px 8px;
+  border-radius: 999px;
+  background: rgba(10, 10, 14, 0.78);
+  border: 1px solid rgba(255, 255, 255, 0.12);
+  backdrop-filter: blur(8px);
+  -webkit-backdrop-filter: blur(8px);
+  max-width: calc(100% - 16px);
+}
+
+.lm-tooltip__license-icon-new {
+  width: 16px;
+  height: 16px;
+  display: inline-block;
+  border-radius: 3px;
+  -webkit-mask: var(--license-icon-image) center/contain no-repeat;
+  mask: var(--license-icon-image) center/contain no-repeat;
+}
+
+.lm-tooltip__license-icon-new.allowed {
+  background-color: #40c057;
+}
+
+.lm-tooltip__license-icon-new.denied {
+  background-color: #fa5252;
+}
+
 .lm-loras-container {
   display: flex;
   flex-direction: column;

web/comfyui/preview_tooltip.js

@@ -12,6 +12,8 @@ const LICENSE_FLAG_BITS = {
   allowRelicense: 1 << 6,
 };
 
+// ── Set 1 (classic) icon definitions ──
+
 const LICENSE_ICON_COPY = {
   credit: "Creator credit required",
   image: "No selling generated content",
@@ -29,6 +31,51 @@ const COMMERCIAL_ICON_CONFIG = [
   { bit: LICENSE_FLAG_BITS.allowSellingModels, icon: "shopping-cart-off.svg", label: LICENSE_ICON_COPY.sell },
 ];
 
+// ── Set 2 (new CivitAI-style) icon definitions ──
+
+const LNI = LICENSE_ICON_PATH; // alias for brevity
+
+const NEW_LICENSE_ICON_COPY = {
+  commercial: { allowed: "Commercial use allowed", denied: "No commercial use" },
+  genServices: { allowed: "Generation services allowed", denied: "No generation services" },
+  credit: { allowed: "No credit required", denied: "Creator credit required" },
+  derivatives: { allowed: "Merges allowed", denied: "No merges allowed" },
+  relicense: { allowed: "Different permissions allowed on merges", denied: "Same permissions required on merges" },
+};
+
+const NEW_ICON_CONFIG = [
+  {
+    bitCombo: [LICENSE_FLAG_BITS.allowOnImages, LICENSE_FLAG_BITS.allowSellingModels],
+    icon: "currency-dollar.svg",
+    labelKey: "commercial",
+    allowedFn: (flags) => (flags & LICENSE_FLAG_BITS.allowOnImages) !== 0 || (flags & LICENSE_FLAG_BITS.allowSellingModels) !== 0,
+  },
+  {
+    bitCombo: [LICENSE_FLAG_BITS.allowOnCivitai, LICENSE_FLAG_BITS.allowRental],
+    icon: "brush.svg",
+    labelKey: "genServices",
+    allowedFn: (flags) => (flags & LICENSE_FLAG_BITS.allowOnCivitai) !== 0 || (flags & LICENSE_FLAG_BITS.allowRental) !== 0,
+  },
+  {
+    bitCombo: [LICENSE_FLAG_BITS.allowNoCredit],
+    icon: "user.svg",
+    labelKey: "credit",
+    allowedFn: (flags) => (flags & LICENSE_FLAG_BITS.allowNoCredit) !== 0,
+  },
+  {
+    bitCombo: [LICENSE_FLAG_BITS.allowDerivatives],
+    icon: "git-merge.svg",
+    labelKey: "derivatives",
+    allowedFn: (flags) => (flags & LICENSE_FLAG_BITS.allowDerivatives) !== 0,
+  },
+  {
+    bitCombo: [LICENSE_FLAG_BITS.allowRelicense],
+    icon: "license.svg",
+    labelKey: "relicense",
+    allowedFn: (flags) => (flags & LICENSE_FLAG_BITS.allowRelicense) !== 0,
+  },
+];
+
 function parseLicenseFlags(value) {
   if (typeof value === "number") {
     return Number.isFinite(value) ? value : null;
@@ -78,6 +125,81 @@ function createLicenseIconElement({ icon, label }) {
   return element;
 }
 
+// ── Set 2 (new style) helpers ──
+
+function buildNewLicenseIconData(licenseFlags) {
+  if (licenseFlags == null) {
+    return [];
+  }
+
+  return NEW_ICON_CONFIG.map((config) => {
+    const allowed = config.allowedFn(licenseFlags);
+    const label = allowed
+      ? NEW_LICENSE_ICON_COPY[config.labelKey].allowed
+      : NEW_LICENSE_ICON_COPY[config.labelKey].denied;
+    return {
+      icon: config.icon,
+      label,
+      allowed,
+    };
+  });
+}
+
+function createNewLicenseIconElement({ icon, label, allowed }) {
+  const element = document.createElement("span");
+  element.className = `lm-tooltip__license-icon-new ${allowed ? "allowed" : "denied"}`;
+  element.setAttribute("role", "img");
+  element.setAttribute("aria-label", label);
+  element.title = label;
+  element.style.setProperty("--license-icon-image", `url('${LICENSE_ICON_PATH}${icon}')`);
+  return element;
+}
+
+const LICENSE_ICON_STORAGE_KEY = "lm_license_icon_new_style";
+
+// Module-level cache: null = not yet initialized
+let _useNewIconsCached = null;
+
+// Fetch the setting from the LoRA Manager backend API via the proper
+// ComfyUI api helper (handles base URL, credentials, etc.).
+// Stores the result in both the in-memory cache and localStorage so the
+// value survives page reloads even before the API responds.
+async function _fetchLicenseIconSetting() {
+  try {
+    const response = await api.fetchApi("/lm/settings");
+    if (response.ok) {
+      const data = await response.json();
+      const value = data.use_new_license_icons !== false;
+      _useNewIconsCached = value;
+      try { localStorage.setItem(LICENSE_ICON_STORAGE_KEY, String(value)); } catch (_) {}
+    }
+  } catch (_) {
+    // API not available; cached/localStorage fallback stays in place
+  }
+}
+
+function getUseNewLicenseIcons() {
+  // 1) In-memory cache hit
+  if (_useNewIconsCached !== null) {
+    return _useNewIconsCached;
+  }
+
+  // 2) localStorage — survives page reloads
+  try {
+    const stored = localStorage.getItem(LICENSE_ICON_STORAGE_KEY);
+    if (stored !== null) {
+      _useNewIconsCached = stored === "true";
+      // Refresh from API in background for next time
+      _fetchLicenseIconSetting();
+      return _useNewIconsCached;
+    }
+  } catch (_) {}
+
+  // 3) First-ever run: kick off API fetch, default to new style
+  _fetchLicenseIconSetting();
+  return true;
+}
+
 /**
  * Lightweight preview tooltip that can display images or videos for different model types.
  */
@@ -101,6 +223,10 @@ export class PreviewTooltip {
 
     ensureLmStyles();
 
+    // Pre-fetch license icon style from LM backend so the tooltip
+    // respects the standalone settings toggle as early as possible.
+    _fetchLicenseIconSetting();
+
     this.element = document.createElement("div");
     this.element.className = "lm-tooltip";
     document.body.appendChild(this.element);
@@ -135,6 +261,7 @@ export class PreviewTooltip {
       previewUrl: data.preview_url,
       displayName: data.display_name ?? modelName,
       licenseFlags: parseLicenseFlags(data.license_flags),
+      useNewLicenseIcons: data.use_new_license_icons,
     };
   }
 
@@ -150,7 +277,7 @@ export class PreviewTooltip {
       };
     }
 
-    const { previewUrl, displayName, licenseFlags } = raw;
+    const { previewUrl, displayName, licenseFlags, useNewLicenseIcons } = raw;
     if (!previewUrl) {
       throw new Error("No preview URL available");
     }
@@ -161,6 +288,7 @@ export class PreviewTooltip {
           ? displayName
           : this.displayNameFormatter(modelName),
       licenseFlags: parseLicenseFlags(licenseFlags),
+      useNewLicenseIcons,
     };
   }
 
@@ -182,7 +310,7 @@ export class PreviewTooltip {
       }
 
       this.currentModelName = modelName;
-      const { previewUrl, displayName, licenseFlags } = await this.resolvePreviewData(
+      const { previewUrl, displayName, licenseFlags, useNewLicenseIcons } = await this.resolvePreviewData(
         modelName
       );
 
@@ -211,7 +339,7 @@ export class PreviewTooltip {
       nameLabel.className = "lm-tooltip__label";
 
       mediaContainer.appendChild(mediaElement);
-      this.renderLicenseOverlay(mediaContainer, licenseFlags);
+      this.renderLicenseOverlay(mediaContainer, licenseFlags, useNewLicenseIcons);
       mediaContainer.appendChild(nameLabel);
       this.element.appendChild(mediaContainer);
 
@@ -293,16 +421,25 @@ export class PreviewTooltip {
     }
   }
 
-  renderLicenseOverlay(container, licenseFlags) {
-    const icons = buildLicenseIconData(licenseFlags);
+  renderLicenseOverlay(container, licenseFlags, useNewLicenseIcons) {
+    const useNew = useNewLicenseIcons !== undefined ? useNewLicenseIcons : getUseNewLicenseIcons();
+    const icons = useNew
+      ? buildNewLicenseIconData(licenseFlags)
+      : buildLicenseIconData(licenseFlags);
     if (!icons.length) {
       return;
     }
 
     const overlay = document.createElement("div");
-    overlay.className = "lm-tooltip__license-overlay";
+    overlay.className = useNew
+      ? "lm-tooltip__license-overlay-new"
+      : "lm-tooltip__license-overlay";
     icons.forEach((descriptor) => {
-      overlay.appendChild(createLicenseIconElement(descriptor));
+      overlay.appendChild(
+        useNew
+          ? createNewLicenseIconElement(descriptor)
+          : createLicenseIconElement(descriptor)
+      );
     });
     container.appendChild(overlay);
   }