:root{color-scheme:dark;--bg:#050b0e;--emerald:#00cba5;--ink:#edf7f5}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg)}body{font-family:Arial,Helvetica,sans-serif;color:var(--ink);overflow-x:hidden}
.experience{position:relative;min-height:100svh;height:100svh;min-height:600px;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 50% 42%,#0b1b21 0%,#050d11 43%,#03080b 100%)}
.atmosphere,.vignette,#dust{position:absolute;inset:0;pointer-events:none}.atmosphere{z-index:-2}.aurora{position:absolute;width:75vw;height:85vh;max-width:1100px;left:50%;top:-32%;background:radial-gradient(ellipse,rgba(0,159,132,.13),transparent 64%);filter:blur(50px);transform:translateX(-50%) rotate(-22deg);animation:aurora 22s ease-in-out infinite alternate}.light-fan{position:absolute;width:60vw;height:150vh;left:50%;top:-97%;background:conic-gradient(from 153deg at 50% 0%,transparent 0deg,rgba(135,234,230,.028) 10deg,transparent 21deg,rgba(0,190,150,.034) 34deg,transparent 44deg);filter:blur(25px);transform:translateX(-50%);animation:fan 24s ease-in-out infinite alternate}.vignette{background:radial-gradient(ellipse at center,transparent 24%,rgba(1,5,7,.56) 100%)}#dust{z-index:-1;opacity:.55}
.stage{position:absolute;top:48%;left:50%;width:min(88vw,680px);transform:translate(-50%,-50%);text-align:center;perspective:1100px}
.brand{position:relative;transform-style:preserve-3d;will-change:transform}.symbol-wrap{width:clamp(210px,29vw,340px);height:auto;aspect-ratio:200/192;margin:0 auto 20px;animation:arrive 2.8s cubic-bezier(.16,1,.3,1) both}.symbol-float{animation:float 9s ease-in-out infinite;filter:drop-shadow(0 12px 24px rgba(0,0,0,.4));transform-style:preserve-3d}.symbol{display:block;width:100%;height:auto;overflow:visible}.shine{transform:translateX(-150px);animation:shine 9s ease-in-out infinite;mix-blend-mode:screen}.rim{animation:rim 7s ease-in-out infinite alternate}
.wordmark{width:clamp(265px,34vw,405px);margin:0 auto;line-height:0;mix-blend-mode:screen;animation:word-arrive 2.5s .38s cubic-bezier(.16,1,.3,1) both}.wordmark svg{display:block;width:100%;height:auto}
.soon-wrap{position:relative;margin-top:42px;animation:copy-arrive 1.8s 1.2s both}.line{display:block;margin:auto auto 22px;width:27px;height:1px;background:linear-gradient(90deg,transparent,#00d5ad,transparent);box-shadow:0 0 18px rgba(0,214,172,.22)}.soon{margin:0;color:#b4c4c7;font-size:12px;font-weight:400;letter-spacing:.46em;text-indent:.46em;line-height:1.5}
.halo{position:absolute;width:75%;aspect-ratio:1.1;top:0;left:50%;transform:translate(-50%,-9%);background:radial-gradient(ellipse,rgba(0,167,129,.11),rgba(0,114,101,.025) 42%,transparent 65%);filter:blur(25px);animation:breathe 10s ease-in-out infinite}
.floor{position:absolute;left:50%;bottom:-95px;width:72%;height:42px;transform:translateX(-50%);background:radial-gradient(ellipse,rgba(0,180,139,.09),transparent 70%);filter:blur(14px);animation:breathe 10s ease-in-out infinite}
footer{position:absolute;bottom:28px;left:42px;right:42px;display:flex;justify-content:space-between;align-items:center;gap:20px;color:#596d73;font-size:9px;letter-spacing:.2em}
.paused *, .paused *::before,.paused *::after{animation-play-state:paused!important}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes arrive{from{opacity:0;filter:blur(18px);transform:translateY(38px) scale(.9) rotateY(-15deg)}to{opacity:1;filter:blur(0);transform:translateY(0) scale(1) rotateY(0)}}
@keyframes word-arrive{from{opacity:0;filter:blur(9px);transform:translateY(18px)}to{opacity:1;filter:blur(0);transform:translateY(0)}}
@keyframes copy-arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes float{0%,100%{transform:translateY(0) rotateZ(-1deg) rotateY(-3deg)}50%{transform:translateY(-10px) rotateZ(1deg) rotateY(4deg)}}
@keyframes shine{0%,18%{transform:translateX(-160px);opacity:0}26%{opacity:.38}49%{transform:translateX(280px);opacity:0}100%{transform:translateX(280px);opacity:0}}
@keyframes rim{0%{opacity:.25}100%{opacity:.9}}
@keyframes aurora{from{transform:translateX(-57%) rotate(-24deg);opacity:.55}to{transform:translateX(-43%) rotate(17deg);opacity:1}}
@keyframes fan{from{transform:translateX(-58%) rotate(-9deg)}to{transform:translateX(-45%) rotate(8deg)}}
@keyframes breathe{0%,100%{opacity:.45}50%{opacity:1}}
@media(max-width:600px){.experience{min-height:520px}.stage{top:46%}.symbol-wrap{width:clamp(200px,62vw,300px);margin-bottom:22px}.wordmark{width:clamp(250px,73vw,345px)}.soon-wrap{margin-top:34px}.soon{font-size:11px;letter-spacing:.37em}.floor{bottom:-80px}footer{left:22px;right:22px;bottom:22px;font-size:8px}.aurora{width:130vw}.light-fan{width:110vw}}
@media(max-height:680px) and (min-width:601px){.experience{min-height:440px}.symbol-wrap{width:230px}.wordmark{width:300px}.soon-wrap{margin-top:24px}.stage{top:45%}.floor{bottom:-50px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.shine{opacity:0}.brand{transform:none!important}}


/* The pointer light is clipped to the original logo, so its geometry stays intact. */
.symbol{transition:filter .32s ease;filter:brightness(1) saturate(1)}
.cursor-glow{opacity:0;mix-blend-mode:screen;transition:opacity .3s ease;pointer-events:none}
.hover-shine{opacity:0;mix-blend-mode:screen;pointer-events:none}
.brand.is-lit .symbol{filter:brightness(1.38) saturate(1.22) drop-shadow(0 0 10px rgba(100,255,221,.4)) drop-shadow(0 0 32px rgba(0,233,169,.3))}
.brand.is-lit .cursor-glow{opacity:.96}
.brand.is-lit .hover-shine{animation:hover-sweep 2.6s cubic-bezier(.2,.5,.4,1) infinite}
.brand.is-lit .rim{opacity:1;stroke-width:1.05;animation:none}
.wordmark svg{transition:filter .32s ease}
.brand.is-lit .wordmark svg{filter:brightness(1.3) drop-shadow(0 0 5px rgba(152,255,230,.36))}
@keyframes hover-sweep{0%{transform:translateX(-80px);opacity:0}12%{opacity:.95}65%{transform:translateX(290px);opacity:.85}82%,100%{transform:translateX(300px);opacity:0}}
@media(prefers-reduced-motion:reduce){.brand.is-lit .hover-shine{animation:none!important;opacity:0}.brand.is-lit .symbol{filter:brightness(1.25) drop-shadow(0 0 14px rgba(0,233,169,.25))}}

/* Deep-blue galactic atmosphere; the emblem remains the visual center. */
.experience{background:radial-gradient(ellipse at 50% 45%,#07101c 0%,#040a17 48%,#02050e 100%)}
#dust{opacity:1}
.aurora{background:radial-gradient(ellipse,rgba(27,65,163,.18),rgba(9,32,99,.07) 40%,transparent 68%)}
.light-fan{background:conic-gradient(from 153deg at 50% 0%,transparent 0deg,rgba(93,134,222,.035) 10deg,transparent 21deg,rgba(37,72,169,.04) 34deg,transparent 44deg)}
.vignette{background:radial-gradient(ellipse at center,transparent 30%,rgba(1,3,12,.55) 100%)}
.floor{background:radial-gradient(ellipse,rgba(28,77,167,.13),transparent 70%)}

/* Resolution-independent SVG geometry, with no embedded raster texture. */
.symbol,.wordmark svg{shape-rendering:geometricPrecision}