<!DOCTYPE html>
<html lang="es" data-theme="dark">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>AcuiCal Master ÔÇö Developer Portal</title>
<meta name="theme-color" content="#0a0e1a">
<link rel="icon" type="image/svg+xml" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230ea5e9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><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>">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
<script src="https://unpkg.com/lucide@0.468.0/dist/umd/lucide.min.js"></script>
<style>
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
:root {
  --bg: #0a0e1a; --bg2: #0f1424; --bg3: #161c30; --surface: #1a2140;
  --border: #2a3460; --text: #e8edf5; --text2: #94a3b8; --text3: #64748b;
  --accent: #0ea5e9; --accent2: #06b6d4; --green: #10b981; --red: #ef4444; --yellow: #eab308;
  --gradient: linear-gradient(135deg, #0ea5e9, #06b6d4, #10b981);
  --radius: 12px; --font: 'Inter', -apple-system, sans-serif; --mono: 'JetBrains Mono', monospace;
}
body {
  font-family: var(--font); background: var(--bg); color: var(--text); line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
.container { max-width: 1100px; margin: 0 auto; padding: 2rem; }

/* Header */
header {
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem;
  margin-bottom: 2rem; padding-bottom: 1.5rem; border-bottom: 1px solid var(--border);
}
.header-left { display: flex; align-items: center; gap: 1rem; }
.header-left h1 { font-size: 1.5rem; font-weight: 800; }
.header-left h1 span { background: var(--gradient); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.header-left .badge { font-size: 0.7rem; padding: 0.2rem 0.6rem; border-radius: 100px; font-weight: 600; background: var(--yellow); color: #000; }
.header-links { display: flex; gap: 0.75rem; flex-wrap: wrap; }

/* Cards */
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 1rem; margin-bottom: 1.5rem; }
.card {
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.25rem;
  transition: all 0.2s;
}
.card:hover { border-color: var(--accent); }
.card-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem; }
.card-header h3 { font-size: 0.85rem; font-weight: 700; color: var(--text2); text-transform: uppercase; letter-spacing: 0.05em; }
.card-value { font-size: 2rem; font-weight: 800; }
.card-value.green { color: var(--green); }
.card-value.red { color: var(--red); }
.card-value.accent { color: var(--accent); }
.card-value .unit { font-size: 0.9rem; color: var(--text3); font-weight: 500; }

/* Status dot */
.dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 0.5rem; }
.dot.up { background: var(--green); box-shadow: 0 0 8px rgba(16,185,129,0.4); }
.dot.down { background: var(--red); box-shadow: 0 0 8px rgba(239,68,68,0.4); }
.dot.warn { background: var(--yellow); box-shadow: 0 0 8px rgba(234,179,8,0.4); }
.dot.pulse { animation: pulse 2s infinite; }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }

/* Buttons */
.btn {
  display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1.2rem;
  border-radius: 8px; font-size: 0.85rem; font-weight: 600; font-family: var(--font);
  cursor: pointer; transition: all 0.2s; text-decoration: none; border: none;
}
.btn-primary { background: var(--gradient); color: white; box-shadow: 0 4px 15px rgba(14,165,233,0.2); }
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(14,165,233,0.3); }
.btn-secondary { background: var(--bg3); color: var(--text); border: 1px solid var(--border); }
.btn-secondary:hover { border-color: var(--accent); color: var(--accent); }
.btn-danger { background: var(--red); color: white; }
.btn-danger:hover { filter: brightness(1.15); transform: translateY(-2px); }
.btn-outline { background: transparent; color: var(--accent); border: 1.5px solid var(--accent); }
.btn-outline:hover { background: var(--accent); color: white; }
.btn-sm { padding: 0.4rem 0.8rem; font-size: 0.8rem; }
.btn-block { width: 100%; justify-content: center; }
.btn:disabled { opacity: 0.5; cursor: not-allowed; transform: none !important; }

/* Sections */
.section-title { font-size: 1rem; font-weight: 700; color: var(--text2); text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 1rem; }
.link-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 0.75rem; }
.link-card {
  display: flex; align-items: center; gap: 0.75rem; padding: 0.9rem 1rem;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  text-decoration: none; color: var(--text); transition: all 0.2s;
}
.link-card:hover { border-color: var(--accent); background: var(--bg3); transform: translateY(-2px); }
.link-card .icon { font-size: 1.5rem; }
.link-card .info { flex: 1; }
.link-card .info strong { display: block; font-size: 0.9rem; }
.link-card .info span { font-size: 0.75rem; color: var(--text3); }

/* Console */
.console {
  background: #050810; border: 1px solid var(--border); border-radius: var(--radius);
  font-family: var(--mono); font-size: 0.8rem; line-height: 1.7;
  padding: 1rem; max-height: 300px; overflow-y: auto; white-space: pre-wrap; margin-top: 1rem;
}
.console .ok { color: var(--green); }
.console .err { color: var(--red); }
.console .info { color: var(--accent); }
.console .dim { color: var(--text3); }

/* URLs list */
.url-list { list-style: none; }
.url-list li { display: flex; align-items: center; justify-content: space-between; padding: 0.6rem 0; border-bottom: 1px solid var(--border); font-size: 0.85rem; }
.url-list li:last-child { border-bottom: none; }
.url-list .url-label { color: var(--text2); }
.url-list a { color: var(--accent); text-decoration: none; font-family: var(--mono); font-size: 0.8rem; }
.url-list a:hover { text-decoration: underline; }
.copy-btn { background: var(--bg3); border: 1px solid var(--border); color: var(--text2); padding: 0.2rem 0.5rem; border-radius: 4px; cursor: pointer; font-size: 0.7rem; margin-left: 0.5rem; }
.copy-btn:hover { border-color: var(--accent); color: var(--accent); }
svg.lucide-icon { display: inline-block; width: 1.2em; height: 1.2em; vertical-align: middle; stroke: currentColor; stroke-width: 2; fill: none; }
.link-card svg.lucide-icon { width: 1.5em; height: 1.5em; }
.deploy-card svg.lucide-icon { width: 2rem; height: 2rem; margin-bottom: 0.5rem; }

/* Deploy section */
.deploy-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.75rem; }
.deploy-card {
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 1.25rem; text-align: center; transition: all 0.2s;
}
.deploy-card:hover { border-color: var(--accent); }
.deploy-card .icon { font-size: 2rem; margin-bottom: 0.5rem; }
.deploy-card h4 { font-size: 0.9rem; margin-bottom: 0.25rem; }
.deploy-card p { font-size: 0.75rem; color: var(--text3); margin-bottom: 0.75rem; }
.deploy-card .btn { width: 100%; justify-content: center; }

@media (max-width: 700px) {
  .grid { grid-template-columns: 1fr; }
  .deploy-grid { grid-template-columns: 1fr; }
  .link-grid { grid-template-columns: 1fr; }
}
</style>
</head>
<body>
<div class="container">
  <header>
    <div class="header-left">
      <h1><span>AcuiCal</span> Master</h1>
      <span class="badge">DEV</span>
    </div>
    <div class="header-links">
      <input type="password" id="masterSecret" placeholder="MASTER_SECRET" style="background:var(--bg3);border:1px solid var(--border);color:var(--text);padding:0.4rem 0.8rem;border-radius:8px;font-family:var(--mono);font-size:0.8rem;width:180px" />
      <a href="https://github.com/acuicolasvientoenpopa-coder/acuacal21" class="btn btn-secondary btn-sm" target="_blank">GitHub</a>
      <a href="https://acuacal21-production.up.railway.app/api/health" class="btn btn-secondary btn-sm" target="_blank">Health</a>
    </div>
  </header>

  <div class="grid">
    <div class="card" id="statusCard">
      <div class="card-header"><h3>API Status</h3><span class="dot" id="apiDot"></span></div>
      <div class="card-value" id="apiStatus">ÔÇö</div>
    </div>
    <div class="card">
      <div class="card-header"><h3>Base de Datos</h3></div>
      <div class="card-value green" id="dbStatus">Ô£à Conectada</div>
    </div>
    <div class="card">
      <div class="card-header"><h3>├Ültimo Commit</h3></div>
      <div class="card-value accent" style="font-size:1rem;font-family:var(--mono)" id="lastCommit">ÔÇö</div>
    </div>
  </div>

  <h2 class="section-title"><i data-lucide="globe" class="lucide-icon"></i> URLs del Proyecto</h2>
  <div class="card" style="margin-bottom:1.5rem">
    <ul class="url-list">
      <li><span class="url-label">Landing</span> <a href="https://acuical.com" target="_blank">acuical.com</a> <button class="copy-btn" onclick="copy('https://acuical.com')">copiar</button></li>
      <li><span class="url-label">App (Frontend)</span> <a href="https://app.acuical.com" target="_blank">app.acuical.com</a> <button class="copy-btn" onclick="copy('https://app.acuical.com')">copiar</button></li>
      <li><span class="url-label">Master</span> <a href="https://master.acuical.com" target="_blank">master.acuical.com</a> <button class="copy-btn" onclick="copy('https://master.acuical.com')">copiar</button></li>
      <li><span class="url-label">API</span> <a href="https://acuacal21-production.up.railway.app/api/health" target="_blank">acuacal21-production.up.railway.app</a> <button class="copy-btn" onclick="copy('https://acuacal21-production.up.railway.app/api')">copiar</button></li>
      <li><span class="url-label">Supabase</span> <a href="https://supabase.com/dashboard/project/smvjffbeshxcfltjoolm" target="_blank">smvjffbeshxcfltjoolm</a> <button class="copy-btn" onclick="copy('https://supabase.com/dashboard/project/smvjffbeshxcfltjoolm')">copiar</button></li>
      <li><span class="url-label">Railway</span> <a href="https://railway.com" target="_blank">railway.com</a></li>
      <li><span class="url-label">Cloudflare</span> <a href="https://dash.cloudflare.com" target="_blank">dash.cloudflare.com</a></li>
      <li><span class="url-label">Admin Panel</span> <a href="https://app.acuical.com/admin" target="_blank">app.acuical.com/admin</a></li>
    </ul>
  </div>

  <h2 class="section-title"><i data-lucide="rocket" class="lucide-icon"></i> Deploy</h2>
  <div class="deploy-grid" style="margin-bottom:1.5rem">
    <div class="deploy-card">
      <div class="icon"><i data-lucide="monitor" class="lucide-icon"></i></div>
      <h4>App (Frontend)</h4>
      <p>Cloudflare Pages ÔÇö app.acuical.com</p>
      <button class="btn btn-primary btn-block" onclick="deployApp()" id="btnDeployApp">Deploy App</button>
    </div>
    <div class="deploy-card">
      <div class="icon"><i data-lucide="globe" class="lucide-icon"></i></div>
      <h4>Landing</h4>
      <p>Cloudflare Pages ÔÇö acuical.com</p>
      <button class="btn btn-primary btn-block" onclick="deployLanding()" id="btnDeployLanding">Deploy Landing</button>
    </div>
    <div class="deploy-card">
      <div class="icon"><i data-lucide="settings" class="lucide-icon"></i></div>
      <h4>Master</h4>
      <p>Cloudflare Pages ÔÇö master.acuical.com</p>
      <button class="btn btn-primary btn-block" onclick="deployMaster()" id="btnDeployMaster">Deploy Master</button>
    </div>
  </div>

  <div class="console" id="console">Panel listo. Hac├® clic en un bot├│n para comenzar.</div>

  <h2 class="section-title" style="margin-top:1.5rem"><i data-lucide="package" class="lucide-icon"></i> C├│digo</h2>
  <div class="link-grid">
    <a class="link-card" href="https://github.com/acuicolasvientoenpopa-coder/acuacal21" target="_blank">
      <span class="icon"><i data-lucide="github" class="lucide-icon"></i></span>
      <div class="info"><strong>GitHub Repo</strong><span>brave-eagle</span></div>
    </a>
    <a class="link-card" href="https://github.com/acuicolasvientoenpopa-coder/acuacal21/actions" target="_blank">
      <span class="icon"><i data-lucide="refresh-cw" class="lucide-icon"></i></span>
      <div class="info"><strong>CI/CD</strong><span>Workflows y deploys</span></div>
    </a>
    <a class="link-card" href="https://github.com/acuicolasvientoenpopa-coder/acuacal21/issues" target="_blank">
      <span class="icon"><i data-lucide="bug" class="lucide-icon"></i></span>
      <div class="info"><strong>Issues</strong><span>Reportes y bugs</span></div>
    </a>
    <a class="link-card" href="https://github.com/acuicolasvientoenpopa-coder/acuacal21/pulls" target="_blank">
      <span class="icon"><i data-lucide="git-pull-request" class="lucide-icon"></i></span>
      <div class="info"><strong>Pull Requests</strong><span>Revisiones de c├│digo</span></div>
    </a>
    <a class="link-card" href="https://github.com/acuicolasvientoenpopa-coder/acuacal21/commits/main" target="_blank">
      <span class="icon"><i data-lucide="file-text" class="lucide-icon"></i></span>
      <div class="info"><strong>Commits</strong><span>Historial main</span></div>
    </a>
    <a class="link-card" href="https://github.com/acuicolasvientoenpopa-coder/acuacal21/releases" target="_blank">
      <span class="icon"><i data-lucide="tag" class="lucide-icon"></i></span>
      <div class="info"><strong>Releases</strong><span>Versiones publicadas</span></div>
    </a>
  </div>

  <h2 class="section-title" style="margin-top:1.5rem"><i data-lucide="cloud" class="lucide-icon"></i> Infraestructura</h2>
  <div class="link-grid">
    <a class="link-card" href="https://supabase.com/dashboard/project/smvjffbeshxcfltjoolm" target="_blank">
      <span class="icon"><i data-lucide="database" class="lucide-icon"></i></span>
      <div class="info"><strong>Supabase (General)</strong><span>smvjffbeshxcfltjoolm</span></div>
    </a>
    <a class="link-card" href="https://supabase.com/dashboard/project/smvjffbeshxcfltjoolm/auth/users" target="_blank">
      <span class="icon"><i data-lucide="users" class="lucide-icon"></i></span>
      <div class="info"><strong>Supabase Auth</strong><span>Usuarios registrados</span></div>
    </a>
    <a class="link-card" href="https://supabase.com/dashboard/project/smvjffbeshxcfltjoolm/sql/new" target="_blank">
      <span class="icon"><i data-lucide="file-text" class="lucide-icon"></i></span>
      <div class="info"><strong>Supabase SQL Editor</strong><span>Consultas directas</span></div>
    </a>
    <a class="link-card" href="https://supabase.com/dashboard/project/smvjffbeshxcfltjoolm/editor" target="_blank">
      <span class="icon"><i data-lucide="clipboard-list" class="lucide-icon"></i></span>
      <div class="info"><strong>Supabase Table Editor</strong><span>Datos en vivo</span></div>
    </a>
    <a class="link-card" href="https://supabase.com/dashboard/project/smvjffbeshxcfltjoolm/logs" target="_blank">
      <span class="icon"><i data-lucide="bar-chart-3" class="lucide-icon"></i></span>
      <div class="info"><strong>Supabase Logs</strong><span>Queries y API</span></div>
    </a>
    <a class="link-card" href="https://dash.cloudflare.com/e22e562214433b83a503d1801d0555b8/home/overview" target="_blank">
      <span class="icon"><i data-lucide="cloud" class="lucide-icon"></i></span>
      <div class="info"><strong>Cloudflare Dashboard</strong><span>DNS y seguridad</span></div>
    </a>
    <a class="link-card" href="https://dash.cloudflare.com/e22e562214433b83a503d1801d0555b8/pages/view/acuacal21" target="_blank">
      <span class="icon"><i data-lucide="monitor" class="lucide-icon"></i></span>
      <div class="info"><strong>CF Pages ÔÇö App</strong><span>app.acuical.com</span></div>
    </a>
    <a class="link-card" href="https://dash.cloudflare.com/e22e562214433b83a503d1801d0555b8/pages/view/landing" target="_blank">
      <span class="icon"><i data-lucide="globe" class="lucide-icon"></i></span>
      <div class="info"><strong>CF Pages ÔÇö Landing</strong><span>acuical.com</span></div>
    </a>
    <a class="link-card" href="https://dash.cloudflare.com/e22e562214433b83a503d1801d0555b8/pages/view/master" target="_blank">
      <span class="icon"><i data-lucide="settings" class="lucide-icon"></i></span>
      <div class="info"><strong>CF Pages ÔÇö Master</strong><span>master.acuical.com</span></div>
    </a>
    <a class="link-card" href="https://acuacal21-production.up.railway.app/api/health" target="_blank">
      <span class="icon"><i data-lucide="heart" class="lucide-icon"></i></span>
      <div class="info"><strong>Health Check</strong><span>API status</span></div>
    </a>
    <a class="link-card" href="https://railway.com/project/2422d804-21f3-4cc3-80ac-98f0c035dd2b" target="_blank">
      <span class="icon"><i data-lucide="train" class="lucide-icon"></i></span>
      <div class="info"><strong>Railway Project</strong><span>Backend Express</span></div>
    </a>
  </div>

  <h2 class="section-title" style="margin-top:1.5rem"><i data-lucide="bar-chart-3" class="lucide-icon"></i> Monitoreo & Servicios</h2>
  <div class="link-grid">
    <a class="link-card" href="https://us.posthog.com" target="_blank">
      <span class="icon"><i data-lucide="trending-up" class="lucide-icon"></i></span>
      <div class="info"><strong>PostHog</strong><span>Analytics (demo ÔÇö sin configurar)</span></div>
    </a>
    <a class="link-card" href="https://resend.com/emails" target="_blank">
      <span class="icon"><i data-lucide="mail" class="lucide-icon"></i></span>
      <div class="info"><strong>Resend</strong><span>Email transaccional</span></div>
    </a>
    <a class="link-card" href="https://onvopay.com/dashboard" target="_blank">
      <span class="icon"><i data-lucide="credit-card" class="lucide-icon"></i></span>
      <div class="info"><strong>ONVO Pay</strong><span>Pagos y suscripciones</span></div>
    </a>
    <a class="link-card" href="https://app.acuical.com/admin" target="_blank">
      <span class="icon"><i data-lucide="settings" class="lucide-icon"></i></span>
      <div class="info"><strong>Admin Panel</strong><span>Gesti├│n de usuarios</span></div>
    </a>
  </div>

  <h2 class="section-title" style="margin-top:1.5rem"><i data-lucide="globe" class="lucide-icon"></i> Producto</h2>
  <div class="link-grid">
    <a class="link-card" href="https://acuical.com" target="_blank">
      <span class="icon"><i data-lucide="fish" class="lucide-icon"></i></span>
      <div class="info"><strong>Landing</strong><span>acuical.com</span></div>
    </a>
    <a class="link-card" href="https://app.acuical.com" target="_blank">
      <span class="icon"><i data-lucide="bar-chart-3" class="lucide-icon"></i></span>
      <div class="info"><strong>App</strong><span>app.acuical.com</span></div>
    </a>
    <a class="link-card" href="https://master.acuical.com" target="_blank">
      <span class="icon"><i data-lucide="settings" class="lucide-icon"></i></span>
      <div class="info"><strong>Master</strong><span>master.acuical.com</span></div>
    </a>
  </div>

  <h2 class="section-title" style="margin-top:1.5rem"><i data-lucide="monitor" class="lucide-icon"></i> Desarrollo Local</h2>
  <div class="link-grid">
    <a class="link-card" href="http://localhost:3456" target="_blank">
      <span class="icon"><i data-lucide="wrench" class="lucide-icon"></i></span>
      <div class="info"><strong>Deploy Panel (Local)</strong><span>localhost:3456</span></div>
    </a>
    <a class="link-card" href="http://localhost:5173" target="_blank">
      <span class="icon"><i data-lucide="zap" class="lucide-icon"></i></span>
      <div class="info"><strong>Dev Server</strong><span>localhost:5173</span></div>
    </a>
  </div>
</div>

<script>
const API = 'https://acuacal21-production.up.railway.app/api';

function getSecret() {
  return document.getElementById('masterSecret').value.trim();
}

function log(text, type) {
  const el = document.getElementById('console');
  el.innerHTML += `<span class="${type}">${text}</span>\n`;
  el.scrollTop = el.scrollHeight;
}

function setBusy(id, busy) {
  const btn = document.getElementById(id);
  if (btn) btn.disabled = busy;
}

function copy(text) {
  navigator.clipboard.writeText(text);
}

async function deployApp() {
  const secret = getSecret();
    if (!secret) { log('Ingres├í MASTER_SECRET primero', 'err'); return; }
  setBusy('btnDeployApp', true);
  document.getElementById('console').innerHTML = '';
    log('Deployando App...', 'info');
  try {
    const res = await fetch(`${API}/master/deploy?target=app`, { headers: { 'x-master-secret': secret } });
    const data = await res.json();
    log(data.output || JSON.stringify(data), data.ok ? 'ok' : 'err');
    if (data.ok) log('App deployado exitosamente', 'ok');
  } catch (e) {
    log(`Error: ${e.message}`, 'err');
  }
  setBusy('btnDeployApp', false);
}

async function deployLanding() {
  const secret = getSecret();
    if (!secret) { log('Ingres├í MASTER_SECRET primero', 'err'); return; }
  setBusy('btnDeployLanding', true);
  document.getElementById('console').innerHTML = '';
    log('Deployando Landing...', 'info');
  try {
    const res = await fetch(`${API}/master/deploy?target=landing`, { headers: { 'x-master-secret': secret } });
    const data = await res.json();
    log(data.output || JSON.stringify(data), data.ok ? 'ok' : 'err');
    if (data.ok) log('Landing deployado exitosamente', 'ok');
  } catch (e) {
    log(`Error: ${e.message}`, 'err');
  }
  setBusy('btnDeployLanding', false);
}

async function deployMaster() {
  const secret = getSecret();
    if (!secret) { log('Ingres├í MASTER_SECRET primero', 'err'); return; }
  setBusy('btnDeployMaster', true);
  document.getElementById('console').innerHTML = '';
    log('Deployando Master...', 'info');
  try {
    const res = await fetch(`${API}/master/deploy?target=master`, { headers: { 'x-master-secret': secret } });
    const data = await res.json();
    log(data.output || JSON.stringify(data), data.ok ? 'ok' : 'err');
    if (data.ok) log('Master deployado exitosamente', 'ok');
  } catch (e) {
    log(`Error: ${e.message}`, 'err');
  }
  setBusy('btnDeployMaster', false);
}

async function loadHealth() {
  try {
    const res = await fetch(`${API}/health`);
    const data = await res.json();
    if (data.status === 'ok') {
      document.getElementById('apiDot').className = 'dot up pulse';
      document.getElementById('apiStatus').textContent = 'Ô£à OK ÔÇö v' + (data.version || '?');
      document.getElementById('apiStatus').className = 'card-value green';
    } else {
      document.getElementById('apiDot').className = 'dot down';
      document.getElementById('apiStatus').textContent = 'ÔÜá´©Å ' + data.status;
      document.getElementById('apiStatus').className = 'card-value red';
    }
  } catch {
    document.getElementById('apiDot').className = 'dot down';
    document.getElementById('apiStatus').textContent = 'ÔØî No responde';
    document.getElementById('apiStatus').className = 'card-value red';
  }
}

async function loadCommit() {
  try {
    const res = await fetch(`${API}/master/status`);
    const data = await res.json();
    if (data.ok && data.lastCommit) {
      document.getElementById('lastCommit').textContent = data.lastCommit;
    }
  } catch {}
}

loadHealth();
loadCommit();
lucide.createIcons();
</script>
</body>
</html>