/* Local retro neon design preview. The published site's HTML and game logic are unchanged. */
:root {
  --arcade-ink: #090d25;
  --arcade-midnight: #101638;
  --arcade-violet: #762cae;
  --arcade-cyan: #4de6ed;
  --arcade-pink: #f46ccf;
  --arcade-yellow: #ffda31;
  --arcade-muted: #c4cde2;
  background: var(--arcade-ink);
}

body { background: var(--arcade-ink); }
:focus-visible { outline-color: var(--arcade-cyan); }
.progress { background: linear-gradient(90deg, var(--arcade-pink), var(--arcade-cyan), var(--arcade-yellow)); box-shadow: 0 0 14px var(--arcade-cyan); }
.site-header { border-bottom: 1px solid rgba(116, 225, 242, .13); }
.brand-mark { box-shadow: 0 0 0 1px rgba(255,218,49,.5), 0 0 24px rgba(255,218,49,.2); }
.brand-dot { color: var(--arcade-pink); }
.site-header nav>a:not(.nav-cta) { opacity: .9; }
.nav-cta { border-color: rgba(77,230,237,.75); box-shadow: inset 0 0 17px rgba(77,230,237,.08); }
.nav-cta:hover { background: var(--arcade-cyan); color: var(--arcade-ink); }
.site-header nav>.language-switch { border-color: var(--arcade-cyan); color: var(--arcade-cyan); box-shadow: 0 0 14px rgba(77,230,237,.13); }
.site-header nav>.language-switch:hover { background: var(--arcade-cyan); color: var(--arcade-ink); }

.hero {
  background: radial-gradient(circle at 72% 45%, rgba(79,31,132,.55), transparent 37%),
              radial-gradient(circle at 99% 15%, rgba(4,126,164,.22), transparent 34%),
              linear-gradient(135deg, #101638, var(--arcade-ink) 66%);
}
.hero:before { background: radial-gradient(circle at 46% 48%, rgba(58,206,229,.16), rgba(85,30,145,.12) 43%, transparent 71%); }
.hero-grid { opacity: .26; background-image: linear-gradient(rgba(84,208,238,.18) 1px, transparent 1px), linear-gradient(90deg,rgba(84,208,238,.18) 1px,transparent 1px); }
.eyebrow { color: var(--arcade-cyan); }
.live-dot { background: var(--arcade-cyan); box-shadow: 0 0 0 5px rgba(77,230,237,.13), 0 0 16px rgba(77,230,237,.9); }
.outline-word { -webkit-text-stroke-color: var(--arcade-cyan); text-shadow: 0 0 22px rgba(77,230,237,.14); }
.hero-copy>p { color: #e0e7f5; }
.button-yellow { background: var(--arcade-yellow); box-shadow: 0 0 0 1px rgba(255,218,49,.42), 0 0 28px rgba(255,218,49,.12); }
.button-yellow:hover { box-shadow: 0 0 30px rgba(255,218,49,.45), 6px 6px 0 var(--arcade-cyan); }
.text-link { border-color: rgba(77,230,237,.62); }
.text-link span { color: var(--arcade-cyan); }
.hero-note { color: #bdc8dd; }
.note-line { background: var(--arcade-cyan); }
.hero-art:before { background: radial-gradient(circle at 35% 30%, #ffe988, var(--arcade-yellow) 60%); box-shadow: 0 0 0 13px rgba(77,230,237,.1), 0 0 95px rgba(77,230,237,.19); }
.orbit { border-color: rgba(77,230,237,.55); box-shadow: 0 0 22px rgba(77,230,237,.1); }
.orbit-two { border-color: rgba(244,108,207,.35); }
.speed-line { background: var(--arcade-cyan); box-shadow: 0 0 14px rgba(77,230,237,.75); }
.sticker-bottom { background: #12183b; color: #fff; border: 1px solid var(--arcade-cyan); box-shadow: 6px 6px 0 var(--arcade-violet); }
.hero-footer { border-color: rgba(77,230,237,.3); color: #b3bfd6; }
.ticker { border-color: #0d1231; box-shadow: 0 8px 28px rgba(0,0,0,.32); }
.ticker-track span { color: #642398; }

.how, .features { position: relative; color: #f8faff; background: #0d1431; }
.how { background-image: radial-gradient(circle at 9% 12%, rgba(52,158,197,.14), transparent 33%), linear-gradient(145deg, #10183a, #0b1029 70%); }
.features { background-image: radial-gradient(circle at 83% 8%, rgba(147,53,171,.16), transparent 38%), linear-gradient(150deg, #0b1029, #15143b 72%); }
.how .section-label, .features .section-label { color: var(--arcade-cyan); border-color: rgba(77,230,237,.35); }
.how-top p { color: var(--arcade-muted); }
.how h2 em { color: var(--arcade-pink); text-shadow: 0 0 28px rgba(244,108,207,.18); }
.steps { border-color: var(--arcade-cyan); }
.step { background: linear-gradient(180deg,rgba(70,88,153,.09),transparent 77%); }
.step+.step { border-color: rgba(77,230,237,.24); }
.step-no { color: var(--arcade-cyan); }
.step-icon { color: var(--arcade-pink); text-shadow: 0 0 25px rgba(244,108,207,.25); }
.step p { color: var(--arcade-muted); }
.travel-story { background: linear-gradient(135deg,#1e1648,#101d44 65%,#102a48); border: 1px solid rgba(77,230,237,.48); box-shadow: 10px 10px 0 rgba(77,230,237,.1), 0 0 36px rgba(77,230,237,.08); }
.travel-story-kicker, .travel-story h3 span { color: var(--arcade-cyan); }
.travel-story p { color: #d9e5f3; }
.travel-story img { border-left: 1px solid rgba(77,230,237,.3); }

.demo { background: radial-gradient(circle at 81% 44%, rgba(9,164,185,.36), transparent 34%), radial-gradient(circle at 18% 19%, rgba(117,38,165,.48), transparent 40%), linear-gradient(135deg,#111542,#251657 66%,#0d2946); }
.demo .section-label { color: var(--arcade-cyan); border-color: rgba(77,230,237,.35); }
.demo h2 span { color: var(--arcade-yellow); text-shadow: 0 0 34px rgba(255,218,49,.25); }
.demo-intro>p, .demo-disclaimer { color: #e0e9fa; }
.demo-rules span, .demo-stat { border-color: rgba(77,230,237,.4); }
.demo-stat strong { text-shadow: 0 0 22px rgba(255,218,49,.22); }
.reset-button { border-color: var(--arcade-cyan); color: var(--arcade-cyan); }
.game-card, .game-card:hover { box-shadow: 0 0 0 1px rgba(77,230,237,.65), 17px 19px 0 rgba(3,8,36,.42), 0 0 52px rgba(77,230,237,.17); }

.features h2 span { color: var(--arcade-cyan); text-shadow: 0 0 28px rgba(77,230,237,.23); }
.feature-card { border: 1px solid rgba(255,255,255,.36); border-radius: 8px; box-shadow: 0 16px 42px rgba(0,0,0,.2); }
.feature-yellow { color: #111626; background: linear-gradient(145deg,#ffe872,#ffcf25); border-color: #ffe96b; }
.feature-yellow .feature-glyph { color: rgba(255,255,255,.85); }
.feature-blue { background: linear-gradient(145deg,#164aab,#262171); border-color: rgba(77,230,237,.65); }
.feature-blue .feature-glyph { color: rgba(77,230,237,.45); }
.feature-red { background: linear-gradient(145deg,#93258f,#df4e91); border-color: rgba(244,108,207,.7); }
.feature-red .feature-glyph { color: rgba(255,198,239,.43); }

.app-section { background: radial-gradient(circle at 77% 44%,rgba(91,38,160,.4),transparent 35%), linear-gradient(140deg,#0d1431,#0a1029); }
.app-section .section-label { color: var(--arcade-cyan); }
.app-section h2 span { color: var(--arcade-cyan); }
.app-section p { color: var(--arcade-muted); }
.app-tags span { color: #e5f7ff; border-color: rgba(77,230,237,.56); background: rgba(77,230,237,.05); }
.availability { border-color: var(--arcade-cyan); color: #d5faff; }
.app-halo { background: linear-gradient(130deg,var(--arcade-cyan),#6331ad 65%,var(--arcade-pink)); box-shadow: 0 0 60px rgba(77,230,237,.23); }
.app-visual img { border-color: var(--arcade-cyan); box-shadow: 0 0 0 8px rgba(77,230,237,.1), 0 30px 60px rgba(0,0,0,.45); }
.safety { background: #ffda31; border-block: 5px solid #0a112c; }
footer { background: #080d22; border-top: 1px solid rgba(77,230,237,.25); }
footer>a:last-child, .footer-links a:hover { color: var(--arcade-cyan); }

/* Support and privacy pages use the same visual language in this preview. */
.info-page { background: #0c1230; color: #f8faff; }
.info-header { background: #0a1029; }
.info-hero { background: radial-gradient(circle at 83% 35%,rgba(97,42,167,.42),transparent 36%),linear-gradient(140deg,#15143e,#0b1733); border-color: var(--arcade-cyan); }
.info-kicker, .info-hero h1 span { color: var(--arcade-cyan); }
.info-hero p { color: #e0e9f7; }
.info-card { color: #f8faff; background: #151b40; border-color: rgba(77,230,237,.48); box-shadow: 7px 7px 0 rgba(77,230,237,.12); }
.info-card a:not(.contact-link) { color: var(--arcade-cyan); }
.info-card a:hover { color: #fff; }
.info-card.contact-card { color: #111626; background: #ffda31; border-color: #ffe980; box-shadow: 7px 7px 0 rgba(255,218,49,.18); }
.info-card.contact-card a { color: #111626; }
.faq-item { border-color: rgba(77,230,237,.3); }
.info-safety { background: #101638; border-color: var(--arcade-yellow); }

@media (max-width: 700px) {
  .hero { background: radial-gradient(circle at 80% 67%,rgba(79,31,132,.55),transparent 45%), linear-gradient(145deg,#11183a,#090d25); }
  .hero-art:before { box-shadow: 0 0 0 7px rgba(77,230,237,.09), 0 0 50px rgba(77,230,237,.2); }
  .travel-story img { border-left: 0; border-top: 1px solid rgba(77,230,237,.3); }
  .step+.step { border-color: rgba(77,230,237,.24); }
  .game-card, .game-card:hover { box-shadow: 0 0 0 1px rgba(77,230,237,.65), 8px 11px 0 rgba(3,8,36,.45), 0 0 30px rgba(77,230,237,.12); }
}

@media (prefers-reduced-motion: reduce) {
  .button-yellow:hover { box-shadow: 0 0 0 2px var(--arcade-cyan); }
}