/* Visual measurements from Figma P-A 1:1266 and M-A 1:26041.
   Business behaviour remains in app.js / interactions.js. */
:root{--bg:#0a0c1a;--lime:#e0f728;--pink:#ff55ad;--pink-soft:#ff7abf;--font:"Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;--u:min(1px,calc(100vw / 1920))}
body{background:var(--bg);font-family:var(--font)}
.hero h1{font-weight:900;letter-spacing:.024em}
.hero h1 strong{font-weight:900}
.hero h1 strong .desktop-hidden{color:inherit}
html[lang="en"] .hero h1 strong::before{content:" "}
.hero-description mark{padding:0;color:var(--lime);background:none;font-weight:700}
.section-heading em{color:var(--pink-soft);font-style:normal}
.library-heading h2 .numeric{font-family:"Red Hat Display",var(--font)}
.feature-card{border:0;background:linear-gradient(158.1986deg,#ffffff1a 0%,#ffffff0f 12%,#ffffff05 50%,#ffffff0a 83%,#ffffff1a 100%)}
.feature-icon{background:none;border-radius:0}
.feature-copy h3{font-weight:700}
.feature-copy p{color:var(--lime);font-weight:400}
.game-library{background:#0a0c1a url("../assets/figma/library-background.png") center top/100% 100% no-repeat}
.hot-games{background:#0a0c1a url("../assets/figma/hot-background.png") center/100% 100% no-repeat}
.game-banner{box-shadow:none;aspect-ratio:16 / 9}
.side-banner{transform:none;filter:none;opacity:.4}
.banner-caption{position:absolute;bottom:0;left:0;width:100%;display:flex;align-items:center;background:url("../assets/figma/banner-caption-background.png") center/100% 100%;color:white;text-align:left;pointer-events:none}
.round-icon{background:#e0f7281f}
.avatar-row img{border:1px solid #ffffffcc;box-shadow:none;object-fit:cover}
.carousel-controls{position:relative}
.carousel .slide-counter{display:none}
.footer-group{position:relative;overflow:hidden;background:#0a0c1a;isolation:isolate}
.community,.site-footer{position:relative;background:transparent;z-index:0}
.age-notice strong{display:none}
.social-link{background:radial-gradient(ellipse at 100% 50%,#272835,#1c1d25 50%,#121316);font-weight:500}
@media(min-width:768px){
 .footer-group::before{content:"";position:absolute;pointer-events:none;z-index:-1;left:calc(-490 * var(--u));bottom:calc(-470 * var(--u));width:calc(1127 * var(--u));height:calc(1118 * var(--u));background:url("../assets/figma/footer-glow.svg") center/100% 100% no-repeat}
 .site-header{height:max(64px,calc(86 * var(--u)));position:fixed;background:#0a0c1a26;backdrop-filter:blur(6px)}
 .header-inner{width:calc(100% - 64px);max-width:none}
 .brand{width:120px;height:44px}.brand img{width:120px}
 .hero{height:calc(900 * var(--u));min-height:540px;background-position:center top;background-size:cover}
 .hero-shade{background:linear-gradient(90deg,#0009,transparent 38.4%),linear-gradient(180deg,transparent 79.55%,#0a0c1a)}
 .hero-inner{width:calc(1680 * var(--u));max-width:calc(100% - 48px)}
 .hero-copy{top:calc(269.5 * var(--u));width:calc(637 * var(--u));text-shadow:none}
 .hero h1{display:block;margin-bottom:calc(20 * var(--u));font-size:calc(64 * var(--u));line-height:1.2;letter-spacing:calc(7 * var(--u));white-space:nowrap}
 .hero h1 strong{letter-spacing:calc(7 * var(--u))}
 html[lang="zh-CN"] .hero h1 strong .desktop-hidden,html[lang="zh-TW"] .hero h1 strong .desktop-hidden{display:none}
 .hero-description{font-size:calc(34 * var(--u));line-height:calc(48 * var(--u));font-weight:500;letter-spacing:0}
 .hero-desktop-actions{top:calc(482.5 * var(--u));width:calc(440 * var(--u));gap:12px}
 .hero-desktop-actions .qr-card{grid-template-columns:calc(160 * var(--u)) 1fr;gap:calc(16 * var(--u));min-height:calc(200 * var(--u));padding:calc(20 * var(--u));border:0;border-radius:calc(16 * var(--u));background:#04030d33;box-shadow:inset 1.2px 1.1px .8px #f8faf080;backdrop-filter:blur(12.7px)}
 .qr-box{padding:calc(11.1 * var(--u));border-radius:calc(8.9 * var(--u))}
 .qr-copy strong{display:block;font-weight:700;font-size:calc(28 * var(--u));line-height:1.7}
 .desktop-web{min-height:36px;font-size:clamp(13px,calc(20 * var(--u)),20px);padding:6px 12px}
 .desktop-scroll{bottom:calc(72 * var(--u));flex-direction:row;gap:8px;font-size:calc(20 * var(--u));color:#9ca3af}
 .desktop-scroll img{width:calc(24 * var(--u));height:calc(24 * var(--u))}
 .hot-games{min-height:0;padding:calc(100 * var(--u)) 0 calc(115 * var(--u));}
 .hot-inner{width:100%;max-width:1920px}
 .section-heading{min-height:calc(70 * var(--u));font-size:calc(48 * var(--u));font-weight:700;line-height:1.04;letter-spacing:0;margin:0 0 calc(40 * var(--u));padding:calc(10 * var(--u)) 24px;text-align:center}
 .banner-stage{width:calc(1478 * var(--u));max-width:calc(100% - 32px);height:calc(540 * var(--u));margin:auto}
 .main-banner{width:calc(959 * var(--u));aspect-ratio:16 / 9;border-radius:calc(12.8 * var(--u))}
 .side-banner{width:calc(790 * var(--u));aspect-ratio:16 / 9;border-radius:calc(13.8 * var(--u))}
 .side-left{left:0}.side-right{right:0}
 .banner-caption{height:calc(65 * var(--u));padding:0 calc(24 * var(--u));font-size:calc(24 * var(--u));line-height:1.4;font-weight:700}
 .carousel-arrow{height:64px;width:36px;border-radius:8px;font-size:38px;opacity:0;transition:opacity .15s;}
 .carousel:hover .carousel-arrow,.carousel:focus-within .carousel-arrow{opacity:1}
 .carousel-arrow.previous{left:calc(50% - 570 * var(--u))}.carousel-arrow.next{right:calc(50% - 570 * var(--u))}
 .carousel-controls{gap:0;padding-top:calc(40 * var(--u))}
 .carousel-controls .pagination{gap:calc(16 * var(--u))}
 .carousel-controls .pagination button{width:calc(88 * var(--u));height:calc(88 * var(--u));border-radius:calc(16 * var(--u));overflow:hidden;border:1px solid transparent;background:none;opacity:.8}
 .carousel-controls .pagination button::before{display:none}
 .carousel-controls .pagination button img{display:block;width:100%;height:100%;object-fit:cover}
 .carousel-controls .pagination button.active{border-color:white;opacity:1}
 .game-library{padding:calc(40 * var(--u)) 0 calc(25 * var(--u));min-height:calc(705 * var(--u))}
 .round-icon{width:calc(80 * var(--u));height:calc(80 * var(--u));margin:0 auto calc(20 * var(--u));border-radius:calc(21.5 * var(--u))}
 .round-icon img{width:calc(43.077 * var(--u));height:calc(43.077 * var(--u))}
 .library-heading h2{font-size:calc(48 * var(--u));line-height:1.04;letter-spacing:calc(2 * var(--u));font-weight:700;margin:0 16px calc(13.3 * var(--u))}
 .library-heading p{font-size:calc(23.3 * var(--u));line-height:calc(36.6 * var(--u))}
 .avatar-wall{--avatar-size:calc(160 * var(--u));--avatar-gap:calc(40 * var(--u));margin-top:calc(40 * var(--u));gap:calc(20 * var(--u))}
 .avatar-row{padding-block:calc(10 * var(--u))}.avatar-row img{border-radius:calc(31.37 * var(--u))}
 .features{padding:calc(80 * var(--u)) 0 calc(60 * var(--u));background:var(--bg)}
 .feature-stack{gap:calc(80 * var(--u));width:calc(1440 * var(--u));max-width:calc(100% - 48px)}
 .feature-card{display:grid;grid-template-columns:calc(438 * var(--u)) calc(726 * var(--u));justify-content:space-between;gap:0;min-height:calc(576 * var(--u));padding:calc(58 * var(--u)) calc(48 * var(--u)) calc(58 * var(--u)) calc(64 * var(--u));border-radius:calc(60 * var(--u))}
 .feature-copy{padding:calc(20 * var(--u)) calc(20 * var(--u)) calc(60 * var(--u));min-width:0}
 .feature-icon{width:calc(48 * var(--u));height:calc(48 * var(--u));margin-bottom:calc(16 * var(--u))}
 .feature-icon img{width:100%;height:100%;object-fit:contain}
 .feature-copy h3{margin-bottom:calc(16 * var(--u));font-size:calc(48 * var(--u));line-height:1.2;letter-spacing:calc(2 * var(--u))}
 html[lang^="zh"] .feature-copy h3{white-space:nowrap}
 .feature-copy p{font-size:calc(24 * var(--u));line-height:1.5}
 .feature-card:nth-child(even){grid-template-columns:calc(726 * var(--u)) calc(517 * var(--u));padding-left:calc(48 * var(--u));padding-right:calc(64 * var(--u))}
 .feature-card:nth-child(even) .feature-copy{padding-left:calc(20 * var(--u));order:2}
 .feature-card:nth-child(even) .feature-art{order:1}
 .feature-card .feature-art{width:100%;margin:0;min-width:0;border-radius:calc(24 * var(--u))}
 .community{min-height:0;padding:calc(54 * var(--u)) 0 calc(48 * var(--u));border-top:1px solid #ffffff0d}
 .community-layout{width:calc(1600 * var(--u));display:grid;grid-template-columns:1fr auto;grid-template-rows:calc(66 * var(--u)) auto;gap:calc(24 * var(--u)) 30px;}
 .community-brand{width:calc(180 * var(--u));height:calc(66 * var(--u));grid-area:1 / 1}
 .community-brand img{width:calc(180 * var(--u))}
 .community-copy{grid-area:2 / 1}
 .community-copy h2{font-size:calc(24 * var(--u));line-height:1.5;margin-bottom:calc(10 * var(--u));font-weight:700}
 .community-copy p{font-size:calc(14 * var(--u));line-height:calc(26 * var(--u));color:#dadada}
 .social-links{grid-area:1 / 2 / 3 / 3;grid-template-columns:repeat(3,calc(180 * var(--u)));gap:calc(30.5 * var(--u));margin:0}
 .social-link{height:calc(74 * var(--u));border-radius:calc(18.309 * var(--u));gap:calc(12.206 * var(--u));font-size:calc(20 * var(--u));border:calc(1.23 * var(--u)) solid white}
 .social-link img{width:calc(34 * var(--u));height:calc(34 * var(--u))}
 .site-footer{min-height:0;border:0;padding:0 0 calc(53 * var(--u))}
 .footer-inner{width:calc(1600 * var(--u));border-top:1px solid #ffffff0d;padding-top:calc(48 * var(--u));gap:24px}
 .age-notice p,.copyright{font-size:calc(14 * var(--u));line-height:22px;color:#6b7280}
 html:not([lang^="zh"]) .hero h1{font-size:calc(56 * var(--u));letter-spacing:0;white-space:normal}
 html:not([lang^="zh"]) .hero-description{font-size:calc(28 * var(--u));line-height:1.45}
 html:not([lang^="zh"]) .hero-copy{top:calc(240 * var(--u))}
 html:not([lang^="zh"]) .feature-copy h3{font-size:calc(42 * var(--u));letter-spacing:0}
}
@media(min-width:768px) and (max-width:1100px){
 .hero-inner{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding-block:86px 70px}
 .hero-copy{position:static;flex:none}.hero-desktop-actions{position:static;flex:none;margin-top:20px}
 .hero-copy{top:150px;width:52%}.hero h1{font-size:34px;letter-spacing:1px}.hero h1 strong{letter-spacing:1px}
 .hero-description{font-size:19px;line-height:1.5}.hero-desktop-actions{top:295px;width:285px}
 .hero-desktop-actions .qr-card{grid-template-columns:94px 1fr;gap:12px;padding:14px;min-height:124px}.qr-copy strong{font-size:17px}
 .hero{background-position:58% top}.desktop-scroll{bottom:20px;font-size:13px}
 .feature-copy h3{font-size:24px;letter-spacing:0}.feature-copy p{font-size:14px}
 .community-copy h2{font-size:17px}.community-copy p{font-size:12px}.social-link{font-size:13px}.age-notice p,.copyright{font-size:10px}
 html:not([lang^="zh"]) .hero-copy{top:145px}html:not([lang^="zh"]) .hero h1{font-size:32px}html:not([lang^="zh"]) .hero-description{font-size:17px}
}
@media(max-width:767px){
 .site-header{position:fixed;height:52px;background:#0a0c1a26;backdrop-filter:blur(6px)}
 .header-inner{width:calc(100% - 32px)}.brand{width:104px;height:38px}.brand img{width:104px}
 .language-toggle{height:36px;padding:6px 12px;font-size:13px;grid-template-columns:16px auto 12px;background:#1a1d3033;border-color:#ffffff0d;gap:8px}
 .hero-copy{top:80px}.hero h1{font-size:30px;line-height:48px;letter-spacing:.72px;margin-bottom:8px}
 .hero-description{font-size:16px;line-height:22px;font-weight:500}
 .hero-mobile-actions{left:16px;right:16px;bottom:34px}
 .mobile-download{width:max-content;max-width:100%;padding:8px 20px;min-width:249px;box-shadow:none;font-weight:700}
 .mobile-web{margin-top:12px}.scroll-cue{margin-top:8px}
 .hero-shade{background:linear-gradient(180deg,#0a0c1acc,transparent 30%,transparent 79%,#0a0c1a)}
 .hot-games{padding:16px 0;min-height:0}
 .section-heading{font-size:18px;line-height:22px;margin:0 16px 12px;width:auto;justify-content:flex-start;letter-spacing:.4px;font-weight:900}
 .game-banner{border-radius:7.36px}.main-banner{width:calc(100% - 30px);aspect-ratio:16 / 9}
 .banner-caption{height:30px;padding:0 14px;font-size:12px;font-weight:700}
 .carousel-controls{padding-top:4px;height:28px;gap:0}
 .carousel-controls .pagination{gap:0}.carousel-controls .pagination button{width:24px;height:24px}
 .carousel-controls .pagination button img{display:none}
 .carousel-controls .pagination button::before{width:6px;height:6px;border-radius:0;transform:rotate(45deg);border:1px solid #ffffff80;background:transparent}
 .carousel-controls .pagination button.active::before{background:#fff;border-color:#fff}
 .carousel-arrow{opacity:0}.carousel:focus-within .carousel-arrow,.carousel:hover .carousel-arrow{opacity:1}
 .game-library{padding:16px 0 30px;min-height:260px;height:auto;background-size:auto 100%}
 .round-icon{width:32px;height:32px;border-radius:8.6px;margin-bottom:8px}.round-icon img{width:18px;height:18px}
 .library-heading h2{font-size:18px;line-height:21px;letter-spacing:.72px;font-weight:700;margin-bottom:5px}
 .library-heading p{font-size:12px;line-height:17px}
 .avatar-wall{--avatar-size:54px;--avatar-gap:10px;gap:12px;margin-top:12px}
 .avatar-row img,.avatar-row img:nth-child(n+7){width:54px;height:54px;border-radius:10.588px;border-width:.35px}
 .features{padding:0 15px 20px;background:var(--bg)}
 .feature-stack{display:grid;gap:20px}
 .feature-card,.feature-card:nth-child(even){display:flex;flex-direction:column;margin:0;padding:16px 8px;gap:16px;min-height:0;border-radius:16px;background:linear-gradient(136.13deg,#ffffff1a,#ffffff0f 12%,#ffffff05 50%,#ffffff0a 83%,#ffffff1a)}
 .feature-copy,.feature-card:nth-child(even) .feature-copy{padding:0 9.124px;order:0}
 .feature-icon{width:24px;height:24px;margin-bottom:7.3px}.feature-icon img{width:24px;height:24px}
 .feature-copy h3{font-size:18px;line-height:20.7px;margin-bottom:7.3px}.feature-copy p{font-size:12px;line-height:1.3}
 .feature-card .feature-art{margin:0;width:100%;border-radius:11px;order:1}
 .community{padding:16px 15px 24px;min-height:0}
 .community-layout{gap:12px}.community-brand{width:104px;height:37px}.community-brand img{width:104px}
 .community-copy h2{font-size:16px;line-height:24px;margin-bottom:8px}.community-copy p{max-width:none;font-size:12px;line-height:18px;color:#dadada}
 .social-links{margin-top:12px;gap:8px}.social-link{font-size:14px;gap:6px;height:47px;border:1.23px solid white;border-radius:8px}.social-link img{width:24px;height:24px}
 .site-footer{padding:24px 15px 16px;border-top:.5px solid #ffffff0d;min-height:0}
 .age-notice p{font-size:12px;line-height:22px;max-width:none;text-align:center;color:#6b7280}.copyright{font-size:12px;line-height:22px;margin-top:8px;color:#6b7280}
 .mobile-sticky{grid-template-columns:40px 1fr auto;padding:12px 16px max(12px,env(safe-area-inset-bottom));gap:10px;min-height:68px;background:#0a0c1ae6;backdrop-filter:blur(10px);box-shadow:none}
 .mobile-sticky>img{width:40px;height:40px;border-radius:8px}.mobile-sticky strong{font-size:16px;font-weight:400;line-height:1.3}
 .mobile-sticky a{width:auto;min-width:102px;height:34px;padding:6px 12px;display:flex;gap:8px;border-radius:8px;font-size:14px;white-space:nowrap}
 html:not([lang^="zh"]) .hero h1{font-size:28px;line-height:1.2;letter-spacing:0}
 html:not([lang^="zh"]) .hero-description{font-size:14px}
 html:not([lang^="zh"]) .mobile-sticky strong{font-size:12px}
}
@media(max-width:359px){.hero h1{font-size:26px;letter-spacing:0}.hero-description{font-size:13px}.language-toggle{padding-inline:8px;font-size:12px}.social-link{font-size:11px}.social-link img{width:20px;height:20px}.mobile-sticky{padding-inline:10px;gap:6px}.mobile-sticky strong{font-size:13px}.mobile-sticky a{min-width:90px;font-size:12px}}
