/* The shareable beat. Deliberately the same typographic world as the reader —
   the link IS the product, so it must not feel like an advert for one. */
.app { min-height: 100dvh; display: flex; flex-direction: column; justify-content: flex-end;
       max-width: 40rem; margin: 0 auto; padding: 2rem 1.25rem 3rem; }
.stage p { margin: 0 0 1rem; }
.choices { display: flex; flex-direction: column; gap: .625rem; margin-top: 1.5rem; }
.choice { text-align: left; padding: .875rem 1rem; border-radius: .5rem; cursor: pointer;
          font: inherit; border: 1px solid currentColor; background: transparent; color: inherit; }
.choice:hover, .choice:focus-visible { opacity: .78; }
.end { margin-top: 2rem; }
.hook { font-style: italic; margin-bottom: 1.25rem; }
.cta { display: inline-block; padding: .875rem 1.5rem; border-radius: .5rem;
       border: 1px solid currentColor; text-decoration: none; color: inherit; font-weight: 600; }
.note { font-size: .8125rem; opacity: .62; margin-top: 1.25rem; }
@media (prefers-reduced-motion: no-preference) { .stage p { animation: rise .5s ease both; } }
@keyframes rise { from { opacity: 0; transform: translateY(.5rem); } to { opacity: 1; transform: none; } }