@font-face {
  font-family: Work Sans;
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(/assets/work-sans-latin-700-normal-CEeo_t6l.woff2) format("woff2"),
    url(/assets/work-sans-latin-700-normal-mDs79oer.woff) format("woff");
}
@font-face {
  font-family: Work Sans;
  font-style: normal;
  font-display: swap;
  font-weight: 800;
  src: url(/assets/work-sans-latin-800-normal-CHo7j6hf.woff2) format("woff2"),
    url(/assets/work-sans-latin-800-normal-C89f8isX.woff) format("woff");
}
@font-face {
  font-family: Work Sans;
  font-style: normal;
  font-display: swap;
  font-weight: 900;
  src: url(/assets/work-sans-latin-900-normal-Bz42DoD_.woff2) format("woff2"),
    url(/assets/work-sans-latin-900-normal-Bxt3ETSd.woff) format("woff");
}
@font-face {
  font-family: Geist;
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/assets/geist-latin-400-normal-B40WzpMT.woff2) format("woff2"),
    url(/assets/geist-latin-400-normal-akEymXtG.woff) format("woff");
}
@font-face {
  font-family: Geist;
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(/assets/geist-latin-500-normal-CTWBw9NS.woff2) format("woff2"),
    url(/assets/geist-latin-500-normal-BDXIbFrL.woff) format("woff");
}
@font-face {
  font-family: Geist;
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/assets/geist-latin-600-normal-CSETrqM2.woff2) format("woff2"),
    url(/assets/geist-latin-600-normal-DsPlZH-9.woff) format("woff");
}
@font-face {
  font-family: JetBrains Mono;
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(/assets/jetbrains-mono-latin-700-normal-BYuf6tUa.woff2)
      format("woff2"),
    url(/assets/jetbrains-mono-latin-700-normal-D3wTyLJW.woff) format("woff");
}
@font-face {
  font-family: JetBrains Mono;
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/assets/jetbrains-mono-latin-400-normal-V6pRDFza.woff2)
      format("woff2"),
    url(/assets/jetbrains-mono-latin-400-normal-6-qcROiO.woff) format("woff");
}
:root {
  font-family: Work Sans, Microsoft YaHei, Arial, sans-serif;
  color: #ebeff7;
  background: #070c17;
  font-synthesis: none;
  --paper: #ebeff7;
  --ice: #c2d7f5;
  --lavender: #a6a6da;
  --ink: #070c17;
  --muted: #929fb4;
  --line: rgba(195, 211, 239, 0.19);
}
html {
  scroll-behavior: smooth;
  scroll-padding-top: 28px;
}
body {
  margin: 0;
  min-width: 320px;
  -webkit-font-smoothing: antialiased;
}
a,
button {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
a {
  color: inherit;
  text-decoration: none;
}
button {
  font: inherit;
  color: inherit;
  cursor: pointer;
  border: 0;
}
button:focus-visible,
a:focus-visible {
  outline: 2px solid var(--ice);
  outline-offset: 6px;
}
img {
  max-width: 100%;
}
h1,
h2,
h3,
p,
figure {
  margin: 0;
}
h1,
h2 {
  font-family: Work Sans, Microsoft YaHei, serif;
  font-weight: 400;
}
h2 {
  white-space: pre-line;
}
.site {
  overflow: clip;
}
.skip-link {
  position: fixed;
  z-index: 1000;
  left: -10000px;
  top: 10px;
  background: var(--paper);
  color: var(--ink);
  padding: 14px;
}
.skip-link:focus {
  left: 10px;
}
.section-pad {
  padding: 110px 6.4%;
}
.section-label {
  font-size: 10px;
  line-height: 1.7;
  letter-spacing: 2px;
  font-weight: 600;
  color: var(--ice);
}
.section-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 60px;
  margin-bottom: 48px;
}
.section-heading h2 {
  font-size: clamp(35px, 4vw, 61px);
  line-height: 1.16;
  letter-spacing: -1px;
  margin-top: 23px;
}
.section-heading > p {
  font-size: 13px;
  line-height: 1.95;
  color: var(--muted);
  width: 290px;
  max-width: 32%;
  margin-bottom: 5px;
}
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 51px;
  padding: 0 26px;
  background: var(--ice);
  color: #0a1426;
  border: 1px solid var(--ice);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.4px;
  transition: background 0.25s, border-color 0.25s, color 0.25s;
}
.button:hover {
  background: #ecf3ff;
  border-color: #ecf3ff;
}
.button-outline {
  background: #0912226b;
  border-color: #cfe0ff6b;
  color: var(--paper);
}
.button-outline:hover {
  color: var(--ink);
}
.button-small {
  min-height: 41px;
  padding: 0 21px;
  font-size: 10px;
}
.icon-button {
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 1px solid var(--line);
  color: var(--paper);
  transition: background 0.2s;
}
.icon-button:hover {
  background: #26374e;
}
.inline-link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding-bottom: 7px;
  border-bottom: 1px solid #607391;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.7;
  color: var(--ice);
  transition: color 0.2s;
}
.micro-copy {
  font-size: 9px;
  letter-spacing: 1.1px;
  line-height: 1.8;
  color: var(--lavender);
}
.header {
  position: absolute;
  z-index: 30;
  top: 0;
  left: 0;
  right: 0;
  height: 100px;
  padding: 0 4.4%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgba(186, 210, 244, 0.15);
  background: #050b185c;
}
.brand {
  display: flex;
  align-items: center;
  gap: 10px;
}
.brand img {
  width: 43px;
  height: 43px;
  object-fit: cover;
  border-radius: 50%;
}
.brand > span {
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 1.3px;
}
.brand small {
  font-size: 10px;
  letter-spacing: 3px;
  display: inline-block;
  margin-left: 12px;
  font-weight: 400;
  color: var(--ice);
}
.desktop-nav {
  display: flex;
  align-items: center;
  gap: 32px;
  font-size: 11px;
  color: #bdc8da;
}
.desktop-nav a:hover {
  color: #fff;
}
.header-actions {
  display: flex;
  gap: 26px;
  align-items: center;
}
.language {
  min-height: 44px;
  background: transparent;
  font-size: 10px;
  letter-spacing: 1px;
  padding: 0 4px;
}
.menu-toggle,
.mobile-nav {
  display: none;
}
.hero {
  position: relative;
  min-height: 800px;
  height: calc(100svh - 90px);
  max-height: 1150px;
  background: #060c1b;
  isolation: isolate;
  overflow: hidden;
}
.hero-art {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 62% center;
  z-index: -3;
  will-change: transform;
}
.hero-shade {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -2;
  background: #03091621;
}
.hero-meta {
  position: absolute;
  left: 6.4%;
  right: 6.4%;
  top: 135px;
  display: flex;
  justify-content: space-between;
  font-size: 8px;
  letter-spacing: 2px;
  color: #9baecb;
}
.hero-copy {
  position: relative;
  padding-top: 200px;
  margin-left: 6.4%;
  width: 50%;
  max-width: 670px;
}
.hero-copy > .section-label {
  font-size: 9px;
  letter-spacing: 2px;
}
.hero h1 {
  font-size: clamp(65px, 6.1vw, 102px);
  line-height: 1.05;
  letter-spacing: -1.6px;
  margin-top: 24px;
  text-shadow: 0 3px 30px #030a18;
}
.hero h1 > span {
  color: #c4d8f8;
}
.hero-description {
  white-space: pre-line;
  font-size: 12px;
  line-height: 2.05;
  letter-spacing: 0.5px;
  color: #c5d0e2;
  margin-top: 24px;
  max-width: 410px;
}
.hero-ctas {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 27px;
}
.hero-telegram {
  font-size: 9px;
  letter-spacing: 1.2px;
  padding: 14px 12px;
  color: var(--ice);
}
.hero-telegram:hover {
  color: #fff;
}
.hero-footer {
  position: absolute;
  left: 6.4%;
  right: 6.4%;
  bottom: 24px;
  border-top: 1px solid rgba(184, 208, 246, 0.3);
  display: flex;
  align-items: center;
  gap: 22px;
  padding-top: 15px;
  font-size: 8px;
  letter-spacing: 1.8px;
  color: #c8d7ee;
}
.hero-footer > span:nth-child(2) {
  color: #a0b2d0;
}
.hero-footer .icon-button {
  margin-left: auto;
  width: 31px;
  height: 31px;
}
.token-strip {
  display: grid;
  grid-template-columns: 210px 1fr 240px;
  align-items: center;
  gap: 26px;
  padding: 23px 6.4%;
  background: #0d1628;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.token-identity {
  display: flex;
  align-items: center;
  gap: 13px;
}
.token-identity img {
  border-radius: 50%;
  width: 43px;
  height: 43px;
}
.token-identity strong {
  display: block;
  font-size: 13px;
  letter-spacing: 1px;
}
.token-identity span {
  display: block;
  font-size: 8px;
  color: var(--muted);
  letter-spacing: 1.7px;
  margin-top: 4px;
}
.contract-copy {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 6px 12px;
  padding: 0 25px;
  background: none;
  text-align: left;
  border-left: 1px solid var(--line);
  border-right: 1px solid var(--line);
  transition: color 0.2s;
}
.contract-copy:hover {
  color: var(--ice);
}
.contract-label {
  font-size: 8px;
  letter-spacing: 1.3px;
  color: #9aaac3;
  display: block;
  width: calc(100% - 30px);
}
.contract-copy code {
  font-family: Work Sans, sans-serif;
  font-size: 10px;
  letter-spacing: 0.3px;
  overflow-wrap: anywhere;
  max-width: calc(100% - 30px);
}
.contract-copy svg {
  margin-top: -12px;
  flex-shrink: 0;
}
.token-links {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 22px;
  font-size: 8px;
  letter-spacing: 1px;
  font-weight: 600;
}
.token-links a:hover {
  color: var(--ice);
}
.origin {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 15%;
  padding-top: 104px;
  padding-bottom: 100px;
}
.origin-title {
  font-size: clamp(32px, 3.6vw, 53px);
  line-height: 1.5;
  margin-top: 23px;
  letter-spacing: 1px;
}
.source-link {
  display: flex;
  align-items: center;
  gap: 20px;
  font-size: 11px;
  color: var(--ice);
  margin-top: 26px;
}
.source-link > span {
  font-size: 8px;
  letter-spacing: 1.1px;
  color: var(--muted);
  border-left: 1px solid var(--line);
  padding-left: 20px;
}
.origin-copy {
  padding-top: 24px;
}
.origin-copy > p {
  font-size: 14px;
  line-height: 2.1;
  color: #cbd5e5;
}
.origin-copy > p + p {
  font-size: 12px;
  color: var(--muted);
  margin-top: 20px;
}
.origin-facts {
  margin-top: 32px;
  border-top: 1px solid var(--line);
  padding-top: 23px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.origin-facts > span {
  font-size: 7px;
  color: #8f9eb6;
  letter-spacing: 1px;
}
.origin-facts b {
  display: block;
  font-family: Work Sans, serif;
  color: var(--paper);
  font-size: 26px;
  line-height: 1.5;
  font-weight: 400;
  margin-bottom: 7px;
  letter-spacing: 0;
}
.belief-strip {
  border-block: 1px solid var(--line);
  overflow: hidden;
  background: #0a1120;
  padding: 19px 0;
}
.belief-strip > div {
  display: flex;
  width: max-content;
  animation: belief 42s linear infinite;
}
.belief-strip > div > span {
  display: flex;
}
.belief-strip > div > span > span {
  display: flex;
  align-items: center;
  gap: 45px;
  margin-right: 45px;
  font-family: Work Sans, Microsoft YaHei, serif;
  font-size: 18px;
  letter-spacing: 3px;
  white-space: nowrap;
  color: #b8c9e3;
}
.belief-strip img {
  width: 27px;
  height: 27px;
  object-fit: contain;
  border-radius: 50%;
}
.world {
  padding-bottom: 45px;
  background: #080f1d;
}
.civilizations {
  position: relative;
  aspect-ratio: 1.96;
  background: #101a28;
  overflow: hidden;
}
.civilizations-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.civilization-dimmer {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 50%;
  background: #03081261;
  pointer-events: none;
  transition: left 0.7s, opacity 0.7s;
  left: 50%;
}
.side-1 .civilization-dimmer {
  left: 0;
}
.world-caption {
  position: absolute;
  top: 22px;
  left: 25px;
  right: 25px;
  display: flex;
  justify-content: space-between;
  font-size: 8px;
  letter-spacing: 1.7px;
  text-shadow: 0 1px 8px #000;
  color: #e7effc;
}
.civilization-tabs {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.civilization-tab {
  position: relative;
  text-align: left;
  display: flex;
  align-items: center;
  gap: 19px;
  padding: 25px 28px;
  background: #050c19d1;
  border-top: 2px solid transparent;
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  min-height: 116px;
  transition: background 0.3s, border-color 0.3s;
}
.civilization-tab + .civilization-tab {
  border-left: 1px solid var(--line);
}
.civilization-tab[aria-selected="true"] {
  background: #13243de6;
  border-top-color: var(--ice);
}
.civilization-tab:hover {
  background: #1b2d45f2;
}
.side-number {
  font-size: 9px;
  align-self: flex-start;
  color: #8fa5c5;
  padding-top: 4px;
}
.civilization-tab strong {
  display: block;
  font-family: Work Sans, serif;
  font-size: 27px;
  font-weight: 400;
  letter-spacing: 1px;
}
.civilization-tab small {
  display: block;
  margin-top: 10px;
  font-size: 9px;
  letter-spacing: 1.5px;
  color: #a1b3ce;
}
.choice-indicator {
  margin-left: auto;
  width: 33px;
  height: 33px;
  display: grid;
  place-items: center;
  border: 1px solid #68809e;
  flex-shrink: 0;
  color: var(--ice);
}
.civilization-panel {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10%;
  padding: 36px 0 20px;
  border-bottom: 1px solid var(--line);
}
.signal-label {
  font-size: 8px;
  letter-spacing: 1.6px;
  color: var(--ice);
}
.civilization-panel h3 {
  font-size: 26px;
  font-weight: 400;
  margin-top: 13px;
  letter-spacing: 0.5px;
}
.civilization-panel p {
  font-size: 12px;
  line-height: 2;
  color: #aebcd1;
}
.civilization-panel .micro-copy {
  display: block;
  margin-top: 13px;
}
.lore {
  padding-top: 75px;
  background: #080f1d;
}
.lore-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 27px;
}
.lore-image {
  display: block;
  position: relative;
  overflow: hidden;
}
.lore-image img {
  display: block;
  width: 100%;
  aspect-ratio: 1.48;
  object-fit: cover;
  transition: transform 0.7s;
}
.lore-image:hover img {
  transform: scale(1.045);
}
.lore-image > span {
  position: absolute;
  bottom: 15px;
  left: 15px;
  font-size: 8px;
  letter-spacing: 1.5px;
  padding: 7px 10px;
  background: #040b17d4;
}
.lore-card-heading {
  padding-top: 21px;
  border-top: 1px solid var(--line);
  margin-top: 19px;
}
.lore-card h3 {
  font-family: Work Sans, serif;
  font-size: 21px;
  font-weight: 400;
  letter-spacing: 0.2px;
}
.lore-card-heading > span {
  display: block;
  color: var(--ice);
  font-size: 8px;
  letter-spacing: 1.2px;
  margin-top: 8px;
  line-height: 1.7;
}
.lore-card > p {
  font-size: 11px;
  line-height: 2;
  color: #95a5be;
  margin: 18px 0 20px;
  min-height: 67px;
}
.lore-card .inline-link {
  font-size: 9px;
}
.chapters {
  background: #0c1423;
  border-block: 1px solid var(--line);
}
.chapters .section-heading h2 {
  font-size: clamp(34px, 3.7vw, 56px);
}
.chapter-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6%;
}
.featured-chapter {
  background: #101d32;
  border: 1px solid var(--line);
}
.dispatch-image {
  position: relative;
  overflow: hidden;
  height: 270px;
  background: #091022;
}
.dispatch-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 40%;
  opacity: 0.72;
}
.dispatch-image > span {
  position: absolute;
  bottom: 24px;
  left: 28px;
  font-size: 8px;
  line-height: 1.8;
  letter-spacing: 2px;
  color: #d3e1f8;
}
.dispatch-copy {
  padding: 28px;
}
.dispatch-copy .section-label {
  font-size: 8px;
  letter-spacing: 1.5px;
}
.dispatch-copy h3 {
  font-size: 23px;
  font-weight: 400;
  line-height: 1.5;
  margin-top: 15px;
}
.dispatch-copy > p {
  font-size: 11px;
  line-height: 1.9;
  color: #9eafca;
  margin: 15px 0 22px;
  max-width: 360px;
}
.chapter-list {
  display: flex;
  flex-direction: column;
}
.chapter-item {
  padding: 26px 0;
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: flex-start;
  gap: 22px;
}
.chapter-item:first-child {
  padding-top: 0;
}
.chapter-number {
  font-family: Work Sans, serif;
  font-size: 27px;
  color: #667b9b;
  min-width: 34px;
  line-height: 1.2;
}
.chapter-item .section-label {
  font-size: 7px;
  letter-spacing: 1.2px;
  color: #8fa7cc;
}
.chapter-item h3 {
  font-size: 19px;
  font-weight: 400;
  line-height: 1.6;
  margin-top: 10px;
}
.chapter-item p {
  font-size: 11px;
  line-height: 1.9;
  color: #93a5c1;
  margin: 9px 0 13px;
}
.chapter-item .inline-link {
  font-size: 8px;
  padding-bottom: 4px;
}
.secondary-source {
  font-size: 8px;
  letter-spacing: 1px;
  margin-left: 18px;
  color: #aebed5;
}
.chapter-item:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.media {
  padding-bottom: 100px;
}
.media-grid {
  display: grid;
  grid-template-columns: 0.85fr 1.15fr 1fr;
  gap: 24px;
}
.media-tile {
  padding: 0;
  background: transparent;
  text-align: left;
  min-width: 0;
}
.media-image {
  position: relative;
  overflow: hidden;
  height: 290px;
  background: #0b1626;
}
.media-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.7s;
}
.media-tile-1 img {
  object-position: 68% center;
}
.media-tile:hover img {
  transform: scale(1.055);
}
.media-open {
  position: absolute;
  top: 14px;
  right: 14px;
  background: #061021bd;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(197, 217, 248, 0.3);
  transition: background 0.3s;
}
.media-tile:hover .media-open {
  background: #2b4266;
}
.media-tile-label {
  display: block;
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
}
.media-tile-label strong {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.6px;
  line-height: 1.7;
}
.media-tile-label > span {
  display: block;
  font-size: 9px;
  color: var(--muted);
  margin-top: 6px;
}
.community {
  position: relative;
  min-height: 660px;
  padding: 90px 8%;
  isolation: isolate;
  overflow: hidden;
  background: #040b17;
}
.community-art {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -3;
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
  opacity: 0.59;
}
.community-shade {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -2;
  background: #0208144d;
}
.community-content {
  max-width: 600px;
}
.community h2 {
  font-size: clamp(44px, 5.3vw, 80px);
  line-height: 1.1;
  margin-top: 28px;
  letter-spacing: -1px;
}
.community h2 > span {
  color: var(--ice);
}
.community p:not(.section-label) {
  font-size: 12px;
  white-space: pre-line;
  line-height: 1.9;
  margin-top: 24px;
  color: #bbcae1;
}
.community-ctas {
  display: flex;
  gap: 12px;
  margin-top: 27px;
}
.community-signature {
  position: absolute;
  right: 6.4%;
  bottom: 31px;
  font-size: 8px;
  letter-spacing: 2px;
  color: #b7cbe9;
}
.footer {
  padding: 38px 6.4% 28px;
  border-top: 1px solid var(--line);
  background: #050a13;
}
.footer-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  padding-bottom: 35px;
  border-bottom: 1px solid var(--line);
}
.footer-wordmark {
  font-family: Work Sans, serif;
  font-size: 45px;
  line-height: 1.1;
  letter-spacing: 2px;
}
.footer-wordmark > span {
  font-family: Microsoft YaHei, sans-serif;
  vertical-align: middle;
  font-size: 12px;
  letter-spacing: 5px;
  margin-left: 20px;
  color: #a4b6d2;
}
.footer-top > div {
  display: flex;
  gap: 25px;
  font-size: 9px;
  letter-spacing: 1px;
  color: #a7b8d3;
}
.footer-top > div a:hover {
  color: #fff;
}
.footer-bottom {
  display: grid;
  grid-template-columns: 1.3fr 1fr auto;
  gap: 35px;
  padding-top: 24px;
  align-items: start;
  color: #7f91ad;
  font-size: 8px;
  line-height: 1.9;
}
.footer-bottom > span {
  font-size: 7px;
  letter-spacing: 0.4px;
}
.media-dialog {
  padding: 0;
  border: 1px solid #4b6284;
  background: #0a1425;
  color: var(--paper);
  width: min(1100px, calc(100% - 48px));
  max-height: calc(100svh - 48px);
}
.media-dialog::backdrop {
  background: #010610e6;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
.media-dialog-inner {
  position: relative;
}
.dialog-close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  background: #091327;
}
.media-dialog-inner > img {
  display: block;
  width: 100%;
  max-height: 70svh;
  object-fit: contain;
  background: #040b18;
}
.media-dialog-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  padding: 25px 30px;
}
.media-dialog-bottom h2 {
  font-size: 19px;
  line-height: 1.5;
}
.media-dialog-bottom p {
  font-size: 10px;
  line-height: 1.9;
  color: var(--muted);
  margin-top: 6px;
}
.media-dialog-bottom .button {
  flex-shrink: 0;
  min-height: 44px;
  font-size: 10px;
}
.toast {
  position: fixed;
  z-index: 100;
  left: 50%;
  bottom: 28px;
  display: flex;
  gap: 9px;
  align-items: center;
  transform: translate(-50%, 15px);
  background: #d2e2fa;
  color: #111d31;
  border: 1px solid #c1d4f0;
  padding: 14px 22px;
  font-size: 11px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s, transform 0.2s;
}
.toast.visible {
  opacity: 1;
  transform: translate(-50%);
}
.toast:not(.visible) svg {
  display: none;
}
.motion-paused .belief-strip > div {
  animation-play-state: paused;
}
.hero-picture {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -3;
  display: block;
}
.lore-card > p,
.dispatch-copy > p,
.chapter-item p {
  font-size: 12px;
}
.chapter-item .section-label {
  font-size: 8px;
}
.chapter-item .inline-link {
  font-size: 10px;
}
.hero-telegram {
  font-size: 10px;
  text-shadow: 0 1px 8px #020713;
}
.hero-footer .icon-button {
  width: 44px;
  height: 44px;
}
.hero-footer {
  bottom: 20px;
}
@keyframes belief {
  to {
    transform: translate(-50%);
  }
}
@media (min-width: 1700px) {
  .section-pad {
    padding-left: 10%;
    padding-right: 10%;
  }
  .hero-copy {
    margin-left: 10%;
    padding-top: 240px;
  }
  .hero {
    min-height: 980px;
  }
  .hero h1 {
    font-size: 108px;
  }
  .hero-meta,
  .hero-footer {
    left: 10%;
    right: 10%;
  }
  .hero-description {
    font-size: 14px;
  }
  .header {
    padding-inline: 5%;
  }
  .desktop-nav {
    gap: 45px;
  }
  .token-strip {
    padding-inline: 10%;
  }
  .civilizations {
    aspect-ratio: 2.1;
  }
  .media-image {
    height: 350px;
  }
}
@media (max-width: 1150px) {
  .header {
    padding-inline: 4%;
    height: 90px;
  }
  .brand > span {
    font-size: 15px;
  }
  .brand small {
    display: none;
  }
  .desktop-nav {
    gap: 22px;
  }
  .header-actions {
    gap: 17px;
  }
  .hero {
    min-height: 810px;
  }
  .hero-copy {
    width: 58%;
    padding-top: 200px;
  }
  .hero h1 {
    font-size: 78px;
  }
  .hero-ctas .button {
    padding-inline: 20px;
    font-size: 10px;
  }
  .hero-telegram {
    padding-inline: 8px;
    font-size: 8px;
  }
  .hero-meta {
    top: 127px;
  }
  .token-strip {
    grid-template-columns: 165px 1fr;
    gap: 20px;
  }
  .token-links {
    grid-column: 2;
    justify-content: flex-start;
    padding-left: 25px;
  }
  .token-identity {
    grid-row: 1/3;
  }
  .contract-copy {
    border-right: 0;
  }
  .section-pad {
    padding: 90px 6%;
  }
  .origin {
    gap: 10%;
  }
  .section-heading h2 {
    font-size: 45px;
  }
  .civilization-tab {
    padding: 21px;
    gap: 14px;
  }
  .civilization-tab strong {
    font-size: 23px;
  }
  .civilization-tab small {
    font-size: 8px;
    letter-spacing: 0.9px;
  }
  .lore-card h3 {
    font-size: 18px;
  }
  .lore-grid {
    gap: 22px;
  }
  .media-grid {
    gap: 20px;
  }
  .media-image {
    height: 250px;
  }
  .footer-wordmark {
    font-size: 35px;
  }
  .footer-bottom {
    grid-template-columns: 1.2fr 1fr;
    gap: 20px;
  }
  .footer-bottom > span:last-child {
    grid-column: 1/-1;
  }
}
@media (max-width: 850px) {
  .desktop-nav {
    display: none;
  }
  .menu-toggle {
    display: flex;
  }
  .header {
    height: 84px;
  }
  .header-actions {
    gap: 20px;
  }
  .hero {
    min-height: 810px;
    height: 900px;
  }
  .hero-art {
    object-position: 60% center;
  }
  .hero-shade {
    background: #03091645;
  }
  .hero-copy {
    padding-top: 205px;
    max-width: 540px;
    width: 75%;
  }
  .hero h1 {
    font-size: 78px;
  }
  .hero-description {
    font-size: 12px;
  }
  .hero-meta {
    top: 119px;
  }
  .section-pad {
    padding: 75px 6%;
  }
  .section-heading {
    gap: 35px;
  }
  .section-heading h2 {
    font-size: 37px;
  }
  .section-heading > p {
    font-size: 11px;
  }
  .origin {
    gap: 8%;
  }
  .origin-title {
    font-size: 35px;
  }
  .origin-copy > p {
    font-size: 12px;
  }
  .origin-copy > p + p {
    font-size: 11px;
  }
  .origin-facts {
    gap: 12px;
  }
  .origin-facts b {
    font-size: 23px;
  }
  .origin-facts > span {
    font-size: 6px;
  }
  .source-link {
    flex-wrap: wrap;
    gap: 12px;
  }
  .source-link > span {
    border: 0;
    padding: 0;
    width: 100%;
    font-size: 7px;
  }
  .civilizations {
    aspect-ratio: 1.43;
  }
  .civilization-tab {
    min-height: 100px;
    padding: 18px 15px;
    gap: 10px;
  }
  .civilization-tab strong {
    font-size: 20px;
  }
  .civilization-tab small {
    font-size: 7px;
  }
  .choice-indicator {
    width: 27px;
    height: 27px;
  }
  .choice-indicator svg {
    width: 17px;
  }
  .civilization-panel {
    gap: 7%;
    padding-top: 29px;
  }
  .civilization-panel h3 {
    font-size: 22px;
  }
  .civilization-panel p {
    font-size: 11px;
  }
  .lore-grid {
    gap: 18px;
  }
  .lore-card h3 {
    font-size: 16px;
  }
  .lore-card > p {
    font-size: 10px;
    min-height: 95px;
  }
  .lore-card-heading > span {
    font-size: 7px;
  }
  .lore-image > span {
    font-size: 6px;
    bottom: 10px;
    left: 10px;
  }
  .chapter-layout {
    gap: 5%;
  }
  .dispatch-image {
    height: 235px;
  }
  .dispatch-copy {
    padding: 23px;
  }
  .dispatch-copy h3 {
    font-size: 20px;
  }
  .chapter-item {
    gap: 13px;
    padding-block: 22px;
  }
  .chapter-item h3 {
    font-size: 17px;
  }
  .chapter-item p {
    font-size: 10px;
  }
  .chapter-number {
    font-size: 22px;
    min-width: 28px;
  }
  .chapter-item .section-label {
    font-size: 6px;
  }
  .media-grid {
    grid-template-columns: 1fr 1fr;
    gap: 22px;
  }
  .media-tile-1 {
    grid-column: 2;
    grid-row: 1/3;
  }
  .media-tile-1 .media-image {
    height: 540px;
  }
  .media-image {
    height: 210px;
  }
  .media-tile-label strong {
    font-size: 9px;
  }
  .media-tile-label > span {
    font-size: 8px;
  }
  .community {
    padding: 80px 6%;
    min-height: 635px;
  }
  .community h2 {
    font-size: 65px;
  }
  .community-art {
    object-position: 58% center;
    opacity: 0.45;
  }
  .mobile-nav {
    position: absolute;
    z-index: 25;
    top: 84px;
    left: 0;
    right: 0;
    display: flex;
    flex-direction: column;
    background: #081223fa;
    padding: 12px 6% 23px;
    border-bottom: 1px solid #415675;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
  }
  .mobile-nav > a {
    display: block;
    padding: 18px 0;
    border-bottom: 1px solid var(--line);
    font-size: 14px;
  }
  .mobile-nav > a:last-child {
    color: var(--ice);
  }
}
@media (max-width: 600px) {
  html {
    scroll-padding-top: 20px;
  }
  .header {
    height: 78px;
    padding-inline: 21px;
  }
  .brand {
    gap: 8px;
  }
  .brand img {
    width: 36px;
    height: 36px;
  }
  .brand > span {
    font-size: 13px;
    letter-spacing: 0.8px;
  }
  .header-actions {
    gap: 10px;
  }
  .header-actions > .button {
    display: none;
  }
  .language {
    font-size: 9px;
    min-width: 44px;
    padding: 0;
  }
  .menu-toggle {
    width: 38px;
    border: 0;
  }
  .mobile-nav {
    top: 78px;
    padding-inline: 7%;
  }
  .hero {
    height: 850px;
    min-height: 850px;
  }
  .hero-art {
    object-position: 65% center;
    opacity: 0.75;
  }
  .hero-shade {
    background: #0309164d;
  }
  .hero-meta {
    top: 108px;
    left: 7%;
    right: 7%;
    font-size: 6px;
    letter-spacing: 1.2px;
  }
  .hero-meta > span:last-child {
    display: none;
  }
  .hero-copy {
    padding-top: 173px;
    margin-left: 7%;
    width: 86%;
    max-width: none;
  }
  .hero-copy > .section-label {
    font-size: 7px;
    letter-spacing: 1.2px;
  }
  .hero h1 {
    font-size: clamp(52px, 13.8vw, 78px);
    line-height: 1.12;
    letter-spacing: -1.4px;
    margin-top: 25px;
  }
  .hero-description {
    font-size: 11px;
    margin-top: 27px;
    line-height: 2;
    max-width: 280px;
  }
  .hero-ctas {
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 25px;
  }
  .hero-ctas .button {
    min-height: 47px;
    padding-inline: 18px;
    font-size: 9px;
  }
  .hero-telegram {
    padding: 13px 7px;
    font-size: 7px;
    letter-spacing: 0.8px;
  }
  .hero-footer {
    left: 7%;
    right: 7%;
    bottom: 22px;
    gap: 12px;
    font-size: 6px;
    letter-spacing: 1px;
    line-height: 1.7;
  }
  .hero-footer > span {
    max-width: 110px;
  }
  .hero-footer .icon-button {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
  }
  .token-strip {
    display: flex;
    flex-wrap: wrap;
    padding: 22px 7%;
    gap: 22px;
    background: #101c30;
  }
  .token-identity {
    width: 100%;
    gap: 11px;
  }
  .token-identity img {
    width: 38px;
    height: 38px;
  }
  .token-identity strong {
    font-size: 12px;
  }
  .token-identity span {
    font-size: 7px;
  }
  .contract-copy {
    width: 100%;
    border: 0;
    padding: 0;
    gap: 9px 12px;
  }
  .contract-label {
    font-size: 7px;
    letter-spacing: 1.1px;
  }
  .contract-copy code {
    font-size: 9px;
    letter-spacing: 0;
    max-width: calc(100% - 25px);
  }
  .contract-copy svg {
    width: 16px;
  }
  .token-links {
    padding: 0;
    gap: 26px;
    font-size: 8px;
    justify-content: flex-start;
  }
  .section-pad {
    padding: 65px 7%;
  }
  .section-label {
    font-size: 8px;
    letter-spacing: 1.4px;
  }
  .origin {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .origin-title {
    font-size: 35px;
    margin-top: 20px;
    line-height: 1.5;
  }
  .origin-copy {
    padding-top: 0;
  }
  .origin-copy > p {
    font-size: 13px;
    line-height: 2.05;
  }
  .origin-copy > p + p {
    font-size: 11px;
    margin-top: 17px;
  }
  .source-link {
    flex-wrap: nowrap;
    gap: 15px;
    font-size: 10px;
    margin-top: 22px;
  }
  .source-link > span {
    width: auto;
    border-left: 1px solid var(--line);
    padding-left: 15px;
    font-size: 6px;
  }
  .origin-facts {
    margin-top: 27px;
    padding-top: 20px;
  }
  .origin-facts b {
    font-size: 26px;
  }
  .origin-facts > span {
    font-size: 6px;
    letter-spacing: 0.7px;
  }
  .belief-strip {
    padding: 17px 0;
  }
  .belief-strip > div > span > span {
    font-size: 15px;
    letter-spacing: 2px;
    gap: 28px;
    margin-right: 28px;
  }
  .belief-strip img {
    width: 23px;
    height: 23px;
  }
  .section-heading {
    display: block;
    margin-bottom: 30px;
  }
  .section-heading h2 {
    font-size: clamp(29px, 7.6vw, 43px);
    line-height: 1.25;
    letter-spacing: -0.7px;
    margin-top: 20px;
  }
  .section-heading > p {
    width: auto;
    max-width: 300px;
    font-size: 11px;
    line-height: 1.9;
    margin-top: 20px;
  }
  .world {
    padding-bottom: 20px;
  }
  .civilizations {
    aspect-ratio: auto;
    height: 490px;
    margin-inline: -8.15%;
    width: auto;
  }
  .civilizations-image {
    object-position: center;
  }
  .world-caption {
    top: 17px;
    left: 7%;
    right: 7%;
    font-size: 7px;
  }
  .civilization-tabs {
    grid-template-columns: 1fr 1fr;
  }
  .civilization-tab {
    min-height: 110px;
    padding: 16px 13px;
    gap: 0;
    display: block;
  }
  .side-number {
    font-size: 7px;
    display: block;
    padding: 0;
    margin-bottom: 6px;
  }
  .civilization-tab strong {
    font-size: 15px;
    letter-spacing: 0;
  }
  .civilization-tab small {
    font-size: 6px;
    line-height: 1.7;
    letter-spacing: 0.2px;
    margin-top: 7px;
  }
  .choice-indicator {
    position: absolute;
    right: 13px;
    top: 14px;
    width: 20px;
    height: 20px;
    border-color: #728aaa;
  }
  .choice-indicator svg {
    width: 12px;
    height: 12px;
  }
  .civilization-panel {
    grid-template-columns: 1fr;
    gap: 20px;
    padding-top: 27px;
    padding-bottom: 24px;
  }
  .civilization-panel h3 {
    font-size: 25px;
    line-height: 1.5;
    margin-top: 10px;
  }
  .civilization-panel p {
    font-size: 11px;
    line-height: 2;
  }
  .signal-label {
    font-size: 7px;
  }
  .civilization-panel .micro-copy {
    font-size: 7px;
    letter-spacing: 0.9px;
    margin-top: 14px;
  }
  .lore {
    padding-top: 45px;
  }
  .lore-grid {
    grid-template-columns: 1fr;
    gap: 38px;
  }
  .lore-image img {
    aspect-ratio: 1.65;
  }
  .lore-image > span {
    font-size: 7px;
    padding: 7px 10px;
    bottom: 13px;
    left: 13px;
  }
  .lore-card-heading {
    margin-top: 17px;
    padding-top: 17px;
  }
  .lore-card h3 {
    font-size: 23px;
  }
  .lore-card-heading > span {
    font-size: 8px;
    letter-spacing: 1.1px;
  }
  .lore-card > p {
    font-size: 11px;
    min-height: 0;
    line-height: 2;
    margin: 15px 0 17px;
  }
  .lore-card .inline-link {
    font-size: 9px;
  }
  .chapters .section-heading h2 {
    font-size: 29px;
  }
  .chapter-layout {
    grid-template-columns: 1fr;
    gap: 33px;
  }
  .dispatch-image {
    height: 250px;
  }
  .dispatch-image img {
    object-position: center 43%;
  }
  .dispatch-image > span {
    font-size: 7px;
    left: 23px;
    bottom: 20px;
  }
  .dispatch-copy {
    padding: 25px 22px;
  }
  .dispatch-copy h3 {
    font-size: 21px;
  }
  .dispatch-copy > p {
    font-size: 11px;
    margin-bottom: 19px;
  }
  .dispatch-copy .section-label {
    font-size: 7px;
  }
  .chapter-item {
    padding-block: 26px;
    gap: 18px;
  }
  .chapter-item h3 {
    font-size: 18px;
    margin-top: 9px;
  }
  .chapter-item .section-label {
    font-size: 6px;
    letter-spacing: 1px;
  }
  .chapter-item p {
    font-size: 10px;
  }
  .chapter-number {
    font-size: 25px;
    min-width: 30px;
  }
  .chapter-item .inline-link,
  .secondary-source {
    font-size: 8px;
  }
  .media-grid {
    gap: 25px;
    grid-template-columns: 1fr;
  }
  .media-tile-1 {
    grid-column: auto;
    grid-row: auto;
  }
  .media-image,
  .media-tile-1 .media-image {
    height: 220px;
  }
  .media-tile-0 .media-image {
    height: 310px;
  }
  .media-tile-0 img {
    object-position: center 48%;
  }
  .media-tile-1 img {
    object-position: center;
  }
  .media-tile-label {
    padding: 16px 0;
  }
  .media-tile-label strong {
    font-size: 10px;
  }
  .media-tile-label > span {
    font-size: 9px;
  }
  .media-open {
    width: 33px;
    height: 33px;
    top: 12px;
    right: 12px;
  }
  .community {
    padding: 65px 7% 95px;
    min-height: 620px;
  }
  .community h2 {
    font-size: clamp(40px, 11.3vw, 64px);
    line-height: 1.15;
    margin-top: 29px;
    letter-spacing: -1px;
  }
  .community p:not(.section-label) {
    font-size: 11px;
    line-height: 2;
    margin-top: 25px;
  }
  .community-art {
    object-position: 64% center;
    opacity: 0.4;
  }
  .community-ctas {
    gap: 9px;
    margin-top: 26px;
  }
  .community-ctas .button {
    min-height: 47px;
    font-size: 9px;
    padding-inline: 19px;
  }
  .community-signature {
    bottom: 29px;
    right: 7%;
    left: 7%;
    font-size: 7px;
    letter-spacing: 1.4px;
    border-top: 1px solid var(--line);
    padding-top: 19px;
  }
  .footer {
    padding: 32px 7% 26px;
  }
  .footer-top {
    align-items: flex-start;
    flex-direction: column;
    gap: 25px;
    padding-bottom: 28px;
  }
  .footer-wordmark {
    font-size: 31px;
    letter-spacing: 1px;
  }
  .footer-wordmark > span {
    font-size: 9px;
    margin-left: 12px;
    letter-spacing: 3px;
  }
  .footer-top > div {
    font-size: 8px;
    gap: 25px;
    line-height: 1.8;
    flex-wrap: wrap;
  }
  .footer-bottom {
    grid-template-columns: 1fr;
    gap: 15px;
    padding-top: 25px;
    font-size: 8px;
    line-height: 1.9;
  }
  .footer-bottom > span {
    font-size: 7px;
  }
  .footer-bottom > span:last-child {
    grid-column: auto;
  }
  .media-dialog {
    width: calc(100% - 24px);
    max-height: calc(100svh - 30px);
  }
  .dialog-close {
    width: 38px;
    height: 38px;
    top: 8px;
    right: 8px;
  }
  .media-dialog-bottom {
    padding: 22px;
    display: block;
  }
  .media-dialog-bottom h2 {
    font-size: 16px;
    line-height: 1.7;
    max-width: 260px;
  }
  .media-dialog-bottom p {
    font-size: 9px;
  }
  .media-dialog-bottom .button {
    margin-top: 20px;
    font-size: 10px;
  }
  .toast {
    bottom: 20px;
    max-width: 90%;
    font-size: 10px;
    white-space: nowrap;
    padding: 14px 18px;
  }
}
@media (max-width: 360px) {
  .header {
    padding-inline: 15px;
  }
  .brand > span {
    font-size: 12px;
  }
  .header-actions {
    gap: 5px;
  }
  .hero {
    height: 820px;
    min-height: 820px;
  }
  .hero h1 {
    font-size: 48px;
  }
  .hero-copy > .section-label {
    font-size: 6px;
  }
  .hero-ctas .button {
    padding-inline: 13px;
    font-size: 8px;
  }
  .hero-telegram {
    padding-inline: 5px;
    font-size: 6px;
  }
  .section-heading h2,
  .chapters .section-heading h2 {
    font-size: 26px;
  }
  .civilization-tab strong {
    font-size: 13px;
  }
  .source-link > span {
    font-size: 5px;
  }
  .origin-title {
    font-size: 31px;
  }
  .footer-wordmark {
    font-size: 27px;
  }
  .community h2 {
    font-size: 37px;
  }
}
@media (max-width: 600px) {
  .hero-telegram {
    font-size: 8px;
  }
  .hero-description {
    font-size: 12px;
  }
  .menu-toggle {
    width: 44px;
  }
  .hero-footer .icon-button {
    width: 44px;
    height: 44px;
  }
  .civilizations {
    height: auto;
  }
  .civilizations-image {
    height: 260px;
    object-fit: cover;
  }
  .civilization-tabs {
    position: relative;
    bottom: auto;
  }
  .civilization-dimmer {
    bottom: 110px;
  }
  .civilization-tab small {
    font-size: 8px;
    letter-spacing: 0;
    line-height: 1.8;
  }
  .civilization-panel p,
  .lore-card > p,
  .dispatch-copy > p,
  .chapter-item p {
    font-size: 12px;
  }
  .chapter-item .section-label {
    font-size: 7px;
  }
  .chapter-item .inline-link,
  .secondary-source {
    font-size: 10px;
  }
  .footer-bottom {
    font-size: 9px;
  }
  .media-tile-label > span {
    font-size: 10px;
  }
  .hero-ctas .button {
    font-size: 10px;
  }
}
@media (max-width: 600px) {
  .hero-art {
    object-position: center;
    opacity: 1;
  }
  .hero-shade {
    background: #03091612;
  }
}
@media (max-width: 360px) {
  .hero-ctas .button {
    font-size: 9px;
  }
  .hero-telegram,
  .civilization-tab small {
    font-size: 7px;
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *,
  *:before,
  *:after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .hero-art {
    transform: none !important;
  }
}
:root {
  font-family: Work Sans, system-ui, Microsoft YaHei, sans-serif;
  --paper: #f3f2ee;
  --ice: #d8e4ef;
  --lavender: #bdc6d0;
  --ink: #101010;
  --muted: #a4a4a4;
  --line: rgba(255, 255, 255, 0.16);
  background: var(--ink);
  color: var(--paper);
}
body {
  background: var(--ink);
}
.site h1,
.site h2,
.site h3,
.site .origin-title,
.site .origin-facts b,
.site .belief-strip > div > span > span,
.site .civilization-tab strong,
.site .chapter-number,
.site .footer-wordmark {
  font-family: Work Sans, system-ui, Microsoft YaHei, sans-serif;
  font-weight: 900;
}
.section-label,
.micro-copy,
.hero-meta,
.hero-footer,
.contract-label,
.token-links,
.origin-facts > span,
.source-link > span,
.world-caption,
.signal-label,
.lore-image > span,
.lore-card-heading > span,
.media-tile-label > span,
.community-signature,
.footer-bottom {
  font-family: JetBrains Mono, Work Sans, Microsoft YaHei, monospace;
}
.section-label {
  font-size: 11px;
  letter-spacing: 1.3px;
  color: #bfcbd7;
}
.section-heading h2 {
  font-size: clamp(40px, 5.25vw, 76px);
  line-height: 0.99;
  letter-spacing: -0.055em;
}
.section-heading > p {
  font-size: 15px;
  line-height: 1.8;
  color: #a7a7a7;
  font-weight: 600;
}
.section-pad {
  padding-top: 110px;
  padding-bottom: 110px;
}
.button {
  border-radius: 100px;
  min-height: 49px;
  padding-inline: 28px;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0;
  background: #f1f1ef;
  border-color: #f1f1ef;
  color: #111;
}
.button:hover {
  background: #d8e4ef;
  border-color: #d8e4ef;
}
.button-outline {
  color: #f3f2ee;
  background: #141414a6;
  border-color: #666;
}
.button-outline:hover {
  color: #111;
}
.button-small {
  min-height: 43px;
  font-size: 12px;
  padding-inline: 25px;
}
.icon-button {
  border-radius: 50%;
  border-color: #555;
}
.icon-button:hover {
  background: #353535;
}
.inline-link {
  font-size: 12px;
  font-weight: 800;
  color: #dedede;
  border-bottom-color: #666;
}
.inline-link:hover {
  color: #fff;
}
.header {
  top: 16px;
  left: 4%;
  right: 4%;
  height: 70px;
  padding: 0 16px 0 12px;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 100px;
  background: #111111d1;
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
}
.brand {
  gap: 10px;
}
.brand img {
  width: 43px;
  height: 43px;
}
.brand > span {
  font-size: 19px;
  letter-spacing: -0.6px;
  font-weight: 900;
}
.brand small {
  font-size: 10px;
  letter-spacing: 2px;
  color: #aaa;
}
.desktop-nav {
  font-size: 13px;
  font-weight: 700;
  gap: 30px;
  color: #d6d6d6;
}
.header-actions {
  gap: 25px;
}
.language {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.3px;
}
.hero {
  height: 100svh;
  min-height: 820px;
  max-height: 1300px;
  background: #111;
}
.hero-art {
  filter: brightness(0.61) contrast(1.08);
  opacity: 1;
  object-position: 61% 51%;
}
.hero-shade {
  background: #00000014;
}
.hero-meta {
  display: none;
}
.hero-copy {
  padding-top: 29svh;
  margin-left: 14%;
  width: 58%;
  max-width: 850px;
}
.hero-copy > .section-label {
  font-family: Work Sans, system-ui, sans-serif;
  font-size: 12px;
  font-weight: 900;
  color: #d7e5f5;
  letter-spacing: 1.4px;
}
.hero h1 {
  font-size: clamp(48px, 4.1vw, 84px);
  line-height: 1;
  letter-spacing: -0.055em;
  margin-top: 21px;
  text-shadow: none;
}
.hero h1 > span {
  color: var(--paper);
  display: block;
}
.hero-description {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.75;
  letter-spacing: 0;
  color: #d3d3d3;
  margin-top: 22px;
  max-width: 490px;
}
.hero-ctas {
  gap: 12px;
  margin-top: 27px;
}
.hero-telegram {
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.2px;
  color: #eee;
  text-shadow: none;
  padding: 14px 9px;
}
.hero-footer {
  bottom: calc(13.7vw + 25px);
  border: 0;
  padding: 0;
  font-size: 9px;
  letter-spacing: 1px;
  left: 6%;
  right: 6%;
  color: #bbb;
}
.hero-footer .icon-button {
  width: 44px;
  height: 44px;
  border-color: #888;
}
.hero-wordmark-wrap {
  position: absolute;
  bottom: -0.9vw;
  left: 0;
  right: 0;
  overflow: hidden;
  pointer-events: none;
}
.hero-wordmark {
  font-family: Work Sans, system-ui, sans-serif;
  font-size: 17.2vw;
  line-height: 0.85;
  font-weight: 900;
  letter-spacing: -0.9vw;
  color: #dfdfdc;
  text-align: center;
  white-space: nowrap;
  transform-origin: bottom center;
}
.token-strip {
  background: #171717;
  padding-block: 25px;
  border-top: 0;
}
.token-identity strong {
  font-size: 15px;
  font-weight: 900;
  letter-spacing: 0;
}
.token-identity span {
  color: #999;
  font-size: 9px;
}
.contract-label {
  font-size: 8px;
  color: #8d8d8d;
  letter-spacing: 0.7px;
}
.contract-copy code {
  font-family: Work Sans, sans-serif;
  font-size: 12px;
  letter-spacing: 0.1px;
  font-weight: 700;
}
.token-links {
  font-size: 9px;
  letter-spacing: 0.3px;
  font-weight: 700;
}
.origin {
  column-gap: 12%;
}
.origin-title {
  font-size: clamp(42px, 5vw, 72px);
  line-height: 1.09;
  letter-spacing: -0.05em;
  margin-top: 28px;
}
.source-link {
  font-size: 13px;
  font-weight: 800;
  color: #e2e2e2;
  gap: 20px;
  margin-top: 30px;
}
.source-link > span {
  color: #777;
  font-size: 7px;
  letter-spacing: 0.3px;
}
.origin-copy > p {
  font-size: 21px;
  line-height: 1.65;
  font-weight: 800;
  color: #e1e1df;
  letter-spacing: -0.4px;
}
.origin-copy > p + p {
  font-size: 15px;
  line-height: 1.85;
  font-weight: 600;
  color: #999;
  letter-spacing: 0;
}
.origin-facts {
  padding-top: 27px;
  margin-top: 35px;
}
.origin-facts b {
  font-size: 39px;
  letter-spacing: -2px;
  line-height: 1.1;
}
.origin-facts > span {
  color: #888;
  font-size: 8px;
  letter-spacing: 0.4px;
}
.belief-strip {
  background: #d8d8d4;
  color: #111;
  padding: 20px 0;
  border: 0;
}
.belief-strip > div > span > span {
  color: #202020;
  font-size: 25px;
  font-weight: 900;
  letter-spacing: -0.4px;
  gap: 40px;
  margin-right: 40px;
}
.belief-strip img {
  width: 29px;
  height: 29px;
}
.world,
.lore,
.media {
  background: #101010;
}
.world {
  padding-bottom: 45px;
}
.civilizations {
  background: #222;
  border-radius: 8px;
}
.civilizations-image {
  filter: brightness(0.8);
  transition: filter 1s;
}
.civilizations:hover .civilizations-image {
  filter: brightness(0.9);
}
.civilization-dimmer {
  background: #00000080;
}
.civilization-tab {
  background: #0a0a0ae0;
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  min-height: 112px;
}
.civilization-tab[aria-selected="true"] {
  background: #2a2a2af0;
  border-top-color: #ecece8;
}
.civilization-tab:hover {
  background: #363636f7;
}
.side-number {
  color: #999;
}
.civilization-tab strong {
  font-size: 29px;
  letter-spacing: -1px;
}
.civilization-tab small {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.3px;
  color: #aaa;
}
.choice-indicator {
  border-color: #707070;
  border-radius: 50%;
  color: #f0f0ec;
}
.civilization-panel h3 {
  font-size: 32px;
  letter-spacing: -1px;
  font-weight: 900;
}
.civilization-panel p {
  font-size: 15px;
  line-height: 1.9;
  font-weight: 600;
  color: #aaa;
}
.signal-label {
  font-size: 9px;
  color: #a7a7a7;
}
.micro-copy {
  font-size: 9px;
  color: #888;
  letter-spacing: 0.5px;
}
.lore {
  padding-top: 70px;
}
.lore-image {
  border-radius: 7px;
}
.lore-image img {
  filter: contrast(0.96);
  transition: transform 0.7s, filter 0.7s;
}
.lore-card h3 {
  font-size: 26px;
  letter-spacing: -1px;
  line-height: 1.15;
}
.lore-card-heading > span {
  font-size: 9px;
  letter-spacing: 0.4px;
  color: #9b9b9b;
}
.lore-card > p {
  font-size: 14px;
  line-height: 1.9;
  font-weight: 600;
  color: #999;
}
.lore-card .inline-link {
  font-size: 11px;
}
.lore-image > span {
  font-size: 9px;
  letter-spacing: 0.3px;
  background: #0a0a0ad6;
}
.chapters {
  background: #191919;
}
.chapters .section-heading h2 {
  font-size: clamp(38px, 4.8vw, 70px);
  line-height: 1;
  letter-spacing: -0.055em;
}
.featured-chapter {
  background: #232323;
  border: 0;
  border-radius: 8px;
  overflow: hidden;
}
.dispatch-image {
  height: 300px;
  background: #111;
}
.dispatch-image img {
  opacity: 0.75;
}
.dispatch-copy {
  padding: 30px;
}
.dispatch-copy h3 {
  font-size: 28px;
  line-height: 1.2;
  letter-spacing: -1px;
}
.dispatch-copy > p,
.chapter-item p {
  font-size: 14px;
  line-height: 1.85;
  font-weight: 600;
  color: #aaa;
}
.dispatch-copy .section-label,
.chapter-item .section-label {
  font-size: 9px;
  letter-spacing: 0.4px;
  color: #8d8d8d;
}
.chapter-item h3 {
  font-size: 25px;
  line-height: 1.25;
  letter-spacing: -0.7px;
}
.chapter-number {
  font-size: 31px;
  color: #666;
  letter-spacing: -2px;
}
.chapter-item .inline-link,
.secondary-source {
  font-size: 11px;
}
.secondary-source {
  color: #999;
}
.chapter-item {
  padding-block: 29px;
  gap: 25px;
}
.media-image {
  border-radius: 7px;
  background: #191919;
}
.media-image img {
  transition: transform 0.7s, filter 0.7s;
}
.media-open {
  background: #141414cc;
  border-color: #777;
  border-radius: 50%;
}
.media-tile:hover .media-open {
  background: #444;
}
.media-tile-label strong {
  font-size: 13px;
  font-weight: 900;
  letter-spacing: -0.2px;
}
.media-tile-label > span {
  font-size: 9px;
  color: #888;
  letter-spacing: 0;
}
.community {
  background: #111;
  min-height: 690px;
  padding-top: 100px;
  padding-bottom: 105px;
}
.community-art {
  filter: brightness(0.75);
  opacity: 0.58;
}
.community-shade {
  background: #00000026;
}
.community h2 {
  font-size: clamp(54px, 6.8vw, 100px);
  font-weight: 900;
  line-height: 0.98;
  letter-spacing: -0.06em;
}
.community h2 > span {
  color: #e4e4df;
}
.community p:not(.section-label) {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.7;
  color: #bbb;
}
.community-content {
  max-width: 760px;
}
.community-signature {
  color: #888;
  font-size: 9px;
  letter-spacing: 1px;
}
.footer {
  background: #101010;
  padding-top: 50px;
  padding-bottom: 30px;
}
.footer-wordmark {
  font-size: 68px;
  font-weight: 900;
  letter-spacing: -4px;
}
.footer-wordmark > span {
  font-size: 12px;
  color: #777;
  letter-spacing: 4px;
}
.footer-top > div {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.3px;
  color: #aaa;
}
.footer-bottom {
  grid-template-columns: 1fr auto;
  align-items: center;
  color: #777;
  font-size: 9px;
  gap: 25px;
}
.footer-bottom p {
  font-weight: 700;
}
.footer-bottom > span {
  font-size: 8px;
  letter-spacing: 0.2px;
}
.footer-bottom > span:last-child {
  grid-column: auto;
}
.media-dialog {
  background: #191919;
  border-color: #555;
  border-radius: 12px;
}
.dialog-close {
  background: #161616;
}
.media-dialog-inner > img {
  background: #0c0c0c;
}
.media-dialog-bottom h2 {
  font-size: 23px;
  line-height: 1.2;
  letter-spacing: -0.7px;
}
.media-dialog-bottom p {
  color: #999;
}
.toast {
  border: 0;
  border-radius: 100px;
  background: #e8e8e4;
  color: #111;
  font-family: Work Sans, sans-serif;
  font-weight: 800;
}
@media (min-width: 1700px) {
  .hero-copy {
    margin-left: 15%;
    padding-top: 30svh;
  }
  .hero h1 {
    font-size: 80px;
  }
  .hero-description {
    font-size: 17px;
  }
  .hero-footer {
    left: 7%;
    right: 7%;
  }
  .hero {
    min-height: 950px;
  }
  .section-heading > p {
    font-size: 16px;
  }
}
@media (max-width: 1150px) {
  .header {
    left: 3%;
    right: 3%;
    padding-right: 15px;
  }
  .desktop-nav {
    gap: 23px;
    font-size: 12px;
  }
  .header-actions {
    gap: 16px;
  }
  .hero-copy {
    margin-left: 9%;
    width: 70%;
    padding-top: 28svh;
  }
  .hero h1 {
    font-size: 58px;
  }
  .hero-description {
    font-size: 15px;
  }
  .hero-ctas .button {
    font-size: 12px;
    padding-inline: 25px;
  }
  .hero-telegram {
    font-size: 11px;
  }
  .section-heading h2 {
    font-size: 58px;
  }
  .origin-title {
    font-size: 56px;
  }
  .origin-copy > p {
    font-size: 19px;
  }
  .origin-copy > p + p {
    font-size: 14px;
  }
  .civilization-tab strong {
    font-size: 26px;
  }
  .lore-card h3 {
    font-size: 23px;
  }
  .lore-card > p {
    font-size: 13px;
  }
  .chapters .section-heading h2 {
    font-size: 53px;
  }
  .dispatch-copy h3 {
    font-size: 25px;
  }
  .chapter-item h3 {
    font-size: 22px;
  }
  .footer-wordmark {
    font-size: 58px;
  }
}
@media (max-width: 850px) {
  .header {
    top: 16px;
    height: 70px;
    left: 4%;
    right: 4%;
    padding-left: 10px;
  }
  .header-actions {
    gap: 15px;
  }
  .hero {
    height: 100svh;
    min-height: 850px;
  }
  .hero-copy {
    margin-left: 8%;
    width: 82%;
    max-width: 680px;
    padding-top: 250px;
  }
  .hero h1 {
    font-size: 58px;
  }
  .hero-footer {
    bottom: calc(14.5vw + 35px);
  }
  .hero-art {
    object-position: 60% center;
  }
  .hero-ctas .button {
    font-size: 12px;
  }
  .mobile-nav {
    top: 99px;
    left: 4%;
    right: 4%;
    padding: 15px 25px 25px;
    background: #161616fa;
    border-radius: 22px;
    border: 1px solid #444;
  }
  .mobile-nav > a {
    font-size: 16px;
    font-weight: 800;
  }
  .section-pad {
    padding-top: 85px;
    padding-bottom: 85px;
  }
  .section-heading h2 {
    font-size: 47px;
  }
  .section-heading > p {
    font-size: 14px;
  }
  .origin-title {
    font-size: 48px;
  }
  .origin-copy > p {
    font-size: 18px;
  }
  .origin-copy > p + p {
    font-size: 13px;
  }
  .origin-facts b {
    font-size: 32px;
  }
  .belief-strip > div > span > span {
    font-size: 23px;
  }
  .world {
    padding-bottom: 35px;
  }
  .civilization-tab strong {
    font-size: 22px;
  }
  .civilization-tab small {
    font-size: 9px;
  }
  .civilization-panel h3 {
    font-size: 28px;
  }
  .civilization-panel p {
    font-size: 14px;
  }
  .lore-card h3 {
    font-size: 21px;
  }
  .lore-card > p {
    font-size: 13px;
    min-height: 0;
  }
  .lore-card-heading > span {
    font-size: 8px;
  }
  .chapter-layout {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .chapter-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
  }
  .chapter-item {
    display: block;
    border-bottom: 0;
    border-top: 1px solid var(--line);
    padding-top: 22px !important;
  }
  .chapter-number {
    display: block;
    margin-bottom: 17px;
  }
  .chapter-item h3 {
    font-size: 22px;
  }
  .chapter-item p {
    font-size: 13px;
  }
  .chapter-item .section-label {
    font-size: 7px;
  }
  .dispatch-image {
    height: 330px;
  }
  .dispatch-copy > p {
    font-size: 14px;
    max-width: 520px;
  }
  .chapters .section-heading h2 {
    font-size: 45px;
  }
  .community {
    min-height: 690px;
  }
  .community h2 {
    font-size: 77px;
  }
  .footer-wordmark {
    font-size: 56px;
  }
  .footer-bottom > span:last-child {
    grid-column: auto;
  }
}
@media (max-width: 600px) {
  .header {
    top: 15px;
    left: 16px;
    right: 16px;
    height: 65px;
    padding-left: 9px;
    padding-right: 8px;
  }
  .brand {
    gap: 7px;
  }
  .brand img {
    width: 35px;
    height: 35px;
  }
  .brand > span {
    font-size: 16px;
    letter-spacing: -0.7px;
  }
  .header-actions {
    gap: 3px;
  }
  .language {
    font-size: 10px;
    min-width: 44px;
  }
  .hero {
    height: 850px;
    min-height: 850px;
  }
  .hero-copy {
    padding-top: 180px;
    margin-left: 7%;
    width: 86%;
    max-width: none;
  }
  .hero-copy > .section-label {
    font-size: 10px;
    letter-spacing: 1px;
    max-width: 310px;
  }
  .hero h1 {
    font-size: clamp(40px, 11.4vw, 62px);
    line-height: 1.02;
    letter-spacing: -0.055em;
    margin-top: 23px;
  }
  .hero h1 > span {
    max-width: 370px;
  }
  .hero-description {
    font-size: 13px;
    line-height: 1.75;
    font-weight: 700;
    margin-top: 21px;
    max-width: 300px;
  }
  .hero-art {
    object-position: center;
    filter: brightness(0.72) contrast(1.06);
  }
  .hero-shade {
    background: #00000014;
  }
  .hero-ctas {
    gap: 9px;
    margin-top: 23px;
  }
  .hero-ctas .button {
    font-size: 11px;
    padding-inline: 19px;
    min-height: 46px;
  }
  .hero-telegram {
    font-size: 9px;
    padding-inline: 5px;
  }
  .hero-footer {
    bottom: calc(14.6vw + 28px);
    left: 7%;
    right: 7%;
    font-size: 7px;
  }
  .hero-footer .icon-button {
    width: 44px;
    height: 44px;
  }
  .hero-wordmark {
    font-size: 17.2vw;
    letter-spacing: -0.9vw;
    line-height: 0.9;
  }
  .hero-wordmark-wrap {
    bottom: 0;
  }
  .mobile-nav {
    top: 92px;
    left: 16px;
    right: 16px;
    padding: 12px 23px 23px;
  }
  .token-strip {
    padding-block: 24px;
    gap: 20px;
  }
  .token-identity strong {
    font-size: 15px;
  }
  .contract-copy code {
    font-size: 11px;
    letter-spacing: 0;
  }
  .contract-label {
    font-size: 8px;
  }
  .token-links {
    font-size: 9px;
    gap: 25px;
  }
  .section-pad {
    padding-top: 72px;
    padding-bottom: 72px;
  }
  .section-label {
    font-size: 9px;
    letter-spacing: 0.7px;
  }
  .section-heading {
    margin-bottom: 30px;
  }
  .section-heading h2 {
    font-size: clamp(35px, 9.8vw, 51px);
    line-height: 1;
    letter-spacing: -0.055em;
    margin-top: 21px;
  }
  .section-heading > p {
    font-size: 14px;
    line-height: 1.8;
    margin-top: 23px;
    max-width: 330px;
  }
  .origin-title {
    font-size: 44px;
    line-height: 1.1;
    letter-spacing: -1.8px;
    margin-top: 23px;
  }
  .source-link {
    font-size: 12px;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 25px;
  }
  .source-link > span {
    font-size: 7px;
    padding: 0;
    border: 0;
    display: block;
    width: 100%;
  }
  .origin {
    gap: 32px;
  }
  .origin-copy > p {
    font-size: 20px;
    line-height: 1.6;
    font-weight: 800;
  }
  .origin-copy > p + p {
    font-size: 14px;
    line-height: 1.85;
    margin-top: 20px;
  }
  .origin-facts b {
    font-size: 34px;
    letter-spacing: -1px;
  }
  .origin-facts > span {
    font-size: 7px;
  }
  .belief-strip {
    padding: 18px 0;
  }
  .belief-strip > div > span > span {
    font-size: 22px;
    gap: 30px;
    margin-right: 30px;
  }
  .world {
    padding-bottom: 25px;
  }
  .civilizations {
    border-radius: 0;
  }
  .civilizations-image {
    height: 270px;
  }
  .civilization-tab {
    padding: 17px 12px;
    min-height: 110px;
  }
  .civilization-tab strong {
    font-size: 18px;
    letter-spacing: -0.5px;
    line-height: 1.15;
  }
  .civilization-tab small {
    font-size: 8px;
    line-height: 1.6;
    letter-spacing: 0;
    color: #999;
  }
  .civilization-panel h3 {
    font-size: 28px;
  }
  .civilization-panel p {
    font-size: 14px;
    line-height: 1.8;
  }
  .signal-label {
    font-size: 8px;
  }
  .civilization-panel .micro-copy {
    font-size: 8px;
    letter-spacing: 0;
  }
  .lore {
    padding-top: 45px;
  }
  .lore-card h3 {
    font-size: 27px;
    letter-spacing: -1px;
  }
  .lore-card-heading > span {
    font-size: 9px;
    letter-spacing: 0.2px;
  }
  .lore-card > p {
    font-size: 14px;
    line-height: 1.85;
    margin-block: 17px 20px;
  }
  .lore-card .inline-link {
    font-size: 11px;
  }
  .lore-grid {
    gap: 42px;
  }
  .lore-image > span {
    font-size: 8px;
  }
  .chapters .section-heading h2 {
    font-size: 36px;
  }
  .chapter-list {
    display: flex;
    gap: 0;
  }
  .chapter-number {
    margin: 0;
    font-size: 30px;
    min-width: 37px;
  }
  .chapter-item {
    display: flex;
    gap: 18px;
    padding-block: 28px;
  }
  .chapter-item h3 {
    font-size: 23px;
    letter-spacing: -0.7px;
  }
  .chapter-item p {
    font-size: 14px;
    line-height: 1.8;
  }
  .chapter-item .section-label {
    font-size: 7px;
  }
  .chapter-item .inline-link,
  .secondary-source {
    font-size: 11px;
  }
  .dispatch-image {
    height: 260px;
  }
  .dispatch-copy {
    padding: 27px 23px;
  }
  .dispatch-copy h3 {
    font-size: 27px;
    line-height: 1.25;
    letter-spacing: -0.8px;
  }
  .dispatch-copy > p {
    font-size: 14px;
  }
  .dispatch-copy .section-label {
    font-size: 8px;
  }
  .media-tile-label strong {
    font-size: 13px;
    letter-spacing: -0.2px;
  }
  .media-tile-label > span {
    font-size: 9px;
  }
  .media-tile-label {
    padding-block: 18px;
  }
  .media-image {
    height: 220px;
  }
  .community {
    padding-top: 75px;
    padding-bottom: 100px;
    min-height: 650px;
  }
  .community h2 {
    font-size: clamp(43px, 12.6vw, 67px);
    line-height: 1;
    letter-spacing: -0.055em;
    margin-top: 29px;
  }
  .community p:not(.section-label) {
    font-size: 14px;
    line-height: 1.8;
  }
  .community-ctas .button {
    font-size: 12px;
    padding-inline: 20px;
    min-height: 47px;
  }
  .community-signature {
    font-size: 7px;
    color: #999;
    letter-spacing: 0.7px;
  }
  .footer {
    padding: 40px 7% 28px;
  }
  .footer-wordmark {
    font-size: 44px;
    letter-spacing: -2.5px;
  }
  .footer-wordmark > span {
    font-size: 10px;
    letter-spacing: 3px;
    margin-left: 12px;
  }
  .footer-top {
    gap: 28px;
    padding-bottom: 30px;
  }
  .footer-top > div {
    font-size: 11px;
    gap: 24px;
  }
  .footer-bottom {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 18px;
    font-size: 8px;
    padding-top: 24px;
  }
  .footer-bottom > span {
    font-size: 8px;
  }
  .media-dialog-bottom h2 {
    font-size: 22px;
  }
  .media-dialog-bottom .button {
    font-size: 12px;
  }
  .media-dialog-bottom p {
    font-size: 11px;
  }
  .toast {
    font-size: 12px;
  }
}
@media (max-width: 360px) {
  .brand > span {
    font-size: 14px;
  }
  .header {
    left: 12px;
    right: 12px;
  }
  .hero {
    height: 820px;
    min-height: 820px;
  }
  .hero-copy {
    padding-top: 170px;
  }
  .hero h1 {
    font-size: 40px;
  }
  .hero-copy > .section-label {
    font-size: 8px;
  }
  .hero-description {
    font-size: 12px;
  }
  .hero-ctas .button {
    font-size: 10px;
    padding-inline: 15px;
  }
  .hero-telegram {
    font-size: 8px;
  }
  .hero-footer {
    font-size: 6px;
  }
  .civilization-tab strong {
    font-size: 15px;
  }
  .civilization-tab small {
    font-size: 7px;
  }
  .section-heading h2 {
    font-size: 32px;
  }
  .origin-title {
    font-size: 39px;
  }
  .chapters .section-heading h2 {
    font-size: 32px;
  }
  .community h2 {
    font-size: 43px;
  }
  .community-ctas .button {
    font-size: 11px;
    padding-inline: 16px;
  }
  .footer-wordmark {
    font-size: 37px;
  }
}
html:has(.motion-paused) {
  scroll-behavior: auto;
}
.hero-wordmark {
  font-size: 16vw;
  letter-spacing: -0.9vw;
}
@media (max-width: 600px) {
  .hero-wordmark {
    font-size: 16vw;
    letter-spacing: -0.9vw;
  }
}
:root {
  --paper: #f8efdf;
  --ice: #d1d9e4;
  --lavender: #c9becf;
  --ink: #191922;
  --muted: #b2acb9;
  --line: rgba(185, 210, 251, 0.18);
  --coral: #f3a47e;
  background: var(--ink);
  color: var(--paper);
}
body,
.world,
.lore,
.media {
  background: #191922;
}
.header {
  background: #091121d9;
  border-color: #bed7ff33;
}
.brand img,
.token-identity img,
.belief-strip img {
  filter: none;
}
.brand small {
  color: #9eb6d8;
}
.desktop-nav {
  color: #ced9e9;
}
.desktop-nav a:hover,
.language:hover {
  color: var(--coral);
}
.button {
  background: var(--coral);
  border-color: var(--coral);
  color: #13203a;
}
.button:hover {
  background: #ffd1b8;
  border-color: #ffd1b8;
}
.button-outline {
  color: #e3edff;
  background: #12213a85;
  border-color: #90afd5;
}
.button-outline:hover {
  background: var(--ice);
  border-color: var(--ice);
  color: #10203c;
}
.icon-button {
  border-color: #8299ba;
}
.icon-button:hover {
  background: #253c60;
}
.hero {
  background: #061026;
}
.hero-art {
  filter: brightness(0.77) contrast(1.03);
  object-position: 61% 51%;
}
.hero-shade {
  background: #030b1b1a;
}
.hero-copy > .section-label {
  color: var(--coral);
}
.hero h1 {
  color: #f8efdf;
}
.hero h1 > span {
  color: #c7dcff;
}
.hero-description {
  color: #d0dcef;
}
.hero-wordmark {
  color: #f1ebdf;
}
.hero-footer {
  color: #b5cae7;
}
.hero-socials {
  display: flex;
  align-items: center;
  gap: 25px;
  margin-top: 20px;
}
.hero-socials a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.8px;
  min-height: 32px;
  color: #c9dafa;
  transition: color 0.2s;
}
.hero-socials a:hover {
  color: var(--coral);
}
.token-strip {
  background: #242332;
}
.token-identity span,
.contract-label {
  color: #93a8c7;
}
.contract-copy:hover,
.token-links a:hover {
  color: var(--coral);
}
.section-label {
  color: #a5bce0;
}
.section-heading > p {
  color: #a6b6ce;
}
.origin-copy > p {
  color: #e1e9f4;
}
.origin-copy > p + p {
  color: #9eafc9;
}
.source-link {
  color: #c4dafb;
}
.source-link > span,
.origin-facts > span {
  color: #829bbd;
}
.origin-facts b {
  color: var(--coral);
}
.belief-strip {
  background: #e3d9c8;
}
.belief-strip > div > span > span {
  color: #102344;
}
.civilizations {
  background: #122039;
}
.civilizations-image {
  filter: brightness(0.91);
  transition: filter 1s;
}
.civilizations:hover .civilizations-image {
  filter: brightness(1);
}
.civilization-dimmer {
  background: #030a196b;
}
.civilization-tab {
  background: #091222e6;
}
.civilization-tab[aria-selected="true"] {
  background: #1e3553f2;
  border-top-color: #bdd7ff;
}
.side-1 .civilization-tab[aria-selected="true"] {
  background: #39282cf2;
  border-top-color: var(--coral);
}
.civilization-tab:hover {
  background: #2a405ff7;
}
.side-1 .civilization-tab[aria-selected="true"] .choice-indicator {
  color: var(--coral);
  border-color: var(--coral);
}
.civilization-tab small {
  color: #a7bbd7;
}
.side-number {
  color: #9aafd0;
}
.choice-indicator {
  color: #d1e4ff;
  border-color: #6c87b0;
}
.civilization-panel p {
  color: #a2b5d1;
}
.signal-label,
.micro-copy {
  color: #93a9ca;
}
.lore-image img {
  filter: brightness(0.95);
}
.lore-image:hover img {
  filter: brightness(1);
}
.lore-card > p {
  color: #9eb0ca;
}
.lore-card-heading > span {
  color: #e6a38e;
}
.lore-image > span {
  background: #061022db;
}
.inline-link {
  color: #c2d9fc;
  border-bottom-color: #59769f;
}
.inline-link:hover {
  color: var(--coral);
}
.chapters {
  background: #22212e;
}
.featured-chapter {
  background: #302d3c;
}
.dispatch-image {
  background: #0c1629;
}
.dispatch-image img {
  filter: brightness(0.95);
  opacity: 0.9;
}
.dispatch-copy > p,
.chapter-item p {
  color: #9fb3d2;
}
.dispatch-copy .section-label,
.chapter-item .section-label {
  color: #b4a6c8;
}
.chapter-number {
  color: #7d8fa9;
}
.secondary-source {
  color: #d2a292;
}
.media-image {
  background: #13243e;
}
.media-image img,
.media-tile:hover img {
  filter: none;
}
.media-open {
  background: #0c1d35d1;
  border-color: #7c9dc8;
}
.media-tile:hover .media-open {
  background: #3d567b;
}
.media-tile-label > span {
  color: #8ca2c3;
}
.community {
  background: #0a1529;
}
.community-art {
  filter: brightness(0.94);
  opacity: 0.65;
}
.community-shade {
  background: #040c1c33;
}
.community h2 > span {
  color: var(--coral);
}
.community p:not(.section-label) {
  color: #c3d4ec;
}
.community-signature {
  color: #9aafcd;
}
.footer {
  background: #14151d;
}
.footer-top > div {
  color: #a5bad6;
}
.footer-top > div a:hover {
  color: var(--coral);
}
.footer-wordmark > span,
.footer-bottom {
  color: #8499b9;
}
.media-dialog {
  background: #2b2938;
  border-color: #6b86ae;
}
.dialog-close {
  background: #152641;
}
.media-dialog-inner > img {
  background: #071225;
}
.media-dialog-bottom p {
  color: #9caec9;
}
.toast {
  background: #c7dcfb;
  color: #13213a;
}
@media (max-width: 850px) {
  .mobile-nav {
    background: #0b182dfa;
    border-color: #425c80;
  }
  .mobile-nav > a:last-child {
    color: var(--coral);
  }
}
@media (max-width: 600px) {
  .hero-art {
    filter: brightness(0.94) contrast(1.02);
    object-position: center;
  }
  .hero-shade {
    background: #030b1b0a;
  }
  .hero-socials {
    margin-top: 15px;
    gap: 24px;
  }
  .hero-socials a {
    font-size: 10px;
    min-height: 32px;
  }
  .hero-copy > .section-label {
    font-size: 8px;
    letter-spacing: 0.65px;
  }
  .community-signature {
    color: #a0b5d2;
  }
}
@media (max-width: 360px) {
  .hero-copy > .section-label {
    font-size: 7px;
  }
  .hero-socials {
    margin-top: 11px;
  }
}
:root {
  font-family: Geist, system-ui, Microsoft YaHei, sans-serif;
  font-optical-sizing: auto;
}
body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.site h1,
.site h2,
.site h3,
.site .hero-wordmark,
.site .footer-wordmark,
.brand > span,
.button {
  font-family: Work Sans, system-ui, Microsoft YaHei, sans-serif;
}
.hero-copy > * {
  will-change: auto;
}
.site h1,
.site h2,
.site h3 {
  text-shadow: none;
  filter: none;
}
.hero-description,
.section-heading > p,
.lore-card > p,
.dispatch-copy > p,
.chapter-item p,
.civilization-panel p,
.origin-copy > p,
.community p:not(.section-label) {
  font-weight: 400;
}
.desktop-nav {
  font-family: Geist, sans-serif;
  font-weight: 500;
}
.hero-copy {
  padding-top: 23svh;
}
.hero h1 {
  letter-spacing: -0.045em;
}
.hero-socials {
  margin-top: 14px;
}
.hero-footer > a {
  visibility: hidden;
}
.trade-links {
  display: flex;
  align-items: center;
  gap: 10px;
}
.trade-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 49px;
  border: 1px solid #7796c0;
  border-radius: 100px;
  background: #0d1e35c2;
  padding: 0 20px;
  color: #e3edfb;
  font-family: Work Sans, sans-serif;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
  transition: background 0.2s, border-color 0.2s, transform 0.2s;
}
.trade-button img {
  width: 24px;
  height: 24px;
  object-fit: contain;
  flex-shrink: 0;
  border-radius: 50%;
}
.trade-button:hover {
  background: #294467;
  border-color: #c1d9fa;
  transform: translateY(-2px);
}
.trade-uniswap {
  color: #16223b;
  background: var(--coral);
  border-color: var(--coral);
}
.trade-uniswap:hover {
  background: #ffd2b8;
  border-color: #ffd2b8;
}
.hero-contract {
  display: block;
  width: 530px;
  max-width: 100%;
  padding: 13px 17px 15px;
  margin-top: 19px;
  background: #0a1930e0;
  border: 1px solid #b7adb9;
  border-radius: 12px;
  text-align: left;
  transition: background 0.2s, border-color 0.2s;
}
.hero-contract:hover {
  background: #1a365d;
  border-color: #e6efff;
}
.hero-contract-meta {
  display: flex;
  align-items: center;
  gap: 9px;
  font-family: Geist, sans-serif;
  font-size: 9px;
  letter-spacing: 0.7px;
  color: #b2c7e3;
}
.hero-contract-meta b {
  font-size: 12px;
  font-weight: 600;
  color: var(--coral);
}
.hero-contract-action {
  margin-left: auto;
  font-size: 8px;
  color: #a8c8f1;
}
.hero-contract-address {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  margin-top: 8px;
}
.hero-contract-address code {
  font-family: Geist, monospace;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.05px;
  overflow-wrap: anywhere;
  color: #f7f0e5;
}
.hero-contract-address svg {
  flex-shrink: 0;
  color: var(--coral);
}
.token-strip {
  grid-template-columns: 180px minmax(300px, 1fr) auto;
  gap: 22px;
}
.token-strip .contract-copy {
  padding-inline: 22px;
}
.trade-links-compact {
  gap: 8px;
}
.trade-links-compact .trade-button {
  min-height: 40px;
  padding-inline: 12px;
  font-size: 9px;
  gap: 7px;
}
.trade-links-compact .trade-button img {
  width: 19px;
  height: 19px;
}
.trade-links-compact .trade-long-label {
  display: none;
}
.trade-links-compact .trade-short-label {
  display: inline;
}
.contract-copy code {
  font-family: Geist, monospace;
  font-weight: 500;
}
@media (min-width: 1700px) {
  .hero-copy {
    padding-top: 24svh;
  }
  .hero-contract {
    width: 570px;
  }
  .hero-contract-address code {
    font-size: 15px;
  }
}
@media (max-width: 1150px) {
  .hero-copy {
    padding-top: 22svh;
  }
  .token-strip {
    grid-template-columns: 165px 1fr;
  }
  .token-strip > .trade-links {
    grid-column: 2;
    padding-left: 22px;
  }
  .token-strip .token-identity {
    grid-row: 1/3;
  }
  .trade-links-compact .trade-button {
    min-height: 38px;
  }
}
@media (max-width: 850px) {
  .hero-copy {
    padding-top: 205px;
  }
  .hero-contract-address code {
    font-size: 13px;
  }
  .trade-button {
    padding-inline: 18px;
  }
  .token-strip > .trade-links {
    padding-left: 22px;
  }
  .hero-footer {
    bottom: calc(14.5vw + 24px);
  }
}
@media (max-width: 600px) {
  .hero {
    height: 920px;
    min-height: 920px;
  }
  .hero-copy {
    padding-top: 151px;
  }
  .hero h1 {
    font-size: clamp(36px, 10.25vw, 58px);
    letter-spacing: -0.045em;
    margin-top: 17px;
    line-height: 1.04;
  }
  .hero-description {
    font-size: 12px;
    line-height: 1.7;
    margin-top: 17px;
  }
  .hero-ctas {
    margin-top: 19px;
  }
  .trade-links {
    gap: 7px;
    width: 100%;
  }
  .trade-button {
    min-height: 46px;
    padding: 0 12px;
    gap: 6px;
    font-size: 10px;
    flex: 1;
  }
  .trade-button img {
    width: 21px;
    height: 21px;
  }
  .trade-long-label {
    display: none;
  }
  .trade-short-label {
    display: inline;
  }
  .hero-contract {
    width: 100%;
    margin-top: 14px;
    padding: 11px 12px 12px;
    border-radius: 11px;
  }
  .hero-contract-meta {
    font-size: 7px;
    gap: 7px;
    letter-spacing: 0.4px;
  }
  .hero-contract-meta b {
    font-size: 10px;
  }
  .hero-contract-action {
    font-size: 7px;
  }
  .hero-contract-address {
    gap: 9px;
    margin-top: 7px;
  }
  .hero-contract-address code {
    font-size: 10px;
    letter-spacing: 0;
    white-space: nowrap;
  }
  .hero-contract-address svg {
    width: 16px;
    height: 16px;
  }
  .hero-socials {
    margin-top: 12px;
    gap: 23px;
  }
  .hero-socials a {
    font-size: 9px;
  }
  .token-strip {
    display: flex;
  }
  .token-strip > .trade-links {
    grid-column: auto;
    padding: 0;
    width: 100%;
  }
  .token-strip .contract-copy {
    padding: 0;
  }
  .token-strip .token-identity {
    grid-row: auto;
  }
  .trade-links-compact .trade-button {
    min-height: 43px;
    font-size: 10px;
    padding-inline: 12px;
  }
  .hero-footer {
    bottom: calc(14.6vw + 24px);
  }
  .hero-wordmark {
    font-size: 16.8vw;
    letter-spacing: -0.8vw;
  }
}
@media (max-width: 360px) {
  .hero {
    height: 885px;
    min-height: 885px;
  }
  .hero-copy {
    padding-top: 145px;
  }
  .hero h1 {
    font-size: 36px;
  }
  .hero-description {
    font-size: 11px;
  }
  .hero-contract-address code {
    font-size: 8.7px;
  }
  .trade-button {
    padding-inline: 10px;
    font-size: 9px;
  }
  .trade-button img {
    width: 19px;
    height: 19px;
  }
}
.header {
  background: #171721db;
  border-color: #e8d8ca33;
}
.hero-art {
  filter: brightness(0.82) contrast(1.02) saturate(0.88);
}
.hero-shade {
  background: #7144281a;
}
.hero-wordmark {
  color: #f3e9d7;
}
.hero h1 > span {
  color: #dddbe7;
}
.hero-description {
  color: #ded8dc;
}
.hero-socials a {
  color: #ded5d9;
}
.section-label {
  color: #c3b7ba;
}
.section-heading > p,
.origin-copy > p + p,
.lore-card > p,
.dispatch-copy > p,
.chapter-item p,
.civilization-panel p {
  color: #b4acbc;
}
.origin-copy > p {
  color: #ede4dc;
}
.source-link {
  color: #e6d6cc;
}
.trade-button {
  background: #272431e0;
  border-color: #8d8298;
  color: #f0e6e1;
}
.trade-button:hover {
  background: #454051;
  border-color: #e3c6b3;
}
.trade-uniswap {
  background: var(--coral);
  border-color: var(--coral);
  color: #252233;
}
.trade-uniswap:hover {
  background: #f8c9a9;
}
.hero-contract {
  background: #1d1c29e6;
  border-color: #b6a8af;
}
.hero-contract:hover {
  background: #3d3345;
  border-color: #f0c8b0;
}
.hero-contract-meta {
  color: #c6b6c1;
}
.hero-contract-action {
  color: #d7bbaa;
}
.civilization-tab[aria-selected="true"] {
  background: #333142f5;
  border-top-color: #ddd4da;
}
.civilization-panel .micro-copy,
.signal-label {
  color: #c0aeb7;
}
.media-image {
  background: #292634;
}
.media-open {
  background: #251f2ee0;
  border-color: #ad919a;
}
.community-shade {
  background: #44281c2e;
}
.community p:not(.section-label) {
  color: #e1d1cd;
}
.footer-top > div,
.footer-wordmark > span,
.footer-bottom {
  color: #b7a7b2;
}
.toast {
  background: #eed9bf;
  color: #272336;
}
.desktop-nav {
  font-weight: 400;
}
@media (max-width: 850px) {
  .mobile-nav {
    background: #1c1a27fa;
    border-color: #786271;
  }
}
@media (max-width: 600px) {
  .hero-art {
    filter: brightness(0.96) contrast(1.02) saturate(0.9);
  }
  .hero-shade {
    background: #693d2114;
  }
  .hero-contract-address code {
    font-size: clamp(9px, 2.9vw, 12px);
  }
}
@media (prefers-reduced-motion: reduce) {
  .hero-wordmark {
    transform: none !important;
  }
}
html {
  scroll-padding-top: 110px;
}
.header {
  position: fixed;
  background: #1e1b22e0;
  border-color: #f0d9c238;
  z-index: 50;
}
.mobile-nav {
  position: fixed;
  z-index: 49;
}
.hero {
  height: 180svh;
  min-height: 1440px;
  max-height: none;
  overflow: visible;
  background: #1b1920;
  isolation: isolate;
}
.hero-viewport {
  position: sticky;
  top: 0;
  height: 100svh;
  min-height: 800px;
  overflow: hidden;
  isolation: isolate;
}
.hero-picture {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -3;
}
.hero-art {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 62%;
  filter: none;
  opacity: 1;
  transform-origin: 65% 62%;
}
.hero-shade {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -2;
  background: #1c161c1a;
  pointer-events: none;
}
.cinematic-stage {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  pointer-events: none;
  overflow: hidden;
}
.stage-canvas {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.stage-canvas canvas {
  display: block;
  width: 100%;
  height: 100%;
}
.stage-fallback {
  position: absolute;
  height: 72%;
  width: auto;
  aspect-ratio: 1;
  object-fit: contain;
  left: 75.5%;
  top: 44.5%;
  transform: translate(-50%, -50%);
  opacity: 0;
}
.cinematic-stage[data-renderer="fallback"] .stage-fallback,
.cinematic-stage[data-renderer="reduced"] .stage-fallback {
  opacity: 1;
}
.cinematic-stage[data-renderer="fallback"] .stage-canvas,
.cinematic-stage[data-renderer="reduced"] .stage-canvas {
  display: none;
}
.hero-copy {
  position: relative;
  padding-top: 20svh;
  margin-left: 7%;
  width: 50%;
  max-width: 710px;
  z-index: 2;
}
.hero-copy > .section-label {
  font-size: 10px;
  letter-spacing: 1.25px;
  color: #e5b99f;
  max-width: 490px;
}
.hero h1 {
  font-size: clamp(48px, 4.45vw, 84px);
  line-height: 0.99;
  letter-spacing: -0.055em;
  margin-top: 24px;
  color: #faf1e2;
}
.hero h1 > span {
  color: #d8d9f5;
  white-space: nowrap;
}
.hero-description {
  font-size: 15px;
  line-height: 1.8;
  color: #c6bec7;
  margin-top: 24px;
}
.hero-ctas {
  margin-top: 26px;
}
.hero-contract {
  background: #231d27e8;
  border-color: #87756f;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  width: 530px;
}
.hero-contract:hover {
  background: #46343f;
  border-color: #f2c7aa;
}
.hero-contract-meta {
  color: #b9aebc;
}
.hero-contract-action {
  color: #d6bfb1;
}
.hero-contract-address code {
  color: #fff1e1;
}
.trade-button {
  background: #302631e0;
  border-color: #97808b;
  color: #f1e5eb;
}
.trade-button:hover {
  background: #5a4255;
  border-color: #e9c2ae;
}
.trade-uniswap {
  background: #efbea1;
  border-color: #efbea1;
  color: #31242c;
}
.trade-uniswap:hover {
  background: #ffdac0;
  border-color: #ffdac0;
}
.hero-socials {
  margin-top: 16px;
}
.hero-socials a {
  color: #c6b8c6;
}
.hero-socials a:hover {
  color: #ffcfac;
}
.hero-footer {
  left: auto;
  right: 5%;
  bottom: calc(16.7vw + 24px);
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  z-index: 3;
  background: #241c24d1;
  padding: 7px 8px 7px 18px;
  border: 1px solid #78615d;
  border-radius: 50px;
}
.hero-footer .icon-button {
  border-color: #a48a80;
  background: #2b202780;
}
.replay-intro {
  font: inherit;
  font-size: 9px;
  letter-spacing: 1px;
  color: #e4c3ae;
  background: transparent;
  border: 0;
  border-bottom: 1px solid #886c62;
  padding: 12px 0;
  cursor: pointer;
}
.replay-intro:hover {
  color: #ffe4d0;
  border-color: #ffe4d0;
}
.replay-intro:disabled {
  opacity: 0.4;
  cursor: default;
}
.hero-wordmark-wrap {
  bottom: 0;
  z-index: 1;
}
.hero-wordmark {
  font-size: 16.7vw;
  letter-spacing: -0.85vw;
  line-height: 0.86;
  color: #e7d7c6;
}
.hero-scroll-caption {
  position: absolute;
  left: 7%;
  top: 38%;
  z-index: 1;
  opacity: 0;
  pointer-events: none;
}
.hero-scroll-caption > span {
  font: 9px JetBrains Mono, monospace;
  letter-spacing: 2px;
  color: #d8ac8e;
}
.hero-scroll-caption p {
  font: 900 clamp(48px, 5vw, 90px) / 0.98 "Work Sans", sans-serif;
  letter-spacing: -0.055em;
  color: #f5e8d8;
  margin-top: 24px;
}
.hero-scroll-caption em {
  font-style: normal;
  color: #bcb9e5;
}
.token-strip {
  position: relative;
  z-index: 3;
  background: #2e2731;
  border-top: 1px solid #695347;
  border-bottom: 1px solid #4f3c3a;
}
.belief-strip {
  background: #e6c9ac;
}
.belief-strip > div > span > span {
  color: #352a34;
}
.world,
.lore,
.media {
  background: #221e28;
}
.civilizations {
  border: 1px solid #5e5053;
  box-shadow: 0 30px 85px #09060c45;
  border-radius: 16px;
  isolation: isolate;
}
.civilizations-image,
.civilizations:hover .civilizations-image {
  filter: none;
  transition: none;
}
.civilization-dimmer {
  background: #18142157;
  transition: transform 1.1s cubic-bezier(0.22, 1, 0.36, 1), background 1s;
}
.side-1 .civilization-dimmer {
  background: #22182166;
}
.civilization-tab {
  background: #1f1e26e6;
  border-top: 1px solid #4f4851;
}
.civilization-tab[aria-selected="true"] {
  background: #413a40f0;
  border-top-color: #d4c4b2;
}
.side-1 .civilization-tab[aria-selected="true"] {
  background: #3c3040f0;
  border-top-color: #b8a8cf;
}
.civilization-tab:hover {
  background: #493b48f7;
}
.civilization-tab small {
  color: #c4b6c4;
}
.civilization-panel {
  min-height: 190px;
}
.lore-image {
  overflow: hidden;
  border-radius: 12px;
  border: 1px solid #65505a;
}
.lore-image img {
  transform-origin: center;
  object-fit: cover;
}
.lore-card {
  position: relative;
}
.lore-card-heading {
  border-top-color: #614950;
}
.chapters {
  background: #2c2530;
}
.featured-chapter {
  background: #3b303c;
  border: 1px solid #5e4556;
  border-radius: 14px;
}
.chapter-item {
  transition: border-color 0.3s;
}
.chapter-item:hover {
  border-color: #cdad95;
}
.chapter-number {
  color: #b88c82;
}
.dispatch-copy > p,
.chapter-item p {
  color: #bbb0c2;
}
.media-image {
  background: #29222d;
  border: 1px solid #5d4959;
  border-radius: 12px;
}
.media-tile-1 .media-image {
  background: #342936;
}
.media-tile-1 .media-image img {
  object-fit: contain;
  padding: 14px;
  filter: none;
}
.media-tile:hover .media-image {
  border-color: #dfb798;
}
.community {
  background: #1f1922;
  isolation: isolate;
  overflow: hidden;
}
.community-art {
  object-fit: cover;
  object-position: center 70%;
  filter: none;
  opacity: 0.8;
  z-index: -3;
}
.community-shade {
  background: #23172021;
  z-index: -1;
}
.community-core {
  position: absolute;
  right: 2%;
  top: 4%;
  width: min(54%, 740px);
  height: 90%;
  object-fit: contain;
  z-index: -2;
}
.community-content {
  position: relative;
  max-width: 700px;
}
.community h2 {
  color: #f6e8d8;
}
.community h2 > span {
  color: #ddbaa2;
}
.community p:not(.section-label) {
  color: #cec0ca;
}
.footer {
  background: #201b24;
}
.footer-wordmark {
  color: #e7d7c6;
}
.footer-top > div {
  color: #c1abb9;
}
.footer-wordmark > span,
.footer-bottom {
  color: #aa91a5;
}
.media-dialog-inner > img {
  background: #2d2531;
}
.motion-paused .hero-scroll-caption {
  opacity: 0 !important;
}
@media (min-width: 1700px) {
  .hero-copy {
    padding-top: 22svh;
    margin-left: 8%;
  }
  .hero h1 {
    font-size: clamp(76px, 4.25vw, 106px);
  }
  .hero-contract {
    width: 570px;
  }
  .hero-viewport {
    min-height: 900px;
  }
}
@media (min-width: 851px) and (max-height: 820px) {
  .hero-viewport {
    min-height: 760px;
  }
  .hero-copy {
    padding-top: 145px;
  }
  .hero h1 {
    font-size: clamp(45px, 4.2vw, 66px);
  }
  .hero-description {
    margin-top: 18px;
    font-size: 14px;
  }
  .hero-ctas {
    margin-top: 20px;
  }
  .hero-contract {
    margin-top: 15px;
  }
  .hero-footer {
    bottom: calc(16.7vw + 20px);
  }
}
@media (min-width: 851px) and (max-width: 1150px) {
  .hero-copy {
    margin-left: 6%;
    width: 56%;
  }
  .hero h1 {
    font-size: 46px;
  }
  .hero-description {
    max-width: 390px;
  }
  .hero-contract {
    width: 470px;
  }
  .hero-contract-address code {
    font-size: 12px;
  }
  .hero-ctas .trade-button {
    padding-inline: 15px;
    font-size: 10px;
  }
}
@media (max-width: 850px) {
  .hero {
    height: auto;
    min-height: 0;
    max-height: none;
  }
  .hero-viewport {
    position: relative;
    height: 980px;
    min-height: 0;
  }
  .hero-copy {
    padding-top: 155px;
    margin-left: 7%;
    width: 86%;
    max-width: 590px;
  }
  .hero h1 {
    font-size: clamp(42px, 7vw, 60px);
    margin-top: 22px;
  }
  .hero-description {
    margin-top: 20px;
    font-size: 14px;
  }
  .hero-art {
    object-position: 64% center;
    filter: none;
    opacity: 1;
  }
  .hero-footer {
    left: auto;
    right: 7%;
    bottom: 80px;
    flex-direction: column;
    gap: 10px;
    padding: 8px 10px 10px;
    border-radius: 14px;
  }
  .replay-intro {
    font-size: 8px;
    letter-spacing: 0.5px;
    padding-block: 8px;
  }
  .hero-wordmark {
    font-size: 16.7vw;
  }
  .hero-wordmark-wrap {
    bottom: 0;
  }
  .hero-scroll-caption {
    display: none;
  }
  .stage-fallback {
    width: auto;
    height: 32%;
    left: 50%;
    top: 75%;
  }
  .civilization-panel {
    min-height: 225px;
  }
  .community-core {
    right: -7%;
    top: 19%;
    width: 60%;
    opacity: 0.8;
  }
}
@media (max-width: 600px) {
  html {
    scroll-padding-top: 100px;
  }
  .hero-viewport {
    height: 870px;
    min-height: 870px;
  }
  .hero-copy {
    padding-top: 128px;
    width: 86%;
    margin-left: 7%;
  }
  .hero-copy > .section-label {
    font-size: 8px;
    line-height: 1.8;
    max-width: 300px;
    letter-spacing: 0.5px;
  }
  .hero h1 {
    font-size: clamp(34px, 9.25vw, 48px);
    line-height: 1.02;
    letter-spacing: -0.055em;
    margin-top: 18px;
  }
  .hero h1 > span {
    white-space: normal;
    max-width: 350px;
  }
  .hero-description {
    font-size: 12px;
    line-height: 1.7;
    margin-top: 18px;
    max-width: 300px;
  }
  .hero-ctas {
    margin-top: 20px;
  }
  .hero-contract {
    margin-top: 14px;
    width: 100%;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  .hero-contract-address code {
    font-size: clamp(9px, 2.9vw, 12px);
    letter-spacing: -0.1px;
  }
  .hero-socials {
    margin-top: 12px;
  }
  .hero-socials a {
    min-height: 32px;
  }
  .hero-footer {
    right: 5%;
    top: 490px;
    bottom: auto;
    gap: 4px;
  }
  .hero-footer .icon-button {
    height: 44px;
    width: 44px;
  }
  .hero-wordmark {
    font-size: 16.5vw;
    letter-spacing: -0.85vw;
    line-height: 0.9;
  }
  .civilizations {
    border-radius: 10px;
    margin-inline: -4%;
    overflow: hidden;
  }
  .civilizations-image {
    height: 290px;
    object-position: 50% center;
  }
  .civilization-tab {
    min-height: 120px;
    padding: 18px 12px;
  }
  .civilization-tab strong {
    font-size: 15px;
  }
  .civilization-tab small {
    font-size: 8px;
    line-height: 1.8;
  }
  .civilization-dimmer {
    bottom: 120px;
  }
  .civilization-panel {
    min-height: 0;
  }
  .media-tile-1 .media-image {
    height: 370px;
  }
  .community {
    min-height: 760px;
    padding-top: 70px;
  }
  .community h2 {
    font-size: 12vw;
  }
  .community-core {
    width: 60%;
    height: 46%;
    right: 0;
    top: auto;
    bottom: 58px;
    opacity: 1;
  }
  .community-art {
    object-position: 65% center;
    opacity: 0.6;
  }
}
@media (max-width: 360px) {
  .hero-copy {
    padding-top: 122px;
  }
  .hero h1 {
    font-size: 32px;
  }
  .hero-description {
    font-size: 11px;
  }
  .hero-contract-address code {
    font-size: 9px;
  }
  .hero-viewport {
    height: 850px;
    min-height: 850px;
  }
  .hero-footer {
    right: 5%;
    top: 490px;
    bottom: auto;
  }
  .brand > span {
    font-size: 14px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .hero {
    height: auto;
    min-height: 0;
  }
  .hero-viewport {
    position: relative;
  }
  .hero-scroll-caption,
  .replay-intro {
    display: none;
  }
  .hero-copy,
  .hero-wordmark-wrap,
  .hero-art {
    transform: none !important;
    opacity: 1 !important;
  }
}
html body {
  min-width: 0;
}
.header {
  position: absolute;
  top: 24px;
  left: 0;
  right: 0;
  width: calc(100% - 80px);
  max-width: 1440px;
  height: 84px;
  margin-inline: auto;
  padding: 0 14px 0 18px;
  border: 1px solid rgba(255, 247, 236, 0.12);
  border-radius: 0;
  background: #0f0f12b8;
  -webkit-backdrop-filter: blur(24px);
  backdrop-filter: blur(24px);
  box-shadow: inset 0 1px #ffffff06;
}
.brand {
  gap: 12px;
}
.brand img {
  width: 46px;
  height: 46px;
}
.brand > span {
  font-family: Work Sans, sans-serif;
  font-size: 25px;
  font-weight: 800;
  letter-spacing: -0.9px;
}
.desktop-nav {
  gap: 32px;
  font-family: Geist, sans-serif;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: -0.2px;
  color: #d5d2d5;
}
.desktop-nav a {
  padding-block: 16px;
  transition: color 0.2s;
}
.desktop-nav a:hover {
  color: #fff9ef;
}
.header-actions {
  gap: 22px;
}
.language {
  font: 500 12px Geist, sans-serif;
  letter-spacing: 0.25px;
  color: #c0bcbf;
}
.header .button-small {
  min-height: 52px;
  min-width: 168px;
  padding-inline: 26px;
  background: #f4f0e8;
  border-color: #f4f0e8;
  color: #17171b;
  font: 800 14px Work Sans, sans-serif;
  letter-spacing: -0.25px;
}
.header .button-small:hover {
  background: #eac6ad;
  border-color: #eac6ad;
}
.mobile-nav {
  position: absolute;
}
.hero-copy > .section-label {
  font: 800 11px/1.6 Work Sans, sans-serif;
  letter-spacing: 1.55px;
  color: #eac2a8;
}
.hero-shade {
  background: linear-gradient(
    90deg,
    rgba(11, 11, 15, 0.54),
    rgba(12, 12, 17, 0.34) 38%,
    rgba(18, 15, 21, 0.04) 65%,
    transparent 80%
  );
}
.hero h1 {
  font-size: clamp(56px, 4.5vw, 84px);
  line-height: 1.01;
  letter-spacing: -0.055em;
}
.hero-description {
  font: 400 17px/1.65 Geist, sans-serif;
  color: #d3ccd1;
}
.hero-ctas {
  margin-top: 28px;
}
.trade-links {
  display: flex;
  align-items: center;
  gap: 26px;
  width: auto;
}
.trade-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 54px;
  min-width: 0;
  padding: 0;
  flex: 0 0 auto;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #e2dce0;
  font: 500 14px Geist, sans-serif;
  letter-spacing: -0.15px;
  transition: color 0.2s, transform 0.2s, background 0.2s;
}
.trade-button img {
  width: 23px;
  height: 23px;
  border-radius: 0;
}
.trade-button:hover {
  color: #fff7ed;
  background: transparent;
  transform: translateY(-2px);
}
.trade-uniswap {
  gap: 11px;
  min-width: 218px;
  padding-inline: 25px;
  border-radius: 0;
  background: #edc1a5;
  color: #211d20;
  font: 800 15px Work Sans, sans-serif;
  letter-spacing: -0.3px;
}
.trade-uniswap img {
  width: 26px;
  height: 26px;
  border-radius: 0;
}
.trade-uniswap:hover {
  color: #211d20;
  background: #f8d7bd;
}
.trade-primary-short {
  display: none;
}
.trade-long-label {
  display: inline;
}
.trade-short-label {
  display: none;
}
.contract-block {
  width: 100%;
  max-width: 570px;
}
.hero-contract-wrap {
  max-width: 500px;
  margin-top: 26px;
}
.contract-meta {
  display: flex;
  align-items: center;
  gap: 18px;
  font: 500 12px/1.5 Geist, sans-serif;
  color: #c7bec5;
}
.contract-network {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #a6a0ad;
  font-size: 11px;
}
.contract-network i {
  width: 5px;
  height: 5px;
  border-radius: 0;
  background: #b6c5e4;
}
.hero-contract,
.token-strip .contract-copy {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 10px 0 12px;
  background: transparent;
  border: 0;
  border-bottom: 1px solid rgba(234, 215, 208, 0.24);
  border-radius: 0;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  text-align: left;
  transition: border-color 0.2s, color 0.2s;
}
.hero-contract:hover,
.token-strip .contract-copy:hover {
  background: transparent;
  border-color: #e6d4c3;
}
.contract-block .contract-address {
  min-width: 0;
  max-width: none;
  color: #f4ece5;
  font: 400 16px/1.6 JetBrains Mono, monospace;
  letter-spacing: -0.35px;
  overflow-wrap: normal;
}
.contract-address > span {
  white-space: nowrap;
}
.contract-copy-action {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  flex: 0 0 auto;
  font: 500 12px Geist, sans-serif;
  color: #d5c5b7;
}
.contract-copy-action svg {
  flex-shrink: 0;
  margin: 0;
}
.hero-socials {
  gap: 28px;
  margin-top: 19px;
}
.hero-socials a {
  gap: 9px;
  min-height: 32px;
  color: #bab3bd;
  font: 500 13px Geist, sans-serif;
  letter-spacing: 0;
}
.hero-socials a:hover {
  color: #fff5e8;
}
.token-strip {
  grid-template-columns: 180px minmax(320px, 1fr) auto;
  gap: 32px;
  padding: 27px 7%;
  background: #211f25;
  border-color: #eedac81f;
}
.token-identity strong {
  font: 800 16px Work Sans, sans-serif;
  letter-spacing: -0.35px;
}
.token-identity span {
  font: 500 10px Geist, sans-serif;
  letter-spacing: 0.7px;
  color: #aba2ad;
}
.token-contract-wrap {
  max-width: 520px;
}
.token-contract-wrap .contract-meta {
  font-size: 11px;
}
.token-contract-wrap .contract-address {
  font-size: 12px;
}
.token-strip .contract-copy {
  padding-block: 7px;
}
.trade-links-compact {
  gap: 22px;
}
.trade-links-compact .trade-button {
  min-height: 44px;
  padding: 0;
  font-size: 12px;
  gap: 7px;
}
.trade-links-compact .trade-uniswap {
  min-width: 0;
  padding-inline: 18px;
  font: 800 13px Work Sans, sans-serif;
}
.trade-links-compact .trade-button img {
  width: 21px;
  height: 21px;
}
.trade-links-compact .trade-long-label {
  display: inline;
}
.trade-links-compact .trade-short-label {
  display: none;
}
.section-label,
.signal-label,
.world-caption,
.lore-card-heading > span,
.chapter-item .section-label,
.media-tile-label > span,
.community-signature,
.footer-bottom {
  font-family: Geist, sans-serif;
  font-weight: 500;
  letter-spacing: 1px;
}
.section-label {
  font-size: 11px;
}
.section-heading > p,
.lore-card > p,
.civilization-panel p,
.chapter-item p {
  font-family: Geist, sans-serif;
  font-weight: 400;
}
.footer-top > div {
  font-family: Geist, sans-serif;
  font-size: 14px;
}
.footer-bottom {
  font-size: 10px;
}
.header a:focus-visible,
.header button:focus-visible,
.trade-button:focus-visible,
.hero-contract:focus-visible,
.contract-copy:focus-visible {
  outline: 2px solid #f4d1b7;
  outline-offset: 5px;
}
@media (min-width: 851px) and (max-height: 820px) {
  .hero-copy {
    padding-top: 139px;
  }
  .hero h1 {
    font-size: clamp(50px, 4.3vw, 66px);
  }
  .hero-description {
    font-size: 16px;
    margin-top: 19px;
  }
  .hero-ctas {
    margin-top: 23px;
  }
  .hero-contract-wrap {
    margin-top: 22px;
  }
  .hero-socials {
    margin-top: 15px;
  }
}
@media (min-width: 851px) and (max-width: 1150px) {
  .header {
    width: calc(100% - 48px);
    padding-left: 14px;
    height: 78px;
  }
  .brand > span {
    font-size: 21px;
  }
  .brand img {
    width: 40px;
    height: 40px;
  }
  .desktop-nav {
    gap: 20px;
    font-size: 13px;
  }
  .header-actions {
    gap: 14px;
  }
  .header .button-small {
    min-width: 145px;
    padding-inline: 18px;
    font-size: 12px;
  }
  .trade-links {
    gap: 18px;
  }
  .trade-uniswap {
    min-width: 195px;
    padding-inline: 20px;
    font-size: 14px;
  }
  .trade-button {
    font-size: 13px;
  }
  .token-strip {
    grid-template-columns: 155px 1fr;
    gap: 18px 28px;
  }
  .token-strip > .trade-links {
    grid-column: 2;
    padding: 0;
  }
}
@media (max-width: 850px) {
  .header {
    top: 18px;
    width: calc(100% - 40px);
    height: 76px;
    padding: 0 13px;
  }
  .brand > span {
    font-size: 22px;
  }
  .brand img {
    width: 40px;
    height: 40px;
  }
  .header-actions {
    gap: 10px;
  }
  .language {
    font-size: 11px;
  }
  .mobile-nav {
    top: 105px;
    left: 20px;
    right: 20px;
    background: #111015f7;
    border-color: #fff7ec26;
    border-radius: 0;
    padding: 12px 26px 22px;
  }
  .mobile-nav > a {
    min-height: 52px;
    display: flex;
    align-items: center;
    font: 500 17px Geist, sans-serif;
  }
  .hero h1 {
    font-size: clamp(43px, 7vw, 60px);
  }
  .token-strip {
    grid-template-columns: 155px 1fr;
    gap: 20px;
  }
  .token-strip > .trade-links {
    grid-column: 2;
    padding: 0;
  }
}
@media (max-width: 600px) {
  .header {
    top: 16px;
    width: calc(100% - 32px);
    height: 72px;
    padding: 0 11px;
  }
  .brand {
    gap: 9px;
  }
  .brand > span {
    font-size: 20px;
    letter-spacing: -0.7px;
  }
  .brand img {
    width: 37px;
    height: 37px;
  }
  .header-actions {
    gap: 5px;
  }
  .language {
    min-width: 54px;
    font-size: 10px;
    letter-spacing: 0;
  }
  .menu-toggle {
    border: 0;
    width: 40px;
    height: 44px;
    background: transparent;
  }
  .mobile-nav {
    top: 100px;
    left: 16px;
    right: 16px;
  }
  .hero-copy {
    padding-top: 126px;
  }
  .hero-copy > .section-label {
    font-size: 9px;
    line-height: 1.7;
    letter-spacing: 0.8px;
  }
  .hero h1 {
    font-size: clamp(34px, 9.25vw, 48px);
    margin-top: 18px;
  }
  .hero-description {
    font-size: 13px;
    line-height: 1.65;
    margin-top: 18px;
  }
  .hero-ctas {
    margin-top: 22px;
  }
  .trade-links {
    width: 100%;
    gap: 17px;
    justify-content: flex-start;
  }
  .trade-button {
    min-height: 50px;
    min-width: 0;
    padding: 0;
    font-size: 13px;
    gap: 7px;
    flex: 0 0 auto;
  }
  .trade-button img {
    width: 22px;
    height: 22px;
  }
  .trade-uniswap {
    min-width: 111px;
    padding-inline: 18px;
    font: 800 15px Work Sans, sans-serif;
    gap: 9px;
  }
  .trade-uniswap img {
    width: 24px;
    height: 24px;
  }
  .trade-primary-label {
    display: none;
  }
  .trade-primary-short {
    display: inline;
  }
  .trade-long-label {
    display: none;
  }
  .trade-short-label {
    display: inline;
  }
  .hero-contract-wrap {
    margin-top: 22px;
  }
  .contract-meta {
    font-size: 11px;
    gap: 15px;
  }
  .contract-network {
    font-size: 10px;
  }
  .hero-contract,
  .token-strip .contract-copy {
    min-height: 48px;
    padding: 8px 0 10px;
    gap: 15px;
  }
  .contract-block .contract-address {
    font-size: 12px;
    line-height: 1.65;
    letter-spacing: -0.3px;
  }
  .contract-copy-action > span {
    display: none;
  }
  .hero-socials {
    margin-top: 13px;
    gap: 26px;
  }
  .hero-socials a {
    font-size: 12px;
  }
  .token-strip {
    display: flex;
    gap: 22px;
    padding: 27px 7%;
  }
  .token-contract-wrap {
    width: 100%;
  }
  .token-strip > .trade-links {
    width: 100%;
    gap: 20px;
  }
  .trade-links-compact .trade-button {
    font-size: 13px;
    min-height: 48px;
  }
  .trade-links-compact .trade-uniswap {
    padding-inline: 18px;
    min-width: 111px;
    font-size: 15px;
  }
  .trade-links-compact .trade-long-label {
    display: none;
  }
  .trade-links-compact .trade-short-label {
    display: inline;
  }
  .trade-links-compact .trade-button img {
    width: 22px;
    height: 22px;
  }
  .section-label {
    font-size: 10px;
  }
  .world-caption,
  .signal-label {
    font-size: 10px;
    letter-spacing: 0.6px;
  }
  .civilization-tab small {
    font-family: Geist, sans-serif;
    font-size: 10px;
    line-height: 1.6;
  }
  .lore-card-heading > span {
    font-size: 10px;
    letter-spacing: 0.3px;
  }
}
@media (max-width: 360px) {
  .cinematic-stage {
    top: 100px;
  }
  .header {
    padding-inline: 9px;
  }
  .brand > span {
    font-size: 17px;
  }
  .brand img {
    width: 33px;
    height: 33px;
  }
  .hero-copy {
    padding-top: 124px;
  }
  .hero-copy > .section-label {
    font-size: 8px;
    letter-spacing: 0.5px;
  }
  .hero h1 {
    font-size: 32px;
  }
  .trade-links,
  .token-strip > .trade-links {
    gap: 12px;
  }
  .trade-button,
  .trade-links-compact .trade-button {
    font-size: 12px;
    gap: 6px;
  }
  .trade-uniswap,
  .trade-links-compact .trade-uniswap {
    min-width: 100px;
    padding-inline: 14px;
    font-size: 14px;
  }
  .trade-button img,
  .trade-links-compact .trade-button img {
    width: 20px;
    height: 20px;
  }
  .contract-block .contract-address {
    font-size: 11px;
  }
}
:root {
  --paper: #edf5ff;
  --ice: #bddcff;
  --lavender: #b6c8ed;
  --ink: #07101e;
  --muted: #a1b2ca;
  --line: rgba(164, 196, 239, 0.18);
  --coral: #c0d7f5;
}
.site,
.site *,
.site *:before,
.site *:after {
  border-radius: 0 !important;
}
body,
.site {
  background: #07101e;
  color: #edf5ff;
}
.header {
  background: #050f1dc7;
  border: 0;
  border-bottom: 1px solid rgba(174, 206, 250, 0.2);
  box-shadow: none;
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}
.desktop-nav {
  color: #c1d0e4;
}
.desktop-nav a:hover,
.language:hover {
  color: #f2f7ff;
}
.language {
  color: #a7bad3;
}
.button,
.trade-uniswap,
.header .button-small {
  background: #d9e9fd;
  border-color: #d9e9fd;
  color: #0a1930;
  box-shadow: none;
}
.button:hover,
.trade-uniswap:hover,
.header .button-small:hover {
  background: #f0f6ff;
  border-color: #f0f6ff;
  color: #0a1930;
}
.button-outline {
  background: transparent;
  border-color: #819ec5;
  color: #e1eeff;
}
.button-outline:hover {
  background: #d9e9fd;
  color: #0a1930;
}
.trade-button:not(.trade-uniswap) {
  background: transparent;
  color: #d2e1f5;
}
.trade-button:not(.trade-uniswap):hover {
  background: transparent;
  color: #fff;
}
.hero {
  background: #07101e;
}
.hero-shade {
  background: linear-gradient(
    90deg,
    rgba(3, 11, 24, 0.64),
    rgba(4, 14, 31, 0.4) 38%,
    rgba(5, 18, 37, 0.1) 65%,
    transparent 82%
  );
}
.hero h1 {
  color: #f1f6ff;
}
.hero h1 > span {
  color: #cbdfff;
}
.hero-copy > .section-label {
  color: #b7d8ff;
}
.hero-description {
  color: #c2d0e3;
}
.hero-wordmark {
  color: #dceafa;
}
.hero-scroll-caption > span {
  color: #a8c5e9;
}
.hero-scroll-caption p {
  color: #edf5ff;
}
.hero-scroll-caption em {
  color: #b8d5ff;
}
.contract-meta {
  color: #bacce5;
}
.contract-network {
  color: #91a9ca;
}
.contract-network i {
  background: #9bc2f5;
}
.contract-block .contract-address {
  color: #eff6ff;
}
.hero-contract,
.token-strip .contract-copy {
  border-color: #aecefa4d;
}
.hero-contract:hover,
.token-strip .contract-copy:hover {
  background: transparent;
  border-color: #c7e0ff;
}
.contract-copy-action {
  color: #bfd5f2;
}
.hero-socials a {
  color: #b3c5df;
}
.hero-socials a:hover {
  color: #f1f7ff;
}
.hero-footer {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.hero-footer .icon-button,
.dialog-close,
.menu-toggle {
  border: 0;
  background: transparent;
  box-shadow: none;
  color: #dcecff;
}
.hero-footer .icon-button:hover,
.dialog-close:hover,
.menu-toggle:hover {
  background: #89b2eb1f;
}
.replay-intro {
  font-family: Geist, sans-serif;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.5px;
  color: #afc5e1;
  border-color: #aecefa5c;
}
.replay-intro:hover {
  color: #f1f7ff;
  border-color: #c7e0ff;
}
.token-strip {
  background: #0b1729;
  border-color: #aecefa29;
}
.token-identity span {
  color: #9fb3d1;
}
.world,
.lore,
.media {
  background: #081323;
}
.section-label,
.signal-label {
  color: #a5bddc;
}
.section-heading > p,
.origin-copy > p + p,
.lore-card > p,
.civilization-panel p {
  color: #a9bdd7;
}
.origin-copy > p {
  color: #dce8f7;
}
.origin-facts b {
  color: #c4ddff;
}
.origin-facts > span,
.source-link > span {
  color: #8fa8ca;
}
.source-link,
.inline-link {
  color: #c7defb;
}
.inline-link {
  border-color: #5d7da5;
}
.inline-link:hover {
  color: #f1f7ff;
}
.belief-strip {
  background: #c6d9f1;
  border-color: #c6d9f1;
}
.belief-strip > div > span > span {
  color: #0a1b35;
}
.civilizations {
  background: #0a172b;
  border: 0;
  box-shadow: none;
}
.civilization-dimmer {
  background: #040f215c;
}
.side-1 .civilization-dimmer {
  background: #0611246b;
}
.civilization-tab {
  background: #071326f0;
  border-color: #2c4565;
}
.civilization-tab[aria-selected="true"],
.side-1 .civilization-tab[aria-selected="true"] {
  background: #162d4bf2;
  border-top-color: #c4dfff;
}
.civilization-tab:hover {
  background: #1c3555f7;
}
.civilization-tab small {
  color: #afc4df;
}
.choice-indicator {
  color: #d5e7ff;
  border-color: #668bb8;
}
.side-1 .civilization-tab[aria-selected="true"] .choice-indicator {
  color: #d5e7ff;
  border-color: #88afe0;
}
.civilization-panel .micro-copy {
  color: #8fa9cd;
}
.lore-image,
.media-image {
  border: 0;
  box-shadow: none;
}
.lore-image > span {
  background: #040e1ee0;
}
.lore-card-heading > span {
  color: #9fbfe9;
}
.chapters {
  background: #0c192d;
}
.featured-chapter {
  background: transparent;
  border: 0;
  box-shadow: none;
}
.dispatch-image {
  background: #071322;
}
.dispatch-copy > p,
.chapter-item p {
  color: #afc3de;
}
.chapter-number {
  color: #7599c6;
}
.chapter-item .section-label,
.dispatch-copy .section-label {
  color: #94b6e0;
}
.chapter-item:hover {
  border-color: #94b6e0;
}
.secondary-source {
  color: #acc8eb;
}
.media-image,
.media-tile-1 .media-image {
  background: #0b1a30;
}
.media-open {
  border: 0;
  background: transparent;
}
.media-tile:hover .media-open {
  background: #091c36b8;
}
.media-tile-label > span {
  color: #92add0;
}
.community {
  background: #06101e;
}
.community-shade {
  background: #030d1d3b;
}
.community h2 {
  color: #edf5ff;
}
.community h2 > span {
  color: #b8d9ff;
}
.community p:not(.section-label) {
  color: #bdcfe8;
}
.community-signature {
  color: #90a9cd;
}
.footer {
  background: #060e1a;
}
.footer-wordmark {
  color: #deedff;
}
.footer-top > div,
.footer-wordmark > span,
.footer-bottom {
  color: #a0b7d6;
}
.footer-top > div a:hover {
  color: #f2f7ff;
}
.media-dialog {
  background: #09172b;
  border-color: #47678f;
}
.media-dialog::backdrop {
  background: #020812e0;
}
.media-dialog-inner > img {
  background: #09172b;
}
.media-dialog-bottom p {
  color: #a9bedc;
}
.toast {
  background: #d7e7fd;
  color: #0a1b32;
  border: 0;
  box-shadow: none;
}
.header a:focus-visible,
.header button:focus-visible,
.trade-button:focus-visible,
.hero-contract:focus-visible,
.contract-copy:focus-visible {
  outline-color: #c4e0ff;
}
@media (max-width: 850px) {
  .mobile-nav {
    background: #050f1ffa;
    border-color: #9dc1ef42;
    box-shadow: none;
  }
  .mobile-nav > a:last-child {
    color: #c4ddff;
  }
  .replay-intro {
    font-size: 10px;
  }
}
.media-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 30px;
}
.media-tile-0 {
  grid-column: 1 / -1;
  grid-row: auto;
}
.media-tile-0 .media-image {
  height: auto;
  aspect-ratio: 3 / 1;
  background: #06101e;
}
.media-tile-0 .media-image img {
  object-fit: contain;
  object-position: center;
  padding: 0;
  transform: none;
}
.media-tile-0:hover .media-image img {
  transform: none;
}
.media-tile-1,
.media-tile-2 {
  grid-column: auto;
  grid-row: auto;
}
.media-tile-1 .media-image,
.media-tile-2 .media-image {
  height: clamp(280px, 28vw, 460px);
}
@media (max-width: 600px) {
  .media-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 28px;
  }
  .media-tile-0 {
    grid-column: auto;
  }
  .media-tile-0 .media-image {
    height: auto;
    aspect-ratio: 3 / 1;
  }
  .media-tile-1 .media-image {
    height: 330px;
  }
  .media-tile-2 .media-image {
    height: 240px;
  }
}
.origin {
  grid-template-rows: auto auto;
  row-gap: 52px;
  align-items: start;
}
.origin-artwork {
  grid-column: 1/-1;
  width: 100%;
  min-width: 0;
  height: auto;
  min-height: min-content;
  align-self: start;
  margin: 0;
  overflow: visible;
  background: #061225;
}
.origin-artwork > img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 2/1;
  object-fit: contain;
}
.origin-artwork figcaption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 25px;
  padding: 20px 0 0;
  background: #091321;
}
.origin-artwork figcaption > div {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.origin-artwork figcaption span {
  font: 500 10px/1.6 Geist, sans-serif;
  letter-spacing: 1.3px;
  color: #8da8cd;
}
.origin-artwork figcaption strong {
  font: 500 13px/1.6 Geist, sans-serif;
  color: #d8e7fb;
  letter-spacing: 0.2px;
}
.origin-artwork .inline-link {
  flex-shrink: 0;
  font: 500 13px/1.6 Geist, sans-serif;
}
.media-tile-3 {
  grid-column: 1/-1;
  grid-row: auto;
}
.media-tile-3 .media-image {
  height: auto;
  aspect-ratio: 2/1;
  background: #061225;
}
.media-tile-3 .media-image img {
  object-fit: contain;
  transform: none;
  padding: 0;
}
.media-tile-3:hover .media-image img {
  transform: none;
}
.media-dialog-actions {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-shrink: 0;
}
.artwork-credits {
  font: 500 11px/1.6 Geist, sans-serif;
  color: #afc6e8;
  text-decoration: underline;
  text-underline-offset: 4px;
}
.artwork-credits:hover {
  color: #f1f7ff;
}
@media (max-width: 600px) {
  .origin {
    row-gap: 32px;
  }
  .origin-artwork figcaption {
    align-items: flex-start;
    gap: 16px;
    padding-top: 17px;
  }
  .origin-artwork figcaption span {
    font-size: 9px;
    letter-spacing: 0.6px;
  }
  .origin-artwork figcaption strong {
    font-size: 10px;
    max-width: 225px;
  }
  .origin-artwork .inline-link {
    font-size: 10px;
  }
  .media-tile-3 {
    grid-column: auto;
  }
  .media-dialog-actions {
    margin-top: 18px;
    flex-wrap: wrap;
    gap: 16px;
  }
  .media-dialog-actions .button {
    margin-top: 0;
  }
}
img[data-deferred="waiting"] {
  color: transparent;
}
.lore-image {
  aspect-ratio: 1.48;
}
.lore-image > img {
  height: 100%;
}
.belief-strip > div {
  animation-play-state: paused;
}
.site:not(.motion-paused) .belief-strip[data-in-view] > div {
  animation-play-state: running;
}
@media (prefers-reduced-motion: reduce) {
  .site .belief-strip > div {
    animation-play-state: paused;
  }
}
.origin > div > .section-label,
.section-heading > div > .section-label {
  display: flex;
  align-items: center;
  gap: 14px;
  width: fit-content;
  max-width: 100%;
  font: 600 11px/1.6 Geist, sans-serif;
  letter-spacing: 1.1px;
  color: #adc8e8;
}
.origin > div > .section-label:after,
.section-heading > div > .section-label:after {
  content: "";
  flex: 0 0 48px;
  height: 1px;
  background: #527197;
}
.lore .section-heading {
  margin-bottom: 40px;
}
.lore-grid {
  column-gap: 28px;
  row-gap: 44px;
}
.lore-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.lore-image {
  flex-shrink: 0;
}
.lore-image > span {
  left: 16px;
  bottom: 16px;
  padding: 8px 10px;
  font: 500 10px/1.4 JetBrains Mono, monospace;
  letter-spacing: 0.3px;
}
.lore-card-heading {
  border-top: 0;
  margin-top: 0;
  padding-top: 24px;
}
.lore-card-heading h3 {
  font-size: clamp(26px, 2vw, 30px);
  line-height: 1.15;
  letter-spacing: -0.8px;
}
.lore-card-heading > span {
  display: block;
  margin-top: 12px;
  font: 500 11px/1.6 Geist, sans-serif;
  letter-spacing: 0.65px;
  color: #a8c5e9;
}
.lore-card > p {
  min-height: 0;
  margin: 16px 0 18px;
  font: 400 15px/1.8 Geist, sans-serif;
  color: #b8cbe3;
}
.lore-card > .inline-link {
  align-self: flex-start;
  min-height: 44px;
  margin-top: auto;
  padding-block: 12px;
  font: 600 13px/1.5 Geist, sans-serif;
  color: #d8e9ff;
}
.media-tile-label {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 6px 18px;
  padding-block: 20px;
  transition: border-color 0.2s ease;
}
.media-tile-label strong {
  font: 800 16px/1.45 Work Sans, sans-serif;
  letter-spacing: -0.3px;
}
.media-tile-label > span {
  font: 400 12px/1.6 Geist, sans-serif;
  color: #a9c0de;
}
.media-open {
  width: 44px;
  height: 44px;
  top: 16px;
  right: 16px;
  border: 1px solid #607f9f;
  background: #051020b8;
  color: #e0efff;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.media-tile:focus-visible,
.lore-image:focus-visible,
.lore-card > .inline-link:focus-visible {
  outline: 2px solid #c7e0ff;
  outline-offset: 6px;
}
.media-tile:focus-visible .media-open {
  background: #d6e8ff;
  border-color: #d6e8ff;
  color: #0a1b32;
}
@media (hover: hover) and (pointer: fine) {
  .media-tile:hover .media-open {
    background: #d6e8ff;
    border-color: #d6e8ff;
    color: #0a1b32;
  }
  .media-tile:hover .media-tile-label {
    border-color: #7299c4;
  }
}
@media (max-width: 600px) {
  .origin > div > .section-label,
  .section-heading > div > .section-label {
    gap: 10px;
    font-size: 10px;
    letter-spacing: 0.8px;
  }
  .origin > div > .section-label:after,
  .section-heading > div > .section-label:after {
    flex-basis: 24px;
  }
  .lore .section-heading {
    margin-bottom: 32px;
  }
  .lore-grid {
    row-gap: 42px;
  }
  .lore-card-heading {
    padding-top: 20px;
  }
  .lore-card-heading h3 {
    font-size: 28px;
  }
  .lore-card-heading > span {
    margin-top: 10px;
  }
  .lore-card > p {
    margin-block: 14px;
  }
  .media-tile-label {
    padding-block: 17px;
  }
  .media-tile-label strong {
    font-size: 14px;
  }
  .media-tile-label > span {
    font-size: 11px;
  }
  .media-open {
    top: 12px;
    right: 12px;
  }
  .origin-artwork figcaption {
    flex-wrap: wrap;
    row-gap: 12px;
  }
  .origin-artwork figcaption span {
    font-size: 10px;
  }
  .origin-artwork figcaption strong {
    font-size: 11px;
  }
  .origin-artwork .inline-link {
    font-size: 12px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .media-open,
  .media-tile-label {
    transition: none;
  }
}
.motion-paused .media-open,
.motion-paused .media-tile-label {
  transition: none;
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}
.mobile-prototype {
  width: min(100vw, 390px);
  height: min(100dvh, 844px);
  margin-inline: auto;
  overflow: hidden;
  position: relative;
}