/* www.heelar.com — what the live site adds to the approved canvas pages (their own CSS is unchanged):
   the phone menu, the waitlist's answer, and plain pages (legal, not found). No red: a warning is amber. */
:root{--amber:#B45309}

/* The header in its settled state: the colours its scroll animation ends on. A plain page starts here; the
   phone menu uses it while open, because white links on an open sand panel would vanish. */
.nav.nav-plain,.nav.is-open{--nav-fg:var(--ink-900);--nav-link:var(--ink-800);--nav-star:var(--green-800);--nav-star-in:#ffffff;--nav-bg:rgba(253,252,250,0.55);--nav-line:rgba(26,23,16,0);--nav-blur:24px;--nav-sat:1.6;--nav-quiet-bg:rgba(26,23,16,0.06);--nav-quiet-bd:rgba(26,23,16,0);--nav-quiet-fg:var(--ink-900);--nav-cta-bg:var(--royale-green);--nav-cta-fg:#ffffff;animation:none}
.nav.nav-plain{position:sticky;top:0;margin-bottom:0}

/* The phone menu's button is a phone thing: some boards left it showing on a desktop. */
@media (min-width: 901px){ .nav .menu-btn{display:none} }
/* "Sign in" sits in the header's buttons on a desktop and folds away on a phone, so the menu carries it there. */
.nav-links .nav-signin{display:none}

/* The phone menu: the same links, in a panel under the header — above the hero's words, never under them. */
@media (max-width: 900px){
  .nav.is-open{--nav-bg:rgba(253,252,250,0.96);z-index:60}
  .nav.is-open .nav-links .nav-signin{display:flex}
  /* solid, not glass: a blur nested inside the header's own blur let the hero's words show through it */
  .nav.is-open .nav-links{display:flex;flex-direction:column;gap:0;position:absolute;top:64px;left:0;right:0;padding:4px 20px 16px;background:var(--bg-page);border-bottom:1px solid var(--border-medium)}
  .nav.is-open .nav-links a{display:flex;align-items:center;min-height:52px;font-size:17px;border-top:1px solid var(--border-soft)}
  .nav.is-open .nav-links a:first-child{border-top:0}
  /* the page you are on: by weight here — the desktop underline would run the full row and read as a rule */
  .nav.is-open .nav-links a.on{background-size:0 0;font-weight:600}
}

/* The waitlist's answer, under the button. */
.wait-status{margin:2px 0 0;min-height:1.5em;font-size:15px;line-height:1.5;color:var(--ink-700)}
.wait-status[data-tone="ok"]{color:var(--royale-green)}
.wait-status[data-tone="warn"]{color:var(--amber)}
.wait-form button[disabled]{opacity:.6}

/* Plain pages: legal text and not found. Open text on the sand, the site's own type. */
.plain{background:var(--bg-page);min-height:60vh}
.plain-body{max-width:760px;margin:0 auto;padding:72px 48px 120px;color:var(--ink-800)}
.plain-body h1{margin:12px 0 18px;font-size:56px;line-height:1.05;font-weight:300;letter-spacing:-0.03em;color:var(--ink-900)}
.plain-body h2{margin:44px 0 10px;font-size:22px;font-weight:500;color:var(--ink-900)}
.plain-body p,.plain-body li{font-size:17px;line-height:1.7}
.plain-body .lede{font-size:20px;color:var(--ink-700)}
.plain-body .todo{display:block;margin:10px 0;padding:14px 0;border-top:1px solid var(--border-medium);border-bottom:1px solid var(--border-medium);color:var(--amber);font-size:15px}
@media (max-width: 900px){
  .plain-body{padding:48px 20px 88px}
  .plain-body h1{font-size:38px}
}