N\u00facleo \u2014 Asistente Interno (IA)<\/title>\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap\" rel=\"stylesheet\">\r\n<style>\r\n :root{\r\n --ink:#132029; --ink-soft:#3d4d55;\r\n --paper:#F4F2EC; --paper-raised:#FFFFFF; --line:#DDD8CB;\r\n --navy:#12303D; --navy-soft:#1C3E4E;\r\n --gold:#C98A3B; --gold-soft:#E8C899;\r\n --green:#3A7D57; --green-bg:#E4EEE6;\r\n --amber:#B8862F; --amber-bg:#F2E9D6;\r\n --red:#B4432B; --red-bg:#F3E1DB;\r\n --radius:14px;\r\n --shadow: 0 1px 2px rgba(19,32,41,0.06), 0 8px 24px -12px rgba(19,32,41,0.18);\r\n }\r\n *{box-sizing:border-box;}\r\n html,body{margin:0;padding:0;}\r\n body{background:var(--paper); color:var(--ink); font-family:'IBM Plex Sans', sans-serif; -webkit-font-smoothing:antialiased;}\r\n .app{display:grid; grid-template-columns:260px 1fr; min-height:100vh;}\r\n\r\n .sidebar{background:var(--navy); color:#EDEBE2; padding:28px 20px 20px; display:flex; flex-direction:column; gap:28px;}\r\n .brand{display:flex; align-items:center; gap:10px;}\r\n .brand-mark{width:34px;height:34px;border-radius:50%; background:radial-gradient(circle at 35% 30%, var(--gold-soft), var(--gold) 60%); box-shadow: inset 0 0 0 2px rgba(255,255,255,0.25); flex-shrink:0;}\r\n .brand-name{font-family:'Fraunces', serif; font-weight:600; font-size:1.25rem;}\r\n .brand-sub{font-size:0.7rem; color:#9FB2BC; letter-spacing:0.06em; text-transform:uppercase; margin-top:-22px; margin-left:44px;}\r\n nav{display:flex;flex-direction:column;gap:2px;margin-top:6px;}\r\n .nav-item{display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:8px; font-size:0.87rem; color:#C7D3D8; text-decoration:none; cursor:pointer; transition:background 0.15s ease, color 0.15s ease;}\r\n .nav-item .num{font-family:'IBM Plex Mono', monospace; font-size:0.72rem; color:#7C929B; width:16px;}\r\n .nav-item:hover{background:rgba(255,255,255,0.06); color:#fff;}\r\n .nav-item.active{background:var(--navy-soft); color:#fff; box-shadow: inset 3px 0 0 var(--gold);}\r\n .nav-item.active .num{color:var(--gold);}\r\n .sidebar-footer{margin-top:auto; font-size:0.72rem; color:#7C929B; padding-top:16px; border-top:1px solid rgba(255,255,255,0.1);}\r\n\r\n main{padding:32px 40px 40px; max-width:900px; display:flex; flex-direction:column; height:100vh;}\r\n .topbar{display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:20px; flex-wrap:wrap; gap:16px;}\r\n .eyebrow{font-family:'IBM Plex Mono', monospace; font-size:0.72rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--gold); margin-bottom:6px;}\r\n h1{font-family:'Fraunces', serif; font-weight:600; font-size:1.8rem; margin:0; color:var(--navy);}\r\n .subtitle{color:var(--ink-soft); font-size:0.92rem; margin-top:6px;}\r\n .user-chip{display:flex; align-items:center; gap:10px; background:var(--paper-raised); border:1px solid var(--line); border-radius:999px; padding:6px 14px 6px 6px; box-shadow:var(--shadow);}\r\n .user-avatar{width:30px;height:30px;border-radius:50%; background:var(--navy); color:#EDEBE2; display:flex;align-items:center;justify-content:center; font-size:0.75rem;font-weight:600; font-family:'IBM Plex Mono',monospace;}\r\n .user-chip .name{font-size:0.82rem;font-weight:500;}\r\n .user-chip .role{font-size:0.72rem;color:var(--ink-soft);}\r\n\r\n .chat-panel{\r\n flex:1; background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius);\r\n box-shadow:var(--shadow); display:flex; flex-direction:column; overflow:hidden; min-height:0;\r\n }\r\n .chat-scroll{flex:1; overflow-y:auto; padding:24px 26px; display:flex; flex-direction:column; gap:16px;}\r\n\r\n .msg{display:flex; gap:10px; max-width:82%;}\r\n .msg.assistant{align-self:flex-start;}\r\n .msg.user{align-self:flex-end; flex-direction:row-reverse;}\r\n .msg-avatar{\r\n width:30px; height:30px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center;\r\n font-size:0.7rem; font-weight:700; font-family:'IBM Plex Mono',monospace;\r\n }\r\n .msg.assistant .msg-avatar{background:radial-gradient(circle at 35% 30%, var(--gold-soft), var(--gold) 60%); color:var(--navy);}\r\n .msg.user .msg-avatar{background:var(--navy); color:#EDEBE2;}\r\n .msg-bubble{padding:12px 16px; border-radius:12px; font-size:0.87rem; line-height:1.55;}\r\n .msg.assistant .msg-bubble{background:#FAF9F5; border:1px solid var(--line); color:var(--ink); border-top-left-radius:4px;}\r\n .msg.user .msg-bubble{background:var(--navy); color:#fff; border-top-right-radius:4px;}\r\n .msg-bubble b{color:var(--navy);}\r\n .msg.user .msg-bubble b{color:var(--gold-soft);}\r\n\r\n .source-tag{\r\n display:inline-flex; align-items:center; gap:5px; margin-top:8px; font-family:'IBM Plex Mono',monospace;\r\n font-size:0.68rem; color:var(--gold); background:var(--gold-soft); padding:3px 9px; border-radius:999px;\r\n }\r\n\r\n .typing{display:flex; gap:4px; padding:6px 0;}\r\n .typing span{width:6px; height:6px; border-radius:50%; background:var(--ink-soft); opacity:0.4; animation:blink 1.2s infinite;}\r\n .typing span:nth-child(2){animation-delay:0.2s;}\r\n .typing span:nth-child(3){animation-delay:0.4s;}\r\n @keyframes blink{0%,80%,100%{opacity:0.25;} 40%{opacity:0.9;}}\r\n\r\n .suggestions{display:flex; gap:8px; flex-wrap:wrap; padding:14px 26px; border-top:1px solid var(--line); background:#FAF9F5;}\r\n .chip{\r\n font-size:0.78rem; padding:8px 13px; border-radius:999px; border:1px solid var(--line); background:var(--paper-raised);\r\n color:var(--ink-soft); cursor:pointer; transition:border-color 0.15s ease, color 0.15s ease;\r\n }\r\n .chip:hover{border-color:var(--gold); color:var(--navy);}\r\n\r\n .input-row{display:flex; gap:10px; padding:16px 20px; border-top:1px solid var(--line); align-items:center;}\r\n .input-row input{\r\n flex:1; border:1px solid var(--line); border-radius:10px; padding:12px 16px; font-family:'IBM Plex Sans', sans-serif;\r\n font-size:0.88rem; color:var(--ink); outline:none;\r\n }\r\n .input-row input:focus{border-color:var(--gold);}\r\n .send-btn{\r\n background:var(--navy); color:#fff; border:none; border-radius:10px; width:44px; height:44px; flex-shrink:0;\r\n cursor:pointer; display:flex; align-items:center; justify-content:center;\r\n }\r\n .send-btn:hover{opacity:0.9;}\r\n\r\n .demo-note{margin-top:14px; font-size:0.76rem; color:var(--ink-soft); text-align:center; padding:12px; border:1px dashed var(--line); border-radius:10px; background:rgba(201,138,59,0.05);}\r\n\r\n @media (max-width:980px){\r\n .app{grid-template-columns:1fr;}\r\n .sidebar{display:none;}\r\n main{padding:20px;}\r\n }\r\n<\/style>\r\n<\/head>\r\n<body>\r\n<div class=\"app\">\r\n\r\n <aside class=\"sidebar\">\r\n <div>\r\n <div class=\"brand\"><div class=\"brand-mark\"><\/div><div class=\"brand-name\">N\u00facleo<\/div><\/div>\r\n <div class=\"brand-sub\">Gesti\u00f3n Digital<\/div>\r\n <\/div>\r\n <nav>\r\n <a class=\"nav-item\"><span class=\"num\">01<\/span> Tablero General<\/a>\r\n <a class=\"nav-item\"><span class=\"num\">02<\/span> Atenci\u00f3n Ciudadana<\/a>\r\n <a class=\"nav-item active\"><span class=\"num\">03<\/span> Asistente Interno (IA)<\/a>\r\n <a class=\"nav-item\"><span class=\"num\">04<\/span> Gesti\u00f3n por Resultados<\/a>\r\n <a class=\"nav-item\"><span class=\"num\">05<\/span> Planeamiento y Presupuesto<\/a>\r\n <a class=\"nav-item\"><span class=\"num\">06<\/span> Auditor\u00eda y Control<\/a>\r\n <a class=\"nav-item\"><span class=\"num\">07<\/span> Informes y Rendici\u00f3n<\/a>\r\n <a class=\"nav-item\"><span class=\"num\">08<\/span> Configuraci\u00f3n<\/a>\r\n <a class=\"nav-item\"><span class=\"num\">09<\/span> Ayuda y Soporte<\/a>\r\n <\/nav>\r\n <div class=\"sidebar-footer\">Organismo de Gobierno de Ejemplo<br>Sesi\u00f3n de demostraci\u00f3n<\/div>\r\n <\/aside>\r\n\r\n <main>\r\n <div class=\"topbar\">\r\n <div>\r\n <div class=\"eyebrow\">Asistente Interno<\/div>\r\n <h1>Asistente de Gesti\u00f3n N\u00facleo<\/h1>\r\n <div class=\"subtitle\">Pregunta en lenguaje natural \u2014 consulta presupuesto, tr\u00e1mites, auditor\u00eda y tareas de un solo lugar<\/div>\r\n <\/div>\r\n <div class=\"user-chip\">\r\n <div class=\"user-avatar\">DM<\/div>\r\n <div><div class=\"name\">Demo institucional<\/div><div class=\"role\">Gerente General<\/div><\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"chat-panel\">\r\n <div class=\"chat-scroll\" id=\"chatScroll\">\r\n <div class=\"msg assistant\">\r\n <div class=\"msg-avatar\">N<\/div>\r\n <div class=\"msg-bubble\">Hola, soy el asistente interno de N\u00facleo. Puedo responder preguntas cruzando informaci\u00f3n de Presupuesto, Tr\u00e1mites TUPA, Auditor\u00eda y Tareas \u2014 sin que tengas que abrir cada m\u00f3dulo por separado. Prueba una de las preguntas de abajo, o escribe la tuya.<\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"suggestions\" id=\"suggestions\">\r\n <div class=\"chip\" data-q=\"vehiculos\">\u00bfCu\u00e1nto tengo para mantenimiento de veh\u00edculos?<\/div>\r\n <div class=\"chip\" data-q=\"tupa_vencidos\">\u00bfQu\u00e9 tr\u00e1mites TUPA est\u00e1n vencidos?<\/div>\r\n <div class=\"chip\" data-q=\"auditoria\">\u00bfQu\u00e9 hallazgos de auditor\u00eda siguen abiertos?<\/div>\r\n <div class=\"chip\" data-q=\"tareas_seguridad\">\u00bfQu\u00e9 tareas tiene pendientes Seguridad Ciudadana?<\/div>\r\n <\/div>\r\n\r\n <div class=\"input-row\">\r\n <input id=\"chatInput\" type=\"text\" placeholder=\"Escribe tu pregunta...\">\r\n <button class=\"send-btn\" onclick=\"sendMessage()\">\r\n <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"22\" y1=\"2\" x2=\"11\" y2=\"13\"\/><polygon points=\"22 2 15 22 11 13 2 9 22 2\"\/><\/svg>\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"demo-note\">\r\n Prototipo de demostraci\u00f3n \u2014 las respuestas est\u00e1n simuladas con datos de ejemplo de los otros m\u00f3dulos. En la versi\u00f3n real, este asistente consultar\u00eda los datos en vivo del sistema.\r\n <\/div>\r\n <\/main>\r\n<\/div>\r\n\r\n<script>\r\nconst respuestas = [\r\n {\r\n keys: [\"vehicul\", \"veh\u00edculo\"],\r\n texto: \"Sumando la espec\u00edfica <b>2.3.2 4.1 3 \u2014 Mantenimiento y reparaci\u00f3n de veh\u00edculos<\/b> en las dos gerencias que ejecutan gasto ah\u00ed: PIM asignado <b>S\/ 276,000<\/b>, ejecutado <b>S\/ 173,600<\/b> (62.9%), saldo disponible <b>S\/ 102,400<\/b>. Corresponde a Gerencia de Servicios P\u00fablicos y Gerencia de Seguridad Ciudadana (Serenazgo).\",\r\n fuente: \"Gesti\u00f3n Presupuestal \u2014 M\u00f3dulo 1.5\"\r\n },\r\n {\r\n keys: [\"tupa\", \"tramite\", \"tr\u00e1mite\"],\r\n texto: \"Hay <b>2 solicitudes TUPA fuera de plazo<\/b>: <b>TUPA-2026-0812<\/b> (Licencia de Funcionamiento, Rosa Medina Quispe, venci\u00f3 hace 1 d\u00eda) y <b>TUPA-2026-0803<\/b> (Licencia de Edificaci\u00f3n, Empresa Constructora Andina S.A.C., venci\u00f3 hace 10 d\u00edas). Ambas est\u00e1n en estado \\\"Observado\\\" \u2014 requieren seguimiento urgente antes de generar silencio administrativo negativo.\",\r\n fuente: \"Atenci\u00f3n Ciudadana \/ TUPA \u2014 M\u00f3dulo 1.1\"\r\n },\r\n {\r\n keys: [\"auditoria\", \"auditor\u00eda\", \"hallazgo\"],\r\n texto: \"Hay <b>5 hallazgos abiertos o en proceso<\/b>, de los cuales <b>3 son de severidad alta<\/b>: <b>AUD-0019<\/b> (Administraci\u00f3n y Finanzas, vence en 2 d\u00edas), <b>AUD-0015<\/b> (Administraci\u00f3n y Finanzas, ya vencido) y <b>AUD-0032<\/b> (Tecnolog\u00edas de la Informaci\u00f3n, plan de contingencia pendiente). El \u00edndice de preparaci\u00f3n para auditor\u00eda est\u00e1 en 71%.\",\r\n fuente: \"Auditor\u00eda y Control \u2014 M\u00f3dulo 1.3\"\r\n },\r\n {\r\n keys: [\"seguridad\", \"serenazgo\"],\r\n texto: \"Gerencia de Seguridad Ciudadana tiene <b>1 tarea pendiente<\/b>: <b>TAR-0232<\/b> \u2014 \\\"Reparar unidad de serenazgo con c\u00f3digo VH-014\\\", prioridad alta, venci\u00f3 el 16 de agosto. Est\u00e1 directamente relacionada con el hallazgo de auditor\u00eda <b>AUD-0028<\/b> sobre mantenimiento vehicular vencido.\",\r\n fuente: \"Actividades y Tareas \u2014 M\u00f3dulo 1.7\"\r\n }\r\n];\r\n\r\nfunction buscarRespuesta(texto){\r\n const t = texto.toLowerCase();\r\n for(const r of respuestas){\r\n if(r.keys.some(k => t.includes(k))) return r;\r\n }\r\n return {\r\n texto: \"Por ahora puedo responder sobre <b>presupuesto<\/b> (ej: \\\"cu\u00e1nto tengo para...\\\"), <b>tr\u00e1mites TUPA<\/b>, <b>hallazgos de auditor\u00eda<\/b>, y <b>tareas por gerencia<\/b>. Prueba reformulando tu pregunta con alguno de esos temas, o usa una de las sugerencias de abajo.\",\r\n fuente: null\r\n };\r\n}\r\n\r\nfunction addMessage(text, sender, fuente){\r\n const scroll = document.getElementById(\"chatScroll\");\r\n const msg = document.createElement(\"div\");\r\n msg.className = \"msg \" + sender;\r\n const avatarLetter = sender === \"assistant\" ? \"N\" : \"DM\";\r\n let sourceHtml = \"\";\r\n if(fuente){\r\n sourceHtml = `<div class=\"source-tag\">\ud83d\udcce Fuente: ${fuente}<\/div>`;\r\n }\r\n msg.innerHTML = `\r\n <div class=\"msg-avatar\">${avatarLetter}<\/div>\r\n <div class=\"msg-bubble\">${text}${sourceHtml}<\/div>\r\n `;\r\n scroll.appendChild(msg);\r\n scroll.scrollTop = scroll.scrollHeight;\r\n}\r\n\r\nfunction showTyping(){\r\n const scroll = document.getElementById(\"chatScroll\");\r\n const msg = document.createElement(\"div\");\r\n msg.className = \"msg assistant\";\r\n msg.id = \"typingMsg\";\r\n msg.innerHTML = `\r\n <div class=\"msg-avatar\">N<\/div>\r\n <div class=\"msg-bubble\"><div class=\"typing\"><span><\/span><span><\/span><span><\/span><\/div><\/div>\r\n `;\r\n scroll.appendChild(msg);\r\n scroll.scrollTop = scroll.scrollHeight;\r\n}\r\n\r\nfunction removeTyping(){\r\n const t = document.getElementById(\"typingMsg\");\r\n if(t) t.remove();\r\n}\r\n\r\nfunction handleQuery(text){\r\n addMessage(text, \"user\");\r\n showTyping();\r\n setTimeout(() => {\r\n removeTyping();\r\n const r = buscarRespuesta(text);\r\n addMessage(r.texto, \"assistant\", r.fuente);\r\n }, 700);\r\n}\r\n\r\nfunction sendMessage(){\r\n const input = document.getElementById(\"chatInput\");\r\n const text = input.value.trim();\r\n if(!text) return;\r\n input.value = \"\";\r\n handleQuery(text);\r\n}\r\n\r\ndocument.getElementById(\"chatInput\").addEventListener(\"keydown\", (e) => {\r\n if(e.key === \"Enter\") sendMessage();\r\n});\r\n\r\nconst preguntasChips = {\r\n vehiculos: \"\u00bfCu\u00e1nto tengo para mantenimiento de veh\u00edculos?\",\r\n tupa_vencidos: \"\u00bfQu\u00e9 tr\u00e1mites TUPA est\u00e1n vencidos?\",\r\n auditoria: \"\u00bfQu\u00e9 hallazgos de auditor\u00eda siguen abiertos?\",\r\n tareas_seguridad: \"\u00bfQu\u00e9 tareas tiene pendientes Seguridad Ciudadana?\"\r\n};\r\n\r\ndocument.querySelectorAll(\".chip\").forEach(chip => {\r\n chip.addEventListener(\"click\", () => {\r\n handleQuery(preguntasChips[chip.dataset.q]);\r\n });\r\n});\r\n<\/script>\r\n<\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n\n<\/div>\n\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>N\u00facleo \u2014 Asistente Interno (IA) N\u00facleo Gesti\u00f3n Digital 01 Tablero General 02 Atenci\u00f3n Ciudadana 03 Asistente Interno (IA) 04 Gesti\u00f3n por Resultados 05 Planeamiento y Presupuesto 06 Auditor\u00eda y Control 07 Informes y Rendici\u00f3n 08 Configuraci\u00f3n 09 Ayuda y Soporte Organismo de Gobierno de EjemploSesi\u00f3n de demostraci\u00f3n Asistente Interno Asistente de Gesti\u00f3n N\u00facleo Pregunta en […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":638,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-996","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/miespaciodigital.net\/auditoria\/wp-json\/wp\/v2\/pages\/996","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/miespaciodigital.net\/auditoria\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/miespaciodigital.net\/auditoria\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/miespaciodigital.net\/auditoria\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/miespaciodigital.net\/auditoria\/wp-json\/wp\/v2\/comments?post=996"}],"version-history":[{"count":4,"href":"https:\/\/miespaciodigital.net\/auditoria\/wp-json\/wp\/v2\/pages\/996\/revisions"}],"predecessor-version":[{"id":1001,"href":"https:\/\/miespaciodigital.net\/auditoria\/wp-json\/wp\/v2\/pages\/996\/revisions\/1001"}],"up":[{"embeddable":true,"href":"https:\/\/miespaciodigital.net\/auditoria\/wp-json\/wp\/v2\/pages\/638"}],"wp:attachment":[{"href":"https:\/\/miespaciodigital.net\/auditoria\/wp-json\/wp\/v2\/media?parent=996"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n \t\t

\n\t\t\t\t\t\r\n\r\n\r\n\r\n\r\n\r\nN\u00facleo \u2014 Asistente Interno (IA)<\/title>\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap\" rel=\"stylesheet\">\r\n<style>\r\n :root{\r\n --ink:#132029; --ink-soft:#3d4d55;\r\n --paper:#F4F2EC; --paper-raised:#FFFFFF; --line:#DDD8CB;\r\n --navy:#12303D; --navy-soft:#1C3E4E;\r\n --gold:#C98A3B; --gold-soft:#E8C899;\r\n --green:#3A7D57; --green-bg:#E4EEE6;\r\n --amber:#B8862F; --amber-bg:#F2E9D6;\r\n --red:#B4432B; --red-bg:#F3E1DB;\r\n --radius:14px;\r\n --shadow: 0 1px 2px rgba(19,32,41,0.06), 0 8px 24px -12px rgba(19,32,41,0.18);\r\n }\r\n *{box-sizing:border-box;}\r\n html,body{margin:0;padding:0;}\r\n body{background:var(--paper); color:var(--ink); font-family:'IBM Plex Sans', sans-serif; -webkit-font-smoothing:antialiased;}\r\n .app{display:grid; grid-template-columns:260px 1fr; min-height:100vh;}\r\n\r\n .sidebar{background:var(--navy); color:#EDEBE2; padding:28px 20px 20px; display:flex; flex-direction:column; gap:28px;}\r\n .brand{display:flex; align-items:center; gap:10px;}\r\n .brand-mark{width:34px;height:34px;border-radius:50%; background:radial-gradient(circle at 35% 30%, var(--gold-soft), var(--gold) 60%); box-shadow: inset 0 0 0 2px rgba(255,255,255,0.25); flex-shrink:0;}\r\n .brand-name{font-family:'Fraunces', serif; font-weight:600; font-size:1.25rem;}\r\n .brand-sub{font-size:0.7rem; color:#9FB2BC; letter-spacing:0.06em; text-transform:uppercase; margin-top:-22px; margin-left:44px;}\r\n nav{display:flex;flex-direction:column;gap:2px;margin-top:6px;}\r\n .nav-item{display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:8px; font-size:0.87rem; color:#C7D3D8; text-decoration:none; cursor:pointer; transition:background 0.15s ease, color 0.15s ease;}\r\n .nav-item .num{font-family:'IBM Plex Mono', monospace; font-size:0.72rem; color:#7C929B; width:16px;}\r\n .nav-item:hover{background:rgba(255,255,255,0.06); color:#fff;}\r\n .nav-item.active{background:var(--navy-soft); color:#fff; box-shadow: inset 3px 0 0 var(--gold);}\r\n .nav-item.active .num{color:var(--gold);}\r\n .sidebar-footer{margin-top:auto; font-size:0.72rem; color:#7C929B; padding-top:16px; border-top:1px solid rgba(255,255,255,0.1);}\r\n\r\n main{padding:32px 40px 40px; max-width:900px; display:flex; flex-direction:column; height:100vh;}\r\n .topbar{display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:20px; flex-wrap:wrap; gap:16px;}\r\n .eyebrow{font-family:'IBM Plex Mono', monospace; font-size:0.72rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--gold); margin-bottom:6px;}\r\n h1{font-family:'Fraunces', serif; font-weight:600; font-size:1.8rem; margin:0; color:var(--navy);}\r\n .subtitle{color:var(--ink-soft); font-size:0.92rem; margin-top:6px;}\r\n .user-chip{display:flex; align-items:center; gap:10px; background:var(--paper-raised); border:1px solid var(--line); border-radius:999px; padding:6px 14px 6px 6px; box-shadow:var(--shadow);}\r\n .user-avatar{width:30px;height:30px;border-radius:50%; background:var(--navy); color:#EDEBE2; display:flex;align-items:center;justify-content:center; font-size:0.75rem;font-weight:600; font-family:'IBM Plex Mono',monospace;}\r\n .user-chip .name{font-size:0.82rem;font-weight:500;}\r\n .user-chip .role{font-size:0.72rem;color:var(--ink-soft);}\r\n\r\n .chat-panel{\r\n flex:1; background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius);\r\n box-shadow:var(--shadow); display:flex; flex-direction:column; overflow:hidden; min-height:0;\r\n }\r\n .chat-scroll{flex:1; overflow-y:auto; padding:24px 26px; display:flex; flex-direction:column; gap:16px;}\r\n\r\n .msg{display:flex; gap:10px; max-width:82%;}\r\n .msg.assistant{align-self:flex-start;}\r\n .msg.user{align-self:flex-end; flex-direction:row-reverse;}\r\n .msg-avatar{\r\n width:30px; height:30px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center;\r\n font-size:0.7rem; font-weight:700; font-family:'IBM Plex Mono',monospace;\r\n }\r\n .msg.assistant .msg-avatar{background:radial-gradient(circle at 35% 30%, var(--gold-soft), var(--gold) 60%); color:var(--navy);}\r\n .msg.user .msg-avatar{background:var(--navy); color:#EDEBE2;}\r\n .msg-bubble{padding:12px 16px; border-radius:12px; font-size:0.87rem; line-height:1.55;}\r\n .msg.assistant .msg-bubble{background:#FAF9F5; border:1px solid var(--line); color:var(--ink); border-top-left-radius:4px;}\r\n .msg.user .msg-bubble{background:var(--navy); color:#fff; border-top-right-radius:4px;}\r\n .msg-bubble b{color:var(--navy);}\r\n .msg.user .msg-bubble b{color:var(--gold-soft);}\r\n\r\n .source-tag{\r\n display:inline-flex; align-items:center; gap:5px; margin-top:8px; font-family:'IBM Plex Mono',monospace;\r\n font-size:0.68rem; color:var(--gold); background:var(--gold-soft); padding:3px 9px; border-radius:999px;\r\n }\r\n\r\n .typing{display:flex; gap:4px; padding:6px 0;}\r\n .typing span{width:6px; height:6px; border-radius:50%; background:var(--ink-soft); opacity:0.4; animation:blink 1.2s infinite;}\r\n .typing span:nth-child(2){animation-delay:0.2s;}\r\n .typing span:nth-child(3){animation-delay:0.4s;}\r\n @keyframes blink{0%,80%,100%{opacity:0.25;} 40%{opacity:0.9;}}\r\n\r\n .suggestions{display:flex; gap:8px; flex-wrap:wrap; padding:14px 26px; border-top:1px solid var(--line); background:#FAF9F5;}\r\n .chip{\r\n font-size:0.78rem; padding:8px 13px; border-radius:999px; border:1px solid var(--line); background:var(--paper-raised);\r\n color:var(--ink-soft); cursor:pointer; transition:border-color 0.15s ease, color 0.15s ease;\r\n }\r\n .chip:hover{border-color:var(--gold); color:var(--navy);}\r\n\r\n .input-row{display:flex; gap:10px; padding:16px 20px; border-top:1px solid var(--line); align-items:center;}\r\n .input-row input{\r\n flex:1; border:1px solid var(--line); border-radius:10px; padding:12px 16px; font-family:'IBM Plex Sans', sans-serif;\r\n font-size:0.88rem; color:var(--ink); outline:none;\r\n }\r\n .input-row input:focus{border-color:var(--gold);}\r\n .send-btn{\r\n background:var(--navy); color:#fff; border:none; border-radius:10px; width:44px; height:44px; flex-shrink:0;\r\n cursor:pointer; display:flex; align-items:center; justify-content:center;\r\n }\r\n .send-btn:hover{opacity:0.9;}\r\n\r\n .demo-note{margin-top:14px; font-size:0.76rem; color:var(--ink-soft); text-align:center; padding:12px; border:1px dashed var(--line); border-radius:10px; background:rgba(201,138,59,0.05);}\r\n\r\n @media (max-width:980px){\r\n .app{grid-template-columns:1fr;}\r\n .sidebar{display:none;}\r\n main{padding:20px;}\r\n }\r\n<\/style>\r\n<\/head>\r\n<body>\r\n<div class=\"app\">\r\n\r\n <aside class=\"sidebar\">\r\n <div>\r\n <div class=\"brand\"><div class=\"brand-mark\"><\/div><div class=\"brand-name\">N\u00facleo<\/div><\/div>\r\n <div class=\"brand-sub\">Gesti\u00f3n Digital<\/div>\r\n <\/div>\r\n <nav>\r\n <a class=\"nav-item\"><span class=\"num\">01<\/span> Tablero General<\/a>\r\n <a class=\"nav-item\"><span class=\"num\">02<\/span> Atenci\u00f3n Ciudadana<\/a>\r\n <a class=\"nav-item active\"><span class=\"num\">03<\/span> Asistente Interno (IA)<\/a>\r\n <a class=\"nav-item\"><span class=\"num\">04<\/span> Gesti\u00f3n por Resultados<\/a>\r\n <a class=\"nav-item\"><span class=\"num\">05<\/span> Planeamiento y Presupuesto<\/a>\r\n <a class=\"nav-item\"><span class=\"num\">06<\/span> Auditor\u00eda y Control<\/a>\r\n <a class=\"nav-item\"><span class=\"num\">07<\/span> Informes y Rendici\u00f3n<\/a>\r\n <a class=\"nav-item\"><span class=\"num\">08<\/span> Configuraci\u00f3n<\/a>\r\n <a class=\"nav-item\"><span class=\"num\">09<\/span> Ayuda y Soporte<\/a>\r\n <\/nav>\r\n <div class=\"sidebar-footer\">Organismo de Gobierno de Ejemplo<br>Sesi\u00f3n de demostraci\u00f3n<\/div>\r\n <\/aside>\r\n\r\n <main>\r\n <div class=\"topbar\">\r\n <div>\r\n <div class=\"eyebrow\">Asistente Interno<\/div>\r\n <h1>Asistente de Gesti\u00f3n N\u00facleo<\/h1>\r\n <div class=\"subtitle\">Pregunta en lenguaje natural \u2014 consulta presupuesto, tr\u00e1mites, auditor\u00eda y tareas de un solo lugar<\/div>\r\n <\/div>\r\n <div class=\"user-chip\">\r\n <div class=\"user-avatar\">DM<\/div>\r\n <div><div class=\"name\">Demo institucional<\/div><div class=\"role\">Gerente General<\/div><\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"chat-panel\">\r\n <div class=\"chat-scroll\" id=\"chatScroll\">\r\n <div class=\"msg assistant\">\r\n <div class=\"msg-avatar\">N<\/div>\r\n <div class=\"msg-bubble\">Hola, soy el asistente interno de N\u00facleo. Puedo responder preguntas cruzando informaci\u00f3n de Presupuesto, Tr\u00e1mites TUPA, Auditor\u00eda y Tareas \u2014 sin que tengas que abrir cada m\u00f3dulo por separado. Prueba una de las preguntas de abajo, o escribe la tuya.<\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"suggestions\" id=\"suggestions\">\r\n <div class=\"chip\" data-q=\"vehiculos\">\u00bfCu\u00e1nto tengo para mantenimiento de veh\u00edculos?<\/div>\r\n <div class=\"chip\" data-q=\"tupa_vencidos\">\u00bfQu\u00e9 tr\u00e1mites TUPA est\u00e1n vencidos?<\/div>\r\n <div class=\"chip\" data-q=\"auditoria\">\u00bfQu\u00e9 hallazgos de auditor\u00eda siguen abiertos?<\/div>\r\n <div class=\"chip\" data-q=\"tareas_seguridad\">\u00bfQu\u00e9 tareas tiene pendientes Seguridad Ciudadana?<\/div>\r\n <\/div>\r\n\r\n <div class=\"input-row\">\r\n <input id=\"chatInput\" type=\"text\" placeholder=\"Escribe tu pregunta...\">\r\n <button class=\"send-btn\" onclick=\"sendMessage()\">\r\n <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"22\" y1=\"2\" x2=\"11\" y2=\"13\"\/><polygon points=\"22 2 15 22 11 13 2 9 22 2\"\/><\/svg>\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"demo-note\">\r\n Prototipo de demostraci\u00f3n \u2014 las respuestas est\u00e1n simuladas con datos de ejemplo de los otros m\u00f3dulos. En la versi\u00f3n real, este asistente consultar\u00eda los datos en vivo del sistema.\r\n <\/div>\r\n <\/main>\r\n<\/div>\r\n\r\n<script>\r\nconst respuestas = [\r\n {\r\n keys: [\"vehicul\", \"veh\u00edculo\"],\r\n texto: \"Sumando la espec\u00edfica <b>2.3.2 4.1 3 \u2014 Mantenimiento y reparaci\u00f3n de veh\u00edculos<\/b> en las dos gerencias que ejecutan gasto ah\u00ed: PIM asignado <b>S\/ 276,000<\/b>, ejecutado <b>S\/ 173,600<\/b> (62.9%), saldo disponible <b>S\/ 102,400<\/b>. Corresponde a Gerencia de Servicios P\u00fablicos y Gerencia de Seguridad Ciudadana (Serenazgo).\",\r\n fuente: \"Gesti\u00f3n Presupuestal \u2014 M\u00f3dulo 1.5\"\r\n },\r\n {\r\n keys: [\"tupa\", \"tramite\", \"tr\u00e1mite\"],\r\n texto: \"Hay <b>2 solicitudes TUPA fuera de plazo<\/b>: <b>TUPA-2026-0812<\/b> (Licencia de Funcionamiento, Rosa Medina Quispe, venci\u00f3 hace 1 d\u00eda) y <b>TUPA-2026-0803<\/b> (Licencia de Edificaci\u00f3n, Empresa Constructora Andina S.A.C., venci\u00f3 hace 10 d\u00edas). Ambas est\u00e1n en estado \\\"Observado\\\" \u2014 requieren seguimiento urgente antes de generar silencio administrativo negativo.\",\r\n fuente: \"Atenci\u00f3n Ciudadana \/ TUPA \u2014 M\u00f3dulo 1.1\"\r\n },\r\n {\r\n keys: [\"auditoria\", \"auditor\u00eda\", \"hallazgo\"],\r\n texto: \"Hay <b>5 hallazgos abiertos o en proceso<\/b>, de los cuales <b>3 son de severidad alta<\/b>: <b>AUD-0019<\/b> (Administraci\u00f3n y Finanzas, vence en 2 d\u00edas), <b>AUD-0015<\/b> (Administraci\u00f3n y Finanzas, ya vencido) y <b>AUD-0032<\/b> (Tecnolog\u00edas de la Informaci\u00f3n, plan de contingencia pendiente). El \u00edndice de preparaci\u00f3n para auditor\u00eda est\u00e1 en 71%.\",\r\n fuente: \"Auditor\u00eda y Control \u2014 M\u00f3dulo 1.3\"\r\n },\r\n {\r\n keys: [\"seguridad\", \"serenazgo\"],\r\n texto: \"Gerencia de Seguridad Ciudadana tiene <b>1 tarea pendiente<\/b>: <b>TAR-0232<\/b> \u2014 \\\"Reparar unidad de serenazgo con c\u00f3digo VH-014\\\", prioridad alta, venci\u00f3 el 16 de agosto. Est\u00e1 directamente relacionada con el hallazgo de auditor\u00eda <b>AUD-0028<\/b> sobre mantenimiento vehicular vencido.\",\r\n fuente: \"Actividades y Tareas \u2014 M\u00f3dulo 1.7\"\r\n }\r\n];\r\n\r\nfunction buscarRespuesta(texto){\r\n const t = texto.toLowerCase();\r\n for(const r of respuestas){\r\n if(r.keys.some(k => t.includes(k))) return r;\r\n }\r\n return {\r\n texto: \"Por ahora puedo responder sobre <b>presupuesto<\/b> (ej: \\\"cu\u00e1nto tengo para...\\\"), <b>tr\u00e1mites TUPA<\/b>, <b>hallazgos de auditor\u00eda<\/b>, y <b>tareas por gerencia<\/b>. Prueba reformulando tu pregunta con alguno de esos temas, o usa una de las sugerencias de abajo.\",\r\n fuente: null\r\n };\r\n}\r\n\r\nfunction addMessage(text, sender, fuente){\r\n const scroll = document.getElementById(\"chatScroll\");\r\n const msg = document.createElement(\"div\");\r\n msg.className = \"msg \" + sender;\r\n const avatarLetter = sender === \"assistant\" ? \"N\" : \"DM\";\r\n let sourceHtml = \"\";\r\n if(fuente){\r\n sourceHtml = `<div class=\"source-tag\">\ud83d\udcce Fuente: ${fuente}<\/div>`;\r\n }\r\n msg.innerHTML = `\r\n <div class=\"msg-avatar\">${avatarLetter}<\/div>\r\n <div class=\"msg-bubble\">${text}${sourceHtml}<\/div>\r\n `;\r\n scroll.appendChild(msg);\r\n scroll.scrollTop = scroll.scrollHeight;\r\n}\r\n\r\nfunction showTyping(){\r\n const scroll = document.getElementById(\"chatScroll\");\r\n const msg = document.createElement(\"div\");\r\n msg.className = \"msg assistant\";\r\n msg.id = \"typingMsg\";\r\n msg.innerHTML = `\r\n <div class=\"msg-avatar\">N<\/div>\r\n <div class=\"msg-bubble\"><div class=\"typing\"><span><\/span><span><\/span><span><\/span><\/div><\/div>\r\n `;\r\n scroll.appendChild(msg);\r\n scroll.scrollTop = scroll.scrollHeight;\r\n}\r\n\r\nfunction removeTyping(){\r\n const t = document.getElementById(\"typingMsg\");\r\n if(t) t.remove();\r\n}\r\n\r\nfunction handleQuery(text){\r\n addMessage(text, \"user\");\r\n showTyping();\r\n setTimeout(() => {\r\n removeTyping();\r\n const r = buscarRespuesta(text);\r\n addMessage(r.texto, \"assistant\", r.fuente);\r\n }, 700);\r\n}\r\n\r\nfunction sendMessage(){\r\n const input = document.getElementById(\"chatInput\");\r\n const text = input.value.trim();\r\n if(!text) return;\r\n input.value = \"\";\r\n handleQuery(text);\r\n}\r\n\r\ndocument.getElementById(\"chatInput\").addEventListener(\"keydown\", (e) => {\r\n if(e.key === \"Enter\") sendMessage();\r\n});\r\n\r\nconst preguntasChips = {\r\n vehiculos: \"\u00bfCu\u00e1nto tengo para mantenimiento de veh\u00edculos?\",\r\n tupa_vencidos: \"\u00bfQu\u00e9 tr\u00e1mites TUPA est\u00e1n vencidos?\",\r\n auditoria: \"\u00bfQu\u00e9 hallazgos de auditor\u00eda siguen abiertos?\",\r\n tareas_seguridad: \"\u00bfQu\u00e9 tareas tiene pendientes Seguridad Ciudadana?\"\r\n};\r\n\r\ndocument.querySelectorAll(\".chip\").forEach(chip => {\r\n chip.addEventListener(\"click\", () => {\r\n handleQuery(preguntasChips[chip.dataset.q]);\r\n });\r\n});\r\n<\/script>\r\n<\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n\n<\/div>\n\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>N\u00facleo \u2014 Asistente Interno (IA) N\u00facleo Gesti\u00f3n Digital 01 Tablero General 02 Atenci\u00f3n Ciudadana 03 Asistente Interno (IA) 04 Gesti\u00f3n por Resultados 05 Planeamiento y Presupuesto 06 Auditor\u00eda y Control 07 Informes y Rendici\u00f3n 08 Configuraci\u00f3n 09 Ayuda y Soporte Organismo de Gobierno de EjemploSesi\u00f3n de demostraci\u00f3n Asistente Interno Asistente de Gesti\u00f3n N\u00facleo Pregunta en […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":638,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-996","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/miespaciodigital.net\/auditoria\/wp-json\/wp\/v2\/pages\/996","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/miespaciodigital.net\/auditoria\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/miespaciodigital.net\/auditoria\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/miespaciodigital.net\/auditoria\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/miespaciodigital.net\/auditoria\/wp-json\/wp\/v2\/comments?post=996"}],"version-history":[{"count":4,"href":"https:\/\/miespaciodigital.net\/auditoria\/wp-json\/wp\/v2\/pages\/996\/revisions"}],"predecessor-version":[{"id":1001,"href":"https:\/\/miespaciodigital.net\/auditoria\/wp-json\/wp\/v2\/pages\/996\/revisions\/1001"}],"up":[{"embeddable":true,"href":"https:\/\/miespaciodigital.net\/auditoria\/wp-json\/wp\/v2\/pages\/638"}],"wp:attachment":[{"href":"https:\/\/miespaciodigital.net\/auditoria\/wp-json\/wp\/v2\/media?parent=996"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}