/* ============================================================
   base.css — self-hosted Satoshi + page reset for the standalone
   landing. Mirrors the app's font wiring (BRAND.md hard rule #1:
   Satoshi only, self-hosted, zero external requests) and the
   dark-room reset from design-mockups/landing-cartridge-v7.html.
   ============================================================ */

@font-face {
  font-family: "Satoshi";
  src: url("/fonts/Satoshi-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Satoshi";
  src: url("/fonts/Satoshi-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Satoshi";
  src: url("/fonts/Satoshi-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Satoshi";
  src: url("/fonts/Satoshi-Black.woff2") format("woff2");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

/* The hook landing.css reads for its family. */
:root {
  --font-sans-app: "Satoshi", ui-sans-serif, system-ui, -apple-system,
    "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* reset + dark room (from v7.html body) */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
html {
  scroll-behavior: auto;
}
body {
  background: #0e0e11;
  color: #f2f0ea;
  font: 400 16px/1.6 var(--font-sans-app);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: clip;
}

/* ------------------------------------------------------------
   Waitlist form — standalone-only bits not present in the app's
   landing.css (kept out of that verbatim copy). Custom props
   (--w35, --idea) inherit from .lp.
   ------------------------------------------------------------ */

/* honeypot: off-screen, unfocusable, invisible to humans */
.lp .beta-form .hp {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

/* status line under the pill; mono class carries 11px uppercase tracking */
.lp .beta-msg {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 16px);
  text-align: center;
  line-height: 1.5;
  color: var(--w35);
  opacity: 0;
  transition: opacity 0.2s ease;
  pointer-events: none;
}
.lp .beta-card:not([data-state="idle"]):not([data-state="sending"]) .beta-msg {
  opacity: 1;
}
.lp .beta-card[data-state="ok"] .beta-msg {
  color: var(--idea);
}

/* success states have nothing left to type — retire the form */
.lp .beta-card[data-state="ok"] .beta-form,
.lp .beta-card[data-state="already"] .beta-form {
  display: none;
}

/* sending: dim the disabled button */
.lp .beta-card[data-state="sending"] .btn-ticket {
  opacity: 0.7;
  pointer-events: none;
}

@media (max-width: 720px) {
  .lp .beta-msg {
    position: static;
    opacity: 1;
    margin-top: 2px;
    min-height: 1em;
  }
}