:root {
  --ink: #16132a;
  --muted: #6c6880;
  --paper: #f8f6ff;
  --violet: #7254ff;
  --violet-dark: #4b2bd8;
  --cyan: #38d8e6;
  --mint: #99f0cf;
  --pink: #ff7dce;
  --coral: #ff8c7a;
  --lime: #d8ff7c;
  --line: rgba(34, 26, 68, 0.12);
  --glass: rgba(255, 255, 255, 0.58);
  --shadow: 0 30px 80px rgba(85, 60, 170, 0.16);
  font-family: Inter, "Segoe UI", "Microsoft YaHei", Arial, sans-serif;
  color: var(--ink);
  background: var(--paper);
  font-synthesis: none;
  scroll-behavior: smooth;
}

* { box-sizing: border-box; }
html { scroll-padding-top: 100px; }
body {
  margin: 0;
  min-width: 320px;
  overflow-x: hidden;
  background:
    linear-gradient(rgba(255, 255, 255, 0.36), rgba(255, 255, 255, 0.36)),
    radial-gradient(circle at 12% 18%, rgba(255, 149, 215, 0.28), transparent 30%),
    radial-gradient(circle at 86% 11%, rgba(85, 224, 255, 0.27), transparent 31%),
    radial-gradient(circle at 54% 65%, rgba(166, 120, 255, 0.18), transparent 40%),
    var(--paper);
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -4;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(34, 26, 68, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(34, 26, 68, 0.035) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: linear-gradient(to bottom, black, transparent 85%);
}

a { color: inherit; text-decoration: none; }
button { font: inherit; }

.ambient {
  position: fixed;
  z-index: -3;
  width: 38vw;
  height: 38vw;
  border-radius: 50%;
  filter: blur(72px);
  opacity: 0.25;
  pointer-events: none;
}
.ambient-a { left: -18vw; top: 34vh; background: var(--pink); animation: float-a 15s ease-in-out infinite alternate; }
.ambient-b { right: -18vw; top: 66vh; background: var(--cyan); animation: float-b 17s ease-in-out infinite alternate; }
.cursor-glow {
  position: fixed;
  z-index: -2;
  width: 340px;
  height: 340px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(123, 86, 255, 0.12), transparent 68%);
  transform: translate(-50%, -50%);
  pointer-events: none;
  left: 50%; top: 50%;
}

.topbar {
  position: fixed;
  top: 18px;
  left: 50%;
  z-index: 20;
  transform: translateX(-50%);
  width: min(1180px, calc(100% - 36px));
  height: 70px;
  padding: 0 12px 0 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid rgba(255, 255, 255, 0.75);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.62);
  box-shadow: 0 16px 50px rgba(82, 58, 155, 0.12);
  backdrop-filter: blur(20px) saturate(150%);
}
.brand { display: inline-flex; gap: 11px; align-items: center; }
.brand-mark {
  display: grid;
  place-items: center;
  width: 40px; height: 40px;
  color: #fff;
  font-weight: 900;
  border-radius: 13px 7px 13px 7px;
  background: linear-gradient(145deg, var(--violet), var(--pink));
  box-shadow: 0 8px 22px rgba(113, 77, 255, 0.28);
  transform: rotate(-4deg);
}
.brand strong, .brand small { display: block; }
.brand strong { font-size: 14px; letter-spacing: 0.16em; line-height: 1.05; }
.brand small { margin-top: 5px; font-size: 8px; color: var(--muted); letter-spacing: 0.22em; }
.signal-status { display: flex; align-items: center; gap: 9px; font-size: 11px; letter-spacing: 0.08em; color: var(--muted); }
.signal-status strong { color: var(--ink); font-variant-numeric: tabular-nums; }
.signal-dot { width: 7px; height: 7px; border-radius: 50%; background: #48d9a0; box-shadow: 0 0 0 5px rgba(72, 217, 160, 0.13); }
.mini-link {
  display: flex; align-items: center; gap: 22px;
  padding: 14px 18px;
  color: #fff;
  font-size: 12px;
  border-radius: 14px;
  background: var(--ink);
  transition: transform .2s ease, box-shadow .2s ease;
}
.mini-link:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(22, 19, 42, 0.2); }

.hero {
  position: relative;
  width: min(1180px, calc(100% - 40px));
  min-height: 100svh;
  margin: auto;
  padding: 145px 0 110px;
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  align-items: center;
  gap: clamp(46px, 8vw, 110px);
}
.eyebrow {
  width: fit-content;
  padding: 8px 12px;
  border: 1px solid rgba(113, 84, 255, 0.18);
  border-radius: 99px;
  background: rgba(255, 255, 255, 0.55);
  color: var(--violet-dark);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
}
.eyebrow span { margin-right: 5px; color: var(--pink); }
.hero h1 {
  margin: 24px 0 24px;
  font-size: clamp(58px, 7vw, 98px);
  line-height: .96;
  letter-spacing: -0.075em;
  font-weight: 900;
}
.hero h1 span {
  display: inline-block;
  color: transparent;
  background: linear-gradient(90deg, #6c51f6 6%, #ff67bd 48%, #ff9a5c 76%, #36c6d6);
  background-clip: text;
  -webkit-background-clip: text;
  filter: drop-shadow(0 12px 28px rgba(126, 84, 255, 0.12));
}
.hero-lead { margin: 0; color: var(--muted); font-size: 15px; line-height: 1.9; }
.hero-actions { margin-top: 34px; display: flex; align-items: center; gap: 16px; }
.primary-button {
  display: inline-flex;
  align-items: center;
  gap: 28px;
  padding: 8px 8px 8px 24px;
  min-height: 58px;
  border-radius: 18px;
  color: white;
  background: linear-gradient(120deg, var(--violet-dark), var(--violet));
  box-shadow: 0 18px 35px rgba(105, 69, 237, 0.28);
  font-weight: 750;
  font-size: 14px;
  transition: transform .25s ease, box-shadow .25s ease;
}
.primary-button:hover { transform: translateY(-3px) rotate(-1deg); box-shadow: 0 24px 44px rgba(105, 69, 237, 0.34); }
.button-orb { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: rgba(255,255,255,.18); font-size: 20px; }
.sound-button { border: 0; padding: 12px 14px; display: flex; align-items: center; gap: 9px; color: var(--muted); background: transparent; cursor: pointer; font-size: 11px; }
.sound-bars { display: flex; align-items: center; gap: 2px; height: 14px; }
.sound-bars i { display: block; width: 2px; height: 6px; border-radius: 2px; background: var(--violet); }
.sound-bars i:nth-child(2) { height: 12px; }
.sound-button[aria-pressed="true"] .sound-bars i { animation: sound .7s ease-in-out infinite alternate; }
.sound-button[aria-pressed="true"] .sound-bars i:nth-child(2) { animation-delay: -.25s; }
.sound-button[aria-pressed="true"] .sound-bars i:nth-child(3) { animation-delay: -.5s; }
.hero-metrics { display: flex; gap: 30px; margin: 46px 0 0; }
.hero-metrics div { padding-left: 14px; border-left: 1px solid var(--line); }
.hero-metrics dt { font-size: 9px; color: var(--muted); letter-spacing: .12em; }
.hero-metrics dd { margin: 5px 0 0; font-weight: 800; font-size: 13px; }
.hero-metrics .online-text { color: #25a978; }

.orbital-panel {
  position: relative;
  min-height: 570px;
  overflow: hidden;
  padding: 24px;
  border: 1px solid rgba(255, 255, 255, .8);
  border-radius: 42px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.77), rgba(237,230,255,.46)),
    radial-gradient(circle at 60% 30%, rgba(90, 226, 234, .42), transparent 45%);
  box-shadow: var(--shadow), inset 0 0 0 1px rgba(93, 62, 185, .05);
  backdrop-filter: blur(16px);
  transform: rotate(1.5deg);
}
.panel-noise { position: absolute; inset: 0; opacity: .22; background-image: radial-gradient(rgba(54,37,104,.5) .5px, transparent .7px); background-size: 8px 8px; mask-image: linear-gradient(135deg, transparent, black, transparent); }
.panel-topline { position: relative; display: flex; justify-content: space-between; font-size: 9px; letter-spacing: .18em; font-weight: 800; color: var(--violet-dark); }
.coordinates { color: var(--muted); }
.orbit-stage { position: relative; height: 390px; display: grid; place-items: center; }
.orbit { position: absolute; border: 1px solid rgba(83, 52, 172, .18); border-radius: 50%; }
.orbit-outer { width: 330px; height: 330px; animation: orbit-spin 18s linear infinite; }
.orbit-inner { width: 236px; height: 236px; border-style: dashed; animation: orbit-spin 11s linear infinite reverse; }
.orbit::before, .orbit::after { content: ""; position: absolute; left: 50%; top: -4px; width: 8px; height: 8px; border-radius: 50%; background: var(--pink); box-shadow: 0 0 18px var(--pink); }
.orbit::after { left: auto; right: 12%; top: auto; bottom: 10%; background: var(--cyan); box-shadow: 0 0 18px var(--cyan); }
.orbit i, .orbit b { position: absolute; inset: 12%; border: 1px solid rgba(127, 95, 222, .11); border-radius: 50%; }
.orbit b { inset: 28%; }
.core {
  position: relative;
  display: grid;
  place-items: center;
  width: 154px; height: 154px;
  color: white;
  border-radius: 49% 51% 56% 44%;
  background:
    radial-gradient(circle at 34% 30%, rgba(255,255,255,.9), transparent 9%),
    linear-gradient(145deg, #65dde4, #7a50ee 49%, #f078c4 78%, #ffb960);
  box-shadow: 0 26px 60px rgba(103, 77, 214, .28), inset 0 0 30px rgba(255,255,255,.38);
  animation: core-float 5s ease-in-out infinite;
}
.core::after { content:""; position:absolute; inset:8px; border:1px solid rgba(255,255,255,.35); border-radius:inherit; }
.core span { font-size: 29px; font-weight: 900; letter-spacing: -.04em; }
.core small { position: absolute; bottom: 39px; font-size: 7px; letter-spacing: .24em; }
.crosshair { position: absolute; color: rgba(62,43,119,.28); font-weight: 300; }
.crosshair-a { top: 24%; left: 9%; }
.crosshair-b { bottom: 20%; right: 8%; }
.scan-caption { position: relative; display: flex; justify-content: space-between; align-items: end; padding: 18px 16px; border: 1px solid rgba(96,71,167,.11); border-radius: 20px; background: rgba(255,255,255,.45); }
.scan-caption span { display:block; font-size:9px; color:var(--muted); letter-spacing:.14em; }
.scan-caption strong { display:block; margin-top:6px; font-size:13px; font-variant-numeric: tabular-nums; }
.waveform { height: 28px; display: flex; align-items: center; gap: 3px; }
.waveform i { width: 3px; height: 10px; border-radius: 2px; background: linear-gradient(var(--violet), var(--pink)); animation: sound 1s ease-in-out infinite alternate; }
.waveform i:nth-child(2n) { height: 22px; animation-delay:-.45s; }
.waveform i:nth-child(3n) { height: 16px; animation-delay:-.7s; }
.panel-stamp { position:absolute; right:-8px; top:95px; font-size:9px; line-height:1.6; letter-spacing:.18em; color:rgba(65,45,127,.34); transform:rotate(90deg); }
.scroll-cue { position: absolute; left: 50%; bottom: 28px; display:flex; flex-direction:column; align-items:center; gap:9px; transform:translateX(-50%); font-size:9px; color:var(--muted); letter-spacing:.15em; }
.scroll-cue i { width:1px; height:32px; background:linear-gradient(var(--violet), transparent); animation: scroll-line 1.8s ease-in-out infinite; }

.playground { position: relative; padding: 125px max(20px, calc((100vw - 1180px) / 2)); background: linear-gradient(180deg, transparent, rgba(231,224,255,.68) 16%, rgba(244,241,255,.9)); }
.section-heading { display:flex; justify-content:space-between; align-items:end; gap:40px; margin-bottom:38px; }
.section-index, .transmission-title > span { display:block; margin-bottom:12px; color:var(--violet); font-size:10px; font-weight:800; letter-spacing:.18em; }
.section-heading h2, .transmission-title h2 { margin:0; font-size:clamp(36px,5vw,62px); line-height:1; letter-spacing:-.055em; }
.section-heading h2 em { display:block; margin-top:11px; color:var(--muted); font-size:11px; font-style:normal; letter-spacing:.22em; }
.section-heading p { margin:0; max-width:380px; color:var(--muted); font-size:13px; line-height:1.8; }
.game-layout { display:grid; grid-template-columns:minmax(0,1fr) 315px; gap:22px; align-items:start; }
.game-shell, .leaderboard { border:1px solid rgba(255,255,255,.82); background:rgba(255,255,255,.56); backdrop-filter:blur(17px); box-shadow:0 24px 70px rgba(73,53,138,.12); }
.game-shell { overflow:hidden; border-radius:32px; }
.game-hud { display:grid; grid-template-columns:repeat(3,1fr); padding:19px 24px; border-bottom:1px solid var(--line); }
.game-hud div { padding-left:18px; border-left:1px solid var(--line); }
.game-hud div:first-child { padding-left:0; border-left:0; }
.game-hud span { display:block; font-size:8px; color:var(--muted); letter-spacing:.13em; }
.game-hud strong { display:block; margin-top:5px; font-size:18px; font-variant-numeric:tabular-nums; letter-spacing:.05em; }
.canvas-wrap { position:relative; aspect-ratio:16/9; min-height:340px; background:#17132b; touch-action:none; }
#gameCanvas { display:block; width:100%; height:100%; }
.game-overlay { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:28px; color:#fff; text-align:center; background:radial-gradient(circle at center, rgba(93,60,190,.26), rgba(18,14,39,.3)); transition:opacity .35s ease, visibility .35s ease; }
.game-overlay.hidden { opacity:0; visibility:hidden; pointer-events:none; }
.overlay-symbol { display:grid; place-items:center; width:58px; height:58px; margin-bottom:18px; color:var(--lime); border:1px solid rgba(216,255,124,.45); border-radius:18px; background:rgba(216,255,124,.07); font-size:30px; box-shadow:0 0 35px rgba(216,255,124,.12); }
.overlay-kicker { color:#bcaaff; font-size:8px; letter-spacing:.25em; font-weight:800; }
.game-overlay h3 { margin:10px 0 9px; font-size:clamp(24px,4vw,38px); letter-spacing:-.04em; }
.game-overlay p { margin:0 0 22px; color:rgba(255,255,255,.58); font-size:11px; }
.start-button { display:flex; align-items:center; gap:22px; padding:13px 15px 13px 19px; border:0; border-radius:14px; color:#181329; background:linear-gradient(120deg,var(--lime),#7ff1d6); font-size:12px; font-weight:800; cursor:pointer; box-shadow:0 12px 28px rgba(146,242,185,.2); transition:transform .2s ease; }
.start-button:hover { transform:translateY(-2px) scale(1.02); }
.game-footer { display:flex; justify-content:space-between; padding:14px 22px; color:var(--muted); font-size:9px; }
kbd { margin:0 2px; padding:3px 6px; border:1px solid var(--line); border-radius:5px; color:var(--ink); background:rgba(255,255,255,.7); box-shadow:0 2px 0 rgba(37,28,74,.1); font:inherit; }
.leaderboard { padding:25px; border-radius:28px; }
.leaderboard-head { display:flex; justify-content:space-between; align-items:start; }
.leaderboard-head span { font-size:7px; color:var(--violet); font-weight:800; letter-spacing:.16em; }
.leaderboard-head h3 { margin:6px 0 0; font-size:24px; letter-spacing:-.04em; }
.leaderboard-head .local-badge { padding:7px 9px; color:#267b64; border-radius:9px; background:rgba(104,229,190,.18); letter-spacing:.08em; }
.current-visitor { margin:20px 0 12px; padding:13px 14px; border-radius:14px; background:linear-gradient(120deg,rgba(114,84,255,.09),rgba(255,125,206,.08)); }
.current-visitor span, .current-visitor strong { display:block; }
.current-visitor span { font-size:8px; color:var(--muted); }
.current-visitor strong { margin-top:5px; font-size:12px; font-variant-numeric:tabular-nums; }
.rank-list { margin:0; padding:0; list-style:none; counter-reset:rank; }
.rank-list li { counter-increment:rank; display:grid; grid-template-columns:28px 1fr auto; align-items:center; gap:7px; padding:13px 3px; border-bottom:1px solid var(--line); font-size:11px; }
.rank-list li::before { content:"0" counter(rank); color:var(--muted); font-size:9px; }
.rank-list li:first-child::before { color:var(--violet); font-weight:900; }
.rank-list strong { font-variant-numeric:tabular-nums; }
.rank-list small { color:var(--muted); overflow:hidden; text-overflow:ellipsis; }
.rank-note { margin:15px 0 21px; color:var(--muted); font-size:9px; line-height:1.65; }
.mini-challenge { padding:15px; border:1px solid var(--line); border-radius:16px; background:rgba(255,255,255,.45); }
.mini-challenge > span { display:block; color:var(--muted); font-size:8px; }
.mini-challenge > strong { display:block; margin-top:5px; font-size:13px; }
.challenge-track { height:5px; margin:12px 0 8px; overflow:hidden; border-radius:99px; background:rgba(74,53,143,.1); }
.challenge-track i { display:block; width:0; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--violet),var(--pink)); transition:width .45s ease; }
.mini-challenge small { color:var(--muted); font-size:8px; }

.transmissions { padding:130px max(20px, calc((100vw - 1180px) / 2)); background:rgba(244,241,255,.9); }
.transmission-title { display:flex; justify-content:space-between; align-items:start; margin-bottom:44px; }
.transmission-title > span { margin-top:10px; }
.signal-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.signal-card { position:relative; min-height:310px; overflow:hidden; padding:27px; border:1px solid rgba(255,255,255,.62); border-radius:30px; box-shadow:0 22px 60px rgba(69,50,130,.11); transition:transform .3s ease, box-shadow .3s ease; }
.signal-card:hover { transform:translateY(-8px) rotate(-.5deg); box-shadow:0 30px 75px rgba(69,50,130,.18); }
.signal-card::after { content:""; position:absolute; width:190px; height:190px; right:-65px; bottom:-65px; border:1px solid rgba(255,255,255,.5); border-radius:50%; box-shadow:0 0 0 24px rgba(255,255,255,.10),0 0 0 48px rgba(255,255,255,.08); }
.card-violet { background:linear-gradient(145deg,#8069ff,#af83ff); color:white; }
.card-mint { background:linear-gradient(145deg,#9ff0d3,#70d7d7); }
.card-coral { background:linear-gradient(145deg,#ff9b80,#ff84bd); color:white; }
.card-number { font-size:9px; letter-spacing:.15em; opacity:.65; }
.card-icon { display:grid; place-items:center; width:80px; height:80px; margin:38px 0 35px; border:1px solid rgba(255,255,255,.45); border-radius:25px; background:rgba(255,255,255,.16); font-size:43px; box-shadow:inset 0 0 30px rgba(255,255,255,.12); }
.signal-card h3 { margin:0; font-size:25px; }
.signal-card p { margin:7px 0 0; font-size:8px; font-weight:800; letter-spacing:.22em; opacity:.65; }
.card-status { position:absolute; right:22px; top:23px; padding:7px 9px; border:1px solid rgba(255,255,255,.34); border-radius:99px; font-size:8px; }

footer { display:flex; justify-content:space-between; align-items:center; gap:30px; padding:46px max(20px,calc((100vw - 1180px)/2)); border-top:1px solid var(--line); background:rgba(248,246,255,.94); }
footer p, .back-top { color:var(--muted); font-size:10px; letter-spacing:.07em; }
.back-top { padding-bottom:3px; border-bottom:1px solid var(--line); }

.reveal { opacity:0; transform:translateY(24px); transition:opacity .8s ease, transform .8s cubic-bezier(.2,.8,.2,1); }
.reveal.visible { opacity:1; transform:none; }

@keyframes orbit-spin { to { transform:rotate(360deg); } }
@keyframes core-float { 0%,100%{transform:translateY(-5px) rotate(-2deg)} 50%{transform:translateY(8px) rotate(2deg)} }
@keyframes sound { from{transform:scaleY(.45);opacity:.55} to{transform:scaleY(1.15);opacity:1} }
@keyframes scroll-line { 0%{transform:scaleY(0);transform-origin:top} 50%{transform:scaleY(1);transform-origin:top} 51%{transform-origin:bottom} 100%{transform:scaleY(0);transform-origin:bottom} }
@keyframes float-a { to{transform:translate(15vw,-8vh) scale(1.15)} }
@keyframes float-b { to{transform:translate(-13vw,7vh) scale(.86)} }

@media (max-width: 960px) {
  .hero { grid-template-columns:1fr; padding-top:150px; }
  .hero-copy { max-width:680px; }
  .orbital-panel { width:min(620px,100%); margin:auto; }
  .game-layout { grid-template-columns:1fr; }
  .leaderboard { display:grid; grid-template-columns:1fr 1fr; gap:0 25px; }
  .leaderboard-head, .current-visitor { grid-column:1/-1; }
  .rank-note { align-self:end; }
  .scroll-cue { display:none; }
}

@media (max-width: 720px) {
  .topbar { top:10px; width:calc(100% - 20px); height:62px; border-radius:18px; }
  .signal-status { display:none; }
  .mini-link { gap:8px; padding:12px 13px; }
  .mini-link span:first-child { display:none; }
  .hero { width:calc(100% - 30px); padding:120px 0 80px; gap:55px; }
  .hero h1 { font-size:clamp(52px,16vw,75px); }
  .hero-lead { font-size:13px; }
  .desktop-break { display:none; }
  .hero-actions { align-items:flex-start; flex-direction:column; }
  .hero-metrics { gap:17px; }
  .orbital-panel { min-height:470px; padding:18px; border-radius:30px; transform:none; }
  .orbit-stage { height:320px; }
  .orbit-outer { width:270px; height:270px; }
  .orbit-inner { width:195px; height:195px; }
  .core { width:128px; height:128px; }
  .core small { bottom:31px; }
  .playground, .transmissions { padding-top:85px; padding-bottom:85px; }
  .section-heading { align-items:start; flex-direction:column; gap:18px; }
  .section-heading p { font-size:12px; }
  .canvas-wrap { min-height:430px; aspect-ratio:3/4; }
  .game-hud { padding:16px; }
  .game-hud strong { font-size:14px; }
  .game-footer span:first-child { display:none; }
  .leaderboard { display:block; }
  .signal-grid { grid-template-columns:1fr; }
  .signal-card { min-height:265px; }
  .card-icon { margin:30px 0; }
  .transmission-title { flex-direction:column; }
  .transmission-title > span { order:-1; }
  footer { flex-direction:column; align-items:flex-start; }
}

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

/* ===== 可读性字号优化 ===== */
.brand small { font-size: 12px; letter-spacing: .18em; }
.signal-status { font-size: 14px; }
.mini-link { font-size: 14px; }
.eyebrow { font-size: 14px; }
.hero-lead { font-size: 18px; line-height: 1.85; }
.sound-button { font-size: 14px; }
.hero-metrics dt { font-size: 12px; }
.hero-metrics dd { font-size: 16px; }
.panel-topline { font-size: 12px; letter-spacing: .14em; }
.core small { font-size: 12px; }
.scan-caption span { font-size: 12px; }
.scan-caption strong { font-size: 16px; }
.panel-stamp { font-size: 12px; }
.scroll-cue { font-size: 12px; }
.section-index, .transmission-title > span { font-size: 13px; }
.section-heading h2 em { font-size: 14px; }
.section-heading p { max-width: 430px; font-size: 16px; }
.game-hud span { font-size: 12px; }
.game-hud strong { font-size: 24px; }
.overlay-kicker { font-size: 12px; }
.game-overlay p { color: rgba(255,255,255,.76); font-size: 15px; }
.start-button { font-size: 16px; }
.game-footer { font-size: 13px; }
.leaderboard-head span { font-size: 12px; }
.leaderboard-head h3 { font-size: 30px; }
.current-visitor span { font-size: 12px; }
.current-visitor strong { font-size: 15px; }
.rank-list li { padding-top: 15px; padding-bottom: 15px; font-size: 14px; }
.rank-list li::before { font-size: 12px; }
.rank-list li.live { margin: 4px -8px; padding-left: 11px; padding-right: 11px; border: 1px solid rgba(114,84,255,.18); border-radius: 12px; background: linear-gradient(120deg,rgba(114,84,255,.1),rgba(255,125,206,.08)); }
.rank-list li.live small { color: var(--violet-dark); font-weight: 800; }
.rank-note { font-size: 13px; }
.mini-challenge > span { font-size: 12px; }
.mini-challenge > strong { font-size: 16px; }
.mini-challenge small { font-size: 12px; }
.card-number { font-size: 12px; }
.signal-card p { font-size: 12px; }
.card-status { font-size: 12px; }
footer p, .back-top { font-size: 14px; }

@media (max-width: 720px) {
  .hero-lead { font-size: 16px; }
  .section-heading p { font-size: 15px; }
  .game-hud strong { font-size: 20px; }
}

/* 内容默认保持可见，避免本地脚本异常时整个游戏区域消失 */
.reveal { opacity: 1; transform: none; }