public/compose-index.html

Rama main · réplica de lectura del repositorio original.

<!doctype html>
<html lang="en"><head>
<meta charset="utf-8"><base href="/console/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Ghost Browser · Hosted</title>
<style>
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;background:#16171a;color:#f5f5f7;font:16px system-ui,sans-serif}
[hidden]{display:none!important}#ComposeTarget{display:block;width:100vw;height:100vh;outline:none}
#auth-gate{min-height:100dvh;display:grid;place-items:center;padding:24px;background:radial-gradient(ellipse at top,#283447,#16171a 65%)}
.card{width:min(100%,420px);padding:36px 28px;border:1px solid #39404b;border-radius:22px;background:#1d2026;box-shadow:0 24px 80px #0005}
.brand{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:#a7b5ce}h1{font-size:30px;letter-spacing:-.03em;margin:14px 0}p{color:#bec7d5;line-height:1.55}
.primary,button{display:block;width:100%;padding:14px 16px;border:0;border-radius:10px;background:#80b0ff;color:#101825;font:600 15px system-ui;text-align:center;text-decoration:none;cursor:pointer}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #c1d7ff;outline-offset:4px}button:disabled{opacity:.5}
.note{font-size:13px;color:#9daabe;margin-top:20px}details{margin-top:24px}summary{cursor:pointer;color:#bec7d5;font-size:14px}
label{display:block;font-size:14px;margin-top:16px}input{width:100%;padding:12px;margin:6px 0;border:1px solid #545e70;border-radius:8px;background:#14171c;color:white;font:inherit}form button{margin-top:14px}
</style></head><body>
<main id="auth-gate"><section class="card" aria-labelledby="auth-title">
<div class="brand">Ghost Browser · Hosted</div><h1 id="auth-title">Your browser.<br>One sign-in.</h1>
<p id="auth-status" role="status" aria-live="polite">Connecting securely…</p>
<div id="auth-actions" hidden>
<a class="primary" id="platform-sign-in" href="https://my-app.engineer/?next=%2Fapi%2Fcluster-tools%2Fghost-browser%2Fopen">Sign in with MyApp.Engineer</a>
<p class="note">You’ll return here automatically. No visit to Cluster or Tools is needed.</p>
<details id="password-option" hidden><summary>Use a separate browser password</summary>
<p class="note">Only use this if you set a password inside Ghost Browser. Your MyApp.Engineer password belongs on the sign-in page above.</p>
<form id="local-sign-in"><label>Email or username<input name="username" autocomplete="username" required></label>
<label>Browser password<input type="password" name="password" autocomplete="current-password" required></label>
<button id="password-submit" type="submit">Sign in</button></form></details>
</div></section></main>
<canvas id="ComposeTarget" hidden></canvas>
<script src="/js/console-auth.js"></script>
</body></html>