:root {
  --black: #000000;
  --ink: #141414;
  --line: #2a2a2a;
  --red: #D0101E;
  --red-dark: #9E0A15;
  --bone: #F4F1EC;
  --steel: #9A9A9A;
  --display: "Big Shoulders Display", "Arial Narrow", Impact, sans-serif;
  --body: "Barlow", "Helvetica Neue", Arial, sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
html, body { margin: 0; }
body {
  background: var(--black);
  color: var(--bone);
  font-family: var(--body);
  font-size: 1.0625rem;
  line-height: 1.55;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
main { flex: 1; }
img { display: block; max-width: 100%; }
a { color: inherit; }
h2 { font-family: var(--display); font-weight: 900; text-transform: uppercase; line-height: .95; margin: 0 0 1rem; font-size: clamp(2.6rem, 6vw, 4.2rem); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid var(--red); outline-offset: 3px; }
.eyebrow { color: var(--red); font-weight: 600; font-size: 1rem; margin: 0 0 .6rem; }

/* Nav */
.nav {
  position: sticky; top: 0; z-index: 10;
  display: flex; align-items: center; justify-content: space-between;
  padding: .95rem clamp(1.25rem, 4vw, 3rem);
  background: rgba(0,0,0,.92);
  border-bottom: 1px solid var(--line);
}
.brand { font-family: var(--display); font-weight: 900; font-size: 1.9rem; text-decoration: none; line-height: 1; letter-spacing: .02em; }
.brand span { color: var(--red); margin-left: .3rem; }
.nav nav { display: flex; gap: 1.5rem; align-items: center; }
.nav nav a { text-decoration: none; font-weight: 600; color: var(--steel); }
.nav nav a:hover { color: var(--bone); }
.nav nav a.nav-cta { color: #fff; background: var(--red); padding: .45rem .9rem; border-radius: 2px; }
.nav nav a.nav-cta:hover { background: var(--red-dark); }

/* Hero */
.hero {
  position: relative;
  min-height: calc(100vh - 66px);
  display: flex;
  align-items: center;
  overflow: hidden;
  padding: 4rem clamp(1.25rem, 6vw, 5rem);
}
.hero-img { position: absolute; top: 0; right: 0; bottom: 0; width: min(56%, 820px); }
.hero-img img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.hero-img::before {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(90deg, var(--black) 0%, rgba(0,0,0,.6) 28%, rgba(0,0,0,0) 60%),
              linear-gradient(0deg, var(--black) 0%, rgba(0,0,0,0) 30%);
}
.credit { position: absolute; right: .75rem; bottom: .6rem; z-index: 2; font-size: .75rem; color: #ddd; }
.hero-text { position: relative; z-index: 2; max-width: 38rem; }
.tagline {
  font-family: var(--display); font-weight: 900; text-transform: uppercase;
  font-size: clamp(5rem, 15vw, 12rem); line-height: .8; margin: 0 0 1.5rem;
  display: flex; flex-direction: column;
  text-shadow: .045em .045em 0 var(--red);
}
.tagline span:nth-child(2) { padding-left: .5em; }
.tagline span:nth-child(3) { padding-left: 1em; }
@media (prefers-reduced-motion: no-preference) {
  .tagline span { animation: snap .55s cubic-bezier(.2,.8,.2,1) both; }
  .tagline span:nth-child(2) { animation-delay: .12s; }
  .tagline span:nth-child(3) { animation-delay: .24s; }
  @keyframes snap { from { opacity: 0; transform: translateX(-.4em); } to { opacity: 1; transform: none; } }
}
.name { font-family: var(--display); font-weight: 700; font-size: 1.9rem; margin: 0 0 .5rem; }
.sub { max-width: 32rem; font-size: 1.15rem; margin: 0 0 2rem; color: #dcd8d2; }
.actions { display: flex; flex-wrap: wrap; gap: .9rem; }

/* Buttons */
.btn {
  display: inline-block; font-family: var(--display); font-weight: 700; font-size: 1.35rem;
  letter-spacing: .03em; text-decoration: none; padding: .7rem 1.6rem; border-radius: 2px;
  border: 2px solid transparent; cursor: pointer;
}
.btn-red { background: var(--red); color: #fff; }
.btn-red:hover { background: var(--red-dark); }
.btn-red:disabled { opacity: .6; cursor: wait; }
.btn-ghost { border-color: var(--bone); color: var(--bone); }
.btn-ghost:hover { background: var(--bone); color: var(--black); }
.btn-black { background: var(--black); color: #fff; }
.btn-black:hover { background: #222; }

/* Ticker (Bobby Witt Jr. style) */
.ticker { background: var(--red); color: #fff; overflow: hidden; white-space: nowrap; border-block: 1px solid var(--red-dark); }
.ticker-track { display: inline-flex; padding: .7rem 0; }
.ticker-track span { font-family: var(--display); font-weight: 900; text-transform: uppercase; font-size: 1.6rem; padding: 0 1.5rem; }
.ticker-track span::after { content: "//"; margin-left: 3rem; opacity: .6; }
@media (prefers-reduced-motion: no-preference) {
  .ticker-track { animation: ticker 28s linear infinite; }
  @keyframes ticker { from { transform: translateX(0); } to { transform: translateX(-50%); } }
}

/* Stats (Bo Nickal style) */
.stats {
  display: grid; grid-template-columns: repeat(4, 1fr);
  max-width: 76rem; margin: 0 auto; width: 100%;
  border-bottom: 1px solid var(--line);
}
.stat { padding: 2rem 1.25rem; border-right: 1px solid var(--line); text-align: center; }
.stat:last-child { border-right: 0; }
.stat strong { display: block; font-family: var(--display); font-weight: 900; font-size: clamp(1.8rem, 4vw, 2.8rem); line-height: 1; overflow-wrap: anywhere; }
.stat span { color: var(--steel); font-size: .95rem; }

/* Story */
.story {
  max-width: 76rem; margin: 0 auto; padding: 5rem clamp(1.25rem, 6vw, 5rem);
  display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(2rem, 5vw, 4rem); align-items: center;
}
.story-img { margin: 0; aspect-ratio: 4 / 5; overflow: hidden; border: 3px solid var(--bone); box-shadow: 14px 14px 0 var(--red); }
.story-img img { width: 100%; height: 100%; object-fit: cover; }
.story-text p { max-width: 36rem; color: #dcd8d2; }

/* Media */
.media { background: var(--ink); padding: 5rem clamp(1.25rem, 6vw, 5rem); border-top: 1px solid var(--line); }
.media-head, .media-grid { max-width: 76rem; margin: 0 auto; }
.media-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 1.25rem; }
.media-grid figure { margin: 0; position: relative; overflow: hidden; aspect-ratio: 900 / 940; border-bottom: 6px solid var(--red); }
.media-grid figure img { width: 100%; height: 100%; object-fit: cover; }
.media-grid figcaption { position: absolute; left: 0; bottom: 0; background: rgba(0,0,0,.7); padding: .4rem .8rem; font-weight: 600; }
.media-card {
  display: flex; flex-direction: column; justify-content: flex-end; gap: .4rem;
  padding: 2rem; text-decoration: none; background: var(--black); border: 1px solid var(--line);
}
.media-card:hover { border-color: var(--red); }
.media-card-title { font-family: var(--display); font-weight: 900; font-size: 2.6rem; text-transform: uppercase; line-height: .95; }
.media-card-link { color: var(--red); font-weight: 600; }

/* Partner band */
.partner { background: var(--red); color: #fff; }
.partner-inner {
  max-width: 76rem; margin: 0 auto; padding: 3.5rem clamp(1.25rem, 6vw, 5rem);
  display: flex; flex-wrap: wrap; gap: 1.5rem 3rem; align-items: center; justify-content: space-between;
}
.partner h2 { margin-bottom: .5rem; }
.partner p { margin: 0; max-width: 36rem; }

/* Contact page */
.contact-banner { position: relative; height: clamp(240px, 36vw, 420px); overflow: hidden; }
.contact-banner img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.contact-banner::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, var(--black) 0%, rgba(0,0,0,.35) 60%, rgba(0,0,0,.2) 100%); }
.contact-banner-text { position: absolute; left: 0; right: 0; bottom: 1.5rem; z-index: 2; max-width: 44rem; margin: 0 auto; padding: 0 clamp(1.25rem, 5vw, 2rem); }
.contact-banner h1 {
  font-family: var(--display); font-weight: 900; text-transform: uppercase;
  font-size: clamp(3.25rem, 11vw, 6rem); line-height: .9; margin: 0; text-shadow: .04em .04em 0 var(--red);
}
.contact { width: 100%; max-width: 44rem; margin: 0 auto; padding: 1.5rem clamp(1.25rem, 5vw, 2rem) 5rem; }
.contact-intro { color: #dcd8d2; margin: 0 0 2rem; }
.form .row { margin-bottom: 1.25rem; }
.form .two { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
label { display: block; font-weight: 600; margin-bottom: .4rem; }
input, select, textarea {
  width: 100%; font: inherit; color: var(--bone); background: var(--ink);
  border: 1px solid #3a3a3a; border-radius: 2px; padding: .75rem .9rem;
}
input:focus, select:focus, textarea:focus { border-color: var(--red); }
textarea { resize: vertical; }
.form-error { color: #ff7a82; font-weight: 600; margin: 0 0 1rem; }
.form-done { background: var(--ink); border-left: 4px solid var(--red); padding: .8rem 1rem; margin: 1.25rem 0 0; }

/* Footer */
.foot {
  display: flex; justify-content: space-between; gap: 1rem;
  padding: 1.25rem clamp(1.25rem, 4vw, 3rem); color: var(--steel); font-size: .95rem; border-top: 1px solid var(--line);
}
.foot a { color: var(--steel); }

/* Responsive */
@media (max-width: 860px) {
  .hero { flex-direction: column; align-items: flex-start; padding-top: 0; min-height: auto; }
  .hero-img { position: relative; width: calc(100% + 2 * clamp(1.25rem, 6vw, 5rem)); margin: 0 calc(-1 * clamp(1.25rem, 6vw, 5rem)); height: 70vh; }
  .hero-img::before { background: linear-gradient(0deg, var(--black) 0%, rgba(0,0,0,0) 45%); }
  .hero-text { margin-top: -5rem; }
  .stats { grid-template-columns: repeat(2, 1fr); }
  .stat:nth-child(2) { border-right: 0; }
  .stat:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .story { grid-template-columns: 1fr; padding-top: 3.5rem; }
  .story-img { max-width: 26rem; }
  .media-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .nav nav { gap: .9rem; }
  .nav nav a:not(.nav-cta) { display: none; }
  .form .two { grid-template-columns: 1fr; }
  .story-img { box-shadow: 8px 8px 0 var(--red); }
}
/* Photo gallery grid */
.media-grid { grid-template-columns: repeat(2, 1fr); }
.media-grid figure { aspect-ratio: 4 / 5; }
.media-card { min-height: 100%; }
@media (min-width: 1000px) { .media-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 560px) { .media-grid { grid-template-columns: 1fr; } }

/* Highlights video */
.highlights { padding: 5rem clamp(1.25rem, 6vw, 5rem) 1rem; }
.highlights-inner { max-width: 64rem; margin: 0 auto; }
.video-wrap { position: relative; aspect-ratio: 16 / 9; background: var(--ink); border: 3px solid var(--bone); box-shadow: 14px 14px 0 var(--red); }
.video-wrap video { width: 100%; height: 100%; display: block; background: #000; }
.video-note { color: var(--steel); margin: 1.5rem 0 0; }
@media (max-width: 560px) { .video-wrap { box-shadow: 8px 8px 0 var(--red); } }

/* Catch with Miro game */
.game { padding: 5rem clamp(1.25rem, 6vw, 5rem) 1rem; }
.game-inner { max-width: 64rem; margin: 0 auto; }
.game-sub { color: #dcd8d2; max-width: 40rem; margin: 0 0 1.5rem; }
.game-bar { display: flex; justify-content: space-between; align-items: center; margin-bottom: .8rem; font-weight: 600; }
.game-reset { font: inherit; color: var(--bone); background: transparent; border: 1px solid #3a3a3a; padding: .35rem .9rem; cursor: pointer; border-radius: 2px; }
.game-reset:hover { border-color: var(--red); }
.game-wrap { position: relative; border: 3px solid var(--bone); box-shadow: 14px 14px 0 var(--red); background: #0a170d; touch-action: manipulation; user-select: none; -webkit-user-select: none; }
#qbCanvas { display: block; width: 100%; cursor: crosshair; }
.qb-card { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(92%, 30rem); background: var(--black); border: 2px solid var(--red); padding: 1.5rem; box-shadow: 0 12px 40px rgba(0,0,0,.6); }
.qb-card[hidden] { display: none; }
.qb-card-num { color: var(--red); font-weight: 600; margin: 0; }
.qb-card h3 { font-family: var(--display); font-weight: 900; font-size: clamp(1.6rem, 4vw, 2.1rem); line-height: 1.05; margin: .35rem 0 .9rem; }
.qb-card-a { color: #dcd8d2; margin: 0 0 1.25rem; }
.qb-card-a.pending, .qb-list .pending { color: var(--steel); font-style: italic; }
.qb-list { margin-top: 2rem; }
.qb-list summary { cursor: pointer; font-weight: 600; }
.qb-list li { margin: .7rem 0; }
.qb-list li span { display: block; color: #dcd8d2; }
@media (max-width: 560px) { .game-wrap { box-shadow: 8px 8px 0 var(--red); } .qb-card { padding: 1.1rem; } }

/* Scoreboard */
.scoreboard { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; background: var(--ink); border-top: 4px solid var(--red); margin-bottom: .8rem; }
.sb-team { display: flex; align-items: baseline; justify-content: center; gap: .6rem; padding: .7rem .5rem; }
.sb-team span { color: var(--steel); font-weight: 600; text-transform: uppercase; font-size: .9rem; }
.sb-team strong, .sb-mid strong { font-family: var(--display); font-weight: 900; font-size: 2.2rem; line-height: 1; }
.sb-mid { text-align: center; padding: .55rem 1.25rem; background: var(--black); border-inline: 1px solid var(--line); }
.sb-mid strong { color: var(--red); display: block; }
.sb-mid span { color: var(--steel); font-size: .85rem; }

.game-btns { display: flex; gap: .5rem; }
.sb-mid > span:first-child { display: block; color: var(--bone); font-weight: 600; font-size: .85rem; text-transform: uppercase; }

.video-foot { display: flex; flex-wrap: wrap; gap: 1rem 2rem; align-items: center; justify-content: space-between; margin-top: 1.5rem; }
.video-foot .video-note { margin: 0; }
.foot-links { display: flex; gap: 1.25rem; }

/* Halloween zombie game */
.zwrap { border-color: #ff7a1a; box-shadow: 14px 14px 0 #7a3cff; background: #0b0614; }
.z-eyebrow { color: #ff7a1a; }
.z-card { border-color: #ff7a1a; }
.z-card .qb-card-num { color: #ff7a1a; }
@media (max-width: 560px) { .zwrap { box-shadow: 8px 8px 0 #7a3cff; } }

.z-card-btns { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
#zCanvas { touch-action: none; }
#zCanvas:focus-visible { outline: 3px solid #ff7a1a; outline-offset: -3px; }

/* Play call screen */
.playcall { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(94%, 36rem); background: rgba(0,0,0,.94); border: 2px solid var(--red); padding: 1rem; box-shadow: 0 12px 40px rgba(0,0,0,.6); }
.playcall[hidden] { display: none; }
.ovr { display: flex; align-items: center; gap: .8rem; margin-bottom: .8rem; padding-bottom: .8rem; border-bottom: 1px solid var(--line); }
.ovr-num { font-family: var(--display); font-weight: 900; font-size: 2.6rem; line-height: 1; background: var(--red); color: #fff; padding: .2rem .55rem; }
.ovr-txt strong { display: block; font-family: var(--display); font-size: 1.4rem; text-transform: uppercase; line-height: 1.05; }
.ovr-txt span { color: var(--steel); font-size: .85rem; }
.playcall .qb-card-num { margin-bottom: .6rem; }
.play-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.play-btn { text-align: left; background: var(--ink); color: var(--bone); border: 1px solid #3a3a3a; padding: .7rem .8rem; cursor: pointer; font: inherit; border-radius: 2px; }
.play-btn strong { display: block; font-family: var(--display); font-weight: 900; font-size: 1.35rem; text-transform: uppercase; line-height: 1.05; }
.play-btn span { color: var(--steel); font-size: .82rem; }
.play-btn:hover, .play-btn:focus-visible { border-color: var(--red); background: #1d0a0c; }
@media (max-width: 480px) { .play-btn strong { font-size: 1.1rem; } .ovr-num { font-size: 2rem; } }

/* ---------- 3D scroll intro (JRG style) ---------- */
#stage3d { position: fixed; inset: 0; width: 100vw; height: 100vh; z-index: 0; display: block; pointer-events: none; transition: opacity .6s ease; }
#stage3d.hidden { opacity: 0; }
#intro3d { position: relative; z-index: 1; }
main > section, main > .ticker { position: relative; z-index: 2; }
.hero { background: var(--black); }
.ch { position: relative; min-height: 100vh; display: flex; align-items: center; padding: 6rem clamp(1.25rem, 6vw, 5rem) 5rem; pointer-events: none; }
.ch .copy { max-width: 34rem; pointer-events: auto; }
.ch.right { justify-content: flex-end; }
.ch.center { justify-content: center; text-align: center; }
.ch.center .copy { max-width: 46rem; }
.ch.lead { align-items: flex-end; padding-bottom: 12vh; }
.ch.lead .copy { max-width: none; }
.ch h1 { font-family: var(--display); font-weight: 900; text-transform: uppercase; font-size: clamp(4rem, 11vw, 9.5rem); line-height: .85; margin: 0 0 1.5rem; text-shadow: .045em .045em 0 var(--red); }
.ch h1 .ln { display: block; overflow: hidden; padding: 0 .12em .08em 0; }
.ch h1 .ln > span { display: inline-block; transform: translateY(110%); transition: transform 1.1s cubic-bezier(.2,.75,.1,1); }
body.ready .ch h1 .ln > span { transform: none; }
body.ready .ch h1 .ln:nth-child(2) > span { transition-delay: .12s; }
body.ready .ch h1 .ln:nth-child(3) > span { transition-delay: .24s; }
.ch h2 { font-size: clamp(2.8rem, 7vw, 5.6rem); text-shadow: .04em .04em 0 var(--red); }
.ch p { color: #dcd8d2; font-size: clamp(1.05rem, 1.4vw, 1.25rem); margin: 0; max-width: 30rem; }
.ch.center p { margin: 0 auto; }
.ch .lede { margin: 0 0 1.8rem; max-width: 34rem; }
.scrollcue { position: absolute; right: clamp(1.25rem, 6vw, 5rem); bottom: 12vh; color: var(--steel); font-size: .85rem; letter-spacing: .2em; text-transform: uppercase; writing-mode: vertical-rl; }
@media (prefers-reduced-motion: reduce) { .ch h1 .ln > span { transform: none; transition: none; } }
@media (max-width: 760px) {
  .ch { align-items: flex-end; padding-bottom: 10vh; }
  .ch.right { justify-content: flex-start; }
  .ch .copy { background: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.82) 30%); padding-top: 1.75rem; }
  .scrollcue { display: none; }
}

/* ---------- JRG sponsor ---------- */
.sponsor { background: var(--black); border-top: 1px solid var(--line); padding: 5rem clamp(1.25rem, 6vw, 5rem); }
.sponsor-inner { max-width: 76rem; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.sponsor p { color: #dcd8d2; max-width: 36rem; margin: 0 0 1.75rem; }
.sponsor-card { display: flex; flex-direction: column; gap: .35rem; text-decoration: none; background: #0a0a0a; border: 1px solid var(--line); padding: clamp(2rem, 4vw, 3rem); box-shadow: 14px 14px 0 var(--red); transition: transform .2s ease; }
.sponsor-card:hover { transform: translate(-3px, -3px); }
.jrg-mark { font-family: "Playfair Display", Georgia, serif; font-weight: 700; font-size: clamp(3.5rem, 8vw, 5.5rem); line-height: 1; color: #4FB061; }
.jrg-sub { font-size: .8rem; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: #fff; }
.jrg-line { color: var(--steel); margin-top: .8rem; }
.sponsor-card .go { color: var(--red); font-weight: 600; margin-top: 1.25rem; }
@media (max-width: 860px) { .sponsor-inner { grid-template-columns: 1fr; } }
/* Pause buttons wrap on small screens */
.game-bar { flex-wrap: wrap; gap: .5rem 1rem; }
.game-btns { flex-wrap: wrap; }
#zCanvas { display: block; width: 100%; }

/* Alien Invasion game */
.awrap { border-color: #39ff88; box-shadow: 14px 14px 0 #7a3cff; background: #0b0626; }
.a-eyebrow { color: #39ff88; }
.a-card { border-color: #39ff88; }
.a-card .qb-card-num { color: #39ff88; }
#aCanvas { display: block; width: 100%; touch-action: none; }
#aCanvas:focus-visible { outline: 3px solid #39ff88; outline-offset: -3px; }
@media (max-width: 560px) { .awrap { box-shadow: 8px 8px 0 #7a3cff; } }

/* Football game how-to line */
.howto { color: #dcd8d2; font-size: .9rem; margin: 0 0 .7rem; }
.howto strong { color: #39ff88; }

/* How to play boxes */
.howplay { background: var(--ink); border: 1px solid var(--line); border-left: 4px solid var(--red); padding: .2rem 1.1rem; margin: 0 0 1.25rem; max-width: 46rem; }
.howplay summary { cursor: pointer; font-family: var(--display); font-weight: 900; font-size: 1.35rem; text-transform: uppercase; padding: .55rem 0; }
.howplay summary::marker { color: var(--red); }
.howplay[open] { padding-bottom: .9rem; }
.howplay p, .howplay li { color: #dcd8d2; font-size: .98rem; }
.howplay ol, .howplay ul { padding-left: 1.3rem; margin: .4rem 0 .8rem; }
.howplay li { margin: .4rem 0; }
.howplay strong { color: var(--bone); }
.z-howplay { border-left-color: #ff7a1a; }
.z-howplay summary::marker { color: #ff7a1a; }
.a-howplay { border-left-color: #39ff88; }
.a-howplay summary::marker { color: #39ff88; }

/* Games dropdown in the top menu */
.nav-drop { position: relative; }
.nav-drop > a { text-decoration: none; font-weight: 600; color: var(--steel); }
.nav-drop > a:hover { color: var(--bone); }
.nav-drop .drop { display: none; position: absolute; top: 100%; left: -1rem; padding-top: .6rem; min-width: 12rem; z-index: 20; }
.nav-drop .drop a { display: block; background: #000; border: 1px solid var(--line); border-top: 0; padding: .6rem 1rem; color: var(--bone); }
.nav-drop .drop a:first-child { border-top: 1px solid var(--line); border-top: 3px solid var(--red); }
.nav-drop .drop a:hover { background: #1d0a0c; color: #fff; }
.nav-drop:hover .drop, .nav-drop:focus-within .drop { display: block; }
@media (max-width: 560px) { .nav-drop { display: none; } }

/* Game picker above the games */
.game-jump { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: 0 0 2rem; }
.game-jump span { color: var(--steel); font-weight: 600; margin-right: .25rem; }
.game-jump a { text-decoration: none; font-weight: 600; border: 1px solid #3a3a3a; padding: .4rem .9rem; border-radius: 999px; }
.game-jump a:nth-of-type(1):hover { border-color: var(--red); }
.game-jump a:nth-of-type(2):hover { border-color: #ff7a1a; }
.game-jump a:nth-of-type(3):hover { border-color: #39ff88; }

.gstats { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin: .5rem 0 1rem; }
.gs-btn { font: inherit; font-weight: 700; font-size: .95rem; border: 2px solid var(--red, #D0101E); background: transparent; color: inherit; border-radius: 999px; padding: .45rem .95rem; min-height: 44px; cursor: pointer; transition: transform .1s ease, background .2s ease; }
.gs-btn:active { transform: scale(.96); }
.gs-btn[aria-pressed="true"] { background: var(--red, #D0101E); color: #fff; cursor: default; }
.gs-btn b, .gs-plays b { margin-left: .2rem; }
.gs-plays { font-weight: 700; font-size: .95rem; opacity: .85; padding: .45rem .5rem; }
/* ---------- Support Miro’s games ---------- */
.support { background: var(--ink); border-top: 1px solid var(--line); padding: 5rem clamp(1.25rem, 6vw, 5rem); }
.support-inner { max-width: 76rem; margin: 0 auto; display: grid; grid-template-columns: 1.2fr 1fr; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.support p { color: #dcd8d2; max-width: 36rem; margin: 0 0 1.75rem; }
.support .support-note { font-size: .92rem; color: var(--steel); margin: 1.25rem 0 0; }
.support-card { display: flex; flex-direction: column; gap: .35rem; text-decoration: none; background: var(--black); border: 1px solid var(--line); border-top: 4px solid var(--red); padding: clamp(2rem, 4vw, 3rem); box-shadow: 14px 14px 0 var(--red); transition: transform .2s ease; }
.support-card:hover { transform: translate(-3px, -3px); }
.support-big { font-family: var(--display); font-weight: 900; font-size: clamp(4rem, 9vw, 6rem); line-height: 1; color: var(--red); }
.support-sub { font-size: .8rem; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: #fff; }
.support-handle { color: var(--steel); margin-top: .8rem; }
.support-card .go { color: var(--red); font-weight: 600; margin-top: 1.25rem; }
@media (max-width: 860px) { .support-inner { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .support-card { box-shadow: 8px 8px 0 var(--red); } }

/* Support amount buttons */
.support .amt-label { font-weight: 600; color: var(--bone); margin: 0 0 .7rem; }
.amounts { display: flex; flex-wrap: wrap; gap: .6rem; margin: 0 0 1.75rem; }
.amt { position: relative; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; min-width: 5.2rem; padding: .7rem 1rem; text-decoration: none; font-family: var(--display); font-weight: 900; font-size: 1.5rem; line-height: 1; color: var(--bone); background: var(--black); border: 2px solid var(--line); border-radius: 2px; transition: border-color .15s ease, background .15s ease, transform .15s ease; }
.amt:hover { border-color: var(--red); transform: translateY(-2px); }
.amt-pick { border-color: var(--red); background: var(--red); color: #fff; }
.amt-pick:hover { background: var(--red-dark); border-color: var(--red-dark); }
.amt-tag { font-family: var(--body); font-weight: 600; font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; margin-top: .3rem; }
@media (max-width: 560px) { .amt { min-width: calc(33.33% - .4rem); font-size: 1.3rem; } }

.support .support-link { margin: 1.25rem 0 0; font-weight: 600; color: var(--bone); }
.support .support-link a { color: var(--red); word-break: break-all; }
.support .support-link + .support-note { margin-top: .5rem; }

/* Support bar under each game */
.game-support { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .8rem 1.5rem; margin: 1.5rem auto 0; max-width: 76rem; background: var(--ink); border: 1px solid var(--line); border-left: 4px solid var(--red); padding: 1rem 1.25rem; }
.game-support p { margin: 0; color: #dcd8d2; }
.game-support strong { color: var(--bone); }
.game-support-btns { display: flex; flex-wrap: wrap; gap: .6rem; }

/* Miro's Store */
.store { background: var(--black); border-top: 1px solid var(--line); padding: 5rem clamp(1.25rem, 6vw, 5rem); }
.store-inner { max-width: 76rem; margin: 0 auto; }
.store-lede { color: #dcd8d2; max-width: 36rem; margin: 0 0 2rem; }
.store-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.store-card { background: var(--ink); border: 1px solid var(--line); border-top: 4px solid var(--red); padding: 1.5rem; display: flex; flex-direction: column; gap: .5rem; }
.store-card h3 { font-family: var(--display); font-weight: 900; text-transform: uppercase; font-size: 1.6rem; line-height: 1; margin: .3rem 0 0; }
.store-card p { color: #dcd8d2; margin: 0 0 .5rem; font-size: .98rem; }
.store-tag { align-self: flex-start; background: var(--red); color: #fff; font-size: .72rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; padding: .25rem .55rem; }
.store-more { border-top-color: var(--steel); }
.store-more .btn { align-self: flex-start; margin-top: auto; }
@media (max-width: 960px) { .store-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .store-grid { grid-template-columns: 1fr; } }

/* Miro's Journey promo */
.journey { background: var(--red); padding: 3rem clamp(1.25rem, 6vw, 5rem); }
.journey-inner { max-width: 76rem; margin: 0 auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem; }
.journey .eyebrow { color: #fff; opacity: .85; }
.journey h2 { color: #fff; margin-bottom: .6rem; }
.journey p { color: #fff; max-width: 40rem; margin: 0; }
.journey .btn-red { background: #000; border-color: #000; color: #fff; }

/* Like button */
.like-wrap { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem; margin-top: 1rem; }
.like-btn { display: inline-flex; align-items: center; gap: .5rem; font: inherit; font-weight: 600; color: var(--bone); background: rgba(0,0,0,.45); border: 2px solid var(--red); border-radius: 999px; padding: .5rem 1.1rem; cursor: pointer; }
.like-btn .heart { color: var(--red); font-size: 1.2rem; line-height: 1; display: inline-block; }
.like-btn:hover { background: #1d0a0c; }
.like-btn.liked { background: var(--red); color: #fff; cursor: default; }
.like-btn.liked .heart { color: #fff; }
@media (prefers-reduced-motion: no-preference) { .like-btn.pop .heart { animation: likepop .45s ease; } }
@keyframes likepop { 50% { transform: scale(1.6); } }
.like-count { color: #dcd8d2; font-weight: 600; text-shadow: 0 1px 4px rgba(0,0,0,.8); }

/* Senior yearbook */
.yearbook { padding: 5rem clamp(1.25rem, 6vw, 5rem); border-top: 1px solid var(--line); }
.yearbook-inner { max-width: 76rem; margin: 0 auto; }
.yb-sub { color: #dcd8d2; max-width: 40rem; margin: 0 0 2rem; }
.yb-grid { display: grid; grid-template-columns: minmax(0, 22rem) 1fr; gap: 2rem; align-items: start; }
.yb-form { background: var(--ink); border: 1px solid var(--line); border-top: 4px solid var(--red); padding: 1.25rem; position: relative; }
.yb-form label { margin-top: .9rem; }
.yb-form label:first-child { margin-top: 0; }
.yb-form button { margin-top: 1.1rem; width: 100%; }
.yb-msg { margin: .8rem 0 0; font-weight: 600; }
.yb-msg.ok { color: #7fe3a2; }
.yb-msg.err { color: #ff7a82; }
.yb-list { columns: 2 16rem; column-gap: 1rem; }
.yb-card { break-inside: avoid; margin: 0 0 1rem; background: var(--bone); color: #1a1a1a; padding: 1.1rem 1.2rem; transform: rotate(-.6deg); box-shadow: 4px 4px 0 var(--red); }
.yb-card:nth-child(2n) { transform: rotate(.7deg); }
.yb-card blockquote { margin: 0 0 .6rem; font-family: "Caveat", "Segoe Print", "Bradley Hand", cursive; font-size: 1.45rem; line-height: 1.25; overflow-wrap: anywhere; }
.yb-card figcaption { font-weight: 600; font-size: .9rem; color: #444; }
.yb-empty { color: var(--steel); font-style: italic; margin: 0; }
@media (max-width: 760px) { .yb-grid { grid-template-columns: 1fr; } }

/* Miro's yearbook (flip book) */
.yb-book { background: #1a0d0f; padding: 1rem; border-radius: 6px; box-shadow: 10px 10px 0 var(--red); }
.yb-pages { perspective: 1400px; }
.yb-sheet { position: relative; min-height: 26rem; background-color: var(--bone); color: #1a1a1a; border-radius: 2px 10px 10px 2px; padding: 1.4rem 1.4rem 2.4rem; box-shadow: inset 16px 0 18px -14px rgba(0,0,0,.45); display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; align-content: start; transform-origin: left center; background-image: repeating-linear-gradient(transparent 0 31px, rgba(0,0,0,.06) 31px 32px); }
.yb-sheet .yb-card, .yb-sheet .yb-card:nth-child(2n) { transform: none; box-shadow: none; background: rgba(255,255,255,.65); border: 1px dashed rgba(0,0,0,.2); margin: 0; }
.yb-sheet.yb-cover { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; background: linear-gradient(160deg, #111 0%, #2a0508 60%, #D0101E 140%); color: #fff; gap: .4rem; border: 3px solid #b8932f; }
.yb-cover-small { text-transform: uppercase; letter-spacing: .3em; font-size: .8rem; color: #e8c766; }
.yb-cover-name { font-family: var(--display); font-weight: 900; font-size: clamp(2.6rem, 7vw, 4.4rem); text-transform: uppercase; line-height: .95; }
.yb-cover-sub { color: #ddd; font-weight: 600; }
.yb-cover-count { margin-top: 1rem; font-family: "Caveat", cursive; font-size: 1.6rem; color: #e8c766; }
.yb-pnum { position: absolute; bottom: .6rem; right: 1rem; font-weight: 600; color: #777; font-size: .85rem; }
.yb-blank { grid-column: 1 / -1; font-family: "Caveat", cursive; font-size: 1.6rem; color: #777; text-align: center; margin: 6rem 0 0; }
.yb-nav { display: flex; justify-content: space-between; align-items: center; gap: .5rem; margin-top: 1rem; }
.yb-nav button { font: inherit; font-weight: 600; color: var(--bone); background: transparent; border: 1px solid #3a3a3a; padding: .45rem .9rem; border-radius: 2px; cursor: pointer; }
.yb-nav button:hover:not(:disabled) { border-color: var(--red); }
.yb-nav button:disabled { opacity: .35; cursor: default; }
.yb-nav span { color: #dcd8d2; font-weight: 600; }
@media (prefers-reduced-motion: no-preference) {
  .flip-fwd { animation: ybfwd .45s ease; }
  .flip-back { animation: ybback .45s ease; }
  @keyframes ybfwd { from { transform: rotateY(-70deg); opacity: .3; } to { transform: none; opacity: 1; } }
  @keyframes ybback { from { transform: rotateY(25deg); opacity: .3; } to { transform: none; opacity: 1; } }
}
@media (max-width: 560px) { .yb-sheet { grid-template-columns: 1fr; } }

/* Game like buttons */
.game-like .gl-count { font-weight: 600; }
.game-like.liked { background: var(--red); border-color: var(--red); color: #fff; cursor: default; }
@media (prefers-reduced-motion: no-preference) { .game-like.pop { animation: likepop .45s ease; } }

/* Bet on Me Players Club */
.club { padding: 5rem clamp(1.25rem, 6vw, 5rem); border-top: 1px solid var(--line); }
.club-inner { max-width: 76rem; margin: 0 auto; }
.club-sub { color: #dcd8d2; max-width: 42rem; margin: 0 0 2rem; }
.club-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); gap: 1.25rem; align-items: start; }
.club-card { background: var(--ink); border: 1px solid var(--line); border-top: 4px solid var(--red); padding: 1.25rem; position: relative; }
.club-card h3 { font-family: var(--display); font-weight: 900; text-transform: uppercase; font-size: 1.6rem; line-height: 1; margin: 0 0 1rem; }
.club-card label { margin-top: .8rem; }
.club-card label.check { display: flex; gap: .55rem; align-items: flex-start; font-weight: 400; color: #dcd8d2; font-size: .95rem; }
.club-card label.check input { width: auto; margin-top: .25rem; accent-color: var(--red); }
.club-card form button { margin-top: 1rem; width: 100%; }
.club-tag { color: var(--red); }
.club-note { color: #dcd8d2; margin: 0 0 .8rem; font-size: .95rem; }
.club-best { list-style: none; padding: 0; margin: 0 0 1rem; }
.club-best li { display: flex; flex-direction: column; padding: .55rem 0; border-bottom: 1px solid var(--line); }
.club-best span { color: var(--steel); font-size: .9rem; }
.club-tabs { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: .9rem; }
.club-tabs button { font: inherit; font-weight: 600; font-size: .9rem; color: var(--bone); background: transparent; border: 1px solid #3a3a3a; border-radius: 999px; padding: .3rem .8rem; cursor: pointer; }
.club-tabs button.on { background: var(--red); border-color: var(--red); color: #fff; }
.club-board { list-style: none; padding: 0; margin: 0; }
.club-board li { display: grid; grid-template-columns: 2.2rem 1fr auto; align-items: center; gap: .5rem; padding: .5rem .3rem; border-bottom: 1px solid var(--line); }
.club-board li.me { background: #1d0a0c; }
.club-board .rk { font-family: var(--display); font-weight: 900; font-size: 1.2rem; color: var(--steel); text-align: center; }
.club-board .tg { overflow-wrap: anywhere; }
.club-prizes p { color: #dcd8d2; }
.club-prize-now { background: #000; border-left: 4px solid #e0a526; padding: .6rem .8rem; }
.club-prize-now strong { color: #e0a526; }
.club-fine { font-size: .82rem; color: var(--steel) !important; }
.club-toast { position: fixed; left: 50%; bottom: calc(1rem + env(safe-area-inset-bottom, 0px)); transform: translate(-50%, 150%); background: #000; color: #fff; border: 2px solid var(--red); padding: .7rem 1rem; max-width: min(92vw, 30rem); font-weight: 600; z-index: 50; transition: transform .3s ease; box-shadow: 0 8px 30px rgba(0,0,0,.6); }
.club-toast.show { transform: translate(-50%, 0); }
/* Yearbook: photos and signature-only entries */
.yb-form .opt { font-weight: 400; color: var(--steel); font-size: .9rem; }
.yb-form input[type="file"] { padding: .55rem; }
.yb-form label.yb-check { display: flex; gap: .55rem; align-items: flex-start; font-weight: 400; color: #dcd8d2; font-size: .92rem; }
.yb-form label.yb-check input { width: auto; margin-top: .25rem; accent-color: var(--red); }
.yb-preview { display: flex; align-items: center; gap: .8rem; margin-top: .6rem; }
.yb-preview img { width: 84px; height: 84px; object-fit: cover; border: 2px solid var(--bone); }
.yb-card .yb-photo { display: block; width: 100%; max-height: 260px; object-fit: cover; margin: 0 0 .7rem; border: 4px solid #fff; box-shadow: 0 2px 6px rgba(0,0,0,.25); }
.yb-card .yb-sig { font-family: "Caveat", "Segoe Print", cursive; font-size: 2.3rem; line-height: 1; margin: .2rem 0 .4rem; color: #14204a; }

/* NFL-style quick-link strip (original icons) */
.topstrip{background:#0a0a0a;border-bottom:1px solid #222}
.ts-inner{display:flex;gap:clamp(10px,2.2vw,26px);overflow-x:auto;padding:8px 16px;justify-content:center;scrollbar-width:none}
.ts-inner::-webkit-scrollbar{display:none}
.ts-item{display:flex;flex-direction:column;align-items:center;gap:4px;text-decoration:none;color:#d6d9dc;flex:0 0 auto}
.ts-ico{width:36px;height:36px;border-radius:50%;border:1.5px solid #9aa0a6;display:flex;align-items:center;justify-content:center;background:#141414;transition:border-color .2s,background .2s,transform .2s}
.ts-label{font-size:10px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
.ts-item:hover .ts-ico,.ts-item:focus-visible .ts-ico{border-color:var(--red);background:#1d0a0c;transform:translateY(-2px)}
.ts-item:hover{color:#fff}
@media (max-width:760px){.ts-inner{justify-content:flex-start}.ts-label{display:none}}
.fav-line{margin-top:1.2rem;color:#dcd8d2}
.fav-line b{color:var(--bone)}
.fav-line span{color:var(--red);margin:0 .4rem}

/* Top strip: icons only, tidy row */
.topstrip .ts-label{display:none}
.topstrip .ts-inner{gap:clamp(8px,1.6vw,18px);padding:7px 16px}
.topstrip .ts-ico{width:32px;height:32px}
/* Bottom banner: icons with titles */
.bottomstrip{background:#0a0a0a;border-top:1px solid #222;padding:28px 0 22px}
.bottomstrip .bs-title{text-align:center;margin:0 0 16px;color:#9aa0a6;font-weight:700;letter-spacing:.24em;text-transform:uppercase;font-size:12px}
.bottomstrip .ts-inner{flex-wrap:wrap;justify-content:center;gap:18px 26px;overflow:visible;padding:0 16px}
.bottomstrip .ts-item{width:84px}
.bottomstrip .ts-ico{width:46px;height:46px}
.bottomstrip .ts-ico svg{width:22px;height:22px}
.bottomstrip .ts-label{display:block;text-align:center;white-space:normal;line-height:1.25;font-size:11px}

/* ESPN-style bottom section, Miro's theme */
.espn{background:#0b0b0b;border-top:4px solid var(--red);padding:48px 0 32px}
.espn-wrap{max-width:76rem;margin:0 auto;padding:0 clamp(1.25rem,4vw,2.5rem)}
.espn-wrap:first-child{display:grid;grid-template-columns:1fr 320px;gap:28px;align-items:start}
.espn-h{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:1.9rem;margin:0 0 14px;border-left:5px solid var(--red);padding-left:12px;line-height:1}
.espn-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.espn-card{display:flex;flex-direction:column;background:#151515;border:1px solid #242424;text-decoration:none;color:var(--bone);overflow:hidden;transition:border-color .2s,transform .2s}
.espn-card:hover{border-color:var(--red);transform:translateY(-2px)}
.espn-card img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}
.espn-card .tag{color:var(--red);font-weight:700;font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;margin:12px 14px 2px}
.espn-card b{font-family:var(--display);font-weight:900;font-size:1.35rem;text-transform:uppercase;line-height:1.05;margin:0 14px 4px}
.espn-card .sub{color:#b9b9b9;font-size:.92rem;margin:0 14px 14px}
.espn-promo{background:linear-gradient(160deg,#1d0a0c,#0b0b0b 70%);border:1px solid #3a1215;padding:22px;position:sticky;top:90px}
.espn-promo .promo-k{color:var(--red);font-weight:700;letter-spacing:.2em;text-transform:uppercase;font-size:.78rem;margin:0 0 6px}
.espn-promo h3{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:2rem;line-height:1;margin:0 0 10px}
.espn-promo p{color:#cfcfcf;margin:0 0 16px}
.promo-btn{display:block;text-align:center;background:var(--red);color:#fff;text-decoration:none;font-weight:700;padding:.7rem 1rem;margin-bottom:8px}
.promo-btn:hover{background:var(--red-dark)}
.promo-btn.ghost{background:transparent;border:1px solid #444;color:var(--bone)}
.promo-btn.ghost:hover{border-color:var(--red)}
.espn-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:40px;padding-top:28px;border-top:1px solid #222}
.espn-cols h4{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:1.1rem;margin:0 0 10px;color:#fff}
.espn-cols a{display:block;color:#b9b9b9;text-decoration:none;padding:4px 0;font-size:.95rem}
.espn-cols a:hover{color:#fff;text-decoration:underline}
@media (max-width:900px){.espn-wrap:first-child{grid-template-columns:1fr}.espn-promo{position:static}.espn-cols{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.espn-cards{grid-template-columns:1fr}}

/* Five link columns */
.espn-cols{grid-template-columns:repeat(5,1fr)}
.espn-cols .ext-note{display:block;color:#777;font-size:.75rem;margin-top:6px}
@media (max-width:900px){.espn-cols{grid-template-columns:repeat(2,1fr)}}

/* Season stats box */
.stats-wrap{max-width:76rem;margin:0 auto;width:100%;padding:1.6rem clamp(1.25rem,4vw,2.5rem) .4rem;border-bottom:1px solid var(--line)}
.stats-head{margin:0 0 .4rem;color:var(--steel);font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:.85rem}
.stats-head span{color:#fff;background:var(--red);padding:.15rem .5rem;margin-right:.5rem}
.stats-wrap .stats{border-bottom:0}
.stats-src{margin:.2rem 0 1rem;color:#8b8b8b;font-size:.82rem;text-align:right}
.stats-src a{color:#cfcfcf}
/* Camp honors in the story */
.honors{list-style:none;padding:0;margin:1.4rem 0 0;display:grid;gap:.6rem}
.honors li{display:flex;gap:.8rem;align-items:baseline;border-left:4px solid var(--red);background:#121212;padding:.6rem .9rem}
.honors b{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:1.15rem;color:#fff;min-width:7.5rem}
.honors span{color:#dcd8d2}

/* =================== BET ON ME ARCADE =================== */
.arcade{position:relative;padding:4rem 0 3rem;
  background-color:#0a0614;
  background-image:
    radial-gradient(circle at 20px 20px, rgba(255,60,120,.18) 3px, transparent 4px),
    radial-gradient(circle at 60px 50px, rgba(60,220,255,.16) 3px, transparent 4px),
    radial-gradient(circle at 40px 80px, rgba(255,210,60,.14) 2px, transparent 3px),
    linear-gradient(180deg,#0a0614,#120822 50%,#0a0614);
  background-size:80px 100px,80px 100px,80px 100px,100% 100%;
  border-top:4px solid var(--red);border-bottom:4px solid var(--red)}
.arcade::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 0%,rgba(208,16,30,.25),transparent 60%)}
.arcade-sign{position:relative;text-align:center;padding:0 1rem 2.2rem}
.arcade-sign .neon-top{margin:0;color:#7ef3ff;font-weight:700;letter-spacing:.35em;text-transform:uppercase;font-size:.9rem;text-shadow:0 0 8px #22d3ff}
.arcade-sign .neon{margin:.2rem 0 .4rem;font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:clamp(3rem,9vw,6.5rem);line-height:.9;color:#fff;
  text-shadow:0 0 6px #fff,0 0 18px #ff2d55,0 0 38px #ff2d55,0 0 70px #ff2d55}
.arcade-sign .neon span{color:#fff;text-shadow:0 0 6px #fff,0 0 18px #22d3ff,0 0 38px #22d3ff,0 0 70px #22d3ff}
.arcade-sign .blink{margin:0;color:#ffd84d;font-family:"Courier New",monospace;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
@media (prefers-reduced-motion:no-preference){
  .arcade-sign .blink{animation:blink 1.2s steps(2,start) infinite}
  .arcade-sign .neon{animation:flicker 6s infinite}
}
@keyframes blink{to{visibility:hidden}}
@keyframes flicker{0%,19%,21%,62%,64%,100%{opacity:1}20%,63%{opacity:.55}}
/* Each game becomes a cabinet */
.arcade .game{padding:1.5rem clamp(.75rem,4vw,3rem) 2.5rem}
.arcade .game-inner{--cab:#ff2d55;position:relative;max-width:62rem;margin:0 auto;padding:1.4rem clamp(1rem,3vw,2rem) 6.5rem;
  background:linear-gradient(90deg,#08080c 0%,#1a1a22 6%,#121218 50%,#1a1a22 94%,#08080c 100%);
  border:2px solid var(--cab);border-radius:26px 26px 10px 10px;
  box-shadow:0 0 0 6px #050507,0 0 26px var(--cab),inset 0 0 40px rgba(0,0,0,.8)}
.arcade .zgame .game-inner{--cab:#ff7a1a}
.arcade .agame .game-inner{--cab:#39ff88}
.arcade .club .club-inner{--cab:#ffd84d}
/* Marquee */
.arcade .game-inner > h2{margin:0 0 .6rem;padding:.7rem 1rem;text-align:center;border-radius:14px;
  background:linear-gradient(180deg,#1b1b24,#0b0b10);border:2px solid var(--cab);
  text-shadow:0 0 8px #fff,0 0 22px var(--cab);box-shadow:inset 0 0 22px rgba(255,255,255,.06),0 0 18px var(--cab)}
.arcade .game-inner > .eyebrow{text-align:center;margin-bottom:.5rem}
.arcade .game-sub{margin-left:auto;margin-right:auto;text-align:center}
/* Screen bezel + scanlines */
.arcade .game-wrap{border:14px solid #050507;border-radius:18px;box-shadow:0 0 0 3px #2a2a33,0 0 30px rgba(0,0,0,.9),inset 0 0 0 2px #000}
.arcade .game-wrap::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:4px;
  background:repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 3px),radial-gradient(ellipse at center,transparent 60%,rgba(0,0,0,.35) 100%)}
/* Control panel with joystick and buttons */
.arcade .game-inner::after{content:"INSERT COIN";position:absolute;left:50%;bottom:1.1rem;transform:translateX(-50%);
  width:min(92%,30rem);height:4.2rem;border-radius:14px;
  background:
    radial-gradient(circle at 14% 50%,#111 0 9px,var(--cab) 10px 15px,transparent 16px),
    radial-gradient(circle at 14% 50%,rgba(0,0,0,.6) 0 22px,transparent 23px),
    radial-gradient(circle at 66% 50%,#ff2d55 0 13px,transparent 14px),
    radial-gradient(circle at 78% 50%,#22d3ff 0 13px,transparent 14px),
    radial-gradient(circle at 90% 50%,#ffd84d 0 13px,transparent 14px),
    linear-gradient(180deg,#2a2a35,#141419);
  border:2px solid #000;box-shadow:inset 0 2px 0 rgba(255,255,255,.08),0 6px 0 #000;
  color:#ffd84d;font-family:"Courier New",monospace;font-weight:700;font-size:.72rem;letter-spacing:.2em;
  display:flex;align-items:flex-end;justify-content:center;padding-bottom:.35rem;padding-right:30%}
/* Players Club = prize counter */
.arcade .club{background:transparent;border-top:0;padding-top:1.5rem}
.arcade .club .club-inner{position:relative;padding:1.6rem clamp(1rem,3vw,2rem);border:2px solid var(--cab);border-radius:18px;background:rgba(10,6,20,.85);box-shadow:0 0 24px var(--cab)}
.arcade .club .club-inner > h2{text-shadow:0 0 8px #fff,0 0 22px var(--cab)}
.arcade .game-jump{justify-content:center}
@media (max-width:620px){.arcade .game-inner{padding-bottom:5.5rem;border-radius:18px 18px 8px 8px}.arcade .game-wrap{border-width:8px}}

/* Token machine (All-Access Pass) */
.tokens{padding:1rem clamp(.75rem,4vw,3rem) 2rem}
.token-machine{max-width:26rem;margin:0 auto;padding:1.4rem 1.4rem 1.6rem;border-radius:22px 22px 12px 12px;text-align:center;
  background:linear-gradient(180deg,#1e1a08,#0c0b05);border:3px solid #ffd84d;box-shadow:0 0 0 6px #050507,0 0 30px rgba(255,216,77,.55)}
.tm-top{display:flex;align-items:center;justify-content:center;gap:.7rem;margin-bottom:.4rem}
.tm-top h2{margin:0;font-size:1.8rem;color:#ffd84d;text-shadow:0 0 12px rgba(255,216,77,.8)}
.coin{display:inline-flex;align-items:center;justify-content:center;width:2.6rem;height:2.6rem;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff3b0,#ffd84d 45%,#b88a00);color:#5a3f00;font-family:var(--display);font-weight:900;box-shadow:0 0 14px rgba(255,216,77,.8)}
@media (prefers-reduced-motion:no-preference){.coin{animation:spin 3s linear infinite}}
@keyframes spin{0%{transform:rotateY(0)}100%{transform:rotateY(360deg)}}
.tm-title{margin:.6rem 0 0;font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:1.6rem;color:#fff}
.tm-price{margin:.1rem 0 .8rem;font-family:"Courier New",monospace;font-weight:700;font-size:2.4rem;color:#ffd84d}
.tm-perks{list-style:none;padding:0;margin:0 0 1rem;text-align:left;color:#e8e3cf;font-size:.95rem}
.tm-perks li{padding:.35rem 0 .35rem 1.4rem;position:relative;border-bottom:1px dashed rgba(255,216,77,.25)}
.tm-perks li::before{content:"★";position:absolute;left:0;color:#ffd84d}
.tm-buy{display:block;padding:.85rem 1rem;border-radius:12px;background:#ffd84d;color:#1a1300;font-weight:900;text-decoration:none;font-size:1.05rem;letter-spacing:.04em;text-transform:uppercase;box-shadow:0 5px 0 #a07800}
.tm-buy[aria-disabled="true"]{background:#5a5233;color:#d9d2b0;box-shadow:0 5px 0 #2e2a1a;cursor:default}
.tm-buy:not([aria-disabled="true"]):hover{transform:translateY(2px);box-shadow:0 3px 0 #a07800}
.tm-note{margin:.8rem 0 0;color:#b9b09a;font-size:.82rem}
.tm-code{margin-top:1rem;text-align:left}
.tm-code label{display:block;color:#e8e3cf;font-weight:700;font-size:.9rem;margin-bottom:.4rem}
.tm-row{display:flex;gap:.5rem}
.tm-row input{flex:1;min-width:0;font:inherit;padding:.6rem .8rem;border-radius:10px;border:1px solid #6b5f2a;background:#0b0a05;color:#fff;text-transform:uppercase}
.tm-row button{font:inherit;font-weight:700;padding:.6rem 1rem;border-radius:10px;border:0;background:#22d3ff;color:#001a20;cursor:pointer}
.tm-msg{margin:.5rem 0 0;font-weight:700;font-size:.9rem}
.tm-msg.ok{color:#7fe3a2}.tm-msg.err{color:#ff8a80}
.tm-active{margin:1rem 0 0;color:#7fe3a2;font-weight:700}
.tm-req{border-top:1px dashed rgba(255,216,77,.3);padding-top:.9rem}

.tm-steps{text-align:left;color:#e8e3cf;font-size:.9rem;margin:.9rem 0 0;padding-left:1.2rem}
.tm-steps li{margin:.3rem 0}
.tm-steps b{color:#ffd84d}
.tm-soon{margin:.6rem 0 0;color:#22d3ff;font-weight:700;font-size:.85rem;letter-spacing:.06em;text-transform:uppercase}

/* Pass tiers */
.token-machine.wide{max-width:46rem}
.tm-sub{margin:.4rem 0 .9rem;color:#e8e3cf;font-weight:700;letter-spacing:.2em;text-transform:uppercase;font-size:.85rem}
.tiers{display:grid;grid-template-columns:repeat(4,1fr);gap:.7rem;margin-bottom:1rem}
.tier{position:relative;display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:1.1rem .6rem .9rem;border-radius:14px;border:2px solid #4a4220;background:#14120a;color:#e8e3cf;cursor:pointer;font:inherit;text-align:center;transition:border-color .2s,transform .2s,box-shadow .2s}
.tier:hover{transform:translateY(-2px)}
.tier.on{border-color:#ffd84d;box-shadow:0 0 18px rgba(255,216,77,.55);background:#221d08}
.tier b{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:1.25rem;color:#fff}
.tier em{font-style:normal;font-family:"Courier New",monospace;font-weight:700;font-size:1.5rem;color:#ffd84d}
.tier span{font-size:.82rem;color:#cfc7a8;line-height:1.3}
.tier .pop{position:absolute;top:-.7rem;left:50%;transform:translateX(-50%);white-space:nowrap;font-style:normal;font-size:.68rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:.15rem .5rem;border-radius:999px;background:#ff2d55;color:#fff}
.tier .pop.best{background:#22d3ff;color:#001a20}
.tm-perkbox{text-align:left;background:#0b0a05;border:1px dashed rgba(255,216,77,.35);border-radius:12px;padding:.7rem .9rem;margin-bottom:1rem;color:#e8e3cf;font-size:.88rem}
.tm-perkbox p{margin:.25rem 0}
.tm-perkbox b{color:#ffd84d}
.tm-rookie{text-align:left;margin-bottom:1rem}
.tm-rookie label{display:block;color:#e8e3cf;font-weight:700;font-size:.9rem;margin-bottom:.4rem}
.tm-rookie select{width:100%;font:inherit;padding:.6rem .8rem;border-radius:10px;border:1px solid #6b5f2a;background:#0b0a05;color:#fff}
@media (max-width:640px){.tiers{grid-template-columns:repeat(2,1fr);row-gap:1.1rem}}
/* Six tiers, Fan Club VIP */
.tiers{grid-template-columns:repeat(3,1fr);row-gap:1.1rem}
.tier em small{font-size:.8rem;color:#cfc7a8;margin-left:2px}
.tier.vip{border-color:#b98cff;background:linear-gradient(160deg,#1c0f2e,#14120a)}
.tier.vip.on{border-color:#d4b5ff;box-shadow:0 0 22px rgba(185,140,255,.7)}
.tier .pop.vip{background:linear-gradient(90deg,#b98cff,#ff4f8b);color:#fff}
.tm-perkbox ul{margin:.3rem 0 .4rem;padding-left:1.1rem}
.tm-perkbox li{margin:.2rem 0}
.tm-small{font-size:.8rem;color:#b9b09a}
.tm-pay{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
.tm-buy.alt{background:transparent;color:#ffd84d;border:2px solid #ffd84d;box-shadow:none}
.tm-row select{flex:1;min-width:0;font:inherit;padding:.6rem .8rem;border-radius:10px;border:1px solid #6b5f2a;background:#0b0a05;color:#fff}
@media (max-width:640px){.tiers{grid-template-columns:repeat(2,1fr)}.tm-pay{grid-template-columns:1fr}}
/* Full-amount Venmo reminder */
.tm-full{margin:.5rem 0 .8rem;padding:.6rem .8rem;border-radius:10px;background:#2a1406;border:1px solid #ff9b3d;color:#ffd9b0;font-size:.9rem;text-align:left}
.tm-full b{color:#fff}
/* Arcade announcement bar */
.arcade-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.35rem .7rem;padding:.55rem 1rem;text-decoration:none;color:#fff;text-align:center;
  background:linear-gradient(90deg,#3a0d1a,#120822 45%,#0b2a35);border-bottom:1px solid #ff2d55;font-size:.95rem}
.arcade-bar b{font-family:var(--display);font-weight:900;text-transform:uppercase;letter-spacing:.03em;text-shadow:0 0 10px #ff2d55}
.arcade-bar .ab-new{background:#ffd84d;color:#1a1300;font-weight:900;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;padding:.15rem .45rem;border-radius:4px}
.arcade-bar .ab-sub{color:#cfd3ff}
.arcade-bar .ab-go{color:#7ef3ff;font-weight:700;text-shadow:0 0 8px #22d3ff}
.arcade-bar:hover .ab-go{text-decoration:underline}
@media (max-width:640px){.arcade-bar .ab-sub{display:none}}
/* Hero arcade button */
.btn-arcade{background:#120822;color:#fff;border:2px solid #22d3ff;box-shadow:0 0 14px rgba(34,211,255,.6)}
.btn-arcade:hover{background:#1b0d33;box-shadow:0 0 22px rgba(34,211,255,.9)}

/* Road to the City */
.arcade .rgame .game-inner{--cab:#b98cff}
.r-eyebrow{color:#b98cff}
#rCanvas{display:block;width:100%;touch-action:none}
#rCanvas:focus-visible{outline:3px solid #b98cff;outline-offset:-3px}
.r-card{border-color:#b98cff}
.r-card .qb-card-num{color:#b98cff}
.r-howplay{border-left-color:#b98cff}
.r-howplay summary::marker{color:#b98cff}
.copilots{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;justify-content:center;margin:0 0 .8rem}
.copilots span{color:var(--steel);font-weight:600}
.copilots button{font:inherit;font-weight:600;font-size:.9rem;color:var(--bone);background:#120822;border:1px solid #3a2a55;border-radius:999px;padding:.35rem .85rem;cursor:pointer}
.copilots button.on{background:#b98cff;border-color:#b98cff;color:#120822}
/* =================== Neon fair / boardwalk arcade =================== */
.arcade{background-color:#07051a;
  background-image:
    radial-gradient(ellipse at 50% 0%, rgba(255,79,216,.18), transparent 55%),
    radial-gradient(ellipse at 12% 60%, rgba(34,211,255,.12), transparent 50%),
    radial-gradient(ellipse at 88% 72%, rgba(185,140,255,.14), transparent 50%),
    linear-gradient(rgba(34,211,255,.09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,79,216,.09) 1px, transparent 1px),
    linear-gradient(180deg,#07051a,#120a2e 55%,#07051a);
  background-size:100% 100%,100% 100%,100% 100%,48px 48px,48px 48px,100% 100%;
  border-top:0;border-bottom:0}
/* Carnival string lights along the top and bottom */
.arcade::before,.arcade::after{content:"";position:absolute;left:0;right:0;height:18px;pointer-events:none;z-index:3;
  background:
    radial-gradient(circle,#fff 0 1.5px,#ff2d55 2px,transparent 5px) 0 50%/96px 18px repeat-x,
    radial-gradient(circle,#fff 0 1.5px,#ffd84d 2px,transparent 5px) 24px 50%/96px 18px repeat-x,
    radial-gradient(circle,#fff 0 1.5px,#39ff88 2px,transparent 5px) 48px 50%/96px 18px repeat-x,
    radial-gradient(circle,#fff 0 1.5px,#22d3ff 2px,transparent 5px) 72px 50%/96px 18px repeat-x,
    linear-gradient(180deg,transparent 3px,rgba(255,255,255,.18) 3px 4px,transparent 4px);
  filter:drop-shadow(0 0 5px rgba(255,255,255,.7))}
.arcade::before{top:0;bottom:auto;inset:0 0 auto 0}
.arcade::after{bottom:0;top:auto}
@media (prefers-reduced-motion:no-preference){
  .arcade::before{animation:twinkle 1.6s ease-in-out infinite}
  .arcade::after{animation:twinkle 1.6s ease-in-out .8s infinite}
}
@keyframes twinkle{0%,100%{opacity:1}50%{opacity:.55}}
/* Fair sign with chasing rainbow bulbs */
.fair-sign{position:relative;max-width:46rem;margin:0 auto 2rem;padding:1.9rem 1.2rem 1.7rem;border-radius:26px;background:rgba(8,5,26,.8);border:3px solid #ff4fd8;box-shadow:0 0 24px rgba(255,79,216,.6),0 0 60px rgba(34,211,255,.25),inset 0 0 30px rgba(255,79,216,.15)}
.fair-sign::before,.fair-sign::after{content:"";position:absolute;left:12px;right:12px;height:10px;
  background-image:radial-gradient(circle,#fff 0 2px,#ff2d55 2.5px,transparent 4.5px),radial-gradient(circle,#fff 0 2px,#ffd84d 2.5px,transparent 4.5px),radial-gradient(circle,#fff 0 2px,#22d3ff 2.5px,transparent 4.5px),radial-gradient(circle,#fff 0 2px,#39ff88 2.5px,transparent 4.5px);
  background-size:72px 10px;background-position:0 0,18px 0,36px 0,54px 0;background-repeat:repeat-x;filter:drop-shadow(0 0 4px rgba(255,255,255,.8))}
.fair-sign::before{top:6px}
.fair-sign::after{bottom:6px}
@media (prefers-reduced-motion:no-preference){
  .fair-sign::before{animation:fairchase 1.2s steps(4) infinite}
  .fair-sign::after{animation:fairchase 1.2s steps(4) infinite reverse}
}
@keyframes fairchase{to{background-position:18px 0,36px 0,54px 0,72px 0}}
.fair-sign .neon-top{color:#7ef3ff;text-shadow:0 0 8px #22d3ff}
.fair-sign .neon::before,.fair-sign .neon::after{content:"★";font-size:.4em;vertical-align:middle;margin:0 .4em;color:#ffd84d;text-shadow:0 0 10px #ffd84d}
/* Neon trim on every cabinet */
.arcade .game-inner{outline:2px solid rgba(34,211,255,.35);outline-offset:-8px}
.arcade .game-inner > h2{background:linear-gradient(180deg,#1d0f45,#0b0b18);border-color:var(--cab)}
/* Token machine: glowing prize lights */
.reels{display:flex;justify-content:center;gap:.5rem;margin:.4rem auto .8rem}
.reels span{width:3.4rem;height:3.6rem;display:flex;align-items:center;justify-content:center;border-radius:12px;background:#0b0820;color:#fff;font-family:var(--display);font-weight:900;font-size:1.6rem;border:3px solid #ff4fd8;text-shadow:0 0 8px #ff4fd8;box-shadow:0 0 14px rgba(255,79,216,.6),inset 0 0 12px rgba(255,79,216,.35)}
.reels span:nth-child(2){border-color:#ffd84d;text-shadow:0 0 8px #ffd84d;box-shadow:0 0 14px rgba(255,216,77,.6),inset 0 0 12px rgba(255,216,77,.35)}
.reels span:nth-child(3){border-color:#22d3ff;text-shadow:0 0 8px #22d3ff;box-shadow:0 0 14px rgba(34,211,255,.6),inset 0 0 12px rgba(34,211,255,.35)}
@media (prefers-reduced-motion:no-preference){
  .reels span{animation:prizeglow 2.4s ease-in-out infinite}
  .reels span:nth-child(2){animation-delay:.3s}
  .reels span:nth-child(3){animation-delay:.6s}
  .token-machine:hover .reels span{animation:prizehop .5s ease-in-out 2}
}
@keyframes prizeglow{0%,100%{filter:brightness(1)}50%{filter:brightness(1.45)}}
@keyframes prizehop{50%{transform:translateY(-6px)}}
.token-machine{background:linear-gradient(180deg,#1d0f45,#0a0620);border-color:#22d3ff}
/* Prize counter in neon green */
.arcade .club .club-inner{border-color:#39ff88;box-shadow:0 0 26px rgba(57,255,136,.45)}
/* Floating arcade cabinet at the bottom */
.arcade-floor{position:relative;display:flex;flex-direction:column;align-items:center;padding:2.5rem 1rem 2.5rem}
.float-cab{position:relative;display:flex;flex-direction:column;align-items:center;width:150px;padding:10px 12px 0;border-radius:16px 16px 6px 6px;background:linear-gradient(180deg,#1b1240,#0b0820);border:3px solid #ff4fd8;box-shadow:0 0 18px #ff4fd8,0 0 44px rgba(255,79,216,.45),inset 0 0 18px rgba(34,211,255,.25);text-decoration:none;color:#fff}
.float-cab:focus-visible{outline:3px solid #7ef3ff;outline-offset:6px}
.fc-marquee{display:block;width:100%;padding:.35rem 0;border-radius:6px;background:#0a0620;border:2px solid #22d3ff;font-family:var(--display);font-weight:900;font-size:.85rem;text-transform:uppercase;letter-spacing:.06em;text-align:center;color:#fff;text-shadow:0 0 6px #fff,0 0 14px #22d3ff,0 0 26px #22d3ff}
.fc-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;width:100%;height:96px;margin:10px 0;border-radius:8px;background:repeating-linear-gradient(0deg,rgba(57,255,136,.08) 0 2px,transparent 2px 4px),#03100a;border:4px solid #050507;box-shadow:inset 0 0 18px rgba(57,255,136,.35)}
.fc-screen b{font-family:"Courier New",monospace;font-size:1.05rem;color:#39ff88;text-shadow:0 0 8px #39ff88}
.fc-screen i{font-style:normal;font-family:"Courier New",monospace;font-size:.7rem;color:#ffd84d;text-shadow:0 0 6px #ffd84d}
.fc-panel{display:flex;align-items:center;justify-content:center;gap:8px;width:calc(100% + 18px);height:34px;border-radius:6px;background:linear-gradient(180deg,#2a1a5e,#140c33);border-top:2px solid #22d3ff;transform:perspective(200px) rotateX(18deg)}
.fc-stick{position:relative;top:-5px;width:6px;height:16px;margin-right:10px;background:#ddd;border-radius:3px}
.fc-stick::after{content:"";position:absolute;left:50%;top:-9px;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:#ff2d55;box-shadow:0 0 10px #ff2d55}
.fc-btn{width:12px;height:12px;border-radius:50%;background:#22d3ff;box-shadow:0 0 8px #22d3ff}
.fc-btn.b2{background:#ffd84d;box-shadow:0 0 8px #ffd84d}
.fc-btn.b3{background:#39ff88;box-shadow:0 0 8px #39ff88}
.fc-base{position:relative;display:block;width:100%;height:56px;margin-top:2px;background:linear-gradient(180deg,#140c33,#0b0820)}
.fc-base::after{content:"INSERT COIN";position:absolute;left:50%;top:15px;transform:translateX(-50%);font-family:"Courier New",monospace;font-size:.6rem;color:#ffd84d;padding:.2rem .4rem;border:1px solid #ffd84d;border-radius:3px;white-space:nowrap;text-shadow:0 0 6px #ffd84d}
.fc-shadow{display:block;width:120px;height:14px;margin-top:22px;border-radius:50%;background:radial-gradient(ellipse,rgba(255,79,216,.55),transparent 70%)}
.fc-cta{margin:.8rem 0 0;color:#cfd3ff;font-size:.9rem}
.float-cab:hover .fc-marquee{color:#ffd84d}
@media (prefers-reduced-motion:no-preference){
  .float-cab{animation:cabfloat 3.2s ease-in-out infinite,cabglow 2.4s ease-in-out infinite}
  .fc-shadow{animation:cabshadow 3.2s ease-in-out infinite}
  .fc-screen i{animation:blink 1.2s steps(2,start) infinite}
}
@keyframes cabfloat{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-16px) rotate(2deg)}}
@keyframes cabglow{0%,100%{border-color:#ff4fd8;box-shadow:0 0 18px #ff4fd8,0 0 44px rgba(255,79,216,.45),inset 0 0 18px rgba(34,211,255,.25)}50%{border-color:#22d3ff;box-shadow:0 0 18px #22d3ff,0 0 44px rgba(34,211,255,.45),inset 0 0 18px rgba(255,79,216,.25)}}
@keyframes cabshadow{0%,100%{transform:scaleX(1);opacity:.9}50%{transform:scaleX(.7);opacity:.5}}
.nw-wheel{stroke:#ff4fd8;filter:drop-shadow(0 0 6px #ff4fd8) drop-shadow(0 0 14px #ff4fd8)}
.nw-ticket{stroke:#ff8a1a;filter:drop-shadow(0 0 6px #ff8a1a) drop-shadow(0 0 14px #ff8a1a)}
@media (prefers-reduced-motion:no-preference){.nw-wheel{animation-delay:2s}.nw-ticket{animation-delay:2.4s}}
@keyframes wheelspin{to{transform:rotate(360deg)}}

/* Arcade entrance photo + neon wall art */
.arcade-entrance{position:relative;margin:-4rem 0 1.5rem;padding:4.5rem 1rem 2.2rem;background:linear-gradient(180deg,rgba(7,5,26,.35),rgba(7,5,26,.92)),var(--arcade-bg) center/cover no-repeat}
.arcade-entrance::after{content:"";position:absolute;left:0;right:0;bottom:0;height:40%;pointer-events:none;background:linear-gradient(0deg,#07051a,transparent)}
.arcade-entrance .fair-sign{position:relative;z-index:1}
.neon-wall{position:relative;z-index:1;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:clamp(14px,4vw,46px);margin-top:.4rem}
.nw{height:clamp(36px,6vw,62px);width:auto;fill:none;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round}
.nw-moto{stroke:#22d3ff;filter:drop-shadow(0 0 6px #22d3ff) drop-shadow(0 0 14px #22d3ff)}
.nw-car{stroke:#ff2d55;filter:drop-shadow(0 0 6px #ff2d55) drop-shadow(0 0 14px #ff2d55)}
.nw-pad{stroke:#b98cff;filter:drop-shadow(0 0 6px #b98cff) drop-shadow(0 0 14px #b98cff)}
.nw-bolt{stroke:#ffd84d;filter:drop-shadow(0 0 6px #ffd84d) drop-shadow(0 0 14px #ffd84d)}
.nw-pin{stroke:#39ff88;filter:drop-shadow(0 0 6px #39ff88) drop-shadow(0 0 14px #39ff88)}
@media (prefers-reduced-motion:no-preference){
  .nw{animation:neonpulse 2.4s ease-in-out infinite}
  .nw-car{animation-delay:.4s}.nw-pad{animation-delay:.8s}.nw-bolt{animation-delay:1.2s}.nw-pin{animation-delay:1.6s}
}
@keyframes neonpulse{0%,100%{opacity:1}45%{opacity:1}50%{opacity:.35}55%{opacity:1}}
/* Neon light strip along every cabinet top */
.arcade .game-inner::before{content:"";position:absolute;left:18px;right:18px;top:-3px;height:4px;border-radius:2px;background:linear-gradient(90deg,#ff2d55,#ffd84d,#39ff88,#22d3ff,#b98cff,#ff2d55);background-size:200% 100%;filter:drop-shadow(0 0 6px rgba(255,255,255,.6))}
@media (prefers-reduced-motion:no-preference){.arcade .game-inner::before{animation:stripflow 4s linear infinite}}
@keyframes stripflow{to{background-position:200% 0}}

/* Holiday special */
.arcade-bar.promo{background:linear-gradient(90deg,#4a1a00,#1a0a2a 45%,#3a0d1a);border-bottom-color:#ff8a1a}
.arcade-bar.promo .ab-new{background:#ff8a1a;color:#1a0800}
.tm-promo{display:flex;flex-direction:column;gap:.3rem;text-align:left;margin:.2rem 0 1rem;padding:.8rem .9rem;border-radius:12px;background:linear-gradient(135deg,#3a1500,#1a0a2a);border:2px solid #ff8a1a;color:#ffe2c4;font-size:.9rem;box-shadow:0 0 18px rgba(255,138,26,.45)}
.tm-promo b{color:#ffb066;font-size:1rem;letter-spacing:.04em;text-transform:uppercase}
.tm-promo a,.club-promo a{color:#7ef3ff}
.club-promo{background:#2a1500;border:1px solid #ff8a1a;border-radius:10px;padding:.6rem .8rem;color:#ffe2c4}
.club-hol{display:block;color:#ffb066;margin-bottom:.4rem}

/* Maze Rush */
.arcade .mgame .game-inner{--cab:#ff4fd8}
.m-eyebrow{color:#ff4fd8}
#mCanvas{display:block;width:100%;max-width:520px;margin:0 auto;touch-action:none;background:#000}
#mCanvas:focus-visible{outline:3px solid #ff4fd8;outline-offset:-3px}
.mwrap{max-width:560px;margin:0 auto;background:#000}
.m-card{border-color:#ff4fd8}
.m-card .qb-card-num{color:#ff4fd8}
.m-howplay{border-left-color:#ff4fd8}
.m-howplay summary::marker{color:#ff4fd8}
.tm-inv{display:grid;gap:.4rem;margin-top:.5rem}
.tm-inv-h{margin:.2rem 0 0;color:#ffd84d;font-weight:700;font-size:.85rem;letter-spacing:.1em;text-transform:uppercase}
.tm-inv input,.tm-inv textarea{width:100%;font:inherit;padding:.6rem .8rem;border-radius:10px;border:1px solid #6b5f2a;background:#0b0a05;color:#fff}
.tm-inv-row{display:grid;grid-template-columns:2fr 1fr 1fr;gap:.4rem}


/* Maze Rush: easier controls */
#mCanvas{cursor:crosshair}
.m-pad{display:grid;grid-template-columns:repeat(3,58px);grid-template-rows:repeat(2,50px);gap:6px;justify-content:center;margin:.9rem auto 0}
.m-pad button{border-radius:12px;border:2px solid #ff4fd8;background:#140c33;color:#fff;font-size:1.3rem;cursor:pointer;box-shadow:0 0 10px rgba(255,79,216,.5);touch-action:none;user-select:none}
.m-pad button:hover{border-color:#22d3ff;box-shadow:0 0 12px rgba(34,211,255,.7)}
.m-pad button:active{background:#ff4fd8;color:#120822}
.m-pad button:focus-visible{outline:3px solid #7ef3ff;outline-offset:2px}
.m-pad .up{grid-column:2;grid-row:1}
.m-pad .left{grid-column:1;grid-row:2}
.m-pad .down{grid-column:2;grid-row:2}
.m-pad .right{grid-column:3;grid-row:2}
.m-hint{text-align:center;color:#cfd3ff;font-size:.85rem;margin:.5rem auto 0;max-width:30rem}

/* Miro's code maker */
.tm-maker{display:grid;gap:.5rem;margin-top:1rem;padding:1rem;border-radius:12px;background:#120a2e;border:2px dashed #39ff88;box-shadow:0 0 14px rgba(57,255,136,.35);text-align:left}
.tm-maker button{justify-self:start;padding:.55rem .9rem;border-radius:8px;border:2px solid #39ff88;background:#0b0820;color:#fff;font-weight:700;cursor:pointer}
.tm-maker button:hover{background:#39ff88;color:#07140c}
.tm-maker .tm-row{display:flex;flex-wrap:wrap;gap:.5rem}
.tm-made-code{margin:.2rem 0;font-family:"Courier New",monospace;font-size:1.5rem;font-weight:700;letter-spacing:.08em;color:#39ff88;text-shadow:0 0 10px #39ff88}
.tm-maker details summary{cursor:pointer;color:#cfd3ff}
.tm-maker ol{margin:.4rem 0 0;padding-left:1.4rem;font-family:"Courier New",monospace;color:#fff}

/* Picture shown when a browser can't run the 3D scene */
.fallback3d{display:none;position:absolute;top:0;left:0;right:0;height:100vh;z-index:-1;align-items:center;justify-content:center;pointer-events:none}
.fallback3d svg{width:min(80vw,640px);height:auto}
body.no3d .fallback3d{display:flex}
@media (prefers-reduced-motion:no-preference){ .mb-ball{animation:mbFloat 4s ease-in-out infinite;transform-origin:260px 180px} }
@keyframes mbFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-14px) rotate(3deg)}}