/* The homepage strip for a visitor sent by an AI assistant (ai-strip.js,
   09.11.2026). It mirrors the app's founding-offer strip (FoundingOffer.tsx,
   theme.css .grace-banner + .checkout-banner + .founding-strip): one centred
   line under the top bar on the surface colour, a 2px bottom edge in the dark
   series grey — no lime, because its two links are flat links and the page's
   one lime action stays the hero's button — and a bare ✕ in the corner, the
   glyph and greys of the account page's .acct-note-x. On a phone it wraps
   into a left-aligned paragraph with the ✕ kept clear at the top right.
   Its own sheet, loaded by index.html alone: the only page that has it. The
   site is light-only (styles.css says so), so there is no dark variant. */
.ai-strip {
  position: relative;
  display: flex; align-items: center; justify-content: center;
  /* 44px clears the ✕ (14px + its 27px box). At 1280px the longest copy,
     ChatGPT's (1095 of 1192px on macOS), keeps ~8% spare for Linux fonts. */
  padding: 8px 44px; text-align: center;
  background: var(--surface); color: var(--ink);
  border-bottom: 2px solid var(--head);
  font-size: 13.5px; font-weight: 300; line-height: 1.45;
}
/* A class display outranks the UA [hidden] rule. */
.ai-strip[hidden] { display: none; }
.ai-strip-text { min-width: 0; overflow-wrap: break-word; }
/* "sign-up" never splits at its own hyphen on a phone. */
.ai-strip-nw { white-space: nowrap; }
.ai-strip-x {
  position: absolute; top: 50%; right: 14px; transform: translateY(-50%);
  border: none; background: none; padding: 4px 6px; cursor: pointer;
  font: 400 15px var(--font); line-height: 1; color: var(--muted);
}
.ai-strip-x:hover { color: var(--ink); }
@media (max-width: 700px) {
  .ai-strip { justify-content: flex-start; text-align: left; padding: 9px 44px 9px 16px; }
  .ai-strip-x { top: 6px; right: 8px; transform: none; padding: 6px 8px; }
}