:root{color-scheme:dark;--paper:#f1d9bd;--muted:#b7a098;--accent:#eaaa68;--ink:#170e14;--scene-height:clamp(560px,53.4668vw,1100px)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--paper);font-family:Georgia,'Times New Roman',serif;line-height:1.65}a{color:inherit}button{font:inherit}[hidden]{display:none!important}
.skip{position:fixed;left:16px;top:-100px;padding:12px 20px;background:var(--ink);z-index:100}.skip:focus{top:16px}
.top-navigation{position:absolute;z-index:8;top:30px;left:clamp(24px,3vw,64px);right:clamp(24px,3vw,64px);display:flex;justify-content:space-between;gap:230px;font:500 12px/1.6 system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase}
.navigation-left,.navigation-right{display:flex;align-items:center;gap:clamp(18px,2.5vw,40px)}
.top-navigation a{text-decoration:none;color:var(--paper);padding:8px 0;text-shadow:0 1px 8px #0008;white-space:nowrap;transition:color .15s ease}.top-navigation a:hover{color:var(--accent)}
.mobile-navigation{display:none;position:absolute;left:20px;top:25px;z-index:9;font:500 12px/1.6 system-ui,sans-serif}
.mobile-navigation summary{display:flex;align-items:center;gap:12px;list-style:none;cursor:pointer;padding:9px 0;letter-spacing:.1em;text-transform:uppercase;color:var(--paper)}.mobile-navigation summary::-webkit-details-marker{display:none}
.menu-mark{display:grid;gap:4px;width:17px}.menu-mark i{display:block;height:1px;background:currentColor}
.mobile-navigation nav{margin-top:10px;width:225px;padding:12px 18px;background:#170e14f5;border:1px solid #f1d9bd33;border-radius:5px;box-shadow:0 12px 30px #0005}
.mobile-navigation a{display:block;padding:12px 0;text-decoration:none;color:var(--paper);letter-spacing:.04em}.mobile-navigation a:hover{color:var(--accent)}
.mobile-navigation summary:focus-visible{outline:2px solid var(--accent);outline-offset:6px}
@media(max-width:800px){.top-navigation{display:none}.mobile-navigation{display:block}}
@media(prefers-reduced-motion:reduce){.top-navigation a{transition:none}}
.hero{height:var(--scene-height);position:relative;isolation:isolate;background:#12090e}
.scene{position:absolute;inset:0;clip-path:inset(0);pointer-events:none}
.layer{position:fixed;top:0;left:0;width:100%;height:var(--scene-height);background-image:var(--image);background-size:cover;background-position:center;background-repeat:no-repeat;will-change:transform}
.layer.logo{z-index:6;top:10px;left:calc(52.4% - var(--logo-width,180px)/2);width:var(--logo-width,180px);height:var(--logo-height,110px);background:none}.logo svg{display:block;width:100%;height:100%}.scroll-prompt{position:absolute;bottom:30px;left:40px;text-decoration:none;font:12px/1.6 system-ui,sans-serif;text-transform:uppercase;letter-spacing:.17em;z-index:7}.scroll-prompt span{display:block;font-size:24px}
.motion-toggle{position:absolute;right:30px;bottom:32px;background:#170e1499;color:var(--paper);border:1px solid #f1d9bd55;border-radius:3px;padding:9px 14px;font:12px system-ui,sans-serif;cursor:pointer;z-index:7}
main{position:relative;z-index:10;background:var(--ink);min-height:100vh}.wrap{width:min(100% - 64px,1000px);margin:auto}.intro{text-align:center;padding:100px 0 80px}.eyebrow,.number{font:11px/1.6 system-ui,sans-serif;letter-spacing:.21em;text-transform:uppercase;color:var(--accent)}
h1{font-size:clamp(48px,7vw,86px);letter-spacing:.045em;line-height:1;margin:26px 0 48px;text-transform:uppercase}h1 span{display:block;font:13px/1.6 system-ui,sans-serif;letter-spacing:.4em;margin-top:14px}h2{font-size:clamp(28px,4vw,44px);font-weight:400;line-height:1.25;margin:20px 0 28px}.lead{font-size:19px;max-width:710px;margin:0 auto;color:#d5bdb1}
.actions{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;margin-top:36px}.actions:empty{display:none}.button{display:inline-flex;gap:30px;align-items:center;justify-content:center;background:var(--accent);color:var(--ink);padding:16px 25px;font:600 12px system-ui,sans-serif;text-transform:uppercase;letter-spacing:.12em;text-decoration:none;border:1px solid var(--accent)}.button:hover{background:#f4c58e}.button.secondary{background:transparent;color:var(--accent)}.button.secondary:hover{background:#eaaa6815}.status{font:12px system-ui,sans-serif;color:var(--muted);margin-top:35px}
.details{display:grid;grid-template-columns:repeat(3,1fr);gap:44px;border-top:1px solid #f1d9bd22;padding:55px 0 75px}.details h3{font-size:25px;line-height:1.25;font-weight:400;margin:18px 0}.details article>p:last-child{color:var(--muted);font-size:16px}.trailer{text-align:center;padding:30px 0 80px}.video{aspect-ratio:16/9;margin-top:35px;background:#0b080c}.video iframe{width:100%;height:100%;border:0}.updates{text-align:center;border-top:1px solid #f1d9bd22;padding:70px 0}.updates>p:not(.eyebrow){color:var(--muted)}.updates .button{margin-top:16px}footer{border-top:1px solid #f1d9bd22;padding:30px 0 40px;display:flex;justify-content:space-between;gap:20px;font:11px/1.6 system-ui,sans-serif;color:var(--muted)}footer p{margin:0}footer a{text-decoration:none}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:6px}
body.motion-paused .layer{position:absolute;transform:none!important;will-change:auto}
@media(max-width:600px){:root{--scene-height:70svh}.layer{background-size:auto 100%;background-position:56% center}.scroll-prompt{left:24px;bottom:22px;font-size:10px}.motion-toggle{right:20px;bottom:26px;padding:8px;font-size:10px}.wrap{width:calc(100% - 40px)}.intro{padding:65px 0 50px}.lead{font-size:17px}.details{grid-template-columns:1fr;gap:24px;padding:40px 0}.details h3{margin:12px 0}.details article>p:last-child{margin-bottom:0}footer{flex-direction:column;gap:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.layer{position:absolute;transform:none!important;will-change:auto}}

/* Native timeline keeps every transform on the browser scroll timeline. */
@keyframes scene-scroll{from{transform:translate3d(0,0,0)}to{transform:translate3d(0,var(--travel),0)}}
body.native-scroll:not(.motion-paused) .parallax{animation:scene-scroll linear both;animation-timeline:scroll(root block);animation-range:0px var(--scroll-range)}
body.motion-paused .parallax{animation:none}
@media(prefers-reduced-motion:reduce){body.native-scroll .parallax{animation:none}}

/* Screenshot thumbnails and full-size viewer. */
.screenshots{text-align:center;border-top:1px solid #f1d9bd22;padding:65px 0 80px}
.screenshot-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:38px}
.screenshot{display:block;position:relative;overflow:hidden;background:#0b080c;aspect-ratio:16/9;text-decoration:none}
.screenshot img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .2s ease,filter .2s ease}
.screenshot span{position:absolute;right:12px;bottom:12px;padding:6px 10px;background:#170e14cc;color:var(--paper);font:10px/1.5 system-ui,sans-serif;text-transform:uppercase;letter-spacing:.1em;opacity:0;transition:opacity .2s ease}
.screenshot:hover img{transform:scale(1.025);filter:brightness(1.08)}
.screenshot:hover span,.screenshot:focus-visible span{opacity:1}
.lightbox{border:0;padding:0;background:transparent;color:var(--paper);width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;overflow:hidden;outline:none}
.lightbox[open]{display:flex;align-items:center;justify-content:center}
.lightbox::backdrop{background:rgba(8,5,10,.94)}
.lightbox-image{display:block;max-width:calc(100vw - 80px);max-height:calc(100dvh - 100px);width:auto;height:auto;object-fit:contain;box-shadow:0 15px 70px #0008}
.lightbox-close{position:absolute;right:20px;top:15px;width:44px;height:44px;padding:0;background:#170e14cc;color:var(--paper);border:1px solid #f1d9bd55;border-radius:50%;font:32px/1 system-ui,sans-serif;cursor:pointer}
body.lightbox-open{overflow:hidden}html{scrollbar-gutter:stable}
@media(max-width:600px){.screenshots{padding:45px 0 55px}.screenshot-grid{gap:12px;margin-top:28px}.lightbox-image{max-width:calc(100vw - 24px);max-height:calc(100dvh - 110px)}.screenshot span{display:none}}
@media(prefers-reduced-motion:reduce){.screenshot img,.screenshot span{transition:none}}

.newsletter-embed{max-width:700px;margin:30px auto 0;text-align:left}
.newsletter-embed .formkit-form{margin:0 auto;max-width:100%}
.updates .newsletter-help{font:12px/1.6 system-ui,sans-serif;margin-top:20px}
.newsletter-help a{text-underline-offset:3px}
/* Overscan the embedded form background to hide fractional-pixel edge seams. */
.newsletter-embed .formkit-form[data-uid="427d7bc57a"] .formkit-hero{overflow:hidden}
.newsletter-embed .formkit-form[data-uid="427d7bc57a"] .formkit-hero-bg-img{top:-2px;left:-2px;width:calc(100% + 4px);height:calc(100% + 4px)}

/* Community invitation: violet night sky, real game imagery and warm accents. */
.community{position:relative;overflow:hidden;margin:30px 0 0;border-top:1px solid #8278d533;border-bottom:1px solid #8278d533;background:radial-gradient(ellipse at 82% 48%,#5145bd77,transparent 55%),radial-gradient(ellipse at 15% 100%,#49233b66,transparent 65%),linear-gradient(125deg,#171222,#151136 55%,#242054)}
.community::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.35;background-image:radial-gradient(circle,#d6baff 1px,transparent 1.7px);background-size:91px 83px;mask-image:linear-gradient(90deg,transparent,#000)}
.community-inner{position:relative;display:grid;grid-template-columns:.95fr 1.15fr;gap:30px;align-items:center;min-height:550px;padding:65px 0}
.community-copy{position:relative;z-index:2}.community-copy .eyebrow{color:#d9b5ff;letter-spacing:.15em}
.community h2{font-family:system-ui,sans-serif;font-size:clamp(35px,4.1vw,57px);line-height:1.04;font-weight:900;letter-spacing:-.035em;text-transform:uppercase;color:#fff4eb;margin:24px 0}
.community-description{max-width:430px;margin:0 0 28px;color:#d7cfe8;font:17px/1.7 system-ui,sans-serif}
.community-button{gap:15px;border-radius:5px;box-shadow:0 8px 28px #0003;font-size:12px;letter-spacing:.06em}.discord-icon{width:24px;height:24px;flex-shrink:0}
.community-welcome{margin:20px 0 0;color:#c5b5d3;font:12px/1.7 system-ui,sans-serif}
.community-art{position:relative;min-width:0;height:400px;isolation:isolate}
.community-orbit{position:absolute;border:1px solid #c7a2ff30;border-radius:50%;transform:rotate(-20deg)}.orbit-one{inset:15px -20px 10px 5px}.orbit-two{inset:45px 5px -15px 30px;transform:rotate(18deg)}
.community-shot{position:absolute;padding:7px;background:linear-gradient(135deg,#9380dd,#3b305b);border:1px solid #cfbaff66;border-radius:12px;box-shadow:8px 20px 35px #08061388;overflow:hidden}
.community-shot img{display:block;width:100%;height:auto;border-radius:6px;aspect-ratio:16/9;object-fit:cover}
.shot-vista{width:85%;top:24px;left:3%;transform:rotate(-7deg);z-index:1;padding-bottom:33px}.shot-vista>span{position:absolute;bottom:9px;left:16px;color:#fff0dc;font:10px system-ui,sans-serif;letter-spacing:.04em}
.shot-creature{width:48%;right:-3%;top:176px;transform:rotate(8deg);z-index:3}
.shot-portal{width:48%;left:0;top:228px;transform:rotate(-12deg);z-index:2}
.community-emblem{position:absolute;z-index:4;left:39%;top:228px;width:100px;height:100px;display:grid;place-items:center;border-radius:26px;background:linear-gradient(145deg,#9d8cff,#6652d8);border:1px solid #d5c5ff;box-shadow:0 14px 26px #09071c88,inset 0 2px 3px #ffffff44;transform:rotate(-9deg)}
.community-emblem .discord-icon{width:60px;height:60px;color:#fff}
.community-tag{position:absolute;z-index:5;padding:11px 15px;border-radius:30px;font:600 12px system-ui,sans-serif;box-shadow:0 8px 24px #0004;white-space:nowrap}
.tag-ideas{top:2px;right:5%;background:#f0c082;color:#2b1c2f;transform:rotate(5deg)}.tag-hello{bottom:12px;right:13%;background:#342856;border:1px solid #ac91db;color:#fff1e4;transform:rotate(-4deg)}.tag-hello span{margin-left:14px;color:#eaaa68}
.community-spark{position:absolute;color:#eaaa68;text-shadow:0 0 20px #d4a2ff77}.spark-one{left:-10px;top:156px;font-size:29px}.spark-two{right:5px;top:85px;font-size:42px;color:#cbb4ff}.spark-three{left:29%;bottom:4px;font-size:17px}
@media(max-width:800px){.community-inner{grid-template-columns:1fr;gap:35px;padding:55px 0 35px;max-width:620px}.community-copy{text-align:center}.community-description{margin:0 auto 25px;max-width:480px}.community-art{width:min(100%,470px);margin:auto;height:380px}.community h2{font-size:clamp(36px,7vw,50px)}.community-welcome{margin-top:18px}}
@media(max-width:420px){.community-art{height:320px}.shot-creature{top:145px}.shot-portal{top:190px}.community-emblem{top:188px;width:80px;height:80px;border-radius:21px}.community-emblem .discord-icon{width:48px;height:48px}.community-tag{font-size:10px;padding:9px 12px}.shot-vista{padding-bottom:29px}.shot-vista>span{font-size:8px}}
