/* HomeBack app placeholder. One stylesheet, no script; tokens from apps/web theme/tokens.css. */
@font-face {
  font-family: "Manrope"; font-style: normal; font-display: swap; font-weight: 200 800;
  src: url("/fonts/manrope-latin-wght.woff2") format("woff2");
}
:root { --navy: #0B1F3A; --navy-deep: #081729; --ink: #F4F7FC; --muted: #B4C2DA; --faint: #8FA3C4; --blue: #8FB4FF; --blue-600: #1E4FBF; --green: #3FBF7F; }
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
  min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; align-items: center;
  font-family: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif; color: var(--ink); -webkit-font-smoothing: antialiased;
  background:
    radial-gradient(60% 50% at 50% 38%, rgba(90, 134, 214, .22) 0%, rgba(90, 134, 214, 0) 70%),
    linear-gradient(180deg, var(--navy) 0%, var(--navy-deep) 100%);
}
.stage { flex: 1; width: 100%; max-width: 640px; padding: 48px 24px 24px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.logo { display: block; width: 188px; height: auto; margin-bottom: 40px; }
h1 { margin: 0; font-size: clamp(30px, 6vw, 44px); line-height: 1.1; font-weight: 800; letter-spacing: -.02em; text-wrap: balance; }
h1::after { content: ""; display: block; width: 40px; height: 3px; border-radius: 2px; background: var(--green); margin: 22px auto 0; }
.lead { margin: 22px 0 0; max-width: 30em; font-size: 18px; line-height: 1.6; color: var(--muted); text-wrap: balance; }
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; margin-top: 12px; padding: 0 28px; border-radius: 8px; background: var(--blue-600); color: #fff; font-weight: 700; font-size: 16px; text-decoration: none; transition: background 120ms; }
.btn:hover { background: #2D62D6; }
.support { margin: 28px 0 0; font-size: 15px; color: var(--faint); }
.support a { color: var(--blue); text-decoration: underline; text-underline-offset: 3px; }
a:focus-visible { outline: 3px solid rgba(143, 180, 255, .7); outline-offset: 3px; border-radius: 6px; }
.foot { padding: 20px; font-size: 13px; color: var(--faint); }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }
