:root {
  --ink: #172239; --paper: #F7F4ED; --accent: #C93F55;
  --second: #2D9C95; --muted: #627088; --line: color-mix(in srgb, var(--ink) 18%, transparent);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font: 16px/1.72 "Microsoft YaHei", "PingFang SC", Arial, sans-serif; letter-spacing: 0; }
a { color: inherit; }
img { max-width: 100%; }
.skip-link { position: absolute; left: 12px; top: -60px; z-index: 30; background: #fff; color: #111; padding: 10px 14px; }
.skip-link:focus { top: 12px; }
.site-header { height: 72px; padding: 0 max(24px, calc((100vw - 1180px) / 2)); display: flex; align-items: center; justify-content: space-between; gap: 28px; background: var(--paper); border-bottom: 1px solid var(--line); }
.brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; font-weight: 800; white-space: nowrap; }
.brand span { width: 34px; height: 34px; display: grid; place-items: center; color: var(--paper); background: var(--ink); border: 2px solid var(--second); border-radius: 6px; }
nav { display: flex; gap: 28px; font-size: 14px; }
nav a { padding: 24px 0 20px; text-decoration: none; border-bottom: 3px solid transparent; }
nav a:hover, nav a[aria-current="page"] { color: var(--accent); border-bottom-color: var(--accent); }
.hero { min-height: 520px; height: 76svh; max-height: 720px; display: flex; align-items: center; position: relative; isolation: isolate; color: #fff; background: var(--ink) url("hero.jpg") center/cover no-repeat; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(0,0,0,.24); }
.hero-inner { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }
.hero-copy { width: min(650px, 62vw); }
.eyebrow { margin: 0 0 12px; color: var(--second); font-size: 14px; font-weight: 700; }
h1, h2, h3 { margin-top: 0; line-height: 1.22; letter-spacing: 0; }
h1 { margin-bottom: 20px; font-size: clamp(44px, 6vw, 76px); }
.hero-lead { max-width: 620px; margin: 0 0 30px; color: rgba(255,255,255,.9); font-size: 18px; }
.command { display: inline-flex; align-items: center; min-height: 46px; padding: 0 18px; border: 1px solid var(--second); border-radius: 6px; color: var(--ink); background: var(--second); font-weight: 700; text-decoration: none; }
.command:hover { background: var(--paper); border-color: var(--paper); }
.band { padding: 76px max(24px, calc((100vw - 1180px) / 2)); }
.band.alt { background: #fff; }
.section-head { max-width: 760px; margin-bottom: 34px; }
.section-head h2 { margin-bottom: 10px; font-size: 32px; }
.section-head p { margin: 0; color: var(--muted); }
.feature-grid, .guide-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.feature, .guide-card { min-height: 220px; padding: 26px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper); }
.feature strong { display: block; margin-bottom: 12px; color: var(--accent); font-size: 13px; }
.feature h3, .guide-card h3 { margin-bottom: 12px; font-size: 21px; }
.feature p, .guide-card p { margin: 0; color: var(--muted); }
.guide-card a { display: inline-block; margin-top: 18px; color: var(--accent); font-weight: 700; }
.status-row { display: grid; grid-template-columns: 1.15fr .85fr; gap: 44px; align-items: start; }
.status-panel { padding: 26px; border-left: 5px solid var(--accent); background: #fff; }
.status-panel h3 { margin-bottom: 10px; }
.status-panel p { margin: 0; color: var(--muted); }
.article-hero { padding: 68px max(24px, calc((100vw - 900px) / 2)) 54px; background: var(--ink); color: #fff; }
.article-hero p { max-width: 700px; margin: 14px 0 0; color: rgba(255,255,255,.82); }
.article { max-width: 900px; margin: 0 auto; padding: 60px 24px 90px; }
.article section { padding: 28px 0; border-bottom: 1px solid var(--line); }
.article h2 { font-size: 27px; }
.article h3 { margin: 28px 0 8px; }
.article p, .article li { color: var(--muted); }
.article li + li { margin-top: 8px; }
.notice { padding: 22px; border: 1px solid var(--line); border-left: 5px solid var(--second); background: #fff; }
footer { display: grid; grid-template-columns: 1fr auto; gap: 22px; padding: 46px max(24px, calc((100vw - 1180px) / 2)); color: #fff; background: var(--ink); }
footer p { margin: 4px 0 0; color: rgba(255,255,255,.7); }
.footer-links { display: flex; gap: 22px; align-items: start; }
.footer-links a { color: rgba(255,255,255,.84); }
.copyright { grid-column: 1 / -1; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.16); font-size: 13px; }
@media (max-width: 760px) {
  .site-header { height: auto; min-height: 64px; padding: 14px 18px; align-items: flex-start; flex-direction: column; gap: 8px; }
  nav { width: 100%; gap: 18px; overflow-x: auto; white-space: nowrap; }
  nav a { padding: 8px 0 7px; }
  .hero { min-height: 480px; height: 68svh; max-height: 640px; background-position: 60% center; }
  .hero-inner { width: calc(100% - 36px); }
  .hero-copy { width: 100%; }
  h1 { font-size: 42px; }
  .hero-lead { font-size: 16px; }
  .band { padding: 56px 18px; }
  .feature-grid, .guide-grid, .status-row { grid-template-columns: 1fr; }
  .section-head h2 { font-size: 28px; }
  footer { grid-template-columns: 1fr; padding: 40px 18px; }
  .footer-links { flex-wrap: wrap; }
}

.hero{height:auto;min-height:510px;max-height:none;background-size:52% auto;background-position:right center;background-color:var(--ink)}
.hero::before{background:linear-gradient(90deg,var(--ink) 43%,transparent 100%)}.hero-copy{padding:70px 0;width:58%}.hero h1{font-size:clamp(38px,5vw,66px)}.eyebrow{letter-spacing:.12em}.command{cursor:pointer;font:inherit;font-weight:700}.hero-actions{display:flex;flex-wrap:wrap;gap:12px}.command.secondary{background:transparent;color:var(--paper)}
.breadcrumb{display:flex;gap:10px;max-width:1180px;margin:auto;padding:18px 24px;font-size:13px}.breadcrumb a{padding:0;border:0}.article-hero h1{font-size:40px}.article-hero{padding-top:48px;padding-bottom:48px}.article section{padding:22px 0}.article p{line-height:1.95}.article p+ p{margin-top:14px}
.game-meta{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}.game-meta span{padding:4px 10px;background:var(--ink);color:var(--paper);font-size:12px;border-radius:4px}.feature a{display:inline-block;margin-top:16px;color:var(--accent);font-weight:bold}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:step}.steps article{padding:22px;border-top:3px solid var(--accent)}.steps h3{font-size:19px}.steps p{color:var(--muted)}
.download-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.download-card{background:white;padding:28px;border:1px solid var(--line);border-radius:8px}.download-card p{color:var(--muted);min-height:55px}.device-icon{display:inline-flex;min-width:44px;min-height:44px;align-items:center;justify-content:center;background:var(--ink);color:var(--paper);border-radius:8px;padding:8px;margin-bottom:18px;font-weight:bold}.command:disabled{opacity:.65;cursor:not-allowed}.download-message{font-size:14px;color:var(--muted)}
.faq-list details{padding:20px 0;border-bottom:1px solid var(--line)}.faq-list summary{cursor:pointer;font-weight:bold;line-height:1.6}.faq-list p{color:var(--muted);margin:10px 0 0}.compare-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse}th,td{padding:14px;text-align:left;border-bottom:1px solid var(--line);font-size:14px}th{background:var(--ink);color:var(--paper)}.section-links{display:flex;gap:20px;flex-wrap:wrap;margin-top:26px}.article li{line-height:1.85}
@media(max-width:760px){.hero{background-size:auto 100%;background-position:right center;min-height:430px}.hero::before{background:rgba(0,0,0,.63)}.hero-copy{width:100%;padding:50px 0}.hero h1{font-size:42px}.site-header nav{gap:18px;font-size:13px}.steps{grid-template-columns:1fr 1fr}.download-grid{grid-template-columns:1fr}.download-card p{min-height:0}.article-hero h1{font-size:32px}.breadcrumb{padding:14px 18px}.band{padding:44px 18px}.article{padding:30px 18px 60px}}@media(max-width:400px){.steps{grid-template-columns:1fr}}