:root {
    --bg: #090b14;
    --surface: #121624;
    --surface-raised: #181d2f;
    --line: rgba(148, 163, 184, .18);
    --line-strong: rgba(34, 211, 238, .42);
    --cyan: #22d3ee;
    --violet: #a78bfa;
    --green: #34d399;
    --text: #f1f5f9;
    --muted: #a5b1c5;
    --heading: 'Chakra Petch', sans-serif;
    --body: 'Montserrat', sans-serif;
    --radius: 18px;
    --shadow: 0 18px 45px rgba(0, 0, 0, .24);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; background: var(--bg); }
body { color: var(--text); background: radial-gradient(900px 500px at 50% -100px, #1d2152 0%, var(--bg) 66%); font: 15px/1.7 var(--body); overflow-x: hidden; }
body::before { content: ''; position: fixed; inset: 0; pointer-events: none; opacity: .34; background-image: linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px); background-size: 44px 44px; mask-image: linear-gradient(to bottom, #000, transparent 85%); }
a { color: inherit; }
h1, h2, h3, h4, .brand-name { font-family: var(--heading); line-height: 1.14; letter-spacing: .025em; }
.container { width: min(1160px, calc(100% - 40px)); margin: auto; }
.gradient-text { color: var(--cyan); background: linear-gradient(100deg, var(--cyan), var(--violet)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

#cyberParticleCanvas { position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: .38; }
.navbar { position: sticky; top: 0; z-index: 20; border-bottom: 1px solid var(--line); background: rgba(9,11,20,.86); backdrop-filter: blur(18px); }
.nav-container { width: min(1280px, calc(100% - 40px)); min-height: 76px; margin: auto; display: flex; justify-content: space-between; align-items: center; gap: 28px; }
.brand-logo { display: inline-flex; align-items: center; gap: 11px; text-decoration: none; flex-shrink: 0; }
.logo-icon, .app-icon { display: grid; place-items: center; background: linear-gradient(135deg, var(--cyan), #6366f1); color: #06111d; box-shadow: 0 8px 22px rgba(34,211,238,.22); }
.logo-icon { width: 40px; height: 40px; border-radius: 12px; font-size: 19px; }
.logo-text { display: flex; flex-direction: column; }
.brand-name { font-size: 23px; font-weight: 700; color: #fff; }
.highlight { color: var(--cyan); }
.brand-tag { font: 700 10px/1.2 var(--heading); letter-spacing: .16em; color: var(--muted); }
.nav-links { display: flex; align-items: center; gap: 23px; }
.nav-links a { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font: 600 13px var(--heading); text-decoration: none; transition: color .2s ease; }
.nav-links a:hover, .nav-links .nav-highlight { color: var(--cyan); }
.nav-download-btn { padding: 10px 16px; border: 1px solid var(--cyan); border-radius: 10px; color: var(--text) !important; }
.mobile-toggle { display: none; border: 1px solid var(--line); border-radius: 9px; background: transparent; color: var(--text); padding: 8px 10px; font-size: 18px; }

.hero-section { position: relative; padding: 110px 20px 82px; text-align: center; overflow: hidden; }
.hero-bg-glow { position: absolute; width: 800px; height: 500px; top: -220px; left: 50%; transform: translateX(-50%); background: radial-gradient(ellipse, rgba(34,211,238,.22), rgba(167,139,250,.11) 45%, transparent 70%); pointer-events: none; }
.hero-container { position: relative; max-width: 900px; margin: auto; }
.hero-badge, .sub-heading { display: inline-flex; align-items: center; gap: 8px; color: var(--cyan); font: 700 12px var(--heading); letter-spacing: .1em; text-transform: uppercase; }
.hero-badge { padding: 8px 13px; border: 1px solid rgba(34,211,238,.3); border-radius: 100px; background: rgba(34,211,238,.06); margin-bottom: 22px; }
.pulse-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 5px rgba(52,211,153,.12); }
.hero-title { font-size: clamp(38px, 5.4vw, 68px); font-weight: 700; letter-spacing: .015em; }
.hero-subtitle { max-width: 720px; margin: 20px auto 32px; color: var(--muted); font-size: 16px; }
.hero-actions { display: flex; justify-content: center; align-items: stretch; flex-wrap: wrap; gap: 12px; }
.btn-primary-download, .btn-secondary { display: inline-flex; align-items: center; justify-content: center; gap: 13px; border-radius: 12px; padding: 14px 21px; text-decoration: none; transition: transform .2s ease, border-color .2s ease, background .2s ease; }
.btn-primary-download { color: #06111d; background: linear-gradient(105deg, var(--cyan), #71e2ee); font-weight: 700; box-shadow: 0 12px 28px rgba(34,211,238,.2); }
.btn-primary-download, .btn-main-download-link { position: relative; isolation: isolate; overflow: hidden; }
.btn-primary-download::before, .btn-main-download-link::before { content: ''; position: absolute; z-index: -1; top: -110%; left: -35%; width: 30%; height: 320%; background: rgba(255,255,255,.38); transform: rotate(24deg) translateX(-260%); animation: skillShine 4.8s ease-in-out infinite; }
.btn-primary-download:hover, .btn-secondary:hover, .btn-partner:hover, .btn-main-download-link:hover { transform: translateY(-2px); }
.btn-primary-download > i { font-size: 22px; }
.btn-text { display: flex; flex-direction: column; align-items: flex-start; text-align: left; }
.btn-main { font: 700 16px var(--heading); }
.btn-sub { font-size: 10px; opacity: .72; }
.btn-secondary { border: 1px solid var(--line-strong); color: var(--text); background: rgba(18,22,36,.72); font: 600 13px var(--heading); }
.hero-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 55px auto 0; text-align: left; }
.stat-card { display: flex; gap: 13px; align-items: center; padding: 16px; border: 1px solid var(--line); background: rgba(18,22,36,.72); border-radius: 14px; }
.stat-icon { color: var(--cyan); font-size: 22px; }.stat-info { display: flex; flex-direction: column; }.stat-num { font: 700 17px var(--heading); }.stat-label { color: var(--muted); font-size: 11px; }

section:not(.hero-section) { padding: 86px 0; }
.section-header { max-width: 720px; margin: 0 auto 38px; text-align: center; }
.section-title { margin: 8px 0 11px; font-size: clamp(29px, 3.6vw, 44px); font-weight: 700; }.section-desc { color: var(--muted); }
.update-section { border-block: 1px solid var(--line); background: rgba(255,255,255,.012); }
.update-layout { display: grid; grid-template-columns: 1.03fr .97fr; gap: 25px; align-items: stretch; }
.update-gallery { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 190px 190px; gap: 12px; }.gallery-item { position: relative; overflow: hidden; border: 1px solid var(--line); border-radius: 15px; background: var(--surface); }.gallery-item-large { grid-row: span 2; }.gallery-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }.gallery-item:hover img { transform: scale(1.05); }.gallery-item figcaption { position: absolute; inset: auto 0 0; padding: 28px 15px 12px; background: linear-gradient(transparent, rgba(5,7,13,.92)); font: 700 12px var(--heading); text-transform: uppercase; letter-spacing: .06em; }
.release-notes { padding: 6px 0; }.release-note { display: flex; gap: 15px; padding: 15px 0; border-bottom: 1px solid var(--line); }.release-note > i { display: grid; place-items: center; flex: 0 0 40px; height: 40px; color: var(--skill-color, var(--cyan)); border: 1px solid color-mix(in srgb, var(--skill-color, var(--cyan)) 38%, transparent); border-radius: 11px; background: color-mix(in srgb, var(--skill-color, var(--cyan)) 10%, transparent); box-shadow: 0 0 18px color-mix(in srgb, var(--skill-color, var(--cyan)) 16%, transparent); animation: skillFloat 3.6s ease-in-out infinite; }.release-note:nth-child(1) { --skill-color: #22d3ee; }.release-note:nth-child(2) { --skill-color: #f472b6; }.release-note:nth-child(3) { --skill-color: #a78bfa; }.release-note:nth-child(4) { --skill-color: #fbbf24; }.release-note:nth-child(2) > i { animation-delay: -.9s; }.release-note:nth-child(3) > i { animation-delay: -1.8s; }.release-note:nth-child(4) > i { animation-delay: -2.7s; }.release-note h3 { font-size: 17px; }.release-note p { margin-top: 3px; color: var(--muted); font-size: 13px; line-height: 1.55; }.text-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 20px; color: var(--cyan); font: 700 13px var(--heading); text-decoration: none; }

.app-feat-grid, .social-grid, .steps-grid { display: grid; gap: 16px; }.app-feat-grid { grid-template-columns: repeat(3, 1fr); }.app-feat-card, .social-card, .step-card, .faq-item, .download-card, .partner-card { border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(145deg, rgba(24,29,47,.86), rgba(14,17,29,.86)); box-shadow: var(--shadow); }
.app-feat-card { display: flex; gap: 16px; padding: 24px; transition: transform .2s ease, border-color .2s ease; }.app-feat-card:hover, .social-card:hover, .step-card:hover { border-color: var(--line-strong); transform: translateY(-3px); }.highlight-card { border-color: var(--line-strong); }.app-feat-icon { display: grid; place-items: center; width: 51px; height: 51px; flex: 0 0 51px; border-radius: 13px; background: rgba(34,211,238,.11); color: var(--cyan); font-size: 21px; }.badge-inside-app { display: inline-block; margin-bottom: 7px; color: var(--green); font: 700 10px var(--heading); letter-spacing: .08em; }.app-feat-content h3 { font-size: 18px; }.app-feat-content p { margin-top: 8px; color: var(--muted); font-size: 13px; }
.app-feat-card:nth-child(2) .app-feat-icon { color: #f472b6; background: rgba(244,114,182,.1); }.app-feat-card:nth-child(3) .app-feat-icon { color: #fbbf24; background: rgba(251,191,36,.1); }

.partner-section { padding-top: 28px !important; }.partner-card { padding: 35px; position: relative; overflow: hidden; }.partner-badge { position: absolute; top: 18px; right: 20px; color: var(--cyan); font: 700 10px var(--heading); letter-spacing: .1em; }.partner-content { display: flex; align-items: center; gap: 28px; }.partner-logo-wrapper { display: grid; place-items: center; flex: 0 0 175px; min-height: 110px; padding: 18px; border-radius: 14px; background: #fff; }.partner-logo { max-width: 135px; max-height: 65px; object-fit: contain; }.partner-details { flex: 1; }.partner-title { font-size: 28px; }.partner-desc { margin: 8px 0 15px; color: var(--muted); font-size: 14px; }.partner-features { display: flex; gap: 14px; flex-wrap: wrap; color: var(--green); font-size: 12px; font-weight: 600; }.btn-partner { display: inline-flex; align-items: center; gap: 10px; padding: 13px 17px; border-radius: 11px; background: var(--cyan); color: #06111d; text-decoration: none; font: 700 13px var(--heading); }

.social-grid { grid-template-columns: repeat(2, 1fr); }.social-card { display: flex; align-items: center; gap: 14px; padding: 18px; transition: transform .2s ease, border-color .2s ease; }.social-icon { display: grid; place-items: center; width: 44px; height: 44px; flex: 0 0 44px; border-radius: 12px; background: #26334f; font-size: 20px; }.yt-card .social-icon { color: #ff4d4d; }.fb-card .social-icon { color: #60a5fa; }.tt-card .social-icon { color: var(--cyan); }.zalo-card .social-icon { color: #60a5fa; }.phone-card .social-icon { color: var(--green); }.mail-card .social-icon { color: #fb923c; }.bank-card .social-icon { color: var(--violet); }.social-info { flex: 1; min-width: 0; }.social-info h3 { font-size: 17px; }.social-handle { color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }.btn-open-link { display: inline-grid; place-items: center; min-width: 40px; height: 37px; padding: 0 10px; border: 1px solid var(--line); border-radius: 9px; background: transparent; color: var(--text); font: 700 11px var(--heading); cursor: pointer; text-decoration: none; }.btn-open-link span { display: none; }

.download-section { padding-block: 46px !important; }.download-card { padding: 34px; border-color: var(--line-strong); }.download-header { display: flex; align-items: center; gap: 18px; margin-bottom: 23px; }.app-icon { width: 62px; height: 62px; flex: 0 0 62px; border-radius: 15px; font-size: 28px; }.app-title-info h2 { font-size: 25px; }.app-meta { margin-top: 5px; color: var(--muted); font-size: 12px; }.download-features-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px 18px; margin-bottom: 24px; padding: 18px; border-radius: 12px; background: rgba(0,0,0,.16); }.feat-item { display: flex; gap: 9px; align-items: flex-start; color: var(--muted); font-size: 13px; }.feat-item i { color: var(--green); margin-top: 4px; }.download-box-action { display: flex; justify-content: center; }.btn-main-download-link { width: min(620px, 100%); padding: 16px; border-radius: 12px; background: linear-gradient(105deg, var(--cyan), #67ddea); color: #06111d; text-align: center; text-decoration: none; transition: transform .2s ease; }.download-btn-content { display: flex; align-items: center; justify-content: center; gap: 12px; }.download-icon-anim { font-size: 24px; }.d-title { display: block; font: 700 17px var(--heading); }.d-sub { display: block; font-size: 11px; opacity: .68; }

.steps-grid { grid-template-columns: repeat(4, 1fr); }.step-card { padding: 24px; }.step-num { color: var(--cyan); font: 700 30px var(--heading); }.step-card h3 { margin: 12px 0 7px; font-size: 17px; }.step-card p { color: var(--muted); font-size: 13px; }.faq-accordion { max-width: 850px; margin: auto; display: grid; gap: 11px; }.faq-question { width: 100%; padding: 19px 21px; display: flex; justify-content: space-between; align-items: center; gap: 18px; border: 0; background: transparent; color: var(--text); font: 600 16px var(--heading); text-align: left; cursor: pointer; }.faq-question i { transition: transform .2s ease; }.faq-answer { display: none; padding: 0 21px 20px; color: var(--muted); font-size: 13px; }.faq-item.active { border-color: var(--line-strong); }.faq-item.active .faq-answer { display: block; }.faq-item.active .faq-question i { transform: rotate(180deg); color: var(--cyan); }

.modal-overlay { position: fixed; inset: 0; z-index: 50; display: none; place-items: center; padding: 20px; background: rgba(3,5,10,.75); backdrop-filter: blur(8px); }.modal-overlay.active { display: grid; }.modal-card { position: relative; width: min(520px, 100%); padding: 32px; border: 1px solid var(--line-strong); border-radius: var(--radius); background: var(--surface-raised); }.modal-close { position: absolute; top: 12px; right: 14px; background: none; border: 0; color: var(--muted); font-size: 20px; cursor: pointer; }.modal-header { text-align: center; margin-bottom: 22px; }.bank-modal-icon { color: var(--cyan); font-size: 34px; margin-bottom: 8px; }.bank-details-body { display: grid; gap: 12px; }.bank-row { display: flex; flex-wrap: wrap; gap: 8px; justify-content: space-between; align-items: center; padding-bottom: 11px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 13px; }.bank-row strong { color: var(--text); }.btn-copy-stk { padding: 7px 10px; border: 0; border-radius: 8px; background: var(--cyan); color: #06111d; font: 700 11px var(--heading); cursor: pointer; }
.footer { padding: 55px 0 25px; border-top: 1px solid var(--line); background: #070910; }.footer-content { display: grid; grid-template-columns: 1.6fr 1fr 1.2fr; gap: 45px; margin-bottom: 36px; }.footer-brand p, .footer-partner-brief p { margin-top: 12px; color: var(--muted); font-size: 12px; }.footer-links { display: flex; flex-direction: column; gap: 8px; }.footer h4 { margin-bottom: 6px; font-size: 15px; }.footer-links a, .footer-genplay-link { color: var(--muted); text-decoration: none; font-size: 12px; }.footer-genplay-link { color: var(--cyan); font-weight: 600; }.footer-bottom { padding-top: 20px; border-top: 1px solid var(--line); color: var(--muted); text-align: center; font-size: 11px; }.music-float-btn { position: fixed; bottom: 20px; left: 20px; z-index: 21; display: flex; gap: 8px; align-items: center; padding: 9px 12px; border: 1px solid var(--line); border-radius: 100px; background: rgba(18,22,36,.9); color: var(--text); cursor: pointer; font: 600 11px var(--heading); }.disc-icon { color: var(--cyan); }.music-float-btn:not(.paused) .disc-icon { animation: spin 2s linear infinite; }.toast-notification { position: fixed; z-index: 60; right: 20px; bottom: 20px; display: flex; gap: 9px; align-items: center; padding: 13px 16px; border: 1px solid var(--line-strong); border-radius: 11px; background: var(--surface-raised); transform: translateY(90px); opacity: 0; transition: .25s; font-size: 12px; }.toast-notification.show { transform: translateY(0); opacity: 1; }.toast-notification i { color: var(--green); } @keyframes spin { to { transform: rotate(360deg); } }

[data-cooldown] { -webkit-tap-highlight-color: transparent; }
[data-cooldown].is-locked { pointer-events: none; cursor: wait; opacity: .68; filter: saturate(.55); }
[data-cooldown].is-locked::after { content: attr(data-cooldown-label); position: absolute; inset: 0; z-index: 5; display: grid; place-items: center; border-radius: inherit; background: rgba(7,9,16,.88); color: #fff; font: 700 12px var(--heading); letter-spacing: .04em; }
.btn-open-link.is-locked::after, .btn-copy-stk.is-locked::after, .music-float-btn.is-locked::after { font-size: 10px; }
.btn-open-link, .btn-copy-stk, .music-float-btn { position: relative; overflow: hidden; }
@keyframes skillFloat { 0%, 100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-3px) scale(1.04); } }
@keyframes skillShine { 0%, 68% { transform: rotate(24deg) translateX(-260%); } 86%, 100% { transform: rotate(24deg) translateX(620%); } }

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }

@media (max-width: 980px) { .nav-links { gap: 13px; }.nav-links a { font-size: 11px; }.update-layout, .partner-content { grid-template-columns: 1fr; flex-direction: column; }.partner-content { align-items: flex-start; }.app-feat-grid { grid-template-columns: 1fr; }.steps-grid { grid-template-columns: repeat(2, 1fr); }.footer-content { grid-template-columns: 1fr 1fr; }.footer-brand { grid-column: span 2; } }
@media (max-width: 720px) { .container, .nav-container { width: min(100% - 28px, 1160px); }.nav-container { min-height: 65px; }.nav-links { position: absolute; top: 65px; left: 0; right: 0; display: none; flex-direction: column; align-items: stretch; gap: 0; padding: 8px 14px 16px; border-bottom: 1px solid var(--line); background: var(--bg); }.nav-links.is-open { display: flex; }.nav-links a { padding: 11px 5px; font-size: 13px; }.nav-download-btn { justify-content: center; margin-top: 6px; }.mobile-toggle { display: block; }.hero-section { padding: 76px 14px 58px; }.hero-badge { font-size: 10px; text-align: left; }.hero-subtitle { font-size: 14px; }.btn-primary-download, .btn-secondary { width: 100%; }.hero-stats, .social-grid, .download-features-list { grid-template-columns: 1fr; }.update-gallery { grid-template-rows: 150px 150px; }.release-note { padding-block: 13px; } section:not(.hero-section) { padding: 60px 0; }.partner-card, .download-card { padding: 22px; }.partner-badge { position: static; display: block; margin-bottom: 13px; }.partner-content { gap: 18px; }.partner-logo-wrapper { flex-basis: auto; width: 150px; min-height: 86px; }.partner-title { font-size: 24px; }.download-header { align-items: flex-start; }.app-title-info h2 { font-size: 20px; }.app-meta { line-height: 1.8; }.steps-grid { grid-template-columns: 1fr; }.footer-content { grid-template-columns: 1fr; gap: 28px; }.footer-brand { grid-column: auto; }.music-float-btn span { display: none; }.music-float-btn { left: 14px; bottom: 14px; padding: 10px; }.toast-notification { right: 14px; bottom: 14px; } }

/* Neon interface layer */
:root { --pink: #ff3cac; --electric: #7c3cff; --deep: #050611; }
body { background: radial-gradient(circle at 50% -10%, rgba(39, 17, 94, .9), transparent 38%), linear-gradient(180deg, #070916, #04050c 72%); }
.neon-ambient { position: fixed; inset: 0; z-index: -2; overflow: hidden; pointer-events: none; }
.aurora { position: absolute; width: 48vw; aspect-ratio: 1; border-radius: 50%; filter: blur(95px); opacity: .14; animation: auroraDrift 14s ease-in-out infinite alternate; }
.aurora-one { left: -16vw; top: 8vh; background: var(--cyan); }
.aurora-two { right: -18vw; top: 38vh; background: var(--pink); animation-delay: -7s; }
.scanline-layer { position: absolute; inset: 0; opacity: .14; background: repeating-linear-gradient(180deg, transparent 0 4px, rgba(99, 244, 255, .08) 5px); mask-image: linear-gradient(to bottom, #000, transparent 92%); }
.navbar { box-shadow: 0 8px 35px rgba(0,0,0,.35), 0 1px 0 rgba(34,211,238,.08); }
.nav-download-btn { box-shadow: inset 0 0 18px rgba(34,211,238,.08), 0 0 20px rgba(34,211,238,.08); }
.hero-section::before { content: ''; position: absolute; inset: 0; opacity: .28; background: linear-gradient(115deg, transparent 20%, rgba(34,211,238,.08) 49.8%, transparent 50.2%); transform: translateX(-55%); animation: heroSweep 8s ease-in-out infinite; pointer-events: none; }
.hero-title { text-shadow: 0 0 34px rgba(124,60,255,.28); }
.gradient-text { background-image: linear-gradient(100deg, #5cf4ff 10%, #a78bfa 48%, #ff58bd 88%); filter: drop-shadow(0 0 12px rgba(34,211,238,.2)); }
.hero-badge { box-shadow: inset 0 0 22px rgba(34,211,238,.07), 0 0 28px rgba(34,211,238,.08); }
.pulse-dot { animation: neonPulse 1.7s ease-out infinite; }
.btn-primary-download, .btn-main-download-link { border: 1px solid rgba(255,255,255,.55); box-shadow: 0 0 0 1px rgba(34,211,238,.22), 0 0 34px rgba(34,211,238,.28), 0 16px 42px rgba(0,0,0,.36); }
.btn-primary-download:hover, .btn-main-download-link:hover { box-shadow: 0 0 0 1px rgba(255,60,172,.32), 0 0 44px rgba(34,211,238,.42), 0 18px 48px rgba(0,0,0,.42); }
.hero-console { max-width: 760px; margin: 34px auto 0; overflow: hidden; border: 1px solid rgba(34,211,238,.3); border-radius: 15px; background: linear-gradient(145deg, rgba(11,16,33,.9), rgba(13,8,28,.82)); box-shadow: inset 0 0 34px rgba(34,211,238,.035), 0 22px 55px rgba(0,0,0,.3); text-align: left; }
.console-topbar { display: flex; align-items: center; gap: 7px; padding: 10px 13px; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.025); }
.console-topbar span { width: 8px; height: 8px; border-radius: 50%; background: #ff5f57; }.console-topbar span:nth-child(2) { background: #febc2e; }.console-topbar span:nth-child(3) { background: #28c840; }
.console-topbar strong { margin-left: 7px; color: #7f91aa; font: 600 9px var(--heading); letter-spacing: .14em; }
.console-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.console-grid > div { padding: 15px 17px; border-right: 1px solid var(--line); }.console-grid > div:last-child { border-right: 0; }
.console-grid span { display: block; color: #68778f; font: 600 9px var(--heading); letter-spacing: .13em; }.console-grid strong { display: block; margin-top: 5px; color: #e9fbff; font: 700 13px var(--heading); }
.status-online { color: var(--green) !important; }.status-online i { display: inline-block; width: 6px; height: 6px; margin-right: 5px; border-radius: 50%; background: var(--green); box-shadow: 0 0 10px var(--green); }
.app-feat-card, .social-card, .step-card, .faq-item, .partner-card, .download-card, .stat-card { position: relative; overflow: hidden; backdrop-filter: blur(16px); }
.app-feat-card::before, .social-card::before, .step-card::before, .download-card::before { content: ''; position: absolute; inset: 0; border-radius: inherit; background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 50%), rgba(34,211,238,.12), transparent 42%); opacity: 0; transition: opacity .25s ease; pointer-events: none; }
.app-feat-card:hover::before, .social-card:hover::before, .step-card:hover::before, .download-card:hover::before { opacity: 1; }
.download-card { border-color: rgba(34,211,238,.48); box-shadow: 0 0 0 1px rgba(124,60,255,.1), 0 0 65px rgba(34,211,238,.1), var(--shadow); }
.download-card::after { content: 'OFFICIAL RELEASE'; position: absolute; top: 16px; right: -37px; width: 150px; padding: 5px 0; transform: rotate(35deg); background: linear-gradient(90deg, var(--electric), var(--pink)); color: #fff; font: 700 8px var(--heading); letter-spacing: .12em; text-align: center; }
.reveal-ready { opacity: 0; transform: translateY(24px); transition: opacity .65s ease, transform .65s cubic-bezier(.2,.7,.2,1); }.reveal-ready.is-visible { opacity: 1; transform: none; }
@keyframes auroraDrift { to { transform: translate(12vw, 12vh) scale(1.18); } }
@keyframes heroSweep { 0%, 20% { transform: translateX(-70%); } 70%, 100% { transform: translateX(70%); } }
@keyframes neonPulse { 0% { box-shadow: 0 0 0 0 rgba(52,211,153,.5); } 75%,100% { box-shadow: 0 0 0 10px rgba(52,211,153,0); } }
@media (max-width: 720px) { .console-grid { grid-template-columns: 1fr 1fr; }.console-grid > div { border-bottom: 1px solid var(--line); }.download-card::after { display: none; }.aurora { width: 85vw; } }