@font-face {
  font-family: "Stratum2";
  src: url("assets/fonts/Stratum2-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Stratum2";
  src: url("assets/fonts/Stratum2-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Stratum2";
  src: url("assets/fonts/Stratum2-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Stratum2";
  src: url("assets/fonts/Stratum2-Black.woff2") format("woff2");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Stratum2 Condensed";
  src: url("assets/fonts/Stratum2-BlackCondensed.woff2") format("woff2");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --ink: #15171b;
  --ink-deep: #090c10;
  --ink-blue: #1e202f;
  --paper: #d8dad8;
  --white: #f2f2ed;
  --muted: #94999e;
  --orange: #ef9418;
  --orange-deep: #c86715;
  --blue: #4e9dc6;
  --rule: rgba(255, 255, 255, 0.16);
  --page: min(1200px, calc(100vw - 80px));
}

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  background: var(--ink);
}

body {
  margin: 0;
  color: var(--white);
  background: var(--ink);
  font-family: "Stratum2", "Arial Narrow", Arial, sans-serif;
  overflow-x: hidden;
}

::selection { color: var(--ink); background: var(--orange); }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, a { -webkit-tap-highlight-color: transparent; }

.page-width {
  width: var(--page);
  margin-inline: auto;
}

.scroll-progress {
  position: fixed;
  inset: 0 0 auto;
  z-index: 100;
  height: 2px;
  background: rgba(255, 255, 255, 0.08);
}

.scroll-progress span {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--orange);
  transform: scaleX(0);
  transform-origin: left;
}

.topbar {
  position: fixed;
  inset: 2px 0 auto;
  z-index: 90;
  min-height: 74px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 34px;
  padding-inline: max(34px, calc((100vw - 1280px) / 2));
  transition: background 180ms ease, backdrop-filter 180ms ease;
}

.topbar::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(5, 8, 12, 0.76), transparent);
  pointer-events: none;
}

.topbar.is-scrolled {
  background: rgba(13, 16, 20, 0.9);
  backdrop-filter: blur(12px);
}

.mini-brand {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.mini-brand img { display: block; flex: 0 0 auto; object-fit: contain; }
.mini-brand .brand-cs2 { width: 88px; height: 38px; }
.mini-brand .brand-danger-zone { width: 58px; height: 49px; }

.mini-brand strong {
  font-family: "Stratum2 Condensed", sans-serif;
  font-size: 31px;
  line-height: 0.8;
  letter-spacing: -0.04em;
  transform: skew(-7deg);
}

.mini-brand i {
  width: 1px;
  height: 29px;
  background: rgba(255, 255, 255, 0.5);
  transform: skew(-12deg);
}

.mini-brand span {
  font-size: 8px;
  font-weight: 900;
  line-height: 0.82;
  letter-spacing: 0.19em;
}

.topbar-status {
  display: flex;
  align-items: center;
  gap: 13px;
  color: rgba(255, 255, 255, 0.64);
  font-size: 10px;
  letter-spacing: 0.12em;
}

.topbar-status span {
  padding: 6px 8px 5px;
  color: var(--ink);
  background: var(--orange);
  font-weight: 900;
}

.topbar-status strong { font-weight: 500; }

.nav {
  display: flex;
  align-items: center;
  gap: 29px;
  justify-self: end;
}

.nav a {
  position: relative;
  padding-block: 10px;
  color: rgba(255, 255, 255, 0.78);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
}

.nav a::after {
  content: "";
  position: absolute;
  inset: auto 0 4px;
  height: 2px;
  background: var(--orange);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 160ms ease;
}

.nav a:hover::after,
.nav a:focus-visible::after {
  transform: scaleX(1);
  transform-origin: left;
}

.play-free {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 0 17px;
  color: #fff;
  background: var(--blue);
  box-shadow: 0 4px 15px rgba(12, 47, 66, 0.24);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.11em;
  transition: background 160ms ease, transform 160ms ease;
}

.play-free svg { width: 18px; height: 18px; fill: currentColor; }
.play-free:hover, .play-free:focus-visible { background: #64b0d7; transform: translateY(-1px); }

.hero {
  position: relative;
  min-height: 880px;
  height: 100svh;
  isolation: isolate;
  overflow: hidden;
  background: #1b242c;
}

.hero-art,
.hero-shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.hero-art {
  z-index: -3;
  max-width: none;
  object-fit: cover;
  object-position: center;
  animation: hero-drift 18s ease-in-out infinite alternate;
}

.hero-shade {
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(7, 11, 15, 0.87) 0%, rgba(7, 11, 15, 0.48) 39%, transparent 72%),
    linear-gradient(0deg, rgba(8, 11, 15, 0.98) 0%, transparent 38%, rgba(8, 11, 15, 0.1) 72%);
}

.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: 0.16;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.2'/%3E%3C/svg%3E");
  pointer-events: none;
}

@keyframes hero-drift { to { transform: scale(1.025); } }

.hero-content {
  position: relative;
  z-index: 1;
  padding-top: clamp(150px, 18vh, 210px);
}

.cs2-logo {
  width: clamp(240px, 25vw, 365px);
  filter: brightness(0) invert(1);
  opacity: 0.92;
}

.release-tag,
.eyebrow {
  margin: 31px 0 17px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.release-tag {
  display: flex;
  align-items: center;
  gap: 11px;
  color: rgba(255, 255, 255, 0.72);
}

.release-tag span {
  width: 7px;
  height: 7px;
  background: var(--orange);
  transform: rotate(45deg);
}

.hero h1,
.overview h2,
.intel-card h2,
.systems-heading h2,
.loadout h2,
.finale h2 {
  margin: 0;
  font-family: "Stratum2 Condensed", "Arial Narrow", sans-serif;
  font-weight: 900;
  letter-spacing: -0.02em;
  line-height: 0.78;
  text-transform: uppercase;
}

.hero h1 {
  font-size: clamp(104px, 12vw, 178px);
  text-shadow: 0 5px 22px rgba(0, 0, 0, 0.34);
}

.hero h1 em {
  color: var(--orange);
  font-style: normal;
}

.hero-quote {
  margin: 27px 0 0;
  color: rgba(255, 255, 255, 0.7);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.hero-meta {
  position: absolute;
  inset: auto 0 33px;
  display: flex;
  gap: 34px;
  color: rgba(255, 255, 255, 0.46);
  font-size: 9px;
  letter-spacing: 0.16em;
}

.hero-meta span + span::before {
  content: "/";
  margin-right: 34px;
  color: var(--orange);
}

.feature-banner {
  position: absolute;
  z-index: 2;
  inset: auto max(6vw, calc((100vw - 1200px) / 2)) 78px auto;
  width: min(620px, 45vw);
  min-height: 128px;
  display: grid;
  grid-template-columns: 210px 1fr 54px;
  align-items: stretch;
  background: var(--orange);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.32);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 22px 100%);
  transition: transform 180ms ease, filter 180ms ease;
}

.feature-banner:hover,
.feature-banner:focus-visible { transform: translateY(-4px); filter: brightness(1.05); }

.banner-image {
  position: relative;
  overflow: hidden;
  clip-path: polygon(0 0, 100% 0, 74% 100%, 0 100%);
}

.banner-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 15% center;
  filter: saturate(.75) contrast(1.08);
}

.banner-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 12px 18px;
  color: var(--ink-blue);
}

.banner-copy small { font-size: 12px; font-weight: 700; letter-spacing: 0.07em; }
.banner-copy strong { font-family: "Stratum2 Condensed"; font-size: clamp(32px, 3.4vw, 48px); line-height: 0.9; }
.banner-arrow { display: grid; place-items: center; color: var(--ink-blue); font-size: 52px; }

.dark-section {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px),
    var(--ink-deep);
  background-size: 160px 100%;
}

.overview {
  padding: 190px 0 120px;
}

.overview-grid {
  display: grid;
  grid-template-columns: 150px 1fr 0.8fr;
  gap: clamp(38px, 6vw, 86px);
  align-items: end;
}

.section-label {
  align-self: start;
  padding-top: 9px;
  color: var(--orange);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.22em;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}

.section-label::before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 58px;
  margin-bottom: 16px;
  background: var(--orange);
}

.eyebrow { color: var(--orange); }
.overview .eyebrow { margin-top: 0; }
.overview h2 { font-size: clamp(70px, 8.5vw, 122px); }
.overview h2 span { color: var(--orange); }

.overview-copy {
  padding-bottom: 7px;
}

.overview-copy p {
  color: var(--muted);
  font-size: 15px;
  line-height: 1.7;
}

.overview-copy .lead {
  color: var(--white);
  font-size: 24px;
  font-weight: 500;
  line-height: 1.35;
}

.text-link {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  margin-top: 19px;
  padding-bottom: 5px;
  border-bottom: 2px solid var(--orange);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.16em;
}

.text-link span { color: var(--orange); font-size: 18px; transition: transform 160ms ease; }
.text-link:hover span, .text-link:focus-visible span { transform: translateX(4px); }

.mode-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  margin-top: 100px;
  background: rgba(255, 255, 255, 0.12);
  border-block: 1px solid rgba(255, 255, 255, 0.12);
}

.mode-strip article {
  position: relative;
  min-height: 210px;
  padding: 32px;
  background: var(--ink-deep);
}

.mode-strip strong {
  color: var(--orange);
  font-size: 11px;
  letter-spacing: 0.14em;
}

.mode-strip span {
  display: block;
  margin-top: 48px;
  font-family: "Stratum2 Condensed";
  font-size: 27px;
  font-weight: 900;
  letter-spacing: 0.04em;
}

.mode-strip p {
  max-width: 290px;
  margin: 10px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.intel {
  position: relative;
  padding: 110px 0 130px;
  background: #202328;
}

.intel-frame {
  position: relative;
  min-height: 660px;
  box-shadow: 0 26px 70px rgba(0, 0, 0, 0.38);
}

.intel-frame > img {
  width: 100%;
  min-height: 660px;
  object-fit: cover;
}

.intel-card {
  position: absolute;
  inset: auto auto -45px 55px;
  width: min(450px, calc(100% - 80px));
  padding: 38px 42px 35px;
  color: var(--ink-blue);
  background: rgba(230, 231, 227, 0.96);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 22px), calc(100% - 22px) 100%, 0 100%);
}

.intel-card > span {
  color: var(--orange-deep);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.18em;
}

.intel-card h2 {
  margin-top: 17px;
  font-size: clamp(57px, 6vw, 86px);
}

.intel-card p {
  margin: 23px 0;
  color: #5d6165;
  font-size: 14px;
  line-height: 1.55;
}

.intel-card a {
  display: flex;
  justify-content: space-between;
  padding-top: 14px;
  border-top: 1px solid rgba(30, 32, 47, 0.26);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
}

.intel-card a b { color: var(--orange-deep); font-size: 22px; line-height: 0.5; }

.intel-badge {
  position: absolute;
  inset: 20px 20px auto auto;
  width: 74px;
  height: 74px;
  display: grid;
  place-content: center;
  color: var(--ink-blue);
  background: var(--orange);
  font-size: 10px;
  font-weight: 700;
  line-height: 0.9;
  text-align: center;
  transform: rotate(3deg);
}

.intel-badge strong { font-size: 25px; }

.systems {
  padding: 160px 0;
  color: var(--ink-blue);
  background: var(--paper);
}

.systems-heading {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  align-items: end;
  gap: 60px;
}

.systems-heading .eyebrow { grid-column: 1 / -1; margin-bottom: -24px; color: var(--orange-deep); }
.systems-heading h2 { font-size: clamp(68px, 8vw, 112px); }
.systems-heading > p:last-child { max-width: 440px; margin: 0 0 8px; color: #61666a; font-size: 17px; line-height: 1.55; }

.systems-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 82px;
}

.systems-grid article {
  position: relative;
  min-height: 390px;
  padding: 27px 30px 34px;
  background: #c9ccca;
  overflow: hidden;
}

.systems-grid article::after {
  content: "";
  position: absolute;
  inset: 0;
  border-top: 5px solid transparent;
  transition: border-color 160ms ease;
}

.systems-grid article:hover::after { border-color: var(--orange); }
.system-number { color: #7d8285; font-size: 10px; font-weight: 700; letter-spacing: 0.14em; }

.system-icon {
  position: relative;
  width: 128px;
  height: 128px;
  margin: 48px 0 34px;
}

.system-icon svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: var(--ink-blue);
  stroke-width: 2.5;
}

.system-icon svg .accent { fill: var(--orange-deep); stroke: var(--orange-deep); }
.system-icon svg .fill { fill: var(--ink-blue); }

.systems-grid h3 { margin: 0; font-family: "Stratum2 Condensed"; font-size: 28px; letter-spacing: 0.04em; }
.systems-grid p { margin: 11px 0 0; color: #64696d; font-size: 13px; line-height: 1.55; }

.skins {
  padding: 150px 0;
  background:
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px),
    var(--ink-deep);
  background-size: 160px 100%;
}

.skins-heading {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  align-items: end;
  gap: 80px;
}

.skins-heading .eyebrow { margin-top: 0; }
.skins-heading h2 {
  margin: 0;
  font-family: "Stratum2 Condensed";
  font-size: clamp(74px, 8.4vw, 118px);
  line-height: .79;
}

.skins-heading h2 span { color: var(--orange); }
.skins-heading > p { max-width: 470px; margin: 0 0 8px; color: var(--muted); font-size: 16px; line-height: 1.62; }

.knife-showcase { margin-top: 80px; }

.knife-stage {
  position: relative;
  height: min(690px, 56vw);
  min-height: 520px;
  overflow: hidden;
  background: #202328;
  box-shadow: 0 25px 70px rgba(0,0,0,.4);
}

.knife-stage > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 160ms ease;
}

.knife-stage > img.is-portrait { object-fit: contain; background: #171b20; }

.knife-stage-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(8,11,15,.88), rgba(8,11,15,.3) 42%, transparent 70%), linear-gradient(0deg, rgba(8,11,15,.65), transparent 46%);
  pointer-events: none;
}

.knife-stage-copy {
  position: absolute;
  inset: 50% auto auto 54px;
  transform: translateY(-50%);
}

.knife-stage-copy > span { color: var(--orange); font-size: 10px; font-weight: 700; letter-spacing: .2em; }
.knife-stage-copy h3 { margin: 17px 0 20px; font-family: "Stratum2 Condensed"; font-size: clamp(70px, 8vw, 112px); line-height: .78; }
.knife-stage-copy p { margin: 0; color: rgba(255,255,255,.6); font-size: 11px; font-weight: 700; letter-spacing: .17em; }

.inspect-button {
  position: absolute;
  inset: auto 24px 24px auto;
  min-width: 138px;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  padding: 0 16px;
  border: 0;
  color: var(--ink-blue);
  background: var(--orange);
  font: 700 10px/1 "Stratum2";
  letter-spacing: .14em;
  cursor: zoom-in;
}

.knife-variants {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 1px;
  margin-top: 1px;
  background: rgba(255,255,255,.12);
}

.knife-variants button {
  position: relative;
  height: 132px;
  overflow: hidden;
  padding: 0;
  border: 0;
  background: #202328;
  cursor: pointer;
}

.knife-variants button::after {
  content: "";
  position: absolute;
  inset: 0;
  border-bottom: 4px solid transparent;
  transition: border-color 160ms ease, background 160ms ease;
}

.knife-variants button.active::after { border-color: var(--orange); background: rgba(239,148,24,.08); }
.knife-variants img { width: 100%; height: 100%; object-fit: cover; object-position: center 24%; filter: saturate(.72); transition: transform 250ms ease, filter 180ms ease; }
.knife-variants button:hover img, .knife-variants button:focus-visible img, .knife-variants button.active img { transform: scale(1.06); filter: saturate(1); }
.knife-variants span { position: absolute; z-index: 2; inset: auto 10px 9px auto; color: #fff; font-size: 9px; font-weight: 700; }

.skin-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  grid-auto-rows: 370px;
  gap: 12px;
  margin-top: 88px;
}

.skin-card {
  position: relative;
  overflow: hidden;
  padding: 0;
  border: 0;
  background: #202328;
  cursor: zoom-in;
  text-align: left;
}

.skin-card img { width: 100%; height: 100%; object-fit: cover; transition: transform 600ms cubic-bezier(.2,.7,.2,1), filter 300ms ease; }
.skin-card:hover img, .skin-card:focus-visible img { transform: scale(1.035); filter: saturate(1.08); }
.skin-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(7,10,13,.9), transparent 58%); pointer-events: none; }
.skin-meta { position: absolute; z-index: 2; inset: auto auto 25px 27px; display: grid; gap: 7px; }
.skin-meta small { color: var(--orange); font-size: 9px; font-weight: 700; letter-spacing: .17em; }
.skin-meta strong { font-family: "Stratum2 Condensed"; font-size: 28px; letter-spacing: .04em; }
.skin-card > i { position: absolute; z-index: 2; inset: 21px 21px auto auto; width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.65); border-radius: 50%; font-size: 19px; font-style: normal; transition: background 160ms ease, border-color 160ms ease, transform 160ms ease; }
.skin-card:hover > i, .skin-card:focus-visible > i { background: var(--orange); border-color: var(--orange); transform: rotate(90deg); }

.transmission {
  position: relative;
  min-height: 820px;
  display: flex;
  align-items: center;
  padding-top: 74px;
  isolation: isolate;
  overflow: hidden;
  background: #0a0d11;
}

.transmission-video,
.transmission-shade {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
}

.transmission-video { max-width: none; object-fit: cover; filter: saturate(.7) contrast(1.08) brightness(.72); }
.transmission-shade { z-index: -1; background: linear-gradient(90deg, rgba(6,9,12,.94), rgba(6,9,12,.54) 48%, rgba(6,9,12,.12)), linear-gradient(0deg, rgba(6,9,12,.84), transparent 45%); }
.transmission-content { position: relative; z-index: 1; padding-bottom: 72px; }
.transmission-content .eyebrow { color: var(--orange); }
.transmission h2 { margin: 0; font-family: "Stratum2 Condensed"; font-size: clamp(84px, 10vw, 146px); line-height: .78; }
.transmission-content > p:not(.eyebrow) { max-width: 580px; color: rgba(255,255,255,.67); font-size: 16px; line-height: 1.6; }

.transmission-actions { position: absolute; z-index: 2; inset: auto auto 28px max(28px, calc((100vw - 1200px) / 2)); display: flex; flex-wrap: wrap; gap: 7px; }
.transmission-actions button { min-width: 96px; min-height: 36px; display: inline-flex; align-items: center; justify-content: space-between; gap: 13px; padding: 0 11px; border: 1px solid rgba(255,255,255,.34); color: #fff; background: rgba(9,12,16,.5); font: 700 8px/1 "Stratum2"; letter-spacing: .13em; cursor: pointer; backdrop-filter: blur(7px); }
.transmission-actions button:hover, .transmission-actions button:focus-visible { border-color: var(--orange); }
.transmission-actions button[aria-pressed="true"] { color: var(--ink-blue); background: var(--orange); border-color: var(--orange); }
.transmission-actions b { font-size: 13px; }

.transmission-speed { position: absolute; inset: auto 38px 34px auto; display: grid; justify-items: end; color: rgba(255,255,255,.4); }
.transmission-speed span { font-size: 8px; letter-spacing: .18em; }
.transmission-speed strong { color: rgba(255,255,255,.72); font-family: "Stratum2 Condensed"; font-size: 48px; line-height: .8; }

.skin-dialog {
  width: min(1180px, calc(100vw - 30px));
  max-width: none;
  max-height: calc(100svh - 30px);
  padding: 0;
  border: 1px solid rgba(255,255,255,.16);
  color: var(--white);
  background: rgba(8,11,15,.97);
  box-shadow: 0 30px 100px rgba(0,0,0,.78);
}

.skin-dialog::backdrop { background: rgba(0,0,0,.88); backdrop-filter: blur(9px); }
.skin-dialog figure { margin: 0; }
.skin-dialog img { width: 100%; max-height: calc(100svh - 98px); object-fit: contain; background: #080b0f; }
.skin-dialog figcaption { padding: 18px 22px; color: rgba(255,255,255,.65); font-size: 10px; font-weight: 700; letter-spacing: .15em; }
.skin-dialog-close { position: fixed; z-index: 3; top: 22px; right: 22px; width: 44px; height: 44px; padding: 0; border: 1px solid rgba(255,255,255,.5); border-radius: 50%; color: #fff; background: rgba(0,0,0,.62); font-size: 27px; cursor: pointer; }

.captcha-dialog {
  width: min(480px, calc(100vw - 24px));
  max-width: none;
  padding: 0;
  color: #e7e3d9;
  background: transparent;
  border: 0;
  overflow: visible;
}

.captcha-dialog::backdrop { background: rgba(4,6,8,.84); backdrop-filter: blur(6px); }
.captcha-shell {
  position: relative;
  overflow: hidden;
  padding: 34px 28px 20px;
  background: radial-gradient(circle at 20% 0, rgba(104,28,24,.12), transparent 32%), #090b0c;
  border: 1px solid #4a4638;
  box-shadow: 0 26px 80px rgba(0,0,0,.68), inset 0 0 0 8px #0d0f10, inset 0 0 0 9px #292a24;
}
.captcha-shell::after { content: ""; position: absolute; inset: 0 18% auto; height: 2px; background: linear-gradient(90deg, transparent, #c92d30, transparent); box-shadow: 0 0 16px rgba(201,45,48,.52); }
.captcha-close {
  position: absolute;
  z-index: 3;
  top: 10px;
  right: 14px;
  width: 24px;
  height: 24px;
  padding: 0;
  color: #83898a;
  background: transparent;
  border: 0;
  font: 700 24px/1 Arial, sans-serif;
  cursor: pointer;
}
.captcha-close:hover,
.captcha-close:focus-visible { color: #fff; }
.captcha-frame { position: relative; min-height: 96px; border: 1px solid #504d40; background: linear-gradient(100deg, rgba(255,255,255,.018), transparent 60%), #0b0d0e; }
.captcha-state { min-height: 94px; }
.captcha-state[hidden] { display: none; }
.captcha-ready,
.captcha-checking { display: flex; align-items: center; gap: 19px; padding: 18px 16px; }
.captcha-checkbox {
  flex: 0 0 35px;
  width: 35px;
  height: 35px;
  padding: 0;
  color: #fff;
  background: #17191a;
  border: 2px solid #8b887d;
  cursor: pointer;
  transition: border-color 150ms ease, background 150ms ease, box-shadow 150ms ease;
}
.captcha-checkbox:hover,
.captcha-checkbox:focus-visible { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(239,148,24,.12); }
.captcha-copy h2 { margin: 0 0 5px; color: #e8e6df; font: 600 15px/1.2 "Noto Sans SC", "Microsoft YaHei", sans-serif; letter-spacing: .03em; }
.captcha-copy p { margin: 0; color: #8a8881; font: 500 9px/1.35 "Noto Sans SC", "Microsoft YaHei", sans-serif; letter-spacing: .04em; }
.captcha-brand { margin-left: auto; padding-right: 9px; text-align: right; }
.captcha-brand img { display: block; width: 72px; height: 35px; margin-left: auto; object-fit: contain; }
.captcha-brand small { display: block; margin-top: 5px; color: #756942; font: 700 6px/1.35 "Noto Sans SC", sans-serif; letter-spacing: .14em; }
.captcha-spinner,
.captcha-alert-ring {
  flex: 0 0 auto;
  display: block;
  border-radius: 50%;
  background: conic-gradient(#d52c39, #d52c39 38%, #d7a746 64%, #d52c39 100%);
  -webkit-mask: radial-gradient(circle, transparent 54%, #000 57%);
  mask: radial-gradient(circle, transparent 54%, #000 57%);
  animation: captcha-spin 900ms linear infinite;
}
.captcha-spinner { width: 48px; height: 48px; margin-left: 2px; }
.captcha-checking .captcha-copy h2 { font-size: 16px; }
.captcha-help { padding: 18px 20px 16px; }
.captcha-help-heading { display: flex; align-items: center; gap: 12px; }
.captcha-alert-ring { width: 25px; height: 25px; }
.captcha-help-heading h2 { margin: 0 0 3px; color: #e6e2d9; font: 600 14px/1.2 "Noto Sans SC", "Microsoft YaHei", sans-serif; }
.captcha-help-heading p { margin: 0; color: #7e7c76; font: 500 8px/1.3 "Noto Sans SC", "Microsoft YaHei", sans-serif; }
.captcha-help ol { display: grid; gap: 12px; margin: 18px 0 16px; padding: 0; list-style: none; }
.captcha-help li { display: grid; grid-template-columns: 20px 1fr; align-items: start; gap: 8px; }
.captcha-help li > span { color: #b89c55; font: 700 12px/1.4 "Stratum2", sans-serif; }
.captcha-help li p { margin: 0; color: #b4b2aa; font: 500 11px/1.45 "Noto Sans SC", "Microsoft YaHei", sans-serif; }
.captcha-help .captcha-steps { gap: 14px; }
.captcha-help .captcha-steps li { align-items: center; }
.captcha-help .step-instruction {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}
.captcha-help .key-combo {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex: 0 0 auto;
  color: #e7e4dc;
  line-height: 1;
  white-space: nowrap;
}
.captcha-help .keycap {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 27px;
  height: 25px;
  margin: 0;
  padding: 0 7px;
  color: #f4f2eb;
  background: linear-gradient(180deg, #35383a 0%, #1b1e20 72%, #111315 100%);
  border: 1px solid #777972;
  border-bottom-color: #96978f;
  border-radius: 4px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 2px 0 #050606, 0 3px 5px rgba(0,0,0,.38);
  font: 700 10px/1 Arial, sans-serif;
  letter-spacing: 0;
  text-transform: none;
  vertical-align: middle;
}
.captcha-help .keycap-wide { min-width: 41px; }
.captcha-help .keycap-icon { width: 29px; padding: 0; }
.captcha-help .windows-key-icon {
  display: block;
  width: 15px;
  height: 15px;
  fill: currentColor;
}
.captcha-help .key-plus {
  display: inline-block;
  width: auto;
  margin: 0;
  color: #aaa79e;
  font: 700 12px/1 Arial, sans-serif;
}
.captcha-help .round-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  color: #7ee09b;
  background: rgba(65,176,100,.12);
  border: 1px solid #55bd75;
  border-radius: 50%;
  box-shadow: inset 0 0 0 2px rgba(85,189,117,.08);
  font: 700 13px/1 Arial, sans-serif;
}
.captcha-help .step-text { min-width: 0; color: #b4b2aa; }
.captcha-copy-warning { max-width: 190px; color: #b5a46c !important; }
.captcha-copy-panel { margin: 12px 0 0; padding: 12px; border: 1px solid #34362f; background: #07090a; box-shadow: inset 3px 0 0 rgba(239,148,24,.78); }
.captcha-copy-panel label { display: block; margin: 0 0 7px; color: #d0a34d; font: 700 9px/1.2 "Noto Sans SC", "Microsoft YaHei", sans-serif; letter-spacing: .12em; }
.captcha-copy-panel code { display: block; min-height: 44px; max-height: 92px; overflow: auto; padding: 10px; color: #e3e0d7; background: #101314; border: 1px solid #3e413a; font: 500 11px/1.45 ui-monospace, "SFMono-Regular", Consolas, monospace; white-space: pre-wrap; overflow-wrap: anywhere; user-select: text; }
.captcha-copy-panel > p { margin: 7px 0 0; color: #777871; font: 500 8px/1.4 "Noto Sans SC", "Microsoft YaHei", sans-serif; }
.captcha-copy-actions { display: flex; align-items: center; min-height: 14px; margin-top: 8px; }
.captcha-copy-actions span { color: #7d807b; font: 600 9px/1.3 "Noto Sans SC", "Microsoft YaHei", sans-serif; }
.captcha-copy-actions span.is-success { color: #66c982; }
.captcha-copy-actions span.is-error { color: #d78d6f; }
.captcha-retry { min-width: 112px; min-height: 38px; color: #e7e2d6; background: #0d0f10; border: 1px solid #8f793d; font: 600 12px/1 "Noto Sans SC", "Microsoft YaHei", sans-serif; cursor: pointer; }
.captcha-retry:hover,
.captcha-retry:focus-visible { color: #111; background: var(--orange); border-color: var(--orange); }
@keyframes captcha-spin { to { transform: rotate(1turn); } }

.loadout {
  position: relative;
  min-height: 820px;
  display: flex;
  align-items: center;
  isolation: isolate;
  overflow: hidden;
}

.loadout-art,
.loadout-overlay {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
}

.loadout-art { max-width: none; object-fit: cover; transition: opacity 180ms ease; }
.loadout-overlay { z-index: -1; background: linear-gradient(90deg, rgba(10, 13, 16, 0.94), rgba(10, 13, 16, 0.55) 42%, transparent 68%); }

.loadout-content {
  display: block;
}

.loadout-copy { max-width: 620px; }
.loadout-copy .eyebrow { color: var(--orange); }
.loadout h2 { font-size: clamp(82px, 9.6vw, 138px); }
.loadout[data-loadout-carousel] h2 { font-size: clamp(70px, 7.4vw, 112px); }
.loadout-copy > p:last-child { max-width: 520px; color: rgba(255,255,255,.69); font-size: 16px; line-height: 1.65; }

.loadout[data-loadout-carousel] { background: radial-gradient(circle at 78% 50%, #2c3034 0, #171b1f 44%, #0c1014 78%); }
.loadout[data-loadout-carousel] .loadout-art {
  inset: 50% clamp(28px, 5vw, 86px) auto auto;
  width: min(48vw, 680px);
  height: min(64vh, 540px);
  object-fit: contain;
  object-position: center;
  transform: translateY(-50%);
  border: 1px solid rgba(255,255,255,.12);
  background: #24282c;
  box-shadow: 0 24px 70px rgba(0,0,0,.42);
}
.loadout[data-loadout-carousel] .loadout-overlay {
  background: linear-gradient(90deg, rgba(8,11,15,.98) 0%, rgba(8,11,15,.88) 35%, rgba(8,11,15,.22) 63%, rgba(8,11,15,.08) 100%);
}

.loadout-compact-controls {
  position: absolute;
  right: clamp(28px, 5vw, 86px);
  top: calc(50% + min(32vh, 270px) + 18px);
  bottom: auto;
  z-index: 3;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  width: min(48vw, 680px);
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  backdrop-filter: none;
}
.loadout-dots { display: flex; gap: 5px; }
.loadout-dots button,
.loadout-arrow {
  width: 40px;
  height: 38px;
  display: grid;
  place-items: center;
  padding: 0;
  color: rgba(255,255,255,.62);
  background: #1c2025;
  border: 1px solid rgba(255,255,255,.1);
  cursor: pointer;
  transition: color 150ms ease, background 150ms ease, border-color 150ms ease, transform 150ms ease;
}
.loadout-dots button span { font-size: 9px; font-weight: 800; letter-spacing: .1em; }
.loadout-dots button:hover,
.loadout-dots button:focus-visible,
.loadout-arrow:hover,
.loadout-arrow:focus-visible { color: #fff; border-color: rgba(239,148,24,.75); transform: translateY(-1px); }
.loadout-dots button.active { color: #181b20; background: var(--orange); border-color: var(--orange); }
.loadout-arrow { width: 44px; color: #fff; font: 700 20px/1 "Stratum2"; }

.loadout-card {
  padding: 28px;
  color: var(--ink-blue);
  background: rgba(237, 238, 233, 0.94);
  border-top: 6px solid var(--orange);
}

.loadout-card small { display: block; font-size: 9px; font-weight: 700; letter-spacing: .14em; }
.loadout-card strong { display: block; margin: 23px 0 7px; font-family: "Stratum2 Condensed"; font-size: 49px; line-height: .9; }
.loadout-card span { color: #62666a; font-size: 10px; letter-spacing: .11em; }

.finale {
  position: relative;
  min-height: 760px;
  display: grid;
  place-items: center;
  overflow: hidden;
  background:
    radial-gradient(circle at center, rgba(239, 148, 24, 0.19), transparent 35%),
    var(--ink-deep);
}

.finale-grid {
  position: absolute;
  inset: -30%;
  opacity: 0.26;
  background-image:
    linear-gradient(rgba(239,148,24,.27) 1px, transparent 1px),
    linear-gradient(90deg, rgba(239,148,24,.27) 1px, transparent 1px);
  background-size: 80px 80px;
  transform: perspective(560px) rotateX(58deg) translateY(22%);
}

.finale-content {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  text-align: center;
}

.finale-content > img { width: 250px; filter: brightness(0) invert(1); opacity: .78; }
.finale-content > p { margin: 36px 0 15px; color: var(--orange); font-size: 11px; font-weight: 700; letter-spacing: .24em; }
.finale h2 { font-size: clamp(86px, 11vw, 158px); }

.primary-button {
  min-width: 245px;
  min-height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 25px;
  margin-top: 35px;
  padding: 0 22px;
  color: var(--ink-blue);
  background: var(--orange);
  clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .13em;
  transition: filter 160ms ease, transform 160ms ease;
}

.primary-button:hover, .primary-button:focus-visible { filter: brightness(1.08); transform: translateY(-2px); }

footer {
  padding: 44px 0;
  color: rgba(255,255,255,.48);
  background: #05070a;
  border-top: 1px solid rgba(255,255,255,.1);
}

.footer-grid {
  display: grid;
  grid-template-columns: .7fr 1.4fr .7fr;
  align-items: center;
  gap: 45px;
}

.footer-brand { color: var(--white); font-family: "Stratum2 Condensed"; font-size: 19px; font-weight: 900; letter-spacing: .08em; }
.footer-brand span { color: var(--orange); }
.footer-grid p { margin: 0; font-size: 9px; line-height: 1.55; }
.footer-links { display: grid; justify-items: end; gap: 9px; font-size: 9px; letter-spacing: .1em; }
.footer-links a { color: var(--white); }
.footer-links a:hover { color: var(--orange); }

[data-reveal] {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 680ms ease, transform 680ms cubic-bezier(.2,.72,.2,1);
}

[data-reveal].visible { opacity: 1; transform: translateY(0); }

:focus-visible { outline: 2px solid #b9e6ff; outline-offset: 4px; }

@media (max-width: 1000px) {
  :root { --page: min(calc(100vw - 44px), 920px); }
  .topbar { grid-template-columns: auto 1fr auto; padding-inline: 22px; }
  .topbar-status { display: none; }
  .hero { min-height: 820px; }
  .feature-banner { width: min(570px, calc(100vw - 44px)); right: 22px; }
  .overview-grid { grid-template-columns: 50px 1fr; }
  .overview-copy { grid-column: 2; max-width: 650px; }
  .systems-heading { grid-template-columns: 1fr; }
  .systems-heading .eyebrow { margin-bottom: -30px; }
  .systems-grid { grid-template-columns: 1fr; }
  .systems-grid article { min-height: 280px; display: grid; grid-template-columns: 150px 1fr; align-items: center; column-gap: 35px; }
  .systems-grid .system-number { position: absolute; top: 24px; right: 24px; }
  .system-icon { grid-row: span 2; margin: 0; }
  .systems-grid h3 { align-self: end; }
  .systems-grid p { align-self: start; max-width: 480px; }
  .skins-heading { grid-template-columns: 1fr; gap: 28px; }
  .knife-variants { grid-template-columns: repeat(4, 1fr); }
  .knife-variants button { height: 150px; }
  .loadout-card { width: 320px; }
  .loadout[data-loadout-carousel] .loadout-art { width: min(47vw, 560px); }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-links { justify-items: start; }
}

@media (max-width: 720px) {
  :root { --page: calc(100vw - 30px); }
  .topbar { min-height: 64px; grid-template-columns: auto 1fr; gap: 15px; padding-inline: 15px; }
  .mini-brand .brand-cs2 { width: 65px; height: 31px; }
  .mini-brand .brand-danger-zone { width: 49px; height: 36px; }
  .nav { display: none; }
  .play-free { justify-self: end; min-height: 40px; padding-inline: 12px; font-size: 10px; }
  .play-free svg { width: 16px; }
  .hero { min-height: 780px; height: 100svh; }
  .hero-art { object-position: 60% center; }
  .hero-shade { background: linear-gradient(90deg, rgba(7,11,15,.82), rgba(7,11,15,.15)), linear-gradient(0deg, rgba(7,11,15,.96), transparent 50%); }
  .hero-content { padding-top: 135px; }
  .cs2-logo { width: 210px; }
  .release-tag { font-size: 8px; }
  .hero h1 { font-size: clamp(86px, 27vw, 120px); }
  .hero-quote { font-size: 14px; }
  .hero-meta { bottom: 27px; gap: 12px; font-size: 7px; }
  .hero-meta span + span::before { margin-right: 12px; }
  .feature-banner { bottom: 73px; left: 15px; right: auto; width: calc(100vw - 30px); min-height: 102px; grid-template-columns: 116px 1fr 35px; }
  .banner-copy { padding-inline: 8px; }
  .banner-copy small { font-size: 8px; }
  .banner-copy strong { font-size: 29px; }
  .banner-arrow { font-size: 35px; }
  .overview { padding: 145px 0 90px; }
  .overview-grid { grid-template-columns: 1fr; }
  .section-label { display: none; }
  .overview-copy { grid-column: auto; }
  .overview h2, .systems-heading h2 { font-size: 68px; }
  .mode-strip { grid-template-columns: 1fr; margin-top: 65px; }
  .mode-strip article { min-height: 160px; }
  .mode-strip span { margin-top: 25px; }
  .intel { padding: 70px 0 120px; }
  .intel-frame, .intel-frame > img { min-height: 500px; }
  .intel-frame > img { object-position: 42% center; }
  .intel-card { left: 15px; bottom: -70px; width: calc(100% - 30px); padding: 29px; }
  .intel-card h2 { font-size: 59px; }
  .intel-badge { width: 58px; height: 58px; right: 10px; top: 10px; }
  .systems { padding: 130px 0 90px; }
  .systems-heading > p:last-child { font-size: 15px; }
  .systems-grid { margin-top: 55px; }
  .systems-grid article { min-height: 370px; display: block; }
  .system-icon { margin: 45px 0 30px; }
  .skins { padding: 100px 0; }
  .skins-heading h2 { font-size: 68px; }
  .knife-showcase { margin-top: 55px; }
  .knife-stage { min-height: 590px; height: 75vh; }
  .knife-stage > img { object-position: 64% center; }
  .knife-stage-copy { left: 24px; top: auto; bottom: 88px; transform: none; }
  .knife-stage-copy h3 { font-size: 67px; }
  .inspect-button { right: 14px; bottom: 14px; }
  .knife-variants { grid-template-columns: repeat(2, 1fr); }
  .knife-variants button { height: 170px; }
  .skin-grid { grid-template-columns: 1fr; grid-auto-rows: 300px; margin-top: 65px; }
  .skin-card-wide { min-height: 250px; }
  .transmission { min-height: 760px; }
  .transmission-video { object-position: 58% center; }
  .transmission h2 { font-size: 78px; }
  .transmission-actions { left: 15px; right: auto; bottom: 16px; flex-direction: row; align-items: center; }
  .transmission-actions button { width: auto; }
  .transmission-speed { display: none; }
  .loadout { min-height: 740px; }
  .loadout-art { object-position: 62% center; }
  .loadout-overlay { background: linear-gradient(90deg, rgba(10,13,16,.9), rgba(10,13,16,.35)), linear-gradient(0deg, rgba(10,13,16,.8), transparent 50%); }
  .loadout h2 { font-size: 78px; }
  .loadout-card { width: 100%; }
  .loadout[data-loadout-carousel] { min-height: 880px; align-items: flex-start; padding-top: 105px; }
  .loadout[data-loadout-carousel] h2 { font-size: 61px; }
  .loadout[data-loadout-carousel] .loadout-copy { max-width: 100%; }
  .loadout[data-loadout-carousel] .loadout-art {
    inset: auto 15px 95px;
    width: calc(100% - 30px);
    height: 330px;
    transform: none;
  }
  .loadout[data-loadout-carousel] .loadout-overlay { background: linear-gradient(180deg, rgba(8,11,15,.95) 0, rgba(8,11,15,.72) 45%, rgba(8,11,15,.16) 76%); }
  .loadout-compact-controls { top: auto; right: 15px; bottom: 28px; width: calc(100% - 30px); padding: 0; }
  .loadout-dots button { width: 34px; height: 34px; }
  .loadout-arrow { width: 38px; height: 34px; }
  .finale { min-height: 650px; }
  .finale h2 { font-size: 82px; }
  .skin-dialog-close { top: 12px; right: 12px; }
  .captcha-shell { padding: 32px 16px 16px; }
  .captcha-ready,
  .captcha-checking { gap: 13px; padding: 15px 12px; }
  .captcha-checkbox { flex-basis: 32px; width: 32px; height: 32px; }
  .captcha-copy h2 { font-size: 13px; }
  .captcha-brand { padding-right: 2px; }
  .captcha-brand img { width: 62px; height: 30px; }
  .captcha-help { padding: 16px 14px 14px; }
  .captcha-help li p { font-size: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  [data-reveal] { opacity: 1; transform: none; }
}

/* Cinnabar Edition: contemporary Chinese ceremonial art direction */
:root {
  --ink: #160d0a;
  --ink-deep: #080504;
  --ink-blue: #25140f;
  --paper: #d8c9a7;
  --white: #f4ead2;
  --muted: #aa9a7d;
  --orange: #c82028;
  --orange-deep: #851016;
  --blue: #a67a32;
  --gold: #d5ad5a;
  --gold-soft: rgba(213, 173, 90, .34);
  --lacquer: #741217;
  --jade: #658476;
}

body.huaxia-theme {
  background:
    radial-gradient(circle at 20% 5%, rgba(200, 32, 40, .12), transparent 27%),
    var(--ink-deep);
}

.huaxia-theme .scroll-progress { background: rgba(213, 173, 90, .16); }
.huaxia-theme .scroll-progress span { background: linear-gradient(90deg, var(--lacquer), var(--gold), var(--lacquer)); }

.huaxia-theme .topbar {
  border-bottom: 1px solid var(--gold-soft);
  background: linear-gradient(90deg, rgba(48, 5, 8, .94), rgba(10, 7, 5, .9) 58%, rgba(48, 5, 8, .94));
  box-shadow: 0 10px 32px rgba(0, 0, 0, .35);
}

.huaxia-theme .topbar::before {
  content: "";
  position: absolute;
  inset: auto 34px -5px;
  height: 3px;
  border-block: 1px solid rgba(213, 173, 90, .55);
  pointer-events: none;
}

.huaxia-theme .topbar::after { background: linear-gradient(180deg, rgba(79, 8, 12, .42), transparent); }
.huaxia-theme .topbar.is-scrolled { background: rgba(25, 7, 7, .95); }
.huaxia-theme .mini-brand strong { color: var(--gold); text-shadow: 2px 2px 0 var(--lacquer); }
.huaxia-theme .mini-brand i { background: var(--gold); }
.huaxia-theme .topbar-status span { color: var(--gold); background: var(--lacquer); border: 1px solid var(--gold-soft); }
.huaxia-theme .topbar-status strong { color: var(--gold); }
.huaxia-theme .nav a { color: rgba(244, 234, 210, .8); }
.huaxia-theme .nav a::after { background: var(--gold); }
.huaxia-theme .play-free { color: var(--gold); background: var(--lacquer); border: 1px solid var(--gold-soft); box-shadow: 0 4px 18px rgba(70, 4, 9, .45); }
.huaxia-theme .play-free:hover,
.huaxia-theme .play-free:focus-visible { color: #20100b; background: var(--gold); }

.huaxia-theme .eyebrow { color: var(--gold); }
.huaxia-theme .section-label { color: var(--gold); }
.huaxia-theme .section-label::before { width: 2px; background: var(--lacquer); box-shadow: 4px 0 0 var(--gold); }

.huaxia-theme .transmission {
  background: #090403;
  border-bottom: 8px solid var(--lacquer);
  box-shadow: inset 0 -1px 0 var(--gold);
}

.huaxia-theme .transmission::before {
  content: "";
  position: absolute;
  inset: 96px 24px 24px;
  z-index: 2;
  border: 1px solid rgba(213, 173, 90, .62);
  box-shadow: inset 0 0 0 6px rgba(116, 18, 23, .28);
  pointer-events: none;
}

.huaxia-theme .transmission::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 96px 24px 24px auto;
  width: 76px;
  opacity: .46;
  background:
    linear-gradient(45deg, transparent 42%, var(--gold) 43% 47%, transparent 48%) 0 0 / 28px 28px,
    linear-gradient(-45deg, transparent 42%, var(--gold) 43% 47%, transparent 48%) 0 0 / 28px 28px,
    linear-gradient(var(--lacquer), var(--lacquer));
  border-left: 1px solid var(--gold-soft);
  pointer-events: none;
}

.huaxia-theme .transmission-video { filter: sepia(.22) saturate(.66) contrast(1.15) brightness(.62); }
.huaxia-theme .transmission-shade {
  background:
    linear-gradient(90deg, rgba(19, 4, 3, .96), rgba(52, 5, 8, .68) 43%, rgba(8, 5, 3, .28) 75%),
    linear-gradient(0deg, rgba(18, 3, 4, .94), transparent 48%);
}

.huaxia-theme .transmission-content {
  padding-left: 38px;
  border-left: 3px solid var(--gold);
  filter: drop-shadow(0 12px 20px rgba(0, 0, 0, .28));
}

.huaxia-theme .transmission-content::before {
  content: "DZ";
  position: absolute;
  left: -22px;
  top: -55px;
  width: 43px;
  height: 43px;
  display: grid;
  place-items: center;
  color: var(--gold);
  background: var(--lacquer);
  border: 1px solid var(--gold);
  font: 900 12px/1 "Stratum2 Condensed";
  letter-spacing: .08em;
}

.huaxia-theme .transmission-content .eyebrow { color: var(--gold); }
.huaxia-theme .transmission h2 { color: var(--white); text-shadow: 5px 5px 0 rgba(116, 18, 23, .76); }
.huaxia-theme .transmission-content > p:not(.eyebrow) { color: rgba(244, 234, 210, .68); }
.huaxia-theme .beta-entry-wrap { width: min(690px, 72%); display: flex; justify-content: center; margin-top: 38px; }
.huaxia-theme .beta-entry {
  position: relative;
  width: min(520px, 100%);
  min-height: 82px;
  display: grid;
  grid-template-columns: 54px 1fr 28px;
  align-items: center;
  gap: 18px;
  padding: 10px 20px 10px 12px;
  color: var(--gold);
  background: linear-gradient(100deg, rgba(73, 6, 10, .94), rgba(116, 18, 23, .96));
  border: 1px solid var(--gold);
  box-shadow: inset 0 0 0 5px rgba(213, 173, 90, .08), 10px 10px 0 rgba(12, 3, 3, .5);
  transition: color 180ms ease, background 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}
.huaxia-theme .beta-entry::before,
.huaxia-theme .beta-entry::after { content: ""; position: absolute; width: 18px; height: 18px; pointer-events: none; }
.huaxia-theme .beta-entry::before { inset: -5px auto auto -5px; border-top: 2px solid var(--gold); border-left: 2px solid var(--gold); }
.huaxia-theme .beta-entry::after { inset: auto -5px -5px auto; border-right: 2px solid var(--gold); border-bottom: 2px solid var(--gold); }
.huaxia-theme .beta-entry-seal { width: 54px; height: 54px; display: grid; place-items: center; color: var(--gold); background: #5e0a0f; border: 1px solid var(--gold); font: 900 27px/1 "Noto Serif SC", "Songti SC", STSong, serif; }
.huaxia-theme .beta-entry-copy { display: grid; gap: 6px; }
.huaxia-theme .beta-entry-copy small { color: rgba(244, 234, 210, .58); font-size: 8px; font-weight: 700; letter-spacing: .18em; }
.huaxia-theme .beta-entry-copy strong { font: 900 22px/1 "Noto Serif SC", "Source Han Serif SC", "Songti SC", STSong, serif; letter-spacing: .12em; }
.huaxia-theme .beta-entry > b { font: 400 37px/1 "Stratum2"; text-align: right; }
.huaxia-theme .beta-entry:hover,
.huaxia-theme .beta-entry:focus-visible { color: #29150d; background: var(--gold); transform: translateY(-3px); box-shadow: inset 0 0 0 5px rgba(116, 18, 23, .1), 12px 12px 0 var(--lacquer); }
.huaxia-theme .beta-entry:hover .beta-entry-seal,
.huaxia-theme .beta-entry:focus-visible .beta-entry-seal { color: var(--gold); background: var(--lacquer); }
.huaxia-theme .beta-entry:hover .beta-entry-copy small,
.huaxia-theme .beta-entry:focus-visible .beta-entry-copy small { color: rgba(41, 21, 13, .68); }
.huaxia-theme .transmission-actions button { color: var(--gold); background: rgba(80, 8, 12, .82); border-color: rgba(213, 173, 90, .62); }
.huaxia-theme .transmission-actions button:hover,
.huaxia-theme .transmission-actions button:focus-visible,
.huaxia-theme .transmission-actions button[aria-pressed="true"] { color: #1b0d09; background: var(--gold); border-color: var(--gold); }
.huaxia-theme .transmission-speed { width: 82px; height: 82px; place-content: center; justify-items: center; color: rgba(244, 234, 210, .7); background: var(--lacquer); border: 1px solid var(--gold); box-shadow: inset 0 0 0 5px rgba(213, 173, 90, .13); }
.huaxia-theme .transmission-speed span { font-size: 7px; }
.huaxia-theme .transmission-speed strong { color: var(--gold); }

.huaxia-theme .dark-section,
.huaxia-theme .skins {
  background:
    linear-gradient(45deg, transparent 46%, rgba(213, 173, 90, .055) 47% 49%, transparent 50%) 0 0 / 36px 36px,
    linear-gradient(-45deg, transparent 46%, rgba(213, 173, 90, .055) 47% 49%, transparent 50%) 0 0 / 36px 36px,
    radial-gradient(circle at 75% 20%, rgba(116, 18, 23, .23), transparent 32%),
    var(--ink-deep);
}

.huaxia-theme .overview { position: relative; border-bottom: 1px solid var(--gold-soft); }
.huaxia-theme .overview::after,
.huaxia-theme .systems::after,
.huaxia-theme .skins::after {
  content: "";
  position: absolute;
  inset: auto 50% -9px auto;
  width: 17px;
  height: 17px;
  background: var(--lacquer);
  border: 1px solid var(--gold);
  transform: rotate(45deg);
}

.huaxia-theme .overview h2 span,
.huaxia-theme .skins-heading h2 span { color: var(--gold); text-shadow: 3px 3px 0 var(--lacquer); }
.huaxia-theme .overview-copy .lead { color: var(--gold); }
.huaxia-theme .text-link { border-color: var(--gold); }
.huaxia-theme .text-link span { color: var(--gold); }

.huaxia-theme .mode-strip { gap: 12px; background: transparent; border: 0; }
.huaxia-theme .mode-strip article { background: rgba(29, 10, 8, .9); border: 1px solid var(--gold-soft); box-shadow: inset 0 5px 0 var(--lacquer); }
.huaxia-theme .mode-strip article::before {
  content: "";
  position: absolute;
  inset: 12px 12px auto auto;
  width: 22px;
  height: 22px;
  border-top: 1px solid var(--gold);
  border-right: 1px solid var(--gold);
}
.huaxia-theme .mode-strip strong { color: var(--gold); }

.huaxia-theme .intel {
  background:
    repeating-linear-gradient(90deg, rgba(213, 173, 90, .035) 0 1px, transparent 1px 80px),
    #170907;
  border-bottom: 1px solid var(--gold-soft);
}
.huaxia-theme .intel-frame { border: 8px solid var(--lacquer); outline: 1px solid var(--gold); box-shadow: 0 30px 80px rgba(0, 0, 0, .55); }
.huaxia-theme .intel-frame > img { filter: sepia(.18) saturate(.74) contrast(1.06); }
.huaxia-theme .intel-card { color: #28140d; background: #d9c9a6; border: 1px solid var(--gold); clip-path: none; box-shadow: -12px 12px 0 var(--lacquer); }
.huaxia-theme .intel-card > span,
.huaxia-theme .intel-card a b { color: var(--lacquer); }
.huaxia-theme .intel-card p { color: #65523e; }
.huaxia-theme .intel-card a { border-color: rgba(95, 35, 22, .35); }
.huaxia-theme .intel-badge { color: var(--gold); background: var(--lacquer); border: 1px solid var(--gold); box-shadow: inset 0 0 0 5px rgba(213, 173, 90, .12); transform: none; }

.huaxia-theme .systems { position: relative; color: #2c1710; background: repeating-linear-gradient(0deg, rgba(100, 66, 35, .035) 0 1px, transparent 1px 7px), var(--paper); border-bottom: 8px solid var(--lacquer); }
.huaxia-theme .systems-heading .eyebrow { color: var(--lacquer); }
.huaxia-theme .systems-heading h2 { text-shadow: 3px 3px 0 rgba(116, 18, 23, .16); }
.huaxia-theme .systems-heading > p:last-child { color: #715d45; }
.huaxia-theme .systems-grid { gap: 14px; }
.huaxia-theme .systems-grid article { background: rgba(230, 215, 181, .66); border: 1px solid rgba(116, 18, 23, .28); box-shadow: inset 0 6px 0 var(--lacquer); }
.huaxia-theme .systems-grid article::after { border: 1px solid transparent; inset: 10px; }
.huaxia-theme .systems-grid article:hover::after { border-color: var(--gold); }
.huaxia-theme .system-number { color: var(--lacquer); }
.huaxia-theme .system-icon svg { stroke: #5d2119; }
.huaxia-theme .system-icon svg .accent { fill: var(--lacquer); stroke: var(--lacquer); }
.huaxia-theme .system-icon svg .fill { fill: #5d2119; }
.huaxia-theme .systems-grid p { color: #715d45; }

.huaxia-theme .skins { position: relative; border-bottom: 1px solid var(--gold-soft); }
.huaxia-theme .knife-stage { background: #160807; border: 1px solid var(--gold); box-shadow: 0 0 0 8px var(--lacquer), 0 30px 80px rgba(0, 0, 0, .55); }
.huaxia-theme .knife-stage-shade { background: linear-gradient(90deg, rgba(23, 4, 4, .95), rgba(87, 7, 12, .42) 44%, transparent 73%), linear-gradient(0deg, rgba(16, 4, 3, .78), transparent 48%); }
.huaxia-theme .knife-stage-copy { padding-left: 24px; border-left: 2px solid var(--gold); }
.huaxia-theme .knife-stage-copy > span,
.huaxia-theme .skin-meta small { color: var(--gold); }
.huaxia-theme .knife-stage-copy h3 { text-shadow: 4px 4px 0 var(--lacquer); }
.huaxia-theme .inspect-button { color: var(--gold); background: var(--lacquer); border: 1px solid var(--gold); }
.huaxia-theme .knife-variants { gap: 3px; background: var(--lacquer); border: 1px solid var(--gold-soft); }
.huaxia-theme .knife-variants button { background: #170907; }
.huaxia-theme .knife-variants button.active::after { border-color: var(--gold); background: rgba(116, 18, 23, .25); }
.huaxia-theme .skin-card { border: 1px solid var(--gold-soft); background: #150706; }
.huaxia-theme .skin-card::after { background: linear-gradient(0deg, rgba(46, 4, 7, .94), rgba(46, 4, 7, .08) 68%); }
.huaxia-theme .skin-card > i { border-radius: 0; color: var(--gold); border-color: var(--gold); background: rgba(116, 18, 23, .66); }
.huaxia-theme .skin-card:hover > i,
.huaxia-theme .skin-card:focus-visible > i { color: #28140d; background: var(--gold); border-color: var(--gold); }

.huaxia-theme .loadout { border-top: 8px solid var(--lacquer); box-shadow: inset 0 1px 0 var(--gold); }
.huaxia-theme .loadout-art { filter: sepia(.18) saturate(.78) contrast(1.08); }
.huaxia-theme .loadout-overlay { background: linear-gradient(90deg, rgba(23, 3, 4, .97), rgba(76, 7, 11, .64) 44%, transparent 74%); }
.huaxia-theme .loadout-copy { padding-left: 34px; border-left: 3px solid var(--gold); }
.huaxia-theme .loadout h2 { text-shadow: 4px 4px 0 var(--lacquer); }
.huaxia-theme .loadout-card { color: var(--gold); background: rgba(91, 8, 13, .94); border: 1px solid var(--gold); border-top: 7px solid var(--gold); box-shadow: 12px 12px 0 rgba(15, 4, 3, .72); }
.huaxia-theme .loadout-card span { color: rgba(244, 234, 210, .62); }

.huaxia-theme .skin-dialog { border-color: var(--gold); background: rgba(24, 4, 5, .98); box-shadow: inset 0 0 0 7px var(--lacquer), 0 30px 100px rgba(0, 0, 0, .82); }
.huaxia-theme .skin-dialog img { background: #0c0504; }
.huaxia-theme .skin-dialog figcaption { color: var(--gold); border-top: 1px solid var(--gold-soft); }
.huaxia-theme .skin-dialog-close { border-radius: 0; color: var(--gold); background: var(--lacquer); border-color: var(--gold); }

.huaxia-theme footer { color: rgba(244, 234, 210, .52); background: linear-gradient(90deg, #310508, #0b0504 50%, #310508); border-top: 1px solid var(--gold); }
.huaxia-theme .footer-brand,
.huaxia-theme .footer-links a { color: var(--gold); }
.huaxia-theme .footer-brand span { color: var(--lacquer); }
.huaxia-theme :focus-visible { outline-color: var(--gold); }

@media (max-width: 720px) {
  .huaxia-theme .topbar::before { inset-inline: 15px; }
  .huaxia-theme .transmission::before { inset: 76px 10px 10px; }
  .huaxia-theme .transmission::after { inset: 76px 10px 10px auto; width: 28px; background-size: 18px 18px; }
  .huaxia-theme .transmission-content { padding-left: 22px; padding-right: 25px; }
  .huaxia-theme .transmission-content::before { left: -16px; width: 31px; height: 31px; font-size: 9px; }
  .huaxia-theme .transmission h2 { font-size: 68px; }
  .huaxia-theme .transmission-speed { display: none; }
  .huaxia-theme .intel-frame { border-width: 4px; }
  .huaxia-theme .intel-card { box-shadow: -7px 7px 0 var(--lacquer); }
  .huaxia-theme .knife-stage { box-shadow: 0 0 0 4px var(--lacquer), 0 20px 50px rgba(0, 0, 0, .5); }
  .huaxia-theme .knife-stage-copy { left: 19px; padding-left: 14px; }
  .huaxia-theme .loadout-copy { padding-left: 20px; }
  .huaxia-theme .beta-entry-wrap { width: calc(100% - 18px); margin-top: 32px; }
  .huaxia-theme .beta-entry { min-height: 72px; grid-template-columns: 44px 1fr 20px; gap: 11px; padding: 9px 14px 9px 9px; }
  .huaxia-theme .beta-entry-seal { width: 44px; height: 44px; font-size: 22px; }
  .huaxia-theme .beta-entry-copy small { font-size: 7px; }
  .huaxia-theme .beta-entry-copy strong { font-size: 17px; }
}

/* Simplified Chinese typography */
.huaxia-theme {
  font-family: "Noto Sans SC", "Source Han Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
}

.huaxia-theme .transmission h2,
.huaxia-theme .overview h2,
.huaxia-theme .intel-card h2,
.huaxia-theme .systems-heading h2,
.huaxia-theme .skins-heading h2,
.huaxia-theme .knife-stage-copy h3,
.huaxia-theme .loadout h2 {
  font-family: "Noto Serif SC", "Source Han Serif SC", "Songti SC", STSong, SimSun, serif;
  font-weight: 900;
  line-height: .94;
  letter-spacing: .025em;
}

.huaxia-theme .mode-strip span,
.huaxia-theme .systems-grid h3,
.huaxia-theme .skin-meta strong,
.huaxia-theme .loadout-card strong,
.huaxia-theme .footer-brand {
  font-family: "Noto Sans SC", "Source Han Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
  font-weight: 900;
}

.huaxia-theme .transmission-content::before { content: "ZONE"; font-family: "Noto Serif SC", "Songti SC", STSong, serif; }
.huaxia-theme .mini-brand span { line-height: 1.05; }
.huaxia-theme .nav a,
.huaxia-theme .eyebrow,
.huaxia-theme .topbar-status,
.huaxia-theme .transmission-actions button { letter-spacing: .12em; }

@media (max-width: 720px) {
  .huaxia-theme .transmission h2 { font-size: 62px; line-height: .98; }
  .huaxia-theme .overview h2,
  .huaxia-theme .systems-heading h2,
  .huaxia-theme .skins-heading h2 { font-size: 58px; line-height: 1; }
  .huaxia-theme .loadout h2 { font-size: 65px; line-height: 1; }
}

/* Valve / CS2 Chinese adaptation */
:root {
  --ink: #15171b;
  --ink-deep: #090c10;
  --ink-blue: #1e202f;
  --paper: #d8dad8;
  --white: #f2f2ed;
  --muted: #94999e;
  --orange: #ef9418;
  --orange-deep: #c86715;
  --blue: #4e9dc6;
  --rule: rgba(255, 255, 255, .16);
}

.valve-cn-theme {
  color: var(--white);
  background: var(--ink);
  font-family: "Stratum2", "Noto Sans SC", "Source Han Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
}

.valve-cn-theme .scroll-progress { background: rgba(255,255,255,.08); }
.valve-cn-theme .scroll-progress span { background: var(--orange); }

.valve-cn-theme .topbar { border: 0; background: transparent; box-shadow: none; }
.valve-cn-theme .topbar::before { content: none; }
.valve-cn-theme .topbar::after { background: linear-gradient(180deg, rgba(8,10,13,.9), rgba(8,10,13,.38) 70%, transparent); }
.valve-cn-theme .topbar.is-scrolled { background: rgba(18,20,24,.94); border-bottom: 1px solid rgba(255,255,255,.12); }
.valve-cn-theme .mini-brand strong { color: #fff; text-shadow: none; }
.valve-cn-theme .mini-brand i { background: rgba(255,255,255,.5); }
.valve-cn-theme .mini-brand span { line-height: 1.03; }
.valve-cn-theme .topbar-status span { color: #1e202f; background: var(--orange); border: 0; }
.valve-cn-theme .topbar-status strong { color: rgba(255,255,255,.62); }
.valve-cn-theme .nav a { color: rgba(255,255,255,.78); }
.valve-cn-theme .nav a::after { background: var(--orange); }
.valve-cn-theme .play-free { color: #fff; background: var(--blue); border: 0; box-shadow: 0 4px 15px rgba(12,47,66,.24); }
.valve-cn-theme .play-free:hover,
.valve-cn-theme .play-free:focus-visible { color: #fff; background: #64b0d7; }

.valve-cn-theme .transmission { min-height: 860px; background: #0c1015; border-bottom: 12px solid var(--orange); box-shadow: none; }
.valve-cn-theme .transmission::before { content: none; }
.valve-cn-theme .transmission::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: auto 0 0;
  height: 12px;
  opacity: .55;
  background: repeating-linear-gradient(105deg, rgba(21,23,27,.7) 0 4px, transparent 4px 14px);
  pointer-events: none;
}
.valve-cn-theme .transmission-video { filter: saturate(.72) contrast(1.1) brightness(.68); }
.valve-cn-theme .transmission-shade { background: linear-gradient(90deg, rgba(7,10,14,.96), rgba(7,10,14,.61) 47%, rgba(7,10,14,.08) 78%), linear-gradient(0deg, rgba(8,11,15,.86), transparent 48%); }
.valve-cn-theme .transmission-content { padding: 40px 0 70px; border: 0; filter: none; }
.valve-cn-theme .transmission-content::before { content: none; }
.valve-cn-theme .transmission-content .eyebrow { color: var(--orange); }
.valve-cn-theme .transmission h2,
.valve-cn-theme .overview h2,
.valve-cn-theme .intel-card h2,
.valve-cn-theme .systems-heading h2,
.valve-cn-theme .skins-heading h2,
.valve-cn-theme .knife-stage-copy h3,
.valve-cn-theme .loadout h2 {
  font-family: "Stratum2 Condensed", "Noto Sans SC", "Source Han Sans SC", "Microsoft YaHei", sans-serif;
  font-weight: 900;
  line-height: .88;
  letter-spacing: -.025em;
}
.valve-cn-theme .transmission h2 { color: #f1f1ec; text-shadow: 0 5px 22px rgba(0,0,0,.38); }
.valve-cn-theme .transmission-content > p:not(.eyebrow) { color: rgba(255,255,255,.66); }

.valve-cn-theme .beta-entry-wrap { width: min(650px, 68%); display: flex; justify-content: flex-start; margin-top: 36px; }
.valve-cn-theme .beta-entry {
  position: relative;
  width: min(456px, 100%);
  min-height: 74px;
  display: grid;
  grid-template-columns: 54px 1fr 23px;
  align-items: center;
  gap: 15px;
  padding: 9px 18px 9px 10px;
  color: #1d2028;
  background: linear-gradient(180deg, #f7a528 0%, #ef9418 55%, #dc7b10 100%);
  border: 1px solid rgba(255,190,88,.65);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.44), inset 0 -1px 0 rgba(105,51,4,.38), 0 7px 0 #9b4e08, 0 16px 28px rgba(0,0,0,.3);
  clip-path: none;
  transition: background 170ms ease, color 170ms ease, transform 170ms ease, box-shadow 170ms ease;
}
.valve-cn-theme .beta-entry::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: #242732; box-shadow: 2px 0 0 rgba(255,185,72,.72); }
.valve-cn-theme .beta-entry::after { content: none; }
.valve-cn-theme .beta-entry-icon { position: relative; width: 54px; height: 54px; display: grid; place-items: center; overflow: hidden; background: #20232b; clip-path: polygon(50% 0, 95% 23%, 95% 76%, 50% 100%, 5% 76%, 5% 23%); filter: drop-shadow(0 3px 2px rgba(91,40,2,.35)); }
.valve-cn-theme .beta-entry-icon img { width: 88%; height: 88%; object-fit: contain; animation: dz-icon-pulse 2.4s ease-in-out infinite; }
.valve-cn-theme .beta-entry-icon::after { content: ""; position: absolute; inset: -60% -30%; background: linear-gradient(110deg, transparent 38%, rgba(255,255,255,.65) 49%, transparent 60%); transform: translateX(-70%); animation: dz-icon-scan 2.8s ease-in-out infinite; }
.valve-cn-theme .beta-entry-copy { display: grid; gap: 5px; }
.valve-cn-theme .beta-entry-copy small { color: rgba(29,32,40,.67); font-size: 8px; font-weight: 700; letter-spacing: .16em; }
.valve-cn-theme .beta-entry-copy strong { font: 900 20px/1 "Stratum2", "Noto Sans SC", "Microsoft YaHei", sans-serif; letter-spacing: .06em; }
.valve-cn-theme .beta-entry > b { font: 400 32px/1 "Stratum2"; text-align: right; text-shadow: 0 1px 0 rgba(255,255,255,.35); }
.valve-cn-theme .beta-entry:hover,
.valve-cn-theme .beta-entry:focus-visible { color: #14161a; background: linear-gradient(180deg, #ffb43c, #f59b1b 58%, #e38410); transform: translateY(-2px); box-shadow: inset 0 1px 0 rgba(255,255,255,.58), inset 0 -1px 0 rgba(105,51,4,.32), 0 9px 0 #9b4e08, 0 19px 32px rgba(0,0,0,.34); }
.valve-cn-theme .beta-entry:active { transform: translateY(4px); box-shadow: inset 0 1px 0 rgba(255,255,255,.38), 0 3px 0 #873f05, 0 9px 17px rgba(0,0,0,.3); }
@keyframes dz-icon-pulse { 0%,100% { transform: scale(.94); filter: saturate(.9) brightness(.9); } 50% { transform: scale(1.05); filter: saturate(1.2) brightness(1.15); } }
@keyframes dz-icon-scan { 0%,24% { transform: translateX(-75%); opacity: 0; } 42% { opacity: .8; } 62%,100% { transform: translateX(75%); opacity: 0; } }

.valve-cn-theme .transmission-actions { inset: auto 28px 28px auto; }
.valve-cn-theme .transmission-actions button { min-width: 98px; min-height: 38px; color: #fff; background: rgba(19,22,27,.82); border: 1px solid rgba(255,255,255,.42); font-family: "Stratum2", "Noto Sans SC", "Microsoft YaHei", sans-serif; }
.valve-cn-theme .transmission-actions button:hover,
.valve-cn-theme .transmission-actions button:focus-visible,
.valve-cn-theme .transmission-actions button[aria-pressed="true"] { color: #20232b; background: var(--orange); border-color: var(--orange); }

.valve-cn-theme .dark-section { background: linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px), radial-gradient(circle at 78% 18%, rgba(239,148,24,.09), transparent 28%), var(--ink-deep); background-size: 160px 100%, auto, auto; }
.valve-cn-theme .overview { position: relative; border: 0; overflow: hidden; }
.valve-cn-theme .overview::before { content: ""; position: absolute; inset: 0 0 0 auto; width: 19vw; min-width: 180px; opacity: .16; background: repeating-linear-gradient(105deg, var(--orange) 0 3px, transparent 3px 18px); transform: skewX(-9deg) translateX(45%); }
.valve-cn-theme .overview::after { content: none; }
.valve-cn-theme .section-label,
.valve-cn-theme .eyebrow { color: var(--orange); }
.valve-cn-theme .section-label::before { width: 1px; background: var(--orange); box-shadow: none; }
.valve-cn-theme .overview h2 span,
.valve-cn-theme .skins-heading h2 span { color: var(--orange); text-shadow: none; }
.valve-cn-theme .overview-copy .lead { color: var(--white); }
.valve-cn-theme .text-link { border-color: var(--orange); }
.valve-cn-theme .text-link span { color: var(--orange); }
.valve-cn-theme .mode-strip { gap: 1px; background: rgba(255,255,255,.12); border-block: 1px solid rgba(255,255,255,.12); }
.valve-cn-theme .mode-strip article { background: var(--ink-deep); border: 0; box-shadow: inset 0 4px 0 transparent; transition: box-shadow 160ms ease, background 160ms ease; }
.valve-cn-theme .mode-strip article::before { content: none; }
.valve-cn-theme .mode-strip article:hover { background: #11151b; box-shadow: inset 0 4px 0 var(--orange); }
.valve-cn-theme .mode-strip strong { color: var(--orange); }

.valve-cn-theme .intel { background: var(--orange); border: 0; overflow: hidden; }
.valve-cn-theme .intel::before { content: ""; position: absolute; inset: 0; opacity: .1; background: repeating-linear-gradient(105deg, #1e202f 0 3px, transparent 3px 18px); pointer-events: none; }
.valve-cn-theme .intel-frame { border: 0; outline: 0; box-shadow: 0 26px 70px rgba(27,19,8,.28); }
.valve-cn-theme .intel-frame > img { filter: saturate(.78) contrast(1.05); }
.valve-cn-theme .intel-card { color: var(--white); background: rgba(25,28,34,.96); border: 0; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 22px), calc(100% - 22px) 100%, 0 100%); box-shadow: none; }
.valve-cn-theme .intel-card > span,
.valve-cn-theme .intel-card a b { color: var(--orange); }
.valve-cn-theme .intel-card p { color: #a7abb0; }
.valve-cn-theme .intel-card a { border-color: rgba(255,255,255,.2); }
.valve-cn-theme .intel-badge { color: var(--ink-blue); background: var(--orange); border: 0; box-shadow: none; transform: rotate(3deg); }

.valve-cn-theme .systems { color: var(--ink-blue); background: var(--paper); border: 0; }
.valve-cn-theme .systems::after { content: none; }
.valve-cn-theme .systems-heading .eyebrow { color: var(--orange-deep); }
.valve-cn-theme .systems-heading h2 { text-shadow: none; }
.valve-cn-theme .systems-heading > p:last-child { color: #61666a; }
.valve-cn-theme .systems-grid { gap: 12px; }
.valve-cn-theme .systems-grid article { background: #c9ccca; border: 0; box-shadow: none; }
.valve-cn-theme .systems-grid article::after { inset: 0; border: 0; border-top: 5px solid transparent; }
.valve-cn-theme .systems-grid article:hover::after { border-color: var(--orange); }
.valve-cn-theme .system-number { color: #7d8285; }
.valve-cn-theme .system-icon svg { stroke: var(--ink-blue); }
.valve-cn-theme .system-icon svg .accent { fill: var(--orange-deep); stroke: var(--orange-deep); }
.valve-cn-theme .system-icon svg .fill { fill: var(--ink-blue); }
.valve-cn-theme .systems-grid p { color: #64696d; }

.valve-cn-theme .skins { background: linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px), var(--ink-deep); background-size: 160px 100%; border: 0; }
.valve-cn-theme .skins::after { content: none; }
.valve-cn-theme .knife-stage { background: #202328; border: 0; box-shadow: 0 25px 70px rgba(0,0,0,.4); }
.valve-cn-theme .knife-stage-shade { background: linear-gradient(90deg, rgba(8,11,15,.88), rgba(8,11,15,.3) 42%, transparent 70%), linear-gradient(0deg, rgba(8,11,15,.65), transparent 46%); }
.valve-cn-theme .knife-stage-copy { padding-left: 0; border: 0; }
.valve-cn-theme .knife-stage-copy > span,
.valve-cn-theme .skin-meta small { color: var(--orange); }
.valve-cn-theme .knife-stage-copy h3 { text-shadow: none; }
.valve-cn-theme .inspect-button { color: var(--ink-blue); background: var(--orange); border: 0; }
.valve-cn-theme .knife-variants { gap: 1px; background: rgba(255,255,255,.12); border: 0; }
.valve-cn-theme .knife-variants button { background: #202328; }
.valve-cn-theme .knife-variants button.active::after { border-color: var(--orange); background: rgba(239,148,24,.08); }
.valve-cn-theme .skin-card { border: 0; background: #202328; }
.valve-cn-theme .skin-card::after { background: linear-gradient(0deg, rgba(7,10,13,.9), transparent 58%); }
.valve-cn-theme .skin-card > i { border-radius: 50%; color: #fff; border-color: rgba(255,255,255,.65); background: transparent; }
.valve-cn-theme .skin-card:hover > i,
.valve-cn-theme .skin-card:focus-visible > i { color: #fff; background: var(--orange); border-color: var(--orange); }
.valve-cn-theme .skin-card-deagle img { object-position: 70% center; }

.valve-cn-theme .loadout { border: 0; box-shadow: inset 0 10px 0 var(--orange); }
.valve-cn-theme .loadout-art { filter: saturate(.84) contrast(1.05); }
.valve-cn-theme .loadout-overlay { background: linear-gradient(90deg, rgba(10,13,16,.94), rgba(10,13,16,.55) 42%, transparent 68%); }
.valve-cn-theme .loadout-copy { padding-left: 0; border: 0; }
.valve-cn-theme .loadout h2 { text-shadow: none; }
.valve-cn-theme .loadout-card { color: var(--ink-blue); background: rgba(237,238,233,.94); border: 0; border-top: 6px solid var(--orange); box-shadow: none; }
.valve-cn-theme .loadout-card span { color: #62666a; }
.valve-cn-theme .loadout-compact-controls { border-color: transparent; }

.valve-cn-theme .skin-dialog { border: 1px solid rgba(255,255,255,.16); background: rgba(8,11,15,.97); box-shadow: 0 30px 100px rgba(0,0,0,.78); }
.valve-cn-theme .skin-dialog img { background: #080b0f; }
.valve-cn-theme .skin-dialog figcaption { color: rgba(255,255,255,.65); border-top: 0; }
.valve-cn-theme .skin-dialog-close { border-radius: 50%; color: #fff; background: rgba(0,0,0,.62); border-color: rgba(255,255,255,.5); }
.valve-cn-theme footer { color: rgba(255,255,255,.48); background: #05070a; border-top: 1px solid rgba(255,255,255,.1); }
.valve-cn-theme .footer-brand,
.valve-cn-theme .footer-links a { color: var(--white); }
.valve-cn-theme .footer-brand span { color: var(--orange); }
.valve-cn-theme :focus-visible { outline-color: #b9e6ff; }

@media (max-width: 720px) {
  .valve-cn-theme .transmission { min-height: 790px; }
  .valve-cn-theme .transmission-content { padding-inline: 0; }
  .valve-cn-theme .transmission h2 { font-size: 70px; line-height: .94; }
  .valve-cn-theme .beta-entry-wrap { width: 100%; margin-top: 34px; }
  .valve-cn-theme .beta-entry { min-height: 68px; grid-template-columns: 47px 1fr 18px; gap: 11px; padding: 8px 13px 8px 9px; }
  .valve-cn-theme .beta-entry-icon { width: 47px; height: 47px; }
  .valve-cn-theme .beta-entry-copy small { font-size: 7px; }
  .valve-cn-theme .beta-entry-copy strong { font-size: 18px; }
  .valve-cn-theme .transmission-actions { right: 15px; left: auto; bottom: 18px; }
  .valve-cn-theme .overview h2,
  .valve-cn-theme .systems-heading h2,
  .valve-cn-theme .skins-heading h2 { font-size: 62px; line-height: .94; }
  .valve-cn-theme .intel-card { box-shadow: none; }
  .valve-cn-theme .knife-stage { box-shadow: 0 20px 50px rgba(0,0,0,.45); }
  .valve-cn-theme .knife-stage-copy { left: 24px; }
  .valve-cn-theme .loadout h2 { font-size: 70px; line-height: .94; }
}