:root {
  --bg: #07050a;
  --surface: #0d0a12;
  --surface-2: #13101a;
  --line: rgba(255,255,255,.115);
  --line-soft: rgba(255,255,255,.065);
  --text: #f8f7fb;
  --muted: #aaa5b2;
  --dim: #77727e;
  --cyan: #67eeff;
  --purple: #a85cff;
  --pink: #ff4aa2;
  --lime: #c6ff4b;
  --display: "Arial Narrow", "Roboto Condensed", Impact, sans-serif;
  --body: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html { color-scheme: dark; }
html[data-theme="light"] {
  color-scheme: light;
  --bg: #edf4f8;
  --surface: #ffffff;
  --surface-2: #e5eef5;
  --line: rgba(6,30,48,.15);
  --line-soft: rgba(6,30,48,.08);
  --text: #071724;
  --muted: #506474;
  --dim: #6b7c89;
  --cyan: #00a7bd;
  --purple: #7948e8;
  --pink: #dc287b;
  --lime: #55a510;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  background: var(--bg);
  color: var(--text);
  font-family: var(--body);
  font-size: 16px;
  overflow-x: hidden;
  transition: color .35s ease,background-color .35s ease;
}
body.dialog-open { overflow: hidden; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
[hidden] { display: none !important; }

.skip-link {
  position: fixed;
  z-index: 200;
  left: 1rem;
  top: -5rem;
  padding: .8rem 1rem;
  background: var(--cyan);
  color: #020508;
  font-weight: 850;
}
.skip-link:focus { top: 1rem; }

.topbar {
  position: fixed;
  z-index: 80;
  inset: 0 0 auto;
  height: 82px;
  padding: 0 clamp(1rem, 4vw, 4.6rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  background: linear-gradient(180deg, rgba(7,5,10,.98), rgba(7,5,10,.72));
  border-bottom: 1px solid rgba(255,255,255,.09);
  backdrop-filter: blur(20px);
}
.brand { display: inline-flex; align-items: center; flex: 0 0 auto; }
.brand-word {
  position: relative;
  font-family: var(--display);
  font-size: clamp(1.65rem,2.4vw,2.1rem);
  font-style: italic;
  font-weight: 950;
  letter-spacing: -.045em;
  text-transform: uppercase;
}
.brand-word span { color: var(--cyan); }
.brand-word em { color: #807b87; font-size: .54em; font-style: normal; letter-spacing: .02em; }
.brand-word::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -.34rem;
  width: 32px;
  height: 2px;
  background: var(--cyan);
  box-shadow: 0 0 10px rgba(103,238,255,.5);
}

.main-nav { height: 100%; display: flex; align-items: stretch; gap: clamp(1.2rem,3vw,2.6rem); }
.main-nav a {
  position: relative;
  display: grid;
  place-items: center;
  color: #9c97a4;
  font-size: .76rem;
  font-weight: 820;
  letter-spacing: .12em;
  text-transform: uppercase;
  transition: color .2s ease;
}
.main-nav a::after {
  content: "";
  position: absolute;
  inset: auto 100% -1px 0;
  height: 2px;
  background: linear-gradient(90deg,var(--cyan),var(--pink));
  transition: right .25s ease;
}
.main-nav a:hover, .main-nav a.active { color: white; }
.main-nav a:hover::after, .main-nav a.active::after { right: 0; }
.header-actions { display: flex; align-items: center; gap: .75rem; }
.online-status {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  color: #9b96a2;
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.online-status i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--lime);
  box-shadow: 0 0 10px var(--lime);
  animation: statusPulse 2s ease-out infinite;
}
.lang-toggle {
  height: 42px;
  padding: 0 .72rem;
  display: flex;
  align-items: center;
  gap: .48rem;
  border: 1px solid var(--line);
  color: #77727f;
  background: rgba(255,255,255,.035);
  cursor: pointer;
}
.lang-toggle i { width: 1px; height: 14px; background: rgba(255,255,255,.16); }
.lang-option { font-size: .75rem; font-weight: 850; letter-spacing: .08em; }
.lang-option.active { color: var(--cyan); text-shadow: 0 0 10px rgba(103,238,255,.4); }
.theme-toggle {
  position: relative;
  width: 42px;
  height: 42px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  color: #d7d4dc;
  background: rgba(255,255,255,.035);
  cursor: pointer;
  overflow: hidden;
  transition: color .25s ease,border-color .25s ease,background .25s ease,transform .25s ease;
}
.theme-toggle:hover { color: var(--cyan); border-color: color-mix(in srgb,var(--cyan) 45%,transparent); transform: translateY(-1px); }
.theme-icon { position: absolute; font-size: 1.05rem; line-height: 1; transition: opacity .25s ease,transform .35s ease; }
.theme-sun { opacity: 0; transform: rotate(-60deg) scale(.6); }
.theme-moon { opacity: 1; transform: rotate(0) scale(1); }
html[data-theme="light"] .theme-sun { opacity: 1; transform: rotate(0) scale(1); }
html[data-theme="light"] .theme-moon { opacity: 0; transform: rotate(60deg) scale(.6); }
.menu-toggle {
  display: none;
  width: 42px;
  height: 42px;
  padding: 11px;
  border: 1px solid var(--line);
  color: white;
  background: rgba(255,255,255,.035);
  cursor: pointer;
}
.menu-toggle span { display: block; width: 18px; height: 1px; margin: 4px auto; background: currentColor; }

.hero {
  position: relative;
  min-height: 920px;
  display: flex;
  align-items: center;
  isolation: isolate;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
}
.hero-image, .hero-overlay, .scanlines, .hero-noise {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.hero-image {
  z-index: -5;
  object-fit: cover;
  object-position: 58% center;
  filter: brightness(.62) saturate(.9) contrast(1.08);
}
.hero-overlay {
  z-index: -4;
  background:
    linear-gradient(90deg, rgba(5,4,8,.99) 0%, rgba(5,4,8,.92) 27%, rgba(5,4,8,.36) 62%, rgba(5,4,8,.5) 100%),
    linear-gradient(180deg, rgba(5,4,8,.64), transparent 32%, rgba(5,4,8,.78) 100%);
}
.scanlines {
  z-index: -3;
  opacity: .06;
  background: repeating-linear-gradient(180deg, transparent 0, transparent 3px, rgba(255,255,255,.22) 4px);
  pointer-events: none;
}
.hero-noise {
  z-index: -2;
  opacity: .2;
  background:
    linear-gradient(rgba(103,238,255,.11) 1px, transparent 1px),
    linear-gradient(90deg, rgba(103,238,255,.11) 1px, transparent 1px);
  background-size: 84px 84px;
  mask-image: linear-gradient(90deg,#000,transparent 62%);
  animation: gridDrift 18s linear infinite;
}
.hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  left: -12%;
  bottom: -43%;
  width: 74%;
  aspect-ratio: 1;
  background: radial-gradient(circle, rgba(122,54,214,.29), transparent 63%);
  filter: blur(28px);
}
.hero-inner {
  width: min(1500px, calc(100% - clamp(2rem,8vw,9rem)));
  margin: 105px auto 170px;
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 3rem;
  align-items: center;
}
.hero-copy { max-width: 930px; }
.hero-tags { margin-bottom: 1.6rem; display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.platform-tag, .latest-tag, .section-kicker {
  font-size: .73rem;
  font-weight: 850;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.platform-tag { color: var(--cyan); }
.latest-tag {
  padding: .36rem .52rem;
  display: inline-flex;
  align-items: center;
  gap: .42rem;
  color: #d8ffc0;
  border: 1px solid rgba(198,255,75,.33);
  background: rgba(198,255,75,.06);
}
.latest-tag i { width: 5px; height: 5px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 8px var(--lime); }
.site-check-badge {
  padding: .36rem .55rem;
  display: inline-flex;
  align-items: center;
  gap: .42rem;
  color: #d9fff9;
  border: 1px solid rgba(103,238,255,.3);
  background: rgba(103,238,255,.065);
  font-size: .73rem;
  font-weight: 850;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.site-check-badge b {
  width: 16px;
  height: 16px;
  display: grid;
  place-items: center;
  color: #071014;
  border-radius: 50%;
  background: var(--cyan);
  font-size: .68rem;
  box-shadow: 0 0 14px rgba(103,238,255,.4);
}
.hero-brand-lockup { display: block; }
h1 {
  margin: 0;
  font-family: var(--display);
  font-size: clamp(4.8rem,10vw,10.4rem);
  font-style: italic;
  font-weight: 950;
  line-height: .72;
  letter-spacing: -.065em;
  text-transform: uppercase;
  text-shadow: 0 16px 50px rgba(0,0,0,.5);
}
h1 span {
  color: transparent;
  -webkit-text-stroke: 1.5px rgba(255,255,255,.68);
  text-shadow: 0 0 34px rgba(255,255,255,.08);
}
h1 strong { color: white; }
h1 em {
  margin-left: .08em;
  color: var(--cyan);
  font-family: var(--body);
  font-size: .18em;
  font-style: normal;
  letter-spacing: -.04em;
}
.hero-lead {
  max-width: 720px;
  margin: 2rem 0 1.6rem;
  color: #c4bfca;
  font-size: clamp(1.02rem,1.3vw,1.2rem);
  line-height: 1.72;
}
.hero-meta { display: flex; flex-wrap: wrap; gap: .7rem 1.4rem; margin-bottom: 2rem; color: #d2ced7; font-size: .76rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.hero-meta span { display: inline-flex; align-items: center; gap: .48rem; }
.meta-dot { width: 5px; height: 5px; border-radius: 50%; }
.meta-dot.cyan { background: var(--cyan); box-shadow: 0 0 8px var(--cyan); }
.meta-dot.purple { background: var(--purple); box-shadow: 0 0 8px var(--purple); }
.meta-dot.pink { background: var(--pink); box-shadow: 0 0 8px var(--pink); }
.meta-dot.lime { background: var(--lime); box-shadow: 0 0 8px var(--lime); }
.hero-actions { display: flex; align-items: stretch; gap: .75rem; }
.primary-download {
  position: relative;
  min-width: min(100%,350px);
  min-height: 78px;
  padding: .7rem 1rem;
  display: grid;
  grid-template-columns: 48px 1fr 28px;
  align-items: center;
  gap: .5rem;
  text-align: left;
  border: 0;
  color: #020609;
  background: linear-gradient(120deg,#a8f9ff 0%,var(--cyan) 40%,#9d6dff 115%);
  cursor: pointer;
  box-shadow: 0 20px 56px rgba(66,208,255,.23), inset 0 1px rgba(255,255,255,.88);
  clip-path: polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,18px 100%,0 calc(100% - 18px));
  transition: transform .2s ease,filter .2s ease,box-shadow .2s ease;
  overflow: hidden;
}
.primary-download::after {
  content: "";
  position: absolute;
  inset: -20% auto -20% -35%;
  width: 25%;
  background: linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);
  transform: skewX(-20deg);
  animation: buttonSweep 4.8s ease-in-out infinite;
  pointer-events: none;
}
.primary-download:hover { transform: translateY(-3px); filter: brightness(1.08); box-shadow: 0 24px 65px rgba(66,208,255,.32); }
.download-glyph { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid rgba(0,0,0,.25); }
.download-glyph svg { width: 23px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.primary-download > span:nth-child(2) { display: flex; flex-direction: column; }
.primary-download small { margin-bottom: .18rem; font-size: .75rem; font-weight: 820; letter-spacing: .12em; opacity: .65; }
.primary-download b { font-family: var(--display); font-size: 1.28rem; font-style: italic; letter-spacing: .035em; text-transform: uppercase; }
.action-arrow { font-size: 1.28rem; }
.secondary-action {
  min-width: 180px;
  padding: 0 1.2rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(7,5,10,.58);
  color: #e1dfe5;
  font-family: var(--display);
  font-size: .8rem;
  font-style: italic;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
  backdrop-filter: blur(12px);
  transition: border-color .2s ease,background .2s ease;
}
.secondary-action:hover { border-color: rgba(103,238,255,.55); background: rgba(103,238,255,.07); }
.trust-row {
  margin-top: 1rem;
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
}
.trust-item {
  min-height: 50px;
  padding: .62rem .8rem;
  display: flex;
  align-items: center;
  gap: .65rem;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(5,4,8,.48);
  backdrop-filter: blur(10px);
  transition: border-color .25s ease,background .25s ease,transform .25s ease;
}
.trust-item:hover { transform: translateY(-2px); }
.trust-item.verified { border-color: rgba(103,238,255,.25); background: rgba(103,238,255,.045); }
.trust-item.neutral { border-color: rgba(255,189,89,.25); }
.trust-icon {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,189,89,.38);
  color: #ffbd59;
  font-family: var(--display);
  font-size: .76rem;
}
.trust-item.verified .trust-icon {
  color: #061013;
  border-color: var(--cyan);
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 18px rgba(103,238,255,.24);
}
.trust-item.neutral .trust-icon { color: #ffbd59; border-color: rgba(255,189,89,.38); background: transparent; }
.trust-item > span:last-child { display: flex; flex-direction: column; }
.trust-item strong { color: #d4d0d8; font-size: .75rem; font-weight: 820; letter-spacing: .03em; }
.trust-item small { margin-top: .18rem; color: #716c77; font-size: .75rem; letter-spacing: .02em; }
.hero-stamp {
  align-self: end;
  margin-bottom: 1.5rem;
  width: 180px;
  aspect-ratio: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.2);
  background: rgba(6,5,10,.42);
  clip-path: polygon(28px 0,100% 0,100% calc(100% - 28px),calc(100% - 28px) 100%,0 100%,0 28px);
  backdrop-filter: blur(12px);
  transform: rotate(-3deg);
}
.hero-stamp::before { content:""; position:absolute; inset:10px; border:1px solid rgba(103,238,255,.18); clip-path: inherit; }
.hero-stamp span { color: var(--cyan); font-size: .78rem; font-weight: 900; letter-spacing: .24em; }
.hero-stamp strong { font-family: var(--display); font-size: 3.9rem; font-style: italic; line-height: .95; }
.hero-stamp small { color: #918c98; font-size: .75rem; font-weight: 800; letter-spacing: .16em; }

.hero-stats {
  position: absolute;
  inset: auto 0 0;
  min-height: 122px;
  border-top: 1px solid rgba(255,255,255,.11);
  background: rgba(5,4,8,.7);
  backdrop-filter: blur(22px);
}
.stats-inner {
  position: relative;
  width: min(1500px,calc(100% - clamp(2rem,8vw,9rem)));
  min-height: 122px;
  margin: auto;
  display: grid;
  grid-template-columns: repeat(4,1fr);
  align-items: center;
}
.hero-stat {
  min-height: 70px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: .85rem;
  border-right: 1px solid var(--line);
}
.hero-stat:last-child { border-right: 0; }
button.hero-stat { width: 100%; border-width: 0 1px 0 0; border-style: solid; border-color: var(--line); color: inherit; background: transparent; cursor: pointer; }
.stat-like:hover { color: var(--pink); }
.stat-icon { color: var(--cyan); font-size: 1.55rem; }
.stat-icon.heart { color: var(--pink); }
.hero-stat > span:last-child { display: flex; flex-direction: column; }
.hero-stat strong { font-family: var(--display); font-size: 1.36rem; font-style: italic; letter-spacing: .04em; }
.hero-stat small { margin-top: .14rem; color: #7e7985; font-size: .75rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.hero-rating { gap: 1rem; }
.rating-stars {
  position: relative;
  display: inline-block !important;
  width: max-content;
  color: #3a3641;
  font-size: .95rem;
  letter-spacing: .11em;
  line-height: 1;
}
.rating-stars i, .rating-stars b { font-style: normal; font-weight: 400; white-space: nowrap; }
.rating-stars b {
  position: absolute;
  inset: 0 auto 0 0;
  width: var(--fill);
  color: var(--lime);
  overflow: hidden;
  text-shadow: 0 0 12px rgba(198,255,75,.28);
}
.rating-stars.small { font-size: .75rem; letter-spacing: .07em; }
.live-pulse { width: 9px; height: 9px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 6px rgba(198,255,75,.07),0 0 14px rgba(198,255,75,.5); }

.runtime-section {
  position: relative;
  border-bottom: 1px solid var(--line);
  background: #09070d;
  overflow: hidden;
}
.runtime-section::after {
  content: "";
  position: absolute;
  inset: 0 auto 0 -20%;
  width: 18%;
  background: linear-gradient(90deg,transparent,rgba(103,238,255,.055),transparent);
  transform: skewX(-20deg);
  animation: trackerSweep 9s linear infinite;
  pointer-events: none;
}
.runtime-shell {
  width: min(1500px,calc(100% - clamp(2rem,8vw,9rem)));
  min-height: 128px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(220px,.75fr) minmax(0,2fr);
  align-items: stretch;
  border-inline: 1px solid var(--line-soft);
}
.runtime-heading {
  padding: 1.5rem;
  display: flex;
  align-items: center;
  gap: .9rem;
  border-right: 1px solid var(--line);
  background: linear-gradient(120deg,rgba(103,238,255,.05),transparent);
}
.runtime-pulse {
  width: 12px;
  height: 12px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--lime);
  box-shadow: 0 0 0 7px rgba(198,255,75,.07),0 0 18px rgba(198,255,75,.48);
  animation: statusPulse 2s ease-out infinite;
}
.runtime-heading h2 {
  margin: .45rem 0 0;
  font-family: var(--display);
  font-size: 1.45rem;
  font-style: italic;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.runtime-grid { display: grid; grid-template-columns: repeat(4,1fr); }
.runtime-cell {
  min-width: 0;
  padding: 1.3rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-right: 1px solid var(--line-soft);
}
.runtime-cell:last-child { border-right: 0; }
.runtime-cell small {
  color: #6f6a76;
  font-size: .75rem;
  font-weight: 820;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.runtime-cell strong {
  margin-top: .55rem;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  color: #e7e4eb;
  font-family: var(--display);
  font-size: 1.08rem;
  font-style: italic;
  letter-spacing: .04em;
}
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 10px rgba(198,255,75,.7); }

.section-shell { width: min(1360px,calc(100% - clamp(2rem,8vw,9rem))); margin: 0 auto; }
.catalog-section { padding: clamp(6rem,10vw,10rem) 0; background: radial-gradient(circle at 85% 12%,rgba(116,44,202,.18),transparent 28%),#07050a; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 3rem; }
.section-kicker { color: var(--cyan); }
.section-heading h2, .feature-heading h2, .update-copy h2 {
  margin: 1rem 0 0;
  font-family: var(--display);
  font-size: clamp(3.4rem,6.5vw,7rem);
  font-style: italic;
  font-weight: 950;
  line-height: .84;
  letter-spacing: -.047em;
  text-transform: uppercase;
}
.section-heading p { max-width: 480px; margin: 0; color: #918c98; line-height: 1.7; }
.filter-row { margin: 2.8rem 0 1.6rem; display: flex; flex-wrap: wrap; gap: .6rem; }
.filter-chip {
  min-height: 42px;
  padding: 0 1rem;
  border: 1px solid var(--line);
  color: #8c8793;
  background: rgba(255,255,255,.025);
  font-size: .71rem;
  font-weight: 830;
  letter-spacing: .09em;
  text-transform: uppercase;
  cursor: pointer;
  transition: color .2s ease,border-color .2s ease,background .2s ease;
}
.filter-chip:hover, .filter-chip.active { color: #05070a; border-color: var(--cyan); background: var(--cyan); }
.mod-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; }
.mod-card {
  min-width: 0;
  border: 1px solid var(--line);
  background: linear-gradient(150deg,rgba(255,255,255,.042),rgba(255,255,255,.013));
  box-shadow: 0 24px 70px rgba(0,0,0,.2);
  transition: transform .28s ease,border-color .28s ease,box-shadow .28s ease;
}
.mod-card:hover { transform: translateY(-5px); border-color: rgba(103,238,255,.34); box-shadow: 0 30px 90px rgba(0,0,0,.4); }
.mod-card:hover .menu-ui { translate: 0 -4px; box-shadow: 0 24px 58px rgba(0,0,0,.62),0 0 34px color-mix(in srgb,var(--menu-accent) 18%,transparent); }
.mod-card.featured { border-color: rgba(103,238,255,.23); }
.card-visual {
  position: relative;
  width: 100%;
  aspect-ratio: 16/8.7;
  padding: 0;
  display: block;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: #09070d;
  overflow: hidden;
  cursor: pointer;
}
.card-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,transparent 42%,rgba(6,5,9,.74));
  pointer-events: none;
}
.card-visual img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.84) brightness(.84); transition: transform .55s ease,filter .4s ease; }
.mod-card:hover .card-visual img { transform: scale(1.035); filter: saturate(1) brightness(.94); }
.card-visual.crop-tight img { object-position: 35% 52%; }
.card-visual.crop-right img { object-position: 68% 50%; }
.menu-ui {
  --menu-accent: var(--cyan);
  position: absolute;
  z-index: 3;
  left: 6%;
  top: 11%;
  width: min(48%,300px);
  min-width: 220px;
  display: block;
  overflow: hidden;
  color: white;
  border: 1px solid color-mix(in srgb,var(--menu-accent) 55%,transparent);
  background: rgba(6,7,11,.9);
  box-shadow: 0 18px 50px rgba(0,0,0,.56),0 0 28px color-mix(in srgb,var(--menu-accent) 13%,transparent);
  backdrop-filter: blur(12px);
  transform: perspective(900px) rotateY(4deg);
  transition: translate .32s ease,box-shadow .32s ease;
}
.menu-ui.right { left: auto; right: 6%; transform: perspective(900px) rotateY(-4deg); }
.menu-ui.cyan-ui { --menu-accent: #67eeff; }
.menu-ui.pink-ui { --menu-accent: #ff4aa2; }
.menu-ui.red-ui { --menu-accent: #ff4c5d; }
.menu-ui.purple-ui { --menu-accent: #a85cff; }
.menu-ui.lime-ui { --menu-accent: #c6ff4b; }
.menu-ui.white-ui { --menu-accent: #f1eff6; }
.menu-ui-head {
  height: 34px;
  padding: 0 .7rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgba(255,255,255,.1);
  background: color-mix(in srgb,var(--menu-accent) 12%,rgba(9,8,13,.95));
}
.menu-ui-head b { color: var(--menu-accent); font-family: var(--display); font-size: .75rem; font-style: italic; letter-spacing: .1em; }
.menu-ui-head i { color: #77717d; font-size: .75rem; font-style: normal; font-weight: 800; }
.menu-ui-body { min-height: 142px; display: grid; grid-template-columns: 36px 1fr; }
.menu-ui-nav { padding: .55rem .3rem; display: flex; flex-direction: column; align-items: center; gap: .32rem; border-right: 1px solid rgba(255,255,255,.08); }
.menu-ui-nav i { width: 22px; height: 22px; display: grid; place-items: center; color: #5f5a65; font-size: .75rem; font-style: normal; font-weight: 850; }
.menu-ui-nav i.active { color: #050608; background: var(--menu-accent); box-shadow: 0 0 12px color-mix(in srgb,var(--menu-accent) 32%,transparent); }
.menu-ui-list { padding: .62rem; display: block; }
.menu-ui-list small { display: block; margin-bottom: .42rem; color: #68636e; font-size: .75rem; font-weight: 850; letter-spacing: .1em; }
.menu-ui-list > i {
  min-height: 23px;
  margin: .16rem 0;
  padding: 0 .42rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #aaa5af;
  background: rgba(255,255,255,.025);
  font-size: .75rem;
  font-style: normal;
  font-weight: 650;
}
.menu-ui-list > i.selected {
  position: relative;
  color: white;
  background: color-mix(in srgb,var(--menu-accent) 12%,transparent);
}
.menu-ui-list > i.selected::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 2px; background: var(--menu-accent); }
.menu-ui-list > i b { color: var(--menu-accent); font-size: .75rem; letter-spacing: .03em; }
.card-rank, .card-platform, .card-open { position: absolute; z-index: 4; }
.card-rank { left: 1rem; top: 1rem; padding: .4rem .5rem; color: #05060a; background: var(--cyan); font-size: .75rem; font-weight: 900; }
.card-platform { left: 1rem; bottom: .9rem; color: white; font-size: .75rem; font-weight: 850; letter-spacing: .1em; }
.card-open { right: 1rem; bottom: .7rem; width: 40px; height: 40px; display: grid; place-items: center; color: var(--cyan); border: 1px solid rgba(103,238,255,.42); background: rgba(7,5,10,.58); backdrop-filter: blur(10px); }
.card-body { padding: 1.4rem; }
.card-title-row { display: flex; align-items: start; justify-content: space-between; gap: 1rem; }
.card-series { color: #6e6975; font-size: .75rem; font-weight: 850; letter-spacing: .12em; }
.card-title-row h3 { margin: .42rem 0 0; font-family: var(--display); font-size: clamp(1.55rem,2.4vw,2.1rem); font-style: italic; letter-spacing: -.02em; text-transform: uppercase; }
.version-badge { padding: .35rem .48rem; color: var(--cyan); border: 1px solid rgba(103,238,255,.22); background: rgba(103,238,255,.045); font-size: .75rem; font-weight: 850; }
.card-body > p { min-height: 3.4rem; margin: 1rem 0; color: #8f8a96; font-size: .88rem; line-height: 1.6; }
.card-meta { display: flex; flex-wrap: wrap; gap: .45rem; }
.card-meta span { padding: .34rem .48rem; color: #aaa5b1; background: rgba(255,255,255,.045); border: 1px solid var(--line-soft); font-size: .75rem; font-weight: 820; letter-spacing: .05em; }
.card-footer { margin-top: 1.3rem; padding-top: 1.1rem; display: grid; grid-template-columns: auto 1fr auto; gap: 1rem; align-items: center; border-top: 1px solid var(--line-soft); }
.card-rating { display: flex; align-items: center; gap: .45rem; }
.card-rating strong { font-family: var(--display); font-size: .95rem; font-style: italic; }
.card-numbers { justify-self: end; display: flex; gap: .8rem; color: #85808c; font-size: .75rem; font-weight: 750; }
.card-button { min-height: 38px; padding: 0 .75rem; display: flex; align-items: center; gap: .7rem; border: 1px solid rgba(103,238,255,.25); color: var(--cyan); background: rgba(103,238,255,.04); font-size: .75rem; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; cursor: pointer; }
.card-button:hover { color: #05070a; background: var(--cyan); }

.feature-section { padding: clamp(6rem,9vw,9rem) 0; border-top: 1px solid var(--line); background: linear-gradient(140deg,#0b0810,#07050a); }
.feature-heading { margin-bottom: 3rem; }
.feature-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: .8rem; }
.feature-card {
  position: relative;
  min-height: 320px;
  padding: 1.6rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.022);
  overflow: hidden;
}
.feature-card::before { content:""; position:absolute; width:180px; height:180px; right:-90px; top:-90px; background:radial-gradient(circle,rgba(103,238,255,.13),transparent 68%); }
.feature-card.active { border-color: rgba(255,74,162,.3); background: linear-gradient(145deg,rgba(255,74,162,.07),rgba(103,238,255,.035)); transform: translateY(-1.2rem); }
.feature-number { position: absolute; top: 1.4rem; left: 1.5rem; color: #605b67; font-family: var(--display); font-size: .75rem; }
.feature-icon { margin-bottom: auto; color: var(--cyan); font-size: 2.35rem; text-shadow: 0 0 26px rgba(103,238,255,.4); }
.feature-card h3 { margin: 0 0 .7rem; font-family: var(--display); font-size: 1.45rem; font-style: italic; letter-spacing: .03em; text-transform: uppercase; }
.feature-card p { max-width: 320px; margin: 0; color: #8b8692; font-size: .88rem; line-height: 1.65; }

.update-section { position: relative; padding: clamp(6rem,10vw,10rem) 0; border-top: 1px solid var(--line); background: #07050a; overflow: hidden; }
.update-art { position: absolute; right: -2vw; top: 50%; translate: 0 -50%; color: rgba(255,255,255,.02); font-family: var(--display); font-style: italic; font-weight: 950; font-size: min(22vw,20rem); line-height: .68; text-align: right; }
.update-art span, .update-art strong { display: block; }
.update-layout { position: relative; display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(3rem,9vw,9rem); align-items: center; }
.update-copy h2 { max-width: 620px; }
.update-copy p { max-width: 570px; color: #96919d; line-height: 1.75; }
.text-link { padding: .7rem 0; display: inline-flex; gap: 1rem; border: 0; border-bottom: 1px solid rgba(103,238,255,.35); color: var(--cyan); background: transparent; font-size: .72rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; cursor: pointer; }
.update-card { border: 1px solid rgba(255,255,255,.16); background: rgba(12,9,17,.86); box-shadow: 0 35px 100px rgba(0,0,0,.38); }
.update-card-head { padding: 1.55rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; border-bottom: 1px solid var(--line); }
.update-card-head span { font-family: var(--display); font-size: 1.45rem; font-style: italic; font-weight: 900; text-transform: uppercase; }
.update-card-head strong { color: var(--cyan); font-size: .74rem; letter-spacing: .1em; }
.update-card dl { margin: 0; display: grid; grid-template-columns: repeat(2,1fr); }
.update-card dl div { padding: 1.45rem 1.55rem; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.update-card dl div:nth-child(even) { border-right: 0; }
.update-card dt { color: #6f6a76; font-size: .75rem; font-weight: 820; letter-spacing: .1em; text-transform: uppercase; }
.update-card dd { margin: .5rem 0 0; font-family: var(--display); font-size: 1.08rem; font-weight: 800; }
.update-download { width: calc(100% - 2rem); margin: 1rem; padding: 1.2rem; display: flex; align-items: center; justify-content: space-between; border: 0; color: #020508; background: var(--cyan); font-family: var(--display); font-size: .95rem; font-style: italic; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; transition: transform .2s ease,filter .2s ease; }
.update-download:hover { transform: translateY(-2px); filter: brightness(1.08); }

footer { min-height: 135px; padding: 1.7rem clamp(1rem,4vw,4.6rem); display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 2rem; border-top: 1px solid var(--line); color: #68636f; font-size: .75rem; }
.footer-note { justify-self: center; text-align: center; }
.footer-note p { margin: .25rem 0; }
.copyright { justify-self: end; }

.product-dialog {
  width: min(560px,calc(100% - 2rem));
  max-width: none;
  padding: 0;
  border: 1px solid rgba(103,238,255,.32);
  color: white;
  background: #0d0a12;
  box-shadow: 0 40px 140px rgba(0,0,0,.76);
}
.product-dialog::backdrop { background: rgba(3,2,5,.82); backdrop-filter: blur(8px); }
.product-dialog form { position: relative; padding: 2rem; }
.dialog-close { position: absolute; right: 1rem; top: 1rem; width: 38px; height: 38px; border: 1px solid var(--line); color: #aaa5b1; background: transparent; font-size: 1.35rem; cursor: pointer; }
.dialog-product-head { display: flex; align-items: center; padding-right: 2.7rem; }
.dialog-kicker { color: var(--cyan); font-size: .75rem; font-weight: 850; letter-spacing: .12em; }
.product-dialog h2 { margin: .45rem 0 0; font-family: var(--display); font-size: 2rem; font-style: italic; text-transform: uppercase; }
.dialog-description { margin: 1.6rem 0; color: #aaa5b1; line-height: 1.68; }
.dialog-stats { display: grid; grid-template-columns: repeat(3,1fr); border: 1px solid var(--line); }
.dialog-stats > span { padding: 1rem; display: flex; flex-direction: column; border-right: 1px solid var(--line); }
.dialog-stats > span:last-child { border-right: 0; }
.dialog-stats small { color: #6f6a76; font-size: .75rem; font-weight: 820; letter-spacing: .08em; text-transform: uppercase; }
.dialog-stats strong { margin-top: .45rem; font-family: var(--display); font-size: 1.02rem; font-style: italic; }
.dialog-notice { margin: 1rem 0; padding: .9rem; display: grid; grid-template-columns: 26px 1fr; gap: .7rem; align-items: start; border: 1px solid rgba(168,92,255,.2); background: rgba(168,92,255,.055); }
.dialog-notice > span { width: 24px; height: 24px; display: grid; place-items: center; border: 1px solid rgba(168,92,255,.45); color: #c296ff; font-family: Georgia,serif; font-style: italic; }
.dialog-notice p { margin: 0; color: #928d99; font-size: .77rem; line-height: 1.55; }
.dialog-action { width: 100%; padding: 1rem; border: 0; color: #030609; background: var(--cyan); font-family: var(--display); font-style: italic; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }

.reveal { opacity: 0; translate: 0 24px; transition: opacity .7s ease,translate .7s ease; }
.reveal.visible { opacity: 1; translate: 0 0; }
:focus-visible { outline: 2px solid var(--cyan); outline-offset: 4px; }

html[data-theme="light"] .topbar {
  background: linear-gradient(180deg,rgba(250,253,255,.98),rgba(242,248,252,.88));
  border-bottom-color: rgba(7,31,48,.12);
  box-shadow: 0 12px 40px rgba(20,67,98,.08);
}
html[data-theme="light"] .brand-word { color: #071724; }
html[data-theme="light"] .brand-word em { color: #6c7d89; }
html[data-theme="light"] .main-nav a { color: #637582; }
html[data-theme="light"] .main-nav a:hover,
html[data-theme="light"] .main-nav a.active { color: #071724; }
html[data-theme="light"] .online-status { color: #5a6e7d; }
html[data-theme="light"] .lang-toggle,
html[data-theme="light"] .theme-toggle,
html[data-theme="light"] .menu-toggle { color: #243b4b; background: rgba(255,255,255,.78); }
html[data-theme="light"] .hero { color: #f8f7fb; }
html[data-theme="light"] .runtime-section { background: #e7f0f6; }
html[data-theme="light"] .runtime-heading { background: linear-gradient(120deg,rgba(0,167,189,.11),rgba(255,255,255,.35)); }
html[data-theme="light"] .runtime-heading h2,
html[data-theme="light"] .runtime-cell strong { color: #071724; }
html[data-theme="light"] .runtime-cell small { color: #617582; }
html[data-theme="light"] .catalog-section { background: radial-gradient(circle at 85% 12%,rgba(121,72,232,.1),transparent 30%),#f2f7fa; }
html[data-theme="light"] .section-heading p,
html[data-theme="light"] .card-body > p,
html[data-theme="light"] .feature-card p,
html[data-theme="light"] .update-copy p { color: #526777; }
html[data-theme="light"] .filter-chip { color: #536978; background: rgba(255,255,255,.82); }
html[data-theme="light"] .filter-chip:hover,
html[data-theme="light"] .filter-chip.active { color: #041218; }
html[data-theme="light"] .mod-card { background: rgba(255,255,255,.92); box-shadow: 0 24px 70px rgba(28,69,96,.11); }
html[data-theme="light"] .mod-card:hover { box-shadow: 0 30px 80px rgba(28,69,96,.18); }
html[data-theme="light"] .card-series,
html[data-theme="light"] .card-numbers { color: #627582; }
html[data-theme="light"] .card-meta span { color: #405968; background: #edf4f8; }
html[data-theme="light"] .feature-section { background: linear-gradient(140deg,#e5eef5,#f8fbfd); }
html[data-theme="light"] .feature-card { background: rgba(255,255,255,.72); }
html[data-theme="light"] .feature-card.active { background: linear-gradient(145deg,rgba(220,40,123,.08),rgba(0,167,189,.08)),#fff; }
html[data-theme="light"] .update-section { background: #eef5f9; }
html[data-theme="light"] .update-art { color: rgba(7,31,48,.035); }
html[data-theme="light"] .update-card { background: rgba(255,255,255,.9); box-shadow: 0 35px 90px rgba(28,69,96,.14); }
html[data-theme="light"] .text-link { color: #007d8d; }
html[data-theme="light"] footer { color: #607482; background: #f8fbfd; }
html[data-theme="light"] .product-dialog { color: #071724; background: #fff; box-shadow: 0 40px 130px rgba(15,43,62,.28); }
html[data-theme="light"] .dialog-close { color: #4c6372; }
html[data-theme="light"] .dialog-description,
html[data-theme="light"] .dialog-notice p { color: #526777; }
html[data-theme="light"] .dialog-notice { background: rgba(121,72,232,.055); }

@keyframes statusPulse {
  0%,100% { box-shadow: 0 0 0 0 rgba(198,255,75,.18),0 0 12px rgba(198,255,75,.48); }
  50% { box-shadow: 0 0 0 8px rgba(198,255,75,0),0 0 18px rgba(198,255,75,.64); }
}
@keyframes gridDrift { to { background-position: 84px 84px,84px 84px; } }
@keyframes buttonSweep {
  0%,62% { left: -35%; }
  82%,100% { left: 125%; }
}
@keyframes trackerSweep { from { left: -20%; } to { left: 125%; } }

@media (max-width: 1120px) {
  .main-nav { gap: 1.25rem; }
  .online-status { display: none; }
  .hero-inner { grid-template-columns: 1fr; }
  .hero-stamp { position: absolute; right: clamp(2rem,7vw,6rem); bottom: 150px; width: 145px; }
  .hero-stamp strong { font-size: 3.1rem; }
  .section-heading { align-items: start; flex-direction: column; gap: 1.3rem; }
  .card-footer { grid-template-columns: auto 1fr; }
  .card-button { grid-column: 1/-1; justify-content: space-between; }
}

@media (max-width: 820px) {
  .topbar { height: 70px; }
  .brand-word { font-size: 1.25rem; }
  .main-nav {
    position: fixed;
    inset: 70px 0 auto;
    height: auto;
    padding: 1rem;
    display: grid;
    gap: 0;
    background: rgba(7,5,10,.985);
    border-bottom: 1px solid var(--line);
    transform: translateY(-140%);
    transition: transform .25s ease;
  }
  html[data-theme="light"] .main-nav { background: rgba(248,252,254,.985); }
  .main-nav.open { transform: translateY(0); }
  .main-nav a { min-height: 54px; justify-items: start; border-bottom: 1px solid var(--line-soft); }
  .menu-toggle { display: block; }
  .hero { min-height: 970px; }
  .hero-image { object-position: 66% center; }
  .hero-overlay { background: linear-gradient(180deg,rgba(5,4,8,.48),rgba(5,4,8,.8) 42%,#07050a 78%); }
  .hero-inner { width: min(100% - 2rem,680px); margin: 230px auto 250px; }
  h1 { font-size: clamp(4.3rem,17vw,7rem); }
  .hero-stamp { display: none; }
  .hero-stats { min-height: 190px; }
  .stats-inner { width: 100%; min-height: 190px; grid-template-columns: repeat(2,1fr); }
  .hero-stat { border-bottom: 1px solid var(--line); }
  .hero-stat:nth-child(even) { border-right: 0; }
  .runtime-shell { width: 100%; grid-template-columns: 1fr; }
  .runtime-heading { border-right: 0; border-bottom: 1px solid var(--line); }
  .mod-grid { grid-template-columns: 1fr; }
  .feature-grid { grid-template-columns: 1fr; }
  .feature-card,.feature-card.active { min-height: 240px; transform: none; }
  .update-layout { grid-template-columns: 1fr; }
  footer { grid-template-columns: 1fr; justify-items: start; gap: 1rem; }
  .footer-note { justify-self: start; text-align: left; }
  .copyright { justify-self: start; }
}

@media (max-width: 560px) {
  .topbar { padding: 0 1rem; }
  .brand-word { font-size: 1.08rem; }
  .lang-toggle { padding: 0 .55rem; }
  .theme-toggle { width: 40px; height: 40px; }
  .section-shell { width: calc(100% - 2rem); }
  .hero { min-height: 1040px; align-items: start; }
  .hero-inner { width: calc(100% - 2rem); margin: 220px auto 250px; }
  .hero-tags { gap: .55rem; }
  .platform-tag,.latest-tag { font-size: .75rem; }
  h1 { font-size: clamp(3.65rem,16vw,5rem); line-height: .75; }
  .hero-lead { font-size: 1rem; line-height: 1.62; }
  .hero-actions { flex-direction: column; }
  .primary-download,.secondary-action { width: 100%; min-width: 0; min-height: 72px; }
  .hero-stats,.stats-inner { min-height: 220px; }
  .hero-stat { gap: .5rem; }
  .hero-stat strong { font-size: 1.15rem; }
  .hero-stat small { font-size: .75rem; }
  .hero-rating { flex-direction: column; gap: .45rem; text-align: center; }
  .hero-rating > span:last-child { align-items: center; }
  .rating-stars { font-size: .76rem; letter-spacing: .05em; }
  .updated-stat { flex-direction: column; text-align: center; }
  .updated-stat > span:last-child { align-items: center; }
  .section-heading h2,.feature-heading h2,.update-copy h2 { font-size: clamp(3rem,14vw,4.6rem); }
  .filter-row { flex-wrap: nowrap; overflow-x: auto; padding-bottom: .35rem; }
  .filter-chip { flex: 0 0 auto; }
  .card-body { padding: 1rem; }
  .runtime-grid { grid-template-columns: repeat(2,1fr); }
  .runtime-cell { border-bottom: 1px solid var(--line-soft); }
  .runtime-cell:nth-child(even) { border-right: 0; }
  .runtime-cell:nth-child(n+3) { border-bottom: 0; }
  .card-visual { aspect-ratio: 4/3; }
  .menu-ui,
  .menu-ui.right {
    left: 4%;
    right: auto;
    top: 9%;
    width: 76%;
    min-width: 0;
    transform: none;
  }
  .card-title-row h3 { font-size: 1.55rem; }
  .card-footer { gap: .65rem; }
  .card-numbers { flex-direction: column; gap: .25rem; }
  .update-card dl { grid-template-columns: 1fr; }
  .update-card dl div { border-right: 0; }
  .product-dialog form { padding: 1.3rem; }
  .dialog-product-head { align-items: flex-start; }
  .product-dialog h2 { font-size: 1.55rem; }
  .dialog-stats { grid-template-columns: 1fr; }
  .dialog-stats > span { border-right: 0; border-bottom: 1px solid var(--line); }
  .dialog-stats > span:last-child { border-bottom: 0; }
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior:auto!important; transition-duration:.01ms!important; animation-duration:.01ms!important; }
}