:root {
  --ink: #f7fbff;
  --muted: #afbdd0;
  --navy: #101a2d;
  --navy-soft: #17253c;
  --navy-lighter: #203653;
  --yellow: #ffd33d;
  --yellow-strong: #ffb800;
  --cyan: #56d9ff;
  --line: rgba(255, 255, 255, 0.12);
  --shadow: 0 24px 70px rgba(0, 0, 0, 0.34);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  color: var(--ink);
  background:
    radial-gradient(circle at 86% 6%, rgba(86, 217, 255, 0.14), transparent 28rem),
    radial-gradient(circle at 8% 38%, rgba(255, 211, 61, 0.11), transparent 24rem),
    var(--navy);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.6;
}

img { max-width: 100%; }
a { color: inherit; }
.container { width: min(1160px, calc(100% - 40px)); margin: 0 auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  border-bottom: 1px solid var(--line);
  background: rgba(16, 26, 45, 0.86);
  backdrop-filter: blur(18px);
}
.nav-wrap { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 12px; font-size: 1.15rem; font-weight: 850; letter-spacing: -0.02em; text-decoration: none; }
.brand img { border-radius: 13px; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25); }
.site-nav { display: flex; align-items: center; gap: 30px; }
.site-nav a { color: var(--muted); font-weight: 700; text-decoration: none; transition: color .2s ease, transform .2s ease; }
.site-nav a:hover { color: var(--ink); }
.site-nav .nav-cta { color: #152035; background: var(--yellow); border-radius: 999px; padding: 10px 18px; }
.site-nav .nav-cta:hover { color: #152035; transform: translateY(-2px); }
.menu-button { display: none; width: 46px; height: 42px; padding: 9px; border: 1px solid var(--line); border-radius: 12px; background: var(--navy-soft); cursor: pointer; }
.menu-button span:not(.sr-only) { display: block; height: 2px; margin: 5px 0; background: var(--ink); border-radius: 2px; }

.hero { padding: 92px 0 82px; overflow: hidden; }
.hero-grid { display: grid; grid-template-columns: .78fr 1.22fr; align-items: center; gap: 64px; }
.eyebrow, .section-kicker { margin: 0 0 12px; color: var(--yellow); font-size: .82rem; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.hero h1 { margin: 0; max-width: 600px; font-size: clamp(3.75rem, 8vw, 6.7rem); line-height: .88; letter-spacing: -.065em; }
.hero h1 span { color: var(--yellow); text-shadow: 0 10px 40px rgba(255, 211, 61, .18); }
.hero-text { max-width: 530px; margin: 26px 0 0; color: var(--muted); font-size: 1.1rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; }
.button { min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; border: 1px solid transparent; border-radius: 14px; padding: 12px 20px; font-weight: 850; text-decoration: none; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.button:hover { transform: translateY(-3px); }
.button svg { width: 21px; height: 21px; fill: currentColor; }
.button-primary { color: #152035; background: linear-gradient(135deg, var(--yellow), var(--yellow-strong)); box-shadow: 0 12px 28px rgba(255, 184, 0, .2); }
.button-primary:hover { box-shadow: 0 16px 38px rgba(255, 184, 0, .32); }
.button-secondary { border-color: var(--line); background: rgba(255, 255, 255, .045); }

.game-card { position: relative; overflow: hidden; border: 1px solid rgba(255, 255, 255, .18); border-radius: 22px; background: #09111f; box-shadow: var(--shadow); transform: rotate(1deg); }
.game-card::after { content: ""; position: absolute; inset: 42px 0 0; pointer-events: none; box-shadow: inset 0 0 60px rgba(0, 0, 0, .2); }
.game-card img { width: 100%; display: block; aspect-ratio: 1052 / 592; object-fit: cover; }
.game-card-bar { height: 42px; display: flex; align-items: center; gap: 7px; padding: 0 14px; border-bottom: 1px solid var(--line); }
.game-card-bar span { width: 9px; height: 9px; border-radius: 50%; background: #ff6a66; }
.game-card-bar span:nth-child(2) { background: var(--yellow); }
.game-card-bar span:nth-child(3) { background: #63db9a; }
.game-card-bar strong { margin-left: auto; color: #71829a; font-size: .68rem; letter-spacing: .16em; }

.features { padding: 82px 0; border-block: 1px solid var(--line); background: rgba(255, 255, 255, .018); }
.features h2, .trailer-copy h2, .download-card h2 { max-width: 680px; margin: 0; font-size: clamp(2.2rem, 5vw, 4rem); line-height: 1.04; letter-spacing: -.045em; }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 42px; }
.feature-card { min-height: 260px; padding: 30px; border: 1px solid var(--line); border-radius: 20px; background: linear-gradient(145deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .02)); }
.feature-number { display: inline-flex; width: 48px; height: 48px; align-items: center; justify-content: center; color: #172033; background: var(--yellow); border-radius: 14px; font-weight: 900; }
.feature-card h3 { margin: 34px 0 8px; font-size: 1.45rem; }
.feature-card p { margin: 0; color: var(--muted); }

.trailer-section { padding: 105px 0; }
.trailer-grid { display: grid; grid-template-columns: .72fr 1.28fr; align-items: center; gap: 60px; }
.trailer-copy p:not(.section-kicker) { color: var(--muted); font-size: 1.05rem; }
.text-link { display: inline-block; margin-top: 12px; color: var(--yellow); font-weight: 850; text-decoration: none; }
.video-frame { overflow: hidden; aspect-ratio: 16 / 9; border: 1px solid var(--line); border-radius: 22px; background: #080d16; box-shadow: var(--shadow); }
.video-frame iframe { width: 100%; height: 100%; border: 0; }

.download-section { padding: 0 0 105px; }
.download-card { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 26px; padding: 38px; border: 1px solid rgba(255, 211, 61, .28); border-radius: 24px; background: linear-gradient(125deg, rgba(255, 211, 61, .1), rgba(86, 217, 255, .07)); box-shadow: var(--shadow); }
.download-card > img { border-radius: 24px; }
.download-card h2 { font-size: clamp(2rem, 4vw, 3.3rem); }

.site-footer { padding: 44px 0; border-top: 1px solid var(--line); background: #0b1424; }
.footer-wrap { display: grid; grid-template-columns: 1fr auto; align-items: start; gap: 28px; }
.footer-brand { font-size: 1rem; }
.site-footer p { margin: 8px 0 0; color: #8291a6; }
.footer-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 22px; }
.footer-links a { color: var(--muted); font-weight: 700; text-decoration: none; }
.footer-links a:hover { color: var(--yellow); }
.copyright { grid-column: 1 / -1; padding-top: 22px; border-top: 1px solid var(--line); font-size: .9rem; }

.policy-main { padding: 72px 0 96px; }
.policy-card { max-width: 860px; padding: 48px; border: 1px solid var(--line); border-radius: 24px; background: rgba(255, 255, 255, .035); box-shadow: var(--shadow); }
.policy-card h1 { margin: 0; font-size: clamp(2.7rem, 7vw, 5rem); line-height: 1; letter-spacing: -.055em; }
.policy-date { color: var(--muted); }
.policy-card h2 { margin: 38px 0 8px; font-size: 1.45rem; }
.policy-card p { color: #c2cddd; }
.policy-card a { color: var(--yellow); }

@media (max-width: 980px) {
  .hero { padding-top: 68px; }
  .hero-grid, .trailer-grid { grid-template-columns: 1fr; gap: 48px; }
  .hero-copy { max-width: 760px; }
  .game-card { transform: none; }
  .download-card { grid-template-columns: auto 1fr; }
  .download-card .button { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  .container { width: min(100% - 28px, 1160px); }
  .nav-wrap { min-height: 72px; }
  .menu-button { display: block; }
  .site-nav { position: absolute; top: 72px; left: 14px; right: 14px; display: none; flex-direction: column; align-items: stretch; gap: 4px; padding: 14px; border: 1px solid var(--line); border-radius: 16px; background: #15233a; box-shadow: var(--shadow); }
  .site-nav.is-open { display: flex; }
  .site-nav a { padding: 11px 12px; }
  .site-nav .nav-cta { text-align: center; }
  .policy-nav { position: static; display: flex; flex-direction: row; align-items: center; padding: 0; border: 0; background: none; box-shadow: none; }
  .policy-nav a:first-child { display: none; }
  .hero { padding: 58px 0 64px; }
  .hero h1 { font-size: clamp(3.3rem, 18vw, 5rem); }
  .feature-grid { grid-template-columns: 1fr; }
  .feature-card { min-height: 220px; }
  .trailer-section { padding: 80px 0; }
  .download-section { padding-bottom: 80px; }
  .download-card { grid-template-columns: 1fr; padding: 28px; text-align: center; }
  .download-card > img { margin: 0 auto; }
  .footer-wrap { grid-template-columns: 1fr; }
  .footer-links { justify-content: flex-start; }
  .policy-card { padding: 28px 22px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; }
}
:root{--navy:#101b21;--navy-soft:#192b30;--yellow:#e5fc76;--yellow-strong:#c8ed59;--muted:#b8c8c7;--line:rgba(221,245,225,.15)}body{background:radial-gradient(ellipse at 85% 12%,#24423b 0,transparent 45%),var(--navy)}.site-header{background:#101b21f5;backdrop-filter:none}.hero h1{font-size:clamp(3.3rem,6.8vw,5.7rem);line-height:1.02}.hero-grid{grid-template-columns:1fr 1.12fr;gap:44px}.game-card{transform:none}.game-card-bar strong{color:#b8c8c7}.button-primary{background:var(--yellow);box-shadow:none}.button{border-radius:10px}.feature-card{background:#192a2a}.feature-card:nth-child(2) .feature-number{background:#b5def3}.feature-card:nth-child(3) .feature-number{background:#ffbe9c}.feature-number{border-radius:50%}.site-footer{background:#0b151a}.site-footer p{color:#b8c8c7}.skip-link{position:absolute;top:-100px;left:16px;z-index:50;background:var(--yellow);color:#101b21;padding:12px}.skip-link:focus{top:10px}:focus-visible{outline:3px solid #b5def3;outline-offset:5px}section[id]{scroll-margin-top:100px}img{height:auto}.video-frame{background:linear-gradient(135deg,#244a40,#101b21)}.trailer-play{width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:15px;background:transparent;color:var(--yellow);border:0;font:700 42px system-ui;cursor:pointer}.trailer-play span{font-size:18px}.download-main{padding:80px 0}.download-hero{display:grid;grid-template-columns:1.15fr 1fr;gap:70px;align-items:center}.download-hero h1{font-size:clamp(3rem,6.5vw,5.8rem);line-height:1.04;letter-spacing:-.06em;margin:0}.download-hero h1 span{color:var(--yellow)}.download-note{color:var(--muted);min-height:52px;font-size:.92rem;max-width:500px}.app-preview{padding:60px 30px;text-align:center;border:1px solid var(--line);border-radius:30px;background:radial-gradient(circle at 50% 10%,#426546,#20372f 70%)}.app-preview img{border-radius:32px;margin-bottom:24px}.app-tagline{font-size:1.7rem;font-weight:800}.chips{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.chips span{padding:5px 11px;border:1px solid var(--line);border-radius:30px;font-size:.8rem}.install-section{padding-top:90px}.install-section h2,.faq h2{font-size:clamp(2rem,4vw,3rem);line-height:1.15;margin:0}.faq{max-width:860px;padding-top:80px}.faq h2{margin-bottom:30px}details{border-bottom:1px solid var(--line);padding:20px 0}summary{cursor:pointer;font-weight:700;min-height:32px}details p{color:var(--muted)}a[aria-disabled=true]{opacity:.65;cursor:wait}.hero-grid>*{min-width:0}
@media(max-width:980px){.hero-grid,.download-hero{grid-template-columns:1fr}.download-hero{gap:40px}.app-preview{padding:35px}.hero{padding:60px 0}}
@media(max-width:760px){.nav-wrap{flex-wrap:wrap;gap:12px;padding:12px 0}.site-nav{background:#192b30}.site-nav:not(.js-menu){display:flex;position:static;flex-direction:row;flex-wrap:wrap;width:100%;box-shadow:none}.menu-button{display:none}.menu-button.enhanced{display:block}.hero h1{font-size:clamp(3rem,12vw,5rem)}.download-main{padding:48px 0}.feature-card{min-height:0}.feature-card h3{margin-top:24px}.hero-actions .button{flex:1 1 180px}.download-card{overflow-wrap:anywhere}.footer-links a{padding:10px 0}.app-preview{padding:32px 16px}}

/* Prominent home actions and centered download content. */
.home-page .site-nav .nav-privacy{padding:10px 16px;border:1px solid #b5def3;border-radius:10px;color:#d7efff;background:rgba(181,222,243,.08)}
.home-page .hero-actions .button-primary{min-height:60px;padding:16px 26px;font-size:1.08rem;box-shadow:0 8px 26px rgba(200,237,89,.18)}
.button-privacy{border:1px solid #b5def3;background:rgba(181,222,243,.12);color:#e0f3ff;min-height:60px}
.home-page .hero-actions .button-secondary{flex-basis:100%;justify-content:flex-start;padding-left:0;border:0;background:none;min-height:40px;color:var(--muted)}
.home-page .footer-links .footer-privacy{color:#e0f3ff;text-decoration:underline;text-underline-offset:5px}
.download-main{text-align:center}.download-hero{grid-template-columns:minmax(0,1fr);gap:42px;max-width:860px;justify-items:center}.download-hero>div:first-child{width:100%}.download-hero .hero-text{margin:26px auto 0;max-width:640px}.download-hero .hero-actions{justify-content:center}.download-hero .download-note{margin:18px auto}.download-hero .app-preview{width:100%;max-width:520px;padding:36px 24px}.download-main .feature-card{text-align:center}.download-main .faq details{text-align:center}.download-main .faq summary{list-style-position:inside}.download-main .faq details p{max-width:680px;margin:14px auto}.download-main .hero-actions .button{flex:0 1 auto}
@media(max-width:760px){.home-page .hero-actions .button{flex:1 1 100%}.home-page .hero-actions .button-secondary{justify-content:center}.download-main .hero-actions{max-width:420px;margin-left:auto;margin-right:auto}.download-main .hero-actions .button{flex:1 1 100%}.download-hero .app-preview{padding:28px 18px}}

.button-play-store{background:#f3f8ef;color:#152035;border:1px solid #f3f8ef;min-height:60px}.button-play-store:hover{background:#deedcf}

/* Center the complete download page at every viewport width. */
main.download-main{width:100%;margin-inline:auto;text-align:center}
main.download-main .download-hero{display:flex;flex-direction:column;align-items:center;justify-content:center;width:calc(100% - 32px);max-width:860px;margin-inline:auto;gap:40px;text-align:center}
main.download-main .download-hero>div{width:100%;margin-inline:auto;min-width:0}
main.download-main .download-hero h1{max-width:100%;margin-inline:auto;text-align:center}
main.download-main .hero-text,main.download-main .download-note{margin-left:auto;margin-right:auto;text-align:center}
main.download-main .hero-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;width:100%;margin-left:auto;margin-right:auto}
main.download-main .app-preview{max-width:520px;margin-inline:auto}
main.download-main .install-section,main.download-main .faq{margin-inline:auto;text-align:center}
main.download-main .feature-card,main.download-main summary,main.download-main details p{text-align:center}
.video-frame iframe{display:block;width:100%;height:100%;border:0}