@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Space+Mono:wght@400;700&display=swap');
:root{--bg:#09090f;--purple:#b9a0ff;--ink:#f1edf9;--muted:#afa6bf;--line:#ffffff22}body{background:var(--bg);font-family:'Space Grotesk',sans-serif;overflow-x:hidden}.ambient{position:fixed;inset:0;z-index:-1;overflow:hidden;background:radial-gradient(ellipse at 70% 28%,#29213f 0,transparent 53%),radial-gradient(ellipse at 5% 70%,#152b33 0,transparent 48%),#09090f}.orb{position:absolute;border-radius:50%;filter:blur(65px);opacity:.45;pointer-events:none}.orb.one{width:55vw;height:55vw;right:-20vw;top:20%;background:#6549a8}.orb.two{width:30vw;height:30vw;left:-15vw;top:10%;background:#133d58}.grid-floor{position:absolute;inset:0;background-image:linear-gradient(#ffffff04 1px,transparent 1px),linear-gradient(90deg,#ffffff04 1px,transparent 1px);background-size:70px 70px;mask-image:linear-gradient(transparent,#0006)}.header{position:fixed;top:18px;left:22px;right:22px;z-index:20;max-width:none;border:1px solid #ffffff24;border-radius:10px;background:#0e0e1785;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);padding:16px 22px;box-shadow:0 4px 35px #0003}.brand{font-family:'Space Grotesk',sans-serif;font-size:19px;letter-spacing:-1px}.brand-mark{background:#d2c0ff;border-radius:3px}.header nav{font-family:'Space Mono',monospace;font-size:10px;text-transform:uppercase;gap:38px}.button{border-radius:5px;font-family:'Space Mono',monospace;letter-spacing:.4px;font-size:11px;background:#ffffff0c;border-color:#ffffff35;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.button.primary{background:#c8b4ffde;color:#181023;border-color:#e2d7ff}.button.primary:hover{background:#e2d7ff;box-shadow:0 0 35px #ba91ff35}.button.compact{font-size:10px;padding:10px 16px}.scroll-progress{position:fixed;left:0;top:0;height:2px;width:100%;background:var(--purple);z-index:30;transform-origin:left;transform:scaleX(var(--page-progress,0))}.hero-scroll{height:180vh;min-height:1000px;position:relative}.hero-stage{height:100svh;min-height:680px;position:sticky;top:0;overflow:hidden;perspective:1200px;--scene:0}.scene-meta{position:absolute;left:4.5%;right:4.5%;top:132px;display:flex;justify-content:space-between;font-family:'Space Mono',monospace;font-size:9px;letter-spacing:1.5px;color:#a398b8}.hero-copy{position:absolute;left:4.5%;top:24%;z-index:3;transform:translateY(calc(var(--scene)*-90px));opacity:calc(1 - var(--scene)*1.7);pointer-events:auto}.hero-copy .eyebrow{font-family:'Space Mono',monospace;font-size:9px;color:#c5b7db;letter-spacing:1.5px}.hero-copy h1{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:clamp(80px,9vw,145px);line-height:.83;letter-spacing:-.085em;margin:31px 0 27px;position:relative}.hero-copy h1 span{display:block;color:#d7c7ff}.hero-copy h1 b{position:absolute;font-size:27px;right:-34px;top:0;color:var(--purple);font-weight:400}.hero-copy p{font-size:15px;color:#bbb2c9;line-height:1.7;margin-bottom:24px}.hero-copy small{display:block;font:8px 'Space Mono',monospace;letter-spacing:1px;color:#84768f;margin-top:13px}.scene-perspective{position:absolute;width:70vw;max-width:1160px;height:72%;right:-3%;top:14%;perspective:1100px;transform:translateX(calc(var(--scene)*-15vw));pointer-events:none}.scene-map{position:relative;width:100%;height:100%;transform-style:preserve-3d;transform:rotateX(calc(45deg - var(--scene)*45deg)) rotateZ(calc(-15deg + var(--scene)*15deg)) scale(calc(.94 + var(--scene)*.12));will-change:transform}.scene-map>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 8px 0 #242538) drop-shadow(0 18px 2px #151522) drop-shadow(0 50px 30px #000b);pointer-events:none}.ocean-plane{position:absolute;inset:9% 2%;transform:translateZ(-30px);border:1px solid #c1a4ff22;border-radius:50%;background:radial-gradient(ellipse,#7771bf19,transparent 68%);box-shadow:0 0 90px #8c6fd311}.map-pin{position:absolute;z-index:2;font:9px 'Space Mono',monospace;letter-spacing:1px;padding:9px 12px;border:1px solid #ffffff4a;border-radius:4px;background:#161422a8;color:#fff;backdrop-filter:blur(12px);cursor:pointer;display:flex;align-items:center;gap:8px;pointer-events:auto;transition:background .2s,box-shadow .2s;transform:translateZ(20px)}.map-pin:hover{background:#433456e0;box-shadow:0 0 22px #ffffff25}.map-pin i{width:6px;height:6px;border-radius:50%;background:var(--red)}.map-pin.red{left:23%;top:70%}.map-pin.green{left:46%;top:36%}.map-pin.green i{background:var(--green)}.map-pin.blue{left:75%;top:57%}.map-pin.blue i{background:var(--blue)}.scene-card{position:absolute;right:4.5%;bottom:6%;z-index:4;width:340px;border:1px solid #ffffff35;border-radius:7px;padding:20px 23px;background:linear-gradient(120deg,#ffffff10,#ffffff04);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 20px 50px #0003;transform:translateY(calc(var(--scene)*120px));opacity:calc(1 - var(--scene)*1.5)}.card-top,.card-foot{display:flex;justify-content:space-between;align-items:center;font:8px 'Space Mono',monospace;letter-spacing:.5px;color:#bbb2cb;gap:12px}.cross{font-size:20px;color:#ece5f4}.scene-card h2{font:500 20px/1.3 'Space Grotesk',sans-serif;letter-spacing:-.5px;margin:17px 0 12px}.scene-card p{font-size:11px;color:#a59ab6;line-height:1.8}.card-foot{border-top:1px solid #ffffff20;margin-top:19px;padding-top:14px}.three-dots{color:var(--purple);letter-spacing:4px}.scroll-cue{position:absolute;bottom:8%;left:4.5%;display:flex;align-items:center;gap:18px;font:8px 'Space Mono',monospace;letter-spacing:1.5px;color:#a498b9}.cue-line{width:75px;height:1px;background:#b9a0ff55}.scene-final{position:absolute;z-index:5;left:4.5%;bottom:7%;font:600 clamp(30px,5vw,74px)/.95 'Space Grotesk',sans-serif;letter-spacing:-3px;opacity:clamp(0,calc((var(--scene) - .6)*3),1);pointer-events:none}.scene-final span{display:block}.scene-final span+span{color:var(--purple)}.marquee{overflow:hidden;border-top:1px solid #ffffff20;border-bottom:1px solid #ffffff20;padding:15px 0;background:#ffffff04;backdrop-filter:blur(12px)}.marquee div{white-space:nowrap;font:11px 'Space Mono',monospace;letter-spacing:7px;color:#9e8bb8;transform:translateX(calc(var(--page-progress,0)*-450px));will-change:transform}.section{padding-top:120px;padding-bottom:120px}.eyebrow{font-family:'Space Mono',monospace;font-size:9px;letter-spacing:1px;color:#a99aba}h2{font-family:'Space Grotesk',sans-serif;font-weight:500;letter-spacing:-3px;font-size:clamp(45px,5.5vw,76px);line-height:1.02}h3{font-family:'Space Grotesk',sans-serif;letter-spacing:-1.3px}.section-heading p{font-size:14px;max-width:350px}.kingdom-tabs button{background:#ffffff06;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border-radius:5px;font:10px 'Space Mono',monospace}.kingdom-tabs button[aria-selected=true]{background:#ee727d13}.kingdom-tabs button:nth-child(2)[aria-selected=true]{background:#89bd8a13}.kingdom-tabs button:nth-child(3)[aria-selected=true]{background:#80aaf413}.kingdom-detail{background:linear-gradient(125deg,#ffffff0c,#ffffff03);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-color:#ffffff24;box-shadow:0 20px 70px #0002}.kingdom-detail h3{font-size:42px}.kingdom-kicker,.feature-note{font-family:'Space Mono',monospace}.rules-section{background:#ffffff03;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-color:#ffffff19}.feature-grid{gap:16px}.feature-grid article{padding:30px;border:1px solid #ffffff20;border-radius:6px;background:linear-gradient(135deg,#ffffff0b,#ffffff02);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transition:transform .4s,border-color .4s}.feature-grid article:hover{transform:translateY(-8px);border-color:#bd9afc70}.feature-grid h3{font-size:27px;font-weight:500;line-height:1.1}.feature-grid p{font-size:13px;min-height:100px}.feature-icon{font-size:28px}.feature-note{font-size:8px;letter-spacing:1px}.launcher-art{background:#ffffff09;border:1px solid #ffffff30;backdrop-filter:blur(20px);box-shadow:0 30px 90px #0004;transform:perspective(900px) rotateY(-12deg) rotateZ(-3deg)}.launcher-art img{opacity:.88}.art-label{font-family:'Space Mono',monospace;font-size:8px}.download-content>p{font-size:13px}.steps strong{font-weight:500}.steps li>span{font-family:'Space Mono',monospace}.faq-section h2{font-size:48px}.faqs details{border-color:#ffffff25}.faqs summary{font-size:13px}.discord-banner{background:linear-gradient(120deg,#a781e42c,#d0baff0d);border:1px solid #ccb1ff4d;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);color:#f1eaf9;box-shadow:0 30px 90px #0004}.discord-banner .eyebrow{color:#b9a3d1}.discord-banner h2{font-size:75px}.discord-banner em{color:#c6a4ff}.banner-star{color:#b39add20}.button.light{background:#e1d2f4d9;color:#24182f;border-color:#f2e8ff}.reveal{opacity:1;transform:none}.motion-ready .reveal{opacity:0;transform:translateY(55px) rotateX(6deg);transition:opacity .8s,transform 1s cubic-bezier(.16,1,.3,1)}.motion-ready .reveal.visible{opacity:1;transform:none}.motion-ready .feature-grid article:nth-child(2){transition-delay:.08s}.motion-ready .feature-grid article:nth-child(3){transition-delay:.16s}footer{font-family:'Space Mono',monospace}footer>.brand{font-family:'Space Grotesk',sans-serif}footer p{font-size:8px;color:#8b7b9e}
@media(min-width:1600px){.scene-perspective{right:3%;width:70vw}.hero-copy{left:8%}}@media(max-width:1000px){.hero-stage{min-height:670px}.hero-copy h1{font-size:100px}.scene-perspective{width:83vw;right:-18%;top:14%;height:62%}.scene-card{width:290px;padding:18px;bottom:6%}.scene-card h2{font-size:18px}.hero-copy{top:25%}.hero-copy p{font-size:13px}.header nav{gap:20px}.feature-grid article{padding:23px}.feature-grid p{min-height:130px}.scene-final{letter-spacing:-2px}}@media(max-width:620px){.header{top:10px;left:10px;right:10px;padding:12px 13px;gap:11px}.header .brand{font-size:16px}.header nav{font-size:9px;gap:12px;padding-top:10px}.header .button.compact{font-size:8px;padding:8px 10px;gap:9px}.brand-mark{width:23px;height:23px;line-height:23px;font-size:20px}.hero-scroll{height:145svh;min-height:1050px}.hero-stage{height:100svh;min-height:760px}.scene-meta{top:124px;left:6%;right:6%;font-size:7px;letter-spacing:.4px}.scene-meta span:last-child{display:none}.hero-copy{top:162px;left:6%}.hero-copy .eyebrow{font-size:7px}.hero-copy h1{font-size:80px;margin:22px 0;line-height:.82}.hero-copy h1 b{font-size:19px;right:-22px}.hero-copy p{font-size:12px;margin-bottom:15px}.hero-copy .button{padding:12px 14px;font-size:9px;gap:15px}.hero-copy small{font-size:7px}.scene-perspective{width:94vw;right:-10%;height:43%;top:38%;transform:translateX(calc(var(--scene)*-10vw))}.scene-map{transform:rotateX(calc(36deg - var(--scene)*36deg)) rotateZ(calc(-12deg + var(--scene)*12deg)) scale(calc(.95 + var(--scene)*.15))}.map-pin{font-size:6px;padding:6px;gap:4px;letter-spacing:0}.map-pin i{width:4px;height:4px}.scene-card{right:6%;bottom:6%;width:220px;padding:12px 14px}.scene-card h2{font-size:16px;margin:9px 0}.scene-card p{font-size:9px}.card-top,.card-foot{font-size:6px}.card-foot{margin-top:9px;padding-top:9px}.cross{font-size:13px}.scroll-cue{left:6%;bottom:6%;writing-mode:vertical-rl;gap:9px;font-size:7px}.cue-line{height:35px;width:1px}.scene-final{font-size:42px;left:6%;bottom:12%}.section{padding-top:70px;padding-bottom:70px}.section h2{font-size:44px;letter-spacing:-2px}.kingdom-tabs button{font-size:8px;letter-spacing:0}.kingdom-detail h3{font-size:36px}.feature-grid article{padding:25px}.feature-grid p{min-height:0}.feature-grid h3{font-size:27px}.launcher-art{max-width:300px}.faqs{margin-top:5px}.discord-banner h2{font-size:44px}.marquee div{font-size:9px;letter-spacing:4px}.faq-section{padding-top:0}.section-heading p{font-size:13px}.discord-banner{margin-top:15px}.scene-meta{z-index:4}.hero-copy{pointer-events:none}.hero-copy a{pointer-events:auto}}
@media(prefers-reduced-motion:reduce){.hero-scroll{height:100svh;min-height:760px}.hero-stage{position:relative}.scene-map{transform:rotateX(25deg) rotateZ(-8deg)}.hero-copy,.scene-card{opacity:1;transform:none}.scene-final{display:none}.motion-ready .reveal{opacity:1;transform:none}.marquee div{transform:none}.feature-grid article:hover{transform:none}.launcher-art{transform:none}}

.header-actions{display:flex;align-items:center;gap:10px}.discord-top{background:#9b7de82b;border-color:#c3a4ff70}.header-actions .discord-top:hover{background:#a386ed4d}.map-pin{cursor:default;pointer-events:none;gap:7px}.map-pin>img{width:20px;height:24px;image-rendering:pixelated}.kingdom-tabs{gap:18px}.kingdom-tabs button{min-height:130px;padding:24px 30px;gap:24px;font-size:22px;letter-spacing:2px;color:#cfc4dd}.kingdom-tabs button>span{display:flex;flex-direction:column;gap:7px}.kingdom-tabs small{font-size:9px;letter-spacing:3px;font-weight:400;color:#a89bb9}.kingdom-badge{width:56px;height:65px;image-rendering:pixelated;filter:drop-shadow(0 5px 0 #0005);transition:transform .2s}.kingdom-tabs button:hover .kingdom-badge{transform:translateY(-4px)}.kingdom-detail .kingdom-sigil{width:96px;height:112px;opacity:1;image-rendering:pixelated}.scene-map>img{backface-visibility:hidden}
@media(max-width:900px){.kingdom-tabs button{padding:22px 16px;gap:15px;font-size:17px}.kingdom-badge{width:44px;height:52px}.header nav{gap:18px}.header-actions{gap:7px}}
@media(max-width:620px){.header .brand-mark{display:none}.header .brand{font-size:14px}.header-actions .button.compact{font-size:8px;padding:8px 9px;gap:8px}.header-actions .button span{font-size:15px}.header nav{order:3}.kingdom-tabs{gap:8px}.kingdom-tabs button{padding:18px 7px;min-height:145px;flex-direction:column;gap:15px;font-size:14px;letter-spacing:1px;text-align:center}.kingdom-tabs small{font-size:7px;letter-spacing:1.5px}.kingdom-badge{width:40px;height:47px}.map-pin>img{width:14px;height:17px}.map-pin{padding:5px;gap:4px}}

.kingdom-badge{width:76px;height:90px}.kingdom-tabs button{min-height:155px}.kingdom-detail .kingdom-sigil{width:110px;height:131px}.map-pin>img{width:24px;height:29px}
@media(max-width:900px){.kingdom-badge{width:60px;height:71px}.kingdom-tabs button{gap:14px}}
@media(max-width:620px){.kingdom-badge{width:52px;height:62px}.kingdom-tabs button{min-height:164px}.map-pin>img{width:16px;height:19px}}

/* Smooth heraldic birds, deliberately distinct silhouettes. */
.kingdom-badge,.kingdom-sigil,.map-pin>img{image-rendering:auto}

/* Island intro only. No cast shadows, corner glows, or tilted emblems. */
.scene-map>img{clip-path:inset(14% 0 0);filter:none!important;box-shadow:none!important}
.ocean-plane,.ambient .orb{display:none}
.scene-map,.scene-perspective,.hero-stage{filter:none!important;box-shadow:none!important}
.scene-card,.map-pin{box-shadow:none!important}
.hero-stage::before,.hero-stage::after,.scene-map::before,.scene-map::after{display:none!important}
.kingdom-badge,.kingdom-sigil,.map-pin>img{rotate:0deg!important;transform:none!important;filter:none!important;object-fit:contain;aspect-ratio:1}
.kingdom-badge{width:76px;height:76px}
.kingdom-detail .kingdom-sigil{width:110px;height:110px}
.map-pin>img{width:24px;height:24px}
.hero-scroll{height:190svh;min-height:0}
.hero-stage{height:100svh;min-height:0}
#world,#play{scroll-margin-top:110px}
@media(max-width:620px){
.hero-scroll{height:190svh}
.kingdom-badge{width:52px;height:52px}
.map-pin>img{width:16px;height:16px}
.scene-card{bottom:3%}
.scene-final{bottom:8%}
}
@media(prefers-reduced-motion:reduce){.hero-scroll{height:100svh;min-height:760px}.hero-stage{min-height:760px}}
/* Clip against the terrain image itself, rather than its letterboxed container. */
.scene-map>img{inset:auto 0 auto;top:50%;height:auto;aspect-ratio:4310/2859;translate:0 -50%;object-fit:fill;clip-path:inset(14% 0 0)}


@media(min-width:901px){
/* The full page is a reversible, scroll-controlled sequence. */
@media(prefers-reduced-motion:no-preference){
.scroll-cinema .scrub{--arrive:1;--leave:0;--drift:0;opacity:calc(.12 + var(--arrive)*.88 - var(--leave)*.12);translate:0 calc((1 - var(--arrive))*65px - var(--leave)*30px);scale:calc(.94 + var(--arrive)*.06 - var(--leave)*.025);transition:none}
.scroll-cinema .section-heading{perspective:900px}
.scroll-cinema .section-heading h2{translate:calc(var(--drift)*-55px) 0;rotate:calc(var(--drift)*-2deg)}
.scroll-cinema .section-heading p{translate:calc(var(--drift)*35px) 0}
.scroll-cinema .kingdom-tabs button:first-child{translate:calc((1 - var(--arrive))*-90px) calc((1 - var(--arrive))*65px);rotate:calc((1 - var(--arrive))*-9deg)}
.scroll-cinema .kingdom-tabs button:last-child{translate:calc((1 - var(--arrive))*90px) calc((1 - var(--arrive))*65px);rotate:calc((1 - var(--arrive))*9deg)}
.scroll-cinema .kingdom-badge{translate:0 calc(var(--drift)*-20px);rotate:calc(var(--drift)*-10deg)}
.scroll-cinema .kingdom-detail .kingdom-sigil{rotate:calc(var(--drift)*20deg);scale:calc(1 - var(--drift)*.15)}
.scroll-cinema .feature-grid{perspective:1000px}
.scroll-cinema .feature-grid article{transform:rotateY(calc((1 - var(--arrive))*-20deg));transform-origin:left center}
.scroll-cinema .feature-grid article:nth-child(2){translate:0 calc((1 - var(--arrive))*110px)}
.scroll-cinema .feature-grid article:nth-child(3){transform:rotateY(calc((1 - var(--arrive))*20deg));transform-origin:right center}
.scroll-cinema .feature-icon{display:inline-block;rotate:calc(var(--drift)*40deg)}
.scroll-cinema .key-line kbd{display:inline-block;rotate:calc(var(--drift)*-18deg);scale:calc(1 + var(--drift)*.15)}
.scroll-cinema .launcher-art{transform:perspective(900px) rotateY(calc(var(--drift)*-24deg)) rotateZ(calc(var(--drift)*-7deg));translate:0 calc(var(--drift)*-45px)}
.scroll-cinema .steps li{translate:calc((1 - var(--arrive))*70px) 0}
.scroll-cinema .faqs details{translate:calc((1 - var(--arrive))*45px) calc((1 - var(--arrive))*20px)}
.scroll-cinema .discord-banner{scale:calc(.82 + var(--arrive)*.18);translate:0 calc((1 - var(--arrive))*80px);border-radius:calc((1 - var(--arrive))*50px + 6px)}
.scroll-cinema .banner-star{rotate:calc(var(--drift)*80deg)}
.scroll-cinema .orb.one{transform:translate(calc(var(--page-progress)*-20vw),calc(var(--page-progress)*-25vh))}
.scroll-cinema .orb.two{transform:translate(calc(var(--page-progress)*30vw),calc(var(--page-progress)*20vh))}
.scroll-cinema .scrub:focus-within{opacity:1;translate:0 0;scale:1;rotate:0deg;transform:none}
}
@media(max-width:620px) and (prefers-reduced-motion:no-preference){
.scroll-cinema .section-heading h2{translate:calc(var(--drift)*-15px) 0;rotate:0deg}
.scroll-cinema .section-heading p{translate:0 0}
.scroll-cinema .kingdom-tabs button:first-child{translate:calc((1 - var(--arrive))*-20px) calc((1 - var(--arrive))*40px)}
.scroll-cinema .kingdom-tabs button:last-child{translate:calc((1 - var(--arrive))*20px) calc((1 - var(--arrive))*40px)}
}
}
.scroll-cinema .kingdom-tabs button{rotate:0deg!important}
.scroll-cinema .kingdom-badge,.scroll-cinema .kingdom-sigil{rotate:0deg!important;translate:none!important;transform:none!important}

/* Shallow terrain extrusion, without a broad cast shadow. */
.scene-map>img{filter:drop-shadow(0 3px 0 #46523a) drop-shadow(0 4px 0 #29332d)!important}
/* Phone/tablet mascot motion only; desktop styles remain untouched. */
@media(max-width:900px) and (prefers-reduced-motion:no-preference){
.launcher-art{transform:perspective(900px) translateX(calc(var(--mobile-drift,0)*16px)) rotateY(calc(var(--mobile-drift,0)*-24deg)) rotateZ(calc(var(--mobile-drift,0)*-6deg));transform-origin:center;transition:none}
}
/* Keep optical centers aligned for the approved transparent bird icons. */
.kingdom-tabs button{align-items:center}
.kingdom-badge,.kingdom-sigil{object-position:50% 50%}