/* /mint — the one page where the marketing department was left unsupervised.
   Same wall, same terminals, but the copy is shouting and there are
   starbursts. Palette gains one screaming yellow and a hot red for the
   duration. Everything is still readable; that is the joke landing, not
   the joke failing. */
:root {
  --yell: #ffe83a;
  --hot: #ff3b3b;
  --hot-dark: #8a0e0e;
}

.dept.hot .dept-name, .dept.hot .dept-label { color: var(--yell); }
.dept.hot .dept-big { color: var(--hot); text-shadow: 0 0 22px rgba(255, 59, 59, 0.5); animation: throb 1.1s ease-in-out infinite; }
.dept.hot:hover { border-color: var(--yell); }

/* ---------- ticker ---------- */
.ticker {
  overflow: hidden;
  border: 1px solid var(--hot-dark);
  background: var(--hot);
  color: #fff;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.18em;
  margin: -14px 0 22px;
  position: relative;
  z-index: 101;                     /* no scanlines over the shouting */
}
.ticker-track { display: flex; white-space: nowrap; width: max-content; animation: ticker 28s linear infinite; }
.ticker-track span { padding: 8px 0; }
@keyframes ticker { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ---------- the hero ---------- */
.infomercial { text-align: center; padding: 34px 22px 30px; overflow: visible; }
.kicker { margin: 0 0 10px; font-size: 11px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--green-dim); }

.shout {
  margin: 0;
  line-height: 0.92;
  font-family: Impact, "Arial Black", "Haettenschweiler", sans-serif;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}
.shout .line1 {
  display: block;
  text-transform: none;            /* nERVOUs is spelled like that */
  font-size: clamp(30px, 6vw, 60px);
  color: var(--green);
  text-shadow: 0 0 18px rgba(88, 255, 156, 0.35);
}
.shout .line2 {
  display: block;
  font-size: clamp(64px, 14vw, 140px);
  color: var(--yell);
  -webkit-text-stroke: 2px #6e5a00;
  text-shadow: 4px 4px 0 var(--hot), 8px 8px 0 var(--hot-dark), 0 0 40px rgba(255, 232, 58, 0.35);
  transform: rotate(-2deg);
  animation: wobble 3.2s ease-in-out infinite;
}
@keyframes wobble { 0%, 100% { transform: rotate(-2deg) scale(1); } 50% { transform: rotate(-1deg) scale(1.03); } }
.tag { margin: 16px auto 0; max-width: 40em; font-size: 15px; color: var(--ink); }

.pricebox { margin: 22px auto 0; display: grid; gap: 4px; justify-items: center; }
.pricebox .was { font-size: 13px; color: var(--green-dim); letter-spacing: 0.1em; text-transform: uppercase; }
.pricebox .was s { color: var(--hot); text-decoration-thickness: 3px; }
.pricebox .now {
  font-family: Impact, "Arial Black", sans-serif;
  font-size: clamp(26px, 5vw, 46px);
  color: #fff;
  letter-spacing: 0.04em;
}
.pricebox .now b { color: var(--yell); font-size: 1.35em; text-shadow: 3px 3px 0 var(--hot); }
.fine { font-size: 10px; color: var(--green-ghost); letter-spacing: 0.04em; }

/* starbursts */
.burst {
  position: absolute;
  width: 118px;
  height: 118px;
  display: grid;
  place-items: center;
  background: var(--yell);
  color: var(--hot-dark);
  font-family: Impact, "Arial Black", sans-serif;
  font-size: 15px;
  line-height: 1.05;
  letter-spacing: 0.04em;
  text-align: center;
  clip-path: polygon(50% 0%, 61% 12%, 76% 4%, 80% 20%, 97% 22%, 90% 37%, 100% 50%, 90% 63%, 97% 78%, 80% 80%, 76% 96%, 61% 88%, 50% 100%, 39% 88%, 24% 96%, 20% 80%, 3% 78%, 10% 63%, 0% 50%, 10% 37%, 3% 22%, 20% 20%, 24% 4%, 39% 12%);
  z-index: 101;
  animation: spin 14s linear infinite;
}
.burst span { display: block; transform: rotate(0deg); animation: unspin 14s linear infinite; }
.burst-a { top: -26px; left: -18px; }
.burst-b { top: -26px; right: -18px; background: var(--hot); color: #fff; animation-direction: reverse; }
.burst-b span { animation-direction: reverse; }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes unspin { to { transform: rotate(-360deg); } }

/* ---------- clock + stock ---------- */
.clockrow { display: flex; gap: 20px; justify-content: center; flex-wrap: wrap; margin-top: 26px; }
.clock, .stock {
  border: 2px solid var(--hot);
  background: #000;
  padding: 14px 18px;
  min-width: 260px;
  position: relative;
  z-index: 101;
}
.clock-label, .stock-label {
  display: block;
  font-size: 11px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--yell);
  font-weight: 700;
}
.digits { display: flex; align-items: baseline; justify-content: center; gap: 4px; margin-top: 8px; }
.digits b {
  display: inline-block;
  min-width: 2ch;
  padding: 4px 6px;
  background: #140000;
  border: 1px solid var(--hot-dark);
  color: var(--hot);
  font-size: 30px;
  font-weight: 700;
  line-height: 1;
  text-shadow: 0 0 14px rgba(255, 59, 59, 0.5);
}
.digits i { font-style: normal; font-size: 11px; color: var(--green-dim); margin-right: 6px; }
.clock-sub, .stock-sub { display: block; margin-top: 8px; font-size: 11px; letter-spacing: 0.16em; color: var(--hot); text-transform: uppercase; font-weight: 700; }
.stock-sub { color: var(--green-dim); font-weight: 400; letter-spacing: 0.04em; text-transform: none; }
.stock { text-align: center; }
.stock-n {
  display: block;
  font-family: Impact, "Arial Black", sans-serif;
  font-size: 54px;
  line-height: 1;
  color: var(--yell);
  text-shadow: 3px 3px 0 var(--hot);
  margin: 4px 0;
}
.clock.live { border-color: var(--green); }
.clock.live .digits b { color: var(--green); border-color: var(--line); text-shadow: 0 0 14px rgba(88, 255, 156, 0.45); }

.blink { animation: blink 1s steps(1) infinite; }
@keyframes throb { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.08); } }

/* ---------- TV + order form ---------- */
.mintwrap { display: grid; grid-template-columns: 1.15fr 1fr; gap: 22px; margin-bottom: 26px; }
.tv { padding: 12px; }
.tv-top {
  display: flex;
  justify-content: space-between;
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--green-dim);
  padding: 2px 4px 10px;
}
.tv-top .live { color: var(--hot); font-weight: 700; }
.tv-screen {
  position: relative;
  aspect-ratio: 1 / 1;              /* four square brokers, 2x2, edge to edge */
  background: #000;
  border: 1px solid var(--line);
  overflow: hidden;
  z-index: 101;                     /* the art shows as the contract draws it */
}
.tv-screen iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: #000; }
.tv-empty { position: absolute; inset: 0; display: grid; place-items: center; color: var(--yell); font-weight: 700; letter-spacing: 0.2em; font-size: 12px; text-align: center; padding: 20px; }
.tv-cap { margin-top: 10px; font-size: 12px; color: var(--green-dim); text-align: center; }

.order h2 { color: var(--yell); }
.round-list { display: grid; gap: 8px; margin-bottom: 16px; }
/* Label + blurb on the first line, terms on their own line beneath: the
   blurb never gets squeezed by a long price/limit/date string. */
.round {
  display: grid;
  grid-template-columns: max-content 1fr;
  align-items: baseline;
  gap: 6px 12px;
  border: 1px solid var(--line-soft);
  padding: 10px 12px;
  font-size: 12px;
}
.round.live { border-color: var(--green); background: #04140a; }
.round.done { opacity: 0.55; }
.round .tag { margin: 0; font-size: 12px; }
.round b { color: var(--ink); font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; }
.round .r-meta {
  grid-column: 1 / -1;
  color: var(--green-dim);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-top: 1px dashed var(--line-soft);
  padding-top: 6px;
}
.round.live .r-meta { color: var(--green); }
.round .r-you { color: var(--yell); font-weight: 700; }

.eligibility { border: 1px dashed var(--line); padding: 12px 14px; margin-bottom: 16px; }
.elig-head { display: block; font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--green-dim); margin-bottom: 4px; }
.elig-body { font-size: 14px; color: var(--ink); }
.eligibility.yes { border-color: var(--green); }
.eligibility.yes .elig-body { color: var(--green); font-weight: 700; }
.eligibility.no .elig-body { color: var(--ink); }

.qty-row { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 16px; }
.qty-label { font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--green-dim); }
.qty-note { font-size: 11px; color: var(--green-ghost); }

.mint-btn {
  width: 100%;
  padding: 20px;
  font-family: Impact, "Arial Black", sans-serif;
  font-size: 30px;
  letter-spacing: 0.08em;
  background: var(--hot);
  border: 3px solid var(--yell);
  color: #fff;
  text-shadow: 2px 2px 0 var(--hot-dark);
  box-shadow: 0 0 0 4px #000, 0 0 30px rgba(255, 59, 59, 0.45);
  animation: throb 1.4s ease-in-out infinite;
}
.mint-btn:hover:not(:disabled) { background: #ff5252; box-shadow: 0 0 0 4px #000, 0 0 44px rgba(255, 232, 58, 0.5); }
.mint-btn:disabled { animation: none; opacity: 0.45; cursor: not-allowed; }
.mint-flash { min-height: 1.4em; margin: 12px 0 0; font-size: 13px; color: var(--green); }
.mint-flash.bad { color: #ff7070; }
.mint-flash a { color: var(--cyan); border-bottom-color: var(--cyan); }
.phone-banner {
  margin-top: 18px;
  padding: 14px 16px 16px;
  border: 2px dashed var(--yell);
  background: #140000;
  text-align: center;
  display: grid;
  gap: 2px;
  position: relative;
  z-index: 101;
}
.phone-call {
  font-size: 12px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--hot);
  font-weight: 700;
  animation: blink 1.2s steps(1) infinite;
}
.phone-number {
  font-family: Impact, "Arial Black", sans-serif;
  font-size: clamp(28px, 4.2vw, 40px);
  letter-spacing: 0.06em;
  color: var(--yell);
  text-shadow: 3px 3px 0 var(--hot), 0 0 24px rgba(255, 232, 58, 0.35);
  line-height: 1.1;
}
.phone-sub { font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--green-dim); }

/* ---------- more + testimonials ---------- */
.more h2, .testimonials h2 { color: var(--yell); }
.more-list { list-style: none; margin: 0; padding: 0; }
.more-list li { position: relative; padding: 10px 0 10px 32px; border-bottom: 1px solid var(--line-soft); font-size: 14px; color: var(--ink); }
.more-list li:last-child { border-bottom: 0; }
.more-list li::before { content: "\2713"; position: absolute; left: 4px; color: var(--yell); font-weight: 700; font-size: 16px; }
.quotes { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
.quotes blockquote { margin: 0; padding: 14px; border: 1px solid var(--line-soft); font-size: 14px; line-height: 1.55; color: var(--ink); background: #030803; }
.quotes cite { display: block; margin-top: 10px; font-style: normal; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green-dim); }

@media (max-width: 820px) {
  .mintwrap { grid-template-columns: 1fr; }
  .burst { width: 84px; height: 84px; font-size: 11px; }
  .burst-a { top: -14px; left: -8px; }
  .burst-b { top: -14px; right: -8px; }
  .ticker { font-size: 11px; }
  .digits b { font-size: 24px; }
  .clock, .stock { min-width: 0; flex: 1 1 100%; }
  .mint-btn { font-size: 24px; padding: 16px; }
}

/* ---------- lobby promo card: the banner's centre, no brokers ---------- */
.score-card { text-align: center; }
.score-card > h2.score-title {
  font-size: 22px;
  letter-spacing: 0.28em;
  margin-bottom: 14px;
  text-shadow: 0 0 14px rgba(88, 255, 156, 0.3);
}
.score-card .score-out .actions { justify-content: center; }
.score-card .result-value { font-size: 72px; margin-top: 6px; }
.score-card .result-rank { margin-top: 10px; }
.score-card .score-in { text-align: center; padding: 6px 0 4px; line-height: 1; }
.score-card .score-in .actions { justify-content: center; }
.score-card .score-out .actions { margin-top: 12px; }

a.promo {
  display: grid;
  justify-items: center;
  gap: 8px;
  text-align: center;
  padding: 30px 22px 26px;
  border-bottom: 1px solid var(--line);
  color: inherit;
  transition: border-color 0.14s, box-shadow 0.14s, transform 0.14s;
}
a.promo:hover { border-color: var(--yell); box-shadow: 0 0 28px rgba(255, 232, 58, 0.18); transform: translateY(-2px); color: inherit; }
a.promo .shout { display: flex; gap: 0.25em; align-items: baseline; justify-content: center; flex-wrap: wrap; }
a.promo .shout .line1, a.promo .shout .line2 { display: inline-block; font-size: clamp(40px, 7vw, 76px); transform: none; animation: none; }
a.promo .shout .line2 { text-shadow: 3px 3px 0 var(--hot), 6px 6px 0 var(--hot-dark), 0 0 30px rgba(255, 232, 58, 0.3); }
.promo-strip {
  margin-top: 6px;
  padding: 8px 22px;
  background: var(--hot);
  color: #fff;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.16em;
}
.promo-call { margin-top: 10px; font-size: 12px; font-weight: 700; letter-spacing: 0.3em; color: var(--hot); }
.promo-number {
  font-family: Impact, "Arial Black", sans-serif;
  font-size: clamp(44px, 8vw, 92px);
  line-height: 1;
  letter-spacing: 0.04em;
  color: var(--yell);
  text-shadow: 4px 4px 0 var(--hot), 8px 8px 0 var(--hot-dark), 0 0 34px rgba(255, 232, 58, 0.35);
}
.promo-lines { margin-top: 8px; font-size: 15px; font-weight: 700; letter-spacing: 0.1em; color: var(--ink); }
.promo-fine { font-size: 11px; letter-spacing: 0.1em; color: var(--green-dim); }
@media (max-width: 620px) {
  .score-card .result-value { font-size: 54px; }
  a.promo { padding: 22px 14px; }
  .promo-strip { font-size: 10px; letter-spacing: 0.08em; padding: 7px 10px; }
}

.collectible-note { margin: 12px 0 0; text-align: center; color: var(--green-dim); font-size: 11px; line-height: 1.6; }

/* ---------- COMING SOON, the size it deserves ---------- */
.soon-banner {
  position: relative;
  z-index: 101;
  margin: 0 0 22px;
  padding: 26px 20px 22px;
  border: 3px solid var(--yell);
  background:
    repeating-linear-gradient(-45deg, #1a1200 0 18px, #0b0800 18px 36px);
  text-align: center;
  display: grid;
  gap: 8px;
  box-shadow: 0 0 0 4px #000, 0 0 40px rgba(255, 232, 58, 0.25);
}
.soon-word {
  font-family: Impact, "Arial Black", sans-serif;
  font-size: clamp(56px, 11vw, 124px);
  line-height: 0.95;
  letter-spacing: 0.04em;
  color: var(--yell);
  -webkit-text-stroke: 2px #6e5a00;
  text-shadow: 5px 5px 0 var(--hot), 10px 10px 0 var(--hot-dark), 0 0 46px rgba(255, 232, 58, 0.4);
  animation: throb 1.8s ease-in-out infinite;
}
.soon-sub {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink);
}
@media (max-width: 620px) {
  .soon-banner { padding: 18px 12px 16px; }
  .soon-sub { font-size: 11px; letter-spacing: 0.12em; }
}

/* ---------- the multiplier tease ---------- */
.multiplier {
  margin: 26px auto 0;
  max-width: 640px;
  padding: 16px 18px 14px;
  border: 2px dashed var(--green);
  background: #04140a;
  display: grid;
  gap: 6px;
  position: relative;
  z-index: 101;
}
.mult-head { font-size: 11px; letter-spacing: 0.26em; text-transform: uppercase; color: var(--green-dim); font-weight: 700; }
.mult-body { font-size: 16px; color: var(--ink); }
.mult-body b { color: var(--green); }
.mult-grid { display: flex; gap: 10px 22px; justify-content: center; flex-wrap: wrap; margin-top: 4px; font-size: 13px; color: var(--ink); }
.mult-grid b { font-family: Impact, "Arial Black", sans-serif; font-size: 26px; color: var(--magenta); text-shadow: 0 0 14px rgba(255, 54, 168, 0.4); margin-right: 6px; vertical-align: -2px; }

/* ---------- review pass, September 2026 ---------- */
/* 12px floor for anything a visitor needs: price, rounds, the disclaimer. */
.fine, .collectible-note, .qty-note, .round .r-meta { font-size: 12px; }
.stock-sub.loud { font-size: 12px; color: var(--yell); font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.digits .tba { font-size: 26px; letter-spacing: 0.24em; padding: 6px 16px 6px 20px; }
/* On a phone the starbursts sit above the hero instead of over it. */
@media (max-width: 560px) {
  .burst, .burst-b { position: static; display: inline-grid; width: 74px; height: 74px; font-size: 10px; margin: 0 6px 14px; }
  .infomercial { padding-top: 22px; }
}

/* ---------- the receipt: what the wallet is about to be asked ---------- */
.receipt {
  display: grid; gap: 6px; margin-bottom: 14px; padding: 12px 14px;
  border: 1px solid var(--line); background: #000; font-size: 12px; color: var(--ink);
}
.rc-line { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-width: 0; }
.rc-k { flex: none; width: 5.5em; font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--green-dim); }
.rc-line b { color: var(--yell); font-size: 14px; }
.rc-line code { font: inherit; color: var(--ink); overflow-wrap: anywhere; min-width: 0; }
.rc-dim { color: var(--green-ghost); }
