:root{--bg:#f5fbff;--surface:#fff;--soft:#eaf7fc;--pale:#dff5fb;--aqua:#25c8d1;--sky:#25b6e8;--blue:#1787db;--navy:#174b78;--heading:#173b60;--body:#2d4359;--muted:#687f93;--line:#dcebf3;--footer:#123653;--shadow:0 14px 36px rgba(23,75,120,.075)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{margin:0;background:var(--bg);color:var(--body);font:16px/1.8 Arial,"PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}body.menu-open{overflow:hidden}a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--blue);outline-offset:3px}button{font:inherit;cursor:pointer}img{max-width:100%}.shell{width:min(1160px,calc(100% - 48px));margin-inline:auto}.skip-link{position:absolute;z-index:80;top:-100px;left:20px;background:#fff;padding:8px 16px}.skip-link:focus{top:8px}.site-header{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30;box-shadow:0 3px 20px rgba(23,75,120,.035)}.header-inner{height:72px;display:flex;align-items:center;gap:22px}.brand{display:flex;align-items:center;gap:9px;flex-shrink:0}.brand img{display:block;height:37px;width:auto;max-width:190px;object-fit:contain}.brand-emblem{display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--aqua),var(--blue));font-size:24px;font-weight:900;width:38px;height:38px;border-radius:11px}.brand-type{display:flex;flex-direction:column;line-height:1.1;white-space:nowrap;color:var(--navy)}.brand-type strong{font-size:19px}.brand-type small{font-size:9px;letter-spacing:1.5px;margin-top:5px}.desktop-nav{display:flex;gap:clamp(8px,1.4vw,24px);align-items:center;justify-content:center;flex:1}.desktop-nav a{font-size:14px;white-space:nowrap;font-weight:650;color:var(--navy);position:relative;line-height:72px}.desktop-nav a:hover,.desktop-nav a.active{color:var(--blue)}.desktop-nav a.active:after{content:"";height:3px;position:absolute;left:0;right:0;bottom:0;background:linear-gradient(90deg,var(--aqua),var(--blue));border-radius:3px}.main-btn{display:inline-flex;align-items:center;justify-content:center;min-width:82px;height:42px;padding:0 20px;border-radius:999px;background:linear-gradient(110deg,#25c8d1,#25b6e8,#1787db);color:#fff;font-weight:700;text-decoration:none;white-space:nowrap;box-shadow:0 5px 14px rgba(23,135,219,.18);font-size:14px}.main-btn:hover{filter:brightness(.95)}.main-btn span{margin-left:10px}.menu-toggle{display:none;width:42px;height:42px;background:transparent;border:0;padding:10px;flex-direction:column;justify-content:center;gap:5px}.menu-toggle span{display:block;height:2px;background:var(--navy);border-radius:2px}.drawer-backdrop{position:fixed;inset:0;z-index:38;background:rgba(8,39,64,.47);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s,visibility .2s}.drawer-backdrop.is-visible{opacity:1;visibility:visible;pointer-events:auto}.site-drawer{position:fixed;z-index:39;top:0;bottom:0;left:0;width:min(86vw,340px);background:#fff;box-shadow:15px 0 50px rgba(0,0,0,.15);transform:translateX(-105%);visibility:hidden;pointer-events:none;transition:transform .22s ease,visibility .22s;display:flex;flex-direction:column}.site-drawer.is-open{transform:translateX(0);visibility:visible;pointer-events:auto}.drawer-top{padding:18px 22px;display:flex;align-items:center;justify-content:space-between;background:var(--soft);color:var(--heading)}.drawer-close{background:transparent;border:0;color:var(--navy);font-size:30px;line-height:1}.drawer-scroll{overflow-y:auto;padding:14px 22px 35px}.drawer-section{display:flex;flex-direction:column;padding:10px 0 15px;border-bottom:1px solid var(--line)}.drawer-section>span{font-size:12px;color:var(--blue);font-weight:bold;letter-spacing:1px}.drawer-section a{padding:5px 0;font-size:15px;color:var(--heading)}.drawer-section a:hover{color:var(--blue)}main{min-height:65vh}.eyebrow{display:inline-block;font-size:12px;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:var(--blue);margin-bottom:12px}.hero{padding:64px 0 56px;position:relative;overflow:hidden;background:radial-gradient(circle at 86% 20%,#d9f7fc 0,transparent 45%),linear-gradient(145deg,#f5fbff,#eaf7fc)}.hero-layout{display:grid;grid-template-columns:1.03fr .97fr;gap:54px;align-items:center}.hero h1{font-size:clamp(32px,3.8vw,43px);color:var(--heading);line-height:1.35;letter-spacing:-.6px;margin:0 0 20px}.hero h1 em{font-style:normal;color:var(--blue)}.hero p{font-size:17px;line-height:1.9;max-width:600px;margin:0 0 25px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.outline-btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 20px;border-radius:99px;border:1px solid #b5dfe9;color:var(--navy);font-size:14px;font-weight:bold;background:#fff}.hero-stats{display:flex;flex-wrap:wrap;gap:22px;margin-top:34px;color:var(--muted);font-size:13px}.hero-stats strong{color:var(--heading);display:block;font-size:20px;line-height:1.4}.media{display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--soft);border-radius:15px;border:1px solid #d9edf5;max-width:100%}.media img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;object-position:center}.media-fallback{width:100%;height:100%;min-height:120px;background:linear-gradient(135deg,#dff5fb,#eaf7fc 60%,#cdeef9);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#417da0;font-size:14px;letter-spacing:.5px;text-align:center;padding:18px}.fallback-mark{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;color:#fff;font-size:25px;background:linear-gradient(145deg,var(--aqua),var(--blue))}.hero-visual{height:310px;border-radius:25px;box-shadow:0 24px 60px rgba(23,135,219,.1)}.section{padding:57px 0}.section.tint{background:#fff}.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:26px}.section-head h2{font-size:27px;color:var(--heading);line-height:1.4;margin:0}.section-head p{margin:7px 0 0;color:var(--muted);font-size:15px}.section-link{font-size:14px;color:var(--blue);white-space:nowrap;font-weight:700}.feature-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:22px}.feature-card{padding:26px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}.feature-card.large{padding:0;overflow:hidden}.feature-card.large .media{height:225px;border:0;border-radius:0}.feature-card.large .feature-body{padding:26px}.feature-card h3,.mini-card h3{font-size:20px;color:var(--heading);line-height:1.45;margin:8px 0 10px}.feature-card p,.mini-card p{margin:0 0 15px;font-size:15px;line-height:1.8;color:var(--body)}.tag{color:var(--blue);font-size:12px;font-weight:800;letter-spacing:.7px}.text-link{color:var(--blue);font-size:14px;font-weight:700}.stack{display:grid;gap:20px}.mini-card{background:#fff;border:1px solid var(--line);border-radius:15px;padding:23px}.mini-card h3{font-size:18px}.topic-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.topic-card{display:block;padding:25px;background:linear-gradient(155deg,#fff,#f8fdff);border:1px solid var(--line);border-radius:16px;transition:transform .2s,box-shadow .2s}.topic-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.topic-card .number{color:var(--aqua);font-weight:800;font-size:12px}.topic-card strong{display:block;margin:13px 0 6px;color:var(--heading);font-size:19px}.topic-card p{font-size:14px;margin:0 0 15px;line-height:1.7;color:var(--muted)}.topic-card .arrow{color:var(--blue);font-size:21px}.split-feature{display:grid;grid-template-columns:.8fr 1.2fr;gap:36px;align-items:center}.split-feature .media{height:255px}.split-feature h2{margin:0 0 13px;color:var(--heading);font-size:27px;line-height:1.45}.split-feature p{margin:0 0 16px}.index-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 28px}.index-list a{display:flex;gap:14px;align-items:center;border-bottom:1px solid var(--line);padding:17px 0;color:var(--heading);font-weight:700}.index-list a span{color:var(--aqua);font-size:12px;font-weight:800}.index-list a:after{content:'↗';margin-left:auto;color:var(--blue)}.note-panel{border:1px solid #bfebef;background:#eefbfd;border-radius:15px;padding:22px 25px;font-size:15px}.note-panel strong{color:var(--heading)}.note-panel p{margin:5px 0 0}.page-intro{padding:62px 0 36px;background:linear-gradient(125deg,#e8f8fd,#f6fcff)}.page-intro .intro-inner{max-width:850px}.page-intro h1{color:var(--heading);font-size:clamp(26px,3vw,35px);line-height:1.4;margin:0 0 16px}.page-intro p{font-size:17px;line-height:1.85;margin:0;color:var(--body)}.breadcrumbs{font-size:13px;color:var(--muted);margin-bottom:20px}.breadcrumbs a{color:var(--blue)}.content-shell{padding-top:46px;padding-bottom:58px}.article{max-width:820px;margin:0 auto}.article h2,.content-block h2{color:var(--heading);font-size:25px;line-height:1.4;margin:36px 0 15px}.article h3,.content-block h3{color:var(--heading);font-size:19px;line-height:1.45;margin:22px 0 9px}.article p,.content-block p{margin:0 0 16px}.article ul,.article ol,.content-block ul{padding-left:23px;margin:0 0 20px}.article li,.content-block li{padding-left:3px;margin-bottom:8px}.article .media{height:250px;margin:24px 0}.lead-paragraph{font-size:18px!important;line-height:1.9;border-left:4px solid var(--aqua);padding-left:18px;color:var(--heading)}.content-block{margin-bottom:44px}.comparison{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:25px 0}.comparison>div{border:1px solid var(--line);background:#fff;padding:24px;border-radius:15px}.comparison h3{margin-top:0}.data-table{width:100%;border-collapse:collapse;margin:22px 0 30px;font-size:15px}.data-table th,.data-table td{text-align:left;padding:13px 16px;border:1px solid var(--line);vertical-align:top}.data-table th{background:#e5f7fb;color:var(--heading);font-weight:800}.data-table tr:nth-child(even) td{background:#f9fdff}.table-wrap{overflow-x:auto}.article-aside{background:#fff;border-left:4px solid var(--blue);padding:22px 25px;margin:24px 0;border-radius:0 12px 12px 0}.article-aside strong{color:var(--heading)}.article-aside p{margin:5px 0 0}.pill-list{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0}.pill-list span{font-size:13px;font-weight:700;color:var(--navy);padding:7px 13px;background:#e2f5fc;border-radius:99px}.steps{counter-reset:step;display:grid;gap:17px;margin:24px 0}.step{position:relative;background:#fff;border:1px solid var(--line);padding:20px 24px 20px 72px;border-radius:14px}.step:before{counter-increment:step;content:counter(step,decimal-leading-zero);position:absolute;left:20px;top:18px;font-size:20px;font-weight:800;color:var(--blue)}.step strong{color:var(--heading)}.step p{margin:3px 0 0}.wide-media{height:280px;margin:24px 0}.games-gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:25px}.gallery-card{border:1px solid var(--line);border-radius:17px;padding:18px;background:#fff}.gallery-card .media{height:225px}.gallery-card h3{font-size:20px;color:var(--heading);margin:17px 3px 8px}.gallery-card p{font-size:15px;margin:0 3px 8px}.faq-list{display:grid;gap:12px}.faq-list details{border:1px solid var(--line);background:#fff;border-radius:12px;padding:0 19px}.faq-list summary{color:var(--heading);font-size:16px;font-weight:700;cursor:pointer;padding:17px 0}.faq-list details p{font-size:15px;margin:0 0 17px}.related-links{max-width:1160px;margin:52px auto 0;padding-top:26px;border-top:1px solid var(--line)}.related-links h2{color:var(--heading);font-size:23px;margin:0 0 18px}.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.related-grid a{display:flex;justify-content:space-between;gap:14px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:13px;padding:15px 17px;font-weight:700;color:var(--navy)}.related-grid a span:last-child{color:var(--blue)}.site-footer{background:var(--footer);color:#eaf7ff}.footer-top{display:grid;grid-template-columns:2fr 1fr 1fr;gap:70px;padding:52px 0 42px}.footer-brand{font-weight:800;font-size:22px}.footer-brand span{font-size:10px;letter-spacing:1.3px;display:block;font-weight:400}.footer-intro p{font-size:14px;color:#c9dce7;max-width:460px;margin:17px 0 0}.footer-intro .fine-print{font-size:12px;color:#a7c4d5}.footer-top nav{display:flex;flex-direction:column;gap:8px}.footer-top nav strong{margin-bottom:9px;font-size:15px}.footer-top nav a{font-size:14px;color:#c9dce7}.footer-top a:hover{color:#fff}.footer-bottom{border-top:1px solid rgba(255,255,255,.13);display:flex;justify-content:space-between;align-items:center;padding:18px 0 24px;font-size:12px;color:#b1cada}.mobile-tabbar{display:none}.back-top{position:fixed;bottom:26px;right:24px;z-index:25;width:43px;height:43px;border:0;border-radius:50%;background:var(--blue);color:#fff;box-shadow:0 7px 22px rgba(23,135,219,.25);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s}.back-top.visible{opacity:1;visibility:visible;pointer-events:auto}
@media(max-width:1100px){.desktop-nav{gap:10px}.desktop-nav a{font-size:13px}.header-inner{gap:12px}.brand img{max-width:148px}.brand-type strong{font-size:17px}.header-cta{padding:0 15px}}
@media(max-width:980px){.desktop-nav{display:none}.menu-toggle{display:flex}.header-inner{justify-content:space-between;height:60px}.brand{position:absolute;left:50%;transform:translateX(-50%)}.brand img{height:29px;max-width:142px}.brand-emblem{height:30px;width:30px;font-size:19px}.brand-type strong{font-size:16px}.brand-type small{font-size:8px}.header-cta{height:39px;padding:0 15px;font-size:12px}.hero-layout{gap:25px}.hero-stats{gap:15px}.footer-top{gap:30px}}
@media(max-width:650px){body{font-size:15px;line-height:1.75}.shell{width:calc(100% - 32px)}.header-cta{padding:0 12px;min-width:0}.header-cta span{display:none}.hero{padding:34px 0 40px}.hero-layout{grid-template-columns:1fr;gap:25px}.hero-copy{order:2}.hero-visual{order:1;height:190px;border-radius:15px}.hero h1{font-size:29px}.hero p{font-size:15px}.hero-stats{margin-top:22px}.hero-stats strong{font-size:17px}.section{padding:36px 0}.section-head{align-items:start;gap:10px}.section-head h2{font-size:22px}.section-head p{font-size:14px}.feature-layout,.split-feature,.comparison,.games-gallery{grid-template-columns:1fr}.feature-card.large .media{height:168px}.feature-card.large .feature-body,.feature-card{padding:19px}.mini-card{padding:19px}.topic-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.topic-card{padding:17px 15px}.topic-card strong{font-size:16px}.topic-card p{font-size:13px}.split-feature{gap:18px}.split-feature .media{height:175px}.split-feature h2{font-size:22px}.index-list{grid-template-columns:1fr}.index-list a{padding:13px 0;font-size:14px}.page-intro{padding:32px 0 27px}.page-intro h1{font-size:27px}.page-intro p{font-size:15px}.content-shell{padding-top:27px;padding-bottom:35px}.article h2,.content-block h2{font-size:21px;margin-top:29px}.article h3,.content-block h3{font-size:18px}.lead-paragraph{font-size:16px!important}.article .media{height:175px}.wide-media{height:175px}.data-table{font-size:13px}.data-table th,.data-table td{padding:10px}.gallery-card .media{height:165px}.step{padding:17px 16px 17px 59px}.step:before{left:15px;font-size:17px}.related-grid{grid-template-columns:1fr}.footer-top{grid-template-columns:1fr 1fr;gap:26px;padding:36px 0 24px}.footer-intro{grid-column:1/-1}.footer-bottom{padding-bottom:85px;gap:14px;flex-wrap:wrap}.mobile-tabbar{display:grid;position:fixed;bottom:0;left:0;right:0;z-index:29;grid-template-columns:repeat(4,1fr);background:#fff;border-top:1px solid var(--line);padding:5px 6px max(5px,env(safe-area-inset-bottom));box-shadow:0 -4px 18px rgba(23,75,120,.07)}.mobile-tabbar a{font-size:11px;display:flex;align-items:center;justify-content:center;flex-direction:column;color:var(--muted);line-height:1.4;padding:5px 0}.mobile-tabbar a[aria-current=page]{color:var(--blue);font-weight:700}.mobile-tabbar a span{font-size:20px}.back-top{bottom:84px;right:15px}}
@media(max-width:380px){.brand-type small{display:none}.brand-type strong{font-size:14px}.brand-emblem{width:27px;height:27px}.menu-toggle{width:36px;padding:7px}.header-cta{padding:0 9px;font-size:11px}.topic-grid{grid-template-columns:1fr 1fr}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}