:root {
  color-scheme: dark;
  --gx-bg: #020510;
  --gx-bg-soft: #070b18;
  --gx-panel: rgba(8, 16, 34, .68);
  --gx-panel-strong: rgba(10, 20, 42, .82);
  --gx-panel-soft: rgba(10, 22, 45, .46);
  --gx-line: rgba(120, 178, 255, .24);
  --gx-line-strong: rgba(143, 199, 255, .42);
  --gx-blue: #40c8ff;
  --gx-blue-2: #5d7cff;
  --gx-violet: #925cff;
  --gx-magenta: #e45cff;
  --gx-cyan: #71f2ff;
  --gx-text: #f4f8ff;
  --gx-sub: rgba(216, 229, 255, .74);
  --gx-muted: rgba(190, 208, 238, .55);
  --gx-hot: #ff8b55;
  --gx-radius-xl: 34px;
  --gx-radius-lg: 24px;
  --gx-radius-md: 18px;
  --gx-radius-sm: 12px;
  --gx-shadow: 0 24px 80px rgba(0, 0, 0, .38), inset 0 1px 0 rgba(255, 255, 255, .08);
  --gx-glow: 0 0 26px rgba(64, 200, 255, .24), 0 0 70px rgba(146, 92, 255, .18);
  --gx-ease: cubic-bezier(.16, 1, .3, 1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--gx-bg); }
body.gx-home-page {
  margin: 0;
  min-height: 100vh;
  overflow-x: hidden;
  color: var(--gx-text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
  background:
    radial-gradient(circle at 50% -10%, rgba(74, 128, 255, .26), transparent 34%),
    radial-gradient(circle at 15% 20%, rgba(124, 94, 255, .20), transparent 28%),
    radial-gradient(circle at 88% 26%, rgba(34, 217, 255, .16), transparent 30%),
    linear-gradient(180deg, #020510 0%, #030713 42%, #040816 100%);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}
body.gx-home-page::selection { background: rgba(64, 200, 255, .34); color: #fff; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { cursor: pointer; }
.gx-shell { width: min(1710px, calc(100vw - 56px)); margin: 0 auto; }

.gx-bg { position: fixed; inset: 0; pointer-events: none; z-index: -3; overflow: hidden; background: linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.44)); }
.gx-grid {
  position: absolute;
  inset: 0;
  opacity: .28;
  background-image:
    linear-gradient(rgba(120, 178, 255, .08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(120, 178, 255, .08) 1px, transparent 1px);
  background-size: 74px 74px;
  mask-image: linear-gradient(to bottom, transparent 0, rgba(0,0,0,.8) 28%, rgba(0,0,0,.28) 100%);
  transform: perspective(700px) rotateX(60deg) translateY(36vh) scale(1.65);
  transform-origin: bottom center;
}
.gx-orb { position: absolute; border-radius: 999px; filter: blur(2px); opacity: .75; }
.gx-orb-a { width: 42vw; height: 42vw; left: -15vw; top: 6vh; background: radial-gradient(circle, rgba(86, 114, 255, .18), transparent 64%); }
.gx-orb-b { width: 36vw; height: 36vw; right: -11vw; top: 8vh; background: radial-gradient(circle, rgba(57, 232, 255, .12), transparent 66%); }
.gx-orb-c { width: 25vw; height: 25vw; left: 48vw; bottom: -10vw; background: radial-gradient(circle, rgba(205, 89, 255, .15), transparent 64%); }

.gx-header {
  position: sticky;
  top: 0;
  z-index: 50;
  backdrop-filter: blur(22px) saturate(160%);
  -webkit-backdrop-filter: blur(22px) saturate(160%);
  background: linear-gradient(180deg, rgba(3, 7, 18, .78), rgba(3, 7, 18, .54));
  border-bottom: 1px solid rgba(121, 173, 255, .15);
}
.gx-header-inner { height: 74px; display: flex; align-items: center; gap: 28px; position: relative; }
.gx-brand { display: inline-flex; align-items: center; gap: 12px; min-width: max-content; }
.gx-logo-mark {
  width: 48px; height: 34px; display: inline-grid; place-items: center;
  font-weight: 1000; letter-spacing: -.08em; font-size: 23px; line-height: 1;
  color: #031021; text-shadow: 0 1px 0 rgba(255,255,255,.45);
  background: linear-gradient(135deg, #54e3ff 0%, #5b83ff 45%, #b465ff 80%, #f15cff 100%);
  clip-path: polygon(8% 0, 100% 0, 84% 100%, 0 100%);
  box-shadow: 0 0 28px rgba(87, 150, 255, .45);
}
.gx-brand-text { font-size: 22px; font-weight: 900; letter-spacing: -.04em; }
.gx-nav { flex: 1; display: flex; justify-content: center; gap: min(4vw, 68px); }
.gx-nav a { position: relative; padding: 25px 4px 23px; color: rgba(232, 240, 255, .80); font-weight: 700; letter-spacing: .03em; transition: color .25s var(--gx-ease); }
.gx-nav a::after {
  content: ""; position: absolute; left: 50%; bottom: 0; width: 0; height: 2px; border-radius: 999px;
  transform: translateX(-50%); background: linear-gradient(90deg, transparent, var(--gx-cyan), var(--gx-violet), transparent);
  box-shadow: 0 0 22px rgba(80, 178, 255, .9); transition: width .28s var(--gx-ease);
}
.gx-nav a:hover, .gx-nav a.active { color: #fff; }
.gx-nav a:hover::after, .gx-nav a.active::after { width: 48px; }
.gx-header-actions { display: flex; align-items: center; gap: 10px; }
.gx-icon-btn, .gx-menu-toggle {
  border: 1px solid rgba(130, 188, 255, .25); color: rgba(236, 244, 255, .86); background: rgba(8, 17, 36, .58);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 8px 24px rgba(0,0,0,.22); backdrop-filter: blur(16px);
}
.gx-icon-btn { min-width: 56px; height: 36px; border-radius: 999px; font-size: 13px; font-weight: 800; }
.gx-icon-btn:hover { border-color: rgba(113, 242, 255, .64); box-shadow: var(--gx-glow); }
.gx-menu-toggle { display: none; width: 44px; height: 40px; border-radius: 14px; padding: 0; }
.gx-menu-toggle span { display: block; width: 18px; height: 2px; margin: 5px auto; border-radius: 99px; background: currentColor; }
.gx-mobile-menu { display: none; }

.gx-hero { position: relative; min-height: 610px; overflow: hidden; border-bottom: 1px solid rgba(120, 178, 255, .12); }
.gx-hero::before {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(90deg, rgba(2,5,16,.92) 0%, rgba(2,5,16,.48) 36%, rgba(2,5,16,.22) 56%, rgba(2,5,16,.85) 100%),
    linear-gradient(180deg, rgba(2,5,16,.10) 0%, rgba(2,5,16,.0) 50%, #020510 100%);
  z-index: 1;
}
.gx-hero-inner { position: relative; z-index: 3; min-height: 610px; display: grid; grid-template-columns: minmax(0, 1fr) 380px; align-items: center; gap: 56px; padding: 76px 0 82px; }
.gx-hero-art { position: absolute; inset: 0; overflow: hidden; background: radial-gradient(circle at 52% 42%, rgba(83, 190, 255, .45), transparent 16%), radial-gradient(circle at 52% 48%, rgba(117, 78, 255, .28), transparent 28%), linear-gradient(180deg, #07122a 0%, #050a18 72%, #020510 100%); }
.gx-hero-art::before,
.gx-hero-art::after { content: ""; position: absolute; inset: 0; }
.gx-hero-art::before {
  background:
    radial-gradient(circle at 12% 18%, rgba(86, 72, 255, .35) 0 1px, transparent 2px),
    radial-gradient(circle at 34% 28%, rgba(112, 239, 255, .42) 0 1px, transparent 2px),
    radial-gradient(circle at 78% 14%, rgba(205, 80, 255, .35) 0 1px, transparent 2px),
    radial-gradient(circle at 91% 44%, rgba(109, 170, 255, .36) 0 1px, transparent 2px);
  background-size: 240px 180px, 300px 230px, 260px 170px, 340px 220px;
  opacity: .7;
  animation: gxStars 18s linear infinite;
}
.gx-hero-art::after {
  background:
    radial-gradient(ellipse at 30% 76%, rgba(20, 66, 132, .8), transparent 25%),
    radial-gradient(ellipse at 55% 78%, rgba(45, 20, 110, .65), transparent 26%),
    linear-gradient(165deg, transparent 0 47%, rgba(33, 90, 170, .25) 49%, transparent 52%),
    linear-gradient(28deg, transparent 0 54%, rgba(123, 74, 255, .20) 56%, transparent 59%);
  opacity: .78;
}
.gx-horizon {
  position: absolute; left: -7%; right: -7%; bottom: 0; height: 185px; z-index: 1;
  background:
    linear-gradient(170deg, transparent 0 36%, rgba(20, 32, 57, .75) 37% 54%, transparent 55%),
    linear-gradient(20deg, transparent 0 48%, rgba(7, 16, 33, .96) 49% 72%, transparent 73%),
    radial-gradient(ellipse at 48% 20%, rgba(99, 120, 255, .42), transparent 42%),
    linear-gradient(180deg, transparent 0%, #020510 70%);
  filter: drop-shadow(0 -30px 80px rgba(79, 139, 255, .25));
}
.gx-portal-ring {
  position: absolute; left: 53%; top: 26%; width: 230px; height: 230px; border-radius: 50%; transform: translate(-50%, -50%);
  border: 3px solid rgba(182, 230, 255, .62);
  box-shadow: 0 0 25px rgba(65, 200, 255, .8), inset 0 0 35px rgba(104, 119, 255, .54), 0 0 110px rgba(108, 90, 255, .55);
  background: radial-gradient(circle, transparent 48%, rgba(64, 200, 255, .12) 52%, transparent 62%);
  animation: gxPulse 5s var(--gx-ease) infinite;
}
.gx-portal-ring::before { content: ""; position: absolute; inset: -24px; border-radius: inherit; border: 1px dashed rgba(138, 199, 255, .28); animation: gxRotate 18s linear infinite; }
.gx-citadel {
  position: absolute; left: 51%; bottom: 112px; width: 180px; height: 145px; transform: translateX(-50%); z-index: 2;
  background:
    linear-gradient(to top, rgba(111, 148, 255, .45), rgba(111, 148, 255, 0)) 49% 0/8px 100% no-repeat,
    linear-gradient(to top, #111a31, #1d2c56 70%, transparent 70%) 40% 45%/22px 82% no-repeat,
    linear-gradient(to top, #0f172c, #20325d 70%, transparent 70%) 50% 10%/28px 118% no-repeat,
    linear-gradient(to top, #0d1529, #17294f 70%, transparent 70%) 60% 52%/20px 75% no-repeat,
    linear-gradient(to top, #091124, #152548 70%, transparent 70%) 50% 100%/150px 40px no-repeat;
  filter: drop-shadow(0 0 30px rgba(100, 176, 255, .7));
  opacity: .86;
}
.gx-wanderer {
  position: absolute; right: 18.5%; bottom: 120px; width: 88px; height: 150px; z-index: 2; opacity: .86; filter: drop-shadow(0 0 24px rgba(109, 169, 255, .46));
  background:
    radial-gradient(circle at 48% 9%, #111827 0 13px, transparent 14px),
    linear-gradient(84deg, transparent 0 38%, #101729 39% 56%, transparent 57%) 0 28px/100% 118px no-repeat,
    linear-gradient(115deg, transparent 0 28%, rgba(8, 12, 25, .95) 29% 60%, transparent 61%) 0 36px/100% 110px no-repeat,
    linear-gradient(to bottom, #111827, #07101f) 43% 20px/16px 124px no-repeat;
}

.reveal-card { animation: gxReveal .9s var(--gx-ease) both; }
.gx-eyebrow { display: inline-flex; align-items: center; gap: 10px; color: var(--gx-cyan); font-weight: 900; letter-spacing: .18em; font-size: 12px; margin: 0 0 18px; }
.gx-eyebrow span { width: 36px; height: 1px; background: linear-gradient(90deg, transparent, var(--gx-cyan)); box-shadow: 0 0 12px var(--gx-cyan); }
.gx-hero h1 { margin: 0; max-width: 790px; font-size: clamp(42px, 5.8vw, 86px); line-height: .98; letter-spacing: -.08em; font-weight: 1000; text-wrap: balance; text-shadow: 0 0 34px rgba(80, 166, 255, .30); }
.gx-hero-subtitle { max-width: 640px; margin: 20px 0 32px; color: rgba(229, 239, 255, .84); font-size: clamp(16px, 1.7vw, 22px); letter-spacing: .01em; }
.gx-search {
  position: relative; width: min(760px, 100%); height: 78px; display: flex; align-items: center; gap: 18px; padding: 0 12px 0 68px;
  border: 1px solid rgba(125, 191, 255, .42); border-radius: 999px;
  background: linear-gradient(180deg, rgba(5, 12, 28, .84), rgba(8, 18, 40, .66));
  box-shadow: 0 0 0 1px rgba(255,255,255,.04) inset, 0 0 42px rgba(64, 200, 255, .22), 0 20px 80px rgba(0,0,0,.34);
  backdrop-filter: blur(22px) saturate(170%);
}
.gx-search::before { content: ""; position: absolute; inset: -2px; border-radius: inherit; padding: 2px; background: linear-gradient(90deg, rgba(113,242,255,.85), rgba(93,124,255,.10), rgba(228,92,255,.82)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; opacity: .55; pointer-events: none; }
.gx-search:focus-within { box-shadow: var(--gx-glow), 0 26px 90px rgba(0,0,0,.45); border-color: rgba(113, 242, 255, .8); }
.gx-search-icon { position: absolute; left: 28px; width: 20px; height: 20px; border: 3px solid rgba(232, 241, 255, .82); border-radius: 50%; opacity: .8; }
.gx-search-icon::after { content: ""; position: absolute; right: -9px; bottom: -8px; width: 10px; height: 3px; border-radius: 99px; background: rgba(232, 241, 255, .82); transform: rotate(45deg); }
.gx-search input { flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; color: #fff; background: transparent; font-size: 19px; }
.gx-search input::placeholder { color: rgba(220, 232, 255, .50); }
.gx-search button {
  position: relative; width: 58px; height: 58px; border: 0; border-radius: 50%; display: grid; place-items: center; flex: 0 0 auto;
  color: #fff; background: radial-gradient(circle at 35% 30%, #82efff, #5b7cff 46%, #8f52ff 78%, #291657 100%);
  box-shadow: 0 0 32px rgba(82, 161, 255, .7), inset 0 1px 0 rgba(255,255,255,.45);
  transition: transform .24s var(--gx-ease), box-shadow .24s var(--gx-ease);
}
.gx-search button svg { width: 25px; height: 25px; fill: currentColor; }
.gx-search button:hover { transform: scale(1.06); box-shadow: 0 0 50px rgba(112, 210, 255, .9), 0 0 80px rgba(175, 95, 255, .55); }
.gx-search button:active { transform: scale(.95); }
.gx-hero-tags { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.gx-hero-tags button, .gx-keyword-row button {
  border: 1px solid rgba(140, 190, 255, .18); border-radius: 999px; padding: 8px 14px; color: rgba(231, 241, 255, .76);
  background: rgba(8, 18, 38, .58); transition: transform .2s var(--gx-ease), border-color .2s var(--gx-ease), color .2s var(--gx-ease), box-shadow .2s var(--gx-ease);
}
.gx-hero-tags button:hover, .gx-keyword-row button:hover { transform: translateY(-2px); color: #fff; border-color: rgba(113, 242, 255, .52); box-shadow: 0 0 22px rgba(64, 200, 255, .18); }

.gx-announcement-card {
  align-self: center; padding: 24px; border: 1px solid rgba(128, 184, 255, .28); border-radius: var(--gx-radius-lg);
  background: linear-gradient(180deg, rgba(8, 17, 38, .72), rgba(4, 9, 22, .58));
  box-shadow: var(--gx-shadow); backdrop-filter: blur(24px) saturate(160%); animation-delay: .14s;
}
.gx-card-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.gx-card-icon { width: 34px; height: 34px; border-radius: 12px; display: grid; place-items: center; color: var(--gx-cyan); background: rgba(64, 200, 255, .10); border: 1px solid rgba(64,200,255,.26); box-shadow: inset 0 0 18px rgba(64,200,255,.08); }
.gx-card-head h2 { margin: 0; font-size: 20px; }
.gx-announcement-list { display: grid; gap: 10px; min-height: 116px; }
.gx-announcement-list p { margin: 0; color: var(--gx-sub); font-size: 14px; }
.gx-announcement-list a { color: var(--gx-cyan); text-decoration: underline; text-underline-offset: 3px; }
.gx-announcement-line { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: center; padding: 9px 0; color: rgba(225, 236, 255, .76); border-bottom: 1px solid rgba(120, 178, 255, .10); font-size: 14px; }
.gx-announcement-line time { color: var(--gx-muted); font-size: 12px; }
.gx-card-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 18px; color: rgba(225, 239, 255, .88); font-weight: 800; }
.gx-card-link span { color: var(--gx-cyan); }

.gx-category-orbit { position: relative; margin-top: -34px; z-index: 5; padding: 18px; border: 1px solid rgba(128, 184, 255, .26); border-radius: 26px; background: linear-gradient(180deg, rgba(8, 18, 40, .78), rgba(5, 12, 27, .70)); box-shadow: var(--gx-shadow); backdrop-filter: blur(24px) saturate(160%); }
.gx-section-mini-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; color: rgba(227, 239, 255, .86); font-weight: 900; }
.gx-section-mini-head a, .gx-section-mini-head button { color: rgba(113, 242, 255, .78); border: 0; background: transparent; font-size: 13px; font-weight: 800; }
.gx-category-links { display: grid; grid-template-columns: repeat(8, minmax(104px, 1fr)); gap: 10px; }
.category-link {
  position: relative; min-height: 62px; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 12px;
  border: 1px solid rgba(130, 190, 255, .16); border-radius: 18px; color: rgba(225, 237, 255, .78); background: rgba(9, 21, 44, .54); overflow: hidden;
  font-weight: 800; transition: transform .22s var(--gx-ease), border-color .22s var(--gx-ease), background .22s var(--gx-ease), color .22s var(--gx-ease), box-shadow .22s var(--gx-ease);
}
.category-link::before { content: attr(data-icon); color: var(--gx-cyan); font-size: 22px; text-shadow: 0 0 22px rgba(113, 242, 255, .55); }
.category-link::after { content: ""; position: absolute; inset: -80% -40%; background: linear-gradient(115deg, transparent 35%, rgba(255,255,255,.16) 50%, transparent 65%); transform: translateX(-100%); transition: transform .7s var(--gx-ease); }
.category-link:hover, .category-link.active { color: #fff; transform: translateY(-3px); border-color: rgba(113, 242, 255, .50); background: linear-gradient(180deg, rgba(22, 44, 88, .82), rgba(9, 21, 44, .58)); box-shadow: 0 16px 42px rgba(33, 120, 255, .18); }
.category-link:hover::after { transform: translateX(100%); }

.gx-library, .gx-hot, .gx-bottom-grid { padding-top: 42px; }
.gx-section-head { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.gx-section-kicker { margin: 0 0 4px; color: var(--gx-cyan); font-size: 12px; font-weight: 950; letter-spacing: .18em; }
.gx-section-head h2 { margin: 0; font-size: clamp(26px, 2.4vw, 38px); letter-spacing: -.05em; }
.gx-sort-tabs { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.sort-tab {
  min-height: 38px; padding: 0 15px; border-radius: 999px; border: 1px solid rgba(130, 190, 255, .18); color: rgba(224, 236, 255, .72); background: rgba(9, 21, 44, .45);
  transition: all .2s var(--gx-ease); font-weight: 800; font-size: 13px;
}
.sort-tab:hover, .sort-tab.active { color: #fff; border-color: rgba(113, 242, 255, .56); background: linear-gradient(135deg, rgba(64, 200, 255, .16), rgba(146, 92, 255, .20)); box-shadow: 0 0 26px rgba(64, 200, 255, .16); }
.sort-tab:disabled { opacity: .55; cursor: wait; }

.game-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 18px; min-height: 360px; }
.game-card {
  position: relative; min-width: 0; display: block; overflow: hidden; border: 1px solid rgba(128, 184, 255, .22); border-radius: 22px; color: var(--gx-text);
  background: linear-gradient(180deg, rgba(9, 20, 42, .84), rgba(4, 9, 22, .86));
  box-shadow: 0 20px 46px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.07);
  transform: translateZ(0); transition: transform .32s var(--gx-ease), border-color .32s var(--gx-ease), box-shadow .32s var(--gx-ease), filter .32s var(--gx-ease);
  animation: gxCardIn .55s var(--gx-ease) both;
}
.game-card::before { content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; border-radius: inherit; background: linear-gradient(180deg, transparent 36%, rgba(1,5,14,.44) 64%, rgba(1,5,14,.88) 100%); }
.game-card::after { content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none; border-radius: inherit; background: linear-gradient(135deg, rgba(113,242,255,.08), transparent 34%, rgba(155,116,255,.07)); opacity: 0; transition: opacity .22s var(--gx-ease); }
.game-card:hover { transform: translateY(-9px) rotateX(2deg); border-color: rgba(113, 242, 255, .52); box-shadow: 0 30px 80px rgba(0,0,0,.45), 0 0 36px rgba(64, 200, 255, .18), inset 0 1px 0 rgba(255,255,255,.12); }
.game-card:hover::after { opacity: 1; }
.image-container { position: relative; width: 100%; aspect-ratio: 16/11; overflow: hidden; background: radial-gradient(circle at 35% 20%, rgba(74,126,255,.38), transparent 42%), linear-gradient(135deg, #14203d, #060b18); }
.image-container img { width: 100%; height: 100%; object-fit: cover; display: block; transform: scale(1.02); transition: transform .5s var(--gx-ease), filter .5s var(--gx-ease); }
.game-card:hover .image-container img { transform: scale(1.09); filter: saturate(1.12) contrast(1.05); }
.card-overlay { position: absolute; z-index: 4; left: 12px; top: 12px; display: flex; gap: 8px; }
.free-tag, .game-tag {
  display: inline-flex; align-items: center; max-width: 96px; height: 24px; padding: 0 9px; border-radius: 999px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  color: rgba(232, 243, 255, .90); background: rgba(6, 14, 32, .62); border: 1px solid rgba(128, 184, 255, .18); backdrop-filter: blur(12px); font-size: 12px; font-weight: 800;
}
.free-tag { color: #061324; background: linear-gradient(135deg, #75efff, #8f6dff); border-color: transparent; }
.card-content { position: relative; z-index: 4; padding: 13px 14px 14px; min-height: 116px; }
.card-content h3 { margin: 0 0 9px; min-height: 44px; color: #fff; font-size: 16px; line-height: 1.35; letter-spacing: -.02em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.card-tags { display: flex; flex-wrap: wrap; gap: 6px; min-height: 24px; }
.card-meta { margin-top: 12px; display: flex; align-items: center; justify-content: space-between; gap: 8px; color: rgba(205, 219, 244, .70); font-size: 12px; }
.card-meta span { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.card-meta .views, .card-meta .hot { color: #ffb18d; }
.empty-state, .loading-placeholder {
  grid-column: 1 / -1; min-height: 230px; display: grid; place-items: center; text-align: center; color: rgba(224, 236, 255, .72);
  border: 1px dashed rgba(128, 184, 255, .22); border-radius: 24px; background: rgba(9, 21, 44, .36);
}
.loading-spinner, .btn-spinner, .ranking-loading-spinner { width: 26px; height: 26px; border: 2px solid rgba(113, 242, 255, .20); border-top-color: var(--gx-cyan); border-radius: 50%; animation: gxRotate 1s linear infinite; }
.gx-load-more-wrap { display: flex; justify-content: center; margin: 30px 0 0; }
.gx-load-more {
  min-width: 190px; height: 52px; border: 1px solid rgba(113, 242, 255, .34); border-radius: 999px; color: #fff;
  background: linear-gradient(135deg, rgba(64, 200, 255, .16), rgba(146, 92, 255, .20)); box-shadow: var(--gx-glow); font-weight: 900;
  transition: transform .2s var(--gx-ease), opacity .2s var(--gx-ease);
}
.gx-load-more:hover { transform: translateY(-3px); }
.gx-load-more:disabled { opacity: .58; cursor: not-allowed; transform: none; }
.gx-load-more.loading { cursor: wait; }
.gx-load-more .btn-spinner { width: 18px; height: 18px; display: inline-block; margin-right: 8px; vertical-align: -4px; }

.gx-section-head-line { padding-top: 18px; border-top: 1px solid rgba(128, 184, 255, .13); }
.gx-more-link { color: rgba(113, 242, 255, .78); font-weight: 900; }
.gx-ranking-strip { display: grid; grid-template-columns: 1.5fr repeat(4, 1fr); gap: 12px; }
.ranking-item {
  min-height: 94px; display: grid; grid-template-columns: auto 82px minmax(0,1fr); align-items: center; gap: 12px; padding: 13px; border: 1px solid rgba(128, 184, 255, .18); border-radius: 20px; background: linear-gradient(180deg, rgba(9, 21, 44, .72), rgba(6, 13, 30, .72)); box-shadow: inset 0 1px 0 rgba(255,255,255,.06); transition: transform .25s var(--gx-ease), border-color .25s var(--gx-ease), box-shadow .25s var(--gx-ease); overflow: hidden;
}
.ranking-item:first-child { border-color: rgba(228, 92, 255, .50); box-shadow: 0 0 36px rgba(195, 72, 255, .18), inset 0 1px 0 rgba(255,255,255,.08); }
.ranking-item:hover { transform: translateY(-5px); border-color: rgba(113, 242, 255, .46); box-shadow: 0 18px 46px rgba(0,0,0,.34), 0 0 26px rgba(64,200,255,.14); }
.ranking-index { font-size: 36px; line-height: 1; font-weight: 1000; color: rgba(222, 232, 255, .56); font-style: italic; min-width: 34px; text-align: center; }
.ranking-item:first-child .ranking-index { color: #ffd581; text-shadow: 0 0 20px rgba(255, 186, 83, .55); }
.ranking-cover { width: 82px; height: 58px; object-fit: cover; border-radius: 12px; background: rgba(255,255,255,.06); }
.ranking-text { min-width: 0; }
.ranking-title { font-weight: 900; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ranking-meta { margin-top: 6px; color: rgba(255, 174, 132, .92); font-size: 12px; font-weight: 800; }
.gx-skeleton-row { grid-column: 1/-1; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.gx-skeleton-row span { min-height: 90px; border-radius: 20px; background: linear-gradient(90deg, rgba(255,255,255,.05), rgba(255,255,255,.10), rgba(255,255,255,.05)); background-size: 200% 100%; animation: gxSkeleton 1.4s linear infinite; }

.gx-bottom-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(270px, .55fr) minmax(270px, .55fr); gap: 16px; padding-bottom: 54px; }
.gx-keywords-panel, .gx-entry-card { border: 1px solid rgba(128, 184, 255, .18); border-radius: 22px; background: linear-gradient(180deg, rgba(9, 21, 44, .66), rgba(5, 12, 27, .72)); box-shadow: inset 0 1px 0 rgba(255,255,255,.06); padding: 18px; }
.gx-keyword-row { display: flex; flex-wrap: wrap; gap: 9px; }
.gx-entry-card { position: relative; overflow: hidden; display: grid; align-content: center; gap: 8px; min-height: 140px; transition: transform .25s var(--gx-ease), border-color .25s var(--gx-ease), box-shadow .25s var(--gx-ease); }
.gx-entry-card::before { content: ""; position: absolute; inset: auto -20% -50% 20%; height: 120px; border-radius: 50%; background: radial-gradient(circle, rgba(113, 242, 255, .20), transparent 68%); pointer-events: none; }
.gx-entry-card:hover { transform: translateY(-5px); border-color: rgba(113, 242, 255, .48); box-shadow: 0 20px 56px rgba(0,0,0,.32), 0 0 30px rgba(64, 200, 255, .14); }
.gx-entry-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 14px; color: #fff; background: linear-gradient(135deg, rgba(64, 200, 255, .25), rgba(146, 92, 255, .32)); border: 1px solid rgba(128,184,255,.24); }
.gx-entry-card strong { font-size: 20px; }
.gx-entry-card em { color: var(--gx-sub); font-style: normal; font-size: 14px; }
.gx-entry-card b { color: var(--gx-cyan); font-size: 14px; margin-top: 5px; }

.gx-footer { border-top: 1px solid rgba(128,184,255,.13); background: rgba(2,5,16,.72); }
.gx-footer-inner { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 18px; color: rgba(220, 233, 255, .68); font-size: 14px; }
.gx-footer-inner div { display: flex; align-items: center; gap: 10px; min-width: 0; }
.gx-footer-inner strong { color: #fff; }
.gx-footer-inner em { font-style: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gx-footer-logo { color: var(--gx-cyan); font-weight: 1000; }
.gx-footer nav { display: flex; gap: 18px; }
.gx-footer nav a:hover { color: #fff; }
.gx-footer p { margin: 0; }

.search-suggestions {
  position: absolute; left: 34px; right: 34px; top: calc(100% + 12px); z-index: 20; overflow: hidden;
  border: 1px solid rgba(128, 184, 255, .24); border-radius: 20px; background: rgba(5, 12, 27, .94); box-shadow: var(--gx-shadow); backdrop-filter: blur(20px);
}
.suggest-item { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 18px; color: rgba(230, 240, 255, .86); cursor: pointer; border-bottom: 1px solid rgba(128,184,255,.09); }
.suggest-item:hover { background: rgba(64, 200, 255, .09); color: #fff; }
.suggest-item mark { color: var(--gx-cyan); background: transparent; font-weight: 900; }
.suggest-tag { color: rgba(230, 240, 255, .58); font-size: 12px; border: 1px solid rgba(128,184,255,.14); border-radius: 999px; padding: 3px 8px; }

.announcement-overlay { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 22px; background: rgba(0, 0, 0, .56); backdrop-filter: blur(16px); animation: gxFade .2s var(--gx-ease); }
.announcement-modal { width: min(680px, 100%); border: 1px solid rgba(128, 184, 255, .30); border-radius: 26px; background: linear-gradient(180deg, rgba(9, 21, 44, .96), rgba(5, 12, 27, .96)); box-shadow: var(--gx-shadow), var(--gx-glow); overflow: hidden; }
.announcement-header, .announcement-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 20px; border-bottom: 1px solid rgba(128,184,255,.12); }
.announcement-header h3 { margin: 0; }
.announcement-close { width: 34px; height: 34px; border: 1px solid rgba(128,184,255,.2); border-radius: 10px; color: #fff; background: rgba(255,255,255,.05); }
.announcement-body { padding: 20px; color: rgba(229, 239, 255, .84); max-height: 60vh; overflow: auto; }
.announcement-body a { color: var(--gx-cyan); }
.announcement-footer { border-top: 1px solid rgba(128,184,255,.12); border-bottom: 0; justify-content: flex-end; }
.ann-btn { border: 0; border-radius: 999px; padding: 11px 22px; font-weight: 900; color: #031021; background: linear-gradient(135deg, #71f2ff, #925cff); }

.top-system-notice { position: fixed; left: 50%; top: 18px; z-index: 99999; transform: translateX(-50%); max-width: min(620px, calc(100vw - 30px)); border: 1px solid rgba(128,184,255,.32); border-radius: 999px; color: #fff; background: rgba(9, 21, 44, .92); backdrop-filter: blur(18px); box-shadow: var(--gx-shadow); padding: 12px 20px; font-weight: 800; }
.ac-turnstile-overlay { position: fixed; inset: 0; z-index: 99998; display: grid; place-items: center; padding: 22px; background: rgba(0,0,0,.62); backdrop-filter: blur(16px); }
.ac-turnstile-card { width: min(430px, 100%); border: 1px solid rgba(128,184,255,.32); border-radius: 24px; background: rgba(7,16,34,.96); color: #fff; padding: 24px; box-shadow: var(--gx-shadow), var(--gx-glow); }
.ac-turnstile-close { float: right; width: 32px; height: 32px; border: 1px solid rgba(128,184,255,.25); border-radius: 10px; background: rgba(255,255,255,.05); color: #fff; }
.ac-turnstile-submit { width: 100%; margin-top: 16px; border: 0; border-radius: 999px; padding: 12px 16px; font-weight: 900; background: linear-gradient(135deg, #71f2ff, #925cff); color: #031021; }
.ac-turnstile-status { min-height: 20px; color: var(--gx-cyan); margin-top: 12px; }

@keyframes gxReveal { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }
@keyframes gxCardIn { from { opacity: 0; transform: translateY(14px) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes gxRotate { to { transform: rotate(360deg); } }
@keyframes gxPulse { 0%,100% { transform: translate(-50%, -50%) scale(1); opacity: .88; } 50% { transform: translate(-50%, -50%) scale(1.05); opacity: 1; } }
@keyframes gxStars { from { transform: translateY(0); } to { transform: translateY(-60px); } }
@keyframes gxSkeleton { to { background-position: -200% 0; } }
@keyframes gxFade { from { opacity: 0; } to { opacity: 1; } }

@media (max-width: 1350px) {
  .game-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .gx-category-links { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .gx-ranking-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gx-bottom-grid { grid-template-columns: 1fr 1fr; }
  .gx-keywords-panel { grid-column: 1 / -1; }
}
@media (max-width: 1024px) {
  .gx-shell { width: min(100% - 32px, 960px); }
  .gx-hero-inner { grid-template-columns: 1fr; padding-top: 54px; }
  .gx-announcement-card { max-width: 520px; }
  .gx-nav { gap: 28px; }
  .gx-wanderer { right: 9%; opacity: .42; }
  .gx-portal-ring { left: 62%; opacity: .62; }
  .game-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 768px) {
  .gx-shell { width: min(100% - 24px, 560px); }
  .gx-header-inner { height: 64px; }
  .gx-nav, .gx-icon-btn { display: none; }
  .gx-menu-toggle { display: block; }
  .gx-brand-text { font-size: 19px; }
  .gx-logo-mark { width: 42px; height: 30px; font-size: 20px; }
  .gx-mobile-menu { position: absolute; top: calc(100% + 10px); right: 0; width: min(260px, calc(100vw - 24px)); display: none; padding: 10px; border: 1px solid rgba(128,184,255,.24); border-radius: 20px; background: rgba(5,12,27,.95); box-shadow: var(--gx-shadow); }
  .gx-mobile-menu.active { display: grid; }
  .gx-mobile-menu a { padding: 13px 14px; border-radius: 14px; color: rgba(232, 240, 255, .84); font-weight: 800; }
  .gx-mobile-menu a:hover { background: rgba(64,200,255,.08); color: #fff; }
  .gx-hero, .gx-hero-inner { min-height: 650px; }
  .gx-hero h1 { font-size: clamp(38px, 13vw, 56px); }
  .gx-search { height: 66px; padding-left: 56px; }
  .gx-search-icon { left: 22px; transform: scale(.82); }
  .gx-search input { font-size: 16px; }
  .gx-search button { width: 48px; height: 48px; }
  .gx-announcement-card { padding: 18px; }
  .gx-category-orbit { margin-top: -22px; padding: 14px; }
  .gx-category-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .category-link { min-height: 54px; }
  .gx-section-head { align-items: start; flex-direction: column; }
  .gx-sort-tabs { justify-content: flex-start; }
  .game-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .card-content h3 { font-size: 14px; min-height: 40px; }
  .card-content { padding: 11px; }
  .gx-ranking-strip { grid-template-columns: 1fr; }
  .ranking-item { grid-template-columns: auto 78px minmax(0,1fr); }
  .gx-bottom-grid { grid-template-columns: 1fr; }
  .gx-footer-inner { flex-direction: column; align-items: flex-start; padding: 20px 0; }
}
@media (max-width: 460px) {
  .gx-hero-tags { display: none; }
  .game-grid { grid-template-columns: 1fr; }
  .image-container { aspect-ratio: 16 / 9; }
  .gx-category-links { grid-template-columns: 1fr; }
  .gx-footer nav { flex-wrap: wrap; }
}

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

/* ======================================================================
   GX v2 shared page system: library / category / detail / wish / FAQ
   ====================================================================== */
.fas,.far,.fab{font-style:normal;font-family:inherit;display:inline-flex;align-items:center;justify-content:center;line-height:1}
.fa-bars::before{content:"☰"}.fa-gamepad::before{content:"🎮"}.fa-paper-plane::before{content:"➤"}.fa-search::before{content:"⌕"}.fa-plus::before{content:"＋"}.fa-clock::before{content:"⏱"}.fa-fire::before{content:"🔥"}.fa-cloud::before{content:"☁"}.fa-magic::before{content:"✦"}.fa-times::before,.fa-xmark::before{content:"×"}.fa-heart::before{content:"♥"}.fa-arrow-left::before{content:"←"}.fa-spinner::before{content:"⟳"}.fa-spin{animation:gxRotate 1s linear infinite}
.gx-header-search{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;padding:0 16px;min-width:auto}
.gx-page-main{position:relative;z-index:2;min-height:calc(100vh - 160px);padding-top:78px}.gx-static-page .gx-header,.gx-library-page .gx-header{background:rgba(2,5,16,.78)}
.gx-subhero{position:relative;overflow:hidden;border-bottom:1px solid rgba(128,184,255,.12);background:radial-gradient(circle at 22% 12%,rgba(64,200,255,.24),transparent 28%),radial-gradient(circle at 78% 0%,rgba(146,92,255,.24),transparent 30%),linear-gradient(180deg,rgba(7,16,36,.92),rgba(2,5,16,.72));}
.gx-subhero::before{content:"";position:absolute;inset:0;background:linear-gradient(118deg,transparent 0 42%,rgba(113,242,255,.10) 43%,transparent 47%),radial-gradient(circle at 58% 48%,rgba(113,242,255,.10),transparent 26%);opacity:.9;pointer-events:none}.gx-subhero-inner{position:relative;z-index:1;padding:72px 0 54px}.gx-subhero h1{margin:0;font-size:clamp(42px,5vw,78px);line-height:1;letter-spacing:-.08em;text-shadow:0 0 34px rgba(80,166,255,.30)}.gx-subhero p:not(.gx-eyebrow){max-width:760px;color:rgba(225,238,255,.78);font-size:18px}.gx-sub-search{margin-top:26px;height:66px;width:min(720px,100%)}
.gx-page-categories{margin-top:26px}.gx-library-page .gx-library{padding-bottom:60px}.gx-library-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.gx-home-preview .game-grid{min-height:0}.gx-home-preview #load-more-btn{text-decoration:none}.gx-home-bottom{grid-template-columns:minmax(0,1fr) minmax(320px,.55fr)}.gx-entry-note{min-height:100%}.gx-footer nav{display:none!important}.gx-footer-inner{justify-content:space-between}.gx-footer-inner p{color:rgba(220,233,255,.58)}

.gx-faq-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:42px 0 70px}.gx-faq-card{position:relative;overflow:hidden;border:1px solid rgba(128,184,255,.18);border-radius:22px;background:linear-gradient(180deg,rgba(9,21,44,.70),rgba(5,12,27,.78));box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 18px 44px rgba(0,0,0,.24);padding:24px}.gx-faq-card::before{content:"";position:absolute;inset:auto -20% -70% 35%;height:150px;border-radius:50%;background:radial-gradient(circle,rgba(113,242,255,.16),transparent 65%)}.gx-faq-card h2{position:relative;margin:0 0 12px;color:#fff;font-size:20px}.gx-faq-card p{position:relative;margin:0;color:var(--gx-sub);line-height:1.85}

.gx-stat-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:26px}.stat-item{border:1px solid rgba(128,184,255,.18);border-radius:18px;background:rgba(8,18,40,.58);padding:16px;text-align:center;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}.stat-number{font-size:30px;line-height:1;font-weight:1000;color:#fff;text-shadow:0 0 22px rgba(113,242,255,.35)}.stat-label{margin-top:8px;color:var(--gx-muted);font-size:13px;font-weight:800}.wish-container{padding:36px 0 72px}.gx-panel-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}.search-box-wish{position:relative;flex:1;display:flex;align-items:center;min-height:56px;border:1px solid rgba(128,184,255,.22);border-radius:999px;background:rgba(8,18,40,.64);box-shadow:inset 0 1px 0 rgba(255,255,255,.06);overflow:hidden}.search-box-wish input{flex:1;height:56px;border:0;outline:0;background:transparent;color:#fff;padding:0 20px;font-size:16px}.search-box-wish input::placeholder{color:rgba(225,238,255,.45)}.search-box-wish button{width:58px;height:56px;border:0;color:#fff;background:linear-gradient(135deg,rgba(64,200,255,.35),rgba(146,92,255,.42))}.sort-filter{display:flex;gap:8px}.sort-btn,.load-more-btn,.wish-submit-btn,.post-wish-btn{border:1px solid rgba(128,184,255,.22);border-radius:999px;background:rgba(8,18,40,.58);color:rgba(230,240,255,.82);font-weight:900;min-height:42px;padding:0 16px}.sort-btn.active,.sort-btn:hover,.load-more-btn:hover,.wish-submit-btn{color:#fff;border-color:rgba(113,242,255,.52);background:linear-gradient(135deg,rgba(64,200,255,.18),rgba(146,92,255,.24));box-shadow:0 0 26px rgba(64,200,255,.14)}.wish-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.wish-card{position:relative;overflow:hidden;border:1px solid rgba(128,184,255,.18);border-radius:22px;background:linear-gradient(180deg,rgba(9,21,44,.72),rgba(5,12,27,.82));box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 18px 44px rgba(0,0,0,.24);padding:20px;animation:gxCardIn .45s var(--gx-ease) both}.wish-card:hover{transform:translateY(-5px);border-color:rgba(113,242,255,.42);box-shadow:0 22px 56px rgba(0,0,0,.35),0 0 24px rgba(64,200,255,.14)}.wish-game-name{font-weight:1000;color:#fff;display:flex;gap:8px;align-items:center;flex-wrap:wrap}.wish-status-badge{margin-left:auto;border:1px solid rgba(128,184,255,.18);border-radius:999px;padding:3px 8px;color:var(--gx-muted);font-size:12px}.wish-status-badge.completed{color:#8dfad9;border-color:rgba(141,250,217,.28)}.wish-content{margin:14px 0;color:var(--gx-sub);line-height:1.75}.wish-footer{display:flex;align-items:center;justify-content:space-between;gap:10px}.wish-author-info{display:grid;color:var(--gx-muted);font-size:12px}.wish-like-btn{position:relative;display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(255,120,184,.22);border-radius:999px;background:rgba(255,85,160,.08);color:#ff9ac7;min-height:36px;padding:0 12px}.wish-like-btn.liked{color:#fff;background:linear-gradient(135deg,rgba(255,80,160,.38),rgba(146,92,255,.24));box-shadow:0 0 24px rgba(255,80,160,.18)}.wish-like-float{position:absolute;left:50%;top:-18px;transform:translateX(-50%);color:#ff9ac7;animation:gxFloatUp .56s ease both}.wish-empty,.load-more-container{text-align:center;color:var(--gx-sub);margin-top:24px}.publish-btn{position:fixed;right:24px;bottom:24px;z-index:80;width:62px;height:62px;border:1px solid rgba(113,242,255,.48);border-radius:50%;color:#fff;background:radial-gradient(circle at 35% 25%,#75efff,#5b7cff 50%,#8f52ff);box-shadow:var(--gx-glow),0 18px 48px rgba(0,0,0,.45);font-size:24px}.wish-modal{position:fixed;inset:0;z-index:1000;display:none;place-items:center;padding:22px;background:rgba(0,0,0,.62);backdrop-filter:blur(16px)}.wish-modal.active{display:grid}.wish-modal-content{width:min(620px,100%);border:1px solid rgba(128,184,255,.28);border-radius:26px;background:linear-gradient(180deg,rgba(9,21,44,.96),rgba(5,12,27,.98));box-shadow:var(--gx-shadow),var(--gx-glow);overflow:hidden}.wish-modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px;border-bottom:1px solid rgba(128,184,255,.12)}.wish-modal-header h2{margin:0}.wish-modal-close{width:38px;height:38px;border:1px solid rgba(128,184,255,.20);border-radius:12px;color:#fff;background:rgba(255,255,255,.05)}.wish-form{display:grid;gap:16px;padding:20px}.form-group{display:grid;gap:8px}.form-group label{font-weight:900;color:#fff}.form-group span{color:#ff9ac7}.form-group input,.form-group textarea{width:100%;border:1px solid rgba(128,184,255,.18);border-radius:16px;background:rgba(2,8,20,.42);color:#fff;padding:14px 16px;outline:0}.form-group textarea{min-height:140px;resize:vertical}.form-group small,.char-count{color:var(--gx-muted)}.wish-message{margin:16px 20px 0;padding:12px 14px;border-radius:14px}.wish-message.success{background:rgba(61,220,151,.12);color:#9ffad4}.wish-message.error{background:rgba(255,90,125,.12);color:#ffb0bf}@keyframes gxFloatUp{to{opacity:0;transform:translate(-50%,-18px)}}

.seo-category-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:22px}.seo-category-pill,#more-link{display:inline-flex;align-items:center;min-height:38px;padding:0 14px;border-radius:999px;border:1px solid rgba(128,184,255,.22);background:rgba(8,18,40,.58);color:rgba(230,240,255,.84);font-weight:900}#more-link{color:var(--gx-cyan)}.seo-category-nav{display:grid;grid-template-columns:repeat(8,minmax(104px,1fr));gap:10px}.seo-category-nav a{position:relative;min-height:52px;display:flex;align-items:center;justify-content:center;padding:10px;border:1px solid rgba(130,190,255,.16);border-radius:16px;color:rgba(225,237,255,.78);background:rgba(9,21,44,.54);font-weight:800;transition:.22s var(--gx-ease)}.seo-category-nav a:hover,.seo-category-nav a.active{color:#fff;transform:translateY(-3px);border-color:rgba(113,242,255,.50);background:linear-gradient(180deg,rgba(22,44,88,.82),rgba(9,21,44,.58));box-shadow:0 16px 42px rgba(33,120,255,.18)}.gx-category-list{padding:40px 0}.seo-game-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:18px}.seo-game-card{display:block;overflow:hidden;border:1px solid rgba(128,184,255,.20);border-radius:22px;background:linear-gradient(180deg,rgba(9,21,44,.84),rgba(4,9,22,.86));box-shadow:0 18px 46px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.07);transition:.28s var(--gx-ease)}.seo-game-card:hover{transform:translateY(-7px);border-color:rgba(113,242,255,.50);box-shadow:0 30px 70px rgba(0,0,0,.42),0 0 30px rgba(64,200,255,.16)}.seo-game-cover{width:100%;aspect-ratio:16/11;object-fit:cover;display:block;background:#101b34}.seo-game-body{padding:14px}.seo-game-title{color:#fff;font-weight:950;line-height:1.35;min-height:42px}.seo-game-time{margin-top:8px;color:var(--gx-muted);font-size:12px}.seo-pagination{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:30px}.seo-page-link{min-width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(128,184,255,.22);border-radius:14px;color:rgba(230,240,255,.78);background:rgba(8,18,40,.58);font-weight:900}.seo-page-link.active,.seo-page-link:hover{color:#fff;border-color:rgba(113,242,255,.52);box-shadow:0 0 24px rgba(64,200,255,.16)}.seo-related-text{margin-bottom:70px;border:1px solid rgba(128,184,255,.16);border-radius:22px;padding:22px;color:var(--gx-sub);background:rgba(9,21,44,.50);line-height:1.85}.seo-empty{grid-column:1/-1;color:var(--gx-sub);padding:36px;border:1px dashed rgba(128,184,255,.22);border-radius:22px;text-align:center}

.gx-detail-page .game-detail{position:relative;z-index:2;padding:110px 0 46px;background:transparent!important}.gx-detail-page .detail-scale-box{width:min(1180px,calc(100vw - 32px));overflow:visible}.gx-detail-page .detail-fixed-canvas{width:auto!important;min-width:0!important;max-width:none!important;transform:none!important}.gx-detail-page .back-link{display:inline-flex;align-items:center;gap:8px;margin:0 0 16px;color:var(--gx-cyan);font-weight:900}.gx-detail-page .detail-container{border:1px solid rgba(128,184,255,.20)!important;border-radius:28px!important;background:linear-gradient(180deg,rgba(9,21,44,.74),rgba(5,12,27,.84))!important;box-shadow:var(--gx-shadow)!important;overflow:hidden!important}.gx-detail-page .detail-top{background:radial-gradient(circle at 18% 0%,rgba(64,200,255,.18),transparent 35%),linear-gradient(180deg,rgba(12,25,54,.72),rgba(5,12,27,.52))!important}.gx-detail-page .detail-title{color:#fff!important;text-shadow:0 0 28px rgba(80,166,255,.24);letter-spacing:-.05em}.gx-detail-page .detail-meta span,.gx-detail-page .detail-category-badge,.gx-detail-page .game-tag{border:1px solid rgba(128,184,255,.18)!important;border-radius:999px!important;background:rgba(8,18,40,.58)!important;color:rgba(230,240,255,.80)!important}.gx-detail-page .summary-item{border:1px solid rgba(128,184,255,.16)!important;border-radius:18px!important;background:rgba(8,18,40,.52)!important;color:var(--gx-muted)!important}.gx-detail-page .summary-item strong{color:#fff!important}.gx-detail-page .content-section{border:1px solid rgba(128,184,255,.16)!important;border-radius:22px!important;background:rgba(8,18,40,.42)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)!important}.gx-detail-page .content-title{color:#fff!important}.gx-detail-page .game-description,.gx-detail-page .scrape-sections{color:rgba(225,238,255,.78)!important}.gx-detail-page .download-item,.gx-detail-page .related-card{border:1px solid rgba(128,184,255,.18)!important;border-radius:18px!important;background:linear-gradient(180deg,rgba(9,21,44,.70),rgba(5,12,27,.78))!important}.gx-detail-page .download-btn{border-radius:999px!important;border:1px solid rgba(113,242,255,.34)!important;background:linear-gradient(135deg,rgba(64,200,255,.22),rgba(146,92,255,.28))!important;color:#fff!important}.gx-detail-page .grid-image{border-radius:18px!important;border:1px solid rgba(128,184,255,.16)!important}

@media (max-width:1180px){.gx-library-grid,.game-grid,.seo-game-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.wish-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.seo-category-nav,.gx-category-links{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:860px){.gx-page-main{padding-top:66px}.gx-subhero-inner{padding:52px 0 38px}.gx-subhero h1{font-size:42px}.gx-faq-grid{grid-template-columns:1fr}.gx-panel-row{flex-direction:column;align-items:stretch}.gx-stat-row{grid-template-columns:repeat(2,minmax(0,1fr))}.wish-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.gx-home-bottom{grid-template-columns:1fr}.seo-category-nav,.gx-category-links{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.gx-library-grid,.game-grid,.seo-game-grid,.wish-grid{grid-template-columns:1fr}.gx-sub-search{height:58px}.gx-subhero p:not(.gx-eyebrow){font-size:15px}.publish-btn{right:16px;bottom:16px;width:56px;height:56px}}

/* ======================================================================
   GX v3 refined design layer — higher fidelity visual polish
   ====================================================================== */
body.gx-home-page,
body.gx-library-page,
body.gx-static-page,
body.gx-detail-page {
  margin: 0;
  min-height: 100vh;
  overflow-x: hidden;
  color: var(--gx-text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
  background:
    radial-gradient(circle at 50% -16%, rgba(87, 132, 255, .30), transparent 34%),
    radial-gradient(circle at 12% 18%, rgba(151, 91, 255, .18), transparent 26%),
    radial-gradient(circle at 88% 16%, rgba(52, 224, 255, .14), transparent 30%),
    linear-gradient(180deg, #02040e 0%, #030714 48%, #040711 100%);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}
body.gx-home-page::before,
body.gx-library-page::before,
body.gx-static-page::before,
body.gx-detail-page::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px) 0 0/100% 4px,
    radial-gradient(circle at 50% 0%, rgba(113, 242, 255, .08), transparent 35%),
    radial-gradient(ellipse at 50% 100%, rgba(146, 92, 255, .13), transparent 38%);
  mix-blend-mode: screen;
  opacity: .75;
}
body.gx-home-page::after,
body.gx-library-page::after,
body.gx-static-page::after,
body.gx-detail-page::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(ellipse at center, transparent 0 48%, rgba(0,0,0,.42) 100%);
}

.gx-shell { width: min(1560px, calc(100vw - 64px)); }
.gx-header {
  background:
    linear-gradient(180deg, rgba(2, 5, 16, .90), rgba(2, 5, 16, .62)),
    linear-gradient(90deg, transparent, rgba(113,242,255,.08), transparent);
  border-bottom: 1px solid rgba(128, 184, 255, .18);
  box-shadow: 0 14px 42px rgba(0,0,0,.22), inset 0 -1px 0 rgba(255,255,255,.035);
}
.gx-header::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(113,242,255,.55), rgba(146,92,255,.42), transparent);
  opacity: .8;
}
.gx-logo-mark {
  position: relative;
  border: 1px solid rgba(255,255,255,.24);
  overflow: hidden;
}
.gx-logo-mark::after {
  content: "";
  position: absolute;
  inset: -38% -55%;
  background: linear-gradient(110deg, transparent 35%, rgba(255,255,255,.72) 50%, transparent 64%);
  transform: translateX(-62%) rotate(8deg);
  animation: gxLogoShine 6s var(--gx-ease) infinite;
}
.gx-brand-text {
  background: linear-gradient(180deg, #fff, rgba(216,229,255,.84));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.gx-nav {
  padding: 0 10px;
  border: 1px solid rgba(128,184,255,.10);
  border-radius: 999px;
  background: rgba(6, 13, 30, .34);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
  gap: 10px;
  flex: 0 1 auto;
}
.gx-nav a {
  padding: 10px 17px;
  border-radius: 999px;
  font-size: 14px;
}
.gx-nav a::after { display: none; }
.gx-nav a:hover,
.gx-nav a.active {
  background: linear-gradient(135deg, rgba(64, 200, 255, .16), rgba(146, 92, 255, .18));
  box-shadow: inset 0 0 0 1px rgba(113,242,255,.24), 0 0 26px rgba(64,200,255,.12);
}
.gx-header-inner { justify-content: space-between; }
.gx-icon-btn,
.gx-menu-toggle {
  transition: transform .22s var(--gx-ease), border-color .22s var(--gx-ease), box-shadow .22s var(--gx-ease), background .22s var(--gx-ease);
}
.gx-icon-btn:hover,
.gx-menu-toggle:hover { transform: translateY(-2px); }

.gx-hero {
  min-height: 690px;
  border-bottom: 1px solid rgba(128,184,255,.14);
}
.gx-hero::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 150px;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(180deg, transparent, #020510 84%);
}
.gx-hero-inner { min-height: 690px; grid-template-columns: minmax(0, 1fr) 420px; gap: 72px; }
.gx-hero-copy {
  max-width: 860px;
  padding: 34px;
  border: 1px solid rgba(128, 184, 255, .14);
  border-radius: 36px;
  background: linear-gradient(135deg, rgba(7, 15, 34, .42), rgba(6, 12, 27, .16));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 34px 120px rgba(0,0,0,.24);
  backdrop-filter: blur(12px) saturate(140%);
}
.gx-eyebrow {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 12px 0 7px;
  border: 1px solid rgba(113,242,255,.24);
  border-radius: 999px;
  background: rgba(6, 16, 38, .56);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 0 22px rgba(64,200,255,.10);
}
.gx-hero h1,
.gx-subhero h1 {
  background: linear-gradient(180deg, #fff 0%, #e8f4ff 42%, #91d9ff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 0 26px rgba(80,166,255,.24));
}
.gx-hero-subtitle { max-width: 760px; }
.gx-search {
  overflow: visible;
  border: 1px solid rgba(113,242,255,.32);
  background:
    linear-gradient(180deg, rgba(9, 21, 44, .76), rgba(5, 12, 27, .72)),
    radial-gradient(circle at 18% 0%, rgba(113,242,255,.20), transparent 34%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 24px 70px rgba(0,0,0,.34), 0 0 0 8px rgba(113,242,255,.035);
}
.gx-search:focus-within {
  border-color: rgba(113,242,255,.72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 28px 80px rgba(0,0,0,.38), 0 0 0 8px rgba(113,242,255,.08), 0 0 46px rgba(64,200,255,.24);
}
.gx-search button { position: relative; overflow: hidden; }
.gx-search button::after {
  content: "";
  position: absolute;
  inset: -40%;
  background: conic-gradient(from 0deg, transparent, rgba(255,255,255,.62), transparent 32%);
  animation: gxRotate 4s linear infinite;
  opacity: .5;
}
.gx-search button svg { position: relative; z-index: 1; }
.gx-hero-tags button,
.gx-keyword-row button,
.gx-subhero-badges span {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.gx-hero-tags button::before,
.gx-keyword-row button::before,
.gx-subhero-badges span::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: radial-gradient(circle at 50% 0%, rgba(113,242,255,.24), transparent 58%);
  opacity: 0;
  transition: opacity .24s var(--gx-ease);
}
.gx-hero-tags button:hover::before,
.gx-keyword-row button:hover::before,
.gx-subhero-badges span:hover::before { opacity: 1; }
.gx-hero-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 18px;
}
.gx-hero-metrics span {
  position: relative;
  min-height: 72px;
  padding: 14px 16px;
  border: 1px solid rgba(128,184,255,.15);
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(8,18,40,.54), rgba(4,10,24,.38));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
  overflow: hidden;
}
.gx-hero-metrics span::after {
  content: "";
  position: absolute;
  inset: auto -15% -45% 25%;
  height: 70px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(113,242,255,.18), transparent 68%);
}
.gx-hero-metrics b { display: block; color: #fff; font-size: 28px; line-height: 1; font-weight: 1000; letter-spacing: -.05em; }
.gx-hero-metrics em { display: block; margin-top: 7px; color: var(--gx-muted); font-size: 12px; font-style: normal; font-weight: 850; }
.gx-announcement-card {
  border-radius: 30px;
  padding: 24px;
  background:
    linear-gradient(180deg, rgba(12, 24, 52, .72), rgba(4, 10, 24, .82)),
    radial-gradient(circle at 0% 0%, rgba(113,242,255,.22), transparent 42%);
  box-shadow: var(--gx-shadow), 0 0 0 8px rgba(113,242,255,.03), 0 34px 100px rgba(0,0,0,.32);
}
.gx-announcement-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(113,242,255,.54), transparent 32%, rgba(146,92,255,.42));
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
  -webkit-mask-composite: xor;
  pointer-events: none;
}
.gx-card-head { align-items: center; }
.gx-card-head h2 { margin-bottom: 1px; }
.gx-card-head p { margin: 0; color: var(--gx-muted); font-size: 12px; font-weight: 800; }
.gx-announcement-list p,
.gx-announcement-list li {
  padding: 10px 0;
  border-bottom: 1px solid rgba(128,184,255,.09);
}

.gx-category-orbit {
  position: relative;
  border-radius: 28px;
  background:
    linear-gradient(180deg, rgba(10, 22, 48, .72), rgba(5, 12, 27, .78)),
    radial-gradient(circle at 10% 0%, rgba(113,242,255,.15), transparent 34%);
  box-shadow: var(--gx-shadow);
}
.category-link,
.seo-category-nav a {
  overflow: hidden;
  isolation: isolate;
}
.category-link::before,
.seo-category-nav a::before {
  transition: transform .28s var(--gx-ease), opacity .28s var(--gx-ease);
}
.category-link::after,
.seo-category-nav a::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(135deg, transparent, rgba(113,242,255,.10), transparent);
  transform: translateX(-110%);
  transition: transform .55s var(--gx-ease);
}
.category-link:hover::after,
.seo-category-nav a:hover::after { transform: translateX(110%); }

.gx-section-head {
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(128,184,255,.10);
}
.gx-section-kicker { color: rgba(113,242,255,.92); text-shadow: 0 0 18px rgba(113,242,255,.24); }
.gx-section-head h2,
.gx-section-mini-head span:first-child {
  color: #fff;
  text-shadow: 0 0 22px rgba(80,166,255,.18);
}
.gx-more-link {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid rgba(113,242,255,.22);
  border-radius: 999px;
  background: rgba(8,18,40,.42);
  transition: transform .22s var(--gx-ease), border-color .22s var(--gx-ease), background .22s var(--gx-ease);
}
.gx-more-link:hover { transform: translateY(-2px); border-color: rgba(113,242,255,.58); background: rgba(64,200,255,.10); }
.game-grid { gap: 20px; }
.gx-home-preview .game-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  grid-auto-flow: dense;
}
.gx-home-preview .game-card:first-child {
  grid-column: span 2;
  grid-row: span 2;
}
.gx-home-preview .game-card:first-child .image-container { aspect-ratio: 16/14; }
.gx-home-preview .game-card:first-child .card-content { min-height: 132px; padding: 18px; }
.gx-home-preview .game-card:first-child .card-content h3 { font-size: 22px; min-height: 58px; }
.game-card {
  border-radius: 26px;
  border-color: rgba(128,184,255,.18);
  background:
    linear-gradient(180deg, rgba(11, 23, 50, .88), rgba(4, 9, 22, .92)),
    radial-gradient(circle at 50% 18%, rgba(113,242,255,.18), transparent 36%);
  box-shadow: 0 18px 46px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.07);
}
.game-card::before { background: linear-gradient(180deg, transparent 28%, rgba(1,5,14,.34) 56%, rgba(1,5,14,.92) 100%); }
.game-card .image-container::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent 20%, rgba(255,255,255,.10) 44%, transparent 58%);
  transform: translateX(-130%);
  transition: transform .8s var(--gx-ease);
  pointer-events: none;
}
.game-card:hover .image-container::after { transform: translateX(130%); }
.card-content h3 { letter-spacing: -.04em; }
.card-tags { min-height: 26px; }
.game-tag { height: 25px; color: rgba(232,243,255,.86); }
.card-meta {
  padding-top: 10px;
  border-top: 1px solid rgba(128,184,255,.10);
}
.free-tag {
  box-shadow: 0 8px 20px rgba(64,200,255,.24);
}

.gx-ranking-strip { gap: 14px; }
.ranking-item {
  position: relative;
  border-radius: 24px;
  min-height: 108px;
}
.ranking-item::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: linear-gradient(180deg, var(--gx-cyan), var(--gx-violet));
  opacity: .5;
}
.ranking-item:first-child {
  min-height: 124px;
  background:
    radial-gradient(circle at 15% 0%, rgba(255,213,129,.18), transparent 42%),
    linear-gradient(180deg, rgba(18,31,60,.86), rgba(6,13,30,.82));
}
.ranking-cover { border: 1px solid rgba(255,255,255,.08); box-shadow: 0 10px 28px rgba(0,0,0,.25); }

.gx-bottom-grid { padding-top: 50px; }
.gx-keywords-panel,
.gx-entry-card,
.gx-faq-card,
.stat-item,
.wish-card,
.seo-related-text,
.seo-game-card,
.gx-subhero-badges span {
  backdrop-filter: blur(18px) saturate(145%);
  -webkit-backdrop-filter: blur(18px) saturate(145%);
}
.gx-entry-note strong { font-size: 22px; letter-spacing: -.04em; }
.gx-footer {
  background:
    linear-gradient(180deg, rgba(2,5,16,.18), rgba(2,5,16,.78)),
    radial-gradient(circle at 50% 0%, rgba(113,242,255,.08), transparent 40%);
}
.gx-footer-inner { min-height: 88px; }

.gx-subhero { border-bottom: 1px solid rgba(128,184,255,.15); }
.gx-subhero::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(113,242,255,.44), transparent);
}
.gx-subhero-badges { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.gx-subhero-badges span {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 13px;
  border: 1px solid rgba(128,184,255,.20);
  border-radius: 999px;
  color: rgba(232,242,255,.82);
  background: rgba(8,18,40,.46);
  font-size: 13px;
  font-weight: 850;
}
.gx-library-grid { gap: 20px; }
.sort-tab { min-height: 42px; padding: 0 17px; }
.sort-tab.active { box-shadow: 0 0 30px rgba(64,200,255,.18), inset 0 1px 0 rgba(255,255,255,.08); }
.gx-load-more { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }

.gx-faq-grid { gap: 20px; }
.gx-faq-card {
  border-radius: 26px;
  padding: 28px;
  transition: transform .25s var(--gx-ease), border-color .25s var(--gx-ease), box-shadow .25s var(--gx-ease);
}
.gx-faq-card:hover { transform: translateY(-6px); border-color: rgba(113,242,255,.44); box-shadow: 0 24px 64px rgba(0,0,0,.32), 0 0 26px rgba(64,200,255,.12); }
.gx-faq-card h2::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 9px;
  border-radius: 50%;
  background: var(--gx-cyan);
  box-shadow: 0 0 18px rgba(113,242,255,.7);
}

.wish-container { padding-top: 42px; }
.wish-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 50% 18%, rgba(255, 108, 190, .12), transparent 38%);
  opacity: 0;
  transition: opacity .25s var(--gx-ease);
  pointer-events: none;
}
.wish-card:hover::before { opacity: 1; }
.publish-btn {
  transition: transform .26s var(--gx-ease), box-shadow .26s var(--gx-ease), filter .26s var(--gx-ease);
}
.publish-btn:hover { transform: translateY(-5px) rotate(6deg); filter: saturate(1.12); }
.wish-modal-content { border-radius: 30px; }
.form-group input:focus,
.form-group textarea:focus,
.search-box-wish:focus-within { border-color: rgba(113,242,255,.62); box-shadow: 0 0 0 6px rgba(113,242,255,.07); }

.seo-category-nav { gap: 12px; }
.seo-game-card { border-radius: 26px; position: relative; }
.seo-game-cover { aspect-ratio: 16/10; }
.seo-game-body { padding: 16px; }
.seo-game-title { letter-spacing: -.04em; }
.seo-pagination { margin-bottom: 10px; }
.seo-page-link { transition: transform .2s var(--gx-ease), border-color .2s var(--gx-ease), box-shadow .2s var(--gx-ease); }
.seo-page-link:hover { transform: translateY(-3px); }

.gx-detail-page .detail-container { border-radius: 32px!important; }
.gx-detail-page .detail-top { position: relative; overflow: hidden; }
.gx-detail-page .detail-top::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle at 78% 0%, rgba(146,92,255,.18), transparent 38%), linear-gradient(120deg, transparent 0 46%, rgba(113,242,255,.08) 50%, transparent 56%);
}
.gx-detail-page .content-section,
.gx-detail-page .download-item,
.gx-detail-page .related-card,
.gx-detail-page .summary-item {
  backdrop-filter: blur(16px) saturate(145%);
  -webkit-backdrop-filter: blur(16px) saturate(145%);
  transition: transform .25s var(--gx-ease), border-color .25s var(--gx-ease), box-shadow .25s var(--gx-ease);
}
.gx-detail-page .content-section:hover,
.gx-detail-page .download-item:hover,
.gx-detail-page .related-card:hover { transform: translateY(-4px); border-color: rgba(113,242,255,.38)!important; box-shadow: 0 18px 46px rgba(0,0,0,.26), 0 0 24px rgba(64,200,255,.10)!important; }

.reveal-card,
.gx-category-orbit,
.gx-library,
.gx-hot,
.gx-bottom-grid,
.gx-faq-card,
.wish-card,
.seo-game-card,
.gx-detail-page .content-section { animation: gxRefinedIn .58s var(--gx-ease) both; }
@keyframes gxRefinedIn { from { opacity: 0; transform: translateY(18px) scale(.985); filter: blur(3px); } to { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); } }
@keyframes gxLogoShine { 0%, 48%, 100% { transform: translateX(-72%) rotate(8deg); opacity: 0; } 54% { opacity: .85; } 64% { transform: translateX(72%) rotate(8deg); opacity: 0; } }

@media (max-width: 1350px) {
  .gx-home-preview .game-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .gx-home-preview .game-card:first-child { grid-column: span 2; }
}
@media (max-width: 1024px) {
  .gx-shell { width: min(100% - 36px, 980px); }
  .gx-hero-copy { padding: 26px; }
  .gx-hero-inner { grid-template-columns: 1fr; }
  .gx-home-preview .game-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .gx-home-preview .game-card:first-child { grid-column: span 2; }
}
@media (max-width: 768px) {
  .gx-shell { width: min(100% - 26px, 620px); }
  .gx-nav { display: none; }
  .gx-hero { min-height: auto; }
  .gx-hero-inner { min-height: auto; padding: 42px 0 60px; gap: 22px; }
  .gx-hero-copy { padding: 22px; border-radius: 28px; }
  .gx-hero-metrics { grid-template-columns: 1fr; }
  .gx-home-preview .game-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gx-home-preview .game-card:first-child { grid-column: span 2; grid-row: span 1; }
  .gx-home-preview .game-card:first-child .image-container { aspect-ratio: 16/9; }
  .gx-home-preview .game-card:first-child .card-content h3 { font-size: 18px; min-height: auto; }
  .gx-card-head p { display: none; }
  .gx-subhero-badges { gap: 8px; }
  .gx-subhero-badges span { min-height: 32px; font-size: 12px; }
}
@media (max-width: 560px) {
  .gx-shell { width: min(100% - 20px, 480px); }
  .gx-hero-copy { padding: 18px; }
  .gx-home-preview .game-grid { grid-template-columns: 1fr; }
  .gx-home-preview .game-card:first-child { grid-column: auto; }
  .gx-hero-metrics { display: none; }
  .gx-section-head { gap: 12px; }
}

.gx-faq-card::after,
.seo-game-card::after,
.gx-detail-page .content-section::after,
.gx-detail-page .download-item::after,
.gx-detail-page .related-card::after,
.gx-detail-page .summary-item::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(circle at 50% 18%, rgba(113,242,255,.12), transparent 38%);
  transition: opacity .25s var(--gx-ease);
}
.gx-faq-card:hover::after,
.seo-game-card:hover::after,
.gx-detail-page .content-section:hover::after,
.gx-detail-page .download-item:hover::after,
.gx-detail-page .related-card:hover::after,
.gx-detail-page .summary-item:hover::after { opacity: 1; }
.gx-detail-page .content-section,
.gx-detail-page .download-item,
.gx-detail-page .related-card,
.gx-detail-page .summary-item { position: relative; overflow: hidden; }
.gx-announcement-card { position: relative; overflow: hidden; }

/* ======================================================================
   GX v4 unified refinement — request-driven page structure cleanup
   ====================================================================== */
body.gx-home-page,
body.gx-library-page,
body.gx-static-page,
body.gx-detail-page {
  background:
    radial-gradient(circle at 50% -14%, rgba(74, 137, 255, .28), transparent 34%),
    radial-gradient(circle at 13% 16%, rgba(148, 91, 255, .18), transparent 28%),
    radial-gradient(circle at 88% 18%, rgba(46, 222, 255, .14), transparent 32%),
    radial-gradient(ellipse at 50% 112%, rgba(92, 77, 255, .14), transparent 44%),
    linear-gradient(180deg, #02040d 0%, #030713 50%, #040812 100%) !important;
}
.gx-bg {
  background:
    linear-gradient(180deg, rgba(2,4,13,.08), rgba(2,4,13,.55)),
    radial-gradient(circle at 50% 0%, rgba(113,242,255,.08), transparent 36%) !important;
}
.gx-grid { opacity: .22; }
.gx-header-inner { gap: 18px; }
.gx-header-actions { min-width: 220px; justify-content: flex-end; }
.gx-header-search-form {
  position: relative;
  width: clamp(174px, 17vw, 260px);
  height: 40px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 8px 0 15px;
  border: 1px solid rgba(128,184,255,.22);
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(10,21,44,.72), rgba(5,12,27,.52));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 12px 30px rgba(0,0,0,.22);
  backdrop-filter: blur(18px) saturate(160%);
  -webkit-backdrop-filter: blur(18px) saturate(160%);
  overflow: hidden;
  transition: width .26s var(--gx-ease), border-color .22s var(--gx-ease), box-shadow .22s var(--gx-ease), background .22s var(--gx-ease);
}
.gx-header-search-form::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle at 12% 0%, rgba(113,242,255,.20), transparent 52%);
  opacity: .62;
}
.gx-header-search-form:focus-within {
  width: clamp(220px, 21vw, 320px);
  border-color: rgba(113,242,255,.58);
  box-shadow: 0 0 0 1px rgba(113,242,255,.08), 0 0 34px rgba(64,200,255,.18), inset 0 1px 0 rgba(255,255,255,.09);
}
.gx-header-search-input {
  position: relative;
  z-index: 1;
  flex: 1;
  min-width: 0;
  border: 0;
  outline: 0;
  height: 100%;
  color: #fff;
  background: transparent;
  font-size: 13px;
  font-weight: 700;
}
.gx-header-search-input::placeholder { color: rgba(220,232,255,.48); }
.gx-header-search-submit {
  position: relative;
  z-index: 1;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  border: 1px solid rgba(113,242,255,.34);
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(64,200,255,.32), rgba(146,92,255,.34));
  box-shadow: 0 0 20px rgba(64,200,255,.14);
}
.gx-header-search-submit span,
.gx-header-search-submit::before {
  content: "";
  position: absolute;
  display: block;
}
.gx-header-search-submit span {
  width: 10px;
  height: 10px;
  left: 7px;
  top: 7px;
  border: 2px solid #fff;
  border-radius: 50%;
}
.gx-header-search-submit::before {
  width: 7px;
  height: 2px;
  left: 16px;
  top: 18px;
  border-radius: 99px;
  background: #fff;
  transform: rotate(45deg);
}
.gx-hero-keywords {
  margin-top: 18px;
  max-width: 840px;
  padding: 14px;
  border: 1px solid rgba(128,184,255,.16);
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(6,14,30,.44), rgba(4,9,22,.30));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter: blur(16px) saturate(150%);
  -webkit-backdrop-filter: blur(16px) saturate(150%);
}
.gx-hero-keywords .gx-section-mini-head { margin: 0 0 10px; }
.gx-hero-keywords .gx-section-mini-head em { color: var(--gx-muted); font-style: normal; font-weight: 800; }
.gx-hero-keywords .gx-keyword-row { gap: 8px; }
.gx-home-preview { padding-top: 54px; }
.gx-home-preview .gx-section-head {
  border: 1px solid rgba(128,184,255,.16);
  border-radius: 26px;
  padding: 18px 20px;
  margin-bottom: 20px;
  background: linear-gradient(180deg, rgba(9,21,44,.56), rgba(5,12,27,.36));
}
.gx-home-preview .game-grid .game-card:first-child { grid-column: span 2; }
.gx-home-preview .game-grid .game-card:first-child .image-container { aspect-ratio: 16/9; }
.gx-library-main { padding-top: 118px; }
.gx-library-only {
  padding: 0 0 72px;
}
.gx-library-only-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 560px);
  gap: 28px;
  align-items: end;
  margin-bottom: 22px;
  padding: 28px;
  border: 1px solid rgba(128,184,255,.18);
  border-radius: 30px;
  background:
    radial-gradient(circle at 16% 0%, rgba(64,200,255,.16), transparent 32%),
    linear-gradient(180deg, rgba(9,21,44,.66), rgba(5,12,27,.52));
  box-shadow: var(--gx-shadow);
}
.gx-library-only-head h1 {
  margin: 2px 0 10px;
  font-size: clamp(38px, 5vw, 70px);
  line-height: 1;
  letter-spacing: -.08em;
}
.gx-library-only-head p { max-width: 720px; margin: 0; color: var(--gx-sub); }
.gx-library-search { width: 100%; max-width: none; height: 64px; }
.gx-library-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 22px;
  padding: 14px 16px;
  border: 1px solid rgba(128,184,255,.14);
  border-radius: 22px;
  background: rgba(6,14,30,.44);
}
.gx-toolbar-label { color: #fff; font-weight: 1000; letter-spacing: -.02em; }
.gx-category-main { padding-top: 118px; }
.gx-category-only { margin-bottom: 24px; }
.gx-category-only .gx-section-mini-head {
  padding: 18px 20px;
  margin: 0 0 14px;
  border: 1px solid rgba(128,184,255,.15);
  border-radius: 24px;
  background: rgba(6,14,30,.44);
}
.gx-category-main .gx-category-list { padding-top: 12px; }
.gx-category-main .gx-section-head {
  padding: 18px 20px;
  margin-bottom: 18px;
  border: 1px solid rgba(128,184,255,.15);
  border-radius: 24px;
  background: rgba(6,14,30,.44);
}
.gx-category-main .seo-related-text,
.gx-category-main .seo-category-hero { display: none !important; }
.gx-wish-redesign { padding-top: 112px; }
.wish-stage {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr);
  gap: 22px;
  align-items: stretch;
  margin-bottom: 24px;
}
.wish-hero-panel,
.wish-signal-panel,
.wish-board {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(128,184,255,.18);
  border-radius: 32px;
  background:
    radial-gradient(circle at 18% 0%, rgba(255,96,194,.14), transparent 34%),
    radial-gradient(circle at 82% 6%, rgba(64,200,255,.14), transparent 34%),
    linear-gradient(180deg, rgba(9,21,44,.70), rgba(5,12,27,.58));
  box-shadow: var(--gx-shadow);
}
.wish-hero-panel { min-height: 340px; padding: 36px; display: flex; flex-direction: column; justify-content: center; }
.wish-hero-panel::after {
  content: "";
  position: absolute;
  right: -80px;
  top: 34px;
  width: 280px;
  height: 280px;
  border-radius: 50%;
  border: 1px solid rgba(255,128,208,.24);
  box-shadow: 0 0 0 36px rgba(255,128,208,.025), 0 0 0 72px rgba(113,242,255,.018), 0 0 60px rgba(255,96,194,.18);
}
.wish-hero-panel h1 { margin: 0; font-size: clamp(46px, 6vw, 88px); line-height: .95; letter-spacing: -.09em; }
.wish-hero-panel p:not(.gx-eyebrow) { max-width: 780px; color: rgba(226,238,255,.76); font-size: 18px; line-height: 1.85; }
.wish-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.wish-primary-action,
.wish-secondary-action {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 20px;
  border-radius: 999px;
  font-weight: 1000;
}
.wish-primary-action {
  border: 1px solid rgba(255,128,208,.42);
  color: #fff;
  background: linear-gradient(135deg, rgba(255,80,168,.44), rgba(146,92,255,.34), rgba(64,200,255,.22));
  box-shadow: 0 0 34px rgba(255,80,168,.18);
}
.wish-secondary-action { border: 1px solid rgba(128,184,255,.22); color: rgba(230,240,255,.84); background: rgba(8,18,40,.52); }
.wish-signal-panel { padding: 24px; }
.wish-signal-title { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; color: #fff; }
.wish-signal-title span { width: 11px; height: 11px; border-radius: 50%; background: #ff78c8; box-shadow: 0 0 20px rgba(255,120,200,.82); }
.wish-signal-title strong { font-size: 20px; }
.wish-signal-title em { margin-left: auto; color: var(--gx-muted); font-style: normal; font-size: 12px; font-weight: 900; }
.wish-signal-panel .gx-stat-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.wish-board { padding: 24px; }
.wish-board-toolbar { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 22px; }
.wish-board-title h2 { margin: 0; font-size: 34px; letter-spacing: -.05em; }
.wish-board .wish-controls { flex: 0 1 720px; margin: 0; }
.wish-board .wish-grid { align-items: stretch; }
.wish-card {
  min-height: 210px;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,120,205,.13), transparent 42%),
    linear-gradient(180deg, rgba(12,25,54,.76), rgba(5,12,27,.84)) !important;
}
.wish-card:nth-child(3n+1) { transform: translateY(10px); }
.wish-card:nth-child(3n+2) { transform: translateY(-2px); }
.wish-card:hover { transform: translateY(-8px) !important; }
.wish-game-name i { color: #ff94cf; }
.publish-btn { background: radial-gradient(circle at 30% 20%, #ff9ad7, #8f52ff 52%, #3f7cff 100%); }
@media (max-width: 1180px) {
  .gx-header-search-form { width: 190px; }
  .gx-library-only-head, .wish-stage { grid-template-columns: 1fr; }
  .gx-home-preview .game-grid .game-card:first-child { grid-column: span 1; }
}
@media (max-width: 768px) {
  .gx-header-search-form { display: none; }
  .gx-nav, .gx-header-search-form { display: none; }
  .gx-library-main, .gx-category-main, .gx-wish-redesign { padding-top: 86px; }
  .gx-hero-keywords { padding: 12px; }
  .gx-hero-keywords .gx-keyword-row { display: flex; max-height: none; overflow: visible; }
  .gx-library-toolbar, .wish-board-toolbar { flex-direction: column; align-items: stretch; }
  .wish-hero-panel { min-height: auto; padding: 26px; }
  .wish-board { padding: 16px; }
}
@media (max-width: 560px) {
  .gx-library-only-head { padding: 20px; }
  .gx-library-search { height: 58px; }
  .wish-stage { gap: 16px; }
  .wish-hero-panel h1 { font-size: 48px; }
}
@media (max-width: 768px) {
  .gx-header-actions { min-width: auto; }
}

/* ======================================================================
   GX v5 polish: refined palette, equal hot cards, stronger non-home pages
   ====================================================================== */
:root {
  --gx-bg: #050711;
  --gx-bg-soft: #090d1b;
  --gx-ink: #050711;
  --gx-panel: rgba(13, 20, 39, .70);
  --gx-panel-strong: rgba(16, 25, 48, .86);
  --gx-panel-soft: rgba(15, 25, 47, .54);
  --gx-line: rgba(130, 169, 255, .20);
  --gx-line-strong: rgba(152, 195, 255, .42);
  --gx-blue: #5f8dff;
  --gx-blue-2: #375dff;
  --gx-violet: #9c6bff;
  --gx-magenta: #d46cff;
  --gx-cyan: #6feaff;
  --gx-mint: #84ffd9;
  --gx-gold: #ffd58a;
  --gx-hot: #ff9d6c;
  --gx-text: #f7faff;
  --gx-sub: rgba(222, 232, 250, .78);
  --gx-muted: rgba(185, 202, 229, .58);
  --gx-shadow: 0 28px 90px rgba(0, 0, 0, .42), inset 0 1px 0 rgba(255, 255, 255, .08);
  --gx-soft-shadow: 0 18px 54px rgba(0, 0, 0, .32), inset 0 1px 0 rgba(255,255,255,.07);
  --gx-glow: 0 0 26px rgba(111, 234, 255, .18), 0 0 82px rgba(156, 107, 255, .14);
  --gx-premium-border: linear-gradient(135deg, rgba(111,234,255,.62), rgba(156,107,255,.20) 45%, rgba(255,213,138,.38));
}

body.gx-home-page,
body.gx-library-page,
body.gx-static-page,
body.gx-detail-page,
body.gx-category-page,
body.gx-faq-page,
body.gx-wish-page {
  background:
    radial-gradient(circle at 50% -18%, rgba(89, 124, 255, .24), transparent 34%),
    radial-gradient(circle at 2% 18%, rgba(111, 234, 255, .10), transparent 28%),
    radial-gradient(circle at 100% 10%, rgba(212, 108, 255, .12), transparent 30%),
    radial-gradient(circle at 80% 92%, rgba(255, 213, 138, .055), transparent 24%),
    linear-gradient(180deg, #050711 0%, #060918 46%, #050711 100%) !important;
}
.gx-bg {
  background:
    radial-gradient(ellipse at 50% 0%, rgba(86, 118, 255, .14), transparent 46%),
    linear-gradient(180deg, rgba(3,5,14,.20), rgba(3,5,14,.70)) !important;
}
.gx-bg::before,
.gx-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.gx-bg::before {
  opacity: .36;
  background-image:
    radial-gradient(circle, rgba(205,222,255,.34) 0 1px, transparent 1.4px),
    radial-gradient(circle, rgba(111,234,255,.20) 0 1px, transparent 1.4px);
  background-size: 180px 140px, 260px 210px;
  animation: gxStars 26s linear infinite;
}
.gx-bg::after {
  opacity: .28;
  background:
    linear-gradient(115deg, transparent 0 42%, rgba(111,234,255,.09) 48%, transparent 54%),
    linear-gradient(25deg, transparent 0 55%, rgba(156,107,255,.10) 59%, transparent 64%);
  mix-blend-mode: screen;
}
.gx-grid { opacity: .18; background-size: 86px 86px; }
.gx-orb-a { background: radial-gradient(circle, rgba(95, 141, 255, .14), transparent 66%); }
.gx-orb-b { background: radial-gradient(circle, rgba(111, 234, 255, .10), transparent 68%); }
.gx-orb-c { background: radial-gradient(circle, rgba(212, 108, 255, .12), transparent 66%); }

.gx-header {
  background: linear-gradient(180deg, rgba(5, 7, 17, .86), rgba(5, 7, 17, .64)) !important;
  border-bottom: 1px solid rgba(144, 184, 255, .13);
  box-shadow: 0 14px 34px rgba(0,0,0,.22);
}
.gx-logo-mark {
  color: #031021;
  background: linear-gradient(135deg, #7cf3ff 0%, #6a86ff 42%, #a66cff 72%, #ffd58a 100%);
  box-shadow: 0 0 34px rgba(111,234,255,.32), 0 0 52px rgba(156,107,255,.16);
}
.gx-brand-text { text-shadow: 0 0 22px rgba(111,234,255,.16); }
.gx-nav { gap: clamp(24px, 3vw, 58px); }
.gx-nav a { color: rgba(235,243,255,.76); }
.gx-nav a:hover,
.gx-nav a.active { color: #fff; }
.gx-header-search-form {
  width: clamp(238px, 18vw, 330px) !important;
  height: 44px;
  padding-left: 17px;
  background: linear-gradient(180deg, rgba(11,18,37,.82), rgba(7,12,27,.66));
  border-color: rgba(150,190,255,.22);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 12px 28px rgba(0,0,0,.24);
}
.gx-header-search-form::before { opacity: .42; }
.gx-header-search-form:focus-within {
  width: clamp(280px, 23vw, 390px) !important;
  border-color: rgba(111,234,255,.60);
  box-shadow: 0 0 0 1px rgba(111,234,255,.10), 0 0 36px rgba(111,234,255,.13), inset 0 1px 0 rgba(255,255,255,.09);
}
.gx-header-search-submit { background: linear-gradient(135deg, rgba(111,234,255,.38), rgba(156,107,255,.36)); }

.gx-hero { min-height: 650px; border-bottom-color: rgba(144,184,255,.10); }
.gx-hero-inner { min-height: 650px; grid-template-columns: minmax(0, 1fr) 360px; }
.gx-hero-art {
  background:
    radial-gradient(circle at 50% 34%, rgba(111, 234, 255, .34), transparent 15%),
    radial-gradient(circle at 54% 44%, rgba(156, 107, 255, .24), transparent 31%),
    radial-gradient(ellipse at 45% 88%, rgba(255, 213, 138, .06), transparent 34%),
    linear-gradient(180deg, #0a1530 0%, #080c1c 70%, #050711 100%) !important;
}
.gx-hero::before {
  background:
    linear-gradient(90deg, rgba(5,7,17,.96) 0%, rgba(5,7,17,.58) 37%, rgba(5,7,17,.28) 58%, rgba(5,7,17,.86) 100%),
    linear-gradient(180deg, rgba(5,7,17,.03) 0%, rgba(5,7,17,0) 50%, #050711 100%) !important;
}
.gx-eyebrow { color: var(--gx-cyan); }
.gx-hero h1,
.gx-subhero h1,
.gx-library-only-head h1,
.wish-hero-panel h1 {
  background: linear-gradient(135deg, #fff 4%, #d9e7ff 42%, #8defff 68%, #c9a7ff 94%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
}
.gx-hero-subtitle { color: rgba(226, 236, 250, .80); }
.gx-search {
  border-color: rgba(141, 182, 255, .34);
  background: linear-gradient(180deg, rgba(11, 18, 37, .86), rgba(8, 14, 30, .68));
  box-shadow: 0 0 0 1px rgba(255,255,255,.04) inset, 0 0 46px rgba(111,234,255,.16), 0 22px 78px rgba(0,0,0,.40);
}
.gx-search::before { background: linear-gradient(90deg, rgba(111,234,255,.74), rgba(95,141,255,.08), rgba(255,213,138,.42), rgba(212,108,255,.55)); }
.gx-search button { background: radial-gradient(circle at 35% 30%, #93f7ff, #638aff 48%, #9866ff 78%, #23184b 100%); }
.gx-hero-keywords {
  border-color: rgba(150,190,255,.14);
  background: linear-gradient(180deg, rgba(12,21,42,.62), rgba(8,13,29,.42));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 16px 42px rgba(0,0,0,.20);
}
.gx-keyword-row button,
.gx-hero-tags button {
  background: linear-gradient(180deg, rgba(17, 30, 57, .74), rgba(10,17,35,.58));
  border-color: rgba(156, 191, 255, .16);
}
.gx-keyword-row button:hover { border-color: rgba(111,234,255,.54); background: rgba(111,234,255,.10); }
.gx-announcement-card,
.gx-library-only-head,
.gx-library-toolbar,
.gx-category-only .gx-section-mini-head,
.gx-category-main .gx-section-head,
.wish-hero-panel,
.wish-signal-panel,
.wish-board,
.gx-faq-card,
.gx-detail-page .detail-container {
  background:
    linear-gradient(180deg, rgba(15, 25, 49, .78), rgba(7, 12, 27, .64)) !important;
  border-color: rgba(150,190,255,.17) !important;
  box-shadow: var(--gx-soft-shadow) !important;
}
.gx-announcement-card::before,
.gx-library-only-head::before,
.wish-board::before,
.gx-faq-card::before {
  opacity: .75;
}

/* 首页热门资源：统一卡片尺寸，按后端热门顺序自然排列，不再放大第一张 */
.gx-home-preview { padding-top: 58px; }
.gx-home-preview .gx-section-head {
  padding: 20px 22px;
  border-radius: 28px;
  background:
    radial-gradient(circle at 16% 0%, rgba(111,234,255,.12), transparent 32%),
    linear-gradient(180deg, rgba(15,25,49,.72), rgba(7,12,27,.52));
}
.gx-home-preview .game-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  grid-auto-flow: row !important;
  gap: 22px !important;
  min-height: 0 !important;
}
.gx-home-preview .game-grid .game-card,
.gx-home-preview .game-grid .game-card:first-child {
  grid-column: auto !important;
  grid-row: auto !important;
}
.gx-home-preview .game-grid .game-card:first-child .image-container,
.gx-home-preview .game-card:first-child .image-container {
  aspect-ratio: 16 / 11 !important;
}
.gx-home-preview .game-grid .game-card:first-child .card-content,
.gx-home-preview .game-card:first-child .card-content {
  min-height: 122px !important;
  padding: 15px 16px 16px !important;
}
.gx-home-preview .game-grid .game-card:first-child .card-content h3,
.gx-home-preview .game-card:first-child .card-content h3 {
  font-size: 16px !important;
  min-height: 44px !important;
}
.game-card,
.seo-game-card,
.related-card {
  border-radius: 24px;
  border-color: rgba(150, 190, 255, .16) !important;
  background:
    radial-gradient(circle at 50% 12%, rgba(111,234,255,.10), transparent 34%),
    linear-gradient(180deg, rgba(15, 25, 49, .86), rgba(7, 12, 27, .92)) !important;
  box-shadow: 0 18px 50px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.075) !important;
}
.game-card:hover,
.seo-game-card:hover,
.related-card:hover {
  transform: translateY(-7px) !important;
  border-color: rgba(111,234,255,.46) !important;
  box-shadow: 0 28px 72px rgba(0,0,0,.46), 0 0 28px rgba(111,234,255,.12), inset 0 1px 0 rgba(255,255,255,.10) !important;
}
.image-container { aspect-ratio: 16/11; background: radial-gradient(circle at 35% 20%, rgba(95,141,255,.34), transparent 42%), linear-gradient(135deg, #151f39, #080d1c); }
.card-content { padding: 15px 16px 16px; min-height: 122px; }
.card-content h3 { font-size: 16px; min-height: 44px; letter-spacing: -.035em; }
.game-tag,
.free-tag,
.detail-tag,
.detail-category-badge,
.seo-category-pill {
  border-color: rgba(161, 196, 255, .16) !important;
}
.free-tag { background: linear-gradient(135deg, #87f5ff, #7d8cff 48%, #c397ff) !important; }
.card-meta .hot,
.card-meta .views,
.ranking-meta { color: var(--gx-gold) !important; }

/* 游戏库：只保留全部资源，但做成更完整的资源浏览界面 */
.gx-library-main { padding-top: 108px; }
.gx-library-only-head {
  position: relative;
  overflow: hidden;
  align-items: center;
  padding: clamp(24px, 3vw, 36px);
  border-radius: 34px;
}
.gx-library-only-head::after {
  content: "";
  position: absolute;
  right: -80px;
  top: -120px;
  width: 360px;
  height: 360px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(111,234,255,.14), transparent 64%);
  pointer-events: none;
}
.gx-library-only-head h1 { letter-spacing: -.075em; }
.gx-library-only-head p { font-size: 16px; line-height: 1.8; }
.gx-library-toolbar {
  padding: 16px 18px;
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(13,22,43,.64), rgba(7,12,27,.48)) !important;
}
.gx-toolbar-label::before {
  content: "";
  display: inline-block;
  width: 9px;
  height: 9px;
  margin-right: 10px;
  border-radius: 50%;
  background: var(--gx-cyan);
  box-shadow: 0 0 18px rgba(111,234,255,.72);
}
.sort-tab {
  background: linear-gradient(180deg, rgba(17,30,57,.65), rgba(9,15,32,.52));
  border-color: rgba(156,191,255,.16);
}
.sort-tab:hover,
.sort-tab.active { background: linear-gradient(135deg, rgba(111,234,255,.14), rgba(156,107,255,.18)); }
.gx-library-grid,
.seo-game-grid {
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)) !important;
  gap: 22px !important;
}

/* 分类页：全部分类 + 当前分类资源，视觉增强但不增加额外业务模块 */
.gx-category-main { padding-top: 108px; }
.gx-category-only {
  border-radius: 30px;
  background:
    radial-gradient(circle at 10% 0%, rgba(111,234,255,.09), transparent 30%),
    linear-gradient(180deg, rgba(12,21,42,.54), rgba(7,12,27,.36));
}
.gx-category-only .gx-section-mini-head {
  border-radius: 26px;
}
.seo-category-nav {
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)) !important;
  gap: 12px !important;
}
.seo-category-nav a {
  min-height: 58px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(15,26,50,.72), rgba(8,14,30,.58));
  border-color: rgba(150,190,255,.15);
}
.seo-category-nav a.active,
.seo-category-nav a:hover {
  background: linear-gradient(135deg, rgba(111,234,255,.16), rgba(156,107,255,.16));
  border-color: rgba(111,234,255,.48);
}
.gx-category-main .gx-section-head {
  border-radius: 26px;
}
.seo-game-card { overflow: hidden; }
.seo-game-cover { aspect-ratio: 16 / 11 !important; }
.seo-game-title { min-height: 44px; font-size: 15px; }
.seo-game-time { color: rgba(202,216,239,.64); }

/* 详情页：提升信息块质感，和首页同一套背景/材质 */
.gx-detail-page .game-detail { padding-top: 104px; }
.gx-detail-page .detail-container {
  border-radius: 34px !important;
  overflow: hidden !important;
}
.gx-detail-page .detail-top {
  background:
    radial-gradient(circle at 16% 0%, rgba(111,234,255,.13), transparent 34%),
    radial-gradient(circle at 82% 10%, rgba(156,107,255,.15), transparent 34%),
    linear-gradient(180deg, rgba(15,25,49,.74), rgba(7,12,27,.48)) !important;
}
.gx-detail-page .detail-title { letter-spacing: -.055em; }
.gx-detail-page .resource-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 18px;
}
.gx-detail-page .summary-item {
  padding: 15px 14px !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(16,27,52,.72), rgba(8,14,30,.58)) !important;
}
.gx-detail-page .content-section {
  border-radius: 26px !important;
  padding: clamp(18px, 2vw, 26px) !important;
  background: linear-gradient(180deg, rgba(14,24,46,.68), rgba(7,12,27,.52)) !important;
}
.gx-detail-page .content-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 22px !important;
}
.gx-detail-page .content-title::before {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--gx-cyan);
  box-shadow: 0 0 18px rgba(111,234,255,.72);
}
.gx-detail-page .download-item {
  padding: 16px !important;
  border-radius: 22px !important;
}
.gx-detail-page .download-btn { box-shadow: 0 0 22px rgba(111,234,255,.12) !important; }
.gx-detail-page .grid-image { border-radius: 20px !important; }
.gx-detail-page .related-card { border-radius: 22px !important; }

/* FAQ：由普通问题列表升级为帮助中心卡片 */
.gx-subhero-inner {
  border: 1px solid rgba(150,190,255,.15);
  border-radius: 34px;
  margin-top: 28px;
  padding: clamp(34px, 5vw, 62px) !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(111,234,255,.10), transparent 36%),
    radial-gradient(circle at 90% 12%, rgba(156,107,255,.12), transparent 34%),
    linear-gradient(180deg, rgba(13,22,43,.68), rgba(7,12,27,.48));
  box-shadow: var(--gx-soft-shadow);
}
.gx-faq-grid {
  grid-template-columns: repeat(auto-fit, minmax(310px, 1fr)) !important;
  gap: 22px !important;
}
.gx-faq-card {
  min-height: 190px;
  padding: 28px !important;
  border-radius: 28px !important;
  background:
    radial-gradient(circle at 14% 0%, rgba(111,234,255,.08), transparent 34%),
    linear-gradient(180deg, rgba(15,25,49,.72), rgba(7,12,27,.66)) !important;
}
.gx-faq-card h2 { font-size: 19px; letter-spacing: -.025em; }
.gx-faq-card p { color: rgba(222,232,250,.76); }
.gx-faq-card:hover { transform: translateY(-7px) !important; }

/* 许愿墙：重构为“愿望星图”视觉系统 */
.gx-wish-redesign { padding-top: 108px; }
.wish-stage { grid-template-columns: minmax(0, 1.35fr) minmax(340px, .65fr); gap: 24px; }
.wish-hero-panel,
.wish-signal-panel,
.wish-board {
  border-radius: 34px;
  border-color: rgba(150,190,255,.17) !important;
}
.wish-hero-panel {
  min-height: 390px;
  padding: clamp(30px, 4vw, 52px);
  background:
    radial-gradient(circle at 16% 0%, rgba(111,234,255,.16), transparent 36%),
    radial-gradient(circle at 92% 12%, rgba(212,108,255,.18), transparent 34%),
    radial-gradient(ellipse at 60% 110%, rgba(255,213,138,.08), transparent 36%),
    linear-gradient(180deg, rgba(16,26,52,.78), rgba(7,12,27,.60)) !important;
}
.wish-constellation {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .9;
}
.wish-constellation::before,
.wish-constellation::after {
  content: "";
  position: absolute;
  border-radius: 999px;
}
.wish-constellation::before {
  right: 46px;
  top: 44px;
  width: 190px;
  height: 190px;
  border: 1px solid rgba(111,234,255,.20);
  box-shadow: 0 0 0 34px rgba(111,234,255,.025), 0 0 0 68px rgba(156,107,255,.018), 0 0 60px rgba(111,234,255,.12);
}
.wish-constellation::after {
  right: 122px;
  top: 118px;
  width: 42px;
  height: 42px;
  background: radial-gradient(circle, rgba(255,255,255,.88), rgba(111,234,255,.55) 36%, transparent 70%);
  box-shadow: 0 0 34px rgba(111,234,255,.55);
}
.wish-constellation span {
  position: absolute;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--gx-gold);
  box-shadow: 0 0 22px rgba(255,213,138,.75);
}
.wish-constellation span:nth-child(1) { right: 68px; top: 78px; }
.wish-constellation span:nth-child(2) { right: 228px; top: 172px; background: var(--gx-cyan); }
.wish-constellation span:nth-child(3) { right: 154px; top: 282px; background: var(--gx-magenta); }
.wish-constellation i {
  position: absolute;
  right: 84px;
  top: 86px;
  width: 196px;
  height: 210px;
  border-top: 1px solid rgba(111,234,255,.22);
  border-right: 1px solid rgba(255,213,138,.14);
  transform: rotate(-24deg) skewX(-18deg);
}
.wish-process {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}
.wish-process span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid rgba(150,190,255,.18);
  border-radius: 999px;
  color: rgba(232,242,255,.82);
  background: rgba(9,16,35,.46);
  font-size: 13px;
  font-weight: 900;
}
.wish-process b { color: var(--gx-cyan); }
.wish-primary-action {
  min-height: 52px;
  padding: 0 24px;
  border-color: rgba(111,234,255,.42) !important;
  background: linear-gradient(135deg, rgba(111,234,255,.28), rgba(156,107,255,.30), rgba(255,213,138,.14)) !important;
  box-shadow: 0 0 34px rgba(111,234,255,.16) !important;
}
.wish-secondary-action { min-height: 52px; padding: 0 22px; }
.wish-signal-panel {
  padding: 26px;
  background:
    radial-gradient(circle at 14% 0%, rgba(255,213,138,.10), transparent 34%),
    linear-gradient(180deg, rgba(15,25,49,.74), rgba(7,12,27,.62)) !important;
}
.wish-signal-title span { background: var(--gx-gold); box-shadow: 0 0 22px rgba(255,213,138,.78); }
.wish-signal-panel .gx-stat-row { gap: 14px; }
.stat-item {
  border-radius: 22px !important;
  background: linear-gradient(180deg, rgba(16,29,55,.72), rgba(8,14,30,.56)) !important;
}
.stat-number { color: #fff; text-shadow: 0 0 24px rgba(111,234,255,.22); }
.wish-board {
  padding: clamp(18px, 2.4vw, 30px);
  background:
    radial-gradient(circle at 10% 0%, rgba(111,234,255,.10), transparent 32%),
    radial-gradient(circle at 94% 0%, rgba(212,108,255,.10), transparent 32%),
    linear-gradient(180deg, rgba(13,22,43,.70), rgba(7,12,27,.60)) !important;
}
.wish-board-title em { display:block; margin-top:6px; color: var(--gx-muted); font-style: normal; font-weight: 800; }
.search-box-wish {
  border-radius: 20px;
  border-color: rgba(150,190,255,.18);
  background: linear-gradient(180deg, rgba(16,29,55,.68), rgba(8,14,30,.54));
}
.search-box-wish button { background: linear-gradient(135deg, rgba(111,234,255,.28), rgba(156,107,255,.32)); }
.sort-btn,
.load-more-btn,
.wish-submit-btn,
.post-wish-btn {
  background: linear-gradient(180deg, rgba(16,29,55,.66), rgba(8,14,30,.56));
  border-color: rgba(150,190,255,.18);
}
.sort-btn.active,
.sort-btn:hover {
  border-color: rgba(111,234,255,.52);
  color: #fff;
  background: linear-gradient(135deg, rgba(111,234,255,.16), rgba(156,107,255,.18));
}
.wish-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 18px;
}
.wish-card {
  min-height: 230px;
  border-radius: 28px !important;
  border-color: rgba(150,190,255,.16) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(111,234,255,.10), transparent 40%),
    radial-gradient(circle at 100% 100%, rgba(212,108,255,.08), transparent 35%),
    linear-gradient(180deg, rgba(16,29,55,.76), rgba(7,12,27,.86)) !important;
}
.wish-card:nth-child(3n+1),
.wish-card:nth-child(3n+2) { transform: none !important; }
.wish-card:hover { transform: translateY(-8px) !important; border-color: rgba(111,234,255,.44) !important; }
.wish-game-name {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  line-height: 1.35;
}
.wish-status-badge {
  margin-left: auto;
  white-space: nowrap;
  border-radius: 999px;
  border: 1px solid rgba(150,190,255,.16);
  background: rgba(9,16,35,.52);
}
.wish-like-btn {
  border-radius: 999px;
  border: 1px solid rgba(255,213,138,.20) !important;
  background: rgba(255,213,138,.08) !important;
}
.wish-like-btn.liked { color: #ff90d2 !important; box-shadow: 0 0 26px rgba(255, 144, 210, .18); }
.publish-btn {
  background: radial-gradient(circle at 30% 20%, #95f6ff, #8b6cff 48%, #33205f 100%) !important;
  box-shadow: 0 20px 54px rgba(0,0,0,.44), 0 0 34px rgba(111,234,255,.26) !important;
}
.wish-modal-content {
  background:
    radial-gradient(circle at 16% 0%, rgba(111,234,255,.12), transparent 34%),
    linear-gradient(180deg, rgba(16,25,48,.98), rgba(7,12,27,.98)) !important;
}

.gx-footer {
  border-top: 1px solid rgba(150,190,255,.10);
  background: linear-gradient(180deg, rgba(5,7,17,.04), rgba(5,7,17,.68)) !important;
}

@media (max-width: 1350px) {
  .gx-home-preview .game-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
@media (max-width: 980px) {
  .gx-hero-inner { grid-template-columns: 1fr; }
  .gx-announcement-card { max-width: 680px; }
  .gx-home-preview .game-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .gx-library-only-head { grid-template-columns: 1fr; }
  .wish-stage { grid-template-columns: 1fr; }
  .gx-detail-page .resource-summary { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 640px) {
  .gx-shell { width: min(100% - 28px, 1710px); }
  .gx-hero { min-height: auto; }
  .gx-hero-inner { min-height: auto; padding-top: 52px; }
  .gx-search { height: 62px; padding-left: 54px; }
  .gx-search-icon { left: 22px; }
  .gx-search button { width: 46px; height: 46px; }
  .gx-home-preview .game-grid,
  .gx-library-grid,
  .seo-game-grid,
  .wish-grid { grid-template-columns: 1fr !important; }
  .gx-home-preview .game-grid .game-card:first-child { grid-column: auto !important; }
  .gx-detail-page .resource-summary { grid-template-columns: 1fr; }
  .wish-hero-panel { padding: 26px; }
  .wish-process { gap: 8px; }
  .wish-process span { width: 100%; justify-content: center; }
}

/* ===== GX v4：详情页反馈弹窗与下载弹窗统一为本站视觉，并修复误弹/关闭体验 ===== */
.gx-detail-page .report-btn {
  margin-top: 18px !important;
  min-height: 48px !important;
  padding: 0 22px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255, 139, 85, .36) !important;
  color: #fff !important;
  background:
    radial-gradient(circle at 22% 18%, rgba(255, 255, 255, .16), transparent 26%),
    linear-gradient(135deg, rgba(255, 139, 85, .24), rgba(228, 92, 255, .18), rgba(64, 200, 255, .14)) !important;
  box-shadow: 0 14px 36px rgba(0,0,0,.24), 0 0 24px rgba(255,139,85,.10) !important;
}
.gx-detail-page .report-btn::before {
  content: "⚠";
  width: 26px;
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  background: rgba(255,139,85,.14);
  border: 1px solid rgba(255,139,85,.28);
}
.gx-detail-page .report-btn:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(255, 139, 85, .56) !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.30), 0 0 34px rgba(255,139,85,.16) !important;
}
.report-modal.gx-report-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10050 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 24px !important;
  color: var(--gx-text) !important;
  background:
    radial-gradient(circle at 50% 12%, rgba(64,200,255,.18), transparent 28%),
    radial-gradient(circle at 20% 84%, rgba(146,92,255,.16), transparent 30%),
    rgba(1, 4, 13, .78) !important;
  backdrop-filter: blur(22px) saturate(150%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(150%) !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.report-modal.gx-report-modal:not(.is-open) { display: none !important; }
.gx-report-modal-panel.improved-report-modal {
  position: relative !important;
  width: min(620px, calc(100vw - 32px)) !important;
  max-height: min(88vh, 760px) !important;
  overflow: auto !important;
  padding: 0 !important;
  border-radius: 30px !important;
  border: 1px solid rgba(128,184,255,.24) !important;
  color: var(--gx-text) !important;
  background:
    linear-gradient(135deg, rgba(255,255,255,.08), transparent 38%),
    radial-gradient(circle at 18% 0%, rgba(64,200,255,.18), transparent 34%),
    radial-gradient(circle at 86% 12%, rgba(228,92,255,.14), transparent 30%),
    linear-gradient(180deg, rgba(9,21,44,.94), rgba(3,8,20,.96)) !important;
  box-shadow:
    0 34px 120px rgba(0,0,0,.58),
    0 0 60px rgba(64,200,255,.12),
    inset 0 1px 0 rgba(255,255,255,.10) !important;
  backdrop-filter: blur(26px) saturate(165%) !important;
  -webkit-backdrop-filter: blur(26px) saturate(165%) !important;
  animation: gxReportIn .28s var(--gx-ease) both !important;
}
.gx-report-modal-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background:
    linear-gradient(90deg, transparent, rgba(113,242,255,.10), transparent),
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.08), transparent 32%);
  opacity: .86;
}
@keyframes gxReportIn {
  from { opacity: 0; transform: translateY(18px) scale(.975); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
.gx-report-modal-panel .report-modal-hero {
  position: relative;
  z-index: 1;
  display: grid !important;
  grid-template-columns: 58px minmax(0, 1fr) !important;
  gap: 16px !important;
  align-items: start !important;
  padding: 30px 30px 22px !important;
  border-bottom: 1px solid rgba(128,184,255,.18) !important;
  background:
    linear-gradient(135deg, rgba(64,200,255,.12), rgba(146,92,255,.10), rgba(255,139,85,.08)) !important;
}
.gx-report-modal-panel .report-modal-kicker {
  display: inline-flex;
  margin-bottom: 6px;
  color: var(--gx-cyan);
  font-size: .72rem;
  letter-spacing: .18em;
  font-weight: 1000;
}
.gx-report-modal-panel .report-modal-icon {
  width: 58px !important;
  height: 58px !important;
  border-radius: 20px !important;
  color: #fff !important;
  background:
    radial-gradient(circle at 30% 22%, rgba(255,255,255,.22), transparent 34%),
    linear-gradient(135deg, var(--gx-hot), var(--gx-magenta)) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  box-shadow: 0 16px 42px rgba(255,139,85,.20), 0 0 22px rgba(228,92,255,.13) !important;
}
.gx-report-modal-panel h3 {
  margin: 0 44px 8px 0 !important;
  color: #fff !important;
  font-size: clamp(1.32rem, 2.4vw, 1.72rem) !important;
  letter-spacing: -.04em !important;
}
.gx-report-modal-panel .report-modal-desc {
  margin: 0 !important;
  color: rgba(222,235,255,.72) !important;
  line-height: 1.72 !important;
}
.gx-report-modal-panel .report-resource-card,
.gx-report-modal-panel .form-group,
.gx-report-modal-panel .report-inline-message,
.gx-report-modal-panel .report-modal-actions,
.gx-report-modal-panel .report-form-grid {
  position: relative;
  z-index: 1;
}
.gx-report-modal-panel .report-resource-card {
  margin: 20px 30px 0 !important;
  padding: 16px 18px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(128,184,255,.18) !important;
  background: rgba(6, 15, 34, .66) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
}
.gx-report-modal-panel .report-resource-card span,
.gx-report-modal-panel label,
.gx-report-modal-panel .report-char-row {
  color: rgba(198,218,250,.62) !important;
}
.gx-report-modal-panel .report-resource-card strong {
  color: #fff !important;
  font-weight: 900 !important;
}
.gx-report-modal-panel .report-form-grid {
  display: grid !important;
  grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr) !important;
  gap: 14px !important;
  padding: 20px 30px 0 !important;
}
.gx-report-modal-panel > .form-group,
.gx-report-modal-panel .report-detail-group {
  padding: 0 30px !important;
  margin-top: 14px !important;
}
.gx-report-modal-panel input,
.gx-report-modal-panel textarea {
  width: 100% !important;
  margin-top: 8px !important;
  color: #fff !important;
  caret-color: var(--gx-cyan) !important;
  border: 1px solid rgba(128,184,255,.20) !important;
  border-radius: 16px !important;
  background: rgba(3, 9, 22, .74) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
}
.gx-report-modal-panel input::placeholder,
.gx-report-modal-panel textarea::placeholder { color: rgba(190,208,238,.42) !important; }
.gx-report-modal-panel input:focus,
.gx-report-modal-panel textarea:focus {
  outline: none !important;
  border-color: rgba(113,242,255,.48) !important;
  box-shadow: 0 0 0 4px rgba(64,200,255,.10), inset 0 1px 0 rgba(255,255,255,.07) !important;
}
.gx-report-modal-panel textarea { min-height: 132px !important; resize: vertical !important; }
.gx-report-modal-panel .report-inline-message {
  margin: 0 30px 14px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(128,184,255,.18) !important;
  background: rgba(6,15,34,.74) !important;
  color: rgba(222,235,255,.75) !important;
}
.gx-report-modal-panel .report-inline-message.error { color: #ff9d9d !important; border-color: rgba(255,112,112,.42) !important; background: rgba(255,112,112,.10) !important; }
.gx-report-modal-panel .report-inline-message.success { color: #76ffd5 !important; border-color: rgba(52,211,153,.42) !important; background: rgba(52,211,153,.10) !important; }
.gx-report-modal-panel .report-modal-actions {
  display: grid !important;
  grid-template-columns: minmax(126px,.82fr) minmax(180px,1.35fr) !important;
  gap: 12px !important;
  padding: 4px 30px 30px !important;
  margin-top: 4px !important;
  background: transparent !important;
}
.gx-report-modal-panel .report-action-btn {
  min-height: 50px !important;
  border-radius: 17px !important;
  font-weight: 1000 !important;
}
.gx-report-modal-panel .report-action-cancel {
  color: rgba(225,238,255,.82) !important;
  border-color: rgba(128,184,255,.18) !important;
  background: rgba(6,15,34,.72) !important;
}
.gx-report-modal-panel .report-action-cancel:hover {
  color: #fff !important;
  border-color: rgba(113,242,255,.34) !important;
  background: rgba(12,28,58,.82) !important;
}
.gx-report-modal-panel .report-action-submit {
  color: #fff !important;
  border-color: rgba(113,242,255,.34) !important;
  background:
    radial-gradient(circle at 18% 20%, rgba(255,255,255,.28), transparent 24%),
    linear-gradient(135deg, var(--gx-blue) 0%, var(--gx-violet) 58%, var(--gx-magenta) 100%) !important;
  box-shadow: 0 18px 44px rgba(0,0,0,.30), 0 0 28px rgba(64,200,255,.18) !important;
}
.gx-report-modal-panel .report-modal-close {
  position: absolute !important;
  z-index: 3 !important;
  top: 20px !important;
  right: 20px !important;
  width: 40px !important;
  height: 40px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: rgba(230,240,255,.82) !important;
  border: 1px solid rgba(128,184,255,.18) !important;
  border-radius: 14px !important;
  background: rgba(4,10,24,.62) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
  transition: transform .2s var(--gx-ease), border-color .2s var(--gx-ease), color .2s var(--gx-ease), background .2s var(--gx-ease) !important;
}
.gx-report-modal-panel .report-modal-close:hover {
  transform: rotate(90deg) scale(1.04) !important;
  color: #fff !important;
  border-color: rgba(255,139,85,.46) !important;
  background: rgba(255,139,85,.16) !important;
}
.gx-detail-page .download-modal {
  z-index: 10040 !important;
  background:
    radial-gradient(circle at 50% 12%, rgba(64,200,255,.16), transparent 28%),
    rgba(1, 4, 13, .78) !important;
  backdrop-filter: blur(22px) saturate(150%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(150%) !important;
}
.gx-detail-page .download-modal .modal-content {
  color: var(--gx-text) !important;
  border: 1px solid rgba(128,184,255,.24) !important;
  border-radius: 28px !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(64,200,255,.18), transparent 34%),
    radial-gradient(circle at 86% 12%, rgba(146,92,255,.14), transparent 30%),
    linear-gradient(180deg, rgba(9,21,44,.94), rgba(3,8,20,.96)) !important;
  box-shadow: 0 34px 120px rgba(0,0,0,.58), 0 0 60px rgba(64,200,255,.12), inset 0 1px 0 rgba(255,255,255,.10) !important;
}
.gx-detail-page .download-modal .modal-content h3 { color: #fff !important; }
.gx-detail-page .download-modal .modal-content > p,
.gx-detail-page .download-modal .modal-instructions { color: rgba(222,235,255,.74) !important; }
.gx-detail-page .download-modal .modal-instructions h4 { color: var(--gx-cyan) !important; }
.gx-detail-page .download-modal .modal-close {
  color: rgba(230,240,255,.82) !important;
  border: 1px solid rgba(128,184,255,.18) !important;
  background: rgba(4,10,24,.62) !important;
}
@media (max-width: 640px) {
  .report-modal.gx-report-modal { padding: 12px !important; align-items: center !important; }
  .gx-report-modal-panel.improved-report-modal { width: min(100%, calc(100vw - 20px)) !important; border-radius: 22px !important; max-height: 90vh !important; }
  .gx-report-modal-panel .report-modal-hero { grid-template-columns: 46px minmax(0,1fr) !important; padding: 22px 18px 16px !important; gap: 12px !important; }
  .gx-report-modal-panel .report-modal-icon { width: 46px !important; height: 46px !important; border-radius: 16px !important; }
  .gx-report-modal-panel .report-resource-card { margin: 16px 18px 0 !important; }
  .gx-report-modal-panel .report-form-grid { grid-template-columns: 1fr !important; padding: 16px 18px 0 !important; }
  .gx-report-modal-panel > .form-group,
  .gx-report-modal-panel .report-detail-group { padding: 0 18px !important; }
  .gx-report-modal-panel .report-inline-message { margin: 0 18px 12px !important; }
  .gx-report-modal-panel .report-modal-actions { grid-template-columns: 1fr !important; padding: 4px 18px 20px !important; }
  .gx-report-modal-panel .report-action-submit { order: 1; }
  .gx-report-modal-panel .report-action-cancel { order: 2; }
  .gx-report-modal-panel .report-modal-close { top: 14px !important; right: 14px !important; }
}


/* ===== GX v6：竖向封面卡片、全站资源索引、整体公告展示 ===== */
.gx-announcement-list {
  display: block !important;
  min-height: auto !important;
}
.gx-announcement-content {
  position: relative;
  max-height: 220px;
  overflow: auto;
  padding: 16px 17px;
  border-radius: 20px;
  border: 1px solid rgba(143, 210, 255, .16);
  background:
    radial-gradient(circle at 12% 0%, rgba(88, 220, 255, .10), transparent 34%),
    linear-gradient(180deg, rgba(7, 18, 38, .70), rgba(5, 11, 27, .58));
  color: rgba(226, 238, 255, .80);
  line-height: 1.76;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07);
}
.gx-announcement-content p,
.gx-announcement-content div,
.gx-announcement-content ul,
.gx-announcement-content ol { margin: 0 0 10px; }
.gx-announcement-content p:last-child,
.gx-announcement-content div:last-child,
.gx-announcement-content ul:last-child,
.gx-announcement-content ol:last-child { margin-bottom: 0; }
.gx-announcement-line { display: none !important; }

/* 所有资源封面卡片统一改为竖向比例，避免横向裁切导致封面缺失。 */
.game-grid,
.gx-library-grid,
.seo-game-grid {
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)) !important;
  align-items: stretch !important;
}
.gx-home-preview .game-grid {
  grid-template-columns: repeat(4, minmax(190px, 1fr)) !important;
}
.game-card,
.seo-game-card,
.gx-detail-page .related-card {
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
}
.game-card,
.game-card:first-child,
.gx-home-preview .game-grid .game-card:first-child,
.gx-home-preview .game-card:first-child,
.seo-game-card,
.related-card {
  grid-column: auto !important;
  grid-row: auto !important;
}
.image-container,
.gx-home-preview .game-grid .game-card:first-child .image-container,
.gx-home-preview .game-card:first-child .image-container,
.seo-game-cover,
.gx-detail-page .related-card img {
  aspect-ratio: 3 / 4 !important;
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
  object-position: center top !important;
}
.image-container img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center top !important;
}
.card-content,
.gx-home-preview .game-grid .game-card:first-child .card-content,
.gx-home-preview .game-card:first-child .card-content {
  flex: 1 1 auto !important;
  min-height: 142px !important;
  padding: 16px !important;
}
.card-content h3,
.gx-home-preview .game-grid .game-card:first-child .card-content h3,
.gx-home-preview .game-card:first-child .card-content h3 {
  font-size: 17px !important;
  min-height: 48px !important;
  -webkit-line-clamp: 2;
}
.ranking-cover,
.ranking-cover-empty {
  width: 54px !important;
  height: 72px !important;
  aspect-ratio: 3 / 4 !important;
  object-fit: cover !important;
  object-position: center top !important;
  border-radius: 14px !important;
}
.seo-game-title { min-height: 46px !important; }
.gx-detail-page .related-card div { padding: 12px 12px 14px !important; }

@media (max-width: 1480px) {
  .gx-home-preview .game-grid { grid-template-columns: repeat(4, minmax(170px, 1fr)) !important; }
}
@media (max-width: 1180px) {
  .game-grid,
  .gx-library-grid,
  .seo-game-grid,
  .gx-home-preview .game-grid { grid-template-columns: repeat(3, minmax(170px, 1fr)) !important; }
}
@media (max-width: 760px) {
  .game-grid,
  .gx-library-grid,
  .seo-game-grid,
  .gx-home-preview .game-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 14px !important; }
  .card-content { padding: 13px !important; min-height: 132px !important; }
  .card-content h3 { font-size: 15px !important; min-height: 42px !important; }
  .gx-announcement-content { max-height: 180px; }
}
@media (max-width: 430px) {
  .game-grid,
  .gx-library-grid,
  .seo-game-grid,
  .gx-home-preview .game-grid { grid-template-columns: 1fr !important; }
}

/* ===== GX v7：公告展示区放大，整体公告不再内部滚动 ===== */
.gx-hero-inner {
  grid-template-columns: minmax(0, 1fr) minmax(430px, 520px) !important;
  align-items: stretch !important;
}
.gx-announcement-card {
  align-self: stretch !important;
  min-height: 360px !important;
  padding: 30px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  overflow: visible !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(113, 242, 255, .20), transparent 34%),
    radial-gradient(circle at 100% 18%, rgba(164, 107, 255, .16), transparent 36%),
    linear-gradient(180deg, rgba(12, 25, 54, .82), rgba(4, 10, 24, .88)) !important;
}
.gx-announcement-card .gx-card-head {
  margin-bottom: 18px !important;
}
.gx-announcement-card .gx-card-icon {
  width: 44px !important;
  height: 44px !important;
  border-radius: 16px !important;
  font-size: 20px !important;
}
.gx-announcement-card .gx-card-head h2 {
  font-size: 26px !important;
  letter-spacing: -.04em !important;
}
.gx-announcement-card .gx-card-head p {
  font-size: 13px !important;
  color: rgba(178, 199, 231, .86) !important;
}
.gx-announcement-list {
  flex: 1 1 auto !important;
  display: block !important;
  min-height: 0 !important;
  overflow: visible !important;
}
.gx-announcement-content {
  max-height: none !important;
  overflow: visible !important;
  min-height: 210px !important;
  padding: 24px 24px 26px !important;
  border-radius: 24px !important;
  font-size: 15.5px !important;
  line-height: 1.9 !important;
  color: rgba(232, 242, 255, .88) !important;
  background:
    linear-gradient(135deg, rgba(255,255,255,.045), transparent 34%),
    radial-gradient(circle at 10% 6%, rgba(113,242,255,.12), transparent 38%),
    linear-gradient(180deg, rgba(8, 18, 42, .78), rgba(5, 11, 27, .66)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    inset 0 -1px 0 rgba(113,242,255,.06),
    0 18px 46px rgba(0,0,0,.22) !important;
}
.gx-announcement-content p,
.gx-announcement-content div,
.gx-announcement-content ul,
.gx-announcement-content ol {
  margin-bottom: 12px !important;
}
.gx-announcement-content ul,
.gx-announcement-content ol {
  padding-left: 1.25em !important;
}
.gx-announcement-content a {
  color: var(--gx-cyan) !important;
  text-decoration-thickness: 1px !important;
}
.gx-announcement-card .gx-card-link {
  margin-top: 22px !important;
  align-self: flex-start !important;
  padding: 10px 14px !important;
  border: 1px solid rgba(113, 242, 255, .20) !important;
  border-radius: 999px !important;
  background: rgba(113, 242, 255, .07) !important;
}
.announcement-overlay {
  align-items: flex-start !important;
  overflow-y: auto !important;
  padding: 48px 22px !important;
}
.announcement-modal {
  width: min(820px, 100%) !important;
  margin: 0 auto !important;
}
.announcement-body {
  max-height: none !important;
  overflow: visible !important;
  padding: 26px 28px !important;
  font-size: 15.5px !important;
  line-height: 1.9 !important;
}
@media (max-width: 1180px) {
  .gx-hero-inner { grid-template-columns: 1fr !important; align-items: start !important; }
  .gx-announcement-card { min-height: 0 !important; max-width: none !important; }
}
@media (max-width: 760px) {
  .gx-announcement-card { padding: 22px !important; }
  .gx-announcement-content { min-height: 0 !important; padding: 18px !important; font-size: 14.5px !important; line-height: 1.82 !important; max-height: none !important; overflow: visible !important; }
  .gx-announcement-card .gx-card-head h2 { font-size: 22px !important; }
  .announcement-overlay { padding: 28px 14px !important; }
  .announcement-body { padding: 20px !important; max-height: none !important; overflow: visible !important; }
}


/* ===== GX v8：热门资源卡片缩小 + 游戏库资源网格铺满修复 ===== */
/* 首页热门资源：只展示少量高热资源，但卡片不再占据过大视觉面积。 */
.gx-home-preview {
  padding-top: 46px !important;
}
.gx-home-preview .gx-section-head {
  padding: 16px 18px !important;
  margin-bottom: 16px !important;
  border-radius: 24px !important;
}
.gx-home-preview .game-grid {
  grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
  gap: 15px !important;
  min-height: 0 !important;
}
.gx-home-preview .game-card,
.gx-home-preview .game-grid .game-card,
.gx-home-preview .game-grid .game-card:first-child {
  border-radius: 18px !important;
  grid-column: auto !important;
  grid-row: auto !important;
}
.gx-home-preview .image-container,
.gx-home-preview .game-grid .game-card:first-child .image-container,
.gx-home-preview .game-card:first-child .image-container {
  aspect-ratio: 3 / 4 !important;
}
.gx-home-preview .card-content,
.gx-home-preview .game-grid .game-card:first-child .card-content,
.gx-home-preview .game-card:first-child .card-content {
  min-height: 108px !important;
  padding: 12px 12px 13px !important;
}
.gx-home-preview .card-content h3,
.gx-home-preview .game-grid .game-card:first-child .card-content h3,
.gx-home-preview .game-card:first-child .card-content h3 {
  min-height: 40px !important;
  margin-bottom: 7px !important;
  font-size: 14px !important;
  line-height: 1.35 !important;
  letter-spacing: -.02em !important;
}
.gx-home-preview .card-tags { gap: 5px !important; min-height: 22px !important; }
.gx-home-preview .game-tag,
.gx-home-preview .free-tag {
  height: 21px !important;
  max-width: 74px !important;
  padding: 0 7px !important;
  font-size: 11px !important;
}
.gx-home-preview .card-meta {
  margin-top: 9px !important;
  font-size: 11px !important;
}
.gx-home-preview .card-overlay { left: 9px !important; top: 9px !important; }
.gx-home-preview .gx-load-more-wrap { margin-top: 22px !important; }

/* 游戏库：使用整页专属栅格，不再继承首页的小卡或 auto-fill 空轨道问题。 */
body.gx-library-page .gx-shell,
body.gx-library-page .gx-library-only {
  width: min(1760px, calc(100vw - 44px)) !important;
  max-width: none !important;
}
body.gx-library-page .gx-library-grid {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(9, minmax(0, 1fr)) !important;
  gap: 18px !important;
  align-items: stretch !important;
}
body.gx-library-page .gx-library-grid .game-card {
  width: 100% !important;
  min-width: 0 !important;
  border-radius: 20px !important;
}
body.gx-library-page .gx-library-grid .image-container {
  aspect-ratio: 3 / 4 !important;
}
body.gx-library-page .gx-library-grid .card-content {
  min-height: 122px !important;
  padding: 13px 13px 14px !important;
}
body.gx-library-page .gx-library-grid .card-content h3 {
  min-height: 42px !important;
  font-size: 15px !important;
}
body.gx-library-page .gx-library-grid .game-tag,
body.gx-library-page .gx-library-grid .free-tag {
  max-width: 86px !important;
}

@media (max-width: 1500px) {
  .gx-home-preview .game-grid { grid-template-columns: repeat(8, minmax(0, 1fr)) !important; gap: 13px !important; }
  body.gx-library-page .gx-library-grid { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; }
}
@media (max-width: 980px) {
  .gx-home-preview .game-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
  body.gx-library-page .gx-library-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
}
@media (max-width: 640px) {
  body.gx-library-page .gx-shell,
  body.gx-library-page .gx-library-only { width: min(100% - 24px, 1760px) !important; }
  .gx-home-preview .game-grid,
  body.gx-library-page .gx-library-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; }
  .gx-home-preview .card-content,
  body.gx-library-page .gx-library-grid .card-content { min-height: 116px !important; padding: 12px !important; }
  .gx-home-preview .card-content h3,
  body.gx-library-page .gx-library-grid .card-content h3 { font-size: 14px !important; min-height: 38px !important; }
}
@media (max-width: 420px) {
  .gx-home-preview .game-grid,
  body.gx-library-page .gx-library-grid { grid-template-columns: 1fr !important; }
}

/* ======================================================================
   GX v9 product polish — closer to the preferred homepage concept
   ====================================================================== */
:root {
  --gx-bg: #030712;
  --gx-void: #02040b;
  --gx-navy: #071326;
  --gx-surface: rgba(8, 16, 34, .72);
  --gx-surface-2: rgba(12, 24, 50, .66);
  --gx-border: rgba(129, 186, 255, .18);
  --gx-border-hot: rgba(116, 239, 255, .44);
  --gx-cyan: #74efff;
  --gx-blue: #5c8dff;
  --gx-indigo: #6973ff;
  --gx-violet: #9e6bff;
  --gx-amethyst: #d178ff;
  --gx-gold: #ffd287;
  --gx-text: #f8fbff;
  --gx-sub: rgba(221, 234, 255, .78);
  --gx-muted: rgba(183, 204, 236, .56);
  --gx-glass-shadow: 0 22px 70px rgba(0, 0, 0, .42), inset 0 1px 0 rgba(255, 255, 255, .08);
  --gx-soft-glow: 0 0 34px rgba(116, 239, 255, .14), 0 0 82px rgba(158, 107, 255, .12);
}

body.gx-home-page,
body.gx-library-page,
body.gx-static-page,
body.gx-detail-page,
body.gx-category-page,
body.gx-faq-page,
body.gx-wish-page {
  background:
    radial-gradient(circle at 52% -16%, rgba(88, 132, 255, .30), transparent 33%),
    radial-gradient(circle at 8% 18%, rgba(116, 239, 255, .11), transparent 30%),
    radial-gradient(circle at 95% 10%, rgba(209, 120, 255, .13), transparent 28%),
    radial-gradient(ellipse at 50% 115%, rgba(46, 80, 180, .16), transparent 42%),
    linear-gradient(180deg, #030712 0%, #050916 48%, #030712 100%) !important;
}

.gx-shell { width: min(1580px, calc(100vw - 64px)); }
.gx-header { height: 72px; background: rgba(3, 7, 18, .70) !important; backdrop-filter: blur(22px) saturate(160%); -webkit-backdrop-filter: blur(22px) saturate(160%); }
.gx-header-inner { min-height: 72px; }
.gx-brand-text { font-size: 23px; }
.gx-nav { background: transparent; border-color: transparent; box-shadow: none; gap: clamp(28px, 4.8vw, 86px); }
.gx-nav a { padding: 23px 4px 20px; border-radius: 0; font-size: 15px; font-weight: 760; letter-spacing: .02em; }
.gx-nav a::after { display: block; bottom: 0; height: 3px; }
.gx-nav a:hover,
.gx-nav a.active { background: transparent; box-shadow: none; color: #fff; }
.gx-nav a:hover::after,
.gx-nav a.active::after { width: 54px; }
.gx-header-search-form { height: 44px; width: clamp(260px, 22vw, 390px) !important; background: rgba(6, 13, 29, .58); }
.gx-header-search-form:focus-within { width: clamp(300px, 25vw, 430px) !important; }

.gx-hero { min-height: 610px; border-bottom: 0; overflow: visible; }
.gx-hero::before {
  background:
    linear-gradient(90deg, rgba(3,7,18,.95) 0%, rgba(3,7,18,.58) 37%, rgba(3,7,18,.24) 60%, rgba(3,7,18,.80) 100%),
    linear-gradient(180deg, rgba(3,7,18,.08) 0%, rgba(3,7,18,0) 58%, rgba(3,7,18,.86) 100%) !important;
}
.gx-hero::after { height: 190px; background: linear-gradient(180deg, transparent, #030712 88%); }
.gx-hero-art {
  background:
    radial-gradient(circle at 56% 28%, rgba(124, 235, 255, .35), transparent 12%),
    radial-gradient(circle at 55% 37%, rgba(142, 105, 255, .30), transparent 24%),
    radial-gradient(circle at 80% 18%, rgba(130, 98, 255, .20), transparent 12%),
    radial-gradient(ellipse at 48% 82%, rgba(42, 88, 180, .34), transparent 36%),
    linear-gradient(180deg, #0a1733 0%, #071023 67%, #030712 100%) !important;
}
.gx-portal-ring { left: 56%; top: 31%; width: 270px; height: 270px; border-width: 2px; opacity: .95; }
.gx-citadel { left: 54%; bottom: 138px; transform: translateX(-50%) scale(1.08); }
.gx-wanderer { right: 16%; bottom: 158px; transform: scale(1.15); }
.gx-horizon { height: 210px; }
.gx-hero-inner { display: block; min-height: 610px; padding: 118px 0 118px; }
.gx-hero-copy { max-width: 760px; padding: 0; border: 0; border-radius: 0; background: transparent !important; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.gx-eyebrow { margin-bottom: 18px; padding: 0; border: 0; background: transparent; box-shadow: none; letter-spacing: .2em; }
.gx-hero h1 { max-width: 840px; font-size: clamp(48px, 5.1vw, 88px); line-height: .98; letter-spacing: -.075em; }
.gx-hero-subtitle { margin: 16px 0 28px; font-size: clamp(17px, 1.4vw, 22px); color: rgba(226, 238, 255, .86); }
.gx-search { width: min(720px, 100%); height: 74px; }
.gx-hero-keywords { max-width: 740px; display: flex; align-items: center; gap: 12px; margin-top: 18px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.gx-keyword-label { flex: 0 0 auto; color: rgba(225, 236, 255, .72); font-size: 13px; font-weight: 900; }
.gx-hero-keywords .gx-keyword-row { display: flex; flex-wrap: wrap; gap: 8px; }
.gx-hero-keywords .gx-keyword-row button { min-height: 30px; padding: 0 12px; font-size: 12px; color: rgba(230, 240, 255, .74); background: rgba(6, 13, 29, .56); border-color: rgba(150,190,255,.18); }

.gx-home-intel { display: grid; grid-template-columns: minmax(380px, .95fr) minmax(460px, 1.05fr); gap: 24px; margin-top: -84px; position: relative; z-index: 5; }
.gx-resource-index { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin: 0; min-height: 170px; border: 1px solid rgba(144, 190, 255, .18); border-radius: 26px; background: linear-gradient(180deg, rgba(11, 22, 47, .66), rgba(6, 12, 28, .50)); box-shadow: var(--gx-glass-shadow); backdrop-filter: blur(18px) saturate(150%); -webkit-backdrop-filter: blur(18px) saturate(150%); overflow: hidden; }
.gx-resource-index span { display: flex; flex-direction: column; justify-content: center; min-height: 170px; padding: 24px 28px; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.gx-resource-index span + span { border-left: 1px solid rgba(144, 190, 255, .14); }
.gx-resource-index small { color: rgba(226, 238, 255, .70); font-weight: 850; font-size: 13px; letter-spacing: .05em; }
.gx-resource-index b { margin-top: 13px; font-size: clamp(32px, 3.1vw, 54px); line-height: .9; color: #9fb2ff; text-shadow: 0 0 32px rgba(120, 146, 255, .32); }
.gx-resource-index em { margin-top: 12px; color: var(--gx-muted); font-size: 13px; }
.gx-announcement-card { min-height: 170px; padding: 26px 30px; align-self: stretch; display: flex; flex-direction: column; justify-content: center; border-radius: 26px; background: linear-gradient(90deg, rgba(10, 23, 51, .78), rgba(8, 14, 31, .66)), radial-gradient(circle at 100% 50%, rgba(111, 234, 255, .13), transparent 36%) !important; }
.gx-card-head { gap: 14px; margin-bottom: 14px; }
.gx-card-icon { width: 40px; height: 40px; }
.gx-card-head h2 { font-size: 24px; }
.gx-announcement-list { display: block; min-height: 0; }
.gx-announcement-list p,
.gx-announcement-list li { padding: 0; margin: 0 0 8px; border-bottom: 0; color: rgba(224, 236, 255, .76); line-height: 1.75; font-size: 14px; }
.gx-announcement-content { max-height: none; overflow: visible; }
.gx-card-link { margin-top: 10px; align-self: flex-start; }

.gx-home-preview { padding-top: 46px; }
.gx-section-head-clean { border: 0 !important; background: transparent !important; padding: 0 0 16px !important; margin-bottom: 0 !important; box-shadow: none !important; }
.gx-section-head h2 { font-size: clamp(28px, 2vw, 38px); }
.gx-home-preview .game-grid { grid-template-columns: repeat(10, minmax(0, 1fr)) !important; gap: 14px !important; }
.gx-home-preview .game-card,
.gx-home-preview .game-grid .game-card:first-child { border-radius: 16px !important; min-height: 0; }
.gx-home-preview .game-card .image-container,
.gx-home-preview .game-grid .game-card:first-child .image-container,
.image-container { aspect-ratio: 3 / 4 !important; }
.gx-home-preview .game-card .card-content,
.gx-home-preview .game-grid .game-card:first-child .card-content { min-height: 104px !important; padding: 11px 11px 12px !important; }
.gx-home-preview .game-card .card-content h3,
.gx-home-preview .game-grid .game-card:first-child .card-content h3 { min-height: 38px !important; font-size: 14px !important; line-height: 1.35; }
.gx-home-preview .card-tags { min-height: 21px; gap: 4px; }
.gx-home-preview .game-tag { height: 21px; padding: 0 7px; font-size: 10px; }
.gx-home-preview .card-meta { padding-top: 8px; font-size: 11px; }
.gx-home-preview .free-tag { display: none; }
.gx-home-preview .game-card:hover { transform: translateY(-8px) scale(1.015) !important; }

.gx-home-entry-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; padding: 28px 0 56px; }
.gx-home-entry-card { position: relative; min-height: 124px; display: grid; grid-template-columns: auto 1fr auto; grid-template-areas: "icon title arrow" "icon text arrow"; align-items: center; column-gap: 16px; padding: 26px 30px; overflow: hidden; border: 1px solid rgba(144, 190, 255, .18); border-radius: 26px; background: linear-gradient(90deg, rgba(12, 24, 50, .72), rgba(7, 13, 30, .56)); box-shadow: var(--gx-glass-shadow); transition: transform .24s var(--gx-ease), border-color .24s var(--gx-ease), box-shadow .24s var(--gx-ease); }
.gx-home-entry-card::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 82% 40%, rgba(116, 239, 255, .15), transparent 34%), linear-gradient(110deg, transparent 36%, rgba(255,255,255,.06) 50%, transparent 64%); opacity: .8; }
.gx-home-entry-card:hover { transform: translateY(-6px); border-color: rgba(116,239,255,.44); box-shadow: 0 26px 78px rgba(0,0,0,.44), var(--gx-soft-glow); }
.gx-home-entry-wish::before { background: radial-gradient(circle at 78% 48%, rgba(209,120,255,.22), transparent 36%), linear-gradient(110deg, transparent 36%, rgba(255,255,255,.06) 50%, transparent 64%); }
.gx-entry-icon { grid-area: icon; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 16px; color: #fff; background: linear-gradient(135deg, rgba(116,239,255,.32), rgba(158,107,255,.34)); box-shadow: 0 0 28px rgba(116,239,255,.18); font-weight: 1000; }
.gx-home-entry-card strong { grid-area: title; position: relative; font-size: 24px; letter-spacing: -.04em; }
.gx-home-entry-card em { grid-area: text; position: relative; color: var(--gx-sub); font-style: normal; }
.gx-home-entry-card i { grid-area: arrow; position: relative; width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid rgba(144,190,255,.20); border-radius: 50%; font-style: normal; }

.gx-footer { margin-top: 0; }
.gx-footer-inner { min-height: 58px; opacity: .72; font-size: 12px; }

/* Library grid should truly fill the available width while preserving vertical covers. */
.gx-library-grid,
.seo-game-grid { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)) !important; gap: 18px !important; }
.gx-library-grid .game-card .image-container,
.seo-game-cover { aspect-ratio: 3 / 4 !important; }
.gx-library-grid .game-card .card-content { min-height: 112px; padding: 13px 13px 14px; }
.gx-library-grid .game-card .card-content h3 { font-size: 15px; min-height: 42px; }
.seo-game-card { border-radius: 20px !important; }
.seo-game-body { padding: 13px !important; }
.seo-game-title { font-size: 14px !important; min-height: 40px; }

/* Bring secondary pages closer to the homepage material system. */
.gx-subhero-inner,
.gx-library-only-head,
.gx-library-toolbar,
.gx-category-main .gx-section-head,
.gx-category-only .gx-section-mini-head,
.wish-hero-panel,
.wish-signal-panel,
.wish-board,
.gx-faq-card,
.gx-detail-page .detail-container,
.gx-detail-page .content-section,
.gx-detail-page .download-item,
.gx-detail-page .related-card,
.gx-detail-page .summary-item {
  border-color: rgba(144, 190, 255, .18) !important;
  background: linear-gradient(180deg, rgba(12, 24, 50, .72), rgba(6, 12, 28, .58)) !important;
  box-shadow: var(--gx-glass-shadow) !important;
}
.gx-library-only-head,
.gx-subhero-inner,
.wish-hero-panel { border-radius: 32px !important; }
.wish-card,
.gx-faq-card,
.gx-detail-page .content-section { border-radius: 24px !important; }

@media (max-width: 1480px) {
  .gx-home-preview .game-grid { grid-template-columns: repeat(8, minmax(0, 1fr)) !important; }
}
@media (max-width: 1180px) {
  .gx-home-intel { grid-template-columns: 1fr; margin-top: -54px; }
  .gx-home-preview .game-grid { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
  .gx-hero-inner { padding-top: 104px; }
}
@media (max-width: 900px) {
  .gx-home-preview .game-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
  .gx-resource-index { grid-template-columns: 1fr; }
  .gx-resource-index span { min-height: 92px; }
  .gx-resource-index span + span { border-left: 0; border-top: 1px solid rgba(144, 190, 255, .14); }
  .gx-home-entry-row { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .gx-shell { width: min(100% - 24px, 580px); }
  .gx-hero-inner { padding: 92px 0 92px; }
  .gx-hero-keywords { align-items: flex-start; flex-direction: column; }
  .gx-home-preview .game-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; }
  .gx-home-entry-card { grid-template-columns: auto 1fr; grid-template-areas: "icon title" "text text"; padding: 22px; }
  .gx-home-entry-card i { display: none; }
  .gx-library-grid,
  .seo-game-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; }
}
@media (max-width: 390px) {
  .gx-home-preview .game-grid,
  .gx-library-grid,
  .seo-game-grid { grid-template-columns: 1fr !important; }
}

/* ======================================================================
   GX v10 atelier polish — stronger art direction, premium card system
   目标：让页面从“毛胚”变成统一、精细、可产品化的视觉系统。
   ====================================================================== */
:root {
  --gx-atelier-bg: #02050d;
  --gx-atelier-deep: #050915;
  --gx-atelier-panel: rgba(8, 17, 36, .74);
  --gx-atelier-panel-2: rgba(10, 22, 46, .62);
  --gx-atelier-line: rgba(146, 196, 255, .22);
  --gx-atelier-line-hot: rgba(115, 238, 255, .54);
  --gx-atelier-text: #f8fbff;
  --gx-atelier-sub: rgba(224, 236, 255, .78);
  --gx-atelier-muted: rgba(184, 205, 237, .58);
  --gx-atelier-cyan: #75f1ff;
  --gx-atelier-blue: #5d91ff;
  --gx-atelier-indigo: #6d72ff;
  --gx-atelier-violet: #a56dff;
  --gx-atelier-pink: #df79ff;
  --gx-atelier-gold: #ffd68b;
  --gx-atelier-hot: #ff9a63;
  --gx-atelier-radius: 26px;
  --gx-atelier-shadow: 0 28px 96px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.075);
  --gx-atelier-shadow-soft: 0 18px 58px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.065);
  --gx-atelier-glow: 0 0 30px rgba(117,241,255,.18), 0 0 92px rgba(165,109,255,.12);
}

html { background: var(--gx-atelier-bg) !important; }
body.gx-home-page,
body.gx-library-page,
body.gx-static-page,
body.gx-detail-page,
body.gx-category-page,
body.gx-faq-page,
body.gx-wish-page {
  color: var(--gx-atelier-text) !important;
  background:
    radial-gradient(circle at 50% -18%, rgba(73,112,255,.30), transparent 34%),
    radial-gradient(circle at 8% 16%, rgba(117,241,255,.11), transparent 28%),
    radial-gradient(circle at 95% 12%, rgba(223,121,255,.12), transparent 30%),
    radial-gradient(ellipse at 52% 112%, rgba(37,70,168,.22), transparent 42%),
    linear-gradient(180deg, #02050d 0%, #050916 46%, #02050d 100%) !important;
}
body.gx-home-page::before,
body.gx-library-page::before,
body.gx-static-page::before,
body.gx-detail-page::before,
body.gx-category-page::before,
body.gx-faq-page::before,
body.gx-wish-page::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  opacity: .28;
  background-image:
    radial-gradient(circle, rgba(226,239,255,.44) 0 1px, transparent 1.5px),
    radial-gradient(circle, rgba(117,241,255,.24) 0 1px, transparent 1.5px),
    linear-gradient(90deg, rgba(117,241,255,.045) 1px, transparent 1px),
    linear-gradient(rgba(117,241,255,.045) 1px, transparent 1px);
  background-size: 190px 150px, 310px 240px, 92px 92px, 92px 92px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.85), rgba(0,0,0,.18) 56%, transparent 100%);
}
body.gx-home-page::after,
body.gx-library-page::after,
body.gx-static-page::after,
body.gx-detail-page::after,
body.gx-category-page::after,
body.gx-faq-page::after,
body.gx-wish-page::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .22;
  background:
    linear-gradient(115deg, transparent 0 42%, rgba(117,241,255,.10) 48%, transparent 55%),
    linear-gradient(25deg, transparent 0 54%, rgba(165,109,255,.12) 59%, transparent 65%);
  mix-blend-mode: screen;
}
.gx-bg .gx-grid { opacity: .12 !important; }
.gx-shell { width: min(1640px, calc(100vw - 64px)) !important; }

/* Header: more deliberate, like a finished product shell. */
.gx-header {
  height: 76px !important;
  border-bottom: 1px solid rgba(146,196,255,.16) !important;
  background: linear-gradient(180deg, rgba(4,8,18,.82), rgba(4,8,18,.62)) !important;
  box-shadow: 0 18px 70px rgba(0,0,0,.34) !important;
}
.gx-header::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(117,241,255,.56), rgba(165,109,255,.34), transparent);
  opacity: .72;
}
.gx-header-inner { min-height: 76px !important; }
.gx-logo-mark {
  width: 54px !important;
  height: 36px !important;
  border-radius: 15px !important;
  background:
    linear-gradient(135deg, rgba(117,241,255,.98), rgba(93,145,255,.88) 42%, rgba(165,109,255,.95)) !important;
  color: #02050d !important;
  box-shadow: 0 0 26px rgba(117,241,255,.18), inset 0 1px 0 rgba(255,255,255,.40) !important;
}
.gx-brand-text { font-size: 24px !important; letter-spacing: -.045em !important; }
.gx-nav { gap: clamp(30px, 4.5vw, 86px) !important; }
.gx-nav a {
  color: rgba(226,238,255,.70) !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  text-shadow: 0 0 22px rgba(117,241,255,0) !important;
}
.gx-nav a.active,
.gx-nav a:hover { color: #fff !important; text-shadow: 0 0 20px rgba(117,241,255,.26) !important; }
.gx-nav a::after {
  height: 3px !important;
  background: linear-gradient(90deg, transparent, var(--gx-atelier-cyan), var(--gx-atelier-violet), transparent) !important;
  box-shadow: 0 0 22px rgba(117,241,255,.70) !important;
}
.gx-header-search-form {
  height: 42px !important;
  width: clamp(220px, 19vw, 340px) !important;
  border-color: rgba(146,196,255,.24) !important;
  background: rgba(5,12,28,.62) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.075), 0 14px 36px rgba(0,0,0,.26) !important;
}
.gx-header-search-form:focus-within { width: clamp(260px, 24vw, 410px) !important; }

/* Hero: more cinematic and less boxed. */
.gx-hero {
  min-height: 660px !important;
  border-bottom: 0 !important;
  overflow: hidden !important;
}
.gx-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 55% 30%, rgba(117,241,255,.17), transparent 16%),
    radial-gradient(circle at 71% 34%, rgba(165,109,255,.20), transparent 18%),
    linear-gradient(180deg, rgba(2,5,13,.12), rgba(2,5,13,.76) 88%, #02050d 100%);
  z-index: 1;
}
.gx-hero::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 190px;
  pointer-events: none;
  z-index: 2;
  background: linear-gradient(180deg, transparent, rgba(2,5,13,.92));
}
.gx-hero-art { opacity: 1 !important; filter: saturate(1.14) contrast(1.04) !important; }
.gx-portal-ring {
  width: min(38vw, 520px) !important;
  height: min(38vw, 520px) !important;
  left: 62% !important;
  top: 22% !important;
  border-width: 2px !important;
  box-shadow:
    0 0 0 22px rgba(117,241,255,.024),
    0 0 0 56px rgba(165,109,255,.018),
    0 0 70px rgba(117,241,255,.28),
    inset 0 0 52px rgba(165,109,255,.18) !important;
}
.gx-wanderer { right: 15% !important; bottom: 164px !important; filter: drop-shadow(0 0 26px rgba(117,241,255,.24)); }
.gx-hero-inner { position: relative; z-index: 3; min-height: 660px !important; padding: 124px 0 132px !important; }
.gx-hero-copy { max-width: 850px !important; }
.gx-eyebrow { color: rgba(117,241,255,.86) !important; }
.gx-hero h1,
.gx-library-only-head h1,
.wish-hero-panel h1,
.gx-subhero h1 {
  letter-spacing: -.085em !important;
  text-wrap: balance;
}
.gx-hero h1 {
  max-width: 920px !important;
  font-size: clamp(56px, 5.6vw, 94px) !important;
  background: linear-gradient(180deg, #fff 0%, #c9dcff 54%, #81a4ff 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: 0 0 46px rgba(117,241,255,.10) !important;
}
.gx-hero-subtitle { font-size: clamp(18px, 1.35vw, 23px) !important; color: rgba(228,239,255,.86) !important; }
.gx-search {
  height: 78px !important;
  border-radius: 999px !important;
  border-color: rgba(117,241,255,.42) !important;
  background:
    linear-gradient(180deg, rgba(8,16,34,.82), rgba(5,11,26,.68)) !important;
  box-shadow:
    0 0 0 1px rgba(117,241,255,.06),
    0 0 38px rgba(117,241,255,.22),
    0 0 80px rgba(165,109,255,.16),
    inset 0 1px 0 rgba(255,255,255,.12) !important;
}
.gx-search input { font-size: 18px !important; font-weight: 650 !important; }
.gx-search button { width: 60px !important; height: 60px !important; }
.gx-hero-keywords { max-width: 820px !important; margin-top: 20px !important; }
.gx-keyword-label { color: rgba(226,238,255,.76) !important; }
.gx-hero-keywords .gx-keyword-row button {
  min-height: 32px !important;
  padding: 0 13px !important;
  color: rgba(230,241,255,.78) !important;
  background: rgba(5,12,28,.50) !important;
  border-color: rgba(146,196,255,.20) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045) !important;
}
.gx-hero-keywords .gx-keyword-row button:hover { color: #fff !important; border-color: rgba(117,241,255,.58) !important; background: rgba(14,28,58,.72) !important; }

/* Intelligence + announcement blocks */
.gx-home-intel { margin-top: -98px !important; gap: 24px !important; }
.gx-resource-index,
.gx-announcement-card,
.gx-home-entry-card,
.gx-library-only-head,
.gx-library-toolbar,
.gx-category-only,
.gx-category-list .gx-section-head,
.wish-hero-panel,
.wish-signal-panel,
.wish-board,
.gx-faq-card,
.gx-detail-page .detail-container,
.gx-detail-page .content-section,
.gx-detail-page .download-item,
.gx-detail-page .related-card,
.gx-detail-page .summary-item {
  border: 1px solid rgba(146,196,255,.20) !important;
  background:
    linear-gradient(135deg, rgba(255,255,255,.045), transparent 34%),
    radial-gradient(circle at 18% 0%, rgba(117,241,255,.10), transparent 38%),
    linear-gradient(180deg, rgba(10,22,46,.72), rgba(5,11,27,.64)) !important;
  box-shadow: var(--gx-atelier-shadow) !important;
  backdrop-filter: blur(22px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(160%) !important;
}
.gx-resource-index,
.gx-announcement-card { min-height: 188px !important; }
.gx-resource-index b { color: #a9bbff !important; font-variant-numeric: tabular-nums; }
.gx-resource-index span { position: relative; }
.gx-resource-index span::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-bottom: 12px;
  background: var(--gx-atelier-cyan);
  box-shadow: 0 0 18px rgba(117,241,255,.78);
}
.gx-announcement-card { overflow: hidden !important; }
.gx-announcement-card::after {
  content: "";
  position: absolute;
  right: -70px;
  bottom: -90px;
  width: 360px;
  height: 220px;
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(circle, rgba(117,241,255,.16), transparent 64%);
}
.gx-announcement-content {
  min-height: 96px !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(228,239,255,.82) !important;
  line-height: 1.86 !important;
}
.gx-announcement-card .gx-card-link {
  position: relative;
  z-index: 2;
  margin-top: 18px !important;
  background: rgba(117,241,255,.08) !important;
}

/* Poster card system — applies to every resource card with a cover. */
.game-grid { align-items: stretch !important; }
.game-card,
.seo-game-card {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  aspect-ratio: 3 / 4.62 !important;
  min-height: 0 !important;
  border-radius: 22px !important;
  border: 1px solid rgba(146,196,255,.22) !important;
  background: #071123 !important;
  box-shadow: 0 16px 42px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.08) !important;
  transition: transform .32s var(--gx-ease), border-color .32s var(--gx-ease), box-shadow .32s var(--gx-ease), filter .32s var(--gx-ease) !important;
}
.game-card::before,
.seo-game-card::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  pointer-events: none !important;
  border-radius: inherit !important;
  background:
    linear-gradient(180deg, rgba(2,5,13,.03) 0%, rgba(2,5,13,.12) 46%, rgba(2,5,13,.84) 88%, rgba(2,5,13,.96) 100%),
    radial-gradient(circle at 50% 14%, rgba(117,241,255,.13), transparent 38%) !important;
  opacity: 1 !important;
}
.game-card::after,
.seo-game-card::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 5 !important;
  pointer-events: none !important;
  border-radius: inherit !important;
  background: linear-gradient(115deg, transparent 34%, rgba(255,255,255,.14) 50%, transparent 66%) !important;
  transform: translateX(-120%) !important;
  opacity: 0 !important;
  transition: transform .72s var(--gx-ease), opacity .32s var(--gx-ease) !important;
}
.game-card:hover,
.seo-game-card:hover {
  transform: translateY(-10px) scale(1.018) !important;
  border-color: rgba(117,241,255,.58) !important;
  box-shadow: 0 28px 78px rgba(0,0,0,.52), 0 0 34px rgba(117,241,255,.20), 0 0 64px rgba(165,109,255,.12), inset 0 1px 0 rgba(255,255,255,.12) !important;
}
.game-card:hover::after,
.seo-game-card:hover::after { transform: translateX(120%) !important; opacity: .85 !important; }
.image-container,
.seo-game-cover {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: auto !important;
  border-radius: inherit !important;
  overflow: hidden !important;
  background: radial-gradient(circle at 35% 20%, rgba(93,145,255,.34), transparent 42%), #071123 !important;
}
.image-container img,
.seo-game-cover {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transform: scale(1.015) !important;
  filter: saturate(1.08) contrast(1.04) brightness(.96) !important;
  transition: transform .58s var(--gx-ease), filter .58s var(--gx-ease) !important;
}
.game-card:hover .image-container img,
.seo-game-card:hover .seo-game-cover { transform: scale(1.075) !important; filter: saturate(1.18) contrast(1.07) brightness(1.02) !important; }
.card-overlay { z-index: 6 !important; left: 10px !important; top: 10px !important; }
.free-tag {
  display: inline-flex !important;
  height: 24px !important;
  padding: 0 9px !important;
  color: #05101f !important;
  background: linear-gradient(135deg, var(--gx-atelier-cyan), #9ca0ff) !important;
  box-shadow: 0 0 18px rgba(117,241,255,.22) !important;
}
.card-content,
.seo-game-body {
  position: absolute !important;
  z-index: 6 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  min-height: 0 !important;
  padding: 62px 13px 13px !important;
  background: linear-gradient(180deg, transparent 0%, rgba(2,5,13,.72) 42%, rgba(2,5,13,.96) 100%) !important;
}
.card-content h3,
.seo-game-title {
  margin: 0 0 9px !important;
  min-height: 0 !important;
  color: #fff !important;
  font-size: 14.5px !important;
  line-height: 1.32 !important;
  letter-spacing: -.035em !important;
  text-shadow: 0 2px 16px rgba(0,0,0,.75) !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
.card-tags { min-height: 0 !important; gap: 5px !important; }
.game-tag {
  height: 22px !important;
  max-width: 86px !important;
  padding: 0 8px !important;
  color: rgba(233,244,255,.86) !important;
  background: rgba(13,24,50,.58) !important;
  border-color: rgba(146,196,255,.20) !important;
  font-size: 10.5px !important;
}
.card-tags .game-tag:nth-child(n+3) { display: none !important; }
.card-meta,
.seo-game-time {
  margin-top: 10px !important;
  padding-top: 9px !important;
  border-top: 1px solid rgba(146,196,255,.14) !important;
  color: rgba(210,225,250,.68) !important;
  font-size: 11px !important;
}
.card-meta .hot,
.card-meta .views { color: var(--gx-atelier-hot) !important; font-weight: 900 !important; }

/* Homepage card sizing: compact, consistent, gallery-like. */
.gx-home-preview { padding-top: 52px !important; }
.gx-home-preview .game-grid {
  grid-template-columns: repeat(10, minmax(0, 1fr)) !important;
  gap: 16px !important;
}
.gx-home-preview .game-card,
.gx-home-preview .game-card:first-child {
  grid-column: auto !important;
  grid-row: auto !important;
  border-radius: 18px !important;
}
.gx-home-preview .game-card .card-content { padding: 58px 12px 12px !important; }
.gx-home-preview .free-tag { display: none !important; }
.gx-home-preview .card-meta span:first-child { max-width: 82px; overflow: hidden; text-overflow: ellipsis; }

/* Game library: fill the page while keeping cards refined. */
body.gx-library-page .gx-shell,
body.gx-library-page .gx-library-only {
  width: min(1820px, calc(100vw - 48px)) !important;
}
.gx-library-grid {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
  gap: 18px !important;
}
body.gx-library-page .gx-library-grid .game-card { aspect-ratio: 3 / 4.72 !important; }
.gx-library-only-head {
  padding: 34px !important;
  border-radius: 34px !important;
  align-items: center !important;
}
.gx-library-only-head h1 { font-size: clamp(44px, 5.4vw, 82px) !important; }
.gx-library-toolbar {
  position: sticky;
  top: 84px;
  z-index: 12;
  margin-bottom: 24px !important;
  background: rgba(5,12,28,.70) !important;
}
.sort-tab { border-radius: 999px !important; }
.sort-tab.active,
.sort-tab:hover { border-color: rgba(117,241,255,.56) !important; box-shadow: var(--gx-atelier-glow) !important; }

/* Category pages: simplified but premium. */
.gx-category-only,
.gx-category-list .gx-section-head { border-radius: 30px !important; }
.seo-category-nav {
  grid-template-columns: repeat(auto-fit, minmax(126px, 1fr)) !important;
  gap: 12px !important;
}
.seo-category-nav a {
  min-height: 56px !important;
  border-radius: 18px !important;
  background: rgba(7,15,32,.62) !important;
}
.seo-category-nav a.active,
.seo-category-nav a:hover { border-color: rgba(117,241,255,.56) !important; box-shadow: 0 18px 48px rgba(0,0,0,.30), var(--gx-atelier-glow) !important; }
.seo-game-grid { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important; gap: 18px !important; }
.seo-game-card { aspect-ratio: 3 / 4.72 !important; }

/* Wish wall: make it feel like a unique product section. */
.wish-stage { gap: 26px !important; }
.wish-hero-panel,
.wish-signal-panel,
.wish-board { border-radius: 34px !important; }
.wish-hero-panel {
  min-height: 390px !important;
  background:
    radial-gradient(circle at 74% 38%, rgba(223,121,255,.24), transparent 34%),
    radial-gradient(circle at 18% 10%, rgba(117,241,255,.16), transparent 32%),
    linear-gradient(180deg, rgba(12,24,50,.78), rgba(5,11,27,.66)) !important;
}
.wish-hero-panel h1 { font-size: clamp(54px, 6.4vw, 104px) !important; }
.wish-process {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 16px;
}
.wish-process span {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 13px;
  border-radius: 999px;
  border: 1px solid rgba(146,196,255,.18);
  color: rgba(229,240,255,.82);
  background: rgba(5,12,28,.48);
  font-size: 12px;
  font-weight: 900;
}
.wish-process b { color: var(--gx-atelier-cyan); }
.wish-signal-panel .stat-item,
.wish-board .wish-controls,
.search-box-wish,
.sort-btn,
.wish-card {
  border-color: rgba(146,196,255,.18) !important;
  background: linear-gradient(180deg, rgba(11,23,49,.66), rgba(5,12,28,.64)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.065) !important;
}
.wish-card {
  border-radius: 24px !important;
  min-height: 220px !important;
  transform: none !important;
}
.wish-card:hover { transform: translateY(-8px) !important; border-color: rgba(223,121,255,.42) !important; box-shadow: 0 24px 64px rgba(0,0,0,.40), 0 0 30px rgba(223,121,255,.14) !important; }
.publish-btn { box-shadow: 0 0 34px rgba(223,121,255,.28), 0 18px 42px rgba(0,0,0,.34) !important; }

/* FAQ: from plain cards to help center modules. */
.gx-subhero { padding-top: 92px !important; }
.gx-subhero-inner { border-radius: 34px !important; padding: 40px !important; }
.gx-faq-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 22px !important; padding-top: 28px !important; padding-bottom: 62px !important; }
.gx-faq-card {
  position: relative !important;
  overflow: hidden !important;
  min-height: 176px !important;
  padding: 28px 30px !important;
}
.gx-faq-card::before {
  content: "";
  position: absolute;
  right: -54px;
  top: -54px;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(117,241,255,.14), transparent 68%);
  pointer-events: none;
}
.gx-faq-card h2 { margin-top: 0 !important; font-size: 21px !important; letter-spacing: -.04em !important; }
.gx-faq-card p { color: rgba(224,236,255,.76) !important; line-height: 1.82 !important; }

/* Detail page: premium resource dossier. */
.gx-detail-page .game-detail { padding-top: 104px !important; }
.gx-detail-page .detail-container { border-radius: 36px !important; overflow: hidden !important; }
.gx-detail-page .detail-top {
  padding: 34px !important;
  background:
    radial-gradient(circle at 82% 0%, rgba(117,241,255,.16), transparent 32%),
    linear-gradient(180deg, rgba(12,24,50,.74), rgba(5,12,28,.52)) !important;
}
.gx-detail-page .detail-header img,
.gx-detail-page #detail-cover {
  aspect-ratio: 3 / 4 !important;
  object-fit: cover !important;
  border-radius: 26px !important;
  box-shadow: 0 28px 80px rgba(0,0,0,.48), 0 0 34px rgba(117,241,255,.12) !important;
}
.gx-detail-page .detail-title { font-size: clamp(34px, 4.2vw, 64px) !important; letter-spacing: -.07em !important; }
.gx-detail-page .detail-tag,
.gx-detail-page .detail-category-badge,
.gx-detail-page .detail-meta span {
  border-radius: 999px !important;
  border: 1px solid rgba(146,196,255,.20) !important;
  background: rgba(5,12,28,.48) !important;
}
.gx-detail-page .content-section { padding: 28px !important; }
.gx-detail-page .content-title { font-size: 24px !important; letter-spacing: -.04em !important; }
.gx-detail-page .download-item { border-radius: 24px !important; padding: 20px !important; }
.gx-detail-page .download-btn {
  border-radius: 999px !important;
  background: linear-gradient(135deg, rgba(117,241,255,.38), rgba(165,109,255,.34)) !important;
  box-shadow: 0 0 28px rgba(117,241,255,.14) !important;
}
.gx-detail-page .related-card {
  aspect-ratio: 3 / 4.4 !important;
  border-radius: 22px !important;
  overflow: hidden !important;
}
.gx-detail-page .related-card img { height: 100% !important; object-fit: cover !important; }

/* Micro states. */
.empty-state,
.loading-placeholder {
  border-radius: 28px !important;
  border-color: rgba(146,196,255,.18) !important;
  background: linear-gradient(180deg, rgba(10,22,46,.58), rgba(5,12,28,.48)) !important;
  box-shadow: var(--gx-atelier-shadow-soft) !important;
}
.gx-load-more {
  min-width: 220px !important;
  height: 54px !important;
  border-color: rgba(117,241,255,.42) !important;
  background: linear-gradient(135deg, rgba(117,241,255,.18), rgba(165,109,255,.22)) !important;
  box-shadow: var(--gx-atelier-glow) !important;
}
.gx-footer {
  border-top-color: rgba(146,196,255,.12) !important;
  background: rgba(2,5,13,.62) !important;
}

@media (max-width: 1500px) {
  .gx-home-preview .game-grid { grid-template-columns: repeat(8, minmax(0, 1fr)) !important; }
  .gx-library-grid,
  .seo-game-grid { grid-template-columns: repeat(auto-fit, minmax(145px, 1fr)) !important; }
}
@media (max-width: 1180px) {
  .gx-shell { width: min(100% - 38px, 1060px) !important; }
  .gx-hero h1 { font-size: clamp(48px, 8vw, 76px) !important; }
  .gx-home-preview .game-grid { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
  .gx-home-intel { margin-top: -64px !important; }
  .gx-faq-grid { grid-template-columns: 1fr !important; }
}
@media (max-width: 760px) {
  .gx-shell { width: min(100% - 24px, 620px) !important; }
  .gx-header { height: 68px !important; }
  .gx-header-inner { min-height: 68px !important; }
  .gx-hero { min-height: auto !important; }
  .gx-hero-inner { min-height: auto !important; padding: 96px 0 100px !important; }
  .gx-hero h1 { font-size: clamp(42px, 12vw, 58px) !important; }
  .gx-search { height: 64px !important; padding-left: 18px !important; }
  .gx-search button { width: 48px !important; height: 48px !important; }
  .gx-home-preview .game-grid,
  .gx-library-grid,
  .seo-game-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 13px !important; }
  .game-card,
  .seo-game-card { border-radius: 18px !important; }
  .card-content,
  .seo-game-body { padding: 54px 11px 11px !important; }
  .gx-home-intel { gap: 16px !important; }
  .gx-resource-index,
  .gx-announcement-card { border-radius: 24px !important; }
  .gx-library-only-head { grid-template-columns: 1fr !important; padding: 24px !important; }
  .gx-library-toolbar { position: static !important; }
  .gx-faq-card { min-height: 0 !important; }
  .wish-stage { grid-template-columns: 1fr !important; }
}
@media (max-width: 420px) {
  .gx-home-preview .game-grid,
  .gx-library-grid,
  .seo-game-grid { grid-template-columns: 1fr !important; }
}


/* ======================================================================
   GX 性能优化层 v11-performance
   目标：保留高精度深空视觉，同时显著降低低端设备和资源卡密集页面的卡顿。
   ====================================================================== */
:root {
  --gx-shadow: 0 14px 38px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.055) !important;
  --gx-soft-shadow: 0 10px 28px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.055) !important;
  --gx-glow: 0 0 22px rgba(111,234,255,.13), 0 0 42px rgba(156,107,255,.08) !important;
}

/* 背景改为静态层，减少 fixed 大面积动画和混合模式重绘 */
.gx-bg,
.gx-bg::before,
.gx-bg::after,
.gx-hero-art::before,
.gx-portal-ring,
.gx-portal-ring::before,
.gx-logo-mark::after,
.reveal-card,
.game-card,
.gx-detail-page .content-section {
  animation: none !important;
}
.gx-bg {
  background:
    radial-gradient(circle at 50% -14%, rgba(93,124,255,.18), transparent 34%),
    radial-gradient(circle at 10% 20%, rgba(111,234,255,.075), transparent 30%),
    radial-gradient(circle at 95% 12%, rgba(156,107,255,.085), transparent 34%),
    linear-gradient(180deg, rgba(3,5,14,.28), rgba(3,5,14,.74)) !important;
}
.gx-bg::before { opacity: .22 !important; animation: none !important; }
.gx-bg::after { opacity: .16 !important; mix-blend-mode: normal !important; }
.gx-grid { opacity: .12 !important; transform: perspective(700px) rotateX(60deg) translateY(42vh) scale(1.42) !important; }
.gx-orb { filter: none !important; opacity: .42 !important; }
.gx-horizon, .gx-citadel, .gx-wanderer { filter: none !important; }
.gx-portal-ring { box-shadow: 0 0 28px rgba(111,234,255,.32), inset 0 0 22px rgba(95,141,255,.26) !important; }

/* 大面积毛玻璃是卡顿主因：保留玻璃色彩，取消真实 blur */
.gx-header,
.gx-search,
.gx-icon-btn,
.gx-menu-toggle,
.gx-announcement-card,
.gx-category-orbit,
.gx-keywords-panel,
.gx-entry-card,
.gx-home-entry-card,
.gx-library-only-head,
.gx-library-toolbar,
.gx-faq-card,
.gx-detail-page .detail-container,
.gx-detail-page .download-item,
.gx-detail-page .related-card,
.gx-header-search-form,
.suggestions-box,
.announcement-overlay,
.announcement-modal,
.report-modal-content,
.download-modal-content,
.wish-hero-panel,
.wish-signal-panel,
.wish-board,
.wish-card,
.search-box-wish,
.seo-category-hero,
.seo-game-card,
.gx-category-only .gx-section-mini-head,
.gx-category-main .gx-section-head {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* 资源卡：去掉逐帧光标光斑和重滤镜，减少卡片密集页掉帧 */
.game-grid,
.gx-library-grid,
.seo-game-grid,
.related-games {
  content-visibility: auto;
  contain-intrinsic-size: 1000px 1200px;
}
.game-card,
.seo-game-card,
.gx-detail-page .related-card,
.ranking-item,
.wish-card,
.gx-faq-card,
.gx-home-entry-card {
  contain: layout paint style;
  will-change: auto !important;
}
.game-card {
  box-shadow: 0 12px 30px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.065) !important;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease !important;
}
.game-card::after,
.seo-game-card::after,
.gx-home-entry-card::after {
  display: none !important;
}
.game-card:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 18px 44px rgba(0,0,0,.34), 0 0 20px rgba(111,234,255,.10), inset 0 1px 0 rgba(255,255,255,.08) !important;
}
.image-container img,
.game-cover img,
.ranking-cover img,
.seo-game-cover img,
.related-card img {
  transition: transform .22s ease !important;
  filter: none !important;
  will-change: auto !important;
}
.game-card:hover .image-container img {
  transform: scale(1.035) !important;
  filter: none !important;
}

/* 动效收敛：保留交互反馈，取消耗性能的长动画/模糊入场 */
.gx-search button:hover,
.gx-keyword-row button:hover,
.gx-hero-tags button:hover,
.category-link:hover,
.category-link.active,
.sort-tab:hover,
.sort-tab.active,
.ranking-item:hover,
.gx-entry-card:hover,
.gx-faq-card:hover,
.publish-btn:hover,
.gx-detail-page .related-card:hover {
  transform: translateY(-3px) !important;
}
.gx-search button:hover { box-shadow: 0 0 26px rgba(111,234,255,.36) !important; }
.gx-skeleton-row span { animation-duration: 2.4s !important; }
.loading-spinner, .btn-spinner, .ranking-loading-spinner { animation-duration: 1.2s !important; }

/* 长页面分块渲染，滚动时更稳 */
.gx-library,
.gx-home-intel,
.gx-home-entry-row,
.gx-page-main section,
.wish-page-main section,
.gx-detail-page .content-section {
  content-visibility: auto;
  contain-intrinsic-size: 680px;
}
.gx-hero, .gx-header { content-visibility: visible; }

/* 移动端进一步减轻背景和卡片效果 */
@media (max-width: 768px) {
  .gx-bg::before, .gx-bg::after, .gx-grid, .gx-orb { display: none !important; }
  .gx-hero-art::before { display: none !important; }
  .gx-portal-ring { box-shadow: 0 0 18px rgba(111,234,255,.22) !important; }
  .game-card:hover, .ranking-item:hover, .gx-home-entry-card:hover { transform: none !important; }
  .game-card { box-shadow: 0 10px 22px rgba(0,0,0,.26) !important; }
}

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