.hero { background: radial-gradient(circle at 17% 22%, #173b83 0, transparent 27%), radial-gradient(circle at 84% 16%, #bd2f74 0, transparent 31%), linear-gradient(128deg, #070c25 0%, #1c1555 48%, #561553 100%); }
.coin-intro { align-items: center; background: #030306; display: flex; inset: 0; justify-content: center; overflow: hidden; position: fixed; z-index: 100; }
.coin-intro-video { height: 100%; object-fit: contain; position: absolute; width: 100%; }
.coin-intro-ui { bottom: clamp(20px, 6vh, 56px); display: flex; justify-content: center; left: 0; pointer-events: none; position: absolute; right: 0; }
.coin-intro-ui button { animation: coinFlash 1.1s steps(2) infinite; background: linear-gradient(180deg,#242943 0 52%,#111420 52%); border: 3px solid #eef5ff; box-shadow: 0 0 0 3px #15192d, 0 0 22px #63e8ff, 7px 7px 0 #f54d9a; color: #fff; cursor: pointer; display: block; font: 700 clamp(16px,2.7vw,27px) "DM Mono", monospace; letter-spacing: .04em; padding: 9px 19px 8px 52px; pointer-events: auto; position: relative; text-align: left; text-shadow: 2px 2px 0 #080a12; }
.coin-intro-ui button::before { background: #f4c83d; border: 2px solid #fff0a7; box-shadow: inset 0 0 0 2px #b36d12, 0 0 10px #ffc94c; content: ""; height: 21px; left: 16px; position: absolute; top: 50%; transform: translateY(-50%) rotate(20deg); width: 21px; }
.coin-intro-ui button .coin-dot { display: none; }
.coin-intro-ui button > span:not(.coin-dot),.coin-intro-ui button i { display: block; }
.coin-intro-ui button i { color: #6deaff; font: 700 9px "DM Mono", monospace; letter-spacing: .22em; margin-top: 2px; }
.coin-intro-ui button:hover,.coin-intro-ui button:focus-visible { background: linear-gradient(180deg,#343c60 0 52%,#151b2d 52%); box-shadow: 0 0 0 3px #15192d, 0 0 32px #63e8ff, 7px 7px 0 #f54d9a; outline: none; }
.coin-intro-ui button.is-starting { animation: none; opacity: .72; pointer-events: none; }
.coin-intro.is-leaving { animation: introLeave .6s ease forwards; pointer-events: none; }
@keyframes coinFlash { 50% { transform: scale(1.045); } }
@keyframes introLeave { to { opacity: 0; visibility: hidden; } }
.hero::after { opacity: .74; animation-duration: 8s; }
#heroInvaders { position: absolute; inset: 0; height: 100%; pointer-events: none; width: 100%; z-index: 0; opacity: .9; }
.hero-copy,.hero-game,.hero-note { z-index: 1; }
.machine-card { transition: transform .25s ease, box-shadow .25s ease; }
.machine-card:hover { box-shadow: 10px 12px 0 rgba(9,10,22,.2); transform: translateY(-7px) rotate(-.5deg); }
.machine-illustration { align-self: center; height: 270px; margin: -14px auto 0; max-width: 90%; object-fit: contain; }
.bartop-illustration { height: 218px; margin-top: 20px; }
.image-choices { grid-template-columns: repeat(3,1fr); }
.image-choices span { align-items: center; display: flex; flex-direction: column; min-height: 198px; text-align: center; }
.image-choices img { height: 106px; margin-bottom: 9px; max-width: 100%; object-fit: contain; }
.quest-node { text-decoration: none; }
.jal-help { display: grid; gap: 1px; margin-top: 18px; background: #d7d2c4; }
.jal-help details { background: #fff; padding: 17px 20px; }
.jal-help summary { cursor: pointer; font-weight: 700; }
.jal-help p { color: #504d5c; line-height: 1.5; margin: 13px 0 0; max-width: 650px; }
.reviews { background: #11121f; color: #fff; }
.reviews .eyebrow { color: var(--lime); }
.reviews-layout { display: grid; gap: 20px; grid-template-columns: .8fr 1.2fr; }
.review-form { background: #242234; display: grid; gap: 14px; padding: 24px; }
.review-form label { display: grid; font-size: 13px; font-weight: 700; gap: 7px; }
.review-form input,.review-form textarea,.review-form select { border: 1px solid #58536d; border-radius: 0; background: #171625; color: #fff; font: 14px "Space Grotesk", sans-serif; padding: 11px; }
.review-form textarea { min-height: 105px; resize: vertical; }
.reviews-list { display: grid; gap: 12px; }
.review-card { background: #242234; border-left: 3px solid var(--pink); padding: 18px; }
.review-card p { color: #d6d1e5; line-height: 1.45; margin: 9px 0 0; }
.review-card strong { color: var(--lime); }
@media (max-width: 800px) { .machine-illustration { height: 220px; }.image-choices,.reviews-layout { grid-template-columns: 1fr; }.image-choices span { min-height: 0; }.image-choices img { height: 90px; }.coin-intro-video { object-fit: contain; }.coin-intro-ui { bottom: max(20px, env(safe-area-inset-bottom)); }.coin-intro-ui button { font-size: 16px; padding: 9px 14px 7px; }.coin-intro-ui button i { font-size: 8px; } }
