:root {
  --bg:#11151e;
  --surface:#1c2330;
  --text:#f4f1e9;
  --muted:#a5aaa9;
  --accent:#f2ad74;
  --border:rgba(235,238,231,.13);
  --width:1440px;
  --radius:14px;
  --font:Inter,"Noto Sans CJK SC","Microsoft YaHei",system-ui,sans-serif;
}
* {
  box-sizing:border-box;
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:100px;
}
body {
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--font);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
a {
  color:inherit;
  text-decoration:none;
}
button {
  font:inherit;
}
img {
  display:block;
  max-width:100%;
  object-fit:cover;
}
a,button,summary {
  -webkit-tap-highlight-color:transparent;
}
a:focus-visible,button:focus-visible,summary:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:6px;
}
.container {
  width:min(var(--width),calc(100% - 100px));
  margin-inline:auto;
}
.site-header {
  height:88px;
  background:#11151ee8;
  backdrop-filter:blur(18px);
  position:sticky;
  top:0;
  z-index:20;
  border-bottom:1px solid var(--border);
}
.nav-wrap {
  height:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.brand {
  display:inline-flex;
  align-items:center;
  gap:9px;
  font-size:30px;
  line-height:1;
  font-weight:750;
  letter-spacing:-1.7px;
}
.brand img {
  object-fit:contain;
}
.brand-dot {
  color:var(--accent);
}
.site-header nav {
  display:flex;
  gap:25px;
  align-items:center;
  font-size:13px;
  color:#c6c9c7;
}
.site-header nav a {
  transition:color .2s;
}
.site-header nav a:hover {
  color:var(--accent);
}
.nav-download {
  padding:10px 18px;
  border:1px solid #68706d;
  border-radius:7px;
  color:var(--text);
}
.nav-download span {
  margin-left:20px;
}
.menu-toggle {
  display:none;
}
.hero {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:710px;
}
.hero-backdrop {
  position:absolute;
  inset:0;
  z-index:-2;
  background-image:linear-gradient(90deg,#11151ee8 2%,#11151ed1 23%,#11151e80 40%,#11151e20 58%,#11151e08 75%),linear-gradient(0deg,#11151e 0%,#11151e 17%,transparent 45%,#11151e22),url('assets/bg-laosiji.webp');
  background-position:center,center,calc(100% + 45px) top;
  background-size:cover,cover,auto 108%;
  background-repeat:no-repeat;
  opacity:1;
}
.hero:after {
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background:linear-gradient(180deg,transparent 80%,#11151e);
}
.hero-inner {
  display:grid;
  grid-template-columns:1.06fr 1fr;
  gap:20px;
  align-items:center;
  min-height:620px;
  padding-top:38px;
}
.hero-copy {
  position:relative;
  z-index:2;
  padding-bottom:24px;
}



.eyebrow {
  font-size:10px;
  letter-spacing:2.2px;
  font-weight:600;
  margin:0 0 23px;
  color:#aeb5b2;
}
.eyebrow>span {
  color:var(--accent);
  margin-right:13px;
}
h1,h2,h3,p {
  margin-top:0;
}
h1 {
  font-size:clamp(42px,4.1vw,61px);
  line-height:1.35;
  letter-spacing:-2.5px;
  font-weight:650;
  margin-bottom:24px;
}
h1>span {
  color:var(--accent);
}
.hero-description {
  font-size:14px;
  line-height:2;
  color:#b5bcbb;
  margin-bottom:31px;
  letter-spacing:.3px;
}
.hero-actions {
  display:flex;
  gap:25px;
  align-items:center;
}
.button {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  gap:34px;
  border-radius:7px;
  padding:13px 23px;
  font-size:13px;
  font-weight:650;
  transition:transform .2s,background .2s;
}
.button:hover {
  transform:translateY(-3px);
}
.primary {
  background:var(--accent);
  color:#29231f;
  box-shadow:0 5px 30px #f2ad7410;
}
.primary:hover {
  background:#ffc08d;
}
.text-link {
  font-size:12px;
  color:#dedfd9;
}
.text-link span {
  margin-left:9px;
}
.text-link:hover {
  color:var(--accent);
}
.platform-note {
  font-size:10px;
  display:flex;
  gap:12px;
  align-items:center;
  color:#a1a9a5;
  margin-top:22px;
  letter-spacing:.5px;
}
.platform-icon {
  font-size:17px;
}
.separator {
  opacity:.4;
}
.note-dot {
  margin-left:3px;
}
.hero-art {
  height:510px;
  position:relative;
  min-width:0;
}









.hero-bottom {
  border-top:1px solid var(--border);
  height:80px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  color:#8e9994;
  font-size:10px;
  letter-spacing:1px;
}
.hero-bottom a {
  font-size:8px;
  letter-spacing:2px;
}
.hero-bottom a span {
  margin-left:25px;
  color:var(--accent);
  font-size:17px;
}
.section {
  padding:100px 0;
}
.cores-section {
  background:#171d28;
}
.section-heading {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  margin-bottom:42px;
}
h2 {
  font-size:36px;
  line-height:1.5;
  letter-spacing:-1.2px;
  font-weight:580;
  margin-bottom:0;
}
.section-intro {
  font-size:12px;
  line-height:2;
  color:var(--muted);
  margin-bottom:7px;
}
.core-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:26px;
}
.core-card {
  background:#202837;
  border:1px solid var(--border);
  border-radius:var(--radius);
  overflow:hidden;
}
.core-image {
  height:238px;
  position:relative;
  overflow:hidden;
}
.core-image:after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(0deg,#101416c9,transparent 70%);
}
.core-image img {
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(.68) brightness(.83);
  transition:transform .6s,filter .6s;
}
.core-card:hover .core-image img {
  transform:scale(1.035);
  filter:saturate(.95) brightness(.95);
}
.image-label,.core-number {
  position:absolute;
  z-index:1;
  font-size:9px;
  letter-spacing:1.7px;
  bottom:21px;
  left:27px;
}
.core-number {
  top:19px;
  bottom:auto;
  font-size:8px;
  background:#14181b99;
  padding:5px 9px;
  border:1px solid #ffffff24;
  border-radius:3px;
}
.core-content {
  padding:25px 27px 20px;
}
.core-title {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-bottom:13px;
}
.core-title h3 {
  font-size:23px;
  letter-spacing:-.5px;
  margin:0;
  font-weight:550;
}
.chip {
  border:1px solid #ffffff20;
  border-radius:4px;
  padding:4px 8px;
  color:#afb6b0;
  font-size:8px;
  white-space:nowrap;
  letter-spacing:.4px;
}
.core-content>p {
  font-size:12px;
  color:#b0b7b4;
  line-height:1.95;
  margin-bottom:25px;
  max-width:420px;
}
.core-bottom {
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-top:1px solid var(--border);
  padding-top:16px;
  font-size:9px;
  color:#919c96;
  letter-spacing:.5px;
}
.core-bottom a {
  color:var(--accent);
  font-size:11px;
}
.core-bottom a span {
  margin-left:13px;
}
.feature-row {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:30px;
  margin-top:52px;
}
.feature-row>div {
  display:grid;
  grid-template-columns:36px 1fr;
  column-gap:14px;
  align-items:center;
}
.feature-icon {
  grid-row:1/3;
  font-size:25px;
  color:#b9c2b9;
  font-weight:300;
}
.feature-row h3 {
  font-size:13px;
  font-weight:500;
  margin:0 0 5px;
}
.feature-row p {
  font-size:10px;
  color:#959e99;
  margin:0;
}
.start-section { padding:0; }
.start-scene {
  overflow:hidden;
  position:relative;
  isolation:isolate;
  padding:95px 0 70px;
}
.start-scene:before {
  content:'';
  position:absolute;
  inset:0;
  background-image:linear-gradient(90deg,#11151e 25%,#11151eeb 35%,#11151e99 45%,#11151e10 70%),linear-gradient(180deg,#11151e 0,transparent 60px,transparent 85%,#11151e),url('assets/bg-white-fox.webp');
  background-position:center,center,right top;
  background-size:cover,cover,auto 100%;
  background-repeat:no-repeat;
  opacity:.9;
  z-index:-1;
}
.start-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:100px;
  align-items:center;
}
.start-art-space {
  min-height:470px;
  position:relative;
}
.download-wrap { padding:25px 0 85px; }
.start-copy>p:not(.eyebrow) {
  font-size:12px;
  color:var(--muted);
  margin-top:21px;
}
.orange {
  color:var(--accent);
}
.steps {
  list-style:none;
  margin:33px 0 0;
  padding:0;
}
.steps li {
  display:flex;
  gap:20px;
  margin-top:25px;
}
.steps li>span {
  font-size:10px;
  color:var(--accent);
  width:29px;
  height:29px;
  border:1px solid #f2ad7433;
  border-radius:50%;
  display:grid;
  place-items:center;
  margin-top:2px;
}
.steps h3 {
  font-size:13px;
  font-weight:500;
  margin:0 0 5px;
}
.steps p {
  font-size:11px;
  color:#909b94;
  margin:0;
}
.download-card {
  scroll-margin-top:125px;
  background:#202a3bbd;
  border:1px solid #afbeac26;
  border-radius:16px;
  padding:28px;
  display:grid;
  grid-template-columns:64px 1fr minmax(380px,1.3fr);
  align-items:center;
  gap:24px;
  box-shadow:0 28px 70px #0002;
  backdrop-filter:blur(12px);
}
.download-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:0;
}
.download-top img {
  object-fit:contain;
  width:64px;
  height:64px;
}
.download-top .chip {
  display:none;
  font-size:8px;
  letter-spacing:1.1px;
}
.download-card h3 {
  font-size:24px;
  letter-spacing:-.8px;
  font-weight:600;
  margin:0 0 8px;
}
.download-card>p {
  font-size:12px;
  color:#a5b1a7;
  margin-bottom:28px;
}
.download-heading p { margin:7px 0 0; font-size:11px; color:var(--muted); }
.download-options {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.download-options>a {
  display:flex;
  gap:16px;
  align-items:center;
  border:1px solid #bac3b128;
  border-radius:8px;
  padding:16px 19px;
  background:#ffffff04;
  transition:background .2s,border-color .2s;
}
.download-options>a:hover {
  background:#f2ad740b;
  border-color:#f2ad7466;
}
.os-symbol {
  font-size:31px;
  font-weight:300;
  width:30px;
  color:#d8decf;
}
.linux-symbol {
  font-size:27px;
}
.download-options strong {
  display:block;
  font-size:14px;
  font-weight:500;
}
.download-options small {
  display:block;
  font-size:9px;
  color:#a0ada2;
}
.download-arrow {
  margin-left:auto;
  color:var(--accent);
  font-size:20px;
}
.download-foot {
  grid-column:1/-1;
  border-top:1px solid var(--border);
  padding-top:17px;
  display:flex;
  justify-content:space-between;
  gap:15px;
  font-size:8px;
  color:#8f9a91;
  margin-top:0;
}
.download-foot a {
  color:#c5cdbc;
}
.community-section {
  border-top:1px solid var(--border);
  background:#171d28;
}
.community-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:100px;
}
.community-description {
  font-size:12px;
  line-height:2;
  color:var(--muted);
  margin:23px 0 28px;
}
.community-links {
  display:flex;
  gap:12px;
}
.secondary {
  border:1px solid #c9d0c530;
  background:#ffffff02;
  padding:10px 17px;
  font-size:11px;
  gap:25px;
  font-weight:400;
}
.secondary:hover {
  background:#ffffff08;
}
.faq {
  padding-top:6px;
}
.faq>h3 {
  font-weight:500;
  font-size:13px;
  margin-bottom:25px;
  color:#bac2bc;
}
.faq details {
  border-bottom:1px solid var(--border);
}
.faq summary {
  cursor:pointer;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  padding:22px 0;
  font-size:12px;
}
.faq summary::-webkit-details-marker {
  display:none;
}
.faq summary>span {
  color:var(--accent);
  font-size:20px;
  font-weight:300;
  transition:transform .2s;
}
.faq details[open] summary>span {
  transform:rotate(45deg);
}
.faq details>p {
  font-size:11px;
  color:#a2ada5;
  line-height:2;
  margin:0 26px 20px 0;
}
footer {
  padding:24px 0;
  border-top:1px solid var(--border);
}




.footer-bottom {
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding-right:64px;
  font-size:8px;
  color:#7d877e;
}
.footer-bottom>span:last-child {
  letter-spacing:1.2px;
}
.skip-link {
  position:fixed;
  top:-80px;
  left:20px;
  z-index:100;
  background:var(--accent);
  padding:10px;
  color:#121416;
}
.skip-link:focus {
  top:15px;
}
.performance-note, .catalog-note {
  font-size:11px;
  color:var(--muted);
  line-height:1.9;
  margin:30px 0 0;
}
.performance-note a { color:var(--accent); white-space:nowrap; margin-left:10px; }
.feature-row p { line-height:1.8; }
.games-section { background:#11151e; }
.game-toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:27px; }
.game-filters { display:flex; gap:8px; }
.game-filters[hidden] { display:none; }
.game-filters button {
  border:1px solid var(--border);
  background:transparent;
  color:var(--muted);
  border-radius:6px;
  padding:9px 15px;
  font-size:11px;
  cursor:pointer;
  transition:background .2s, color .2s, border-color .2s;
}
.game-filters button span { opacity:.6; font-size:9px; margin-left:9px; }
.game-filters button:hover { color:var(--text); }
.game-filters button[aria-pressed="true"] { color:var(--accent); border-color:#f2ad7466; background:#f2ad740b; }
#game-count { margin:0; font-size:10px; color:var(--muted); }
.game-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; }
.game-card { overflow:hidden; background:var(--surface); border:1px solid var(--border); border-radius:10px; }
.game-card[hidden], .catalog-group[hidden] { display:none; }
.game-cover { position:relative; overflow:hidden; }
.game-cover img { width:100%; aspect-ratio:8/5; height:auto; transition:transform .5s; }
.game-card:hover .game-cover img { transform:scale(1.045); }
.game-cover>span { position:absolute; bottom:10px; left:12px; padding:3px 7px; font-size:7px; letter-spacing:1px; border:1px solid #ffffff26; border-radius:3px; background:#11151ebd; }
.game-card-copy { padding:17px; }
.game-meta { display:flex; justify-content:space-between; color:#9caab7; font-size:9px; margin-bottom:10px; }
.game-card h3 { font-size:14px; font-weight:550; line-height:1.55; margin:0 0 5px; }
.game-subtitle { font-size:9px; color:#93a2b1; margin-bottom:14px; min-height:15px; }
.game-summary { font-size:10px; color:#b3bdc6; line-height:1.9; margin:0; }
.game-catalog { border:1px solid var(--border); border-radius:10px; margin-top:25px; background:#ffffff02; }
.game-catalog summary { padding:20px 23px; display:flex; gap:14px; align-items:center; cursor:pointer; font-size:12px; list-style:none; }
.game-catalog summary::-webkit-details-marker { display:none; }
.catalog-total { color:var(--muted); font-size:10px; }
.catalog-toggle { margin-left:auto; color:var(--accent); transition:transform .2s; }
.game-catalog[open] .catalog-toggle { transform:rotate(45deg); }
.catalog-columns { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:40px; padding:10px 23px 25px; }
.catalog-columns:has(.catalog-group[hidden]) { grid-template-columns:1fr; }
.catalog-group h3 { display:flex; justify-content:space-between; font-size:13px; color:var(--accent); font-weight:500; margin-bottom:12px; }
.catalog-group h3>span { color:var(--muted); font-size:10px; }
.catalog-group ul { margin:0; padding:0; list-style:none; }
.catalog-group li { display:flex; justify-content:space-between; align-items:baseline; gap:15px; padding:11px 0; border-top:1px solid var(--border); }
.catalog-name { font-size:11px; }
.catalog-genre { font-size:9px; color:var(--muted); white-space:nowrap; }
#performance-faq { scroll-margin-top:110px; }
@media(min-width:1500px) {
  .hero-inner {
    min-height:665px;
  }
  .hero {
    min-height:745px;
  }
  .hero-art {
    transform:scale(1.04);
  }
}
@media(max-width:1050px) {
  .game-grid { gap:14px; }
  .game-card-copy { padding:14px; }
  .download-card { grid-template-columns:55px 1fr 1.4fr; gap:18px; }
  .download-options>a { padding:13px; gap:9px; }
  .download-card h3 { font-size:21px; }
  .site-header nav { gap:20px; }

  .container {
    width:calc(100% - 64px);
  }
  .hero-inner {
    grid-template-columns:1.05fr 1fr;
    min-height:580px;
  }
  .hero-art {
    height:470px;
    transform:scale(.85);
    transform-origin:center right;
  }
  .hero-copy {
    min-width:0;
  }
  h1 {
    font-size:46px;
  }
  .hero {
    min-height:660px;
  }
  .hero-actions {
    gap:18px;
  }
  .text-link {
    font-size:10px;
  }

  .section {
    padding:80px 0;
  }
  .start-section { padding:0; }
  .start-grid,.community-grid {
    gap:50px;
  }
  .core-title {
    align-items:flex-start;
    flex-direction:column;
  }
  .core-content>p {
    min-height:70px;
  }
  .download-card {
    padding:28px;
  }
  .feature-row {
    gap:15px;
  }
  .feature-row>div {
    column-gap:8px;
    grid-template-columns:28px 1fr;
  }
  .feature-row h3 {
    font-size:11px;
  }
  .feature-row p {
    font-size:9px;
  }
}
@media(max-width:760px) {
  .game-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .game-card-copy { padding:13px; }
  .game-card h3 { font-size:12px; }
  .game-summary { font-size:10px; }
  .game-toolbar { align-items:flex-start; flex-direction:column; gap:13px; }
  .game-filters { width:100%; gap:6px; }
  .game-filters button { flex:1; padding:9px 7px; font-size:10px; }
  .game-filters button span { margin-left:4px; font-size:8px; }
  .catalog-columns { grid-template-columns:1fr; gap:26px; padding-inline:16px; }
  .catalog-name { font-size:10px; }
  .game-catalog summary { padding:17px 16px; }
  .performance-note, .catalog-note { font-size:10px; }
  .start-section { padding:0; }
  .start-scene { padding:60px 0 15px; }
  .start-scene:before {
    inset:auto 0 0;
    height:440px;
    background-image:linear-gradient(180deg,#11151e 30px,#11151e40 90px,#11151e05 60%,#11151e 100%),url('assets/bg-white-fox.webp');
    background-size:cover,auto 420px;
    background-position:center,right bottom;
  }
  .start-art-space { min-height:360px; }
  .download-wrap { padding:20px 0 60px; }
  .download-card { grid-template-columns:45px 1fr; gap:18px; }
  .download-top img { width:45px; height:45px; }
  .download-options { grid-column:1/-1; }
  .download-options>a { padding:12px; gap:9px; }
  .download-options .os-symbol { display:none; }
  .download-options strong { font-size:12px; }
  .download-options small { font-size:8px; }
  .download-arrow { font-size:15px; }

  .container {
    width:calc(100% - 40px);
  }
  .site-header {
    height:72px;
  }
  .brand {
    font-size:26px;
  }
  .brand img {
    width:32px;
    height:32px;
  }
  .menu-toggle {
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:6px;
    width:40px;
    height:40px;
    background:none;
    border:1px solid var(--border);
    border-radius:6px;
    padding:10px;
    color:var(--text);
  }
  .menu-toggle span {
    height:1px;
    width:100%;
    background:currentColor;
  }
  .site-header nav {
    display:none;
    position:absolute;
    top:71px;
    left:0;
    width:100%;
    background:#171d28f7;
    padding:25px 20px;
    border-bottom:1px solid var(--border);
    gap:24px;
    flex-direction:column;
    align-items:stretch;
  }
  .site-header nav.is-open {
    display:flex;
  }
  .nav-download {
    display:flex;
    justify-content:space-between;
  }
  .hero {
    min-height:0;
  }
  .hero-inner {
    grid-template-columns:1fr;
    padding-top:43px;
    gap:0;
    min-height:0;
  }
  .hero-copy {
    padding:0;
  }

  .eyebrow {
    font-size:8px;
    letter-spacing:1.8px;
    margin-bottom:19px;
  }
  h1 {
    font-size:clamp(35px,9vw,54px);
    letter-spacing:-1px;
    line-height:1.4;
    margin-bottom:20px;
  }
  .hero-description {
    font-size:12px;
    margin-bottom:25px;
  }
  .hero-actions {
    gap:23px;
  }
  .button {
    font-size:12px;
    padding:12px 20px;
    gap:27px;
  }
  .text-link {
    font-size:11px;
  }
  .platform-note {
    margin-top:17px;
  }
  .hero-art {
    width:min(430px,100%);
    height:385px;
    transform:none;
    justify-self:center;
    margin-top:40px;
  }






  .hero-backdrop {
    background-image:linear-gradient(180deg,#11151e 0%,#11151e 37%,#11151ee6 45%,#11151e1a 68%,#11151eaa 100%),url('assets/bg-laosiji.webp');
    background-size:cover,auto 63%;
    background-position:center,58% bottom;
    background-repeat:no-repeat;
  }
  .hero-art {
    height:335px;
  }

  .hero-bottom {
    height:74px;
    margin-top:24px;
    font-size:8px;
    letter-spacing:.1px;
  }
  .hero-bottom a {
    font-size:6px;
    letter-spacing:1px;
  }
  .hero-bottom a span {
    margin-left:10px;
  }
  .section {
    padding:61px 0;
  }
  .start-section { padding:0; }
  .section-heading {
    display:block;
    margin-bottom:27px;
  }
  h2 {
    font-size:29px;
    letter-spacing:-.8px;
  }
  .section-intro {
    font-size:11px;
    margin-top:20px;
  }
  .core-grid {
    grid-template-columns:1fr;
    gap:20px;
  }
  .core-image {
    height:215px;
  }
  .core-content {
    padding:22px;
  }
  .core-title {
    flex-direction:row;
    align-items:center;
  }
  .core-title h3 {
    font-size:21px;
  }
  .core-content>p {
    min-height:0;
    font-size:11px;
  }
  .chip {
    font-size:7px;
  }
  .feature-row {
    grid-template-columns:1fr;
    gap:24px;
    margin-top:35px;
  }
  .feature-row>div {
    grid-template-columns:35px 1fr;
    column-gap:15px;
  }
  .feature-row h3 {
    font-size:12px;
  }
  .feature-row p {
    font-size:10px;
  }
  .start-grid,.community-grid {
    grid-template-columns:1fr;
    gap:40px;
  }
  .steps {
    margin-top:28px;
  }
  .download-card {
    padding:25px;
  }
  .download-card h3 {
    font-size:23px;
  }
  .download-foot {
    font-size:7px;
  }
  .community-description {
    font-size:11px;
  }
  .faq {
    padding-top:0;
  }
  .faq summary {
    font-size:12px;
    padding-block:19px;
  }


  .footer-bottom {
    flex-wrap:wrap;
    gap:10px;
    font-size:7px;
  }
  .footer-bottom>span:last-child {
    flex-basis:100%;
    font-size:6px;
    letter-spacing:1px;
  }
}
@keyframes scene-drift {
  from { transform:scale(1) translateX(0); }
  to { transform:scale(1.025) translateX(-6px); }
}

@keyframes snow-drift {
  0% { transform:translate3d(0,-30px,0); opacity:0; }
  15%, 75% { opacity:var(--snow-opacity); }
  100% { transform:translate3d(var(--snow-drift),850px,0); opacity:0; }
}
.ambient-snow {
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  overflow:hidden;
}
.ambient-snow span {
  position:absolute;
  top:-20px;
  left:var(--snow-x);
  width:var(--snow-size);
  height:var(--snow-size);
  border-radius:50%;
  background:#e0efff;
  box-shadow:0 0 9px #d5e8ff65;
  opacity:0;
}
@media(prefers-reduced-motion:no-preference) {
  .hero-backdrop, .start-scene:before {
    transform-origin:center top;
    animation:scene-drift 22s ease-in-out infinite alternate;
  }

  .ambient-snow span {
    animation:snow-drift var(--snow-duration) linear var(--snow-delay) infinite;
  }
  .will-reveal {
    opacity:0;
    transform:translateY(22px);
    transition:opacity .7s ease, transform .7s cubic-bezier(.22,.61,.36,1);
  }
  .will-reveal.is-revealed { opacity:1; transform:none; }
  .button > .action-icon, .download-arrow { transition:transform .25s ease; }
  .button:hover > .action-icon { transform:translateY(2px); }
  .download-options>a:hover .download-arrow { transform:translate(3px,-3px); }
}
.motion-paused *, .motion-paused *:before { animation-play-state:paused!important; }
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*:before,*:after {
    transition:none!important;
    animation:none!important;
  }
  .will-reveal {
    opacity:1;
    transform:none;
  }
}

/* The language picker stays reachable when the mobile navigation is closed. */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.header-controls { display:flex; align-items:center; gap:12px; order:3; margin-left:22px; }
.language-control[hidden] { display:none; }
.language-control select { font:inherit; font-size:11px; background:#1b2330; color:var(--text); border:1px solid var(--border); border-radius:6px; padding:9px 7px; cursor:pointer; max-width:95px; }
.language-control select:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.nav-wrap>nav { margin-left:auto; }
html[lang="en"] h1 { font-size:clamp(35px,3.7vw,55px); letter-spacing:-1.8px; }
html[lang="en"] h2 { font-size:32px; line-height:1.35; }
html[lang="en"] .hero-description { font-size:12px; }
html[lang="en"] .feature-row { align-items:start; }
html[lang="en"] .feature-row>div { align-items:start; }
html[lang="en"] .feature-row h3 { line-height:1.5; }
html[lang="en"] .game-card h3 { overflow-wrap:anywhere; }
@media (min-width:761px) and (max-width:1100px) {
  .nav-wrap>nav { gap:14px; font-size:11px; }
  .nav-download { padding:9px 11px; }
  .nav-download span { margin-left:8px; }
  .header-controls { margin-left:14px; }
}
@media(max-width:760px) {
  .header-controls { margin-left:auto; gap:9px; }
  html[lang="en"] h1 { font-size:clamp(32px,8.5vw,48px); line-height:1.35; }
  html[lang="en"] h2 { font-size:27px; }
  html[lang="en"] .hero-actions { gap:16px; }
  html[lang="en"] .hero-actions .button { padding:12px 14px; gap:15px; font-size:11px; }
  html[lang="en"] .hero-actions .text-link { font-size:10px; }
  html[lang="en"] .core-title { align-items:flex-start; flex-direction:column; }
  html[lang="en"] .download-heading h3 { font-size:20px; }
  html[lang="en"] .download-foot { flex-wrap:wrap; }
}

.no-script-languages { padding:8px 24px; text-align:right; font-size:12px; color:var(--accent); }

/* Reviewed header: icon, plain-text navigation, then language at the far right. */
.site-header .brand { flex-shrink:0; }
.nav-wrap { justify-content:flex-start; }
.nav-wrap>nav { margin-left:30px; gap:26px; }
.header-controls { margin-left:auto; padding-left:25px; flex-shrink:0; }
.nav-wrap .nav-download { border:0; padding:0; border-radius:0; background:none; color:inherit; }
.nav-wrap .nav-download:hover { color:var(--accent); }
.language-control { display:flex; align-items:center; gap:8px; }
.language-flag { object-fit:cover; border-radius:2px; box-shadow:0 0 0 1px #ffffff1a; flex-shrink:0; }
.language-control select { border-color:transparent; background:transparent; max-width:88px; }
.language-control select option { color:var(--text); background:var(--surface); }
.platform-name { display:inline-flex; align-items:center; gap:7px; }
.platform-logo, .os-logo { object-fit:contain; filter:invert(75%) sepia(8%) saturate(262%) hue-rotate(157deg); flex-shrink:0; }
.platform-note { gap:19px; }
@media(min-width:761px) and (max-width:1050px) {
  .nav-wrap>nav { margin-left:22px; gap:18px; }
  .header-controls { padding-left:16px; }
}
@media(max-width:760px) {
  .header-controls { padding-left:0; gap:14px; }
  .nav-wrap>nav { margin-left:0; gap:24px; }
  .nav-wrap .nav-download { display:block; }
  .platform-note { gap:17px; }
  .download-options .os-logo { display:none; }
  .ambient-snow span:nth-child(n+23) { display:none; }
}

/* Product identity stays independent of the number of supported cores. */
#hero-title { font-size:clamp(54px,6vw,82px); line-height:1.06; letter-spacing:-3px; margin-bottom:28px; }
html[lang="en"] #hero-title { font-size:clamp(54px,6vw,82px); letter-spacing:-3px; }
.hero-description { max-width:470px; line-height:1.95; }
.action-icon { display:inline-block; width:18px; height:18px; flex-shrink:0; background:currentColor; mask-position:center; mask-size:contain; mask-repeat:no-repeat; -webkit-mask-position:center; -webkit-mask-size:contain; -webkit-mask-repeat:no-repeat; }
.icon-download { mask-image:url('assets/icons/download.svg'); -webkit-mask-image:url('assets/icons/download.svg'); }
.icon-history { mask-image:url('assets/icons/history.svg'); -webkit-mask-image:url('assets/icons/history.svg'); }
.hero-actions .text-link { display:inline-flex; gap:10px; align-items:center; }
.hero-actions .text-link .action-icon { margin-left:0; width:17px; height:17px; }
.core-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.core-image { height:205px; }
.core-content { padding:23px; }
.core-title { flex-wrap:wrap; gap:10px; }
.core-title h3 { font-size:22px; }
.core-card { display:flex; flex-direction:column; }
.core-content { flex:1; display:flex; flex-direction:column; }
.core-content>p { flex:1; }
.pgm3-card .core-image img { object-fit:contain; }
.pgm3-card .core-image { background:#11151e; }
.core-status { color:var(--accent); font-size:10px; }
@media(max-width:1050px) {
  .core-grid { gap:16px; }
  .core-content { padding:18px; }
  .core-image { height:175px; }
  .core-content>p { min-height:0; }
  .core-bottom { flex-wrap:wrap; gap:10px; }
}
@media(max-width:760px) {
  #hero-title, html[lang="en"] #hero-title { font-size:clamp(49px,14vw,68px); letter-spacing:-2px; }
  .hero-description { font-size:12px; }
  .core-grid { grid-template-columns:1fr; gap:20px; }
  .core-image { height:215px; }
  .core-content { padding:22px; }
  .core-title { flex-direction:row; align-items:center; }
  .core-content>p { min-height:0; }
}

/* Keep the hero focused on one identity and a single download action. */
.download-label { display:flex; flex-direction:column; align-items:flex-start; gap:2px; line-height:1.4; }
.download-label small { font-size:10px; font-weight:400; opacity:.8; letter-spacing:.2px; }
.hero-actions .primary { padding-block:12px; }
.hero-bottom { justify-content:space-between; gap:20px; }
.artwork-credit { letter-spacing:.4px; white-space:nowrap; }

/* Core overview: name, execution mode, artwork, then one useful next step. */
.cores-section { padding:76px 0 54px; background:#151c27; }
.cores-section .core-heading { margin-bottom:32px; align-items:flex-end; gap:30px; }
#cores-title, html[lang="en"] #cores-title { font-size:34px; line-height:1.3; letter-spacing:-.9px; }
.core-intro { font-size:13px; color:var(--muted); line-height:1.8; margin:14px 0 0; max-width:580px; }
.core-platforms { display:flex; align-items:center; gap:18px; font-size:11px; color:#aab4bf; padding-bottom:3px; flex-shrink:0; }
.cores-section .core-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.cores-section .core-card { background:#1b2432; border-color:#c8d6eb1a; border-radius:12px; box-shadow:0 8px 28px #0000000a; }
.cores-section .core-title, html[lang="en"] .cores-section .core-title { display:flex; flex-direction:column; align-items:flex-start; gap:8px; margin:0; padding:25px 25px 21px; }
.cores-section .core-title h3 { font-size:24px; line-height:1.3; font-weight:550; letter-spacing:-.5px; }
.core-mode { font-size:11px; color:#a7b4c4; line-height:1.6; }
.cores-section .core-image { height:166px; margin:0 12px; border-radius:6px; background:#11151e; }
.cores-section .core-image img { filter:saturate(.82) brightness(.92); }
.cores-section .core-image:after { background:linear-gradient(0deg,#11151e30,transparent 50%); }
.cores-section .core-content { padding:22px 25px 20px; }
.cores-section .core-content>p { font-size:12px; color:#b6c1cf; line-height:1.9; margin:0 0 24px; min-height:0; max-width:none; }
.cores-section .core-bottom { min-height:38px; border-color:#c8d6eb15; padding-top:17px; margin-top:auto; }
.cores-section .core-bottom a { display:inline-flex; align-items:center; justify-content:space-between; gap:16px; width:100%; font-size:12px; color:#e8c3a6; transition:color .2s; }
.cores-section .core-bottom a:hover { color:var(--accent); }
.cores-section .core-bottom .action-icon { margin:0; width:16px; height:16px; opacity:.8; }
.core-preview { display:inline-flex; align-items:center; gap:8px; font-size:11px; color:#abb8c8; }
.core-preview>span { width:5px; height:5px; border-radius:50%; background:var(--accent); opacity:.8; }
.icon-info { mask-image:url('assets/icons/info.svg'); -webkit-mask-image:url('assets/icons/info.svg'); }
@media(min-width:761px) and (max-width:1000px) {
  .cores-section .core-grid { gap:14px; }
  .cores-section .core-title, html[lang="en"] .cores-section .core-title { padding:21px 18px 17px; }
  .cores-section .core-title h3 { font-size:21px; }
  .cores-section .core-content { padding:18px; }
  .cores-section .core-image { height:140px; margin:0 8px; }
}
@media(max-width:760px) {
  .cores-section { padding:52px 0 40px; }
  .cores-section .core-heading { display:block; margin-bottom:25px; }
  #cores-title, html[lang="en"] #cores-title { font-size:29px; }
  .core-intro { font-size:12px; margin-top:12px; }
  .core-platforms { margin-top:19px; font-size:10px; }
  .cores-section .core-grid { grid-template-columns:1fr; gap:18px; }
  .cores-section .core-title, html[lang="en"] .cores-section .core-title { padding:23px 23px 18px; }
  .cores-section .core-title h3 { font-size:23px; }
  .cores-section .core-image { height:auto; aspect-ratio:1.9; }
  .cores-section .core-content { padding:20px 23px; }
  .cores-section .core-content>p { margin-bottom:20px; }
}

/* Game preview and catalog layout. */
.games-section { padding:66px 0 62px; }
.games-section .games-heading { margin-bottom:27px; }
#games-title, html[lang="en"] #games-title { font-size:34px; line-height:1.3; letter-spacing:-.9px; }
.icon-chevron { mask-image:url('assets/icons/chevron.svg'); -webkit-mask-image:url('assets/icons/chevron.svg'); width:15px; height:15px; }
.icon-chevron.previous { transform:rotate(180deg); }
.games-section .game-grid { display:grid; grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:calc((100% - 60px)/4); gap:20px; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; scroll-padding-inline:0; overscroll-behavior-x:contain; padding:0 0 16px; scrollbar-width:thin; scrollbar-color:#64738b #ffffff08; }
.game-grid:focus-visible { outline:2px solid var(--accent); outline-offset:6px; border-radius:8px; }
.game-grid::-webkit-scrollbar { height:5px; }
.game-grid::-webkit-scrollbar-thumb { background:#64738b; border-radius:9px; }
.games-section .game-card { scroll-snap-align:start; min-width:0; }
.games-section .game-card h3 { overflow-wrap:anywhere; }
.games-section .game-card-copy { padding:18px; }
.games-section .game-summary { line-height:1.85; }
#start-title, html[lang="en"] #start-title { font-size:34px; line-height:1.3; }
.start-copy .steps { margin-top:28px; }
.start-copy .steps li { gap:16px; margin-top:24px; }
.start-copy .steps li>span { flex-shrink:0; }
.start-copy .steps p { max-width:380px; font-size:12px; line-height:1.9; }
.start-copy .steps h3 { font-size:14px; margin-bottom:6px; }
@media(min-width:761px) and (max-width:1050px) {
  .games-section .game-grid { grid-auto-columns:calc((100% - 36px)/3); gap:18px; }
}
@media(max-width:760px) {
  .games-section { padding:48px 0; }
  #games-title, html[lang="en"] #games-title, #start-title, html[lang="en"] #start-title { font-size:29px; }
  .games-section .game-grid { grid-auto-columns:84%; gap:15px; }
  .games-section .game-toolbar { gap:18px; }
  .games-section .game-card h3 { font-size:15px; }
  .games-section .game-summary { font-size:12px; }
  .games-section .game-subtitle { font-size:10px; }
  .games-section .game-meta { font-size:10px; }
  .start-copy .steps p { font-size:11px; }
  .hero-actions { flex-wrap:wrap; row-gap:16px; }
  .hero-actions .text-link { font-size:11px; }
  html[lang="en"] .hero-actions .text-link { font-size:10px; gap:6px; }
}

/* Homepage preview: continuous motion without a progress-bar-like scrollbar. */
.games-section .game-grid { scrollbar-width:none; padding-bottom:0; }
.games-section .game-grid::-webkit-scrollbar { display:none; }
.games-section .game-grid.loop-track { scroll-snap-type:none; }
.all-games-link { display:inline-flex; gap:12px; align-items:center; font-size:12px; color:var(--accent); }
.all-games-link .action-icon { width:13px; height:13px; }
.icon-pause { mask-image:url('assets/icons/pause.svg'); -webkit-mask-image:url('assets/icons/pause.svg'); }
.icon-play { mask-image:url('assets/icons/play.svg'); -webkit-mask-image:url('assets/icons/play.svg'); }
.catalog-back { display:inline-flex; align-items:center; gap:8px; color:var(--muted); font-size:12px; margin-bottom:23px; }
body[data-page="catalog"] .games-section { min-height:70vh; }
body[data-page="catalog"] .game-grid { grid-auto-flow:row; grid-auto-columns:auto; grid-template-columns:repeat(4,minmax(0,1fr)); overflow:visible; scroll-snap-type:none; }
body[data-page="catalog"] .game-grid .game-card { scroll-snap-align:none; }
body[data-page="catalog"] .game-toolbar { position:sticky; top:88px; background:#11151ef5; backdrop-filter:blur(12px); z-index:3; padding:15px 0; }
@media(max-width:1050px) {
  body[data-page="catalog"] .game-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media(max-width:760px) {
  body[data-page="catalog"] .game-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  body[data-page="catalog"] .game-card-copy { padding:13px; }
  body[data-page="catalog"] .game-card h3 { font-size:12px; }
  body[data-page="catalog"] .game-summary { font-size:10px; }
  body[data-page="catalog"] .game-toolbar { top:72px; }
}

/* Core coverage belongs to the heading; quiet motion control sits below the cards. */
.game-core-counts { display:flex; flex-wrap:wrap; align-items:baseline; gap:8px 0; margin:15px 0 0; color:var(--muted); }
.game-core-counts > div { display:flex; align-items:baseline; gap:8px; }
.game-core-counts > div + div::before { content:""; width:3px; height:3px; border-radius:50%; background:var(--muted); opacity:.5; align-self:center; margin:0 16px; }
.game-core-counts dt, .game-core-counts dd { font-size:12px; font-weight:400; }
.game-core-counts dd { margin:0; font-variant-numeric:tabular-nums; }
.game-core-counts dd span { margin-left:2px; }
.all-games-link { margin-left:auto; }
@media (max-width:760px) {
  .game-core-counts dt, .game-core-counts dd { font-size:11px; }
  .game-core-counts > div + div::before { margin:0 10px; }
}

/* Sparse sakura petals are confined to the getting-started illustration. */
.sakura-petals { position:absolute; inset:0 0 0 40%; pointer-events:none; overflow:hidden; z-index:0; mask-image:linear-gradient(90deg,transparent,#000 18%); }
.start-grid { position:relative; z-index:1; }
.sakura-petals > span { position:absolute; top:-20px; height:calc(100% + 40px); left:var(--petal-x); width:var(--petal-size); opacity:0; }
.sakura-petals i { display:block; width:var(--petal-size); height:calc(var(--petal-size) * .65); border-radius:80% 12% 75% 25%; background:linear-gradient(135deg,#ffe9f1,#e8a7c1); box-shadow:0 0 3px #fbd4e72b; }
@keyframes sakura-fall {
  0% { transform:translate3d(25px,0,0); opacity:0; }
  12% { opacity:.65; }
  80% { opacity:.5; }
  100% { transform:translate3d(var(--petal-drift),100%,0); opacity:0; }
}
@keyframes sakura-turn {
  0% { transform:translateX(0) rotate(var(--petal-turn)) rotateY(0); }
  50% { transform:translateX(18px) rotate(calc(var(--petal-turn) + 95deg)) rotateY(130deg); }
  100% { transform:translateX(0) rotate(calc(var(--petal-turn) + 190deg)) rotateY(260deg); }
}
@media(prefers-reduced-motion:no-preference) {
  .sakura-petals > span { animation:sakura-fall var(--petal-duration) linear var(--petal-delay) infinite paused; }
  .sakura-petals i { animation:sakura-turn 7s ease-in-out var(--petal-delay) infinite alternate paused; }
  .sakura-petals.is-visible > span, .sakura-petals.is-visible i { animation-play-state:running; }
}
@media(prefers-reduced-motion:reduce) { .sakura-petals { display:none; } }
@media(max-width:760px) {
  .sakura-petals { inset:auto 0 0; height:380px; mask-image:linear-gradient(180deg,transparent,#000 20%); }
  .sakura-petals > span:nth-child(n+11) { display:none; }
}

/* Catalog view switch and compact rows reuse the same localized card content. */
.catalog-tools { display:flex; align-items:center; gap:20px; }
.catalog-view-controls { display:flex; gap:3px; padding:3px; border:1px solid var(--border); border-radius:8px; }
.catalog-view-controls[hidden] { display:none; }
.catalog-view-controls button { display:flex; align-items:center; justify-content:center; gap:7px; border:0; border-radius:5px; background:transparent; color:var(--muted); padding:8px 12px; font:inherit; font-size:11px; cursor:pointer; }
.catalog-view-controls button[aria-pressed="true"] { color:var(--accent); background:#f2ad7412; }
.catalog-view-controls button:hover { color:var(--text); }
.catalog-view-controls .action-icon { width:15px; height:15px; }
.icon-list { mask-image:url('assets/icons/list.svg'); -webkit-mask-image:url('assets/icons/list.svg'); }
.icon-grid { mask-image:url('assets/icons/grid.svg'); -webkit-mask-image:url('assets/icons/grid.svg'); }
body[data-page="catalog"][data-catalog-view="list"] .game-grid { grid-template-columns:1fr; gap:0; border-top:1px solid var(--border); }
body[data-catalog-view="list"] .game-card { display:grid; grid-template-columns:110px minmax(0,1fr); gap:20px; align-items:center; padding:16px 0; border:0; border-bottom:1px solid var(--border); border-radius:0; background:transparent; }
body[data-catalog-view="list"] .game-card[hidden] { display:none; }
body[data-catalog-view="list"] .game-cover { aspect-ratio:8/5; border-radius:6px; overflow:hidden; }
body[data-catalog-view="list"] .game-cover > span { left:5px; bottom:5px; font-size:8px; padding:2px 4px; }
body[data-catalog-view="list"] .game-card-copy { display:grid; grid-template-columns:minmax(0,1fr) 190px; column-gap:25px; align-items:center; padding:0; }
body[data-catalog-view="list"] .game-card h3 { grid-column:1; grid-row:1; font-size:15px; margin:0 0 5px; }
body[data-catalog-view="list"] .game-subtitle { grid-column:1; grid-row:2; margin:0; }
body[data-catalog-view="list"] .game-meta { grid-column:2; grid-row:1/3; margin:0; gap:20px; font-size:11px; }
body[data-catalog-view="list"] .game-summary { display:none; }
@media(max-width:760px) {
  .catalog-tools { width:100%; justify-content:space-between; gap:12px; }
  body[data-catalog-view="list"] .game-card { grid-template-columns:88px minmax(0,1fr); gap:13px; padding:14px 0; }
  body[data-catalog-view="list"] .game-card-copy { grid-template-columns:minmax(0,1fr); gap:0; padding:0; }
  body[data-catalog-view="list"] .game-card h3 { font-size:13px; }
  body[data-catalog-view="list"] .game-meta { grid-column:1; grid-row:3; justify-content:flex-start; gap:14px; margin-top:7px; font-size:10px; }
}

/* Release news occupies the quiet right edge of the hero artwork. */
.hero-art { display:flex; align-items:center; justify-content:flex-end; height:auto; min-height:510px; transform:none; }
.hero-news { position:relative; width:min(350px,100%); padding:24px 26px 19px; border:1px solid #e7ecf12b; border-radius:14px; background:linear-gradient(145deg,#111824bc,#1420309e); backdrop-filter:blur(9px); -webkit-backdrop-filter:blur(9px); box-shadow:0 16px 50px #080e1624; }
.news-heading { display:flex; align-items:baseline; gap:12px; margin-bottom:20px; }
.news-heading > span { color:var(--accent); font-size:10px; letter-spacing:2.5px; }
.news-heading h2 { font-size:14px; font-weight:500; letter-spacing:0; margin:0; }
.hero-news ol { list-style:none; padding:0; margin:0; }
.hero-news li + li { border-top:1px solid #d9e3f11c; margin-top:18px; padding-top:17px; }
.hero-news li a { display:block; }
.news-meta { display:flex; flex-wrap:wrap; gap:6px 12px; font-size:9px; color:#b9c3ce; }
.news-meta > span { color:#edc29e; }
.hero-news h3 { font-size:15px; line-height:1.5; margin:8px 0 5px; font-weight:550; }
.hero-news li:first-child h3 { font-size:21px; letter-spacing:-.4px; margin-top:10px; }
.hero-news p { margin:0; font-size:11px; line-height:1.85; color:#bec8d3; }
.hero-news li a:hover h3 { color:var(--accent); }
.news-more { display:flex; align-items:center; justify-content:space-between; border-top:1px solid #d9e3f126; margin-top:20px; padding-top:15px; font-size:10px; color:#e5c2a6; }
.news-more .action-icon { width:12px; height:12px; }
@media(min-width:761px) and (max-width:1050px) { .hero-news { padding:20px; width:320px; } }
@media(max-width:760px) {
  .hero-art { min-height:0; height:auto; width:100%; margin:0; padding-top:235px; padding-bottom:6px; }
  .hero-news { width:100%; padding:21px; background:linear-gradient(145deg,#111824ca,#142030b3); }
  .hero-news li:first-child h3 { font-size:20px; }
  .hero-news p { font-size:11px; }
  .game-filters { flex-wrap:wrap; }
  .game-filters button { flex:1 1 auto; }
}
.hero .news-heading h2, html[lang="en"] .hero .news-heading h2 { font-size:14px; line-height:1.5; letter-spacing:0; }
@media(max-width:760px) {
  .hero-backdrop { background-image:linear-gradient(180deg,#11151e 0,#11151e 350px,#11151e10 500px,#11151e66 780px,#11151e 1020px),url('assets/bg-laosiji.webp'); background-size:cover,auto 600px; background-position:center,58% 340px; }
}

/* Keep artwork anchored to the centered content rather than the viewport edge. */
@media(min-width:761px) {
  .hero-backdrop {
    width:min(100%,calc(var(--width) + 200px));
    margin-inline:auto;
    mask-image:linear-gradient(90deg,transparent,#000 10%,#000 87%,transparent);
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 87%,transparent);
  }
}
@media(min-width:1200px) {
  .hero-backdrop {
    background-size:cover,cover,cover;
    background-position:center,center,center top;
  }
}

/* Keep the catalog link with its section heading, above the moving preview. */
.games-section .games-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:20px; }
.games-heading .all-games-link { flex-shrink:0; padding-bottom:2px; }
@media(max-width:760px) {
  .games-section .games-heading { flex-wrap:wrap; gap:15px; }
  .games-heading .all-games-link { margin-left:0; font-size:11px; }
}

/* Wider editorial layout, with separately framed hero and guide scenes. */
@media(min-width:761px) {
  .hero-inner { min-height:690px; grid-template-columns:minmax(0,1fr) minmax(350px,.85fr); }
  .hero-backdrop { background-size:cover,cover,cover; background-position:center,center,center top; }
  .hero-news { width:min(360px,100%); }
  .start-scene { padding:84px 0; }
  .start-scene:before {
    width:min(100%,calc(var(--width) + 240px));
    margin-inline:auto;
    background-image:linear-gradient(90deg,#11151ef2 0%,#11151ee0 22%,#11151eb8 34%,#11151e42 51%,#11151e08 70%),linear-gradient(180deg,#11151e 0,transparent 80px,transparent 80%,#11151e),url('assets/bg-white-fox.webp');
    background-size:cover,cover,cover;
    background-position:center,center,center top;
    mask-image:linear-gradient(90deg,transparent,#000 9%,#000 93%,transparent);
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 93%,transparent);
    opacity:1;
  }
  .start-grid { grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:80px; }
  .start-copy { max-width:440px; }
  .start-art-space { min-height:540px; }
  .start-copy .steps li { margin-top:28px; }
  .start-copy .steps p { max-width:380px; }
  .sakura-petals { inset-inline:44% max(0px,calc((100% - var(--width)) / 2)); }
}
@media(min-width:761px) and (max-width:1050px) {
  .hero-inner { min-height:660px; grid-template-columns:minmax(0,1fr) minmax(300px,.9fr); }
  .start-grid { grid-template-columns:1fr 1fr; gap:35px; }
  .start-art-space { min-height:500px; }
}
@media(max-width:760px) {
  .hero-backdrop { background-position:center,58% 390px; }
  .start-scene:before { background-position:center,78% bottom; }
}

/* Match the smaller, bottom-trimmed assets to the established mobile framing. */
@media(max-width:760px) {
  .hero-backdrop { background-image:linear-gradient(180deg,#11151e 0,#11151e 350px,#11151e10 500px,#11151e88 730px,#11151e 870px),url('assets/bg-laosiji.webp'); background-size:cover,auto 500px; }
  .start-scene:before { background-image:linear-gradient(180deg,#11151e 30px,#11151e40 90px,#11151e05 260px,#11151e 440px),url('assets/bg-white-fox.webp'); background-size:cover,auto 420px; background-position:center,78% 20px; }
}

/* Preserve subject scale after trimming rows that sit behind the lower fades. */
@media(min-width:761px) {
  .hero-backdrop { background-size:cover,cover,max(100%,1369px) auto; }
  .start-scene:before { background-size:cover,cover,max(100%,1260px) auto; }
}
@media(min-width:761px) and (max-width:1050px) {
  .hero-backdrop { background-size:cover,cover,max(100%,1316px) auto; }
  .start-scene:before { background-size:cover,cover,max(100%,1188px) auto; }
}

.community-links .button { gap:10px; }
.community-icon { display:inline-block; flex:0 0 18px; width:18px; height:18px; background:currentColor; mask:center / contain no-repeat; -webkit-mask:center / contain no-repeat; }
.icon-discord { mask-image:url('assets/icons/discord.svg'); -webkit-mask-image:url('assets/icons/discord.svg'); }
.icon-qq { mask-image:url('assets/icons/qq.svg'); -webkit-mask-image:url('assets/icons/qq.svg'); }

.back-to-top { position:fixed; right:24px; bottom:calc(24px + env(safe-area-inset-bottom)); z-index:25; display:grid; place-items:center; width:44px; height:44px; padding:0; border:1px solid var(--border); border-radius:50%; color:var(--text); background:#1c2330e8; box-shadow:0 4px 16px #0003; cursor:pointer; }
.back-to-top[hidden] { display:none; }
.back-to-top:hover { color:var(--accent); border-color:var(--accent); }
@media(max-width:760px) {
  .back-to-top { right:16px; bottom:calc(16px + env(safe-area-inset-bottom)); }
  .footer-bottom { padding-right:52px; }
}

/* News stays readable without the homepage's decorative scene. */
.news-page { min-height:70vh; padding:70px 0 88px; }
.news-index { max-width:1100px; }
.news-back { display:inline-flex; align-items:center; gap:8px; color:var(--muted); font-size:13px; }
.news-back:hover { color:var(--accent); }
.news-index-heading { padding:42px 0; }
.news-eyebrow { color:var(--accent); font-size:10px; letter-spacing:.22em; }
.news-page h1 { font-size:clamp(30px,4vw,48px); line-height:1.25; letter-spacing:-.035em; margin:16px 0; }
.news-index-heading p, .article-header>p { color:var(--muted); line-height:1.9; }
.news-index-list { list-style:none; padding:0; margin:0; border-top:1px solid var(--border); }
.news-index-entry { display:grid; grid-template-columns:180px 1fr; gap:36px; padding:34px 0; border-bottom:1px solid var(--border); }
.news-index-entry>.news-meta { flex-direction:column; align-items:flex-start; gap:7px; padding-top:6px; }
.news-index-entry h2 { font-size:23px; margin:0 0 12px; line-height:1.4; }
.news-index-entry p { color:var(--muted); line-height:1.85; max-width:680px; margin:0; font-size:14px; }
.news-index-entry:hover h2 { color:var(--accent); }
.news-read { display:inline-flex; align-items:center; gap:10px; margin-top:20px; color:var(--accent); font-size:12px; }
.news-article { max-width:880px; }
.article-header { margin:36px 0 28px; }
.article-header>p { font-size:16px; margin-top:22px; }
.article-contents { display:flex; flex-wrap:wrap; gap:10px; padding-bottom:32px; border-bottom:1px solid var(--border); }
.article-contents a { border:1px solid var(--border); border-radius:6px; padding:8px 12px; font-size:12px; color:var(--accent); }
.article-contents a:hover { background:var(--surface); }
.release-notes { margin:44px 0; scroll-margin-top:110px; }
.release-heading { display:flex; justify-content:space-between; align-items:baseline; gap:16px; flex-wrap:wrap; }
.release-heading h2 { font-size:25px; margin:0; }
.release-heading a { display:inline-flex; gap:8px; align-items:center; font-size:12px; color:var(--accent); }
.release-notes h3 { margin:28px 0 12px; font-size:16px; }
.release-notes ul { padding-left:22px; margin:0; }
.release-notes li, .release-notes>p { font-size:15px; line-height:1.95; color:#bec5cd; }
.release-notes li { padding-left:4px; margin:10px 0; }
.release-notes li::marker { color:var(--accent); }
.news-related { display:flex; justify-content:space-between; gap:28px; border-top:1px solid var(--border); padding-top:28px; }
.news-related a { display:flex; flex-direction:column; gap:8px; max-width:48%; font-size:14px; }
.news-related a:hover { color:var(--accent); }
.news-related span { color:var(--muted); font-size:11px; }
@media (max-width:760px) {
  .news-page { padding:36px 0 56px; }
  .news-index-heading { padding:30px 0; }
  .news-index-entry { grid-template-columns:1fr; gap:16px; padding:28px 0; }
  .news-index-entry>.news-meta { flex-direction:row; gap:14px; padding:0; }
  .news-index-entry h2 { font-size:22px; }
  .release-heading { flex-direction:column; gap:10px; }
  .article-header { margin-top:28px; }
}

.site-header nav a[aria-current="page"] { color:var(--accent); }
.news-page .news-meta { font-size:12px; }

.start-credit { position:absolute; bottom:24px; inset-inline:0; z-index:1; color:var(--muted); font-size:10px; line-height:1.6; }