@font-face{font-family:'Barlow';font-style:normal;font-display:swap;font-weight:300;src:url(../vendor/fonts/barlow/barlow-latin-300-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow';font-style:normal;font-display:swap;font-weight:300;src:url(../vendor/fonts/barlow/barlow-latin-ext-300-normal.woff2) format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Barlow';font-style:normal;font-display:swap;font-weight:400;src:url(../vendor/fonts/barlow/barlow-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow';font-style:normal;font-display:swap;font-weight:400;src:url(../vendor/fonts/barlow/barlow-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Barlow';font-style:normal;font-display:swap;font-weight:500;src:url(../vendor/fonts/barlow/barlow-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow';font-style:normal;font-display:swap;font-weight:500;src:url(../vendor/fonts/barlow/barlow-latin-ext-500-normal.woff2) format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Barlow';font-style:normal;font-display:swap;font-weight:600;src:url(../vendor/fonts/barlow/barlow-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow';font-style:normal;font-display:swap;font-weight:600;src:url(../vendor/fonts/barlow/barlow-latin-ext-600-normal.woff2) format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Barlow Semi Condensed';font-style:normal;font-display:swap;font-weight:500;src:url(../vendor/fonts/barlow/barlow-semi-condensed-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow Semi Condensed';font-style:normal;font-display:swap;font-weight:500;src:url(../vendor/fonts/barlow/barlow-semi-condensed-latin-ext-500-normal.woff2) format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Barlow Semi Condensed';font-style:normal;font-display:swap;font-weight:600;src:url(../vendor/fonts/barlow/barlow-semi-condensed-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow Semi Condensed';font-style:normal;font-display:swap;font-weight:600;src:url(../vendor/fonts/barlow/barlow-semi-condensed-latin-ext-600-normal.woff2) format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* One look for the whole site, the same as the homepage: near-black, square edges, thin lines,
   Barlow type, a single gold accent. Loaded last on every subpage (<body class="s2">); the pages'
   own layouts and scripts are untouched, only their look is brought in line. */

:root {
  --n-ink: #03050a; --n-panel: #0a0d14; --n-line: rgba(255,255,255,0.13); --n-fg: #f5f5f3; --n-mute: #9a9ea6; --n-soft: #c9cbcf; --n-sun: #f5c518;
  --n-display: 'Barlow', 'Montserrat', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Noto Sans SC', system-ui, sans-serif;
  --n-label: 'Barlow Semi Condensed', 'Barlow', 'Montserrat', 'PingFang SC', 'Microsoft YaHei', system-ui, sans-serif;
  /* the old palettes, re-pointed */
  --space: #03050a; --bg: #03050a; --dark: #03050a; --panel-solid: #0a0d14;
  --edge-site: rgba(255,255,255,0.13); --edge: rgba(255,255,255,0.13); --edge-hi: rgba(255,255,255,0.4);
  --sun: #f5c518; --gold: #f5c518; --yellow: #f5c518; --snow: #f5f5f3; --mist: #9a9ea6;
  --accent: #f5c518; --accent2: #f5c518; --accent3: #ffe08a; --cyan: #f5c518; --blue: #f5f5f3; --ice: #f5f5f3;
  --font: var(--n-display); --font-display: var(--n-display); --font-body: var(--n-display);
}
html { background: var(--n-ink); }
body.s2 { background: transparent !important; color: var(--n-fg); font-family: var(--n-display) !important; }
body.s2 .meteor, body.s2 .nebula, body.s2 .aurora { display: none !important; }
body.s2 #star-canvas { opacity: .5; }

/* type */
body.s2 h1, body.s2 h2, body.s2 h3, body.s2 h4 { font-family: var(--n-display) !important; font-weight: 600 !important; letter-spacing: .005em !important; text-wrap: balance; background: none !important; -webkit-text-fill-color: currentColor !important; }
html[lang="zh"] body.s2 h1, html[lang="zh"] body.s2 h2, html[lang="zh"] body.s2 h3 { font-weight: 700 !important; letter-spacing: .02em !important; }
body.s2 p, body.s2 li, body.s2 dd { font-family: var(--n-display); }
body.s2 [class*="kicker"], body.s2 [class*="eyebrow"], body.s2 .section-tag, body.s2 .page-tag, body.s2 [class$="-tag"]:not(.tn-baik) {
  font-family: var(--n-label) !important; font-weight: 600 !important; letter-spacing: .2em !important; text-transform: uppercase; color: var(--n-sun) !important;
  background: none !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; padding-left: 0 !important; padding-right: 0 !important;
}
body.s2 [class*="kicker"]::before, body.s2 .section-tag::before { content: none !important; }
body.s2 a { text-underline-offset: 3px; }
:focus-visible { outline-color: var(--n-fg) !important; }

/* small even corners and one thin line on every card, panel, chip, button and field
   (dots, planets, globes, avatars and round icons keep their shape) */
body.s2 :is([class*="card"], [class*="panel"], [class*="stage"], [class*="frame"], [class*="wrap"] > canvas, [class*="chip"], [class*="pill"], [class*="badge"], [class*="btn"], [class*="tab"], [class*="box"], [class*="tile"], [class*="stat"], [class*="toast"], [class*="pop"], [class*="modal"], [class*="sheet"], [class*="field"], [class*="cta"], [class*="tool"] > button, button, input, select, textarea, .how-card, figure, figure img):not([class*="dot"]):not([class*="avatar"]):not([class*="planet"]):not([class*="moon"]):not([class*="globe"]):not([class*="round"]):not([class*="circle"]):not(.cesium-button) {
  border-radius: 8px !important;
}
body.s2 :is([class*="card"], [class*="panel"]):not([class*="dot"]) { box-shadow: none !important; }
body.s2 :is([class*="card"], [class*="panel"]):not([class*="dot"]):not(.fp-panel):not([class*="cards"]) { border-color: var(--n-line) !important; }

/* buttons: the homepage's two kinds — white fill, or a white outline */
body.s2 :is(.btn, .btn-primary, .btn-secondary, .o-cta, .cta-btn, .hero-btn, [class*="-btn"]:not(.lang-btn):not(.login-btn):not(.chat-btn):not(.back-top)) {
  font-family: var(--n-label) !important; font-weight: 600 !important; letter-spacing: .14em !important; text-transform: uppercase;
}
body.s2 :is(.btn-primary, .o-cta:not(.o-cta-auto), .hero-btn.primary) { background: var(--n-fg) !important; color: var(--n-ink) !important; border: 1.5px solid var(--n-fg) !important; box-shadow: none !important; }
body.s2 :is(.btn-secondary, .o-cta-auto, .hero-btn.secondary) { background: transparent !important; color: var(--n-fg) !important; border: 1.5px solid rgba(255,255,255,.6) !important; box-shadow: none !important; }

/* header (subpages: #site-header; games, mission, sky: #header) */
body.s2 #site-header, body.s2 #header { padding-left: max(24px, env(safe-area-inset-left, 0px)) !important; padding-right: max(24px, env(safe-area-inset-right, 0px)) !important; }
body.s2 #site-header.scrolled, body.s2 #header.scrolled { background: rgba(3,5,10,.86) !important; border-bottom-color: var(--n-line) !important; }
body.s2 .site-logo, body.s2 #header .logo { font-family: var(--n-display) !important; font-weight: 600 !important; font-size: 16px !important; letter-spacing: .3em !important; }
body.s2 .site-logo span, body.s2 #header .logo span { font-weight: 400 !important; letter-spacing: .3em !important; color: rgba(255,255,255,.5) !important; }
body.s2 .site-nav a, body.s2 header nav a { font-family: var(--n-label) !important; font-weight: 600 !important; font-size: 12.5px !important; letter-spacing: .14em !important; text-transform: uppercase; color: rgba(255,255,255,.68) !important; }
html[lang="zh"] body.s2 .site-nav a, html[lang="zh"] body.s2 header nav a { font-size: 13.5px !important; letter-spacing: .06em !important; }
body.s2 .site-nav a:hover, body.s2 .site-nav a[aria-current="page"], body.s2 header nav a:hover, body.s2 header nav a[aria-current="page"] { color: #fff !important; }
body.s2 .site-nav a[aria-current="page"]::after, body.s2 header nav a[aria-current="page"]::after { content: "" !important; position: absolute; left: 0; right: 0; bottom: -6px; height: 1px !important; border-radius: 0 !important; background: var(--n-sun) !important; }
body.s2 :is(.login-btn, .lang-current) { border-radius: 0 !important; font-family: var(--n-label) !important; letter-spacing: .12em; text-transform: uppercase; font-size: 12px !important; }
body.s2 .login-btn { border: 1px solid rgba(255,255,255,.35) !important; background: transparent !important; }
body.s2 .lang-pop, body.s2 .nav-drop, body.s2 [class*="dropdown"] { border-radius: 0 !important; background: rgba(8,10,16,.97) !important; border: 1px solid var(--n-line) !important; box-shadow: 0 30px 80px rgba(0,0,0,.5) !important; }
body.s2 .lang-btn { border-radius: 0 !important; font-family: var(--n-display) !important; }
body.s2 #progress-bar { height: 1px !important; background: var(--n-sun) !important; box-shadow: none !important; }
body.s2 .mobile-nav, body.s2 .site-mobile, body.s2 [class*="mobile-menu"] { background: var(--n-ink) !important; }
body.s2 .mobile-nav a, body.s2 .site-mobile a { font-family: var(--n-display) !important; font-weight: 600; border-radius: 0 !important; }

/* photo banners: darker at the bottom, no colour cast */
body.s2 .page-banner::after { background: linear-gradient(180deg, rgba(3,5,10,.6) 0%, rgba(3,5,10,.25) 30%, rgba(3,5,10,.6) 70%, var(--n-ink) 100%) !important; }

/* footer */
body.s2 #site-footer, body.s2 footer.footer, body.s2 .site-footer { background: var(--n-ink) !important; border-top: 1px solid var(--n-line) !important; }
body.s2 :is(#site-footer, .footer) :is(a, p, span) { font-family: var(--n-display); }

/* chat button, back to top: square like the homepage */
body.s2 :is(#chat-btn, .chat-btn, #back-top, .back-top) { border-radius: 0 !important; background: rgba(8,10,16,.9) !important; border: 1px solid rgba(255,255,255,.3) !important; box-shadow: none !important; color: #fff !important; }
body.s2 #chat-panel { border-radius: 0 !important; }

/* range sliders and progress bars: thin and gold */
body.s2 input[type="range"] { accent-color: var(--n-sun); }
body.s2 [class*="bar"] > i, body.s2 [class*="fill"]:not(input) { border-radius: 0 !important; }

/* round-named controls that are really buttons: square too */
body.s2 :is(.planet-btn, .sk-round, .sk-tg) { border-radius: 0 !important; }
body.s2 #sk-gyro { background: rgba(8,10,16,.9) !important; border: 1px solid rgba(255,255,255,.35) !important; box-shadow: none !important; color: #fff !important; }

/* ---------- phones ---------- */
@media (max-width: 760px) {
  /* long lists of cards become one swipeable row, like the homepage strips */
  body.s2 :is(.fp-cards, .at-pl) {
    display: grid !important; grid-auto-flow: column; grid-template-columns: none !important; grid-auto-columns: 80%;
    gap: 12px !important; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain;
    margin-inline: calc(-1 * var(--gutter, 16px)); padding: 0 var(--gutter, 16px) 14px; scroll-padding-inline: var(--gutter, 16px);
    scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.25) transparent;
  }
  body.s2 :is(.fp-cards, .at-pl) > * { scroll-snap-align: start; min-width: 0; }
  body.s2 h1 { font-size: clamp(34px, 10vw, 46px) !important; line-height: 1.1 !important; }
  body.s2 h2 { font-size: clamp(26px, 7.4vw, 34px) !important; line-height: 1.2 !important; }
  body.s2 :is(p, li) { font-size: max(15px, 1em); }
  body.s2 .site-nav, body.s2 header nav { -webkit-tap-highlight-color: transparent; }
  body.s2 :is(button, [class*="btn"], [class*="chip"], a[class*="cta"]) { min-height: 40px; }
}
@media (max-width: 760px) { body.s2 .mc-src { display: block; max-width: 100%; overflow-wrap: anywhere; } }

@media (max-width: 760px) {
  body.s2 :is(#back-top, .back-top) { display: none !important; }
  body.s2 :is(#chat-btn, .chat-btn) { width: 42px !important; height: 42px !important; right: 12px !important; bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important; opacity: .85; }
}

/* phones: a quick double tap on a button must not zoom the page; text fields at 16px so iOS does not zoom in when typing.
   Pinch-to-zoom still works. */
html, body, button, a, input, textarea, select, label, [role="button"] { touch-action: manipulation; }
@media (max-width: 760px) { input, textarea, select { font-size: 16px !important; } }


/* ---------- toothpick pass (2026-10-27): the same rules as the homepage ----------
   sentence case, normal letter spacing, no gold all-caps eyebrows, small even corners, no footer quote */
body.s2 [class*="kicker"], body.s2 [class*="eyebrow"], body.s2 .section-tag, body.s2 .page-tag, body.s2 [class$="-tag"]:not(.tn-baik) {
  font-family: var(--n-display) !important; font-weight: 500 !important; letter-spacing: .01em !important; text-transform: none !important; color: var(--n-mute) !important;
}
body.s2 .site-logo, body.s2 #header .logo, body.s2 .site-logo span, body.s2 #header .logo span { letter-spacing: .08em !important; }
body.s2 .site-nav a, body.s2 header nav a { font-family: var(--n-display) !important; font-weight: 500 !important; font-size: 14px !important; letter-spacing: .01em !important; text-transform: none !important; }
html[lang="zh"] body.s2 .site-nav a, html[lang="zh"] body.s2 header nav a { letter-spacing: .02em !important; }
body.s2 :is(.login-btn, .lang-current) { font-family: var(--n-display) !important; letter-spacing: .01em !important; text-transform: none !important; border-radius: 6px !important; }
body.s2 :is(.btn, .btn-primary, .btn-secondary, .o-cta, .cta-btn, .hero-btn, [class*="-btn"]:not(.lang-btn):not(.login-btn):not(.chat-btn):not(.back-top)) {
  font-family: var(--n-display) !important; letter-spacing: .01em !important; text-transform: none !important;
}
body.s2 :is(.btn-primary, .o-cta:not(.o-cta-auto), .hero-btn.primary, .btn-secondary, .o-cta-auto, .hero-btn.secondary) { border-width: 1px !important; border-radius: 6px !important; }
body.s2 :is(.lang-pop, .nav-drop, [class*="dropdown"]) { border-radius: 8px !important; }
body.s2 #chat-panel:not(.dock) { border-radius: 8px !important; }
body.s2 #site-footer .footer-quote, body.s2 footer .footer-quote { display: none !important; }
body.s2 #site-footer { padding-top: 40px !important; }
body.s2 #site-footer .footer-art { opacity: .55; }
body.s2 #site-footer .footer-row { font-family: var(--n-display); }
body.s2 #site-footer .footer-row p { text-transform: none !important; letter-spacing: .01em !important; }
@media (max-width: 760px) { body.s2 #site-footer { min-height: 0 !important; } body.s2 #site-footer .footer-art { opacity: .35; } }

/* no glow, no gold pills: plain outline buttons and flat dots across the subpages */
body.s2 :is(.roadmap-dot, .rtag, .hist-link, .k-home, .dot.iss, .sk-label.iss, .sk-round.sk-calib, .at-pin i, .m-pin i) { box-shadow: none !important; }
body.s2 [style*="glow-pulse"], body.s2 .glow, body.s2 [class*="glow"] { animation: none !important; }
body.s2 :is(.sk-go, .bs-go, .bs-dl, .hist-link) { background: none !important; color: var(--n-fg) !important; border: 1px solid rgba(255,255,255,.35) !important; border-radius: 6px !important; box-shadow: none !important; font-weight: 500 !important; }
body.s2 :is(.sk-go, .bs-go, .bs-dl, .hist-link):hover { border-color: #fff !important; }
body.s2 .rtag { border-radius: 4px !important; background: none !important; color: var(--n-soft) !important; border-color: var(--n-line) !important; }
/* numbers on things that are not steps */
body.s2 :is(.pj-num, .arc-num) { display: none !important; }