:root{color-scheme:dark;--space:#030511;--ink:#f8f9ff;--muted:#bec6dd;--blue:#39bfff;--purple:#9b44ff;--magenta:#ef52e8;--cyan:#5af4e2;--line:#aabaff2e;--font:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;overflow-x:hidden;background:var(--space);color:var(--ink);font:16px/1.5 var(--font);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin:0}a:focus-visible{outline:3px solid var(--cyan);outline-offset:5px}.skip-link{position:fixed;z-index:100;top:8px;left:8px;padding:11px 15px;border-radius:6px;background:var(--cyan);color:#071324;transform:translateY(-150%)}.skip-link:focus{transform:none}.kicker{color:#e2e6f5;font-size:11px;font-weight:700;letter-spacing:3px;text-transform:uppercase}
.site-nav{position:absolute;z-index:40;top:0;left:50%;width:min(1240px,calc(100% - 48px));height:86px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:28px;border-bottom:1px solid #d2d8ff2b;transform:translateX(-50%);text-shadow:0 2px 14px #000}.cosmic-brand{display:inline-flex;width:max-content;font-size:24px;font-weight:850;letter-spacing:-1px}.cosmic-brand strong{color:#69a4ff}.site-nav nav{display:flex;gap:34px;color:#e6e9f7;font-size:14px;font-weight:650}.site-nav nav a{position:relative;min-height:44px;display:flex;align-items:center}.site-nav nav a::after{content:"";position:absolute;right:0;bottom:3px;left:0;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--blue),var(--purple));transform:scaleX(0);transition:transform .2s}.site-nav nav a:hover::after,.site-nav nav a.active::after{transform:scaleX(1)}
.nav-play,.primary-cta{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;border:1px solid #b4c7ff5c;background:linear-gradient(108deg,#078fff,#8b2eff 58%,#ca38e3);box-shadow:0 0 22px #3ab8ff6b,0 0 45px #913cff45,0 14px 34px #0007;color:#fff;font-weight:800;transition:transform .2s,box-shadow .2s}.nav-play::before,.primary-cta::before{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,#ffffff47 50%,transparent 70%);transform:translateX(-130%);transition:transform .65s}.nav-play:hover::before,.primary-cta:hover::before{transform:translateX(130%)}.nav-play:hover,.primary-cta:hover{transform:translateY(-3px);box-shadow:0 0 32px #3ab8ff8a,0 0 58px #913cff67,0 18px 40px #0008}.nav-play{justify-self:end;min-height:44px;padding:0 20px;gap:28px;border-radius:10px;font-size:14px}
.cosmic-hero{position:relative;isolation:isolate;min-height:970px;overflow:hidden;padding:177px max(24px,calc((100% - 1240px)/2)) 140px;background:#050718}.environment-plate{position:absolute;z-index:-9;inset:-2%;width:104%;height:104%;object-fit:cover;object-position:center top;filter:saturate(1.06) contrast(1.04);transform:scale(1.015);will-change:translate}#starfield{position:absolute;z-index:-6;inset:0;width:100%;height:100%;mix-blend-mode:screen;opacity:.6}.world-wash{position:absolute;z-index:-5;inset:0;pointer-events:none;background:linear-gradient(90deg,#02040dfa 0%,#050a19df 19%,#05081791 36%,transparent 58%),linear-gradient(180deg,#03040ea6 0%,transparent 20%,transparent 68%,#040713 97%),radial-gradient(circle at 62% 30%,transparent 0 17%,#35115e22 34%,transparent 54%)}.world-wash::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 55% 45%,transparent 35%,#01020aaa 100%);box-shadow:inset 0 -130px 120px #030511}.nebula{position:absolute;z-index:-4;border-radius:50%;filter:blur(54px);opacity:.28;pointer-events:none;will-change:translate,transform}.nebula-one{width:620px;height:210px;right:3%;top:128px;background:conic-gradient(from 40deg,#3522ff,#00c8ff,#e336ff,#3522ff);transform:rotate(-16deg);animation:nebula-drift 28s ease-in-out infinite alternate}.nebula-two{width:740px;height:190px;left:18%;bottom:145px;background:linear-gradient(90deg,transparent,#142fe8,#ca31ef,transparent);filter:blur(75px);opacity:.16;animation:haze-drift 34s ease-in-out infinite alternate}.atmospheric-haze{position:absolute;z-index:1;left:-10%;right:-10%;bottom:2%;height:32%;opacity:.32;background:radial-gradient(ellipse at 65% 55%,#eaa6ff70,transparent 30%),linear-gradient(180deg,transparent,#94cfff1d 45%,#10112dd9);filter:blur(20px);pointer-events:none;animation:haze-drift 24s ease-in-out infinite alternate}.shooting-star{position:absolute;z-index:2;top:17%;right:7%;width:150px;height:1px;background:linear-gradient(90deg,transparent,#d9f7ff,#fff);filter:drop-shadow(0 0 7px #6edbff);transform:rotate(-23deg);opacity:0;animation:shoot 12s ease-in-out 4s infinite}
.hero-copy{position:relative;z-index:16;width:39%;min-width:430px;padding:26px 26px 28px 0}.hero-copy::before{content:"";position:absolute;z-index:-1;inset:-42px -50px -42px -90px;border-radius:50%;background:radial-gradient(ellipse,#020511c7 0 42%,transparent 72%);filter:blur(10px)}.hero-copy h1{margin-top:20px;font-size:clamp(55px,5vw,78px);line-height:.96;letter-spacing:-4px;text-transform:uppercase;text-shadow:0 3px 28px #000,0 1px 2px #000}.hero-copy h1 span{display:inline-block;background:linear-gradient(98deg,#47d7ff 5%,#4e8cff 46%,#d64bff 93%);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 13px #298eff55)}.hero-explainer{max-width:470px;margin-top:25px;color:#eef1fb;font-size:16px;line-height:1.58;text-shadow:0 2px 8px #000,0 0 22px #000}.hero-explainer b{color:#94efff}.primary-cta{width:244px;min-height:58px;margin-top:28px;padding:0 25px;gap:33px;border-radius:11px}.hero-copy>small{display:block;width:244px;margin-top:13px;color:#d6d9e7;font-size:12px;text-align:center;text-shadow:0 2px 8px #000}
.portal-world{--px:0px;--py:0px;position:absolute;z-index:11;left:43.5%;top:20px;width:min(720px,48vw);aspect-ratio:1;transform:translate3d(var(--px),var(--py),0);perspective:850px;will-change:transform}#portal-particles{position:absolute;z-index:2;inset:-11%;width:122%;height:122%;pointer-events:none;mix-blend-mode:screen}.portal-rift{position:absolute;z-index:1;inset:12%;border-radius:50%;background:repeating-conic-gradient(from 21deg,transparent 0 5deg,#55d9ff77 8deg,transparent 12deg 18deg,#df4cff70 23deg,transparent 29deg 38deg);filter:blur(9px) drop-shadow(0 0 19px #673cff);opacity:.82;animation:rift-flow 17s linear infinite;mask:radial-gradient(circle,transparent 0 38%,#000 47% 59%,transparent 70%)}.portal-rift::before,.portal-rift::after{content:"";position:absolute;inset:5%;border-radius:47% 53% 46% 54%/52% 45% 55% 48%;border:5px solid #87ecffb8;box-shadow:0 0 17px #5ceaff,inset 0 0 24px #b528ff,0 0 60px #651bff;filter:blur(2px);animation:rift-warp 6s ease-in-out infinite alternate}.portal-rift::after{inset:14%;border-width:9px 2px 5px 3px;border-color:#f678ff #54d9ff #794aff #fff;animation-delay:-3s}.portal-halo{position:absolute;left:50%;top:50%;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;will-change:transform}.halo-outer{z-index:3;width:75%;height:75%;border:2px solid #6547ffc2;box-shadow:0 0 18px #5b4cff,0 0 62px #8f26ff7d,inset 0 0 48px #40bdff4a;animation:spin-centered 31s linear infinite}.halo-outer::before,.halo-outer::after{content:"";position:absolute;inset:-12px;border-radius:48% 52% 55% 45%;border:5px dotted #7beaff9c;filter:blur(1px)}.halo-outer::after{inset:18px;border-style:dashed;border-color:#f375ff99;animation:spin 13s linear infinite reverse}.halo-mid{z-index:4;width:61%;height:61%;border:10px solid transparent;background:conic-gradient(transparent,#5ee9ff,#9c2cff,transparent 24%,#f84bd9,#2ca7ff,transparent 61%,#fff,#6d39ff,transparent) border-box;mask:linear-gradient(#000 0 0) padding-box,linear-gradient(#000 0 0);mask-composite:exclude;filter:drop-shadow(0 0 12px #763dff) drop-shadow(0 0 28px #1595ff);animation:spin-centered-reverse 12s linear infinite}.halo-inner{z-index:4;width:48%;height:48%;border:1px solid #caf3ffbb;background:radial-gradient(circle at 48% 45%,#02091d 0 22%,#071c5d 43%,#231463 65%,transparent 72%);box-shadow:inset 0 0 38px #3a9cffaa,0 0 26px #41d9ff,0 0 72px #a22cff;animation:inner-breathe 4.5s ease-in-out infinite}.energy-arcs{position:absolute;z-index:7;inset:0;animation:spin 23s linear infinite;pointer-events:none}.energy-arcs i{position:absolute;width:10px;height:10px;border-radius:50%;background:#fff;box-shadow:0 0 7px #fff,0 0 22px #46cfff,0 0 40px #463cff}.energy-arcs i::after{content:"";position:absolute;top:4px;right:4px;width:80px;height:2px;background:linear-gradient(90deg,transparent,currentColor);transform:rotate(25deg);filter:blur(1px)}.energy-arcs i:nth-child(1){top:12%;left:47%;color:#68efff}.energy-arcs i:nth-child(2){top:47%;right:8%;color:#ff79f1}.energy-arcs i:nth-child(3){bottom:8%;left:42%;color:#52dfff}.energy-arcs i:nth-child(4){top:44%;left:9%;color:#b785ff}
.portal-core{position:absolute;z-index:8;inset:36%;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid #aadfff66;border-radius:50%;background:radial-gradient(circle at 48% 42%,#214493,#081843 57%,#020414 78%);box-shadow:inset 0 0 35px #62c7ff9a,0 0 30px #47dfff,0 0 75px #843bff;color:#fff;text-align:center;animation:core-pulse 4s ease-in-out infinite}.portal-core::after{content:"";position:absolute;inset:-16%;border-radius:50%;background:conic-gradient(from 20deg,transparent,#6adaff45,transparent 31%,#df54ff4f,transparent 68%);filter:blur(8px);animation:spin 9s linear infinite}.portal-core span,.portal-core small{position:relative;z-index:1;color:#d7ebff;font-size:9px;letter-spacing:1.8px;text-transform:uppercase}.portal-core strong{position:relative;z-index:1;font-size:clamp(46px,5vw,75px);line-height:1;font-weight:750;text-shadow:0 0 10px #fff,0 0 26px #55cfff}.portal-core small{margin-top:8px;color:#91e3ff;font-size:7px}
.number-cube{--r:-8deg;--tilt:8deg;position:absolute;z-index:12;width:82px;aspect-ratio:1;display:grid;place-items:center;border:1px solid #cbe2ffc2;border-radius:13px 18px 14px 20px;background:linear-gradient(145deg,#2877e8ef,#122b84ed 43%,#050b2bf2);box-shadow:inset 8px 8px 18px #b9e9ff42,inset -12px -14px 24px #020519a6,0 0 18px #35a8ff,0 0 42px #224cff8c,13px 20px 26px #000c;transform:rotate(var(--r)) rotateX(var(--tilt)) rotateY(-8deg);transform-style:preserve-3d;clip-path:polygon(12% 3%,87% 0,100% 16%,95% 86%,78% 100%,9% 94%,0 74%,3% 17%);animation:crystal-float 7s ease-in-out infinite;will-change:transform,translate}.number-cube::before{content:"";position:absolute;inset:7px;border:1px solid #d9efff57;border-radius:8px 12px 9px 14px;background:linear-gradient(130deg,#ffffff27,transparent 35% 67%,#78cbff1f);clip-path:inherit}.number-cube::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,#fff4,transparent);transform:translateX(-110%) skewX(-18deg);animation:crystal-shimmer 7s ease-in-out infinite}.number-cube span{position:relative;z-index:2;font-size:31px;font-weight:850;text-shadow:0 0 7px #fff,0 0 18px #6be6ff}.number-cube i{position:absolute;z-index:-1;inset:18%;background:#60ccff;filter:blur(20px);opacity:.55}.crystal-violet{background:linear-gradient(145deg,#a33becf2,#3a1677ed 50%,#100526f2);box-shadow:inset 8px 8px 18px #f4bdff45,inset -12px -14px 24px #100018a6,0 0 18px #cf5cff,0 0 42px #7b22ff91,13px 20px 26px #000c}.crystal-magenta{background:linear-gradient(145deg,#dc3b9ff2,#721250ed 50%,#27051df2);box-shadow:inset 8px 8px 18px #ffc2eb45,inset -12px -14px 24px #16000fa6,0 0 18px #ff53d1,0 0 42px #a31dff88,13px 20px 26px #000c}.crystal-deep{filter:brightness(.78)}.cube-75{left:23%;top:12%;--r:-13deg;--tilt:12deg}.cube-8{right:14%;top:18%;--r:12deg;--tilt:-7deg;animation-delay:-2.1s}.cube-6{right:5%;top:54%;--r:7deg;--tilt:4deg;animation-delay:-4s;scale:.72;filter:brightness(.72) blur(.15px)}.cube-5{right:27%;bottom:4%;--r:-8deg;--tilt:10deg;animation-delay:-1s;scale:.88}.cube-3{left:19%;bottom:9%;--r:10deg;--tilt:-6deg;animation-delay:-3.3s;scale:.78}.cube-2{left:5%;top:50%;--r:-7deg;animation-delay:-5s;scale:.62;filter:brightness(.75) blur(.2px)}.operator{position:absolute;z-index:9;color:#c0f9ff;font-size:46px;font-weight:250;text-shadow:0 0 8px #fff,0 0 21px #4ec7ff,0 0 42px #3c78ff;animation:operator-float 8s ease-in-out infinite}.op-add{left:12%;top:29%}.op-sub{right:9%;top:37%;animation-delay:-2s}.op-mul{left:35%;bottom:3%;animation-delay:-5s}.op-div{right:34%;top:5%;animation-delay:-3s}
.orbital-debris{position:absolute;z-index:5;inset:8%;border-radius:50%;animation:spin 39s linear infinite}.orbital-debris i{position:absolute;width:13px;height:17px;background:linear-gradient(135deg,#727b9c,#151526);box-shadow:0 0 8px #6b52ff77;clip-path:polygon(42% 0,100% 31%,79% 100%,12% 78%,0 25%)}.orbital-debris i:nth-child(1){left:4%;top:29%;scale:.8;rotate:40deg}.orbital-debris i:nth-child(2){left:21%;bottom:2%;scale:1.2;rotate:90deg}.orbital-debris i:nth-child(3){right:8%;bottom:23%;scale:.6;rotate:10deg}.orbital-debris i:nth-child(4){right:16%;top:5%;scale:1.5;rotate:53deg}.orbital-debris i:nth-child(5){left:46%;top:-3%;scale:.7;rotate:122deg}.orbital-debris i:nth-child(6){right:42%;bottom:-4%;rotate:73deg}
.energy-path{position:absolute;z-index:13;right:20%;bottom:122px;width:530px;height:120px;display:flex;align-items:center;justify-content:space-between;transform:perspective(600px) rotateX(58deg) rotateZ(-5deg);pointer-events:none}.energy-path::before{content:"";position:absolute;left:3%;right:3%;top:50%;height:4px;background:linear-gradient(90deg,transparent,#38ccff,#d555ff,#45e9ff,transparent);box-shadow:0 0 8px #4bdcff,0 0 24px #8b3cff;animation:path-energy 5s linear infinite}.energy-path span{position:relative;z-index:1;padding:8px 12px;border:1px solid #a996ff7d;border-radius:3px;background:linear-gradient(160deg,#182352e8,#090919e8);box-shadow:0 8px 18px #0009,0 0 15px #7845ff66;color:#d8eaff;font-size:9px;font-weight:800;letter-spacing:1px;text-transform:uppercase}.universe-note{position:absolute;z-index:15;color:#f0e8ff;font-family:"Bradley Hand","Segoe Print",cursive;font-size:16px;line-height:1.38;text-shadow:0 2px 12px #000,0 0 14px #492f92;transform:rotate(-7deg)}.universe-note strong{color:#c9adff}.note-one{right:3.5%;top:158px}.note-two{right:5%;bottom:245px;transform:rotate(6deg)}.foreground-vignette{position:absolute;z-index:14;inset:auto -3% -10% -3%;height:37%;background:linear-gradient(0deg,#010208 0 8%,transparent 70%),radial-gradient(ellipse at 12% 100%,#000d 0 22%,transparent 44%),radial-gradient(ellipse at 91% 100%,#000c 0 19%,transparent 42%);pointer-events:none;opacity:.58;will-change:translate}.scroll-cue{position:absolute;z-index:20;bottom:29px;left:50%;display:flex;align-items:center;gap:20px;color:#d9def0;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;text-shadow:0 2px 8px #000;transform:translateX(-50%)}.scroll-cue i{color:#78ecff;font-style:normal;animation:bob 2.2s ease-in-out infinite}
.journey-section{position:relative;isolation:isolate;overflow:hidden;padding:112px max(24px,calc((100% - 1240px)/2));background:radial-gradient(circle at 83% 0%,#4b1a9c50,transparent 33%),radial-gradient(circle at 15% 100%,#064b765c,transparent 35%),linear-gradient(180deg,#050918,#080a20)}.journey-section::before{content:"";position:absolute;z-index:-1;inset:0;opacity:.2;background-image:linear-gradient(#83aaff11 1px,transparent 1px),linear-gradient(90deg,#83aaff11 1px,transparent 1px);background-size:70px 70px;mask-image:linear-gradient(transparent,#000 28%,transparent);transform:perspective(450px) rotateX(64deg) scale(1.5)}.section-intro{max-width:720px}.section-intro h2,.example-copy h2,.final-gateway h2{margin-top:20px;font-size:clamp(45px,5.2vw,76px);line-height:1;letter-spacing:-4px}.section-intro h2 span,.example-copy h2 span,.final-gateway h2 span{background:linear-gradient(100deg,#42d7ff,#b849ff);background-clip:text;-webkit-background-clip:text;color:transparent}.section-intro>p:last-child{max-width:510px;margin-top:22px;color:var(--muted);line-height:1.7}.journey-grid{margin:64px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);border:1px solid #9ec1ff55;border-radius:17px;background:linear-gradient(150deg,#0e1b3cce,#06091edb);box-shadow:0 34px 90px #0008,inset 0 1px #fff1,0 0 45px #4438c424;backdrop-filter:blur(15px);list-style:none;overflow:hidden}.journey-grid li{position:relative;min-width:0;min-height:335px;padding:26px 22px;display:flex;flex-direction:column}.journey-grid li::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 20%,#447cff18,transparent 45%);opacity:0;transition:opacity .3s}.journey-grid li:hover::before{opacity:1}.journey-grid li+li{border-left:1px solid var(--line)}.step-number{color:#75c8ff;font-size:12px;font-weight:800}.tile-row,.operation-row{height:104px;display:flex;align-items:center;gap:5px}.tile-row b,.operation-row b{min-width:31px;height:37px;display:grid;place-items:center;border:1px solid #7899e575;border-radius:7px;background:linear-gradient(145deg,#294882,#111b44);box-shadow:inset 0 1px #fff2,0 6px 12px #0005;color:#eef6ff;font-size:14px}.operation-row b{min-width:42px;height:42px;color:#79ddff;font-size:22px}.target-token{height:104px;display:flex;align-items:baseline;gap:11px}.target-token span{color:#9da8c8;font-size:11px;text-transform:uppercase}.target-token strong{color:#5ae6d7;font-size:44px;text-shadow:0 0 18px #33a9bd70}.route-map{height:104px;display:flex;align-items:center;gap:4px}.route-map i{position:relative;width:23px;height:1px;background:#667fc5}.route-map i::after{content:"";position:absolute;right:-2px;top:-2px;width:5px;height:5px;border-radius:50%;background:#76d8f7;box-shadow:0 0 8px #76d8f7}.route-map span{margin-left:5px;color:#56ebd6;font-size:25px;font-weight:800}.journey-grid h3{position:relative;margin-top:auto;font-size:20px}.journey-grid p{position:relative;margin-top:11px;color:#b9c2d9;font-size:14px;line-height:1.55}
.example-section{position:relative;isolation:isolate;overflow:hidden;padding:115px max(24px,calc((100% - 1140px)/2));display:grid;grid-template-columns:.8fr 1.2fr;gap:9%;align-items:center;background:linear-gradient(125deg,#07091a,#101039 52%,#0c0823)}.example-section::before{content:"";position:absolute;z-index:-1;width:760px;height:760px;right:-290px;top:-200px;border-radius:50%;border:1px solid #8a5cff3d;background:repeating-conic-gradient(transparent 0 14deg,#6051ff0b 15deg 16deg);box-shadow:0 0 0 42px #9f38ff08,0 0 0 43px #7a58ff2a,0 0 0 90px #9f38ff07,0 0 0 91px #3f8fff24;animation:spin 70s linear infinite}.example-atmosphere i{position:absolute;border-radius:50%;background:#fff;box-shadow:0 0 12px #53cfff}.example-atmosphere i:nth-child(1){left:4%;top:18%;width:3px;height:3px}.example-atmosphere i:nth-child(2){right:32%;top:11%;width:2px;height:2px}.example-atmosphere i:nth-child(3){left:48%;bottom:13%;width:4px;height:4px}.example-copy{position:relative}.example-copy>p:last-of-type{max-width:430px;margin-top:21px;color:var(--muted);line-height:1.7}.example-target{margin-top:38px;display:flex;align-items:baseline;gap:18px}.example-target span{color:#9ca7c9;font-size:12px;letter-spacing:2px;text-transform:uppercase}.example-target strong{color:var(--cyan);font-size:56px;text-shadow:0 0 24px #4cf2e176}.worked-example{position:relative;padding:28px;border:1px solid #94b1ff66;border-radius:16px;background:linear-gradient(145deg,#101d49e8,#080d25e6);box-shadow:0 30px 80px #0007,inset 0 1px #ffffff1c,0 0 40px #5938d526;backdrop-filter:blur(14px)}.given-numbers{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;padding-bottom:22px;border-bottom:1px solid var(--line)}.given-numbers span{height:47px;display:grid;place-items:center;border:1px solid #8ca6fa73;border-radius:8px;background:linear-gradient(145deg,#29427f,#111a43);box-shadow:inset 0 1px #fff2,0 7px 15px #0005;font-weight:800}.worked-example ol{margin:22px 0 0;padding:0;list-style:none}.worked-example li{min-height:50px;padding:0 13px;display:flex;align-items:center;gap:17px;border-radius:7px;color:#cdd3e7;opacity:0;transform:translateY(10px)}.worked-example.play li{animation:reveal-step .45s ease forwards}.worked-example li:nth-child(2){animation-delay:.38s}.worked-example li:nth-child(3){animation-delay:.76s}.worked-example li:nth-child(4){animation-delay:1.14s}.worked-example li:nth-child(5){animation-delay:1.52s}.worked-example li>span{width:25px;color:#6da4ff;font-size:11px}.worked-example li strong{font-size:17px}.worked-example .final-step{margin-top:6px;border:1px solid #54dbc36b;background:#1551494f}.worked-example .final-step strong{font-size:19px}.worked-example .final-step b{color:#59f1d7;font-size:25px}.worked-example .final-step i{margin-left:auto;width:27px;height:27px;display:grid;place-items:center;border-radius:50%;background:#53e1bd;color:#05231f;font-style:normal;font-weight:900;box-shadow:0 0 15px #53e1bd77}
.final-gateway{position:relative;isolation:isolate;min-height:600px;padding:130px 24px;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 55%,#4b1da679,transparent 34%),radial-gradient(circle at 50% 50%,#173877 0,#060716 58%);text-align:center}.final-gateway>canvas{position:absolute;z-index:-3;inset:0;width:100%;height:100%}.gateway-ring{position:absolute;z-index:-1;width:510px;height:510px;border:2px solid #7246ff66;border-radius:50%;box-shadow:0 0 40px #633dff68,inset 0 0 70px #238bff3d}.gateway-ring::before,.gateway-ring::after{content:"";position:absolute;inset:35px;border:1px dashed #72d8ff8f;border-radius:47% 53% 50% 49%;animation:spin 29s linear infinite}.gateway-ring::after{inset:75px;border-color:#d054ff99;animation-direction:reverse;animation-duration:21s}.final-gateway>div:last-child{position:relative}.final-gateway h2{max-width:900px;text-shadow:0 3px 20px #000}.final-gateway .primary-cta{margin:38px auto 0}footer{min-height:120px;padding:0 max(24px,calc((100% - 1240px)/2));display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;border-top:1px solid var(--line);background:#03040d;color:#959db5;font-size:12px}footer .cosmic-brand{font-size:17px}footer p:last-child{justify-self:end}
[data-reveal]{opacity:1;transform:none}.js-ready [data-reveal]{opacity:0;transform:translateY(28px);transition:opacity .75s,transform .75s cubic-bezier(.2,.7,.2,1)}.js-ready [data-reveal].visible{opacity:1;transform:none}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes spin-centered{to{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes spin-centered-reverse{to{transform:translate(-50%,-50%) rotate(-360deg)}}@keyframes rift-flow{to{transform:rotate(360deg) scale(1.03)}}@keyframes rift-warp{to{border-radius:53% 47% 41% 59%/46% 56% 44% 54%;transform:rotate(9deg) scale(1.04)}}@keyframes inner-breathe{50%{opacity:.78;transform:translate(-50%,-50%) scale(1.035)}}@keyframes core-pulse{50%{box-shadow:inset 0 0 44px #62c7ffb8,0 0 39px #47dfff,0 0 90px #9b3bff;transform:scale(1.025)}}@keyframes crystal-float{50%{transform:translateY(-12px) rotate(calc(var(--r) + 4deg)) rotateX(calc(var(--tilt) + 3deg)) rotateY(5deg)}}@keyframes crystal-shimmer{0%,60%{transform:translateX(-130%) skewX(-18deg)}85%,100%{transform:translateX(140%) skewX(-18deg)}}@keyframes operator-float{50%{transform:translateY(-10px) rotate(5deg)}}@keyframes nebula-drift{to{transform:translate(-45px,18px) rotate(-11deg) scale(1.08)}}@keyframes haze-drift{to{transform:translateX(65px) scale(1.07)}}@keyframes path-energy{50%{filter:brightness(1.7);transform:scaleX(1.025)}}@keyframes bob{50%{transform:translateY(7px)}}@keyframes shoot{0%,74%{opacity:0;transform:translate(0,0) rotate(-23deg)}76%{opacity:1}84%{opacity:0;transform:translate(-340px,175px) rotate(-23deg)}100%{opacity:0}}@keyframes reveal-step{to{opacity:1;transform:none}}
@media(max-width:1180px){.cosmic-hero{min-height:900px}.portal-world{left:45%;width:650px}.hero-copy{width:43%;min-width:390px}.energy-path{right:8%;transform:scale(.86) perspective(600px) rotateX(58deg) rotateZ(-5deg)}.note-one{display:none}.journey-grid{grid-template-columns:1fr 1fr}.journey-grid li:nth-child(3){border-left:0;border-top:1px solid var(--line)}.journey-grid li:nth-child(4){border-top:1px solid var(--line)}.journey-grid li{min-height:285px}.example-section{gap:5%}}
@media(max-width:820px){.site-nav{height:76px;width:calc(100% - 32px);grid-template-columns:1fr auto}.site-nav nav{display:none}.cosmic-brand{font-size:20px}.cosmic-hero{min-height:1080px;padding:118px 24px 105px;display:flex;flex-direction:column;align-items:center;text-align:center}.environment-plate{inset:0;width:100%;height:100%;object-position:61% center;opacity:.78;transform:scale(1.08)}.world-wash{background:linear-gradient(180deg,#030511d6 0 36%,transparent 63%,#040713 95%),radial-gradient(ellipse at 50% 20%,#0407127a 0 32%,transparent 62%)}.hero-copy{width:100%;min-width:0;padding:0}.hero-copy::before{inset:-45px -25px}.hero-copy h1{font-size:clamp(50px,10vw,72px);letter-spacing:-3px}.hero-explainer{margin-right:auto;margin-left:auto}.hero-copy .primary-cta,.hero-copy>small{margin-right:auto;margin-left:auto}.portal-world{position:relative;left:auto;top:auto;width:min(630px,95vw);margin-top:5px;flex:0 0 auto}.energy-path{right:50%;bottom:86px;width:570px;transform:translateX(50%) scale(.72) perspective(600px) rotateX(58deg) rotateZ(-5deg)}.note-two{display:none}.scroll-cue{bottom:20px}.foreground-vignette{opacity:.72}.journey-section{padding-top:85px;padding-bottom:85px}.section-intro h2,.example-copy h2,.final-gateway h2{font-size:57px;letter-spacing:-3px}.example-section{padding:85px 24px;grid-template-columns:1fr;gap:45px}.example-copy{text-align:center}.example-copy>p:last-of-type{margin-right:auto;margin-left:auto}.example-target{justify-content:center}.worked-example{width:min(600px,100%);margin:auto}.final-gateway{min-height:540px}.site-nav .nav-play{font-size:13px}}
@media(max-width:560px){.site-nav{height:68px}.cosmic-brand{font-size:18px}.nav-play{min-height:43px;padding:0 14px;gap:14px;font-size:12px}.cosmic-hero{min-height:920px;padding:98px 18px 78px}.environment-plate{object-position:57% center;opacity:.65;transform:scale(1.18);filter:saturate(.95) contrast(1.02)}.hero-copy h1{margin-top:14px;font-size:clamp(43px,13vw,60px);letter-spacing:-2.6px}.hero-explainer{max-width:370px;margin-top:18px;font-size:14px;line-height:1.55}.primary-cta{width:220px;min-height:54px;margin-top:22px}.portal-world{width:112vw;margin-top:-4px}#portal-particles{display:none}.portal-core strong{font-size:45px}.portal-core span{font-size:8px}.portal-core small{font-size:6px}.number-cube{width:60px}.number-cube span{font-size:23px}.cube-2,.cube-6{display:none}.operator{font-size:34px}.orbital-debris i:nth-child(n+4){display:none}.energy-path{bottom:80px;width:470px;transform:translateX(50%) scale(.64) perspective(600px) rotateX(58deg) rotateZ(-5deg)}.energy-path span:nth-child(3),.energy-path span:nth-child(5){display:none}.universe-note{display:none}.scroll-cue{font-size:9px}.journey-section{padding:65px 18px}.section-intro h2,.example-copy h2,.final-gateway h2{font-size:44px;letter-spacing:-2.4px}.section-intro>p:last-child{font-size:14px}.journey-grid{grid-template-columns:1fr;margin-top:42px}.journey-grid li{min-height:235px}.journey-grid li+li{border-left:0;border-top:1px solid var(--line)}.journey-grid li:nth-child(2){border-top:1px solid var(--line)}.tile-row,.operation-row,.target-token,.route-map{height:80px}.tile-row b{min-width:30px}.example-section{padding:70px 18px}.worked-example{padding:18px}.worked-example li{padding:0 7px;gap:10px}.worked-example li strong{font-size:15px}.worked-example .final-step strong{font-size:16px}.given-numbers{gap:5px}.given-numbers span{height:43px;font-size:14px}.final-gateway{min-height:480px;padding:90px 18px}.gateway-ring{width:380px;height:380px}.final-gateway h2{font-size:42px}footer{padding:28px 18px;grid-template-columns:1fr;gap:8px}footer p{margin:0}footer p:last-child{justify-self:start}.shooting-star{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.portal-world,.nebula,.environment-plate,.atmospheric-haze,.foreground-vignette,[data-depth]{transform:none!important;translate:none!important}#portal-particles{display:none}.js-ready [data-reveal]{opacity:1;transform:none}.worked-example li{opacity:1;transform:none}}

/* Composition alignment: the live target portal sits directly over the energy focal point in the scenery plate. */
.portal-world{left:42%;top:-40px;width:min(720px,40vw)}
@media(max-width:1180px){.portal-world{left:40%;top:-30px;width:600px}}
@media(max-width:820px){.environment-plate{object-position:28% center}.portal-world{position:relative;left:auto;top:auto;width:min(630px,95vw)}}
@media(max-width:560px){.environment-plate{object-position:27% center}.portal-world{width:112vw}}
@media(prefers-reduced-motion:reduce){.portal-world{transform:none!important}}

/* v1.12 — one continuous cinematic world */
.site-nav{
  width:min(1340px,calc(100% - 56px));
  height:72px;
  border-bottom:0;
  grid-template-columns:1fr auto 1fr;
}
.site-nav nav{gap:32px;font-size:13px}
.site-nav nav a::after{bottom:0}
.nav-play{min-height:42px;padding:0 22px;gap:12px;border-radius:12px}

.cosmic-hero{
  min-height:1040px;
  padding:0;
  background:#040612;
}
.environment-plate{
  inset:0;
  width:100%;
  height:100%;
  object-position:center center;
  transform:scale(1.025);
  filter:saturate(1.14) contrast(1.07) brightness(.88);
}
.world-wash{
  background:
    linear-gradient(90deg,#02040de8 0%,#040817bd 19%,#05081755 39%,transparent 60%),
    linear-gradient(180deg,#02030cb8 0%,transparent 19%,transparent 71%,#02040ee8 96%),
    radial-gradient(circle at 57% 26%,transparent 0 16%,#4211641f 31%,transparent 50%);
}
.world-wash::after{
  background:radial-gradient(ellipse at 54% 42%,transparent 34%,#01020a96 100%);
  box-shadow:inset 0 -110px 100px #02030c;
}

.hero-copy{
  position:absolute;
  z-index:18;
  top:154px;
  left:max(48px,calc((100% - 1340px)/2));
  width:360px;
  min-width:0;
  padding:0;
}
.hero-copy::before{inset:-44px -58px -48px -72px;background:radial-gradient(ellipse,#01030dd9 0 38%,transparent 73%)}
.hero-copy h1{margin-top:16px;font-size:clamp(45px,4vw,61px);line-height:.94;letter-spacing:-3px}
.hero-copy h1 span{white-space:nowrap;text-shadow:0 0 10px #2e8dff88,0 0 22px #8c48ff55}
.hero-explainer{max-width:350px;margin-top:18px;font-size:14px;line-height:1.48}
.hero-copy .primary-cta{width:244px;min-height:54px;margin-top:18px}
.hero-copy>small{width:244px;margin-top:9px}

.portal-world{
  left:35.5%;
  top:22px;
  width:min(675px,46vw);
}
.portal-core{inset:37%}
.portal-core strong{font-size:clamp(46px,4.6vw,70px)}
.portal-core small{margin-top:5px}
.number-cube{width:74px}
.number-cube span{font-size:28px}

.energy-path{
  right:auto;
  left:44%;
  bottom:373px;
  width:465px;
  height:110px;
  transform:perspective(620px) rotateX(61deg) rotateZ(-7deg);
}
.energy-path::before{height:5px}
.energy-path span{
  min-width:76px;
  padding:9px 10px;
  border-radius:4px;
  background:linear-gradient(165deg,#28366ee8,#0b0b20ed 74%);
  box-shadow:0 12px 18px #000b,0 0 18px #7845ff88,inset 0 1px #fff3;
  font-size:8px;
  text-align:center;
  transform:skewX(-7deg);
}

.world-features{
  position:absolute;
  z-index:19;
  top:150px;
  right:max(34px,calc((100% - 1420px)/2));
  width:236px;
  height:430px;
}
.feature-island{
  position:absolute;
  width:215px;
  min-height:94px;
  padding:19px 22px 22px;
  display:flex;
  align-items:center;
  gap:14px;
  border:1px solid #8eb7ff73;
  clip-path:polygon(9% 4%,91% 0,100% 27%,94% 88%,76% 100%,14% 92%,0 68%,3% 22%);
  background:linear-gradient(145deg,#17264ed9,#080c21e8 65%,#160d2de8);
  box-shadow:inset 0 1px #fff3,0 16px 32px #000a,0 0 25px #3058e85c;
  backdrop-filter:blur(9px);
  transition:filter .25s,scale .25s;
  animation:island-float 7s ease-in-out infinite;
}
.feature-island::after{
  content:"";
  position:absolute;
  inset:auto 16% -12px 18%;
  height:20px;
  background:linear-gradient(180deg,#532788ad,transparent);
  clip-path:polygon(0 0,100% 0,73% 32%,59% 100%,43% 40%,23% 82%);
  filter:drop-shadow(0 0 9px #8c46ff);
}
.feature-island:hover{filter:brightness(1.22);scale:1.035}
.feature-island i{
  width:36px;
  height:36px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border:1px solid #7ee4ff8c;
  border-radius:50%;
  background:#142c5de8;
  color:#7de9ff;
  font-style:normal;
  box-shadow:0 0 18px #45bfff66;
}
.feature-island span{display:flex;flex-direction:column}
.feature-island strong{font-size:14px;line-height:1.2}
.feature-island small{margin-top:6px;color:#c7cee5;font-size:11px}
.island-daily{top:0;right:4px;animation-delay:-1s}
.island-custom{top:150px;left:5px;animation-delay:-3.6s}
.island-progress{top:302px;right:0;animation-delay:-5.2s}
.island-custom i{color:#f492ff;border-color:#d386ff8c;box-shadow:0 0 18px #b847ff66}
.island-progress i{color:#70f3d5;border-color:#61e9ce8c;box-shadow:0 0 18px #32deb866}

.universe-note{z-index:17;font-size:13px;line-height:1.32;opacity:.9}
.note-left{top:86px;left:5.5%;transform:rotate(-8deg)}
.note-one{top:105px;right:23%;transform:rotate(-5deg)}
.note-two{top:74px;right:2%;bottom:auto;transform:rotate(-8deg)}
.note-three{top:390px;left:6.5%;transform:rotate(-4deg)}
.note-four{bottom:80px;left:7%;transform:rotate(5deg)}

.world-dock{
  position:absolute;
  z-index:24;
  right:50%;
  bottom:112px;
  width:min(1090px,calc(100% - 360px));
  min-height:194px;
  display:grid;
  grid-template-columns:1.75fr .95fr;
  gap:14px;
  transform:translateX(50%);
}
.how-panel,.example-panel{
  border:1px solid #93b5ff75;
  border-radius:14px;
  background:linear-gradient(145deg,#111b38e8,#070b1fe8 70%,#0e102ae0);
  box-shadow:inset 0 1px #fff2,0 20px 50px #0009,0 0 35px #244fc739;
  backdrop-filter:blur(14px);
}
.how-panel{padding:15px 18px 17px}
.how-panel h2,.example-panel h2{font-size:15px;line-height:1.2}
.how-panel ol{margin:13px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);list-style:none}
.how-panel li{position:relative;min-width:0;padding:0 15px}
.how-panel li:first-child{padding-left:0}
.how-panel li+li{border-left:1px solid #95aaf52c}
.step-orb{
  width:23px;
  height:23px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:linear-gradient(145deg,#4bc5ff,#5568ff);
  box-shadow:0 0 12px #4d9fff8c;
  font-size:11px;
  font-weight:850;
}
.mini-visual{height:42px;margin-top:7px;display:flex;align-items:center;gap:4px}
.mini-visual b,.given-numbers span{
  display:grid;
  place-items:center;
  border:1px solid #819be26b;
  border-radius:5px;
  background:linear-gradient(145deg,#293b70,#121a3a);
  box-shadow:inset 0 1px #fff2,0 4px 8px #0005;
}
.mini-numbers b{width:24px;height:27px;font-size:10px}
.mini-operations b{width:30px;height:30px;color:#c9e9ff;font-size:17px}
.mini-target b{width:29px;height:28px;color:#66e2d5;font-size:15px}
.mini-target strong{margin-left:3px;color:#55ebd5;font-size:24px;text-shadow:0 0 14px #35dabd80}
.mini-idea{color:#ffe874;font-size:29px;text-shadow:0 0 17px #ffc94d}
.how-panel h3{font-size:12px;line-height:1.25}
.how-panel li p{margin-top:7px;color:#c4cbe0;font-size:10px;line-height:1.35}

.example-panel{position:relative;padding:15px 18px 16px}
.example-heading{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.example-heading p{font-size:12px}
.example-heading strong{color:#50d9ff;font-size:23px;text-shadow:0 0 14px #42aaff70}
.given-numbers{margin-top:8px;display:grid;grid-template-columns:repeat(6,1fr);gap:5px}
.given-numbers span{height:28px;font-size:11px;font-weight:800}
.example-panel ol{margin:9px 0 0;padding:0;list-style:none}
.example-panel li{min-height:23px;display:flex;align-items:center;justify-content:center;gap:8px;color:#e9edf8;font-size:12px}
.example-panel li b{min-width:48px;color:#d9dcf1}
.example-panel .final-step b{color:#5bedcf}
.example-panel .final-step i{
  width:18px;
  height:18px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#59e3ba;
  color:#05251f;
  font-size:11px;
  font-style:normal;
  font-weight:900;
  box-shadow:0 0 12px #59e3ba88;
}
.solution-note{position:absolute;right:-5px;bottom:-25px;color:#e5dcff;font-family:"Bradley Hand","Segoe Print",cursive;font-size:11px;transform:rotate(-4deg)}

.bottom-cta{
  position:absolute;
  z-index:25;
  bottom:20px;
  left:50%;
  display:flex;
  flex-direction:column;
  align-items:center;
  transform:translateX(-50%);
}
.bottom-cta p{font-size:13px;font-weight:750;text-shadow:0 2px 10px #000}
.bottom-cta .primary-cta{width:230px;min-height:50px;margin-top:8px}
.foreground-vignette{z-index:13;height:44%;opacity:.74}
footer{min-height:88px}

@keyframes island-float{50%{transform:translateY(-8px) rotate(.5deg)}}

@media(max-width:1240px){
  .site-nav nav{gap:22px}
  .hero-copy{left:36px;width:330px}
  .hero-copy h1{font-size:50px}
  .portal-world{left:33%;width:600px}
  .world-features{right:18px;width:210px}
  .feature-island{width:198px}
  .energy-path{left:39%;width:430px}
  .world-dock{width:calc(100% - 72px)}
  .note-left,.note-three,.note-four{display:none}
}

@media(max-width:980px){
  .site-nav{width:calc(100% - 32px);height:72px;grid-template-columns:1fr auto}
  .site-nav nav{display:none}
  .cosmic-hero{min-height:0;padding:112px 24px 46px;display:flex;flex-direction:column;align-items:center;text-align:center}
  .environment-plate{object-position:45% top;opacity:.8;transform:scale(1.04)}
  .world-wash{background:linear-gradient(180deg,#02040ddb 0 19%,#05081777 43%,#02040de8 96%),radial-gradient(circle at 50% 25%,transparent,#030511b8 70%)}
  .hero-copy{position:relative;top:auto;left:auto;width:min(590px,100%);padding:0}
  .hero-copy::before{inset:-45px -30px}
  .hero-copy h1{font-size:clamp(48px,8vw,70px)}
  .hero-copy h1 span{white-space:normal}
  .hero-explainer{max-width:520px;margin-right:auto;margin-left:auto;font-size:15px}
  .hero-copy .primary-cta,.hero-copy>small{margin-right:auto;margin-left:auto}
  .portal-world{position:relative;left:auto;top:auto;width:min(660px,96vw);margin-top:-20px}
  .energy-path{position:relative;left:auto;bottom:auto;width:min(560px,90vw);height:105px;margin-top:-115px;transform:perspective(620px) rotateX(61deg) rotateZ(-4deg)}
  .world-features{position:relative;top:auto;right:auto;width:min(700px,100%);height:auto;margin-top:12px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
  .feature-island{position:relative;inset:auto;width:100%;min-height:102px;padding:18px 15px;animation:none}
  .feature-island::after{display:none}
  .feature-island i{width:32px;height:32px}
  .feature-island strong{font-size:13px}
  .note-one,.note-two{display:none}
  .world-dock{position:relative;right:auto;bottom:auto;width:min(760px,100%);margin-top:28px;grid-template-columns:1fr;transform:none;text-align:left}
  .bottom-cta{position:relative;bottom:auto;left:auto;margin-top:28px;transform:none}
  .foreground-vignette{height:25%}
}

@media(max-width:680px){
  .site-nav{height:66px}
  .cosmic-brand{font-size:19px}
  .nav-play{min-height:40px;padding:0 14px;font-size:12px}
  .cosmic-hero{padding:96px 16px 38px}
  .environment-plate{object-position:42% top;opacity:.66;filter:saturate(1.05) contrast(1.03) brightness(.78)}
  .hero-copy h1{font-size:clamp(42px,13vw,58px);letter-spacing:-2.5px}
  .hero-explainer{font-size:14px;line-height:1.52}
  .portal-world{width:112vw;margin-top:-5px}
  #portal-particles{display:none}
  .number-cube{width:58px}
  .number-cube span{font-size:22px}
  .cube-2,.cube-6{display:none}
  .operator{font-size:33px}
  .energy-path{width:125vw;margin-top:-105px;scale:.72}
  .energy-path span:nth-child(2),.energy-path span:nth-child(4){display:none}
  .world-features{margin-top:-5px;grid-template-columns:1fr}
  .feature-island{width:min(330px,100%);min-height:78px;margin:auto;padding:14px 22px;clip-path:polygon(6% 4%,94% 0,100% 25%,96% 90%,77% 100%,10% 93%,0 69%,2% 20%)}
  .how-panel{padding:16px}
  .how-panel ol{grid-template-columns:1fr 1fr;gap:0}
  .how-panel li{min-height:150px;padding:10px 12px}
  .how-panel li:first-child{padding-left:12px}
  .how-panel li+li{border-left:0}
  .how-panel li:nth-child(even){border-left:1px solid #95aaf52c}
  .how-panel li:nth-child(n+3){border-top:1px solid #95aaf52c}
  .how-panel li p{font-size:11px}
  .mini-visual{height:38px}
  .example-panel{padding:16px}
  .solution-note{position:static;margin-top:8px;text-align:right;transform:rotate(-2deg)}
  .bottom-cta{margin-top:24px}
  footer{padding:24px 18px;grid-template-columns:1fr;gap:6px}
  footer p:last-child{justify-self:start}
}

@media(prefers-reduced-motion:reduce){
  .feature-island{animation:none!important}
}

/* v1.30: deeper portal travel with colour preserved through the hand-off. */
.game-transition{position:fixed;z-index:9999;inset:0;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 50%,#1d145b 0,#080b2d 42%,#020514 100%);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .14s ease,visibility 0s linear .76s}.game-transition::before,.game-transition::after,.game-transition i,.game-transition span{content:"";position:absolute;left:50%;top:50%;border-radius:50%;transform:translate(-50%,-50%) scale(.16);opacity:0}.game-transition::before{width:92vmax;height:92vmax;border:3px solid #58dcff;background:radial-gradient(circle,#9ff4ff 0 1.5%,#25bfe8 3%,#4c4cea 11%,#812bc9 23%,#25105e 39%,#080c31 58%,transparent 70%);box-shadow:0 0 6vmax #178eff,0 0 13vmax #b12eff inset}.game-transition::after{width:66vmax;height:66vmax;border:2px solid #db5aff;background:repeating-radial-gradient(circle,transparent 0 7%,#5adfff22 7.5% 8%,transparent 8.5% 13%);box-shadow:0 0 4vmax #37cfff,0 0 8vmax #a92be7 inset}.game-transition i{width:19vmax;height:19vmax;background:radial-gradient(circle,#b8fbff 0 4%,#48d9f0 9%,#4b58e5 30%,#7c2cbe 57%,#160c49 78%);box-shadow:0 0 6vmax #36d6ff,0 0 11vmax #8b42e8}.game-transition span{width:118vmax;height:118vmax;background:repeating-conic-gradient(from 0deg,#77e8ff 0 1deg,transparent 1deg 7deg,#c65cff 8deg 9deg,transparent 9deg 15deg);-webkit-mask:radial-gradient(circle,transparent 0 24%,#000 25% 51%,transparent 52%);mask:radial-gradient(circle,transparent 0 24%,#000 25% 51%,transparent 52%)}.game-transition em{position:absolute;z-index:2;left:50%;top:50%;color:#a8edff;font:800 clamp(18px,3vw,48px)/1 ui-monospace,monospace;font-style:normal;opacity:0;text-shadow:0 0 18px currentColor}.game-transition em:nth-of-type(1){--tx:-43vw;--ty:-31vh}.game-transition em:nth-of-type(2){--tx:37vw;--ty:-20vh;color:#e282ff}.game-transition em:nth-of-type(3){--tx:-34vw;--ty:30vh;color:#b69aff}.game-transition em:nth-of-type(4){--tx:42vw;--ty:28vh}.game-transition b{position:relative;z-index:3;color:#e7fbff;font:700 clamp(13px,1.2vw,19px)/1 system-ui,sans-serif;letter-spacing:.23em;text-transform:uppercase;opacity:0;transform:translateY(12px);text-shadow:0 0 18px #42dfff}.leaving-for-game .game-transition{opacity:1;visibility:visible;transition:opacity .11s ease}.leaving-for-game .game-transition::before{animation:game-portal-in .74s cubic-bezier(.16,.72,.18,1) forwards}.leaving-for-game .game-transition::after{animation:game-portal-in .68s .04s cubic-bezier(.16,.72,.18,1) forwards}.leaving-for-game .game-transition i{animation:game-core-in .74s ease-in forwards}.leaving-for-game .game-transition span{animation:game-spin-in .74s ease-out forwards}.leaving-for-game .game-transition em{animation:game-symbol-rush .58s .1s cubic-bezier(.2,.7,.2,1) forwards}.leaving-for-game .game-transition b{animation:game-label-in .42s .1s ease-out forwards}.leaving-for-game body{overflow:hidden}.leaving-for-game main,.leaving-for-game .site-header,.leaving-for-game footer{animation:world-enter .74s ease-in forwards}@keyframes game-portal-in{0%{opacity:0;transform:translate(-50%,-50%) scale(.12)}48%{opacity:1}100%{opacity:1;transform:translate(-50%,-50%) scale(1.55)}}@keyframes game-core-in{0%{opacity:0;transform:translate(-50%,-50%) scale(.1)}58%{opacity:.98}100%{opacity:.78;transform:translate(-50%,-50%) scale(5)}}@keyframes game-spin-in{0%{opacity:0;transform:translate(-50%,-50%) scale(.18) rotate(0)}100%{opacity:.68;transform:translate(-50%,-50%) scale(1.28) rotate(88deg)}}@keyframes game-symbol-rush{0%{opacity:.65;transform:translate(-50%,-50%) scale(.35)}55%{opacity:.78}100%{opacity:0;transform:translate(calc(-50% + var(--tx)),calc(-50% + var(--ty))) scale(2.2)}}@keyframes game-label-in{to{opacity:1;transform:none}}@keyframes world-enter{to{transform:scale(1.045);filter:brightness(1.1) saturate(1.12) blur(1.5px)}}
@media(max-width:720px){.game-transition span{width:98vmax;height:98vmax}.game-transition em:nth-of-type(n+3){display:none}.game-transition::before{width:86vmax;height:86vmax;box-shadow:0 0 4vmax #178eff,0 0 8vmax #b12eff inset}.leaving-for-game .game-transition::before,.leaving-for-game .game-transition i,.leaving-for-game .game-transition span{animation-duration:.56s}.leaving-for-game main,.leaving-for-game .site-header,.leaving-for-game footer{animation-duration:.56s}}
@media(prefers-reduced-motion:reduce){.leaving-for-game .game-transition{transition:opacity .08s}.leaving-for-game .game-transition::before,.leaving-for-game .game-transition::after,.leaving-for-game .game-transition i,.leaving-for-game .game-transition span,.leaving-for-game .game-transition em,.leaving-for-game .game-transition b,.leaving-for-game main,.leaving-for-game .site-header,.leaving-for-game footer{animation:none!important}.leaving-for-game .game-transition b{opacity:1;transform:none}.game-transition::before{opacity:1;transform:translate(-50%,-50%) scale(1)}}

/* v1.23 — stronger living-world motion with a sharper high-DPI scene. */
.reference-stage{display:none}

@media(min-width:1100px){
  html,body{width:100%;min-height:100%;overflow-x:hidden;background:#02030a}
  .site-nav,.cosmic-hero,footer{display:none}
  main{width:100%;height:auto}
  .reference-stage{--scene-x:0px;--scene-y:0px;--portal-brightness:1;--portal-saturation:1.18;position:relative;display:block;width:100vw;height:66.6667vw;overflow:hidden;isolation:isolate;background:#02030a}
  .reference-art{position:absolute;z-index:0;inset:0;background-image:image-set(url("assets/homepage-scene-enhanced-v1.23.png") 1x,url("assets/homepage-scene-enhanced-v1.23@2x.png") 2x);background-position:center top;background-size:100% 100%;background-repeat:no-repeat;animation:reference-art-in .9s cubic-bezier(.2,.75,.2,1) both}
  .reference-clean-field,.reference-portal-plate,.reference-object,.reference-island-art,.reference-atmosphere,.reference-special-events{position:absolute;inset:0;pointer-events:none;background-position:center top;background-size:100% 100%;background-repeat:no-repeat;will-change:transform,opacity,filter}
  .reference-clean-field{z-index:1}
  .clean-portal-field{background-image:image-set(url("assets/homepage-motion-portal-clean-v1.23.png") 1x,url("assets/homepage-motion-portal-clean-v1.23@2x.png") 2x);-webkit-mask-image:radial-gradient(ellipse 18% 29% at 57% 27%,#000 0 78%,transparent 100%);mask-image:radial-gradient(ellipse 18% 29% at 57% 27%,#000 0 78%,transparent 100%)}
  .clean-island-field{background-image:image-set(url("assets/homepage-motion-islands-clean-v1.23.png") 1x,url("assets/homepage-motion-islands-clean-v1.23@2x.png") 2x);-webkit-mask-image:radial-gradient(ellipse 10% 15% at 82% 20%,#000 0 79%,transparent 100%),radial-gradient(ellipse 9% 14% at 91% 36%,#000 0 80%,transparent 100%),radial-gradient(ellipse 11% 16% at 83% 52%,#000 0 80%,transparent 100%);mask-image:radial-gradient(ellipse 10% 15% at 82% 20%,#000 0 79%,transparent 100%),radial-gradient(ellipse 9% 14% at 91% 36%,#000 0 80%,transparent 100%),radial-gradient(ellipse 11% 16% at 83% 52%,#000 0 80%,transparent 100%)}
  .reference-portal-plate,.reference-object,.reference-island-art{z-index:2;background-image:image-set(url("assets/homepage-scene-enhanced-v1.23.png") 1x,url("assets/homepage-scene-enhanced-v1.23@2x.png") 2x)}
  .reference-portal-plate{transform-origin:57.35% 28.35%;-webkit-mask-image:radial-gradient(ellipse 13.2% 20.2% at 57.35% 28.35%,#000 0 90%,transparent 100%);mask-image:radial-gradient(ellipse 13.2% 20.2% at 57.35% 28.35%,#000 0 90%,transparent 100%);animation:reference-portal-wake 1.05s .12s ease-out both,reference-portal-breathe 6.35s 1.2s ease-in-out infinite}
  .reference-object{--ox:50%;--oy:50%;transform-origin:var(--ox) var(--oy);animation:reference-object-wake .9s .38s cubic-bezier(.18,.82,.24,1) both,reference-object-one 12.6s 1.45s ease-in-out infinite;filter:drop-shadow(0 0 .62vw #62dfff66)}
  .object-25{--ox:49.1%;--oy:15.7%;-webkit-mask-image:radial-gradient(ellipse 4.6% 7.2% at var(--ox) var(--oy),#000 0 70%,transparent 100%);mask-image:radial-gradient(ellipse 4.6% 7.2% at var(--ox) var(--oy),#000 0 70%,transparent 100%)}
  .object-7{--ox:59%;--oy:13.7%;-webkit-mask-image:radial-gradient(ellipse 4% 6.5% at var(--ox) var(--oy),#000 0 69%,transparent 100%);mask-image:radial-gradient(ellipse 4% 6.5% at var(--ox) var(--oy),#000 0 69%,transparent 100%);animation-name:reference-object-wake,reference-object-two;animation-duration:1.15s,15.4s;animation-delay:.68s,1.8s}
  .object-100{--ox:64.7%;--oy:25.4%;-webkit-mask-image:radial-gradient(ellipse 4.5% 6.8% at var(--ox) var(--oy),#000 0 72%,transparent 100%);mask-image:radial-gradient(ellipse 4.5% 6.8% at var(--ox) var(--oy),#000 0 72%,transparent 100%);animation-name:reference-object-wake,reference-object-warm;animation-duration:1.15s,14.1s;animation-delay:.76s,1.8s}
  .object-3{--ox:49.3%;--oy:35.7%;-webkit-mask-image:radial-gradient(ellipse 4.2% 6.3% at var(--ox) var(--oy),#000 0 70%,transparent 100%);mask-image:radial-gradient(ellipse 4.2% 6.3% at var(--ox) var(--oy),#000 0 70%,transparent 100%);animation-name:reference-object-wake,reference-object-three;animation-duration:1.15s,16.8s;animation-delay:.82s,1.8s}
  .object-3-small{--ox:63.1%;--oy:32.1%;-webkit-mask-image:radial-gradient(ellipse 3.2% 5% at var(--ox) var(--oy),#000 0 68%,transparent 100%);mask-image:radial-gradient(ellipse 3.2% 5% at var(--ox) var(--oy),#000 0 68%,transparent 100%);animation-name:reference-object-wake,reference-object-two;animation-duration:1.15s,18.2s;animation-delay:.9s,-6s}
  .object-2{--ox:53.6%;--oy:42.4%;-webkit-mask-image:radial-gradient(ellipse 3.5% 5.3% at var(--ox) var(--oy),#000 0 69%,transparent 100%);mask-image:radial-gradient(ellipse 3.5% 5.3% at var(--ox) var(--oy),#000 0 69%,transparent 100%);animation-name:reference-object-wake,reference-object-four;animation-duration:1.15s,14.9s;animation-delay:.96s,1.8s}
  .object-plus{--ox:45.7%;--oy:27.8%;-webkit-mask-image:radial-gradient(ellipse 3.3% 5.1% at var(--ox) var(--oy),#000 0 66%,transparent 100%);mask-image:radial-gradient(ellipse 3.3% 5.1% at var(--ox) var(--oy),#000 0 66%,transparent 100%);animation-name:reference-object-wake,reference-symbol-drift;animation-duration:1.15s,19s;animation-delay:.88s,1.8s}
  .reference-island-art{z-index:2;animation:reference-island-wake .9s 1.05s ease-out both,reference-island-art-one 12s 1.35s ease-in-out infinite}
  .island-daily-art{transform-origin:82.2% 20.5%;-webkit-mask-image:radial-gradient(ellipse 9.5% 13.7% at 82.2% 20.5%,#000 0 76%,transparent 100%);mask-image:radial-gradient(ellipse 9.5% 13.7% at 82.2% 20.5%,#000 0 76%,transparent 100%)}
  .island-custom-art{transform-origin:91.4% 36.4%;-webkit-mask-image:radial-gradient(ellipse 8.2% 13.2% at 91.4% 36.4%,#000 0 77%,transparent 100%);mask-image:radial-gradient(ellipse 8.2% 13.2% at 91.4% 36.4%,#000 0 77%,transparent 100%);animation-name:reference-island-wake,reference-island-art-two;animation-duration:.9s,15s;animation-delay:1.12s,1.42s}
  .island-progress-art{transform-origin:83.3% 51.7%;-webkit-mask-image:radial-gradient(ellipse 10% 14.6% at 83.3% 51.7%,#000 0 78%,transparent 100%);mask-image:radial-gradient(ellipse 10% 14.6% at 83.3% 51.7%,#000 0 78%,transparent 100%);animation-name:reference-island-wake,reference-island-art-three;animation-duration:.9s,18s;animation-delay:1.2s,1.5s}
  .reference-atmosphere{z-index:2;overflow:hidden;background:none;mix-blend-mode:screen;opacity:.42}
  .reference-atmosphere i{position:absolute;border-radius:50%;filter:blur(1.6vw);opacity:.22;will-change:translate,opacity}
  .reference-atmosphere i:nth-child(1){left:28%;top:27%;width:37%;height:15%;background:linear-gradient(95deg,transparent,#456aff2c,#c85cff22,transparent);animation:reference-cloud-drift 38s ease-in-out infinite alternate}
  .reference-atmosphere i:nth-child(2){left:60%;top:43%;width:36%;height:14%;background:linear-gradient(90deg,transparent,#9dcfff22,#ff9ce91d,transparent);animation:reference-cloud-drift-two 47s ease-in-out infinite alternate}
  .reference-atmosphere i:nth-child(3){left:37%;top:55%;width:31%;height:10%;background:radial-gradient(ellipse,#8c72ff24,transparent 72%);animation:reference-cloud-drift 54s -19s ease-in-out infinite alternate}
  .reference-particles,.reference-portal-fx,.reference-number-glows,.reference-path-fx,.reference-island-fx,.reference-panel-fx,.reference-foreground-fx{position:absolute;z-index:1;inset:0;pointer-events:none;will-change:transform,opacity;animation:reference-fx-in 1s .42s ease-out both}
  .reference-particles{z-index:3;width:100%;height:100%;mix-blend-mode:screen;opacity:1}
  .reference-portal-fx{z-index:2;left:42.2%;top:5.7%;width:28.5%;height:auto;aspect-ratio:1;inset:auto;mix-blend-mode:screen;filter:brightness(var(--portal-brightness)) saturate(var(--portal-saturation)) drop-shadow(0 0 1.4vw #733fff38);transition:filter .18s linear}
  .reference-ring,.reference-core-glow{position:absolute;display:block;border-radius:50%}
  .reference-ring{inset:7%;opacity:.42;filter:blur(.25px);background:conic-gradient(from 10deg,transparent 0 7%,#baf8ff 10%,#49dfff 11%,transparent 16% 31%,#ce82ff 35%,#903cff 37%,transparent 43% 65%,#ff9bf0 68%,#dd3dff 70%,transparent 76% 92%,#a8f5ff 96%,transparent);mask:radial-gradient(circle,transparent 0 43%,#000 46% 50.5%,transparent 54%)}
  .ring-outer{opacity:.62;animation:reference-spin 34s linear infinite,reference-ring-surge 6.35s ease-in-out infinite}
  .ring-inner{inset:17%;opacity:.46;animation:reference-spin-reverse 47s linear infinite,reference-ring-surge 6.35s -3.1s ease-in-out infinite;filter:blur(.35px);background:conic-gradient(from 70deg,transparent,#a9f7ff,transparent 17%,#dc8bff,transparent 36%,#81b7ff,transparent 61%,#ff9ae9,transparent 78%)}
  .reference-core-glow{inset:30%;background:radial-gradient(circle,#efffff38 0 14%,#6ee8ff42 30%,#8b50ff48 52%,transparent 73%);box-shadow:0 0 4.4vw #50d8ff70,0 0 7.4vw #a53fff4c;animation:reference-core-breathe 6.35s ease-in-out infinite}
  .reference-number-glows i{position:absolute;width:5.3%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#e4fbff4f 0,#6686ff31 38%,transparent 72%);mix-blend-mode:screen;filter:blur(1.5px);animation:reference-object-drift 11s ease-in-out infinite}
  .reference-number-glows .glow-25{left:46.8%;top:10.6%;animation-duration:12.8s}
  .reference-number-glows .glow-7{left:57.1%;top:8.6%;animation-duration:15.2s;animation-delay:-5s}
  .reference-number-glows .glow-100{left:61.9%;top:18%;animation-duration:13.6s;animation-delay:-8s}
  .reference-number-glows .glow-3{left:47.4%;top:24.2%;animation-duration:17s;animation-delay:-3s}
  .reference-number-glows .glow-2{left:51.6%;top:30.4%;animation-duration:14.5s;animation-delay:-7s}
  .reference-number-glows .glow-plus{left:42.3%;top:19.4%;width:6.4%;animation-duration:16s;animation-delay:-10s}
  .reference-path-fx{z-index:2}
  .reference-path-fx::before{content:"";position:absolute;left:51.8%;top:33%;width:14%;height:25%;background:linear-gradient(154deg,transparent 8%,#71efff00 18%,#a7f5ff82 45%,#b259ff70 67%,transparent 91%);filter:blur(3px);mix-blend-mode:screen;animation:reference-path-stream 6.35s ease-in-out infinite}
  .reference-path-fx i{position:absolute;left:50%;top:51%;width:10%;height:1.4%;border-radius:50%;background:radial-gradient(ellipse,#f0ffffe0,#6cdfff75 42%,transparent 72%);filter:blur(.85px);mix-blend-mode:screen;animation:reference-step-pulse 6.35s ease-in-out infinite}
  .reference-path-fx i:nth-child(2){left:52.3%;top:46%;animation-delay:1.05s}.reference-path-fx i:nth-child(3){left:54.7%;top:41.3%;animation-delay:2.1s}.reference-path-fx i:nth-child(4){left:57.3%;top:36.8%;animation-delay:3.15s}.reference-path-fx i:nth-child(5){left:60%;top:32.8%;animation-delay:4.2s}
  .reference-path-fx b{position:absolute;left:50%;top:53%;width:.22vw;aspect-ratio:1;border-radius:50%;background:#dffcff;box-shadow:0 0 .55vw #51e4ff,0 0 1vw #914cff;opacity:0;animation:reference-path-spark 9s ease-in-out infinite}.reference-path-fx b:nth-of-type(2){left:56%;top:42%;animation-delay:2.4s}.reference-path-fx b:nth-of-type(3){left:61%;top:34%;animation-delay:4.8s}
  .reference-island-fx i{position:absolute;width:15%;height:9%;border-radius:50%;background:radial-gradient(ellipse at center,#9ceaff38,#626fff12 48%,transparent 72%);filter:blur(3px);mix-blend-mode:screen;animation:reference-island-light 14s ease-in-out infinite}
  .reference-island-fx .island-daily-glow{left:76.7%;top:16.5%;animation-duration:12s}.reference-island-fx .island-custom-glow{left:83%;top:31.2%;animation-duration:15s;animation-delay:-5s}.reference-island-fx .island-progress-glow{left:76%;top:45%;animation-duration:17s;animation-delay:-9s}
  .reference-panel-fx{z-index:2}.reference-panel-fx i{position:absolute;top:59.8%;height:20%;border:1px solid #8fdcff16;border-radius:12px;box-shadow:inset 0 1px #d9efff0c,0 0 20px #397cff09;animation:reference-panel-light 12s ease-in-out infinite}.reference-panel-fx i:first-child{left:14.5%;width:41.7%}.reference-panel-fx i:last-child{left:57.5%;width:23.1%;animation-delay:-6s}
  .reference-foreground-fx{z-index:4}.reference-foreground-fx i{position:absolute;border-radius:50%;mix-blend-mode:screen;filter:blur(8px);animation:reference-ambient 9s ease-in-out infinite}.reference-foreground-fx i:nth-child(1){left:4%;top:71%;width:13%;height:16%;background:radial-gradient(circle,#ffb8632b,transparent 72%);animation-name:reference-candle-flicker;animation-duration:6.7s}.reference-foreground-fx i:nth-child(2){right:4%;bottom:4%;width:15%;height:18%;background:radial-gradient(circle,#956bff30,transparent 70%);animation-duration:12s;animation-delay:-4s}.reference-foreground-fx i:nth-child(3){left:42%;bottom:0;width:24%;height:10%;background:radial-gradient(ellipse,#49cfff22,transparent 72%);animation-duration:14s;animation-delay:-8s}
  .reference-special-events{z-index:5;background:none;overflow:hidden}.reference-special-events i{position:absolute;display:block;opacity:0;mix-blend-mode:screen;pointer-events:none}.portal-spark{left:66%;top:13%;width:6.8%;height:.14vw;rotate:24deg;background:linear-gradient(90deg,transparent,#b9faff,#fff);filter:drop-shadow(0 0 .62vw #5de6ff)}.distant-streak{left:72%;top:29%;width:9%;height:1px;rotate:-16deg;background:linear-gradient(90deg,transparent,#9aeaff,#fff);filter:drop-shadow(0 0 .45vw #638dff)}.portal-spark.event-live{animation:reference-rare-spark 1.45s ease-out both}.distant-streak.event-live{animation:reference-distant-streak 1.8s ease-out both}
  .reference-accessible-copy{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
  .reference-hotspot{position:absolute;z-index:4;display:block;border-radius:8px;background:transparent;color:transparent;cursor:pointer}
  .reference-hotspot:focus-visible{outline:3px solid #77e9ff;outline-offset:3px;background:#65cfff17}
  .hotspot-nav-play,.hotspot-hero-play,.hotspot-bottom-play{transition:filter .24s ease,translate .24s ease,box-shadow .24s ease;background:linear-gradient(110deg,transparent,#b6f4ff00 38%,#fff0 55%,transparent)}
  .hotspot-nav-play:hover,.hotspot-hero-play:hover,.hotspot-bottom-play:hover{translate:0 -3px;filter:brightness(1.16);box-shadow:0 0 28px #4fdcff62,inset 0 0 20px #bc4fff38;background:linear-gradient(110deg,transparent 18%,#c9f8ff2b 45%,transparent 70%)}
  .hotspot-nav-play:active,.hotspot-hero-play:active,.hotspot-bottom-play:active{translate:0 1px;filter:brightness(.96)}
  .hotspot-logo{left:18.3%;top:1.1%;width:11.5%;height:4.6%}
  .hotspot-home{left:33.6%;top:1.4%;width:4.2%;height:4.4%}
  .hotspot-play{left:38.4%;top:1.4%;width:3.8%;height:4.4%}
  .hotspot-how{left:42.4%;top:1.4%;width:7.7%;height:4.4%}
  .hotspot-challenges{left:50.5%;top:1.4%;width:7.9%;height:4.4%}
  .hotspot-about{left:58.3%;top:1.4%;width:5.1%;height:4.4%}
  .hotspot-nav-play{left:67%;top:1.15%;width:7.8%;height:4.5%}
  .hotspot-hero-play{left:23.1%;top:43.5%;width:16.2%;height:5.8%}
  .hotspot-daily{left:76.2%;top:18.1%;width:15.9%;height:10.5%}
  .hotspot-custom{left:83.8%;top:32.7%;width:15.7%;height:11.2%}
  .hotspot-progress{left:76.7%;top:46.5%;width:16.3%;height:10.5%}
  .hotspot-bottom-play{left:41.4%;top:85.4%;width:16.8%;height:5.8%}
}

@media(min-width:1100px){
  .reference-ui{position:absolute;z-index:10;inset:0;color:#f8faff;font-family:var(--font);text-shadow:0 .13vw .7vw #000b;pointer-events:none}
  .reference-ui a{pointer-events:auto}
  .ref-nav{position:absolute;left:17.8%;top:0;width:64%;height:6.2%;display:flex;align-items:center;border-bottom:1px solid #dbe5ff20;background:linear-gradient(90deg,#020611dc 0%,#030614c7 72%,transparent);animation:ref-ui-enter .65s .15s ease-out both}
  .ref-logo{font-size:1.9vw;font-weight:900;letter-spacing:-.075vw;white-space:nowrap}.ref-logo span{background:linear-gradient(110deg,#39c8ff,#705cff 52%,#c748ff);background-clip:text;-webkit-background-clip:text;color:transparent}
  .ref-nav nav{position:absolute;left:24.3%;top:0;height:100%;display:flex;align-items:center;gap:2.45vw;font-size:.88vw;font-weight:600;color:#edf0ff}
  .ref-nav nav a{position:relative;display:grid;height:100%;place-items:center;white-space:nowrap}.ref-nav nav a::after{content:"";position:absolute;right:0;bottom:13%;left:0;height:.13vw;border-radius:2px;background:linear-gradient(90deg,#42c8ff,#6962ff);scale:0 1;transition:scale .2s}.ref-nav nav a:hover::after,.ref-nav nav a.active::after{scale:1}
  .ref-moon{position:absolute;right:1.2%;top:50%;translate:0 -50%;color:#9a78ff;font-size:1.5vw;filter:drop-shadow(0 0 .65vw #6c4cff)}
  .ref-button{position:relative;display:flex;align-items:center;justify-content:center;gap:1.4vw;overflow:hidden;border:1px solid #bbe4ff70;border-radius:.8vw;background:linear-gradient(105deg,#159eff,#6a45ff 54%,#ca2fea);background-size:160% 160%;box-shadow:0 0 1.2vw #2fbfff76,0 0 2.4vw #882eff43,0 .8vw 1.8vw #0007;color:#fff;font-weight:800;transition:translate .22s ease,filter .22s ease,box-shadow .22s ease,background-position .55s ease}.ref-button::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 24%,#fff5 50%,transparent 74%);translate:-130% 0;transition:translate .65s ease}.ref-button>span{display:inline-block;transition:transform .22s ease}.ref-button:hover{translate:0 -.18vw;filter:brightness(1.12);background-position:100% 50%;box-shadow:0 0 1.8vw #55d8ff94,0 0 3vw #9a3cff5c,0 1vw 2vw #0008}.ref-button:hover::before{translate:130% 0}.ref-button:hover>span{transform:translateX(.22vw)}.ref-button:active{translate:0 .08vw;filter:brightness(.96)}.ref-button:active>span{transform:translateX(.1vw)}
  .ref-nav-button{position:absolute;right:5.4%;top:13%;width:9.1%;height:73%;gap:.65vw;border-radius:.8vw;font-size:.83vw}
  .ref-hero-copy{position:absolute;left:23.25%;top:15.8%;width:20.5%;animation:ref-ui-enter .72s .35s ease-out both}.ref-hero-copy::before{content:"";position:absolute;z-index:-1;inset:-3.5vw -3vw -3vw -4vw;background:radial-gradient(ellipse,#020611e8 0 43%,#020611a0 60%,transparent 76%);filter:blur(.45vw)}
  .ref-eyebrow{font-size:.68vw;font-weight:700;letter-spacing:.24vw;text-transform:uppercase}
  .ref-hero-copy h1{margin-top:.8vw;font-size:2.85vw;line-height:.97;letter-spacing:-.12vw;text-transform:uppercase;text-shadow:0 .15vw 1.2vw #000,0 1px 2px #000}.ref-hero-copy h1 span,.ref-hero-copy h1 strong{display:block;font-weight:900}.ref-hero-copy h1 strong{position:relative;color:#5fa8ff;text-shadow:0 0 .55vw #37c6ff70,.12vw 0 .45vw #a649ff70,0 .15vw 1.2vw #000}.ref-hero-copy h1 strong::after{content:attr(data-text);position:absolute;inset:0;background:linear-gradient(100deg,#4ee4ff 0%,#4b8dff 38%,#d149ff 68%,#58cfff 100%);background-size:220% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;opacity:.72;animation:ref-headline-light 14s ease-in-out infinite;pointer-events:none}
  .ref-description{margin-top:1vw;max-width:20vw;color:#f4f6ff;font-size:.88vw;line-height:1.45;text-shadow:0 .12vw .5vw #000,0 0 1.1vw #000}
  .ref-hero-button{width:16%;min-width:16vw;height:5.4%;min-height:3.6vw;margin-top:1vw;border-radius:1.6vw;font-size:1.05vw}.ref-hero-copy>small{display:block;width:16vw;margin-top:.5vw;color:#e7e8f2;font-size:.7vw;text-align:center}
  .ref-features{position:absolute;inset:0;animation:ref-ui-enter .75s .75s ease-out both}.ref-feature{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border-radius:45%;transition:filter .25s ease,translate .25s ease;animation:reference-island-label-one 12s ease-in-out infinite}.ref-feature::before{content:"";position:absolute;z-index:-1;inset:-.55vw;border:1px solid transparent;border-radius:45%;background:radial-gradient(ellipse,#58d9ff14,transparent 68%);box-shadow:0 0 1.5vw transparent;opacity:0;transition:opacity .25s ease,border-color .25s ease,box-shadow .25s ease}.ref-feature:hover{translate:0 -.2vw;filter:brightness(1.18)}.ref-feature:hover::before,.ref-feature:focus-visible::before{border-color:#7eeeff4c;box-shadow:0 0 1.7vw #6b5cff38;opacity:1}.ref-feature strong{font-size:.94vw;line-height:1.2}.ref-feature span{margin-top:.35vw;color:#edf0ff;font-size:.72vw}.feature-daily{left:77.4%;top:18%;width:14%;height:8%}.feature-custom{left:85.5%;top:33.8%;width:12.8%;height:7%;animation-name:reference-island-label-two;animation-duration:15s;animation-delay:-4s}.feature-progress{left:77.2%;top:46.3%;width:14.8%;height:8%;animation-name:reference-island-label-three;animation-duration:18s;animation-delay:-9s}
  .ref-lower-panels{position:absolute;inset:0;animation:ref-ui-enter .75s .9s ease-out both}.ref-glass{position:absolute;border:1px solid #8bb7ff8a;border-radius:.7vw;background:linear-gradient(145deg,#08142aea,#071026e6 58%,#0d1530df);box-shadow:inset 0 1px #dcecff2b,0 1vw 2vw #0007,0 0 1.5vw #396fff1a;backdrop-filter:blur(.8vw);-webkit-backdrop-filter:blur(.8vw)}.ref-glass h2{font-size:1.03vw;line-height:1.2}.ref-how{left:14.55%;top:59.8%;width:41.65%;height:20%;padding:1.05vw 1.2vw}.ref-steps{display:grid;grid-template-columns:repeat(4,1fr);margin-top:.95vw}.ref-steps>section{min-width:0;padding:0 1vw;border-left:1px solid #9db8ff24}.ref-steps>section:first-child{padding-left:.15vw;border-left:0}.ref-steps b{display:grid;width:1.55vw;aspect-ratio:1;place-items:center;border-radius:50%;background:linear-gradient(140deg,#4fd9ff,#5667ff);box-shadow:0 0 .8vw #3caeffb0;font-size:.78vw}.ref-steps h3{margin-top:.4vw;font-size:.78vw;white-space:nowrap}.ref-steps p{margin-top:.75vw;color:#edf0fb;font-size:.68vw;line-height:1.35}.ref-number-row{display:flex;gap:.22vw;margin-top:.62vw}.ref-number-row i,.ref-example-numbers i{display:grid;min-width:1.45vw;height:1.8vw;place-items:center;border:1px solid #8fa9ff45;border-radius:.3vw;background:linear-gradient(180deg,#283554,#17213d);box-shadow:inset 0 1px #e7efff20;color:#fff;font-size:.73vw;font-style:normal;font-weight:800}.ref-operators i{min-width:1.75vw;font-size:1vw}.ref-target-chip{width:max-content;margin-top:.72vw;padding:.14vw .52vw;border-radius:.28vw;background:#0d3342;color:#54efd9;font-size:.9vw;font-weight:800}.ref-target-chip strong{display:inline;color:#54efd9;font-size:1.2vw}.ref-bulb{height:1.9vw;margin-top:.55vw;font-size:1.5vw}
  .ref-example{left:57.5%;top:61.4%;width:23.1%;height:18.4%;padding:1.2vw 1.3vw}.ref-example header{display:flex;align-items:center;justify-content:space-between}.ref-example header p{font-size:.8vw}.ref-example header strong{color:#55dcff;font-size:1.25vw}.ref-example-numbers{display:flex;gap:.45vw;margin-top:.75vw}.ref-example-numbers i{width:2vw;height:2vw;font-size:.85vw}.ref-equations{margin-top:.58vw;text-align:center;font:700 .76vw/1.6 ui-monospace,SFMono-Regular,Menlo,monospace}.ref-equations b{color:#ffd966}.ref-equations strong{color:#52edb9}.ref-equations span{display:inline-grid;width:1.35vw;aspect-ratio:1;margin-left:.42vw;place-items:center;border-radius:50%;background:#55ecb8;color:#08342c;box-shadow:0 0 .8vw #53e9bc;font-size:.78vw}.ref-example em{position:absolute;right:-1.5vw;bottom:2.6vw;color:#fff;font:italic .72vw/1.35 "Segoe Print","Bradley Hand",cursive;rotate:-4deg}
  .ref-final{position:absolute;left:41.1%;top:82.6%;width:17.6%;text-align:center;animation:ref-ui-enter .7s 1.05s ease-out both}.ref-final p{font-size:.92vw;font-weight:700}.ref-final .ref-button{width:100%;height:3.6vw;margin-top:.55vw;border-radius:1.8vw;font-size:1.05vw}
}

.page-hidden .reference-stage *{animation-play-state:paused!important}

@keyframes reference-art-in{from{opacity:.82;filter:brightness(.86) saturate(.9)}to{opacity:1;filter:none}}
@keyframes reference-fx-in{from{opacity:0}to{opacity:1}}
@keyframes reference-spin{to{rotate:360deg}}
@keyframes reference-spin-reverse{to{rotate:-360deg}}
@keyframes reference-core-breathe{0%,100%{opacity:.62;scale:.94;filter:brightness(.95)}42%{opacity:1;scale:1.11;filter:brightness(1.2)}58%{opacity:.88;scale:1.035;filter:brightness(1.06)}}
@keyframes reference-ring-surge{0%,100%{filter:brightness(.94) saturate(1);scale:.985}40%{filter:brightness(1.25) saturate(1.18);scale:1.055}55%{filter:brightness(1.05) saturate(1.06);scale:1.015}}
@keyframes reference-object-drift{0%,100%{translate:-2px 2px;rotate:-1deg;scale:.96;opacity:.38}50%{translate:5px -9px;rotate:1.5deg;scale:1.07;opacity:.84}}
@keyframes reference-path-stream{0%,100%{opacity:.3;translate:-4px 9px}42%{opacity:.92;translate:5px -10px}58%{opacity:.55;translate:2px -3px}}
@keyframes reference-step-pulse{0%,12%,74%,100%{opacity:.14;scale:.9}20%,35%{opacity:1;scale:1.14}}
@keyframes reference-path-spark{0%,15%,55%,100%{opacity:0;translate:-.5vw .85vw;scale:.55}24%,34%{opacity:1;translate:.55vw -.65vw;scale:1.3}}
@keyframes reference-island-light{0%,100%{opacity:.28;translate:0 3px;rotate:-.3deg}50%{opacity:.72;translate:1px -6px;rotate:.35deg}}
@keyframes reference-panel-light{0%,100%{opacity:.22}50%{opacity:.48}}
@keyframes reference-ambient{0%,100%{opacity:.28;scale:.96}50%{opacity:.62;scale:1.04}}
@keyframes reference-candle-flicker{0%,100%{opacity:.25;scale:.96}18%{opacity:.52;scale:1.03}24%{opacity:.34;scale:.99}61%{opacity:.62;scale:1.04}68%{opacity:.4;scale:1}}
@keyframes reference-portal-wake{0%{opacity:.28;filter:brightness(.58) saturate(.72);scale:.93}58%{opacity:1;filter:brightness(1.26) saturate(1.15);scale:1.035}100%{opacity:1;filter:brightness(1) saturate(1);scale:1}}
@keyframes reference-portal-breathe{0%,100%{filter:brightness(.91) saturate(.98);scale:.992}42%{filter:brightness(1.19) saturate(1.14);scale:1.022}58%{filter:brightness(1.04) saturate(1.05);scale:1.006}}
@keyframes reference-object-wake{0%{opacity:0;translate:0 18px;scale:.87;filter:brightness(.62)}68%{opacity:1;translate:0 -4px;scale:1.035;filter:brightness(1.15)}100%{opacity:1;translate:0 0;scale:1;filter:brightness(1)}}
@keyframes reference-object-one{0%,100%{translate:-5px 9px;rotate:-2.4deg;scale:.97;filter:brightness(.91)}48%{translate:6px -14px;rotate:3.2deg;scale:1.045;filter:brightness(1.16)}}
@keyframes reference-object-two{0%,100%{translate:7px -8px;rotate:3.5deg;scale:1.04;filter:brightness(1.13)}52%{translate:-8px 10px;rotate:-3deg;scale:.96;filter:brightness(.87)}}
@keyframes reference-object-three{0%,100%{translate:-6px 8px;rotate:-4.5deg;scale:.965;filter:brightness(.9)}43%{translate:7px -12px;rotate:4deg;scale:1.04;filter:brightness(1.16)}}
@keyframes reference-object-four{0%,100%{translate:5px 9px;rotate:2.4deg;scale:.955;filter:brightness(.87)}55%{translate:-6px -13px;rotate:-2.8deg;scale:1.05;filter:brightness(1.17)}}
@keyframes reference-object-warm{0%,100%{translate:-5px 8px;rotate:-2.2deg;scale:.965;filter:brightness(.9) saturate(.96) drop-shadow(0 0 .45vw #ff8b4640)}50%{translate:8px -11px;rotate:3deg;scale:1.05;filter:brightness(1.22) saturate(1.12) drop-shadow(0 0 .95vw #ff8b4680)}}
@keyframes reference-symbol-drift{0%,100%{translate:-6px 9px;rotate:-3.2deg;scale:.96;filter:brightness(.88)}46%{translate:8px -9px;rotate:3deg;scale:1.05;filter:brightness(1.2)}}
@keyframes reference-island-wake{from{opacity:.2;translate:0 13px;filter:brightness(.7)}to{opacity:1;translate:0 0;filter:brightness(1)}}
@keyframes reference-island-art-one{0%,100%{translate:-3px 7px;rotate:-.6deg;filter:brightness(.95)}50%{translate:4px -10px;rotate:.75deg;filter:brightness(1.08)}}
@keyframes reference-island-art-two{0%,100%{translate:-6px 6px;rotate:-.8deg;scale:.99;filter:brightness(.94)}50%{translate:6px -11px;rotate:.9deg;scale:1.012;filter:brightness(1.09)}}
@keyframes reference-island-art-three{0%,100%{translate:4px 8px;rotate:.55deg;scale:.99;filter:brightness(.94)}50%{translate:-4px -9px;rotate:-.7deg;scale:1.014;filter:brightness(1.08)}}
@keyframes reference-island-label-one{0%,100%{transform:translate3d(-3px,7px,0) rotate(-.6deg)}50%{transform:translate3d(4px,-10px,0) rotate(.75deg)}}
@keyframes reference-island-label-two{0%,100%{transform:translate3d(-6px,6px,0) rotate(-.8deg)}50%{transform:translate3d(6px,-11px,0) rotate(.9deg)}}
@keyframes reference-island-label-three{0%,100%{transform:translate3d(4px,8px,0) rotate(.55deg)}50%{transform:translate3d(-4px,-9px,0) rotate(-.7deg)}}
@keyframes reference-cloud-drift{0%{translate:-1.5% 1%;opacity:.16}100%{translate:3% -1.2%;opacity:.34}}
@keyframes reference-cloud-drift-two{0%{translate:2% -1%;opacity:.12}100%{translate:-3% 1.4%;opacity:.3}}
@keyframes reference-rare-spark{0%{opacity:0;translate:-1.4vw -.5vw;scale:.45}22%{opacity:1}58%{opacity:.7}100%{opacity:0;translate:2.4vw 1vw;scale:1.25}}
@keyframes reference-distant-streak{0%{opacity:0;translate:-2.5vw .7vw}24%{opacity:.72}100%{opacity:0;translate:5vw -1.4vw}}
@keyframes ref-ui-enter{from{opacity:0;translate:0 .55vw}to{opacity:1;translate:0 0}}
@keyframes ref-headline-light{0%,16%,100%{background-position:0 50%;opacity:.58}48%,62%{background-position:100% 50%;opacity:.88}}

@media(prefers-reduced-motion:reduce){
  .reference-stage *{animation:none!important;transition:none!important}
  .reference-particles{display:none}
  .reference-atmosphere,.reference-special-events{display:none}
  .reference-ring,.reference-core-glow,.reference-number-glows,.reference-path-fx,.reference-island-fx,.reference-foreground-fx{opacity:.18}
}

/* v1.27 — cinematic wow pass. Composition and source artwork remain unchanged. */
@media(min-width:1100px){
  .reference-stage{
    --portal-energy:0;
    --portal-pulse:0;
    background:#01020a;
  }
  .reference-stage::before{
    content:"";
    position:absolute;
    z-index:9;
    inset:0;
    pointer-events:none;
    background:radial-gradient(circle at 57% 27%,#baf8ff5c 0 1%,#644cff31 9%,#05081ca8 31%,#01020af4 74%);
    mix-blend-mode:screen;
    animation:v127-cinematic-reveal 1.95s cubic-bezier(.16,.72,.18,1) both;
  }
  .reference-stage::after{
    content:"";
    position:absolute;
    z-index:3;
    inset:0;
    pointer-events:none;
    background:radial-gradient(ellipse 30% 42% at 57% 27%,rgba(94,212,255,calc(.025 + var(--portal-energy) * .075)),rgba(119,64,255,calc(.018 + var(--portal-energy) * .055)) 42%,transparent 72%);
    mix-blend-mode:screen;
    transition:background .16s linear;
  }
  .reference-art{image-rendering:auto;filter:contrast(1.035) saturate(1.055);animation:v127-art-awaken 1.4s cubic-bezier(.16,.72,.18,1) both}
  .reference-clean-field{filter:contrast(1.055) saturate(1.07)}
  .reference-portal-plate{animation:reference-portal-wake 1.25s .12s cubic-bezier(.16,.82,.22,1) both,reference-portal-breathe 5.8s 1.35s ease-in-out infinite;filter:brightness(calc(1 + var(--portal-energy) * .12)) saturate(calc(1.04 + var(--portal-energy) * .14))}
  .reference-portal-fx{filter:brightness(var(--portal-brightness)) saturate(var(--portal-saturation)) drop-shadow(0 0 calc(1.4vw + var(--portal-energy) * .9vw) #733fff66)}
  .reference-ring{inset:5.5%;opacity:.72;filter:drop-shadow(0 0 .34vw #8fefff99);mask:radial-gradient(circle,transparent 0 42%,#000 45% 51.5%,transparent 55%)}
  .ring-outer{animation:reference-spin 14s linear infinite,reference-ring-surge 5.8s ease-in-out infinite}
  .ring-inner{inset:15%;opacity:.6;animation:reference-spin-reverse 19s linear infinite,reference-ring-surge 5.8s -2.8s ease-in-out infinite;filter:blur(.2px) drop-shadow(0 0 .42vw #cf73ff99)}
  .reference-energy-band,.reference-portal-arc{position:absolute;display:block;border-radius:50%;pointer-events:none}
  .reference-energy-band{inset:2%;opacity:.66;background:conic-gradient(from 20deg,transparent 0 5%,#d9feff 6% 6.5%,#5ce3ff 7% 9%,transparent 10% 27%,#c274ff 28% 30%,transparent 31% 56%,#ff75e6 57% 59%,transparent 60% 83%,#7feeff 84% 86%,transparent 87%);mask:radial-gradient(circle,transparent 0 47.5%,#000 48.5% 50.3%,transparent 51.5%);filter:drop-shadow(0 0 .45vw #55dfff);animation:v127-band-spin 8.6s linear infinite}
  .band-two{inset:10%;opacity:.46;animation:v127-band-spin-reverse 6.8s linear infinite;filter:drop-shadow(0 0 .55vw #c553ff);rotate:77deg}
  .band-three{inset:-5%;opacity:.3;animation:v127-band-spin 12.4s linear infinite;filter:blur(.3px) drop-shadow(0 0 .62vw #6f8aff);rotate:145deg}
  .reference-portal-arc{inset:12%;border:2px solid transparent;border-top-color:#d9ffff;border-right-color:#6bdfff;filter:drop-shadow(0 0 .65vw #53d9ff);opacity:.72;animation:v127-arc-travel 4.8s linear infinite}
  .arc-two{inset:21%;border-width:1px;border-top-color:#ffabff;border-right-color:transparent;border-bottom-color:#934dff;opacity:.54;animation:v127-arc-travel-reverse 3.9s linear infinite}
  .reference-core-glow{inset:27%;box-shadow:0 0 4.8vw #50d8ff94,0 0 8vw #a53fff66;animation:reference-core-breathe 5.8s ease-in-out infinite}
  .portal-surge .reference-portal-plate{filter:brightness(1.38) saturate(1.3)}
  .portal-surge .reference-portal-fx{filter:brightness(1.4) saturate(1.35) drop-shadow(0 0 2.6vw #6ce9ffb8)}
  .portal-surge .reference-energy-band{animation-duration:2.4s;opacity:.95}
  .portal-surge .reference-core-glow{animation:v127-core-pulse 1.75s cubic-bezier(.2,.75,.2,1) both}
  .portal-surge .reference-path-fx::before{filter:blur(2px) brightness(1.75);opacity:1}
  .portal-surge .reference-island-fx{filter:brightness(1.3) saturate(1.18)}

  .reference-object{filter:contrast(1.08) saturate(1.1) drop-shadow(0 0 .75vw #62dfff82)}
  .object-100{filter:contrast(1.08) saturate(1.12) drop-shadow(0 0 .85vw #ff865f82)}
  .reference-number-glows i{opacity:.76;filter:blur(1px) brightness(1.15)}

  .reference-path-fx::before{width:15.5%;background:linear-gradient(154deg,transparent 4%,#71efff08 17%,#d8ffffad 43%,#b259ff9c 67%,transparent 94%);filter:blur(2px);animation:reference-path-stream 4.9s ease-in-out infinite}
  .reference-path-fx i{filter:blur(.45px) brightness(1.22);box-shadow:0 0 .5vw #79eaff80;animation:reference-step-pulse 4.9s ease-in-out infinite}
  .reference-path-fx i:nth-child(2){animation-delay:.82s}.reference-path-fx i:nth-child(3){animation-delay:1.64s}.reference-path-fx i:nth-child(4){animation-delay:2.46s}.reference-path-fx i:nth-child(5){animation-delay:3.28s}
  .reference-path-fx b{animation-duration:7.2s}

  .reference-atmosphere{opacity:.58}
  .reference-atmosphere i{filter:blur(1.2vw)}
  .reference-foreground-fx i:nth-child(1){filter:blur(6px)}
  .reference-foreground-fx i:nth-child(2){filter:blur(7px);background:radial-gradient(circle,#9b79ff45,transparent 69%)}
  .reference-foreground-fx i:nth-child(3){filter:blur(6px);background:radial-gradient(ellipse,#4ad7ff35,transparent 72%)}

  .reference-special-events{z-index:7}
  .shooting-star-event,.meteor-event,.distant-streak,.portal-spark{height:.12vw;background:linear-gradient(90deg,transparent,#9deaff,#fff);filter:drop-shadow(0 0 .55vw #64dfff)}
  .shooting-star-event{left:18%;top:13%;width:9%;rotate:19deg}.meteor-event{left:63%;top:8%;width:12%;rotate:31deg;background:linear-gradient(90deg,transparent,#ff9d65,#fff)}
  .lightning-event{left:64%;top:17%;width:1px;height:15%;background:linear-gradient(#fff,#75e9ff 42%,#be61ff);clip-path:polygon(42% 0,100% 0,62% 41%,100% 42%,15% 100%,40% 54%,0 53%);filter:drop-shadow(0 0 .55vw #80e8ff)}
  .city-light-event{left:79%;top:49%;width:16%;height:12%;border-radius:50%;background:radial-gradient(ellipse,#8deeff82,transparent 70%);filter:blur(.35vw)}
  .particle-pull-event{left:44%;top:9%;width:26%;aspect-ratio:1;border-radius:50%;background:repeating-conic-gradient(from 0deg,transparent 0 8deg,#b9f9ff 9deg 9.5deg,transparent 10deg 24deg);mask:radial-gradient(circle,transparent 0 47%,#000 52% 53%,transparent 60%);filter:drop-shadow(0 0 .7vw #8f5fff)}
  .sky-flash-event{inset:0;background:radial-gradient(ellipse at 70% 30%,#d9fbff75,transparent 54%)}
  .portal-burst-event{left:47%;top:13%;width:20%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,transparent 0 34%,#e7ffffc7 37%,#9a54ff70 40%,transparent 55%);filter:drop-shadow(0 0 1.2vw #76e9ff)}
  .shooting-star-event.event-live{animation:v127-shooting-star 1.5s ease-out both}.meteor-event.event-live{animation:v127-meteor 1.75s ease-in both}.lightning-event.event-live{animation:v127-lightning .85s steps(2,end) both}.city-light-event.event-live{animation:v127-city-light 2.4s ease-in-out both}.particle-pull-event.event-live{animation:v127-particle-pull 2.2s ease-in-out both}.sky-flash-event.event-live{animation:v127-sky-flash 1.15s ease-out both}.portal-burst-event.event-live{animation:v127-portal-burst 1.65s ease-out both}

  .ref-hero-copy::before{inset:-3.7vw -3.2vw -3.2vw -4.2vw;background:radial-gradient(ellipse at 42% 47%,#020611f2 0 38%,#020611c7 56%,#02061168 68%,transparent 79%);filter:blur(.36vw)}
  .ref-hero-copy h1{filter:contrast(1.08);text-shadow:0 .15vw .72vw #000,0 1px 2px #000,0 0 .18vw #fff3}
  .ref-hero-copy h1 strong::after{opacity:.88;animation-duration:9s}
  .ref-description{max-width:19.7vw;color:#fff;font-size:.91vw;line-height:1.48;text-shadow:0 .12vw .42vw #000,0 0 .9vw #000,0 1px 1px #000}
  .ref-button{box-shadow:0 0 1.35vw #2fbfff8c,0 0 2.7vw #882eff52,0 .8vw 1.8vw #0007}
  .ref-nav nav a{transition:color .2s ease,text-shadow .2s ease}.ref-nav nav a:hover{color:#fff;text-shadow:0 0 .7vw #6fe8ff}

  .ref-lower-panels{z-index:12;isolation:isolate}
  .ref-glass{z-index:1;border-color:#86c6ff66;background:linear-gradient(145deg,#07142ad9,#060d21cc 58%,#0b1430c9);box-shadow:inset 0 1px #e9f8ff32,0 .75vw 1.8vw #00072,0 0 1.2vw #4f8cff16;backdrop-filter:blur(.55vw) saturate(1.15);-webkit-backdrop-filter:blur(.55vw) saturate(1.15)}
  .ref-glass::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(110deg,#98efff15,transparent 30% 70%,#ba72ff12);mix-blend-mode:screen}
  .ref-steps>section{border-left-color:#a8d9ff1c}.ref-steps b{box-shadow:0 0 .75vw #3caeffd0,0 0 1.2vw #775aff55}
  .ref-number-row i,.ref-example-numbers i{border-color:#9fc4ff62;background:linear-gradient(180deg,#30466d,#152341);box-shadow:inset 0 1px #f2fbff42,0 .18vw .45vw #0006;text-shadow:0 1px 2px #000}
}

@keyframes v127-cinematic-reveal{0%{opacity:.82;filter:brightness(.35)}26%{opacity:.55;filter:brightness(.78)}58%{opacity:.22;filter:brightness(1.2)}100%{opacity:0;visibility:hidden}}
@keyframes v127-art-awaken{0%{opacity:.72;filter:brightness(.68) saturate(.78) contrast(.96);scale:1.012}55%{opacity:1;filter:brightness(1.08) saturate(1.12) contrast(1.04);scale:1.002}100%{opacity:1;filter:contrast(1.035) saturate(1.055);scale:1}}
@keyframes v127-band-spin{to{rotate:360deg}}@keyframes v127-band-spin-reverse{to{rotate:-360deg}}
@keyframes v127-arc-travel{0%{rotate:0deg;opacity:.28}45%{opacity:.9}100%{rotate:360deg;opacity:.28}}@keyframes v127-arc-travel-reverse{0%{rotate:0deg;opacity:.2}55%{opacity:.72}100%{rotate:-360deg;opacity:.2}}
@keyframes v127-core-pulse{0%{opacity:.65;scale:.94}35%{opacity:1;scale:1.24;filter:brightness(1.5)}64%{opacity:.82;scale:1.08}100%{opacity:.68;scale:1}}
@keyframes reference-object-one{0%,100%{translate:-7px 13px;rotate:-3.2deg;scale:.965;filter:brightness(.9)}48%{translate:8px -15px;rotate:4.1deg;scale:1.055;filter:brightness(1.2)}}
@keyframes reference-object-two{0%,100%{translate:8px -13px;rotate:4.2deg;scale:1.052;filter:brightness(1.18)}52%{translate:-8px 13px;rotate:-3.8deg;scale:.965;filter:brightness(.88)}}
@keyframes reference-object-three{0%,100%{translate:-8px 14px;rotate:-4.8deg;scale:.968;filter:brightness(.9)}43%{translate:8px -14px;rotate:4.5deg;scale:1.05;filter:brightness(1.19)}}
@keyframes reference-object-four{0%,100%{translate:7px 14px;rotate:3.4deg;scale:.965;filter:brightness(.88)}55%{translate:-8px -14px;rotate:-3.5deg;scale:1.055;filter:brightness(1.2)}}
@keyframes reference-object-warm{0%,100%{translate:-7px 13px;rotate:-3.2deg;scale:.965;filter:brightness(.9) saturate(.98) drop-shadow(0 0 .55vw #ff8b4650)}50%{translate:8px -14px;rotate:4deg;scale:1.052;filter:brightness(1.24) saturate(1.16) drop-shadow(0 0 1vw #ff8b4699)}}
@keyframes reference-symbol-drift{0%,100%{translate:-7px 13px;rotate:-4.2deg;scale:.965;filter:brightness(.9)}46%{translate:8px -13px;rotate:3.8deg;scale:1.052;filter:brightness(1.22)}}
@keyframes reference-island-art-one{0%,100%{translate:-5px 10px;rotate:-.8deg;filter:brightness(.95)}50%{translate:5px -10px;rotate:1.05deg;filter:brightness(1.11)}}
@keyframes reference-island-art-two{0%,100%{translate:-5px 10px;rotate:-1.05deg;scale:.992;filter:brightness(.94)}50%{translate:5px -10px;rotate:1.25deg;scale:1.014;filter:brightness(1.12)}}
@keyframes reference-island-art-three{0%,100%{translate:5px 10px;rotate:.8deg;scale:.992;filter:brightness(.94)}50%{translate:-5px -10px;rotate:-1deg;scale:1.014;filter:brightness(1.11)}}
@keyframes reference-island-label-one{0%,100%{transform:translate3d(-5px,10px,0) rotate(-.8deg)}50%{transform:translate3d(5px,-10px,0) rotate(1.05deg)}}
@keyframes reference-island-label-two{0%,100%{transform:translate3d(-5px,10px,0) rotate(-1.05deg)}50%{transform:translate3d(5px,-10px,0) rotate(1.25deg)}}
@keyframes reference-island-label-three{0%,100%{transform:translate3d(5px,10px,0) rotate(.8deg)}50%{transform:translate3d(-5px,-10px,0) rotate(-1deg)}}
@keyframes v127-shooting-star{0%{opacity:0;translate:-5vw -2vw;scale:.4}18%{opacity:1}100%{opacity:0;translate:18vw 7vw;scale:1.25}}
@keyframes v127-meteor{0%{opacity:0;translate:-3vw -3vw;scale:.35}22%{opacity:.95}100%{opacity:0;translate:12vw 10vw;scale:1.45}}
@keyframes v127-lightning{0%,100%{opacity:0}18%,29%,53%{opacity:1}24%,42%,67%{opacity:.15}}
@keyframes v127-city-light{0%,100%{opacity:0;scale:.88}42%{opacity:.95;scale:1.08}65%{opacity:.52;scale:1}}
@keyframes v127-particle-pull{0%{opacity:0;rotate:0deg;scale:1.3}35%{opacity:.65}100%{opacity:0;rotate:220deg;scale:.45}}
@keyframes v127-sky-flash{0%,100%{opacity:0}22%{opacity:.55}34%{opacity:.12}47%{opacity:.38}}
@keyframes v127-portal-burst{0%{opacity:0;scale:.45}28%{opacity:1}100%{opacity:0;scale:1.65}}

@media(max-width:1099px){
  .cosmic-hero{background-attachment:scroll}
  .orbital-debris i:nth-child(n+5),.energy-arcs i:nth-child(n+3){display:none}
}

@media(prefers-reduced-motion:reduce){
  .reference-stage::before,.reference-stage::after{display:none!important}
  .reference-energy-band,.reference-portal-arc{animation:none!important;opacity:.18!important}
  .portal-surge .reference-portal-plate,.portal-surge .reference-portal-fx{filter:none!important}
}

/* v1.28 — Living World / high-quality motion pass. Composition remains locked. */
@media(min-width:1100px){
  .reference-stage{--portal-brightness:1;--portal-saturation:1.08}

  /* Keep the master plate pixel-aligned. Full-scene scaling was the main source of transient softness. */
  .reference-art{
    transform:none!important;
    scale:1!important;
    pointer-events:none;
    will-change:opacity,filter;
    filter:contrast(1.045) saturate(1.045);
    animation:v128-art-reveal .8s ease-out both;
  }
  .reference-clean-field{transform:none!important;will-change:auto;filter:contrast(1.035) saturate(1.045)}

  /* Crop the moving artwork into small compositor layers while retaining the same 1x/2x master pixels. */
  .reference-portal-plate,.reference-object,.reference-island-art{
    inset:auto;
    background-size:100vw 66.6667vw;
    background-repeat:no-repeat;
    contain:paint;
    backface-visibility:hidden;
  }
  .reference-portal-plate{
    left:43.15vw;top:4.9vw;width:28.4vw;height:28vw;
    background-position:-43.15vw -4.9vw;
    transform-origin:50% 50%;
    -webkit-mask-image:radial-gradient(ellipse at center,#000 0 89%,transparent 100%);
    mask-image:radial-gradient(ellipse at center,#000 0 89%,transparent 100%);
    animation:v128-portal-wake 1.2s .1s cubic-bezier(.16,.82,.22,1) both,v128-portal-breathe 5.6s 1.25s ease-in-out infinite;
    filter:brightness(calc(1 + var(--portal-energy) * .1)) saturate(calc(1.025 + var(--portal-energy) * .1));
  }
  .reference-object{-webkit-mask-image:radial-gradient(ellipse at center,#000 0 70%,transparent 100%);mask-image:radial-gradient(ellipse at center,#000 0 70%,transparent 100%);transform-origin:50% 50%;filter:contrast(1.07) saturate(1.08) drop-shadow(0 0 .48vw #62dfff6b)}
  .object-25{left:44.1vw;top:5.27vw;width:10vw;height:10.4vw;background-position:-44.1vw -5.27vw;animation:v128-number-wake .85s .55s cubic-bezier(.18,.82,.24,1) both,v128-number-25 8.6s 1.4s ease-in-out infinite}
  .object-7{left:54.5vw;top:4.48vw;width:9vw;height:9.3vw;background-position:-54.5vw -4.48vw;animation:v128-number-wake .85s .6s cubic-bezier(.18,.82,.24,1) both,v128-number-7 7.4s 1.47s ease-in-out infinite}
  .object-100{left:59.7vw;top:11.83vw;width:10vw;height:10.15vw;background-position:-59.7vw -11.83vw;animation:v128-number-wake .85s .66s cubic-bezier(.18,.82,.24,1) both,v128-number-100 11.2s 1.53s ease-in-out infinite;filter:contrast(1.08) saturate(1.12) drop-shadow(0 0 .55vw #ff865f76)}
  .object-3{left:44.7vw;top:19.2vw;width:9.2vw;height:9.2vw;background-position:-44.7vw -19.2vw;animation:v128-number-wake .85s .71s cubic-bezier(.18,.82,.24,1) both,v128-number-3 7.1s 1.58s ease-in-out infinite}
  .object-3-small{left:59.5vw;top:17.8vw;width:7.2vw;height:7.2vw;background-position:-59.5vw -17.8vw;animation:v128-number-wake .85s .77s cubic-bezier(.18,.82,.24,1) both,v128-number-3-small 8.2s 1.64s ease-in-out infinite}
  .object-2{left:49.6vw;top:24.27vw;width:8vw;height:8vw;background-position:-49.6vw -24.27vw;animation:v128-number-wake .85s .82s cubic-bezier(.18,.82,.24,1) both,v128-number-2 9.6s 1.69s ease-in-out infinite}
  .object-plus{left:42vw;top:14.83vw;width:7.4vw;height:7.4vw;background-position:-42vw -14.83vw;animation:v128-number-wake .85s .74s cubic-bezier(.18,.82,.24,1) both,v128-symbol-plus 10.4s 1.61s ease-in-out infinite}

  .reference-island-art{-webkit-mask-image:radial-gradient(ellipse at center,#000 0 77%,transparent 100%);mask-image:radial-gradient(ellipse at center,#000 0 77%,transparent 100%);transform-origin:50% 50%}
  .island-daily-art{left:71.7vw;top:3.67vw;width:21vw;height:20vw;background-position:-71.7vw -3.67vw;animation:v128-island-wake .75s 1.2s ease-out both,v128-island-daily 14s 1.2s ease-in-out infinite}
  .island-custom-art{left:82.4vw;top:14.77vw;width:18vw;height:19vw;background-position:-82.4vw -14.77vw;animation:v128-island-wake .75s 1.2s ease-out both,v128-island-custom 16s 1.2s ease-in-out infinite}
  .island-progress-art{left:72.3vw;top:23.47vw;width:22vw;height:22vw;background-position:-72.3vw -23.47vw;animation:v128-island-wake .75s 1.2s ease-out both,v128-island-progress 19s 1.2s ease-in-out infinite}

  .ring-outer{animation:v128-ring-clockwise 23s linear infinite,v128-ring-shimmer 6.1s ease-in-out infinite}
  .ring-inner{animation:v128-ring-counter 16s linear infinite,v128-ring-shimmer 5.2s -2.4s ease-in-out infinite}
  .band-one{animation:v128-band-clockwise 9.4s linear infinite}
  .band-two{animation:v128-band-counter 7.2s linear infinite}
  .band-three{animation:v128-band-clockwise 11.3s linear infinite}
  .arc-one{animation:v128-arc-clockwise 6.7s linear infinite}
  .arc-two{animation:v128-arc-counter 8.1s linear infinite}
  .reference-core-glow{animation:v128-core-breathe 5.6s ease-in-out infinite}

  .portal-surge .reference-core-glow{animation:v128-surge-core 1.5s cubic-bezier(.2,.75,.2,1) both}
  .portal-surge .ring-outer{animation:v128-surge-ring 1.5s cubic-bezier(.2,.72,.2,1) both}
  .portal-surge .reference-portal-fx{animation:v128-surge-light 1.5s ease-out both}
  .portal-surge .reference-number-glows{animation:v128-surge-numbers 1.5s ease-out both}
  .portal-surge .reference-path-fx{animation:v128-surge-path 1.5s ease-out both}

  .city-light-event.event-live{animation-duration:2s}
  .particle-pull-event.event-live{animation-duration:1.9s}

  .reference-path-fx::before{animation:v128-path-stream 6.8s ease-in-out infinite}
  .reference-path-fx i{animation:v128-step-pulse 6.8s ease-in-out infinite}
  .reference-path-fx i:nth-child(2){animation-delay:.28s}.reference-path-fx i:nth-child(3){animation-delay:.56s}.reference-path-fx i:nth-child(4){animation-delay:.84s}.reference-path-fx i:nth-child(5){animation-delay:1.12s}
  .reference-path-fx b{animation:v128-path-spark 6.8s ease-in-out infinite}.reference-path-fx b:nth-of-type(2){animation-delay:.48s}.reference-path-fx b:nth-of-type(3){animation-delay:.96s}

  .feature-daily{animation:v128-island-label-daily 14s 1.2s ease-in-out infinite}
  .feature-custom{animation:v128-island-label-custom 16s 1.2s ease-in-out infinite}
  .feature-progress{animation:v128-island-label-progress 19s 1.2s ease-in-out infinite}

  .ref-glass{background:linear-gradient(145deg,#07142abf,#060d21b5 58%,#0b1430b0);border-color:#9ad6ff63;box-shadow:inset 0 1px #e9f8ff2d,0 .62vw 1.45vw #00065,0 0 1vw #4f8cff12;backdrop-filter:blur(.4vw) saturate(1.1);-webkit-backdrop-filter:blur(.4vw) saturate(1.1)}
  .ref-steps>section{border-left-color:#b7ddff14}.ref-example-numbers i{border-color:#a8d0ff75;background:linear-gradient(180deg,#36527f,#172640)}.ref-equations p:last-child{filter:brightness(1.12);text-shadow:0 0 .55vw #52edb94a}
  .ref-hero-copy::before{background:radial-gradient(ellipse at 42% 47%,#020611eb 0 37%,#020611bc 55%,#02061157 68%,transparent 79%);filter:blur(.32vw)}
  .ref-button:hover{translate:0 -4px}.ref-button:hover>span{transform:translateX(5px)}.ref-button:active{translate:0 1px;scale:.985}
  .ref-final .ref-button:hover{translate:0 -3px;filter:brightness(1.09)}
}

@keyframes v128-art-reveal{from{opacity:.86;filter:brightness(.9) contrast(1.02) saturate(.98)}to{opacity:1;filter:contrast(1.045) saturate(1.045)}}
@keyframes v128-portal-wake{0%{opacity:.35;filter:brightness(.72);scale:.985}58%{opacity:1;filter:brightness(1.17);scale:1.012}100%{opacity:1;filter:brightness(1);scale:1}}
@keyframes v128-portal-breathe{0%,100%{filter:brightness(.98) saturate(1.02)}48%{filter:brightness(1.11) saturate(1.1)}}
@keyframes v128-number-wake{from{opacity:0;translate:0 18px;filter:brightness(.7)}to{opacity:1;translate:0 0;filter:brightness(1)}}
@keyframes v128-number-25{0%,100%{translate:-5px 10px;rotate:-4deg;scale:1;filter:brightness(.94)}50%{translate:5px -12px;rotate:5deg;scale:1.06;filter:brightness(1.14)}}
@keyframes v128-number-7{0%,100%{translate:7px -9px;rotate:6.5deg;scale:1.05;filter:brightness(1.13)}50%{translate:-7px 9px;rotate:-6.5deg;scale:.97;filter:brightness(.91)}}
@keyframes v128-number-100{0%,100%{translate:-4px 7px;rotate:-2.5deg;scale:1;filter:brightness(.96)}50%{translate:4px -7px;rotate:2.5deg;scale:1.04;filter:brightness(1.13)}}
@keyframes v128-number-3{0%,100%{translate:-6px 11px;rotate:-5.5deg;scale:.98;filter:brightness(.92)}50%{translate:6px -10px;rotate:5.5deg;scale:1.05;filter:brightness(1.15)}}
@keyframes v128-number-3-small{0%,100%{translate:5px -8px;rotate:4deg;scale:1.035;filter:brightness(1.09)}50%{translate:-5px 8px;rotate:-4.5deg;scale:.98;filter:brightness(.93)}}
@keyframes v128-number-2{0%,100%{translate:5px 9px;rotate:4.5deg;scale:.96;filter:brightness(.9)}50%{translate:-5px -8px;rotate:-4.5deg;scale:1.04;filter:brightness(1.14)}}
@keyframes v128-symbol-plus{0%,100%{translate:-5px 8px;rotate:-4deg;scale:.98;filter:brightness(.93)}50%{translate:5px -8px;rotate:4deg;scale:1.045;filter:brightness(1.16)}}
@keyframes v128-island-wake{from{opacity:.45;filter:brightness(.82)}to{opacity:1;filter:brightness(1)}}
@keyframes v128-island-daily{0%,100%{translate:-2px 7px;rotate:-.6deg;filter:brightness(.97)}50%{translate:3px -7px;rotate:.6deg;filter:brightness(1.07)}}
@keyframes v128-island-custom{0%,100%{translate:-3px 8px;rotate:-.9deg;filter:brightness(.96)}50%{translate:4px -8px;rotate:.9deg;filter:brightness(1.08)}}
@keyframes v128-island-progress{0%,100%{translate:3px 6px;rotate:.5deg;filter:brightness(.97)}50%{translate:-3px -6px;rotate:-.5deg;filter:brightness(1.07)}}
@keyframes v128-island-label-daily{0%,100%{transform:translate3d(-2px,7px,0) rotate(-.6deg)}50%{transform:translate3d(3px,-7px,0) rotate(.6deg)}}
@keyframes v128-island-label-custom{0%,100%{transform:translate3d(-3px,8px,0) rotate(-.9deg)}50%{transform:translate3d(4px,-8px,0) rotate(.9deg)}}
@keyframes v128-island-label-progress{0%,100%{transform:translate3d(3px,6px,0) rotate(.5deg)}50%{transform:translate3d(-3px,-6px,0) rotate(-.5deg)}}
@keyframes v128-ring-clockwise{to{rotate:360deg}}@keyframes v128-ring-counter{to{rotate:-360deg}}@keyframes v128-band-clockwise{to{rotate:360deg}}@keyframes v128-band-counter{to{rotate:-360deg}}@keyframes v128-arc-clockwise{to{rotate:360deg}}@keyframes v128-arc-counter{to{rotate:-360deg}}
@keyframes v128-ring-shimmer{0%,100%{opacity:.55;filter:brightness(.94)}48%{opacity:.82;filter:brightness(1.22)}}
@keyframes v128-core-breathe{0%,100%{opacity:.68;scale:.99;filter:brightness(.95)}50%{opacity:.92;scale:1.018;filter:brightness(1.18)}}
@keyframes v128-surge-core{0%{opacity:.72;scale:1}17%{opacity:1;scale:1.08;filter:brightness(1.28)}53%{scale:1.16;filter:brightness(1.48)}100%{opacity:.72;scale:1;filter:brightness(1)}}
@keyframes v128-surge-ring{0%,16%{scale:1;filter:brightness(1)}33%{scale:1.018;filter:brightness(1.22)}53%{scale:1.026;filter:brightness(1.5)}100%{scale:1;filter:brightness(1)}}
@keyframes v128-surge-light{0%,16%{filter:brightness(1) saturate(1.08)}53%{filter:brightness(1.38) saturate(1.28)}100%{filter:brightness(1) saturate(1.08)}}
@keyframes v128-surge-numbers{0%,39%{filter:brightness(1)}53%,66%{filter:brightness(1.32)}100%{filter:brightness(1)}}
@keyframes v128-surge-path{0%,46%{filter:brightness(1)}73%{filter:brightness(1.55)}100%{filter:brightness(1)}}
@keyframes v128-path-stream{0%,72%,100%{opacity:.25;translate:-4px 9px}10%,30%{opacity:1;translate:5px -10px}42%{opacity:.5;translate:1px -2px}}
@keyframes v128-step-pulse{0%,7%,36%,100%{opacity:.12;scale:.92}12%,24%{opacity:1;scale:1.16}}
@keyframes v128-path-spark{0%,7%,38%,100%{opacity:0;translate:-.45vw .75vw;scale:.55}14%,25%{opacity:1;translate:.5vw -.6vw;scale:1.22}}

@media(max-width:1099px){
  .portal-world{filter:contrast(1.04) saturate(1.05)}
  .number-cube{animation-duration:10s}
  .feature-island{animation-duration:18s}
}

@media(prefers-reduced-motion:reduce){
  .reference-stage [data-reference-depth]{transform:none!important}
  .reference-object{animation:v128-reduced-float 18s ease-in-out infinite!important}
  .reference-portal-plate{animation:v128-reduced-portal 24s ease-in-out infinite!important}
  .reference-ring{animation-duration:60s!important;opacity:.28!important}
  .reference-energy-band,.reference-portal-arc,.reference-special-events{display:none!important}
  .reference-path-fx{opacity:.22!important;animation:none!important}
}
@keyframes v128-reduced-float{0%,100%{translate:0 2px}50%{translate:0 -2px}}
@keyframes v128-reduced-portal{0%,100%{filter:brightness(1)}50%{filter:brightness(1.05)}}

/* v1.32 signature portal journey. The approved homepage composition is unchanged. */
.leaving-for-game .game-transition{background:radial-gradient(circle at 50% 50%,#211565 0,#111148 28%,#07102f 58%,#020615 100%)}
.leaving-for-game .game-transition::before{animation:game-portal-v132 1.55s cubic-bezier(.16,.72,.18,1) forwards}
.leaving-for-game .game-transition::after{animation:game-rings-v132 1.5s .08s cubic-bezier(.16,.72,.18,1) forwards}
.leaving-for-game .game-transition i{animation:game-core-v132 1.55s ease-in forwards}
.leaving-for-game .game-transition span{animation:game-tunnel-v132 1.55s ease-out forwards}
.leaving-for-game .game-transition em{animation:game-symbol-v132 .78s .65s cubic-bezier(.2,.7,.2,1) forwards}
.leaving-for-game .game-transition b{animation:game-copy-v132 .42s 1.12s ease-out forwards}
.leaving-for-game main,.leaving-for-game .site-header,.leaving-for-game footer{animation:world-enter-v132 1.45s ease-in forwards}
@keyframes game-portal-v132{0%{opacity:.15;transform:translate(-50%,-50%) scale(.12);filter:brightness(1)}24%{opacity:.92;filter:brightness(1.2) saturate(1.2)}58%{opacity:1;transform:translate(-50%,-50%) scale(.78);filter:brightness(1.35) saturate(1.3)}100%{opacity:.96;transform:translate(-50%,-50%) scale(2.4);filter:brightness(1.15) saturate(1.22)}}
@keyframes game-rings-v132{0%{opacity:0;transform:translate(-50%,-50%) scale(.12) rotate(0)}24%{opacity:.78}72%{opacity:1;transform:translate(-50%,-50%) scale(1.05) rotate(110deg)}100%{opacity:.38;transform:translate(-50%,-50%) scale(2.25) rotate(190deg)}}
@keyframes game-core-v132{0%{opacity:.2;transform:translate(-50%,-50%) scale(.08)}48%{opacity:.92}100%{opacity:.48;transform:translate(-50%,-50%) scale(8);filter:brightness(1.25) saturate(1.3)}}
@keyframes game-tunnel-v132{0%{opacity:0;transform:translate(-50%,-50%) scale(.12) rotate(0)}35%{opacity:.46}100%{opacity:.75;transform:translate(-50%,-50%) scale(2.5) rotate(160deg)}}
@keyframes game-symbol-v132{0%{opacity:0;transform:translate(-50%,-50%) scale(.24)}18%{opacity:.82}100%{opacity:0;transform:translate(calc(-50% + var(--tx)),calc(-50% + var(--ty))) scale(2.8)}}
@keyframes game-copy-v132{0%{opacity:0;transform:translateY(10px);letter-spacing:.3em}100%{opacity:1;transform:none;letter-spacing:.22em}}
@keyframes world-enter-v132{0%{transform:scale(1);filter:none}55%{transform:scale(1.04);filter:brightness(1.12) saturate(1.16)}100%{transform:scale(1.11);filter:brightness(.72) saturate(1.35) blur(3px)}}
@media(max-width:720px){.leaving-for-game .game-transition::before,.leaving-for-game .game-transition::after,.leaving-for-game .game-transition i,.leaving-for-game .game-transition span{animation-duration:1.5s}.leaving-for-game main,.leaving-for-game .site-header,.leaving-for-game footer{animation-duration:1.42s}}
@media(prefers-reduced-motion:reduce){.leaving-for-game .game-transition{transition:opacity .12s}.leaving-for-game .game-transition::before{opacity:.82;transform:translate(-50%,-50%) scale(1.08)}.leaving-for-game .game-transition b{opacity:1}.leaving-for-game main,.leaving-for-game .site-header,.leaving-for-game footer{animation:none!important}}

/* v1.34 — approved world refinement and three-second universe entry. */
@media(min-width:1100px){
  .reference-art{image-rendering:auto;filter:contrast(1.055) saturate(1.055)}
  .reference-portal-plate,.reference-island-art{image-rendering:auto;backface-visibility:hidden;transform:translateZ(0)}
  .ref-hero-copy h1{letter-spacing:-.052em;text-shadow:0 .12vw .75vw #000,0 0 1.8vw #041229}
  .ref-hero-copy h1 strong{filter:drop-shadow(0 0 .65vw #488fff5e)}
  .ref-description{line-height:1.5;max-width:20vw;text-shadow:0 .1vw .5vw #000}
  .ref-hero-copy::before{inset:-2vw -4vw -2vw -5vw;background:radial-gradient(ellipse at 42% 46%,#020611f2 0 32%,#020611c9 51%,#02061168 67%,transparent 79%)}
  .ref-button{border-radius:.68vw;border-color:#bfeeff9c;background:linear-gradient(112deg,#158fee,#5847f2 48%,#c62cda);box-shadow:inset 0 1px #fff7,0 0 1.15vw #36cfff70,0 .7vw 1.55vw #0008;letter-spacing:-.015em}
  .ref-button::after{content:"";position:absolute;inset:3px;border:1px solid #fff3;border-radius:calc(.68vw - 3px);pointer-events:none}
  .ref-button:hover{translate:0 -.22vw;filter:brightness(1.13) saturate(1.08);box-shadow:inset 0 1px #fff9,0 0 1.75vw #52e2ffaa,0 0 3.2vw #943bff66,0 .9vw 1.7vw #0009}
  .ref-button:active{translate:0 .12vw;scale:.97;transition-duration:.08s}
  .ref-glass{border-width:0;border-top:1px solid #a7deff5c;border-bottom:1px solid #7084ca38;border-radius:.35vw;background:linear-gradient(180deg,#071426a8,#07101fa0);box-shadow:0 .75vw 1.7vw #00058,inset 0 1px #fff18;backdrop-filter:blur(.28vw) saturate(1.08)}
  .ref-steps{position:relative}.ref-steps::before{content:"";position:absolute;left:5%;right:5%;top:1.28vw;height:1px;background:linear-gradient(90deg,#65dafa33,#7abfff99,#bd72ff45)}
  .ref-steps>section{background:transparent;border-left-color:#a9d7ff18}.ref-steps>section>b{position:relative;z-index:2;box-shadow:0 0 .7vw #409eff66}
  .ref-example-numbers i{border-radius:.28vw;background:linear-gradient(155deg,#334d76,#18243b);box-shadow:0 .24vw .5vw #0005,inset 0 1px #fff3}
  .ref-equations{position:relative}.ref-equations::before{content:"";position:absolute;left:47%;top:-.18vw;bottom:-.18vw;width:1px;background:linear-gradient(transparent,#6cddff55,transparent)}
  .play-intent .reference-portal-plate{filter:brightness(1.16) saturate(1.16)!important}
  .play-intent .reference-core-glow{scale:1.06;filter:brightness(1.28)}
  .play-intent .reference-number-glows,.play-intent .reference-path-fx{filter:brightness(1.22)}
}

.transition-depth,.transition-geometry,.transition-route,.transition-target,.transition-stones,.transition-ops{position:absolute;z-index:1;opacity:0;pointer-events:none}
.transition-depth{inset:-20%;background:radial-gradient(circle at 50% 50%,transparent 0 12%,#35237b40 28%,#071737c7 55%,#020613 78%),radial-gradient(circle at 22% 28%,#2978ff42 0 1px,transparent 2px),radial-gradient(circle at 72% 62%,#e68aff52 0 1px,transparent 2px),radial-gradient(circle at 43% 78%,#93efff63 0 1.2px,transparent 2px);background-size:auto,43px 43px,67px 67px,91px 91px;transform:perspective(700px) translateZ(-200px) scale(.72)}
.transition-depth::before,.transition-depth::after{content:"";position:absolute;inset:12%;border-radius:50%;border:1px solid #69dfff36;box-shadow:0 0 7vmax #643cff35;transform:rotateX(68deg) rotateZ(18deg)}
.transition-depth::after{inset:24%;border-color:#d86cff42;transform:rotateY(62deg) rotateZ(-24deg)}
.transition-geometry{left:50%;top:50%;display:grid;place-items:center;width:52vmin;height:52vmin;border:1px solid #8ceaff42;clip-path:polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%);background:repeating-conic-gradient(from 30deg,#75ddff18 0 1deg,transparent 1deg 30deg);transform:translate(-50%,-50%) scale(.36) rotate(-18deg);color:#b8f6ff;text-align:center}
.transition-geometry::before{content:"";position:absolute;inset:18%;border:1px solid #cb76ff55;clip-path:polygon(50% 0,100% 100%,0 100%)}
.transition-geometry strong{font:300 clamp(70px,14vw,190px)/1 Georgia,serif;text-shadow:0 0 35px #64dfff75}.transition-geometry small{position:absolute;bottom:15%;font:600 clamp(8px,1vw,13px)/1 ui-monospace,monospace;letter-spacing:.28em;color:#c9d5ff}
.transition-route{left:50%;bottom:-28%;width:7vmin;height:95vh;border-inline:1px solid #72e9ff47;background:linear-gradient(180deg,transparent,#713dff3b,#66e6ff78);box-shadow:0 0 4vmax #4d50ff44;transform:perspective(400px) translateX(-50%) rotateX(62deg);transform-origin:bottom}
.transition-target{left:50%;top:50%;display:grid;place-items:center;width:19vmin;height:19vmin;border:1px solid #9cefff8c;border-radius:50%;background:radial-gradient(circle,#193e84,#0a1b54 58%,#080b2a 72%);box-shadow:inset 0 0 3vmax #51cfff66,0 0 4vmax #7645ff77;transform:translate(-50%,-50%) scale(.16);text-align:center}
.transition-target small{align-self:end;color:#bcecff;font:700 9px/1 system-ui;letter-spacing:.25em;text-transform:uppercase}.transition-target strong{align-self:start;color:#f2fbff;font:750 clamp(34px,6vw,84px)/1 ui-monospace,monospace;text-shadow:0 0 20px #75eaff}
.transition-stones{left:50%;top:63%;display:flex;gap:1.1vmin;transform:translate(-50%,-50%)}
.transition-stones small{display:grid;place-items:center;width:clamp(32px,5vmin,62px);height:clamp(32px,5vmin,62px);border:1px solid #f5f2dc;border-bottom:4px solid #9bbab7;border-radius:13px 5px 13px 5px;background:linear-gradient(145deg,#fffbed,#d9e8e5);box-shadow:0 10px 24px #02061799;color:#19384b;font:750 clamp(11px,1.5vw,19px)/1 ui-monospace,monospace;opacity:0;transform:translateY(-24px) scale(.82)}
.transition-stones small:nth-child(1),.transition-stones small:nth-child(3){border-bottom-color:#b99a55;background:linear-gradient(145deg,#fff8df,#e5d4ab)}
.transition-ops{left:50%;top:72%;display:flex;gap:8px;transform:translate(-50%,-50%) scale(.85)}
.transition-ops small{display:grid;place-items:center;width:34px;height:34px;border:1px solid #8ceaff55;border-radius:8px 3px 8px 3px;background:#172b55d9;color:#d9f8ff;font:700 16px/1 ui-monospace,monospace}
.leaving-for-game .game-transition{background:radial-gradient(circle at 50% 50%,#24176a 0,#101346 30%,#06102e 58%,#020615 100%)}
.leaving-for-game .game-transition::before{animation:game-portal-v134 1.28s cubic-bezier(.12,.7,.16,1) forwards}
.leaving-for-game .game-transition::after{animation:game-rings-v134 1.35s .08s cubic-bezier(.12,.7,.16,1) forwards}
.leaving-for-game .game-transition>i{animation:game-core-v134 1.3s ease-in forwards}
.leaving-for-game .game-transition>span{animation:game-tunnel-v134 1.42s ease-out forwards}
.leaving-for-game .game-transition>em{animation:game-symbol-v134 .72s .72s cubic-bezier(.16,.72,.2,1) forwards}
.leaving-for-game .transition-depth{animation:universe-depth-v134 2s .95s cubic-bezier(.16,.72,.2,1) forwards}
.leaving-for-game .transition-geometry{animation:universe-reveal-v134 .82s 1.52s ease-in-out both}
.leaving-for-game .transition-route{animation:universe-route-v134 1.2s 1.42s ease-out both}
.leaving-for-game .transition-target{animation:universe-target-v134 .8s 2.08s cubic-bezier(.16,.72,.2,1) both}
.leaving-for-game .transition-stones{opacity:1}
.leaving-for-game .transition-stones small{animation:universe-stone-v134 .34s 2.48s ease-out forwards}.leaving-for-game .transition-stones small:nth-child(2){animation-delay:2.52s}.leaving-for-game .transition-stones small:nth-child(3){animation-delay:2.56s}.leaving-for-game .transition-stones small:nth-child(4){animation-delay:2.60s}.leaving-for-game .transition-stones small:nth-child(5){animation-delay:2.64s}.leaving-for-game .transition-stones small:nth-child(6){animation-delay:2.68s}
.leaving-for-game .transition-ops{animation:universe-ops-v134 .3s 2.74s ease-out both}
.leaving-for-game .game-transition>b{animation:game-copy-v134 .25s 2.82s ease-out forwards}
.leaving-for-game main,.leaving-for-game .site-header,.leaving-for-game footer{animation:world-enter-v134 1.25s ease-in forwards}
@keyframes game-portal-v134{0%{opacity:.15;transform:translate(-50%,-50%) scale(.12);filter:brightness(1)}32%{opacity:.96;filter:brightness(1.26) saturate(1.24)}75%{opacity:1;transform:translate(-50%,-50%) scale(1.04);filter:brightness(1.42) saturate(1.34)}100%{opacity:.18;transform:translate(-50%,-50%) scale(3.1);filter:brightness(1.1) saturate(1.24)}}
@keyframes game-rings-v134{0%{opacity:0;transform:translate(-50%,-50%) scale(.12) rotate(0)}28%{opacity:.84}74%{opacity:1;transform:translate(-50%,-50%) scale(1.2) rotate(125deg)}100%{opacity:0;transform:translate(-50%,-50%) scale(3) rotate(235deg)}}
@keyframes game-core-v134{0%{opacity:.2;transform:translate(-50%,-50%) scale(.08)}64%{opacity:.9}100%{opacity:0;transform:translate(-50%,-50%) scale(10);filter:brightness(1.18) saturate(1.35)}}
@keyframes game-tunnel-v134{0%{opacity:0;transform:translate(-50%,-50%) scale(.12) rotate(0)}35%{opacity:.48}86%{opacity:.7}100%{opacity:0;transform:translate(-50%,-50%) scale(3.4) rotate(190deg)}}
@keyframes game-symbol-v134{0%{opacity:0;transform:translate(-50%,-50%) scale(.18)}22%{opacity:.86}100%{opacity:0;transform:translate(calc(-50% + var(--tx)),calc(-50% + var(--ty))) scale(3.6)}}
@keyframes universe-depth-v134{0%{opacity:0;transform:perspective(700px) translateZ(-300px) scale(.65)}28%{opacity:1}100%{opacity:1;transform:perspective(700px) translateZ(180px) scale(1.55)}}
@keyframes universe-reveal-v134{0%{opacity:0;transform:translate(-50%,-50%) scale(.36) rotate(-18deg)}38%{opacity:.72}68%{opacity:.9;transform:translate(-50%,-50%) scale(1.02) rotate(3deg)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.35) rotate(8deg)}}
@keyframes universe-route-v134{0%{opacity:0;transform:perspective(400px) translateX(-50%) rotateX(62deg) scaleY(.2)}38%,76%{opacity:.72}100%{opacity:.1;transform:perspective(400px) translateX(-50%) rotateX(62deg) scaleY(1.5)}}
@keyframes universe-target-v134{0%{opacity:0;transform:translate(-50%,-50%) scale(.16)}52%{opacity:1}100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes universe-stone-v134{to{opacity:1;transform:none}}
@keyframes universe-ops-v134{from{opacity:0;transform:translate(-50%,-50%) scale(.75)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes game-copy-v134{from{opacity:0;transform:translateY(8px);letter-spacing:.3em}to{opacity:1;transform:none;letter-spacing:.22em}}
@keyframes world-enter-v134{0%{transform:scale(1);filter:none}70%{transform:scale(1.045);filter:brightness(1.12) saturate(1.16)}100%{transform:scale(1.12);filter:brightness(.55) saturate(1.3)}}

@media(max-width:720px){
  .transition-depth{background-size:auto,58px 58px,84px 84px,108px 108px}
  .transition-geometry{width:66vmin;height:66vmin}.transition-route{width:12vmin}.transition-target{width:31vmin;height:31vmin}.transition-stones{gap:5px}.transition-ops{top:76%}
  .transition-stones small{width:38px;height:38px}.transition-stones small:nth-child(n+5){display:none}
  .leaving-for-game .game-transition::before,.leaving-for-game .game-transition::after,.leaving-for-game .game-transition>i,.leaving-for-game .game-transition>span{animation-duration:1.25s}
}
@media(prefers-reduced-motion:reduce){
  .transition-depth,.transition-geometry,.transition-route,.transition-target,.transition-stones,.transition-ops{display:none!important}
  .leaving-for-game .game-transition>b{animation:none!important;opacity:1;transform:none}
}