:root {
  color-scheme: dark;
  --bg: #100d1d;
  --bg2: #151128;
  --panel: #1b1730;
  --text: #f8f5ff;
  --muted: #a9a3bf;
  --purple: #b9a0ff;
  --purple-bright: #d0bdff;
  --mint: #9cf4cf;
  --pink: #edb4ed;
  --gold: #f2d59b;
  --line: rgba(218, 205, 255, .14);
  --max: 1200px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body {
  margin: 0; overflow-x: hidden; background: var(--bg); color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.65; -webkit-font-smoothing: antialiased;
}
body::selection { background: var(--purple); color: #171126; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible { outline: 2px solid var(--mint); outline-offset: 5px; }
.ambient { position: fixed; z-index: -2; width: 34rem; height: 34rem; border-radius: 50%; filter: blur(110px); opacity: .09; pointer-events: none; }
.ambient-a { background: #8155f6; top: -15rem; left: -12rem; }
.ambient-b { background: #47dcb0; bottom: -20rem; right: -14rem; }
.noise { position: fixed; z-index: 20; inset: 0; opacity: .025; pointer-events: none; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.65'/%3E%3C/svg%3E"); }
.scroll-progress { position: fixed; z-index: 100; top: 0; left: 0; height: 2px; width: 0; background: linear-gradient(90deg, var(--purple), var(--mint)); box-shadow: 0 0 12px #a78bfa; }
.nav { width: 100%; max-width: var(--max); margin: auto; padding: 18px 30px; display: flex; align-items: center; justify-content: space-between; gap: 24px; position: relative; z-index: 50; }
.brand { display: inline-flex; align-items: center; gap: 11px; flex-shrink: 0; }
.brand-cube { display: grid; width: 43px; height: 43px; filter: drop-shadow(0 5px 14px #a78bfa30); }
.brand-cube svg { width: 100%; height: 100%; }
.brand-copy { display: flex; flex-direction: column; line-height: 1.3; }
.brand-copy strong { font-size: .84rem; letter-spacing: .15em; font-weight: 950; }
.brand-dot { color: var(--mint); }
.brand-copy small { color: #a9a1c4; font-size: .59rem; letter-spacing: .25em; font-weight: 650; margin-top: 3px; }
.nav-links { display: flex; align-items: center; gap: clamp(17px, 2.4vw, 32px); }
.nav-links > a { color: #c0b9d4; font-size: .77rem; font-weight: 650; transition: color .2s; }
.nav-links > a:hover { color: white; }
.nav-links .nav-cta { color: #171126; padding: 11px 16px; background: var(--mint); border-radius: 5px; box-shadow: 0 0 25px #9cf4cf12; }
.nav-cta span { padding-left: 10px; }
.menu-toggle { display: none; background: transparent; border: 1px solid var(--line); border-radius: 5px; padding: 10px; width: 44px; height: 42px; }
.menu-toggle span { display: block; width: 19px; height: 2px; background: white; margin: 4px auto; }
.hero { position: relative; min-height: 730px; overflow: hidden; border-top: 1px solid #d9c7ff0b; border-bottom: 1px solid var(--line); background: radial-gradient(ellipse at 50% 30%, #37245e66, transparent 52%), linear-gradient(180deg, #171127 0%, #100d1d 84%); isolation: isolate; }
.hero-grid { position: absolute; inset: 20% -10% -10%; z-index: -1; opacity: .12; transform: perspective(460px) rotateX(61deg) scale(1.3); transform-origin: center top; background-image: linear-gradient(#a78bfa33 1px, transparent 1px), linear-gradient(90deg, #a78bfa33 1px, transparent 1px); background-size: 50px 50px; mask-image: linear-gradient(transparent, #000 20%, #000 70%, transparent); }
.hero-sun { position: absolute; z-index: -1; width: 390px; height: 390px; top: 20%; left: 50%; transform: translateX(-50%); border-radius: 50%; background: #9872ff0a; box-shadow: 0 0 90px #9c80ff0c, inset 0 0 70px #bda7ff08; }
.hero-stars { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.hero-star { position: absolute; width: 3px; height: 3px; background: #d6c8ff; box-shadow: 0 0 9px #b9a0ff; animation: twinkle 3s ease-in-out infinite alternate; }
.hero-copy { position: relative; z-index: 4; max-width: 800px; margin: 0 auto; padding: 82px 24px 0; text-align: center; }
.status-pill { display: inline-flex; align-items: center; gap: 9px; border: 1px solid #b9a0ff30; border-radius: 3px; background: #19142aaf; padding: 7px 11px; font-size: .59rem; font-weight: 800; letter-spacing: .14em; color: #d8d0ed; }
.status-light { display: inline-block; width: 7px; height: 7px; flex-shrink: 0; border-radius: 50%; background: var(--mint); box-shadow: 0 0 11px #9cf4cf; animation: statusPulse 2s ease-in-out infinite; }
.pill-divider { height: 13px; width: 1px; background: var(--line); margin: 0 3px; }
.pill-version { color: var(--mint); }
.hero-overline, .eyebrow { color: var(--mint); font-size: .67rem; font-weight: 850; letter-spacing: .22em; }
.hero-overline { margin: 28px 0 15px; }
.hero-overline span { margin-right: 9px; }
h1, h2, h3, p { margin-top: 0; }
.hero h1 { margin: 0; font-size: clamp(3.4rem, 8.5vw, 7.7rem); font-weight: 1000; letter-spacing: -.085em; line-height: .94; text-shadow: 0 7px 45px #a78bfa14; }
.hero h1 span, .section-top h2 span, .manifesto h2 span, .join-content h2 span, .community-copy h2 span { color: var(--purple); }
.hero-description { max-width: 565px; margin: 24px auto 0; color: #b7b0cb; font-size: .96rem; line-height: 1.85; }
.hero-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.button { display: inline-flex; justify-content: center; align-items: center; gap: 13px; min-height: 47px; padding: 13px 18px; border: 1px solid transparent; border-radius: 4px; font-size: .68rem; font-weight: 900; letter-spacing: .1em; transition: transform .22s, background .22s, box-shadow .22s, border-color .22s; }
.button:hover { transform: translateY(-3px); }
.button-primary { background: var(--mint); color: #10251e; box-shadow: 0 8px 30px #9cf4cf14; }
.button-primary:hover { background: #c1ffe4; box-shadow: 0 10px 35px #9cf4cf2a; }
.button-icon { font-size: 1rem; }
.button-arrow { margin-left: 5px; font-size: .9rem; }
.button-glass { border-color: #d6c8ff29; background: #ffffff05; color: #f0ebff; }
.button-glass:hover { border-color: #b9a0ff77; background: #b9a0ff0c; }
.play-icon { font-size: .7rem; color: var(--purple); }
.hero-meta { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 13px; margin-top: 26px; color: #8d86a5; font-size: .55rem; font-weight: 800; letter-spacing: .12em; }
.meta-mark { display: flex; align-items: center; gap: 8px; }
.meta-pixel { width: 7px; height: 7px; background: var(--purple); box-shadow: 0 0 10px #b9a0ff80; }
.meta-separator { width: 1px; height: 13px; background: var(--line); }
.meta-world i { color: var(--mint); font-style: normal; margin: 0 5px; }
.scene { position: absolute; z-index: 1; left: 50%; bottom: -30px; width: min(1040px, 100%); height: 310px; transform: translateX(-50%); pointer-events: none; overflow: hidden; perspective: 700px; }
.scene-moon { position: absolute; left: 50%; top: 5px; width: 120px; height: 120px; transform: translateX(-50%); border-radius: 50%; background: radial-gradient(circle at 35% 30%, #f0eaff, #c3aaff 35%, #9577e9 65%, #5d468f); opacity: .55; box-shadow: 0 0 55px #a78bfa35; }
.scene-ring { position: absolute; left: 50%; top: 35px; width: 310px; height: 95px; border: 1px solid #b9a0ff22; border-radius: 50%; transform: translateX(-50%) rotateX(68deg); }
.ring-two { width: 400px; height: 130px; top: 18px; border-color: #9cf4cf16; transform: translateX(-50%) rotateX(68deg) rotateZ(-13deg); }
.scene-cloud { position: absolute; width: 180px; height: 23px; background: #6d5b9a18; box-shadow: 25px -14px 0 #6d5b9a15, 55px 0 0 #6d5b9a10; animation: cloudFloat 12s ease-in-out infinite alternate; }
.cloud-one { top: 120px; left: 9%; }
.cloud-two { top: 170px; right: 8%; transform: scale(.7); animation-delay: -5s; }
.mountain { position: absolute; bottom: 16px; clip-path: polygon(0 100%, 0 66%, 15% 66%, 15% 44%, 28% 44%, 28% 23%, 42% 23%, 42% 0, 60% 0, 60% 21%, 74% 21%, 74% 48%, 88% 48%, 88% 67%, 100% 67%, 100% 100%); }
.mountain-back { left: 21%; width: 58%; height: 215px; background: linear-gradient(90deg, #2e2449, #3c2d5a 50%, #251f3e); opacity: .8; }
.mountain-back::after { content: ""; position: absolute; inset: 38% 0 0; background: repeating-linear-gradient(90deg, #1b1830 0 21px, transparent 21px 44px), repeating-linear-gradient(0deg, #19162d 0 20px, transparent 20px 43px); opacity: .4; }
.mountain-cap { position: absolute; z-index: 2; top: 0; left: 42%; width: 18%; height: 22%; background: #b5a0ed; opacity: .45; }
.mountain-left { left: 0; bottom: 7px; width: 40%; height: 180px; background: linear-gradient(90deg, #201b35, #34274f); }
.mountain-right { right: 0; bottom: 7px; width: 39%; height: 166px; background: linear-gradient(90deg, #30254b, #211a37); }
.mountain-left .mountain-cap, .mountain-right .mountain-cap { background: #8d78c5; opacity: .65; }
.mountain-block { position: absolute; z-index: 3; width: 30px; height: 30px; background: #493766; border: 1px solid #a78bfa15; }
.block-a { left: 42%; top: 45%; }.block-b { left: 57%; top: 65%; background: #9b83dc; opacity: .4; }.block-c { left: 30%; top: 53%; background: #9cf4cf; opacity: .25; }
.floating-island { position: absolute; z-index: 5; left: 50%; bottom: 31px; width: 260px; height: 125px; transform: translateX(-50%); animation: islandFloat 6s ease-in-out infinite; filter: drop-shadow(0 15px 25px #0005); }
.island-grass { position: absolute; z-index: 4; top: 10px; left: 12px; width: 236px; height: 36px; clip-path: polygon(12% 0, 83% 0, 100% 45%, 87% 100%, 12% 100%, 0 45%); background: linear-gradient(180deg, #a1e7b6, #548c83); }
.island-grass::after { content: ""; position: absolute; inset: 0; opacity: .45; background: repeating-linear-gradient(90deg, transparent 0 22px, #d4ffd322 22px 24px), repeating-linear-gradient(0deg, transparent 0 13px, #173c392e 13px 15px); }
.island-soil { position: absolute; z-index: 3; top: 38px; left: 21px; width: 218px; height: 54px; clip-path: polygon(0 0, 100% 0, 86% 100%, 16% 100%); background: repeating-linear-gradient(0deg, #45305c 0 14px, #35274c 14px 16px); }
.island-soil::after { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, transparent 0 26px, #1b16301c 26px 28px); }
.island-rock { position: absolute; z-index: 5; background: #44365d; border: 1px solid #b9a0ff20; }
.rock-one { top: 2px; left: 63px; width: 22px; height: 20px; }.rock-two { top: 3px; right: 48px; width: 28px; height: 16px; background: #75649c; }
.tiny-tree { position: absolute; z-index: 8; top: -32px; width: 30px; height: 47px; }
.tiny-tree i { position: absolute; bottom: 0; left: 12px; width: 7px; height: 22px; background: #4b3551; }
.tiny-tree b { position: absolute; top: 0; left: 0; width: 30px; height: 30px; background: #9cf4cf; clip-path: polygon(30% 0, 70% 0, 70% 20%, 100% 20%, 100% 65%, 80% 65%, 80% 100%, 20% 100%, 20% 65%, 0 65%, 0 20%, 30% 20%); box-shadow: 0 0 15px #9cf4cf66; }
.tree-one { left: 45px; top: -27px; transform: scale(.8); }.tree-two { right: 38px; top: -30px; transform: scale(1.1); }
.crystal { position: absolute; z-index: 9; width: 19px; height: 53px; top: -40px; clip-path: polygon(50% 0, 100% 27%, 72% 100%, 29% 100%, 0 26%); background: linear-gradient(90deg, #6f55ce, #e0caff 45%, #a48bff); filter: drop-shadow(0 0 10px #b9a0ff); animation: crystalGlow 3s ease-in-out infinite alternate; }
.crystal i { position: absolute; inset: 0; background: linear-gradient(90deg, transparent 45%, #fff9 50%, transparent 60%); }
.crystal-large { left: 119px; top: -42px; width: 24px; height: 63px; }
.crystal-small { left: 145px; top: -24px; transform: scale(.63) rotate(8deg); animation-delay: -1s; }
.crystal-mint { left: 101px; top: -20px; transform: scale(.6) rotate(-8deg); background: linear-gradient(90deg, #4baf9e, #d0fff0 45%, #64d7bc); filter: drop-shadow(0 0 10px #9cf4cf); animation-delay: -2s; }
.island-light { position: absolute; z-index: 2; top: -17px; left: 50px; width: 160px; height: 80px; background: #9cf4cf20; filter: blur(24px); }
.scene-particle { position: absolute; z-index: 7; width: 4px; height: 4px; background: var(--mint); box-shadow: 0 0 12px var(--mint); animation: drift 5s ease-in-out infinite; }
.particle-one { left: 30%; top: 47%; }.particle-two { left: 67%; top: 32%; animation-delay: -1s; }.particle-three { left: 75%; top: 61%; animation-delay: -3s; }.particle-four { left: 24%; top: 69%; animation-delay: -2s; }.particle-five { left: 57%; top: 40%; animation-delay: -4s; }.particle-six { left: 44%; top: 60%; animation-delay: -1.5s; }
.scene-label { position: absolute; z-index: 9; top: 55%; font-size: .54rem; letter-spacing: .15em; color: #b9b0d4; border: 1px solid #c7b3ff26; background: #171127c9; padding: 7px 10px; }
.scene-label b { color: var(--mint); font-weight: 800; margin-left: 12px; }
.label-left { left: 9%; }.label-right { right: 9%; }.label-right span { color: var(--mint); margin-right: 5px; }
.label-dot { display: inline-block; width: 5px; height: 5px; background: var(--mint); margin-right: 7px; }
.scene-coordinates { position: absolute; right: 4%; bottom: 26px; font-size: .58rem; color: #8f83b0; letter-spacing: .16em; }.scene-coordinates span { color: var(--mint); margin: 0 7px; }
.scroll-cue { position: absolute; z-index: 8; bottom: 26px; left: 30px; display: flex; align-items: center; gap: 11px; color: #8f87a9; font-size: .55rem; letter-spacing: .16em; }
.scroll-mouse { width: 17px; height: 26px; border: 1px solid #a99bcf66; border-radius: 10px; display: flex; justify-content: center; padding-top: 5px; }
.scroll-mouse i { width: 2px; height: 5px; background: var(--mint); animation: scrollDot 1.5s infinite; }
.scroll-line { width: 34px; height: 1px; background: #b9a0ff44; }
.hero-index { position: absolute; z-index: 8; right: 30px; bottom: 31px; font-size: .55rem; letter-spacing: .17em; color: #8f87a9; }.hero-index span { color: var(--mint); }
.ticker { overflow: hidden; border-bottom: 1px solid var(--line); background: #171228; }
.ticker-track { display: flex; align-items: center; justify-content: space-around; gap: 28px; width: max-content; min-width: 100%; padding: 16px 25px; animation: ticker 36s linear infinite; color: #c8c0de; font-size: .65rem; font-weight: 900; letter-spacing: .19em; white-space: nowrap; }
.ticker-track i { color: var(--mint); font-style: normal; font-size: .9rem; }
.section-pad { max-width: var(--max); margin: 0 auto; padding: 110px 30px; }
.section-top { display: flex; justify-content: space-between; align-items: end; gap: 45px; margin-bottom: 45px; }
.eyebrow { margin-bottom: 18px; }
.eyebrow span { color: var(--purple); margin-right: 9px; }
.section-top h2, .manifesto h2, .join-content h2, .community-copy h2 { margin: 0; font-size: clamp(2.4rem, 5.2vw, 4.7rem); line-height: .98; font-weight: 1000; letter-spacing: -.075em; }
.section-intro { max-width: 405px; margin: 0 0 4px; color: var(--muted); font-size: .88rem; line-height: 1.9; }
.world-layout { display: grid; grid-template-columns: 1.25fr 1fr 1fr; gap: 17px; align-items: stretch; }
.world-feature { min-width: 0; border: 1px solid var(--line); background: linear-gradient(145deg, #ffffff06, #ffffff01); transition: transform .3s, border-color .3s, background .3s; }
.world-feature:hover { transform: translateY(-6px); border-color: #b9a0ff4d; background: #b9a0ff05; }
.world-art { position: relative; height: 245px; overflow: hidden; background: #1c1731; isolation: isolate; }
.world-feature-main .world-art { height: 280px; }
.world-art::after { content: ""; position: absolute; z-index: 5; inset: 0; background: linear-gradient(180deg, transparent 60%, #15112670); pointer-events: none; }
.art-code { position: absolute; z-index: 8; left: 16px; bottom: 14px; font-size: .52rem; color: #e5dcff; letter-spacing: .16em; }
.art-cavern { background: radial-gradient(ellipse at 50% 65%, #9c79ef4d, transparent 47%), linear-gradient(160deg, #24203b, #151126); }
.cave-rock { position: absolute; left: -5%; width: 110%; clip-path: polygon(0 0, 15% 12%, 28% 5%, 45% 19%, 62% 4%, 79% 12%, 100% 0, 100% 100%, 0 100%); }
.cave-rock-back { top: -10%; height: 66%; background: repeating-linear-gradient(90deg, #31284b 0 26px, #3c305a 26px 48px); }
.cave-rock-front { bottom: -9%; height: 48%; transform: rotate(180deg); background: repeating-linear-gradient(90deg, #2b2244 0 30px, #3b2b55 30px 52px); }
.cave-floor { position: absolute; left: 15%; right: 15%; bottom: 5%; height: 45%; background: #a78bfa18; clip-path: polygon(20% 0, 80% 0, 100% 100%, 0 100%); filter: blur(9px); }
.cave-glow { position: absolute; width: 140px; height: 150px; left: 50%; top: 35%; transform: translate(-50%,-50%); background: #b9a0ff35; filter: blur(45px); }
.cave-crystal { position: absolute; z-index: 4; bottom: 27%; width: 28px; height: 90px; clip-path: polygon(50% 0, 100% 25%, 75% 100%, 25% 100%, 0 25%); background: linear-gradient(90deg, #7658d3, #e0d3ff 45%, #9575f2); box-shadow: 0 0 35px #b9a0ff; filter: drop-shadow(0 0 15px #a78bfa); animation: crystalGlow 3s ease-in-out infinite alternate; }
.cave-crystal-a { left: 43%; height: 110px; width: 31px; }.cave-crystal-b { left: 57%; bottom: 25%; transform: scale(.66) rotate(9deg); animation-delay: -1.4s; }.cave-crystal-c { left: 33%; bottom: 23%; transform: scale(.55) rotate(-12deg); background: linear-gradient(90deg, #438e92, #c2fff0, #4eb9a4); animation-delay: -2s; }
.art-forest { background: linear-gradient(180deg, #292344, #172b3a 80%); }
.forest-moon { position: absolute; top: 17%; left: 62%; width: 61px; height: 61px; border-radius: 50%; background: #d5c9ff; box-shadow: 0 0 40px #b9a0ff7a; }
.forest-hill { position: absolute; bottom: -10%; left: -8%; width: 120%; height: 58%; clip-path: polygon(0 45%, 14% 45%, 14% 24%, 30% 24%, 30% 9%, 47% 9%, 47% 35%, 62% 35%, 62% 20%, 79% 20%, 79% 42%, 100% 42%, 100% 100%, 0 100%); }
.hill-back { background: #294b52; bottom: 10%; opacity: .9; }
.hill-front { background: repeating-linear-gradient(90deg, #173c3b 0 26px, #1d4843 26px 47px); }
.voxel-tree { position: absolute; z-index: 4; bottom: 22%; width: 36px; height: 95px; }
.voxel-tree i { position: absolute; bottom: 0; left: 14px; width: 9px; height: 45px; background: #3e3151; }
.voxel-tree b { position: absolute; top: 0; left: 0; width: 36px; height: 58px; background: #5d9b80; clip-path: polygon(25% 0, 75% 0, 75% 15%, 100% 15%, 100% 65%, 78% 65%, 78% 100%, 22% 100%, 22% 65%, 0 65%, 0 15%, 25% 15%); box-shadow: 0 0 20px #9cf4cf20; }
.tree-a { left: 18%; transform: scale(.9); }.tree-b { left: 47%; transform: scale(1.25); }.tree-c { left: 72%; transform: scale(.75); }
.forest-firefly { position: absolute; z-index: 5; width: 4px; height: 4px; background: var(--mint); box-shadow: 0 0 14px var(--mint); animation: drift 4s ease-in-out infinite; }
.firefly-a { left: 32%; top: 43%; }.firefly-b { left: 73%; top: 32%; animation-delay: -2s; }.firefly-c { left: 55%; top: 57%; animation-delay: -1s; }
.art-portal { background: radial-gradient(ellipse at 50% 65%, #a78bfa30, transparent 60%), linear-gradient(160deg, #1a1931, #251936); }
.portal-halo { position: absolute; left: 50%; top: 45%; width: 200px; height: 200px; border: 1px solid #b9a0ff38; border-radius: 50%; transform: translate(-50%,-50%); box-shadow: 0 0 60px #b9a0ff13, inset 0 0 40px #b9a0ff0b; }
.portal-frame { position: absolute; z-index: 3; left: 50%; top: 15%; transform: translateX(-50%); width: 95px; height: 140px; padding: 10px; border: 5px solid #6f5aa5; background: #b9a0ff1b; box-shadow: 0 0 25px #b9a0ff35, inset 0 0 15px #b9a0ff22; clip-path: polygon(0 13%, 13% 13%, 13% 0, 87% 0, 87% 13%, 100% 13%, 100% 100%, 0 100%); animation: portalPulse 4s ease-in-out infinite; }
.portal-inner { width: 100%; height: 100%; background: repeating-linear-gradient(135deg, #b9a0ff55 0 8px, #8c6eea40 8px 16px, #9cf4cf28 16px 19px); box-shadow: inset 0 0 30px #b9a0ff80; }
.portal-ground { position: absolute; bottom: 14%; left: 18%; width: 64%; height: 20%; background: repeating-linear-gradient(90deg, #4b3c69 0 24px, #382e50 24px 47px); clip-path: polygon(12% 0, 88% 0, 100% 100%, 0 100%); }
.portal-spark { position: absolute; z-index: 5; width: 4px; height: 4px; background: var(--mint); box-shadow: 0 0 15px var(--mint); animation: drift 3.5s ease-in-out infinite; }
.spark-a { left: 25%; top: 40%; }.spark-b { left: 72%; top: 25%; animation-delay: -1s; }.spark-c { left: 63%; top: 61%; animation-delay: -2s; }
.world-feature-copy { display: flex; align-items: start; justify-content: space-between; gap: 12px; padding: 21px 20px 0; }
.mini-tag { display: inline-block; color: var(--mint); font-size: .55rem; letter-spacing: .16em; font-weight: 850; }
.world-feature h3 { font-size: 1.05rem; line-height: 1.35; letter-spacing: -.03em; margin: 8px 0 0; }
.feature-number { font-size: 1.3rem; color: #b9a0ff55; font-weight: 900; letter-spacing: -.06em; }
.world-feature > p { padding: 0 20px 22px; margin: 12px 0 0; color: var(--muted); font-size: .78rem; line-height: 1.8; }
.manifesto { position: relative; overflow: hidden; padding: 105px 24px 100px; text-align: center; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: radial-gradient(ellipse at 50% 65%, #59418a2e, transparent 57%), #151128; }
.manifesto::before, .manifesto::after { content: ""; position: absolute; top: 20%; width: 180px; height: 180px; border: 1px solid #b9a0ff14; transform: rotate(45deg); }
.manifesto::before { left: -100px; }.manifesto::after { right: -100px; }
.manifesto-stars { color: #b9a0ff70; font-size: 1.1rem; letter-spacing: .7em; margin-bottom: 30px; }
.manifesto h2 { position: relative; font-size: clamp(2.5rem, 6.5vw, 5.5rem); }
.manifesto-copy { max-width: 550px; margin: 23px auto 0; color: var(--muted); font-size: .9rem; line-height: 1.9; }
.manifesto-signature { display: flex; align-items: center; justify-content: center; gap: 13px; margin-top: 29px; color: #d2c6f0; font-size: .62rem; font-weight: 850; letter-spacing: .18em; }
.manifesto-signature span { color: var(--mint); }
.feature-list { border-top: 1px solid var(--line); }
.feature-row { display: grid; grid-template-columns: 62px 1fr auto 20px; align-items: center; gap: 22px; padding: 26px 15px; border-bottom: 1px solid var(--line); transition: background .25s, padding .25s; }
.feature-row:hover { background: #b9a0ff07; padding-left: 22px; padding-right: 22px; }
.feature-symbol { display: grid; place-items: center; width: 54px; height: 54px; border: 1px solid #b9a0ff20; background: #b9a0ff0b; color: var(--purple); font-size: 1.45rem; }
.symbol-mint { color: var(--mint); background: #9cf4cf08; border-color: #9cf4cf20; }.symbol-pink { color: var(--pink); background: #edb4ed08; border-color: #edb4ed20; }.symbol-gold { color: var(--gold); background: #f2d59b08; border-color: #f2d59b20; }
.feature-content h3 { font-size: 1.15rem; margin: 4px 0 3px; letter-spacing: -.03em; }
.feature-content p { max-width: 660px; margin: 0; color: var(--muted); font-size: .79rem; }
.feature-state { white-space: nowrap; color: #a79dbf; font-size: .55rem; font-weight: 850; letter-spacing: .12em; }
.feature-state i { display: inline-block; width: 5px; height: 5px; margin-left: 6px; border-radius: 50%; background: var(--purple); vertical-align: 2px; }
.feature-arrow { color: #84789f; transition: transform .2s, color .2s; }.feature-row:hover .feature-arrow { color: var(--mint); transform: translate(3px,-3px); }
.roadmap-section { padding-top: 75px; }
.roadmap { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; padding-top: 26px; }
.roadmap-line { position: absolute; top: 48px; left: 7%; right: 7%; height: 1px; background: linear-gradient(90deg, var(--mint), #b9a0ff50 30%, #b9a0ff28); }
.roadmap-line span { display: block; width: 24%; height: 1px; background: var(--mint); box-shadow: 0 0 12px var(--mint); }
.roadmap-item { position: relative; padding-top: 45px; }
.roadmap-node { position: absolute; z-index: 2; top: 0; left: 18px; display: grid; place-items: center; width: 45px; height: 45px; border: 1px solid #b9a0ff50; background: #19132a; color: var(--purple); font-size: .75rem; font-weight: 900; transform: rotate(45deg); }
.roadmap-node span { transform: rotate(-45deg); }
.roadmap-active .roadmap-node { border-color: var(--mint); color: var(--mint); box-shadow: 0 0 20px #9cf4cf12; }
.roadmap-card { min-height: 245px; padding: 25px 18px 20px; border: 1px solid var(--line); background: #ffffff03; }
.roadmap-active .roadmap-card { border-color: #9cf4cf40; background: linear-gradient(145deg, #9cf4cf08, #ffffff02); }
.roadmap-label { display: inline-flex; align-items: center; gap: 7px; color: #9f96b9; font-size: .53rem; font-weight: 900; letter-spacing: .13em; }
.roadmap-label i { width: 6px; height: 6px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 8px var(--mint); }
.roadmap-card h3 { margin: 12px 0 8px; font-size: 1.13rem; letter-spacing: -.04em; }
.roadmap-card p { color: var(--muted); font-size: .75rem; line-height: 1.8; }
.roadmap-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 15px; }
.roadmap-chips span { border: 1px solid var(--line); padding: 4px 6px; color: #c5badf; font-size: .52rem; }
.join-section { position: relative; overflow: hidden; min-height: 450px; display: flex; align-items: center; justify-content: center; padding: 80px 30px 65px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #161128; isolation: isolate; }
.join-backdrop { position: absolute; z-index: -1; inset: 0; background: radial-gradient(ellipse at 50% 100%, #7856ce32, transparent 58%), linear-gradient(180deg, #171128, #1b1430); }
.join-backdrop::after { content: ""; position: absolute; inset: 0; opacity: .1; background-image: linear-gradient(#b9a0ff24 1px, transparent 1px), linear-gradient(90deg, #b9a0ff24 1px, transparent 1px); background-size: 35px 35px; mask-image: linear-gradient(transparent, black); }
.join-content { position: relative; z-index: 2; max-width: 730px; text-align: center; }
.join-content h2 { font-size: clamp(2.9rem, 7vw, 6rem); }
.join-content > p:not(.eyebrow) { max-width: 510px; margin: 21px auto 0; color: var(--muted); font-size: .9rem; }
.join-actions { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 18px; margin-top: 27px; }
.join-note { display: inline-flex; align-items: center; gap: 8px; color: #b5accb; font-size: .56rem; font-weight: 800; letter-spacing: .12em; }
.join-crystal { position: absolute; width: 38px; height: 125px; clip-path: polygon(50% 0, 100% 23%, 73% 100%, 27% 100%, 0 23%); background: linear-gradient(90deg, #7658d366, #e0d3ff66, #9575f266); filter: drop-shadow(0 0 25px #b9a0ff); animation: crystalGlow 4s ease-in-out infinite alternate; }
.join-crystal-a { left: 12%; bottom: 14%; transform: rotate(-15deg) scale(.9); }.join-crystal-b { right: 12%; top: 12%; transform: rotate(15deg) scale(.65); background: linear-gradient(90deg, #438e9266, #c2fff066, #4eb9a466); }
.join-footer-line { position: absolute; bottom: 17px; left: 30px; right: 30px; display: flex; justify-content: space-between; gap: 10px; color: #817695; font-size: .52rem; font-weight: 800; letter-spacing: .15em; }
.community-section { padding-top: 90px; padding-bottom: 95px; }
.community-card { position: relative; display: grid; grid-template-columns: 200px 1fr auto; align-items: center; gap: 36px; padding: 43px; border: 1px solid #b9a0ff29; background: radial-gradient(ellipse at 15% 50%, #9f7bff12, transparent 50%), #ffffff03; overflow: hidden; }
.community-card::after { content: ""; position: absolute; right: -100px; top: -130px; width: 300px; height: 300px; border: 1px solid #b9a0ff12; transform: rotate(45deg); box-shadow: 0 0 0 35px #b9a0ff05, 0 0 0 70px #b9a0ff03; pointer-events: none; }
.community-emblem { position: relative; width: 175px; height: 175px; display: grid; place-items: center; }
.emblem-orbit { position: absolute; inset: 10px; border: 1px solid #b9a0ff40; transform: rotate(45deg); }
.orbit-b { inset: 25px; border-color: #9cf4cf3a; transform: rotate(15deg); }
.emblem-cube { position: relative; display: grid; place-items: center; width: 68px; height: 68px; background: linear-gradient(145deg, #d4c5ff, #8e70df); color: #20152e; font-size: 1.4rem; font-weight: 1000; letter-spacing: -.1em; box-shadow: 0 0 45px #b9a0ff40; transform: rotate(0deg); }
.emblem-cube span { color: #236b5b; }
.community-copy h2 { font-size: clamp(2rem, 3.7vw, 3.5rem); }
.community-copy > p:not(.eyebrow) { max-width: 560px; margin: 15px 0 0; color: var(--muted); font-size: .82rem; }
.community-buttons { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; margin-top: 24px; }
.button-disabled { cursor: not-allowed; background: #ffffff05; border-color: var(--line); color: #9990b0; opacity: .8; }
.button-disabled span { color: var(--purple); }
.text-link { color: #c5badf; font-size: .57rem; font-weight: 850; letter-spacing: .12em; }
.text-link:hover { color: var(--mint); }
.community-coordinates { position: relative; z-index: 2; color: #9185b2; font-size: .6rem; font-weight: 900; letter-spacing: .2em; line-height: 1.9; }
.community-coordinates span { color: var(--mint); font-size: .5rem; }
.footer { position: relative; display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 18px 35px; max-width: var(--max); margin: auto; padding: 27px 30px 24px; border-top: 1px solid var(--line); }
.footer-brand .brand-cube { width: 35px; height: 35px; }
.footer-brand .brand-copy strong { font-size: .73rem; }
.footer-brand .brand-copy small { font-size: .52rem; }
.footer-motto { justify-self: end; margin: 0; color: #b6a8d6; font-size: .58rem; font-weight: 850; letter-spacing: .16em; }
.footer-legal { grid-column: 1 / -1; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 20px; padding-top: 18px; border-top: 1px solid #ffffff0b; color: #827a99; font-size: .62rem; }
.footer-disclaimer { text-align: right; }
.back-top { position: absolute; right: 30px; top: 25px; display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid var(--line); color: var(--mint); transition: background .2s; }
.back-top:hover { background: #9cf4cf10; }
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .75s ease, transform .75s cubic-bezier(.2,.7,.2,1); }
.reveal.visible { opacity: 1; transform: translateY(0); }
@keyframes twinkle { from { opacity: .2; transform: scale(.6); } to { opacity: .95; transform: scale(1.35); } }
@keyframes statusPulse { 0%,100% { opacity: 1; box-shadow: 0 0 10px #9cf4cf; } 50% { opacity: .5; box-shadow: 0 0 3px #9cf4cf; } }
@keyframes cloudFloat { from { translate: -8px 0; } to { translate: 15px 5px; } }
@keyframes islandFloat { 0%,100% { translate: 0 0; } 50% { translate: 0 -10px; } }
@keyframes crystalGlow { from { filter: brightness(.9) drop-shadow(0 0 8px #b9a0ff66); } to { filter: brightness(1.3) drop-shadow(0 0 20px #b9a0ffcc); } }
@keyframes drift { 0%,100% { transform: translate(0,0); opacity: .35; } 50% { transform: translate(8px,-20px); opacity: 1; } }
@keyframes scrollDot { 0% { transform: translateY(0); opacity: 1; } 100% { transform: translateY(8px); opacity: 0; } }
@keyframes ticker { to { transform: translateX(-20%); } }
@keyframes portalPulse { 0%,100% { box-shadow: 0 0 25px #b9a0ff35, inset 0 0 15px #b9a0ff22; } 50% { box-shadow: 0 0 50px #b9a0ff60, inset 0 0 28px #b9a0ff45; } }
@media (min-width: 1500px) { .hero { min-height: 790px; } .hero-copy { padding-top: 100px; } .scene { height: 340px; } }
@media (max-width: 950px) {
  .nav { padding: 16px 22px; }.nav-links { gap: 14px; }.nav-links > a { font-size: .7rem; }
  .hero { min-height: 720px; }.hero-copy { padding-top: 75px; }.scene { width: 100%; }
  .world-layout { grid-template-columns: repeat(2, 1fr); }.world-feature-main { grid-column: 1 / -1; }.world-feature-main .world-art { height: 280px; }
  .roadmap { grid-template-columns: repeat(2, 1fr); row-gap: 35px; }.roadmap-line { display: none; }
  .community-card { grid-template-columns: 135px 1fr; padding: 30px; gap: 25px; }.community-emblem { width: 125px; height: 125px; }.community-coordinates { display: none; }
}
@media (max-width: 650px) {
  .nav { padding: 13px 18px; }.brand-cube { width: 37px; height: 37px; }.brand-copy strong { font-size: .75rem; }.brand-copy small { font-size: .53rem; }
  .menu-toggle { display: block; position: relative; z-index: 5; }
  .nav-links { display: none; position: absolute; top: 100%; left: 12px; right: 12px; padding: 17px; flex-direction: column; align-items: stretch; gap: 0; border: 1px solid var(--line); background: #151128f5; box-shadow: 0 20px 45px #0005; backdrop-filter: blur(16px); }
  .nav-links.open { display: flex; }.nav-links > a { padding: 13px 8px; font-size: .8rem; }.nav-links .nav-cta { margin-top: 8px; text-align: center; }
  .hero { min-height: 740px; }.hero-copy { padding: 70px 20px 0; }.status-pill { font-size: .51rem; gap: 7px; }.hero-overline { font-size: .57rem; margin-top: 25px; }
  .hero h1 { font-size: clamp(3.2rem, 13vw, 5.2rem); }.hero-description { font-size: .86rem; }.hero-meta { gap: 9px; font-size: .48rem; }
  .scene { height: 255px; bottom: -15px; }.scene-moon { width: 90px; height: 90px; }.mountain-back { width: 72%; left: 14%; height: 175px; }.mountain-left { width: 43%; height: 130px; }.mountain-right { width: 43%; height: 125px; }
  .floating-island { transform: translateX(-50%) scale(.8); transform-origin: bottom center; bottom: 18px; }.label-left { left: 3%; }.label-right { right: 3%; }.scene-label { font-size: .43rem; padding: 6px; top: 55%; }.scene-coordinates { display: none; }
  .scroll-cue { left: 17px; bottom: 15px; font-size: .47rem; gap: 7px; }.hero-index { right: 17px; bottom: 21px; font-size: .47rem; }
  .ticker-track { padding: 13px 20px; font-size: .58rem; }
  .section-pad { padding: 75px 19px; }.section-top { display: block; margin-bottom: 30px; }.section-top h2 { font-size: clamp(2.6rem, 11vw, 4rem); }.section-intro { margin-top: 20px; font-size: .83rem; }
  .world-layout { grid-template-columns: 1fr; gap: 14px; }.world-feature-main { grid-column: auto; }.world-art, .world-feature-main .world-art { height: 230px; }
  .manifesto { padding: 78px 20px; }.manifesto h2 { font-size: clamp(2.4rem, 10.5vw, 4rem); }.manifesto-copy { font-size: .83rem; }.manifesto-signature { font-size: .5rem; letter-spacing: .11em; }
  .feature-row { grid-template-columns: 48px 1fr 15px; gap: 13px; padding: 22px 3px; }.feature-symbol { width: 44px; height: 44px; font-size: 1.2rem; }.feature-content h3 { font-size: 1rem; }.feature-content p { font-size: .73rem; }.feature-state { grid-column: 2; grid-row: 2; justify-self: start; margin-top: 6px; }.feature-arrow { grid-column: 3; grid-row: 1; }.feature-row:hover { padding-left: 8px; padding-right: 8px; }
  .roadmap { grid-template-columns: 1fr; gap: 27px; padding-left: 15px; }.roadmap-item { padding-top: 0; padding-left: 48px; }.roadmap-node { left: 0; top: 15px; width: 35px; height: 35px; font-size: .65rem; }.roadmap-card { min-height: auto; padding: 22px 17px; }.roadmap-card p { margin-bottom: 0; }
  .join-section { min-height: 440px; padding: 75px 20px 65px; }.join-content h2 { font-size: clamp(2.7rem, 11vw, 4.2rem); }.join-content > p:not(.eyebrow) { font-size: .82rem; }.join-crystal-a { left: -8px; transform: scale(.6); }.join-crystal-b { right: -5px; transform: scale(.55); }.join-footer-line { left: 15px; right: 15px; font-size: .43rem; letter-spacing: .08em; }
  .community-section { padding: 60px 18px; }.community-card { display: block; padding: 25px 20px; }.community-emblem { width: 100px; height: 100px; margin: 0 auto 27px; }.emblem-cube { width: 52px; height: 52px; }.community-copy h2 { font-size: clamp(2.2rem, 9vw, 3.2rem); }.community-copy > p:not(.eyebrow) { font-size: .78rem; }.community-buttons { gap: 13px; }
  .footer { grid-template-columns: 1fr auto; gap: 15px; padding: 23px 18px 20px; }.footer-motto { display: none; }.footer-legal { font-size: .58rem; }.footer-disclaimer { text-align: left; }.back-top { right: 18px; top: 23px; position: static; grid-column: 2; grid-row: 1; }.footer-legal { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}