*:where(*, *::before, *::after){box-sizing:border-box}*{margin:0;padding:0}html,body{height:100%}html{scroll-behavior:smooth;text-size-adjust:100%}img,video,canvas,svg{max-width:100%;height:auto;display:block}picture{display:block}button,input,select,textarea{font:inherit;color:inherit;background:none;border:none}button{cursor:pointer}a{text-decoration:none;color:inherit}ul,ol{list-style:none}table{border-collapse:collapse;border-spacing:0}
:root{--color-background:#fdfdff;--color-surface:#ffffff;--color-surface-soft:#f5f7ff;--color-surface-elevated:#ffffff;--color-text:#0f172a;--color-text-muted:#64748b;--color-border:#e2e8f0;--color-primary:#2dd4bf;--color-primary-soft:#a5f3fc;--color-primary-strong:#0f766e;--color-accent-blue:#4f46e5;--color-accent-green:#22c55e;--color-success:#16a34a;--color-warning:#f97316;--color-danger:#ef4444;--gray-50:#f9fafb;--gray-100:#f3f4f6;--gray-200:#e5e7eb;--gray-300:#d1d5db;--gray-400:#9ca3af;--gray-500:#6b7280;--gray-600:#4b5563;--gray-700:#374151;--gray-800:#1f2933;--gray-900:#111827;--font-sans:"Inter",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--font-mono:"JetBrains Mono","Fira Code",ui-monospace,monospace;--font-display:"Press Start 2P","VT323",system-ui,monospace;--text-xs:0.75rem;--text-sm:0.875rem;--text-md:1rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:1.875rem;--text-4xl:2.25rem;--leading-tight:1.2;--leading-normal:1.5;--leading-relaxed:1.7;--space-0:0;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-7:28px;--space-8:32px;--space-9:36px;--space-10:40px;--space-12:48px;--space-14:56px;--space-16:64px;--space-20:80px;--space-24:96px;--radius-none:0;--radius-xs:4px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--radius-pill:999px;--radius-pixel:6px;--shadow-xs:0 1px 0 rgba(15,23,42,0.04);--shadow-sm:0 1px 3px rgba(15,23,42,0.08);--shadow-md:0 4px 12px rgba(15,23,42,0.12);--shadow-lg:0 18px 45px rgba(15,23,42,0.16);--shadow-soft-pixel:0 0 0 1px rgba(15,23,42,0.06),0 4px 0 rgba(148,163,184,0.35);--transition-fast:120ms ease-out;--transition-base:180ms ease-out;--transition-slow:260ms ease-out;--gradient-card:linear-gradient(135deg,#e0f2fe,#f5f3ff,#dcfce7);--gradient-hero:radial-gradient(circle at top,#ccfbf1 0,#e0f2fe 40%,#f9fafb 100%)}
body{font-family:var(--font-sans);font-size:var(--text-md);line-height:var(--leading-normal);color:var(--color-text);background:var(--gradient-hero);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
main{min-height:100vh}
h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:400;line-height:var(--leading-tight);color:var(--color-text);text-transform:none}
h1{font-size:clamp(1.9rem,4vw,2.4rem);margin-bottom:var(--space-4)}
h2{font-size:clamp(1.4rem,3vw,1.8rem);margin-bottom:var(--space-3)}
h3{font-size:1.25rem;margin-bottom:var(--space-2)}
h4{font-size:1.125rem;margin-bottom:var(--space-2)}
p{margin-bottom:var(--space-3);color:var(--color-text-muted);line-height:var(--leading-relaxed)}
strong,b{font-weight:600}
small{font-size:var(--text-sm)}
a{color:var(--color-accent-blue);transition:color var(--transition-base),background-color var(--transition-base),box-shadow var(--transition-base),transform var(--transition-base)}a:hover{color:var(--color-primary-strong)}a:focus-visible{outline:2px dashed var(--color-accent-blue);outline-offset:3px}
button:focus-visible,[role="button"]:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--color-accent-blue);outline-offset:2px}
body[data-scroll-lock="true"]{overflow:hidden}
.container{width:100%;margin-inline:auto;padding-inline:var(--space-4);max-width:1120px}
@media (min-width:768px){.container{padding-inline:var(--space-6)}}
.flex{display:flex}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.flex-center{display:flex;align-items:center;justify-content:center}.items-center{align-items:center}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}.gap-4{gap:var(--space-4)}.gap-6{gap:var(--space-6)}.wrap{flex-wrap:wrap}
.grid{display:grid}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-gap-4{gap:var(--space-4)}
@media (max-width:767px){.grid-2,.grid-3{grid-template-columns:minmax(0,1fr)}}
.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}
.card{background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft-pixel);padding:var(--space-4);border:1px solid rgba(148,163,184,0.3);position:relative;overflow:hidden}
.card-soft{background:var(--gradient-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:var(--space-4);border:1px solid rgba(148,163,184,0.25)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:0.7rem 1.3rem;border-radius:var(--radius-pixel);font-size:var(--text-sm);font-weight:600;letter-spacing:0.03em;text-transform:uppercase;line-height:1;border:1px solid transparent;background:var(--color-surface);color:var(--color-text);box-shadow:0 0 0 1px rgba(15,23,42,0.05);transition:background-color var(--transition-base),color var(--transition-base),box-shadow var(--transition-base),transform var(--transition-fast)}
.btn-primary{background:linear-gradient(135deg,#22c1c3,#4f46e5);color:#f9fafb;border-color:rgba(15,23,42,0.08);box-shadow:0 0 0 1px rgba(59,130,246,0.4),0 10px 0 rgba(15,23,42,0.85)}
.btn-secondary{background:var(--color-surface-soft);color:var(--color-text);border-color:rgba(148,163,184,0.6);box-shadow:var(--shadow-soft-pixel)}
.btn-ghost{background:transparent;color:var(--color-accent-blue);border-color:transparent;box-shadow:none}
.btn-google-play{background:linear-gradient(135deg,#34d399,#22c55e);color:#0f172a;border-color:rgba(34,197,94,0.6);box-shadow:0 0 0 1px rgba(16,185,129,0.5),0 10px 0 rgba(22,101,52,0.9)}
.btn:hover{transform:translateY(-1px)}
.btn-primary:hover{box-shadow:0 0 0 1px rgba(59,130,246,0.6),0 11px 0 rgba(15,23,42,0.9);filter:brightness(1.05)}
.btn-secondary:hover{background:#e0f2fe;box-shadow:0 0 0 1px rgba(148,163,184,0.6),0 6px 0 rgba(148,163,184,0.6)}
.btn-ghost:hover{background:rgba(59,130,246,0.06);box-shadow:0 0 0 1px rgba(59,130,246,0.25)}
.btn-google-play:hover{filter:brightness(1.04);box-shadow:0 0 0 1px rgba(16,185,129,0.7),0 11px 0 rgba(22,101,52,1)}
.btn:active{transform:translateY(1px);box-shadow:0 4px 0 rgba(15,23,42,0.6)}
.btn:disabled,.btn[aria-disabled="true"]{opacity:0.55;cursor:not-allowed;transform:none;box-shadow:none}
input[type="text"],input[type="email"],input[type="password"],input[type="number"],input[type="search"],select,textarea{width:100%;padding:0.65rem 0.8rem;border-radius:var(--radius-md);border:1px solid var(--color-border);background:rgba(255,255,255,0.9);color:var(--color-text);font-size:var(--text-sm);box-shadow:0 1px 0 rgba(148,163,184,0.25);transition:border-color var(--transition-base),box-shadow var(--transition-base),background-color var(--transition-base),transform var(--transition-fast)}
input::placeholder,textarea::placeholder{color:var(--gray-400)}
input:focus,textarea:focus,select:focus{border-color:var(--color-accent-blue);box-shadow:0 0 0 1px rgba(59,130,246,0.4),0 0 0 4px rgba(191,219,254,0.8);outline:none;background:#ffffff}
input:disabled,textarea:disabled,select:disabled{background:var(--gray-100);cursor:not-allowed;color:var(--gray-500)}
label{display:inline-block;margin-bottom:var(--space-1);font-size:var(--text-sm);color:var(--color-text)}
.form-field{margin-bottom:var(--space-4)}
.badge-pill{display:inline-flex;align-items:center;gap:var(--space-1);padding:0.25rem 0.6rem;border-radius:var(--radius-pill);font-size:var(--text-xs);letter-spacing:0.04em;text-transform:uppercase;background:rgba(59,130,246,0.08);color:var(--color-accent-blue)}
.pixel-border{position:relative}
.pixel-border::before{content:"";position:absolute;inset:0;border-radius:inherit;border:2px solid rgba(15,23,42,0.9);clip-path:polygon(0 4px,4px 4px,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 4px) calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 4px),0 calc(100% - 4px))}
.hero-card-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:var(--space-6);align-items:center}
@media (max-width:900px){.hero-card-grid{grid-template-columns:minmax(0,1fr);gap:var(--space-4)}}
.game-card-stack{position:relative;isolation:isolate}
.game-card{width:180px;max-width:52vw;aspect-ratio:3/4;border-radius:18px;background:var(--gradient-card);box-shadow:0 12px 35px rgba(15,23,42,0.25);border:2px solid rgba(15,23,42,0.8);position:absolute;top:0;left:0;transform-origin:center}
.game-card:nth-child(1){transform:translateX(-45%) rotate(-10deg)}
.game-card:nth-child(2){transform:translateX(0) rotate(0deg);z-index:2}
.game-card:nth-child(3){transform:translateX(45%) rotate(10deg)}
@media (max-width:600px){.game-card{width:140px;border-radius:14px}.game-card:nth-child(1){transform:translateX(-35%) rotate(-8deg)}.game-card:nth-child(3){transform:translateX(35%) rotate(8deg)}}
.hero-gradient{background:radial-gradient(circle at top left,#ccfbf1 0,#e0f2fe 40%,#f9fafb 100%)}
.section{padding-block:var(--space-8)}
.section-light{background:transparent}
.section-surface{background:rgba(255,255,255,0.9)}
.section-soft{background:var(--color-surface-soft)}
.chip{display:inline-flex;align-items:center;gap:var(--space-1);padding:0.35rem 0.7rem;border-radius:var(--radius-pill);background:rgba(15,23,42,0.04);font-size:var(--text-xs);color:var(--gray-600)}
.tag-pill{padding:0.18rem 0.55rem;border-radius:999px;font-size:0.68rem;text-transform:uppercase;letter-spacing:0.08em;background:rgba(15,23,42,0.9);color:#f9fafb}
.text-muted{color:var(--color-text-muted)}
.text-center{text-align:center}
.mt-4{margin-top:var(--space-4)}.mt-6{margin-top:var(--space-6)}.mb-4{margin-bottom:var(--space-4)}.mb-6{margin-bottom:var(--space-6)}.py-6{padding-block:var(--space-6)}.px-4{padding-inline:var(--space-4)}
.sticky-cta-bar{position:sticky;bottom:0;left:0;right:0;z-index:30;background:rgba(15,23,42,0.9);backdrop-filter:blur(16px);padding:0.5rem 1rem;box-shadow:0 -10px 30px rgba(15,23,42,0.5)}
.sticky-cta-bar-inner{max-width:1120px;margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);color:#e5e7eb;font-size:var(--text-sm)}
@media (max-width:640px){.sticky-cta-bar-inner{flex-direction:column;align-items:stretch;text-align:center}}
.focus-visible-only:focus{outline:none}.focus-visible-only:focus-visible{outline:2px solid var(--color-accent-blue);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.001ms !important;animation-iteration-count:1 !important;transition-duration:0.001ms !important;scroll-behavior:auto !important}}
.focus-ring-primary:focus-visible{outline:2px solid var(--color-accent-blue);outline-offset:3px}
.badge-status{display:inline-flex;align-items:center;gap:0.25rem;padding:0.2rem 0.5rem;border-radius:999px;font-size:var(--text-xs);background:rgba(34,197,94,0.1);color:var(--color-success)}
.badge-status::before{content:"";width:6px;height:6px;border-radius:999px;background:var(--color-success)}
.stat-card{background:rgba(15,23,42,0.95);color:#e5e7eb;border-radius:var(--radius-lg);padding:var(--space-4);box-shadow:0 18px 45px rgba(15,23,42,0.8);border:1px solid rgba(148,163,184,0.5)}
.stat-value{font-family:var(--font-mono);font-size:1.4rem;letter-spacing:0.06em}
.stat-label{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:0.14em;color:var(--gray-400)}
.footer{background:#020617;color:var(--gray-300);padding-block:var(--space-6);font-size:var(--text-sm)}
.footer a{color:var(--gray-200)}
.footer a:hover{color:#ffffff}
.footer-heading{font-family:var(--font-display);font-size:0.85rem;text-transform:uppercase;letter-spacing:0.18em;margin-bottom:var(--space-3);color:#e5e7eb}
.footer-col{margin-bottom:var(--space-4)}
@media (min-width:768px){.footer-cols{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--space-6)}}