:root { color-scheme: light; font-family: Roboto, "Noto Sans SC", "Microsoft YaHei", Arial, sans-serif; color: #202124; background: #fff; --green: #2d7f63; --azar: #ff4f7b; --line: #e3e6e5; } * { box-sizing: border-box; } html { scroll-behavior: smooth; } body { margin: 0; background: #fff; color: #202124; } a { color: inherit; }
.play-header { display:flex; min-height:64px; align-items:center; gap:28px; padding:0 31px; border-bottom:1px solid #f0f1f1; background:#fff; }.play-brand { display:inline-flex; align-items:center; text-decoration:none; }.play-brand img { display:block; width:162px; height:32px; }.store-nav { display:flex; align-self:stretch; gap:29px; }.store-nav a { position:relative; display:grid; place-items:center; color:#5f6368; font-size:15px; font-weight:600; text-decoration:none; }.store-nav a.is-active { color:var(--green); }.store-nav a.is-active::after { position:absolute; right:0; bottom:0; left:0; height:3px; border-radius:8px 8px 0 0; background:var(--green); content:""; }.header-actions { display:flex; align-items:center; gap:24px; margin-left:auto; }.header-actions a { display:grid; width:24px; height:24px; place-items:center; color:#5f6368; font-size:26px; line-height:1; text-decoration:none; }.header-actions a:nth-child(2) { border:2px solid #74787a; border-radius:50%; font-family:Georgia,serif; font-size:14px; font-weight:700; }.header-actions .account-dot { width:32px; height:32px; border-radius:50%; background:#edf0ee; color:#c5c9c7; font-size:21px; }
.page-shell { width:min(100% - 80px,1140px); margin:0 auto; }.app-hero { display:grid; min-height:390px; grid-template-columns:1fr 240px; gap:80px; align-items:center; padding:54px 0 43px; }.breadcrumb { margin:0 0 19px; color:#72777a; font-size:13px; } h1,h2,h3,p { margin-top:0; }.app-hero h1 { max-width:650px; margin-bottom:18px; font-family:"Google Sans",Roboto,Arial,sans-serif; font-size:clamp(40px,4.7vw,60px); font-weight:500; letter-spacing:-1.7px; line-height:1.05; }.developer { color:var(--green); font-size:16px; font-weight:500; text-decoration:none; }.iap-note { margin:11px 0 0; color:#5f6368; font-size:13px; }.install-meta { display:flex; align-items:stretch; margin-top:27px; }.install-meta > div { display:grid; min-width:135px; gap:5px; align-content:start; padding:0 24px; border-right:1px solid #e9eaea; text-align:center; }.install-meta > div:first-child { padding-left:0; }.install-meta > div:last-child { border-right:0; }.install-meta strong { font-size:14px; }.install-meta span { color:#5f6368; font-size:12px; }.app-actions { display:flex; align-items:center; flex-wrap:wrap; gap:24px; margin-top:35px; }.install-button { display:inline-grid; width:198px; min-height:44px; place-items:center; border-radius:6px; background:var(--green); color:#fff; font-size:16px; font-weight:600; text-decoration:none; }.install-button:hover { background:#236e54; }.text-action { display:inline-flex; align-items:center; gap:9px; color:var(--green); font-size:15px; font-weight:600; text-decoration:none; }.text-action span { font-size:23px; line-height:1; }.app-icon-wrap { width:240px; overflow:hidden; border:1px solid #e4e4e4; border-radius:42px; box-shadow:0 2px 4px rgba(0,0,0,.1); }.app-icon-wrap img { display:block; width:100%; height:auto; }
.media-and-side { display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:70px; align-items:start; }.screens-shell { position:relative; overflow:hidden; }.screen-rail { display:flex; gap:14px; overflow:auto; padding:0 2px 3px; scrollbar-width:none; scroll-behavior:smooth; }.screen-rail::-webkit-scrollbar { display:none; }.screen-rail img { display:block; width:166px; height:296px; flex:0 0 166px; border-radius:8px; object-fit:cover; }.rail-next { position:absolute; top:50%; right:-1px; display:grid; width:58px; height:58px; place-items:center; border:1px solid #e4e7e6; border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.18); color:#697174; cursor:pointer; font-size:46px; font-weight:300; line-height:.7; transform:translateY(-50%); }.app-side-panel { display:grid; gap:23px; }.rating-card { display:flex; align-items:center; gap:16px; min-height:90px; padding:14px 25px; border:1px solid #d4d8d6; border-radius:16px; color:#3c4043; text-decoration:none; }.rating-badge { display:grid; width:43px; height:43px; place-items:center; border:2px solid #202124; color:#202124; font-family:Georgia,serif; font-size:15px; font-weight:700; }.rating-card strong,.rating-card small { display:block; }.rating-card strong { margin-bottom:8px; font-size:17px; font-weight:400; }.rating-card small { color:#1a73e8; font-size:13px; }.side-row { display:flex; align-items:center; justify-content:space-between; padding:0 1px; color:#3c4043; font-size:22px; text-decoration:none; }.side-row span { color:#687074; font-size:25px; }
.section-block { padding:66px 0; border-bottom:1px solid var(--line); }.section-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:24px; }.section-heading h2 { margin:0; font-family:"Google Sans",Roboto,Arial,sans-serif; font-size:30px; font-weight:500; letter-spacing:-.55px; }.section-heading > a { display:grid; width:36px; height:36px; place-items:center; border-radius:50%; color:var(--green); font-size:25px; text-decoration:none; }.section-heading > a:hover { background:#eef6f1; }.about-grid { display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:98px; }.about-copy { max-width:720px; color:#3c4043; font-size:15px; line-height:1.68; }.about-copy .lead { color:#303436; font-size:18px; font-weight:500; line-height:1.48; }.about-copy h3 { margin:27px 0 9px; color:var(--azar); font-size:16px; }.about-copy p { margin-bottom:18px; }.about-copy ul { margin:0 0 21px; padding-left:20px; }.about-copy li { margin-bottom:5px; }.read-more { color:var(--green); font-size:15px; font-weight:600; text-decoration:none; }.app-facts { display:grid; gap:24px; margin:5px 0 0; }.app-facts div { display:grid; gap:4px; }.app-facts dt { color:#5f6368; font-size:13px; }.app-facts dd { margin:0; color:#3c4043; font-size:14px; }.app-facts dd a { color:var(--green); text-decoration:none; }.event-card { display:flex; align-items:center; gap:14px; max-width:760px; padding:19px; border:1px solid #efc7d1; border-radius:16px; background:linear-gradient(115deg,#fff4f7,#fff); }.event-date { color:#9d3453; font-size:12px; font-weight:700; }.event-tag { display:grid; width:37px; height:37px; place-items:center; border-radius:11px; background:linear-gradient(140deg,#fb7697,#a05bff); color:#fff; font-weight:800; }.event-card div { flex:1; }.event-card strong { font-size:15px; }.event-card p { margin:4px 0 0; color:#5f6368; font-size:13px; }.event-card a { color:var(--green); font-size:13px; font-weight:600; text-decoration:none; white-space:nowrap; }.section-intro { max-width:740px; margin-bottom:28px; color:#5f6368; font-size:15px; line-height:1.55; }.safety-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; margin-bottom:24px; }.safety-grid article { min-height:126px; padding:20px 21px; border:1px solid #dfe3e2; border-radius:13px; color:#3c4043; }.safety-grid span { display:block; margin-bottom:13px; color:var(--azar); font-size:26px; line-height:1; }.safety-grid p { margin-bottom:8px; font-size:14px; line-height:1.4; }.safety-grid strong { font-size:13px; font-weight:500; }.ratings-summary { display:flex; max-width:530px; align-items:center; gap:46px; margin-bottom:37px; }.score { display:grid; min-width:126px; gap:4px; text-align:center; }.score strong { color:#202124; font-size:56px; font-weight:400; letter-spacing:-2px; line-height:1; }.score span { color:var(--green); font-size:16px; letter-spacing:1px; }.score small { color:#6c7375; font-size:12px; }.rating-bars { display:grid; flex:1; gap:8px; }.rating-bars p { display:flex; align-items:center; gap:10px; margin:0; color:#5f6368; font-size:12px; }.rating-bars i { display:block; width:var(--bar); min-width:3px; height:8px; border-radius:8px; background:var(--green); }.review-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:35px; max-width:800px; }.review-grid article { padding:19px 0; border-top:1px solid #e5e7e6; }.review-grid article > div { display:flex; justify-content:space-between; gap:15px; }.review-grid strong { font-size:14px; }.review-grid span { color:var(--green); font-size:13px; }.review-grid small { display:block; margin:7px 0 12px; color:#6e7375; font-size:12px; }.review-grid p { color:#3c4043; font-size:14px; line-height:1.55; }.review-grid a { color:var(--green); font-size:13px; font-weight:600; text-decoration:none; }.similar-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:26px; }.similar-grid a { display:grid; gap:7px; color:#3c4043; text-decoration:none; }.similar-icon { display:grid; width:82px; height:82px; place-items:center; border-radius:19px; color:#fff; font-size:22px; font-weight:800; }.similar-icon--line { background:#05be5b; }.similar-icon--bigo { background:linear-gradient(135deg,#824eff,#c02cc7); }.similar-icon--wechat { background:#13bd68; }.similar-icon--imo { background:#1c8be4; }.similar-grid strong { font-size:14px; line-height:1.28; }.similar-grid small { color:#6a7073; font-size:13px; }.play-footer { display:flex; flex-wrap:wrap; gap:22px; width:min(100% - 80px,1140px); margin:0 auto; padding:37px 0 58px; color:#5f6368; font-size:13px; }.play-footer span { margin-right:19px; color:#3c4043; font-size:16px; font-weight:500; }.play-footer a { color:#5f6368; text-decoration:none; }
@media (max-width:960px) { .page-shell { width:min(100% - 48px,740px); }.app-hero { grid-template-columns:1fr 190px; gap:38px; }.app-icon-wrap { width:190px; border-radius:34px; }.media-and-side,.about-grid { grid-template-columns:1fr; gap:45px; }.app-side-panel { grid-template-columns:minmax(250px,1fr) 1fr 1fr; align-items:center; }.rating-card { min-height:82px; }.side-row { font-size:17px; }.play-footer { width:min(100% - 48px,740px); } }
@media (max-width:680px) { .play-header { gap:16px; min-height:58px; padding:0 17px; }.play-brand img { width:146px; height:auto; }.store-nav { display:none; }.header-actions { gap:15px; }.page-shell { width:min(100% - 32px,560px); }.app-hero { grid-template-columns:1fr 104px; min-height:auto; gap:21px; padding:37px 0; }.breadcrumb { display:none; }.app-hero h1 { margin-bottom:13px; font-size:36px; letter-spacing:-1.2px; }.developer { font-size:14px; }.iap-note { font-size:11px; }.app-icon-wrap { width:104px; border-radius:22px; }.install-meta { margin-top:24px; }.install-meta > div { min-width:0; flex:1; padding:0 10px; }.install-meta strong { font-size:12px; }.install-meta span { font-size:10px; }.app-actions { gap:17px; margin-top:28px; }.install-button { width:145px; min-height:42px; }.text-action { font-size:13px; }.text-action span { font-size:19px; }.media-and-side { gap:36px; }.screen-rail { gap:10px; }.screen-rail img { width:153px; height:272px; flex-basis:153px; }.rail-next { width:48px; height:48px; font-size:38px; }.app-side-panel { grid-template-columns:1fr; gap:20px; }.rating-card { min-height:80px; }.side-row { font-size:19px; }.section-block { padding:47px 0; }.section-heading h2 { font-size:26px; }.about-copy,.section-intro { font-size:14px; }.about-copy .lead { font-size:17px; }.safety-grid,.similar-grid,.review-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.similar-grid { gap:27px 18px; }.similar-icon { width:70px; height:70px; border-radius:16px; }.ratings-summary { gap:20px; }.score { min-width:95px; }.score strong { font-size:44px; }.event-card { align-items:flex-start; flex-wrap:wrap; }.event-card a { width:100%; }.play-footer { width:min(100% - 32px,560px); gap:14px 19px; padding:30px 0 45px; }.play-footer span { width:100%; } }