{"id":8387,"date":"2025-12-17T17:51:30","date_gmt":"2025-12-17T17:51:30","guid":{"rendered":"https:\/\/elinformatico.cat\/?page_id=8387"},"modified":"2026-05-12T04:44:09","modified_gmt":"2026-05-12T04:44:09","slug":"radar","status":"publish","type":"page","link":"https:\/\/elinformatico.cat\/ca\/radar\/","title":{"rendered":"EL RADAR"},"content":{"rendered":"<style>\n    \/* === MODO APP: OCULTAR INTERFAZ WORDPRESS === *\/\n    \n    \/* Ocultar Cabeceras y Men\u00fas *\/\n    header, \n    #masthead, \n    .site-header, \n    .elementor-location-header,\n    .ast-main-header-wrap, \/* Astra *\/\n    .fusion-header-wrapper, \/* Avada *\/\n    #header-outer, \/* Salient *\/\n    \n    \/* Ocultar Pie de P\u00e1gina *\/\n    footer, \n    #colophon, \n    .site-footer, \n    .elementor-location-footer,\n    \n    \/* Ocultar Barra de Admin Superior (Barra negra) *\/\n    #wpadminbar {\n        display: none !important;\n    }\n\n    \/* Correcci\u00f3n para que la p\u00e1gina suba hasta arriba del todo *\/\n    html { \n        margin-top: 0 !important; \n    }\n    \n    body {\n        padding: 0 !important;\n        margin: 0 !important;\n        background: #000A28; \/* Ponemos el color de fondo de tu app para evitar flashes blancos *\/\n    }\n<\/style>\n\n\n\n<style>\n  :root {\n    \/* --- PALETA --- *\/\n    --brand-blue: #00069F;\n    --brand-green: #B8EF02;\n    --brand-white: #FFFBF1;\n    \n    --bg-gradient-start: #00069F;\n    --bg-gradient-end: #00046b; \n    \n    --msg-user-bg: var(--brand-green);\n    --msg-user-text: var(--brand-blue);\n    \n    --msg-bot-bg: var(--brand-white);\n    --msg-bot-text: var(--brand-blue);\n    \n    --text-dim: rgba(255, 251, 241, 0.7);\n  }\n\n  \/* Animaciones *\/\n  @keyframes border-flow {\n    0% { background-position: 0% 50%; }\n    50% { background-position: 100% 50%; }\n    100% { background-position: 0% 50%; }\n  }\n  @keyframes pulse-green { 0% { opacity:1; } 50% { opacity:0.5; } 100% { opacity:1; } }\n  @keyframes fadeInUp { from {opacity:0; transform:translateY(10px);} to {opacity:1; transform:translateY(0);} }\n  @keyframes shake { 0% { transform: translateX(0); } 25% { transform: translateX(-5px); } 75% { transform: translateX(5px); } 100% { transform: translateX(0); } }\n\n  \/* WIDGET PRINCIPAL *\/\n  #chat-widget {\n    width: 95%;\n    max-width: 1100px;\n    height: 480px; \/* ESCRITORIO: 480px *\/\n    margin: 30px auto;\n    background: linear-gradient(180deg, var(--bg-gradient-start) 0%, var(--bg-gradient-end) 100%);\n    border-radius: 20px;\n    box-shadow: 0 20px 60px -10px rgba(0, 6, 159, 0.6), 0 0 0 1px rgba(255, 255, 255, 0.1);\n    border: 1px solid rgba(255,255,255,0.1);\n    display: flex;\n    flex-direction: column;\n    font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;\n    overflow: hidden;\n    position: relative;\n    color: var(--brand-white);\n  }\n\n  @media (max-width: 768px) {\n    #chat-widget { height: 600px; margin: 10px auto; width: 98%; border-radius: 16px; }\n    \/* Ocultamos el subtitulo en movil para que no rompa el dise\u00f1o *\/\n    .header-subtitle { display: none; }\n  }\n\n  \/* --- NUEVO: DISCLAIMER OVERLAY --- *\/\n  #disclaimer-overlay {\n    position: absolute; top: 0; left: 0; width: 100%; height: 100%;\n    background: rgba(0, 6, 159, 0.4); \/* Fondo semitransparente azulado *\/\n    backdrop-filter: blur(6px); \/* EL EFECTO DIFUMINADO *\/\n    z-index: 100;\n    display: flex; justify-content: center; align-items: center;\n    transition: all 0.5s ease-in-out;\n  }\n  \n  #disclaimer-overlay.hidden {\n    opacity: 0;\n    pointer-events: none;\n    backdrop-filter: blur(0px);\n  }\n\n  .disclaimer-box {\n    background: #fff;\n    color: var(--brand-blue);\n    padding: 30px;\n    border-radius: 16px;\n    max-width: 400px;\n    text-align: center;\n    border: 3px solid var(--brand-green);\n    box-shadow: 0 15px 50px rgba(0,0,0,0.5);\n    animation: fadeInUp 0.5s ease-out;\n  }\n\n  .disclaimer-icon { font-size: 2.5rem; display: block; margin-bottom: 10px; }\n  .disclaimer-title { font-size: 1.2rem; font-weight: 900; text-transform: uppercase; margin: 0 0 10px 0; color: var(--brand-blue); }\n  .disclaimer-text { font-size: 0.95rem; line-height: 1.5; color: #444; margin-bottom: 20px; }\n  .highlight-warn { background: #ffeeba; padding: 2px 5px; border-radius: 4px; font-weight: bold; }\n\n  .btn-accept {\n    background: var(--brand-green); color: var(--brand-blue); border: none;\n    padding: 12px 25px; border-radius: 50px; font-weight: 900;\n    text-transform: uppercase; cursor: pointer; font-size: 0.9rem;\n    box-shadow: 0 5px 15px rgba(184, 239, 2, 0.4);\n    transition: transform 0.2s;\n  }\n  .btn-accept:hover { transform: scale(1.05); }\n\n  \/* --- HEADER CHAT --- *\/\n  #chat-header {\n    background: rgba(0, 4, 107, 0.5); padding: 18px 25px;\n    border-bottom: 1px solid rgba(255,255,255,0.1);\n    display: flex; justify-content: space-between; align-items: center;\n  }\n  .header-left { display: flex; align-items: center; gap: 12px; }\n  .header-title { color: var(--brand-white); font-weight: 800; letter-spacing: 1px; font-size: 16px; text-transform: uppercase; display: flex; align-items: center; gap: 10px; }\n  \n  \/* ESTILO PARA EL NUEVO TEXTO SUTIL *\/\n  .header-subtitle { \n      color: var(--brand-green); \n      font-size: 10px; \n      margin-left: 10px; \n      font-weight: 600; \n      text-transform: uppercase; \n      letter-spacing: 0.5px;\n      opacity: 0.9;\n  }\n\n  .lock-icon { width: 18px; height: 18px; stroke: var(--brand-green); stroke-width: 2.5; filter: drop-shadow(0 0 5px rgba(184, 239, 2, 0.5)); }\n  .status-dot { width: 10px; height: 10px; background: var(--brand-green); border-radius: 50%; box-shadow: 0 0 10px var(--brand-green); animation: pulse-green 2s infinite; }\n\n  \/* --- LOG --- *\/\n  #log {\n    flex: 1; overflow-y: auto; padding: 30px;\n    display: flex; flex-direction: column; gap: 20px;\n    scroll-behavior: smooth;\n    scrollbar-width: thin; scrollbar-color: var(--brand-green) transparent;\n  }\n  #log::-webkit-scrollbar { width: 6px; }\n  #log::-webkit-scrollbar-track { background: transparent; }\n  #log::-webkit-scrollbar-thumb { background-color: var(--brand-green); border-radius: 10px; }\n\n  \/* --- MENSAJES --- *\/\n  .message { \n    max-width: 85%; padding: 18px 24px; border-radius: 18px; \n    font-size: 15px; line-height: 1.5; animation: fadeInUp 0.4s ease-out;\n    box-shadow: 0 4px 15px rgba(0,0,0,0.1); position: relative;\n  }\n  .msg-user { align-self: flex-end; background: var(--brand-green); color: var(--brand-blue); font-weight: 600; border-bottom-right-radius: 4px; }\n  .msg-bot { align-self: flex-start; background: var(--brand-white); color: var(--brand-blue); border-bottom-left-radius: 4px; }\n  .msg-bot strong { color: #00046b; font-weight: 800; }\n\n  \/* --- INPUT --- *\/\n  #input-area {\n    padding: 20px; background: rgba(0, 4, 107, 0.3);\n    border-top: 1px solid rgba(255,255,255,0.1);\n    display: flex; gap: 12px; align-items: center;\n  }\n  #msg {\n    flex: 1; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255,255,255,0.2);\n    color: var(--brand-white); padding: 14px 20px; border-radius: 10px; outline: none;\n    font-size: 15px; transition: all 0.3s;\n  }\n  #msg::placeholder { color: rgba(255,251,241, 0.5); }\n  #msg:focus { border-color: var(--brand-green); background: rgba(255, 255, 255, 0.15); box-shadow: 0 0 15px rgba(184, 239, 2, 0.1); }\n\n  #send-btn { \n    background: var(--brand-green); color: var(--brand-blue); border: none; \n    padding: 0 25px; height: 48px; font-weight: 900; cursor: pointer; \n    border-radius: 10px; font-size: 14px; letter-spacing: 1px; text-transform: uppercase;\n    transition: all 0.3s; box-shadow: 0 4px 15px rgba(184, 239, 2, 0.3);\n  }\n  #send-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(184, 239, 2, 0.5); }\n\n  \/* --- FOOTER --- *\/\n  #security-footer {\n    background: rgba(0, 0, 0, 0.2); padding: 15px 25px;\n    display: flex; justify-content: space-between; align-items: center;\n    font-size: 12px; color: var(--text-dim); border-top: 1px solid rgba(255,255,255,0.05);\n  }\n  .neon-capsule {\n    position: relative; background: rgba(0, 4, 107, 0.6); border-radius: 30px; padding: 2px;\n    display: flex; align-items: center; justify-content: center; box-shadow: 0 5px 15px rgba(0,0,0,0.3);\n  }\n  .neon-capsule::before {\n    content: \"\"; position: absolute; top: 0; left: 0; right: 0; bottom: 0; border-radius: 30px;\n    background: linear-gradient(90deg, var(--brand-blue), var(--brand-green), var(--brand-blue));\n    background-size: 200% 200%; animation: border-flow 4s linear infinite; z-index: -1;\n  }\n  .capsule-content {\n    background: rgba(0, 0, 0, 0.6); border-radius: 28px; padding: 6px 16px;\n    display: flex; align-items: center; gap: 8px; width: 100%; height: 100%;\n  }\n  #timer-container { color: #ff6b6b; font-weight: 700; font-size: 13px; }\n  #info-btn {\n    background: transparent; color: var(--brand-white); border: none; cursor: pointer;\n    font-size: 11px; font-weight: 700; display: flex; align-items: center; gap: 6px;\n    text-transform: uppercase; letter-spacing: 0.5px;\n  }\n  #info-btn svg { stroke: var(--brand-green); }\n\n  \/* --- INFO PANEL --- *\/\n  #info-panel {\n    display: none; background: rgba(0, 6, 159, 0.95); color: var(--brand-white);\n    padding: 20px 25px; font-size: 14px; position: absolute; bottom: 70px; \n    left: 20px; right: 20px; z-index: 10; border-radius: 16px;\n    border: 1px solid var(--brand-green); box-shadow: 0 0 20px rgba(184, 239, 2, 0.2), 0 10px 40px rgba(0,0,0,0.5);\n    backdrop-filter: blur(10px); animation: fadeInUp 0.3s ease-out;\n  }\n  #info-panel ul { list-style: none; padding: 0; margin: 0; }\n  #info-panel li { margin-bottom: 12px; display: flex; align-items: center; gap: 10px; font-weight: 600;}\n<\/style>\n\n<div id=\"chat-widget\">\n  \n  <div id=\"disclaimer-overlay\">\n      <div class=\"disclaimer-box\">\n          <span class=\"disclaimer-icon\">\u23f1\ufe0f<\/span>\n          <h3 class=\"disclaimer-title\">Sesi\u00f3n Privada Extendida<\/h3>\n          <p class=\"disclaimer-text\">\n              Por motivos de seguridad, esta auditor\u00eda se <strong>autodestruir\u00e1 en 40 minutos<\/strong>.<br><br>\n              \u26a0\ufe0f <span class=\"highlight-warn\">NO REFRESCAR LA P\u00c1GINA<\/span><br>\n              Si recargas, perder\u00e1s el progreso y tendr\u00e1s que empezar de cero.\n          <\/p>\n          <button class=\"btn-accept\" onclick=\"acceptDisclaimer()\">ENTENDIDO, ACCEDER<\/button>\n      <\/div>\n  <\/div>\n\n  <div id=\"chat-header\">\n    <div class=\"header-left\">\n      <span class=\"status-dot\"><\/span>\n      <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"lock-icon\" viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"11\" width=\"18\" height=\"11\" rx=\"2\" ry=\"2\"><\/rect><path d=\"M7 11V7a5 5 0 0 1 10 0v4\"><\/path><\/svg>\n      <span class=\"header-title\">RADAR SECURITY \/ AUDIT<\/span>\n      <span class=\"header-subtitle\">Validamos Seguridad \u00b7 No Distribuimos<\/span>\n    <\/div>\n    <div style=\"font-size:11px; color:var(--text-dim); font-weight:600;\">ENCRYPTED v16.1<\/div>\n  <\/div>\n\n  <div id=\"log\">\n    <div class=\"message msg-bot\" id=\"intro-msg\">\n      <strong>\u26a0\ufe0f SISTEMA DE AUDITOR\u00cdA BLOQUEADO<\/strong><br><br>\n      Para desbloquear, introduce tu <strong>LLAVE MAESTRA<\/strong>.<br>\n      (B\u00fascala en tu email (mira en SPAM) o en tu perfil en secci\u00f3n descargas).<br><br>\n      <em>Introduce la LLAVE MAESTRA abajo para comenzar:<\/em>\n    <\/div>\n  <\/div>\n\n  <div id=\"info-panel\">\n    <ul>\n      <li>\ud83d\udee1\ufe0f <strong>NO LOGS:<\/strong> Este chat no guarda historial. Privacidad total.<\/li>\n      <li>\u23f1\ufe0f <strong>40 MIN:<\/strong> La sesi\u00f3n se autodestruye al acabar el contador.<\/li>\n      <li>\ud83d\udcac <strong>1 MENSAJE:<\/strong> Escribe tu consulta completa en un solo env\u00edo.<\/li>\n    <\/ul>\n  <\/div>\n\n  <div id=\"input-area\">\n    <input id=\"msg\" type=\"text\" placeholder=\"Escribe aqu\u00ed tu consulta segura...\" autocomplete=\"off\">\n    <button id=\"send-btn\" onclick=\"handleInput()\">ENVIAR<\/button>\n  <\/div>\n\n  <div id=\"security-footer\">\n    <div class=\"neon-capsule\">\n        <div class=\"capsule-content\" id=\"timer-container\">\n            <span class=\"blink-alert\">\u26a0\ufe0f<\/span> EXPIRACI\u00d3N: <span id=\"timer\" style=\"margin-left:5px;\">40:00<\/span>\n        <\/div>\n    <\/div>\n\n    <div class=\"neon-capsule\">\n        <div class=\"capsule-content\">\n            <button id=\"info-btn\" onclick=\"toggleInfo()\">\n                <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"14\" height=\"14\" viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"12\" cy=\"12\" r=\"10\"><\/circle><line x1=\"12\" y1=\"16\" x2=\"12\" y2=\"12\"><\/line><line x1=\"12\" y1=\"8\" x2=\"12.01\" y2=\"8\"><\/line><\/svg>\n                INFO SEGURIDAD\n            <\/button>\n        <\/div>\n    <\/div>\n  <\/div>\n<\/div>\n\n<script>\n\/\/ --- CONFIGURACI\u00d3N SEGURA ---\nconst secretKeyNormalized = 'elinformaticohelp'; \n\nlet isVerified = false;\nlet chatHistory = []; \n\nconst input = document.getElementById('msg');\nconst log = document.getElementById('log');\nconst timerDisplay = document.getElementById('timer');\nconst infoPanel = document.getElementById('info-panel');\n\n\/\/ FUNCION PARA ACEPTAR DISCLAIMER\nfunction acceptDisclaimer() {\n    document.getElementById('disclaimer-overlay').classList.add('hidden');\n    input.focus();\n}\n\ninput.addEventListener(\"keypress\", (e) => { if(e.key === \"Enter\") { e.preventDefault(); handleInput(); }});\n\nfunction toggleInfo() {\n  if (infoPanel.style.display === 'block') { infoPanel.style.display = 'none'; } else { infoPanel.style.display = 'block'; }\n}\n\nfunction handleInput() {\n  const text = input.value.trim();\n  if (!text) return;\n\n  if (!document.getElementById('disclaimer-overlay').classList.contains('hidden')) {\n      alert(\"Por favor, acepta el aviso de seguridad primero.\");\n      return;\n  }\n\n  input.value = '';\n  input.focus();\n  infoPanel.style.display = 'none';\n\n  if (!isVerified) {\n    checkPassword(text);\n  } else {\n    sendMessageToAI(text);\n  }\n}\n\n\/\/ --- L\u00d3GICA DE CONTRASE\u00d1A FLEXIBLE ---\nfunction checkPassword(key) {\n  addVisualMessage(key, 'user'); \n\n  \/\/ Comparamos convirtiendo todo a min\u00fasculas\n  if (key.toLowerCase() === secretKeyNormalized) {\n    isVerified = true;\n    setTimeout(() => {\n      \/\/ OBTENER FECHA ACTUAL PARA EL MENSAJE VISUAL\n      const fecha = new Date();\n      const opciones = { year: 'numeric', month: 'long' };\n      const fechaTexto = fecha.toLocaleDateString('es-ES', opciones);\n\n      const welcomeMsg = `\u2705 <strong>ACCESO AUTORIZADO<\/strong><br><br>\n      \ud83d\udee1\ufe0f <strong>PROTOCOLO EXTENDIDO (${fechaTexto})<\/strong><br><br>\n      1. Tienes <strong>40 MINUTOS<\/strong> para realizar la instalaci\u00f3n.<br>\n      2. Si usas <strong>MAC<\/strong>: Clic derecho > \"Mostrar contenido paquete\" (Te guiar\u00e9).<br>\n      3. Si el enlace falla, buscaremos alternativas en FileCR.<br><br>\n      \ud83d\udc49 Escribe <strong>EMPEZAR<\/strong> para iniciar el asistente.`;\n      \n      addVisualMessage(welcomeMsg, 'bot');\n    }, 600);\n  } else {\n    setTimeout(() => {\n      addVisualMessage(\"\u26d4 <strong>CLAVE INCORRECTA<\/strong>. Comprueba que la has escrito bien.\", 'bot');\n    }, 400);\n  }\n}\n\nasync function sendMessageToAI(text) {\n  addVisualMessage(text, 'user');\n  chatHistory.push({ role: 'user', text: text });\n\n  const loadingId = 'loading-' + Date.now();\n  const loadingDiv = document.createElement('div');\n  loadingDiv.className = 'message msg-bot';\n  loadingDiv.id = loadingId;\n  loadingDiv.innerHTML = '<em>Consultando base de datos segura...<\/em>';\n  log.appendChild(loadingDiv);\n  log.scrollTop = log.scrollHeight;\n\n  try {\n    \/\/ \u2b07\ufe0f\u2b07\ufe0f\u2b07\ufe0f URL CONFIGURADA A TU WORKER \u2b07\ufe0f\u2b07\ufe0f\u2b07\ufe0f\n    const workerUrl = 'https:\/\/radar-ia-backend.el1ntk0team.workers.dev\/'; \n    \/\/ \u2b06\ufe0f\u2b06\ufe0f\u2b06\ufe0f\n\n    const res = await fetch(workerUrl, {\n      method: 'POST',\n      headers: {'Content-Type': 'application\/json'},\n      body: JSON.stringify({ history: chatHistory }) \n    });\n\n    const data = await res.json();\n    document.getElementById(loadingId).remove();\n    addVisualMessage(data.reply, 'bot');\n    chatHistory.push({ role: 'model', text: data.reply });\n\n  } catch (err) {\n    document.getElementById(loadingId).remove();\n    addVisualMessage(\"\u26a0\ufe0f Error de conexi\u00f3n. Int\u00e9ntalo de nuevo.\", 'bot');\n  }\n}\n\nfunction addVisualMessage(text, role) {\n  const div = document.createElement('div');\n  div.className = `message msg-${role}`;\n  div.innerHTML = text.replace(\/\\*\\*(.*?)\\*\\*\/g, '<strong>$1<\/strong>').replace(\/\\n\/g, '<br>');\n  log.appendChild(div);\n  log.scrollTop = log.scrollHeight;\n}\n\n\/\/ TIMER (40 MINUTOS = 2400 SEGUNDOS)\nlet timeLeft = 2400; \nconst timerInterval = setInterval(() => {\n  timeLeft--;\n  const m = Math.floor(timeLeft \/ 60);\n  const s = timeLeft % 60;\n  timerDisplay.textContent = `${m}:${s < 10 ? '0' : ''}${s}`;\n\n  if (timeLeft <= 0) {\n    clearInterval(timerInterval);\n    log.innerHTML = `<div class=\"message msg-bot\" style=\"color:red; text-align:center;\">\ud83d\uded1 SESI\u00d3N DE SEGURIDAD FINALIZADA.<\/div>`;\n    input.disabled = true;\n    document.getElementById('timer-container').style.color = 'red';\n  }\n}, 1000);\n<\/script>","protected":false},"excerpt":{"rendered":"<p>\u23f1\ufe0f Sesi\u00f3n Privada Extendida Por motivos de seguridad, esta auditor\u00eda se autodestruir\u00e1 en 40 minutos. \u26a0\ufe0f NO REFRESCAR LA P\u00c1GINA Si recargas, perder\u00e1s el progreso y tendr\u00e1s que empezar de cero. ENTENDIDO, ACCEDER RADAR SECURITY \/ AUDIT Validamos Seguridad \u00b7 No Distribuimos ENCRYPTED v16.1 \u26a0\ufe0f SISTEMA DE AUDITOR\u00cdA BLOQUEADO Para desbloquear, introduce tu LLAVE MAESTRA. [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_joinchat":{"view":"no"},"footnotes":""},"class_list":["post-8387","page","type-page","status-publish","hentry"],"blocksy_meta":{"styles_descriptor":{"styles":{"desktop":"","tablet":"","mobile":""},"google_fonts":[],"version":7}},"_links":{"self":[{"href":"https:\/\/elinformatico.cat\/ca\/wp-json\/wp\/v2\/pages\/8387","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/elinformatico.cat\/ca\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/elinformatico.cat\/ca\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/elinformatico.cat\/ca\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/elinformatico.cat\/ca\/wp-json\/wp\/v2\/comments?post=8387"}],"version-history":[{"count":2,"href":"https:\/\/elinformatico.cat\/ca\/wp-json\/wp\/v2\/pages\/8387\/revisions"}],"predecessor-version":[{"id":9640,"href":"https:\/\/elinformatico.cat\/ca\/wp-json\/wp\/v2\/pages\/8387\/revisions\/9640"}],"wp:attachment":[{"href":"https:\/\/elinformatico.cat\/ca\/wp-json\/wp\/v2\/media?parent=8387"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}