:root{color-scheme:light;--bg:#faf9f6;--ink:#29252c;--muted:#68616c;--line:#29252c26;--sans:"Helvetica Neue",Arial,"PingFang SC","Microsoft YaHei",sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}a:focus-visible{outline:2px solid #695777;outline-offset:8px}.wrap{width:min(1360px,calc(100% - 112px));margin-inline:auto}.header{height:100px;display:flex;justify-content:space-between;align-items:center;position:absolute;z-index:3;left:0;right:0;border-bottom:1px solid var(--line)}.brand{display:flex;gap:20px;align-items:center}.brand-cn{font-size:22px;font-weight:600;letter-spacing:2px}.brand-en{font-size:11px;font-weight:600;letter-spacing:1.5px}.header nav{display:flex;gap:35px;font-size:14px}.header nav a{padding:12px 0}.header nav a:hover{opacity:.65}.hero{position:relative;isolation:isolate;overflow:hidden;min-height:740px;height:min(940px,100svh);background:#fae0ad}.aurora{position:absolute;inset:0;z-index:-2;background:url('../images/pastel-soft-clean-stars.png') center 46%/cover no-repeat}.hero:after{content:"";position:absolute;inset:0;z-index:-1;background:#fffaf21a}.hero-inner{height:100%;min-height:740px;display:flex;flex-direction:column;padding-top:135px;padding-bottom:33px}.hero-top,.hero-bottom{display:flex;justify-content:space-between;align-items:center}.eyebrow,.hero-index{font-size:12px;letter-spacing:1.7px;line-height:1.7}.hero-top{color:#514754}.hero-center{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:55px 0 65px}.hero h1{font-size:clamp(64px,10.4vw,154px);font-weight:500;line-height:1.03;letter-spacing:-.075em;margin:0}.hero h1 span{display:block;font-size:clamp(23px,2.4vw,34px);font-weight:400;letter-spacing:.34em;padding-left:.34em;margin-top:29px}.hero-center p{margin:34px 0 0;font-size:15px;line-height:1.8;letter-spacing:1px;color:#514754}.hero-bottom{border-top:1px solid var(--line);padding-top:23px}.hero-bottom>.eyebrow{font-size:11px;letter-spacing:2px}.circle-link{font-size:14px;display:flex;gap:38px;align-items:center;background:#fffaf240;border:1px solid #29252c40;border-radius:50px;padding:12px 21px;transition:background .2s}.circle-link span{font-size:21px;transition:transform .2s}.circle-link:hover{background:#fffaf290}.circle-link:hover span{transform:translate(3px,-3px)}.about{padding:115px 0 105px}.section-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:110px}.section-label .eyebrow,.games-heading .eyebrow{color:var(--muted)}h2{font-size:36px;font-weight:400;letter-spacing:-1px;line-height:1.25;margin:18px 0 0}.about-copy p{font-size:18px;line-height:2.05;margin:0 0 25px;color:#514c56}.about-copy p:last-child{margin-bottom:0}.games{padding-bottom:110px}.games-heading{display:flex;align-items:flex-end;justify-content:space-between;border-top:1px solid var(--line);padding-top:45px;margin-bottom:38px}.small-note{font-size:11px;color:var(--muted);letter-spacing:1.5px}.game-card{position:relative;isolation:isolate;overflow:hidden;background:#f5dfe3;padding:32px 38px;min-height:535px;display:flex;flex-direction:column;border:1px solid #29252c14;border-radius:16px}.game-card:before{content:"";position:absolute;inset:0;z-index:-2;background:url('../images/pastel-soft-clean-stars.png') center 82%/cover no-repeat}.game-card:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,#fff7edb3,#fff7ed0a 90%)}.game-top,.game-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px}.game-type{font-size:12px;letter-spacing:1.5px;color:#514754}.status{font-size:12px;display:flex;align-items:center;gap:9px;background:#ffffff42;border:1px solid #29252c30;padding:9px 13px;border-radius:30px}.status span{width:5px;height:5px;background:#6c6657;border-radius:50%}.game-title-area{flex:1;padding:70px 0 68px}.game-pretitle{font-size:13px;color:#5a4d59;letter-spacing:1px}.game-title-area h3{font-weight:400;font-size:clamp(48px,6vw,80px);letter-spacing:.02em;margin:18px 0 20px;line-height:1.2}.game-subtitle{font-size:11px;letter-spacing:4px;color:#5a4d59}.game-bottom{border-top:1px solid var(--line);padding-top:22px}.game-bottom p{font-size:14px;line-height:1.9;margin:0;color:#514754}.game-number{font-size:11px;letter-spacing:2px;color:#5a4d59;white-space:nowrap}.footer{border-top:1px solid var(--line);padding:40px 0 25px}.footer-top{display:flex;justify-content:space-between;align-items:center;gap:30px}.footer-top .brand-en{display:none}.footer-top p{font-size:14px;color:var(--muted)}.back-top{font-size:13px;white-space:nowrap}.footer-bottom{margin-top:42px;padding-top:20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;font-size:12px;color:var(--muted);line-height:1.7}@media(max-width:900px){.wrap{width:calc(100% - 64px)}.brand-en{display:none}.hero,.hero-inner{min-height:700px}.section-grid{grid-template-columns:1fr 1.5fr;gap:40px}.about-copy p{font-size:16px}.footer-top{flex-wrap:wrap}.footer-top p{flex:1}}@media(max-width:600px){.wrap{width:calc(100% - 40px)}.header{height:80px}.brand-cn{font-size:20px;letter-spacing:1px}.header nav{gap:20px;font-size:13px}.hero{height:90svh;min-height:620px;max-height:850px}.hero-inner{min-height:620px;padding-top:107px;padding-bottom:25px}.hero-top .eyebrow{font-size:10px;letter-spacing:1px}.hero-index{font-size:10px;letter-spacing:.6px}.hero h1{font-size:clamp(44px,11.8vw,70px);letter-spacing:-.075em}.hero h1 span{font-size:25px;margin-top:25px}.hero-center{padding:70px 0}.hero-center p{font-size:14px;max-width:260px;margin-top:30px;line-height:1.9}.hero-bottom>.eyebrow{font-size:9px;letter-spacing:.6px;max-width:150px}.circle-link{font-size:12px;gap:15px;padding:10px 15px}.aurora{background-position:center}.about{padding:65px 0}.section-grid{grid-template-columns:1fr;gap:30px}h2{font-size:30px}.about-copy p{font-size:16px;line-height:2}.games{padding-bottom:60px}.games-heading{padding-top:32px;margin-bottom:28px}.small-note{font-size:9px;letter-spacing:.7px}.game-card{padding:23px 21px;min-height:450px;border-radius:12px}.game-top{align-items:center;gap:10px}.game-type{font-size:10px;letter-spacing:.5px}.status{font-size:10px;white-space:nowrap;padding:7px 9px}.game-title-area{padding:65px 0}.game-title-area h3{font-size:54px}.game-bottom{align-items:flex-start;flex-direction:column;gap:16px}.game-bottom p{font-size:13px}.footer{padding-top:30px}.footer-top{gap:14px}.footer-top p{flex-basis:100%;order:3;margin:6px 0 0;line-height:1.8}.back-top{margin-left:auto}.footer-bottom{margin-top:27px;flex-direction:column;gap:8px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Chinese-first identity and contact channels */
.hero h1{font-size:clamp(80px,11vw,158px);letter-spacing:.08em;padding-left:.08em;font-weight:500}
.hero h1 span{font-size:clamp(25px,3.3vw,45px);letter-spacing:-.045em;padding-left:0;margin-top:28px;font-weight:500}
.header .brand,.footer .brand{gap:8px;flex-shrink:0}.header .brand-en,.footer-top .brand-en{display:inline;font-size:15px;letter-spacing:-.5px;font-weight:500}.header .brand-cn,.footer .brand-cn{letter-spacing:0}.header nav{gap:25px}
.contact{padding-bottom:90px;border-top:1px solid var(--line);padding-top:50px}.contact-heading .eyebrow{color:var(--muted)}.email-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:35px 0 65px}.email-card{position:relative;display:flex;flex-direction:column;gap:16px;padding:28px;border:1px solid var(--line);border-radius:12px;background:linear-gradient(110deg,#f7e2d93b,#e3eee936);transition:background .2s}.email-card:hover{background:#f3e8de}.email-card>span:first-child{font-size:14px;color:var(--muted)}.email-card strong{font-size:clamp(18px,2.3vw,29px);font-weight:400;letter-spacing:-.5px;overflow-wrap:anywhere}.email-arrow{position:absolute;right:25px;top:23px;font-size:25px}.social-group+.social-group{margin-top:50px}.social-group-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}.social-group-heading h3{font-size:22px;font-weight:500;margin:0}.social-group-heading>span{font-size:11px;color:var(--muted);letter-spacing:1px}.social-grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px}.social-card{min-width:0}.qr-placeholder{aspect-ratio:1;max-width:210px;width:100%;border:1px dashed #bfb7b2;background:#f1ede763;border-radius:10px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px;color:#777069;font-size:13px}.qr-plus{font-size:26px;font-weight:300;color:#9a9089}.social-card h4{font-size:15px;margin:18px 0 10px;font-weight:500}.social-card p{font-size:13px;color:var(--muted);line-height:1.8;margin:3px 0;overflow-wrap:anywhere}.filing{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 30px;padding-top:24px;margin-top:20px;border-top:1px solid var(--line);font-size:12px;color:var(--muted);line-height:1.8}
@media(max-width:1000px){.social-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.header .brand-en{font-size:13px}.header nav{gap:18px}}
@media(max-width:600px){.header{height:105px;align-items:flex-start;padding-top:20px;flex-wrap:wrap;align-content:flex-start;gap:15px}.header .brand-cn{font-size:20px}.header .brand-en{font-size:14px}.header nav{width:100%;gap:22px}.header nav a{padding:0;font-size:12px}.hero-inner{padding-top:130px}.hero h1{font-size:clamp(64px,18vw,100px)}.hero h1 span{font-size:29px;margin-top:20px}.email-grid{grid-template-columns:1fr;gap:15px;margin-bottom:45px}.email-card{padding:23px}.email-card strong{font-size:23px}.social-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 18px}.social-group-heading{align-items:flex-start;flex-direction:column;gap:9px}.social-group-heading h3{font-size:21px}.contact{padding-top:35px;padding-bottom:55px}.qr-placeholder{max-width:none}.filing{align-items:center;flex-direction:column;gap:6px}.footer .brand-en{font-size:15px}}

/* Compact social directory and balanced bilingual wordmarks */
.header .brand-cn,.footer .brand-cn{font-size:20px;font-weight:500}
.header .brand-en,.footer .brand-en{font-size:20px;font-weight:500;letter-spacing:-.6px}
.social-grid{grid-template-columns:repeat(5,128px);gap:20px}
.qr-placeholder{width:112px;max-width:100%;gap:5px;font-size:12px;border-radius:8px}
.qr-plus{font-size:22px}
.social-card h4{margin:12px 0 6px;font-size:14px}
.social-card p{line-height:1.6;margin:2px 0}
.social-group-heading{margin-bottom:18px}
.social-group+.social-group{margin-top:32px;padding-top:26px;border-top:1px solid var(--line)}
.email-grid{margin-bottom:40px}
.contact{padding-bottom:55px}
@media(max-width:760px){.social-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 14px}}
@media(max-width:600px){.header .brand-cn,.footer .brand-cn{font-size:19px}.header .brand-en,.footer .brand-en{font-size:19px}.social-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 18px}.qr-placeholder{width:120px}.social-group-heading{gap:9px}.contact{padding-bottom:45px}}

/* Shared copyright and filing row */
.footer-bottom.legal-row{display:flex;flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 20px;font-size:12px;line-height:1.8}
.legal-row>span{white-space:nowrap}
@media(max-width:600px){.footer-bottom.legal-row{justify-content:flex-start;gap:7px 20px}.legal-row>span{white-space:normal}}

/* Matching fluid columns keep both social groups aligned. */
.contact{--social-columns:5;--social-gap:clamp(16px,3vw,44px);--qr-size:clamp(104px,13vw,144px)}
.social-grid{grid-template-columns:repeat(var(--social-columns),minmax(0,1fr));gap:24px var(--social-gap)}
.qr-placeholder{width:var(--qr-size);max-width:100%}
.footer{padding-top:32px;padding-bottom:28px}
.footer-bottom.legal-row{border-top:0;margin-top:24px;padding-top:0}
@media(max-width:760px){.contact{--social-columns:4;--social-gap:20px;--qr-size:clamp(104px,17vw,128px)}}
@media(max-width:600px){.contact{--social-columns:2;--social-gap:24px;--qr-size:clamp(112px,30vw,136px)}.footer{padding-top:26px;padding-bottom:24px}.footer-bottom.legal-row{margin-top:20px}}

/* Mobile: natural document flow, legible labels and touch-friendly navigation. */
@media(max-width:600px){
  .wrap{width:calc(100% - 40px)}
  .header{height:auto;min-height:120px;padding-block:18px 10px;gap:10px}
  .header .brand{min-height:32px}
  .header nav{display:flex;justify-content:space-between;gap:10px}
  .header nav a{display:inline-flex;align-items:center;min-height:44px;font-size:14px;padding:0 3px}
  .hero{height:auto;min-height:100svh;max-height:none}
  .hero-inner{min-height:max(680px,100svh);height:auto;padding-top:146px;padding-bottom:24px}
  .hero-top{gap:14px;flex-wrap:wrap}
  .hero-top .eyebrow,.hero-index{font-size:12px;letter-spacing:1px}
  .hero-center{padding:56px 0;min-width:0}
  .hero h1{font-size:clamp(64px,18vw,90px);line-height:1.2}
  .hero h1 span{font-size:30px;margin-top:20px}
  .hero-center p{font-size:16px;max-width:280px;margin-top:28px;line-height:1.9}
  .hero-bottom{gap:14px;flex-wrap:wrap;align-items:center;padding-top:20px}
  .hero-bottom>.eyebrow{font-size:12px;letter-spacing:.5px;max-width:none}
  .circle-link{font-size:14px;min-height:44px;padding:10px 16px;gap:12px}
  .about{padding:52px 0}.section-grid{gap:25px}
  .eyebrow{font-size:12px}h2{font-size:30px;margin-top:12px}
  .about-copy p{font-size:16px;line-height:1.95}
  .games-heading{align-items:flex-start;gap:12px;flex-wrap:wrap}.small-note{font-size:12px}
  .game-card{padding:23px 20px;min-height:460px}
  .game-top{align-items:flex-start;flex-wrap:wrap;gap:12px}
  .game-type{font-size:12px;line-height:1.8}
  .status{font-size:12px;padding:7px 10px}
  .game-title-area{padding:50px 0}.game-pretitle{font-size:14px}
  .game-title-area h3{font-size:clamp(40px,12vw,54px);line-height:1.3}
  .game-subtitle{font-size:12px;letter-spacing:3px}
  .game-bottom p{font-size:14px}.game-number{font-size:12px}
  .email-grid{margin-top:27px}.email-card{padding:22px 20px;gap:14px}
  .email-card strong{font-size:clamp(18px,5.6vw,24px);letter-spacing:-.5px}
  .contact{--social-columns:2;--social-gap:20px;--qr-size:clamp(112px,33vw,144px)}
  .social-grid{row-gap:28px}.social-card p{font-size:14px;line-height:1.7}.social-card h4{font-size:15px}
  .social-group-heading h3{font-size:22px;overflow-wrap:anywhere}
  .footer-top{flex-wrap:wrap;gap:12px;align-items:center}
  .footer .brand-cn,.footer .brand-en{font-size:18px}
  .back-top{min-height:44px;display:inline-flex;align-items:center;font-size:14px}
  .footer-bottom.legal-row{font-size:12px;row-gap:8px;margin-top:18px}
}
@media(max-width:360px){.hero-bottom{align-items:flex-start;flex-direction:column}.circle-link{align-self:flex-end}.header .brand-cn,.header .brand-en{font-size:18px}}
@media(max-height:500px) and (min-width:601px) and (max-width:1000px){.hero{height:auto;min-height:620px}.hero-inner{min-height:620px}.hero-center{padding:40px 0}.hero h1{font-size:90px}}

/* Four snap areas: the last includes contact content and the footer. */
html{scroll-snap-type:y mandatory;scroll-padding-top:0}
.hero,.about,.games,.contact-flow{scroll-snap-align:start;scroll-snap-stop:always;scroll-margin-top:0}
.hero{height:auto;min-height:100svh;max-height:none}
.hero-inner{height:auto;min-height:100svh}
.about{min-height:100svh;display:flex;align-items:center;padding-block:clamp(36px,7svh,80px)}
.games{min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding-block:clamp(28px,5svh,60px)}
.games-heading{border-top:0;padding-top:0;margin-bottom:clamp(20px,4svh,36px)}
.game-card{min-height:clamp(360px,64svh,650px)}
.game-title-area{padding-block:clamp(32px,6svh,75px)}
.contact-flow{min-height:100svh;display:flow-root}
@media(max-width:600px){
 .hero-inner{min-height:100svh;padding-top:146px;padding-bottom:22px}
 .hero-center{padding-block:clamp(28px,6svh,56px)}
 .about{padding-block:32px}.about .section-grid{gap:24px}
 .games{padding-block:28px}.games-heading{margin-bottom:24px}
 .game-card{min-height:clamp(390px,65svh,620px)}
 .game-title-area{padding-block:32px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Space the social directory below its heading after removing email cards. */
.contact-heading + .social-group{margin-top:clamp(28px,4vw,40px)}

/* Single-line copy shares its size with text at the same information level. */
.hero-center,.game-bottom,.social-card{container-type:inline-size}
.hero-center p{white-space:nowrap;max-width:none;font-size:min(15px,4.5cqi);letter-spacing:min(1px,.2cqi)}
.game-bottom p{font-size:min(14px,5cqi)}
.game-description-line{display:inline-block;white-space:nowrap;font-size:inherit}
.social-card p{font-size:min(13px,8.2cqi)}
.social-card[id^="company-social-"] > p:first-of-type{white-space:nowrap}

/* One mobile type scale: compact at 320px, full size by 400px. */
@media(max-width:600px){
 :root{
  --mobile-detail:clamp(10px,3.125vw,12px);
  --mobile-copy:clamp(12px,3.75vw,14px);
  --mobile-body:clamp(14px,4.375vw,16px);
  --mobile-brand:clamp(17px,5.3125vw,19px);
  --mobile-group:clamp(19px,5.9375vw,22px);
  --mobile-heading:clamp(26px,8.125vw,30px);
 }
 .header .brand-cn,.header .brand-en,.footer .brand-cn,.footer .brand-en{font-size:var(--mobile-brand)}
 .header nav a,.circle-link,.back-top{font-size:var(--mobile-copy)}
 .eyebrow,.hero-top .eyebrow,.hero-index,.hero-bottom>.eyebrow,
 .game-type,.status,.game-subtitle,.game-number,
 .footer-bottom.legal-row,.qr-placeholder{font-size:var(--mobile-detail)}
 .hero-top .eyebrow,.hero-index{letter-spacing:.7px}
 .hero h1{font-size:clamp(58px,18vw,90px)}
 .hero h1 span{font-size:clamp(26px,8.125vw,30px)}
 .hero-center p{font-size:min(var(--mobile-copy),4.5cqi);letter-spacing:0}
 h2{font-size:var(--mobile-heading)}
 .about-copy p{font-size:var(--mobile-body)}
 .social-group-heading h3{font-size:var(--mobile-group)}
 .social-card h4,.game-pretitle{font-size:var(--mobile-copy)}
 .social-card p{font-size:min(var(--mobile-copy),8.2cqi);line-height:1.7}
 .game-bottom p{font-size:min(var(--mobile-copy),5cqi);line-height:1.9}
 .game-title-area h3{font-size:clamp(38px,12vw,54px)}
 .game-subtitle{letter-spacing:2.5px}
 .qr-plus{font-size:var(--mobile-group)}
 .games-heading .small-note{display:none}
}

/* Preserve complete social codes and allow opening the full-resolution image. */
.social-qr{display:block;width:var(--qr-size);max-width:100%;aspect-ratio:1;background:#fff}
.social-qr img{display:block;width:100%;height:100%;object-fit:contain}
