{"id":8332,"date":"2026-02-06T17:29:55","date_gmt":"2026-02-07T00:29:55","guid":{"rendered":"https:\/\/rec0m88.com\/?page_id=8332"},"modified":"2026-02-11T16:08:25","modified_gmt":"2026-02-11T23:08:25","slug":"game-library-organizer","status":"publish","type":"page","link":"https:\/\/rec0m88.com\/pt\/game-library-organizer\/","title":{"rendered":"Organizador de bibliotecas de jogos"},"content":{"rendered":"<!DOCTYPE html>\n<html lang=\"en\" xmlns:mso=\"urn:schemas-microsoft-com:office:office\" xmlns:msdt=\"uuid:C2F41010-65B3-11d1-A29F-00AA00C14882\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    \n    <!-- SEO Meta Tags -->\n    <title>Free Game Library Organizer &#038; ROM Metadata Scraper | NES, SNES, Genesis, N64 ROMs &#038; More| rec0m88.com<\/title>\n    <meta name=\"description\" content=\"Free browser-based ROM metadata scraper and game library organizer. Automatically identify and organize your NES, SNES, N64, Genesis, PlayStation, Game Boy, and retro game collections with box art, release dates, and descriptions. 100% local processing - nothing uploaded.\">\n    <meta name=\"keywords\" content=\"ROM organizer, ROM metadata scraper, retro game library, NES ROM organizer, SNES ROM manager, N64 game database, Genesis ROM identifier, PlayStation ROM scraper, Game Boy ROM organizer, retro gaming tools, emulation library manager, game collection organizer, ROM box art downloader, retro game metadata, MAME ROM organizer, Sega ROM scraper, Nintendo ROM database, game library manager, ROM identification tool, retro game catalog\">\n    <meta name=\"author\" content=\"rec0m88.com\">\n    <meta name=\"robots\" content=\"index, follow\">\n    <link rel=\"canonical\" href=\"https:\/\/rec0m88.com\/game-library-organizer\">\n    \n    <!-- Open Graph -->\n    <meta property=\"og:type\" content=\"website\">\n    <meta property=\"og:url\" content=\"https:\/\/rec0m88.com\/game-library-organizer\">\n    <meta property=\"og:title\" content=\"Free ROM Metadata Scraper &#038; Game Library Organizer | rec0m88.com\">\n    <meta property=\"og:description\" content=\"Organize your retro game collection with automatic metadata, box art, and descriptions. Supports NES, SNES, N64, Genesis, PlayStation, and 30+ platforms.\">\n    <meta property=\"og:image\" content=\"https:\/\/rec0m88.com\/images\/game-organizer-preview.jpg\">\n    \n    <!-- Twitter Card -->\n    <meta name=\"twitter:card\" content=\"summary_large_image\">\n    <meta name=\"twitter:title\" content=\"Free ROM Metadata Scraper &#038; Game Library Organizer\">\n    <meta name=\"twitter:description\" content=\"Organize your retro game collection with automatic metadata, box art, and descriptions. Supports 30+ platforms.\">\n    \n    <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jszip\/3.10.1\/jszip.min.js\"><\/script>\n    \n    <!-- Schema.org -->\n    <script type=\"application\/ld+json\">\n    {\n        \"@context\": \"https:\/\/schema.org\",\n        \"@type\": \"WebApplication\",\n        \"name\": \"Game Library Organizer - ROM Metadata Scraper\",\n        \"description\": \"Free browser-based tool to organize retro game ROM collections with automatic metadata scraping.\",\n        \"url\": \"https:\/\/rec0m88.com\/game-library-organizer\",\n        \"applicationCategory\": \"UtilitiesApplication\",\n        \"operatingSystem\": \"Any (Browser-based)\",\n        \"offers\": { \"@type\": \"Offer\", \"price\": \"0\", \"priceCurrency\": \"USD\" },\n        \"author\": { \"@type\": \"Organization\", \"name\": \"rec0m88.com\", \"url\": \"https:\/\/rec0m88.com\" }\n    }\n    <\/script>\n<\/head>\n    <div class=\"cyber-grid\"><\/div>\n    \n    <div class=\"tool-container\">\n    <!-- Header -->\n    <header class=\"tool-header\">\n        <h1>Rec0m88 Organizador de bibliotecas de jogos e raspador de metadados de ROM<h1>\n        <p class=\"subtitle\">Identifique as suas ROMs, obtenha a arte da caixa, descri\u00e7\u00f5es e classifica\u00e7\u00f5es do IGDB &amp; RAWG - depois descarregue tudo como ficheiros organizados prontos para o Rec0m88 e outros emuladores. 100% local e privado.<\/p>\n        \n        <div class=\"platform-tags\">\n            <span class=\"platform-tag\">NES<\/span>\n            <span class=\"platform-tag\">SNES<\/span>\n            <span class=\"platform-tag\">Nintendo 64<\/span>\n            <span class=\"platform-tag\">Game Boy<\/span>\n            <span class=\"platform-tag\">GBA<\/span>\n            <span class=\"platform-tag\">Nintendo DS<\/span>\n            <span class=\"platform-tag\">G\u00e9nesis<\/span>\n            <span class=\"platform-tag\">Master System<\/span>\n            <span class=\"platform-tag\">Dreamcast<\/span>\n            <span class=\"platform-tag\">PlayStation<\/span>\n            <span class=\"platform-tag\">PS2<\/span>\n            <span class=\"platform-tag\">PSP<\/span>\n            <span class=\"platform-tag\">TurboGrafx-16<\/span>\n            <span class=\"platform-tag\">Neo Geo<\/span>\n            <span class=\"platform-tag\">Atari<\/span>\n            <span class=\"platform-tag\">Arcada<\/span>\n        <\/div>\n    <\/header>\n\n    <!-- API Configuration Section -->\n    <section class=\"tool-section\" id=\"apiSection\">\n        <div class=\"section-header\">\n            <div class=\"section-icon\">\n                <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"url(#iconGradient)\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                    <defs>\n                        <lineargradient id=\"iconGradient\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"100%\">\n                            <stop offset=\"0%\" style=\"stop-color:#00f0ff\"\/>\n                            <stop offset=\"100%\" style=\"stop-color:#bf00ff\"\/>\n                        <\/lineargradient>\n                    <\/defs>\n                    <path d=\"M21 2l-2 2m-7.61 7.61a5.5 5.5 0 1 1-7.778 7.778 5.5 5.5 0 0 1 7.777-7.777zm0 0L15.5 7.5m0 0l3 3L22 7l-3-3m-3.5 3.5L19 4\"\/>\n                <\/svg>\n            <\/div>\n            <div>\n                <div class=\"section-title\">Ligar bases de dados de jogos<\/div>\n                <div class=\"section-subtitle\">Escolha uma ou ambas as APIs para obter os melhores resultados de correspond\u00eancia<\/div>\n            <\/div>\n        <\/div>\n\n        <div class=\"api-tabs\">\n            <button type=\"button\" class=\"api-tab active\" data-api=\"rawg\" id=\"rawgTab\">\n                <span class=\"api-tab-icon rawg\">R<\/span>\n                RAWG.io\n                <span class=\"status-dot\" id=\"rawgDot\"><\/span>\n            <\/button>\n            <button type=\"button\" class=\"api-tab\" data-api=\"igdb\" id=\"igdbTab\">\n                <span class=\"api-tab-icon igdb\">I<\/span>\n                IGDB (Twitch)\n                <span class=\"status-dot\" id=\"igdbDot\"><\/span>\n            <\/button>\n        <\/div>\n\n        <!-- RAWG Panel -->\n        <div class=\"api-panel active\" id=\"rawgPanel\">\n            <div class=\"provider-badge\">\n                <div class=\"provider-badge-icon rawg\">R<\/div>\n                <div class=\"provider-badge-text\">\n                    <h3>Base de dados de jogos de v\u00eddeo RAWG<\/h3>\n                    <span>Mais de 500.000 jogos - 20.000 pedidos gratuitos\/m\u00eas<\/span>\n                <\/div>\n            <\/div>\n\n            <div class=\"instructions-box\">\n                <div class=\"instructions-header\">\n                    <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                        <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"\/>\n                        <polyline points=\"14 2 14 8 20 8\"\/>\n                        <line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\"\/>\n                        <line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\"\/>\n                        <polyline points=\"10 9 9 9 8 9\"\/>\n                    <\/svg>\n                    Como obter a sua chave API RAWG gratuita\n                <\/div>\n                <ol>\n                    <li>Ir para <a href=\"https:\/\/rawg.io\/apidocs\" target=\"_blank\" rel=\"noopener\">rawg.io\/apidocs<\/a><\/li>\n                    <li>Clique no bot\u00e3o <strong>\u201cObter chave API\u201d<\/strong> bot\u00e3o<\/li>\n                    <li>Criar uma conta ou iniciar sess\u00e3o com o Google\/GitHub<\/li>\n                    <li>A sua chave API ser\u00e1 apresentada na p\u00e1gina<\/li>\n                    <li>Copie a chave e cole-a abaixo<\/li>\n                <\/ol>\n                <div class=\"tip-box\">\n                    <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                        <circle cx=\"12\" cy=\"12\" r=\"10\"\/>\n                        <line x1=\"12\" y1=\"16\" x2=\"12\" y2=\"12\"\/>\n                        <line x1=\"12\" y1=\"8\" x2=\"12.01\" y2=\"8\"\/>\n                    <\/svg>\n                    <span><strong>Dica profissional:<\/strong> O n\u00edvel gratuito d\u00e1-lhe 20 000 pedidos\/m\u00eas - o suficiente para organizar grandes colec\u00e7\u00f5es!<\/span>\n                <\/div>\n            <\/div>\n\n            <div class=\"input-group\">\n                <div class=\"input-wrapper\" style=\"flex: 2;\">\n                    <label for=\"rawgKeyInput\">Chave API RAWG<\/label>\n                    <input type=\"text\" id=\"rawgKeyInput\" class=\"input-field\" placeholder=\"Cola aqui a tua chave API RAWG...\" autocomplete=\"off\" \/>\n                <\/div>\n                <div class=\"input-wrapper\" style=\"flex: 0; align-self: flex-end;\">\n                    <button type=\"button\" class=\"btn btn-rawg\" id=\"rawgValidateBtn\">\n                        <span id=\"rawgValidateBtnText\">Validar<\/span>\n                    <\/button>\n                <\/div>\n            <\/div>\n            <div id=\"rawgStatus\" class=\"status-message\"><\/div>\n        <\/div>\n\n        <!-- IGDB Panel -->\n        <div class=\"api-panel\" id=\"igdbPanel\">\n            <div class=\"provider-badge\">\n                <div class=\"provider-badge-icon igdb\">I<\/div>\n                <div class=\"provider-badge-text\">\n                    <h3>IGDB - Base de dados de jogos na Internet<\/h3>\n                    <span>Powered by Twitch - Metadados detalhados - 4 pedidos\/segundo<\/span>\n                <\/div>\n            <\/div>\n\n            <div class=\"instructions-box\">\n                <div class=\"instructions-header\">\n                    <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                        <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"\/>\n                        <polyline points=\"14 2 14 8 20 8\"\/>\n                        <line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\"\/>\n                        <line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\"\/>\n                        <polyline points=\"10 9 9 9 8 9\"\/>\n                    <\/svg>\n                    Como obter suas credenciais gratuitas do IGDB\/Twitch\n                <\/div>\n                <ol>\n                    <li>Ir para <a href=\"https:\/\/dev.twitch.tv\/console\" target=\"_blank\" rel=\"noopener\">dev.twitch.tv\/console<\/a><\/li>\n                    <li>Inicie sess\u00e3o com a sua conta Twitch (crie uma gratuitamente, se necess\u00e1rio)<\/li>\n                    <li>Clicar <strong>\u201cRegistar a sua candidatura\u201d<\/strong><\/li>\n                    <li>Preencher o formul\u00e1rio:\n                        <ul>\n                            <li><strong>Nome:<\/strong> Qualquer nome (por exemplo, \u201cO meu organizador de jogos\u201d)<\/li>\n                            <li><strong>URLs de redireccionamento OAuth:<\/strong> <code>https:\/\/localhost<\/code><\/li>\n                            <li><strong>Categoria:<\/strong> Selecionar \u201cIntegra\u00e7\u00e3o de aplica\u00e7\u00f5es\u201d<\/li>\n                        <\/ul>\n                    <\/li>\n                    <li>Clicar <strong>\u201cCriar\u201d<\/strong><\/li>\n                    <li>Clicar <strong>\u201cGerir\u201d<\/strong> na sua nova aplica\u00e7\u00e3o<\/li>\n                    <li>Copiar o seu <strong>ID do cliente<\/strong><\/li>\n                    <li>Clicar <strong>\u201cNovo segredo\u201d<\/strong> e copiar o segredo gerado<\/li>\n                    <li>Cole os dois valores abaixo e clique em <strong>Validar<\/strong><\/li>\n                <\/ol>\n\n                <div style=\"margin-top: 20px; padding: 18px 22px; background: var(--bg-primary); border: 1px solid rgba(255, 170, 0, 0.3); border-radius: 12px;\">\n                    <div style=\"display: flex; align-items: center; gap: 10px; margin-bottom: 12px; color: var(--warning); font-weight: 600; font-size: 0.95rem;\">\n                        <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"width: 20px; height: 20px;\">\n                            <circle cx=\"12\" cy=\"12\" r=\"10\"\/><polyline points=\"12 6 12 12 16 14\"\/>\n                        <\/svg>\n                        Expira\u00e7\u00e3o e atualiza\u00e7\u00e3o de tokens\n                    <\/div>\n                    <p style=\"color: var(--text-secondary); font-size: 0.88rem; line-height: 1.7; margin-bottom: 12px;\">\n                        O seu token de acesso \u00e9 v\u00e1lido durante aproximadamente <strong style=\"color: var(--text-primary);\">60 dias<\/strong>. Quando expirar, ver\u00e1 erros de liga\u00e7\u00e3o durante a digitaliza\u00e7\u00e3o.\n                    <\/p>\n                    <p style=\"color: var(--text-secondary); font-size: 0.88rem; line-height: 1.7; font-weight: 600; margin-bottom: 10px;\">\n                        Para atualizar o seu token:\n                    <\/p>\n                    <ol style=\"margin-left: 20px; color: var(--text-secondary); font-size: 0.88rem; line-height: 1.8;\">\n                        <li>O seu <strong style=\"color: var(--text-primary);\">ID do cliente<\/strong> e <strong style=\"color: var(--text-primary);\">Segredo do cliente<\/strong> nunca expiram - n\u00e3o precisa de novos<\/li>\n                        <li>Basta clicar no bot\u00e3o <strong style=\"color: var(--neon-purple);\">Validar<\/strong> de novo - gera automaticamente um novo token<\/li>\n                        <li>E pronto! A nova ficha est\u00e1 guardada e pronta a ser utilizada<\/li>\n                    <\/ol>\n                    <div style=\"margin-top: 14px; padding: 12px 16px; background: rgba(255, 170, 0, 0.08); border: 1px solid rgba(255, 170, 0, 0.2); border-radius: 8px; font-size: 0.82rem; color: var(--warning); display: flex; align-items: flex-start; gap: 8px;\">\n                        <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"width: 16px; height: 16px; flex-shrink: 0; margin-top: 2px;\">\n                            <circle cx=\"12\" cy=\"12\" r=\"10\"\/>\n                            <line x1=\"12\" y1=\"8\" x2=\"12\" y2=\"12\"\/>\n                            <line x1=\"12\" y1=\"16\" x2=\"12.01\" y2=\"16\"\/>\n                        <\/svg>\n                        <span>Se alguma vez clicar em <strong>\u201cNovo segredo\u201d<\/strong> na consola do Twitch, o teu segredo antigo \u00e9 permanentemente invalidado. Ter\u00e1s de colar o novo segredo aqui e validar novamente. Faz isto apenas se o teu segredo estiver comprometido.<\/span>\n                    <\/div>\n                <\/div>\n                <div class=\"tip-box\">\n                    <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                        <circle cx=\"12\" cy=\"12\" r=\"10\"\/>\n                        <line x1=\"12\" y1=\"16\" x2=\"12\" y2=\"12\"\/>\n                        <line x1=\"12\" y1=\"8\" x2=\"12.01\" y2=\"8\"\/>\n                    <\/svg>\n                    <span><strong>Dica profissional:<\/strong> O IGDB tem excelentes dados sobre os jogos mais recentes e inclui hist\u00f3rias detalhadas, imagens de ecr\u00e3 e v\u00eddeos!<\/span>\n                <\/div>\n            <\/div>\n\n            <div class=\"input-group\">\n                <div class=\"input-wrapper\">\n                    <label for=\"igdbClientId\">ID do cliente Twitch<\/label>\n                    <input type=\"text\" id=\"igdbClientId\" class=\"input-field\" placeholder=\"A sua identifica\u00e7\u00e3o de cliente...\" autocomplete=\"off\" \/>\n                <\/div>\n                <div class=\"input-wrapper\">\n                    <label for=\"igdbClientSecret\">Segredo do cliente Twitch<\/label>\n                    <input type=\"password\" id=\"igdbClientSecret\" class=\"input-field\" placeholder=\"O segredo do seu cliente...\" autocomplete=\"off\" \/>\n                <\/div>\n                <div class=\"input-wrapper\" style=\"flex: 0; align-self: flex-end;\">\n                    <button type=\"button\" class=\"btn btn-igdb\" id=\"igdbValidateBtn\">\n                        <span id=\"igdbValidateBtnText\">Validar<\/span>\n                    <\/button>\n                <\/div>\n            <\/div>\n            <div id=\"igdbStatus\" class=\"status-message\"><\/div>\n        <\/div>\n\n        <!-- Enabled APIs -->\n        <div class=\"enabled-apis\" id=\"enabledApis\">\n            <span class=\"enabled-apis-label\">APIs activas:<\/span>\n            <div id=\"enabledApisList\"><\/div>\n        <\/div>\n\n        <!-- API Mode Selector (only shows when both are connected) -->\n        <div class=\"api-mode-selector\" id=\"apiModeSelector\" style=\"display: none; margin-top: 20px; padding: 20px 25px; background: var(--bg-secondary); border: 1px solid var(--border); border-radius: 14px;\">\n            <h4 style=\"color: var(--neon-purple); margin-bottom: 12px; font-size: 0.95rem; display: flex; align-items: center; gap: 8px;\">\n                <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"width: 18px; height: 18px;\"><circle cx=\"12\" cy=\"12\" r=\"3\"\/><path d=\"M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z\"\/><\/svg>\n                Modo Multi-API\n            <\/h4>\n            <p style=\"color: var(--text-secondary); font-size: 0.85rem; margin-bottom: 15px;\">Tanto o RAWG como o IGDB est\u00e3o ligados. Escolha a forma de os utilizar:<\/p>\n            <div style=\"display: flex; flex-direction: column; gap: 10px;\">\n                <label style=\"display: flex; align-items: flex-start; gap: 12px; cursor: pointer; padding: 12px 16px; background: var(--bg-primary); border: 1px solid var(--border); border-radius: 10px; transition: all 0.3s;\" class=\"api-mode-option\" data-mode=\"merge\">\n                    <input type=\"radio\" name=\"apiMode\" value=\"merge\" checked style=\"accent-color: var(--neon-purple); margin-top: 3px;\">\n                    <div>\n                        <div style=\"color: var(--text-primary); font-weight: 600; font-size: 0.95rem;\">Fundir dados <span style=\"color: var(--success); font-size: 0.8rem; font-weight: 500;\">(Recomendado)<\/span><\/div>\n                        <div style=\"color: var(--text-secondary); font-size: 0.82rem; margin-top: 3px;\">Consulta ambas as APIs e combina os melhores dados de cada uma - melhor imagem, descri\u00e7\u00e3o mais longa, todos os g\u00e9neros combinados, classifica\u00e7\u00e3o mais elevada<\/div>\n                    <\/div>\n                <\/label>\n                <label style=\"display: flex; align-items: flex-start; gap: 12px; cursor: pointer; padding: 12px 16px; background: var(--bg-primary); border: 1px solid var(--border); border-radius: 10px; transition: all 0.3s;\" class=\"api-mode-option\" data-mode=\"best\">\n                    <input type=\"radio\" name=\"apiMode\" value=\"best\" style=\"accent-color: var(--neon-purple); margin-top: 3px;\">\n                    <div>\n                        <div style=\"color: var(--text-primary); font-weight: 600; font-size: 0.95rem;\">Melhor combina\u00e7\u00e3o<\/div>\n                        <div style=\"color: var(--text-secondary); font-size: 0.82rem; margin-top: 3px;\">Consulta ambas as APIs mas escolhe o \u00fanico resultado com a pontua\u00e7\u00e3o de confian\u00e7a de correspond\u00eancia mais elevada<\/div>\n                    <\/div>\n                <\/label>\n                <label style=\"display: flex; align-items: flex-start; gap: 12px; cursor: pointer; padding: 12px 16px; background: var(--bg-primary); border: 1px solid var(--border); border-radius: 10px; transition: all 0.3s;\" class=\"api-mode-option\" data-mode=\"rawg\">\n                    <input type=\"radio\" name=\"apiMode\" value=\"rawg\" style=\"accent-color: var(--neon-purple); margin-top: 3px;\">\n                    <div>\n                        <div style=\"color: var(--text-primary); font-weight: 600; font-size: 0.95rem;\">Apenas RAWG<\/div>\n                        <div style=\"color: var(--text-secondary); font-size: 0.82rem; margin-top: 3px;\">Utilizar apenas RAWG - excelentes imagens de fundo, boas para t\u00edtulos mais recentes<\/div>\n                    <\/div>\n                <\/label>\n                <label style=\"display: flex; align-items: flex-start; gap: 12px; cursor: pointer; padding: 12px 16px; background: var(--bg-primary); border: 1px solid var(--border); border-radius: 10px; transition: all 0.3s;\" class=\"api-mode-option\" data-mode=\"igdb\">\n                    <input type=\"radio\" name=\"apiMode\" value=\"igdb\" style=\"accent-color: var(--neon-purple); margin-top: 3px;\">\n                    <div>\n                        <div style=\"color: var(--text-primary); font-weight: 600; font-size: 0.95rem;\">Apenas IGDB<\/div>\n                        <div style=\"color: var(--text-secondary); font-size: 0.82rem; margin-top: 3px;\">Utilizar apenas o IGDB - resumos e hist\u00f3rias pormenorizados, bons para t\u00edtulos retro<\/div>\n                    <\/div>\n                <\/label>\n            <\/div>\n        <\/div>\n    <\/section>\n\n    <!-- Upload Section -->\n    <section class=\"tool-section\" id=\"uploadSection\">\n        <div class=\"upload-area\">\n            <div class=\"upload-visual\">\n                <svg viewbox=\"0 0 100 100\" fill=\"none\">\n                    <defs>\n                        <lineargradient id=\"uploadGrad\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"100%\">\n                            <stop offset=\"0%\" style=\"stop-color:#00f0ff\"\/>\n                            <stop offset=\"50%\" style=\"stop-color:#bf00ff\"\/>\n                            <stop offset=\"100%\" style=\"stop-color:#ff00aa\"\/>\n                        <\/lineargradient>\n                    <\/defs>\n                    <rect x=\"15\" y=\"25\" width=\"70\" height=\"55\" rx=\"8\" stroke=\"url(#uploadGrad)\" stroke-width=\"2\" fill=\"none\"\/>\n                    <path d=\"M35 45 L50 30 L65 45\" stroke=\"url(#uploadGrad)\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" fill=\"none\"\/>\n                    <line x1=\"50\" y1=\"30\" x2=\"50\" y2=\"60\" stroke=\"url(#uploadGrad)\" stroke-width=\"2\" stroke-linecap=\"round\"\/>\n                    <rect x=\"25\" y=\"15\" width=\"15\" height=\"20\" rx=\"3\" stroke=\"url(#uploadGrad)\" stroke-width=\"1.5\" fill=\"none\" opacity=\"0.5\"\/>\n                    <rect x=\"60\" y=\"15\" width=\"15\" height=\"20\" rx=\"3\" stroke=\"url(#uploadGrad)\" stroke-width=\"1.5\" fill=\"none\" opacity=\"0.5\"\/>\n                <\/svg>\n            <\/div>\n            <h2 class=\"upload-title\">Selecionar a pasta ROM<\/h2>\n            <p class=\"upload-subtitle\">Escolha uma pasta ou ficheiros que contenham os ROMs dos seus jogos. Tudo \u00e9 processado localmente - nada sai do seu computador.<\/p>\n            \n            <!-- ========================================== -->\n            <!-- ROM PATH CONFIGURATION SECTION - NEW -->\n            <!-- ========================================== -->\n            <div class=\"rom-path-section\">\n                <div class=\"rom-path-header\">\n                    <div class=\"rom-path-title\">\n                        <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"width: 20px; height: 20px;\">\n                            <path d=\"M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z\"\/>\n                            <line x1=\"12\" y1=\"11\" x2=\"12\" y2=\"17\"\/>\n                            <line x1=\"9\" y1=\"14\" x2=\"15\" y2=\"14\"\/>\n                        <\/svg>\n                        <span>Caminho da pasta ROM<\/span>\n                    <\/div>\n                    <span class=\"rom-path-hint\">Necess\u00e1rio para a integra\u00e7\u00e3o do emulador e caminhos de ficheiros exactos<\/span>\n                <\/div>\n                \n                <div class=\"rom-path-description\">\n                    <p>Introduzir o <strong>caminho completo do sistema<\/strong> para a sua pasta ROM. Isto assegura que os cat\u00e1logos exportados cont\u00eam caminhos completos que o emulador pode utilizar diretamente.<\/p>\n                <\/div>\n                \n                <div class=\"rom-path-input-group\">\n                    <div class=\"rom-path-input-wrapper\">\n                        <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"rom-path-input-icon\">\n                            <path d=\"M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z\"\/>\n                        <\/svg>\n                        <input type=\"text\" id=\"romBasePath\" \n                               placeholder=\"Por exemplo, D:\\Emula\u00e7\u00e3o\\ROMs ou \/home\/user\/roms\" \n                               class=\"rom-path-input\" \n                               autocomplete=\"off\" \/>\n                    <\/div>\n                    <button type=\"button\" class=\"btn btn-save-path\" id=\"saveRomPath\">\n                        <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                            <path d=\"M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z\"\/>\n                            <polyline points=\"17 21 17 13 7 13 7 21\"\/>\n                            <polyline points=\"7 3 7 8 15 8\"\/>\n                        <\/svg>\n                        Guardar caminho\n                    <\/button>\n                <\/div>\n                \n                <div id=\"romPathStatus\" class=\"rom-path-status\"><\/div>\n                \n                <!-- Shows detected folder structure after file selection -->\n                <div id=\"folderStructureInfo\" class=\"folder-structure-info\" style=\"display: none;\"><\/div>\n                \n                <!-- Shows path preview after base path is set -->\n                <div id=\"pathPreview\" class=\"path-preview\" style=\"display: none;\"><\/div>\n                \n                <div class=\"rom-path-examples\">\n                    <div class=\"example-header\">\n                        <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"width: 14px; height: 14px;\">\n                            <circle cx=\"12\" cy=\"12\" r=\"10\"\/>\n                            <line x1=\"12\" y1=\"16\" x2=\"12\" y2=\"12\"\/>\n                            <line x1=\"12\" y1=\"8\" x2=\"12.01\" y2=\"8\"\/>\n                        <\/svg>\n                        Exemplo de estruturas de pastas:\n                    <\/div>\n                    <div class=\"example-grid\">\n                        <div class=\"example-item\">\n                            <code>D:\\Games\\<\/code>\n                            <span class=\"example-subfolders\">nes\\ snes\\ n64\\ gba\\<\/span>\n                        <\/div>\n                        <div class=\"example-item\">\n                            <code>\/home\/user\/roms\/<\/code>\n                            <span class=\"example-subfolders\">nes\/ snes\/ psx\/<\/span>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n            <!-- END ROM PATH CONFIGURATION SECTION -->\n            \n            <div class=\"upload-buttons\">\n                <button type=\"button\" class=\"btn btn-primary btn-large\" id=\"browseFolderBtn\" disabled>\n                    <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                        <path d=\"M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z\"\/>\n                    <\/svg>\n                    Procurar a pasta\n                <\/button>\n                <button type=\"button\" class=\"btn btn-secondary btn-large\" id=\"browseFilesBtn\" disabled>\n                    <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                        <path d=\"M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z\"\/>\n                        <polyline points=\"13 2 13 9 20 9\"\/>\n                    <\/svg>\n                    Selecionar ROM \u00fanica\n                <\/button>\n            <\/div>\n\n            <input type=\"file\" id=\"folderInput\" class=\"file-input-hidden\" webkitdirectory directory multiple \/>\n            <input type=\"file\" id=\"filesInput\" class=\"file-input-hidden\" multiple accept=\".zip,.7z,.rar,.nes,.sfc,.smc,.gb,.gbc,.gba,.n64,.z64,.v64,.nds,.3ds,.md,.gen,.bin,.sms,.gg,.iso,.cue,.chd,.psx,.pbp,.pce,.a26,.a78,.lnx,.col,.ngp,.ngc,.ws,.wsc,.wad,.wbfs,.fds,.32x,.scd,.gcm,.gcz,.rvz,.wux,.nsp,.xci\" \/>\n\n            <div class=\"security-badge\">\n                <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                    <rect x=\"3\" y=\"11\" width=\"18\" height=\"11\" rx=\"2\" ry=\"2\"\/>\n                    <path d=\"M7 11V7a5 5 0 0 1 10 0v4\"\/>\n                <\/svg>\n                <div>\n        <strong>100% Processamento local - Os seus ficheiros nunca saem do seu computador<\/strong>\n        <p style=\"margin: 4px 0 0 0; font-size: 0.85em; opacity: 0.8;\">\n            O seu navegador pode avisar que os ficheiros ser\u00e3o \u201ccarregados\u201d - esta \u00e9 a formula\u00e7\u00e3o padr\u00e3o do navegador.\n            Os seus ficheiros s\u00e3o processados <em>inteiramente no seu browser<\/em> e s\u00e3o <strong>nunca \u00e9 enviado para nenhum servidor<\/strong>.\n        <\/p>\n    <\/div>\n<\/div>\n        <\/div>\n    <\/section>\n\n    <!-- Progress Section -->\n    <section class=\"tool-section progress-section\" id=\"progressSection\">\n        <div class=\"progress-header\">\n            <div class=\"progress-title\">\n                <span class=\"spinner\"><\/span>\n                Jogos de digitaliza\u00e7\u00e3o e de correspond\u00eancia...\n            <\/div>\n            <span class=\"progress-percent\" id=\"progressPercent\">0%<\/span>\n        <\/div>\n        <div class=\"progress-bar-container\">\n            <div class=\"progress-bar\" id=\"progressBar\"><\/div>\n        <\/div>\n        <div class=\"current-file\" id=\"currentFile\">Preparar...<\/div>\n        <div class=\"progress-stats\">\n            <div class=\"stat-card\">\n                <div class=\"stat-value\" id=\"statTotal\">0<\/div>\n                <div class=\"stat-label\">Ficheiros encontrados<\/div>\n            <\/div>\n            <div class=\"stat-card\">\n                <div class=\"stat-value\" id=\"statProcessed\">0<\/div>\n                <div class=\"stat-label\">Processado<\/div>\n            <\/div>\n            <div class=\"stat-card\">\n                <div class=\"stat-value\" id=\"statMatched\">0<\/div>\n                <div class=\"stat-label\">Emparelhado<\/div>\n            <\/div>\n            <div class=\"stat-card\">\n                <div class=\"stat-value\" id=\"statUnmatched\">0<\/div>\n                <div class=\"stat-label\">Incompar\u00e1vel<\/div>\n            <\/div>\n        <\/div>\n    <\/section>\n\n    <!-- Results Section -->\n<section class=\"results-section\" id=\"resultsSection\">\n    <div class=\"tool-section\" style=\"padding: 25px 35px;\">\n        <div class=\"results-header\">\n            <h2 class=\"results-title\">A sua biblioteca organizada<\/h2>\n        <\/div>\n        \n        <!-- Export Options with Descriptions -->\n        <div class=\"export-options-grid\" style=\"display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 15px; margin: 25px 0;\">\n            \n            <!-- Rec0m88 Catalog - PRIMARY -->\n            <div class=\"export-option\" style=\"background: linear-gradient(135deg, rgba(0, 240, 255, 0.1), rgba(191, 0, 255, 0.1)); border: 2px solid var(--neon-blue); border-radius: 12px; padding: 18px; position: relative;\">\n                <span style=\"position: absolute; top: -10px; right: 15px; background: var(--neon-blue); color: var(--bg-primary); font-size: 0.7rem; font-weight: 700; padding: 3px 10px; border-radius: 20px; text-transform: uppercase;\">Recomendado<\/span>\n                <button type=\"button\" class=\"btn btn-primary\" id=\"exportHtmlBtn\" style=\"width: 100%; margin-bottom: 12px;\">\n                    <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                        <polyline points=\"16 18 22 12 16 6\"\/>\n                        <polyline points=\"8 6 2 12 8 18\"\/>\n                    <\/svg>\n                    Cat\u00e1logo Rec0m88\n                <\/button>\n                <p style=\"color: var(--text-secondary); font-size: 0.82rem; line-height: 1.5; margin: 0;\">\n                    <strong style=\"color: var(--neon-blue);\">O gestor de jogos para o emulador Rec0m88.<\/strong> Navegue pelos seus jogos com arte da caixa, descri\u00e7\u00f5es e lan\u00e7amento direto.\n                <\/p>\n            <\/div>\n            \n            <!-- EmulationStation -->\n            <div class=\"export-option\" style=\"background: var(--bg-secondary); border: 1px solid var(--border); border-radius: 12px; padding: 18px;\">\n                <button type=\"button\" class=\"btn btn-secondary\" id=\"exportEsBtn\" style=\"width: 100%; margin-bottom: 12px;\">\n                    <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                        <rect x=\"2\" y=\"3\" width=\"20\" height=\"14\" rx=\"2\" ry=\"2\"\/>\n                        <line x1=\"8\" y1=\"21\" x2=\"16\" y2=\"21\"\/>\n                        <line x1=\"12\" y1=\"17\" x2=\"12\" y2=\"21\"\/>\n                    <\/svg>\n                    EmulationStation\n                <\/button>\n                <p style=\"color: var(--text-secondary); font-size: 0.82rem; line-height: 1.5; margin: 0;\">\n                    <strong style=\"color: var(--neon-purple);\">Formato XML para RetroArch, Batocera, RetroPie,<\/strong> e outros frontends baseados no EmulationStation.\n                <\/p>\n            <\/div>\n            \n                       <!-- Library Data JSON (new v2 format) -->\n            <div class=\"export-option\" style=\"background: var(--bg-secondary); border: 1px solid var(--border); border-radius: 12px; padding: 18px;\">\n                <button type=\"button\" class=\"btn btn-secondary\" id=\"exportLibraryJsonBtn\" style=\"width: 100%; margin-bottom: 12px;\">\n                    <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                        <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"\/>\n                        <polyline points=\"14 2 14 8 20 8\"\/>\n                    <\/svg>\n                    Biblioteca JSON (v2)\n                <\/button>\n                <p style=\"color: var(--text-secondary); font-size: 0.82rem; line-height: 1.5; margin: 0;\">\n                    <strong style=\"color: var(--neon-cyan);\">Para o emulador e visualizador Rec0m88.<\/strong> O ficheiro de dados que o library-viewer.html carrega.\n                <\/p>\n            <\/div>\n\n            <!-- Legacy JSON -->\n            <div class=\"export-option\" style=\"background: var(--bg-secondary); border: 1px solid var(--border); border-radius: 12px; padding: 18px;\">\n                <button type=\"button\" class=\"btn btn-secondary\" id=\"exportJsonBtn\" style=\"width: 100%; margin-bottom: 12px;\">\n                    <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                        <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"\/>\n                        <polyline points=\"14 2 14 8 20 8\"\/>\n                    <\/svg>\n                    JSON (antigo)\n                <\/button>\n                <p style=\"color: var(--text-secondary); font-size: 0.82rem; line-height: 1.5; margin: 0;\">\n                    <strong style=\"color: var(--neon-purple);\">Dados em bruto para os programadores.<\/strong> Formato plano para ferramentas personalizadas ou importa\u00e7\u00e3o de folhas de c\u00e1lculo.\n                <\/p>\n            <\/div>\n            \n            <!-- CSV -->\n            <div class=\"export-option\" style=\"background: var(--bg-secondary); border: 1px solid var(--border); border-radius: 12px; padding: 18px;\">\n                <button type=\"button\" class=\"btn btn-secondary\" id=\"exportCsvBtn\" style=\"width: 100%; margin-bottom: 12px;\">\n                    <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                        <rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"\/>\n                        <line x1=\"3\" y1=\"9\" x2=\"21\" y2=\"9\"\/>\n                        <line x1=\"9\" y1=\"3\" x2=\"9\" y2=\"21\"\/>\n                    <\/svg>\n                    Folha de c\u00e1lculo CSV\n                <\/button>\n                <p style=\"color: var(--text-secondary); font-size: 0.82rem; line-height: 1.5; margin: 0;\">\n                    <strong style=\"color: var(--neon-purple);\">Abre no Excel ou no Google Sheets.<\/strong> Ideal para visualizar a sua cole\u00e7\u00e3o como uma lista ordenada.\n                <\/p>\n            <\/div>\n        <\/div>\n        \n        <!-- Action Buttons Row -->\n        <div style=\"display: flex; gap: 15px; flex-wrap: wrap; justify-content: center; padding-top: 15px; border-top: 1px solid var(--border);\">\n            <button type=\"button\" class=\"btn btn-primary\" id=\"downloadArtBtn\">\n                <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                    <path d=\"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4\"\/>\n                    <polyline points=\"7 10 12 15 17 10\"\/>\n                    <line x1=\"12\" y1=\"15\" x2=\"12\" y2=\"3\"\/>\n                <\/svg>\n                Transferir a arte da caixa\n            <\/button>\n            <button type=\"button\" class=\"btn btn-secondary\" id=\"resetBtn\">\n                <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                    <polyline points=\"23 4 23 10 17 10\"\/>\n                    <path d=\"M20.49 15a9 9 0 1 1-2.12-9.36L23 10\"\/>\n                <\/svg>\n                Nova digitaliza\u00e7\u00e3o\n            <\/button>\n        <\/div>\n    <\/div>\n\n    <div class=\"filter-tabs\" id=\"filterTabs\">\n        <button type=\"button\" class=\"filter-tab active\" data-filter=\"all\">\n            Todos os jogos <span class=\"count\" id=\"countAll\">0<\/span>\n        <\/button>\n        <button type=\"button\" class=\"filter-tab\" data-filter=\"matched\">\n            Emparelhado <span class=\"count\" id=\"countMatched\">0<\/span>\n        <\/button>\n        <button type=\"button\" class=\"filter-tab\" data-filter=\"unmatched\">\n            \u2717 Incompar\u00e1vel <span class=\"count\" id=\"countUnmatched\">0<\/span>\n        <\/button>\n    <\/div>\n\n    <div class=\"search-box\">\n        <div class=\"search-wrapper\">\n            <svg class=\"search-icon\" viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                <circle cx=\"11\" cy=\"11\" r=\"8\"\/>\n                <line x1=\"21\" y1=\"21\" x2=\"16.65\" y2=\"16.65\"\/>\n            <\/svg>\n            <input type=\"text\" id=\"searchInput\" placeholder=\"Pesquisar na sua biblioteca...\" \/>\n        <\/div>\n    <\/div>\n\n    <div class=\"games-grid\" id=\"gamesGrid\"><\/div>\n<\/section>\n\n<!-- Merge Catalogs Section -->\n<section class=\"tool-section\" id=\"mergeSection\">\n    <div class=\"section-header\">\n        <div class=\"section-icon\" style=\"background: linear-gradient(135deg, rgba(191, 0, 255, 0.1), rgba(255, 0, 170, 0.1)); border-color: rgba(191, 0, 255, 0.3);\">\n            <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"url(#mergeIconGrad)\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                <defs>\n                    <lineargradient id=\"mergeIconGrad\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"100%\">\n                        <stop offset=\"0%\" style=\"stop-color:#bf00ff\"\/>\n                        <stop offset=\"100%\" style=\"stop-color:#ff00aa\"\/>\n                    <\/lineargradient>\n                <\/defs>\n                <path d=\"M8 6h13\"\/><path d=\"M8 12h13\"\/><path d=\"M8 18h13\"\/><path d=\"M3 6h.01\"\/><path d=\"M3 12h.01\"\/><path d=\"M3 18h.01\"\/>\n            <\/svg>\n        <\/div>\n        <div>\n            <div class=\"section-title\" style=\"background: linear-gradient(135deg, var(--neon-purple), var(--neon-pink)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;\">Fundir ficheiros Rec0m88 JSON<\/div>\n            <div class=\"section-subtitle\">Combinar v\u00e1rios ficheiros de cat\u00e1logo exportados numa cole\u00e7\u00e3o unificada<\/div>\n        <\/div>\n    <\/div>\n    <p style=\"color: var(--text-secondary); margin-bottom: 20px; font-size: 0.95rem; line-height: 1.6;\">\n        Tem v\u00e1rias exporta\u00e7\u00f5es do cat\u00e1logo Rec0m88 de diferentes sess\u00f5es de digitaliza\u00e7\u00e3o? Selecione-as todas e junte-as num \u00fanico ficheiro organizado com dete\u00e7\u00e3o autom\u00e1tica de duplicados.\n    <\/p>\n    <div style=\"display: flex; gap: 15px; align-items: center; flex-wrap: wrap;\">\n        <button type=\"button\" class=\"btn btn-secondary\" id=\"openMergeBtn\">\n            <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                <path d=\"M8 6h13\"\/><path d=\"M8 12h13\"\/><path d=\"M8 18h13\"\/><path d=\"M3 6h.01\"\/><path d=\"M3 12h.01\"\/><path d=\"M3 18h.01\"\/>\n            <\/svg>\n            Selecionar e fundir cat\u00e1logos\n        <\/button>\n        <span style=\"color: var(--text-muted); font-size: 0.85rem;\">N\u00e3o \u00e9 necess\u00e1ria nenhuma chave API - funciona com qualquer ficheiro HTML exportado<\/span>\n    <\/div>\n    <input type=\"file\" id=\"mergeFilesInput\" class=\"file-input-hidden\" multiple accept=\".json\" \/>\n<\/section>\n<\/div>\n\n<!-- Toast Container -->\n<div class=\"toast-container\" id=\"toastContainer\"><\/div>\n\n<!-- Game Detail Modal -->\n<div class=\"modal-overlay\" id=\"gameModal\">\n    <div class=\"modal\">\n        <div class=\"modal-header\">\n            <h3 id=\"modalTitle\">Detalhes do jogo<\/h3>\n            <button type=\"button\" class=\"modal-close\" id=\"modalCloseBtn\">\u00d7<\/button>\n        <\/div>\n        <div class=\"modal-body\" id=\"modalBody\"><\/div>\n    <\/div>\n<\/div>\n\n<!-- Merge Catalogs Modal -->\n<div class=\"modal-overlay\" id=\"mergeModal\">\n    <div class=\"modal\" style=\"max-width: 750px;\">\n        <div class=\"modal-header\">\n            <h3 id=\"mergeModalTitle\">Fundir cat\u00e1logos HTML<\/h3>\n            <button type=\"button\" class=\"modal-close\" id=\"mergeModalCloseBtn\">\u00d7<\/button>\n        <\/div>\n        <div class=\"modal-body\" id=\"mergeModalBody\">\n            <div style=\"text-align: center; padding: 20px 0 30px;\">\n                <div style=\"width: 80px; height: 80px; margin: 0 auto 20px; position: relative;\">\n                    <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"url(#mergeGrad)\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"width: 100%; height: 100%;\">\n                        <defs>\n                            <lineargradient id=\"mergeGrad\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"100%\">\n                                <stop offset=\"0%\" style=\"stop-color:#bf00ff\"\/>\n                                <stop offset=\"100%\" style=\"stop-color:#ff00aa\"\/>\n                            <\/lineargradient>\n                        <\/defs>\n                        <rect x=\"2\" y=\"3\" width=\"7\" height=\"9\" rx=\"1.5\"\/>\n                        <rect x=\"15\" y=\"3\" width=\"7\" height=\"9\" rx=\"1.5\"\/>\n                        <rect x=\"8.5\" y=\"14\" width=\"7\" height=\"9\" rx=\"1.5\"\/>\n                        <path d=\"M5.5 12 L9.5 14\"\/>\n                        <path d=\"M18.5 12 L14.5 14\"\/>\n                    <\/svg>\n                <\/div>\n                <h3 style=\"font-size: 1.3rem; margin-bottom: 10px; background: linear-gradient(135deg, var(--neon-purple), var(--neon-pink)); -webkit-background-clip: text; -webkit-text-fill-color: transparent;\">Combinar v\u00e1rios cat\u00e1logos<\/h3>\n                <p style=\"color: var(--text-secondary); max-width: 450px; margin: 0 auto 25px; font-size: 0.95rem; line-height: 1.6;\">\n                    Selecione todos os seus ficheiros de cat\u00e1logo JSON exportados. As duplica\u00e7\u00f5es s\u00e3o automaticamente detectadas e removidas.\n                <\/p>\n                <button type=\"button\" class=\"btn btn-primary\" id=\"selectMergeFilesBtn\">\n                    <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                        <path d=\"M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z\"\/>\n                        <polyline points=\"13 2 13 9 20 9\"\/>\n                    <\/svg>\n                    Selecionar ficheiros Recom88 JSON\n                <\/button>\n            <\/div>\n\n            <div id=\"mergeFilesList\" style=\"display: none; margin-bottom: 25px;\">\n                <div style=\"display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px;\">\n                    <h4 style=\"color: var(--neon-blue); font-size: 1rem;\">Ficheiros carregados<\/h4>\n                    <button type=\"button\" class=\"btn btn-secondary\" id=\"addMoreFilesBtn\" style=\"padding: 8px 16px; font-size: 0.85rem;\">\n                        + Adicionar mais ficheiros\n                    <\/button>\n                <\/div>\n                <div id=\"mergeFilesListInner\" style=\"max-height: 200px; overflow-y: auto; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-secondary);\"><\/div>\n            <\/div>\n\n            <div id=\"mergeStats\" style=\"display: none; margin-bottom: 25px;\">\n                <div style=\"display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 12px;\">\n                    <div class=\"stat-card\">\n                        <div class=\"stat-value\" id=\"mergeStatFiles\">0<\/div>\n                        <div class=\"stat-label\">Ficheiros<\/div>\n                    <\/div>\n                    <div class=\"stat-card\">\n                        <div class=\"stat-value\" id=\"mergeStatTotal\">0<\/div>\n                        <div class=\"stat-label\">Total de jogos<\/div>\n                    <\/div>\n                    <div class=\"stat-card\">\n                        <div class=\"stat-value\" id=\"mergeStatUnique\">0<\/div>\n                        <div class=\"stat-label\">\u00danico<\/div>\n                    <\/div>\n                    <div class=\"stat-card\">\n                        <div class=\"stat-value\" id=\"mergeStatDupes\">0<\/div>\n                        <div class=\"stat-label\">Duplicados<\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n            <div id=\"mergeDupeOptions\" style=\"display: none; margin-bottom: 25px; padding: 20px; background: var(--bg-secondary); border: 1px solid var(--border); border-radius: 12px;\">\n                <h4 style=\"color: var(--neon-pink); margin-bottom: 12px; font-size: 0.95rem;\">Tratamento de duplicados<\/h4>\n                <p style=\"color: var(--text-secondary); font-size: 0.85rem; margin-bottom: 15px;\">Quando o mesmo jogo aparece em v\u00e1rios ficheiros:<\/p>\n                <label style=\"display: flex; align-items: center; gap: 10px; cursor: pointer; margin-bottom: 10px; color: var(--text-primary); font-size: 0.95rem;\">\n                    <input type=\"radio\" name=\"dupeStrategy\" value=\"best\" checked style=\"accent-color: var(--neon-purple);\"> Manter a que tiver os melhores metadados (mais informa\u00e7\u00f5es, caixa de correio)\n                <\/label>\n                <label style=\"display: flex; align-items: center; gap: 10px; cursor: pointer; margin-bottom: 10px; color: var(--text-primary); font-size: 0.95rem;\">\n                    <input type=\"radio\" name=\"dupeStrategy\" value=\"first\" style=\"accent-color: var(--neon-purple);\"> Manter a partir do ficheiro mais antigo carregado\n                <\/label>\n                <label style=\"display: flex; align-items: center; gap: 10px; cursor: pointer; color: var(--text-primary); font-size: 0.95rem;\">\n                    <input type=\"radio\" name=\"dupeStrategy\" value=\"all\" style=\"accent-color: var(--neon-purple);\"> Manter tudo (sem desduplica\u00e7\u00e3o)\n                <\/label>\n            <\/div>\n\n            <div id=\"mergeProgress\" style=\"display: none; margin-bottom: 25px;\">\n                <div style=\"display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px;\">\n                    <span style=\"display: flex; align-items: center; gap: 10px; color: var(--text-primary);\"><span class=\"spinner\"><\/span> Fus\u00e3o...<\/span>\n                    <span id=\"mergeProgressPercent\" style=\"color: var(--neon-blue); font-weight: 700;\">0%<\/span>\n                <\/div>\n                <div class=\"progress-bar-container\">\n                    <div class=\"progress-bar\" id=\"mergeProgressBar\" style=\"width: 0%;\"><\/div>\n                <\/div>\n                <div id=\"mergeProgressFile\" style=\"margin-top: 10px; color: var(--text-secondary); font-size: 0.9rem;\"><\/div>\n            <\/div>\n\n            <div id=\"mergeActions\" style=\"display: none; text-align: center; padding-top: 10px;\">\n                <button type=\"button\" class=\"btn btn-primary btn-large\" id=\"executeMergeBtn\">\n                    <svg viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                        <path d=\"M8 6h13\"\/><path d=\"M8 12h13\"\/><path d=\"M8 18h13\"\/><path d=\"M3 6h.01\"\/><path d=\"M3 12h.01\"\/><path d=\"M3 18h.01\"\/>\n                    <\/svg>\n                    Fundir e descarregar o cat\u00e1logo combinado\n                <\/button>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/div>\n<\/body>\n<\/body>\n<\/html>","protected":false},"excerpt":{"rendered":"<p>Free Game Library Organizer &#038; ROM Metadata Scraper | NES, SNES, Genesis, N64 ROMs &#038; More| rec0m88.com Rec0m88 Game Library Organizer &#038; ROM Metadata Scraper Identify your ROMs, fetch box art, descriptions, and ratings from IGDB &#038; RAWG \u2014 then download everything as organized files ready for Rec0m88 and other emulator frontends. 100% local and&#8230;<\/p>","protected":false},"author":1,"featured_media":245,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","footnotes":""},"class_list":["post-8332","page","type-page","status-publish","has-post-thumbnail","hentry"],"_links":{"self":[{"href":"https:\/\/rec0m88.com\/pt\/wp-json\/wp\/v2\/pages\/8332","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rec0m88.com\/pt\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/rec0m88.com\/pt\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/rec0m88.com\/pt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rec0m88.com\/pt\/wp-json\/wp\/v2\/comments?post=8332"}],"version-history":[{"count":5,"href":"https:\/\/rec0m88.com\/pt\/wp-json\/wp\/v2\/pages\/8332\/revisions"}],"predecessor-version":[{"id":8360,"href":"https:\/\/rec0m88.com\/pt\/wp-json\/wp\/v2\/pages\/8332\/revisions\/8360"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/rec0m88.com\/pt\/wp-json\/wp\/v2\/media\/245"}],"wp:attachment":[{"href":"https:\/\/rec0m88.com\/pt\/wp-json\/wp\/v2\/media?parent=8332"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}