/* Small additions on top of the page designs */
html { scroll-behavior: smooth; }
img { max-width: 100%; }
[hidden] { display: none !important; }
#fs-toast { position: fixed; left: 50%; bottom: 24px; transform: translate(-50%, 140%); max-width: min(92vw, 520px);
  padding: 14px 20px; border-radius: 14px; background: #DC382E; color: #F2EEE4; border: 3px solid #080808;
  font: 700 16px/22px 'Inter Tight', system-ui, sans-serif; box-shadow: 4px 4px 0 rgba(0,0,0,.5); z-index: 9999;
  transition: transform .25s ease; }
#fs-toast.ok { background: #72C45A; color: #121010; }
#fs-toast.show { transform: translate(-50%, 0); }
dialog::backdrop { background: rgba(0,0,0,.8); }
button[aria-pressed] { cursor: pointer; }
[data-busy] { pointer-events: none; }
/* Phones: keep the big titles and the nav inside the screen */
@media (max-width: 640px) {
  header nav[aria-label="Main"] { gap: 12px 16px !important; font-size: 14px !important; }
  h1 { font-size: clamp(40px, 11vw, 64px) !important; line-height: 1.02 !important; overflow-wrap: anywhere; }
  h2 { overflow-wrap: anywhere; }
  main section { padding-left: 16px !important; padding-right: 16px !important; }
}
/* The LIVE ticker scrolls inside its own strip, never the page */
[aria-label="Live updates"] { overflow: hidden; max-width: 100%; }
[aria-label="Live updates"] > div { min-width: 0; overflow: hidden; }
/* Full-width cards with padding stay inside the screen */
[style*="width: 100%"][style*="padding"] { box-sizing: border-box; }
html, body { overflow-x: clip; }
/* Checkout opens on the page, in our colors around Stripe's form */
#fs-checkout { width: min(560px, 94vw); max-height: 92vh; padding: 0; border: 4px solid #080808; border-radius: 22px; background: #F2EEE4; box-shadow: 8px 8px 0 rgba(0,0,0,.6); overflow: auto; }
#fs-checkout::backdrop { background: rgba(8,8,8,.82); }
#fs-checkout .fs-co-head { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; background: #0E0C0C; color: #F6C83A; font: 500 13px/1 'DM Mono', ui-monospace, monospace; letter-spacing: .18em; }
#fs-checkout .fs-co-head button { width: 40px; height: 40px; border: 0; border-radius: 999px; background: #1A1716; color: #F2EEE4; font-size: 24px; cursor: pointer; }
#fs-co-mount { min-height: 420px; padding: 8px 0 16px; }

#fs-checkout .fs-co-wait{font:600 16px/1.4 system-ui,sans-serif;color:#555;text-align:center;padding:48px 16px;margin:0}

@keyframes fsPulse{0%,100%{opacity:1}50%{opacity:.25}}.fs-pulse{animation:fsPulse 1s ease-in-out infinite}

[data-b="heat-before"][hidden]{display:none!important}
.fs-was{position:relative;opacity:.5;width:max-content}
.fs-was::after{content:'';position:absolute;left:-2px;right:-2px;top:50%;height:3px;margin-top:-1px;background:#D9473B;border-radius:2px}

/* Vault tiles: the 9:16 box was shrinking to 169px wide and sitting left. Fill the tile and center the lock text. */
[data-list="endings"] > * > div:first-child, [data-list="bts"] > * > div:first-child { width: 100%; aspect-ratio: auto !important; height: 300px; max-height: none !important; }
[data-tpl="ending-locked"] [data-f="why"] { text-align: center; padding: 0 20px; line-height: 1.6; }

/* Founder's Pass on phones: the pass card comes right after the headline, the checklist moves below it,
   so people can pay without scrolling past the sales copy. Desktop keeps the two columns. */
@media (max-width: 899px) {
  section[aria-labelledby="fp-title"] { flex-direction: column !important; gap: 20px !important; padding-top: 28px !important; }
  section[aria-labelledby="fp-title"] > div:first-child { display: contents !important; }
  section[aria-labelledby="fp-title"] > div:first-child > * { order: 3; }
  section[aria-labelledby="fp-title"] > div:first-child > p:first-child { order: 0; margin-bottom: -8px !important; }
  section[aria-labelledby="fp-title"] #fp-title { order: 1; font-size: 40px !important; line-height: 44px !important; }
  section[aria-labelledby="fp-title"] > form { order: 2; width: 100%; box-sizing: border-box; }
}
@media (max-width: 899px) {
  body[data-page="the-ticket-founders"] nav[aria-label="Checkout steps"] { flex-wrap: nowrap !important; gap: 10px !important; }
  body[data-page="the-ticket-founders"] nav[aria-label="Checkout steps"] > span { font-size: 10px !important; letter-spacing: 0.06em !important; gap: 5px !important; white-space: nowrap; }
  body[data-page="the-ticket-founders"] nav[aria-label="Checkout steps"] > span > span { width: 20px !important; height: 20px !important; }
  body[data-page="the-ticket-founders"] header > div { flex-wrap: wrap; row-gap: 10px !important; padding-top: 12px !important; padding-bottom: 12px !important; }
  section[aria-labelledby="fp-title"] { padding-top: 18px !important; gap: 16px !important; }
  section[aria-labelledby="fp-title"] > div:first-child > p:first-child { display: none; }
  section[aria-labelledby="fp-title"] #fp-title { font-size: 34px !important; line-height: 38px !important; }
  section[aria-labelledby="fp-title"] > form { padding: 20px !important; gap: 12px !important; }
  section[aria-labelledby="fp-title"] [data-b="next-no"] { font-size: 64px !important; line-height: 64px !important; -webkit-text-stroke-width: 6px !important; }
  section[aria-labelledby="fp-title"] fieldset > span { font-size: 14px !important; line-height: 19px !important; }
}