:root{--mint:#62efd0;--purple:#a83fff;--white:#f8f5fb;--muted:#bcb5c5;--ease:cubic-bezier(.16,1,.3,1)}
*{box-sizing:border-box;font-style:normal!important}html{background:#000;scroll-behavior:auto;scroll-snap-type:y mandatory;overscroll-behavior-y:none}body{margin:0;overflow-x:hidden;background:#000;color:var(--white);font-family:Inter,"Noto Sans",Arial,sans-serif;overscroll-behavior-y:none}body.intro-open{overflow:hidden}button,a{font:inherit;color:inherit}button{cursor:pointer}.panel{position:relative;width:100%;height:100svh;min-height:100svh;overflow:hidden;scroll-snap-align:start;scroll-snap-stop:always;background:#000}
.intro{position:fixed;z-index:9000;inset:0;background:#000;overflow:hidden;transition:opacity .7s var(--ease),visibility .7s}.intro.done{opacity:0;visibility:hidden;pointer-events:none}.intro-brand{position:absolute;z-index:4;left:max(22px,env(safe-area-inset-left));top:max(20px,env(safe-area-inset-top));display:flex;align-items:center;gap:9px}.intro-brand img{width:27px;height:27px}.intro-brand b{font-size:13px;color:#fff}#logo-button{position:absolute;z-index:3;left:50%;top:50%;width:clamp(200px,23vw,315px);aspect-ratio:1;transform:translate(-50%,-50%);padding:0;border:0;background:transparent;outline:0;touch-action:none;will-change:transform}#logo-button:focus-visible{border-radius:50%;outline:2px solid var(--mint);outline-offset:10px}#logo-rig,#living-logo{display:block;width:100%;height:100%;overflow:visible;will-change:transform}#logo-object{transform-origin:128px 128px;will-change:transform}#logo-dots{pointer-events:none}#logo-dots circle{transform-box:fill-box;transform-origin:center;animation:dotDance 1.4s ease-in-out infinite}#logo-dots circle:nth-child(2){animation-delay:.14s}#logo-dots circle:nth-child(3){animation-delay:.28s}.logo-gloss{filter:blur(5px)}@keyframes dotDance{0%,55%,100%{transform:translateY(0) scale(1)}18%{transform:translateY(-8px) scale(1.12)}34%{transform:translateY(2px) scale(.9)}}#start-button{position:absolute;z-index:4;left:50%;bottom:max(20px,env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;align-items:center;gap:13px;min-width:120px;min-height:40px;justify-content:center;padding:10px 22px;border:1px solid rgba(98,239,208,.6);border-radius:999px;background:transparent;color:var(--mint);font-size:12px;font-weight:800;letter-spacing:.26em;opacity:.78}#start-button:hover,#start-button:focus-visible{opacity:1;border-color:var(--mint);outline:0}#start-button b{font-size:17px;font-weight:400;animation:arrow 1.3s ease-in-out infinite}@keyframes arrow{50%{transform:translateX(5px)}}body.entered #logo-button{position:fixed;z-index:10000;width:70px;pointer-events:none}body.entered #logo-object{animation:none}
#site-header{position:fixed;z-index:8000;left:24px;right:54px;top:16px;height:62px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 18px;border:1px solid rgba(255,255,255,.12);border-radius:20px;background:rgba(0,0,0,.86);backdrop-filter:blur(18px);opacity:0;transform:translateY(-12px);transition:.55s var(--ease);pointer-events:none}body.entered #site-header{opacity:1;transform:none;pointer-events:auto}.brand{display:flex;align-items:center;gap:9px;width:max-content;text-decoration:none}.brand img{width:27px;height:27px}.brand b{font-size:14px}.section-status{display:flex;align-items:center;min-width:0;text-transform:uppercase;letter-spacing:.12em}.section-status b{font-size:12px;white-space:nowrap}.section-status.typing b{animation:headerType .34s var(--ease)}@keyframes headerType{from{opacity:0;transform:translateY(8px);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}.language-control{position:relative;justify-self:end;margin-right:7px}.language-control>button{display:grid;place-items:center;width:46px;height:46px;padding:0;border:0;background:transparent;color:#aaa}.language-control>button:hover{color:var(--mint)}.language-control svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.35}#language-menu{position:absolute;z-index:4;right:0;top:49px;width:230px;padding:8px;border:1px solid rgba(255,255,255,.1);border-radius:13px;background:#050505;box-shadow:0 20px 65px #000;opacity:0;visibility:hidden;transform:translateY(-8px);transition:.22s var(--ease)}#language-menu.open{opacity:1;visibility:visible;transform:none}#language-menu button{display:grid;grid-template-columns:42px 1fr;width:100%;padding:10px 11px;border:0;border-radius:8px;background:transparent;text-align:left;color:#aaa5ae}#language-menu button:hover{background:#111;color:#fff}#language-menu small{color:#64616a;font-size:10px;letter-spacing:.1em}#language-menu span{font-size:12px;color:inherit}#language-menu button.active span{color:var(--mint)}#language-menu button.active small{color:#8b918f}.header-progress{position:absolute;left:18px;right:18px;bottom:-1px;height:1px;background:rgba(255,255,255,.07);overflow:hidden}.header-progress span{display:block;width:100%;height:100%;transform:scaleX(0);transform-origin:left;background:linear-gradient(90deg,var(--purple),var(--mint))}
.hero{display:grid;place-items:center;padding:120px 5vw;text-align:center}.hero-copy{width:min(94vw,1320px)}.eyebrow{margin:0;color:var(--mint);font-size:11px;font-weight:850;letter-spacing:.23em}.hero h1{margin:20px 0 30px;font-size:clamp(52px,8.4vw,138px);line-height:.88;letter-spacing:-.065em}.hero-line{display:block;white-space:nowrap}.hero h1 em{display:block;color:var(--purple)}.hero-body{max-width:760px;margin:auto;color:var(--muted);font-size:clamp(16px,1.35vw,21px);line-height:1.7}.explore{position:absolute;left:50%;bottom:34px;transform:translateX(-50%);display:flex;align-items:center;gap:14px;padding:11px 24px;border:1px solid rgba(98,239,208,.65);border-radius:999px;color:var(--mint);font-size:12px;text-decoration:none}.explore b{animation:down 1.4s ease-in-out infinite}@keyframes down{50%{transform:translateY(5px)}}
.story{--frame-w:min(91vw,calc(78svh * 39 / 22),1420px);display:grid;place-items:center}.story-stage{position:relative;width:var(--frame-w);aspect-ratio:39/22;overflow:hidden;border:1px solid rgba(98,239,208,calc(.25 * (1 - var(--fade,0))));border-radius:28px;background:#000}.story-video,.video-mask{position:absolute;inset:0;width:100%;height:100%;border-radius:inherit}.story-video{z-index:0;object-fit:cover;background:#000;filter:saturate(1.1) contrast(1.04)}.video-mask{z-index:1;background:rgba(0,0,0,var(--fade,0));pointer-events:none}.story-content{position:absolute;z-index:2;inset:0;display:grid;grid-template-columns:minmax(330px,.88fr) minmax(410px,1.12fr);gap:clamp(32px,4.2vw,72px);align-items:center;padding:clamp(28px,3.3vw,58px)}.screen-shell,.story-copy{opacity:var(--reveal,0);transform:translateY(calc((1 - var(--reveal,0))*22px)) scale(calc(.97 + var(--reveal,0)*.03));transition:opacity .18s linear,transform .35s var(--ease)}.screen-shell{position:relative;margin:auto;overflow:hidden;border:1px solid rgba(255,255,255,.24);background:#050507;box-shadow:0 25px 80px rgba(0,0,0,.68)}.screen-shell.mobile{width:min(29vw,350px);height:min(67svh,640px);padding:8px;border-radius:42px}.screen-shell.mobile:before{content:"";position:absolute;z-index:5;left:50%;top:8px;width:24%;height:4px;transform:translateX(-50%);border-radius:99px;background:#2b2930;pointer-events:none}.screen-shell.mobile:after{content:"";position:absolute;z-index:5;left:50%;bottom:7px;width:26%;height:4px;transform:translateX(-50%);border-radius:99px;background:#d8d4dc;opacity:.55;pointer-events:none}.screen-shell.desktop{width:min(47vw,700px);height:min(57svh,540px);padding:5px;border-radius:24px}.screen-shell iframe{width:100%;height:100%;border:0;border-radius:inherit;background:#050507}.demo-pointer{position:absolute;z-index:6;left:50%;top:50%;width:16px;height:16px;border:2px solid var(--mint);border-radius:50%;opacity:0;pointer-events:none;box-shadow:0 0 0 6px rgba(98,239,208,.09);transition:left .38s var(--ease),top .38s var(--ease),opacity .2s}.demo-pointer.show{opacity:1}.demo-pointer.click{animation:demoClick .32s ease}@keyframes demoClick{50%{transform:scale(.55);box-shadow:0 0 0 14px rgba(98,239,208,.14)}}.story-copy{max-width:660px}.story-copy h2{margin:0 0 18px;font-size:clamp(40px,4.5vw,72px);line-height:.94;letter-spacing:-.052em;color:#fff}.story-copy h2 em{color:var(--purple);font-weight:inherit}.story-copy p{max-width:620px;margin:0;color:#d4cdd9;font-size:clamp(15px,1.05vw,17px);line-height:1.68}.story-points{display:grid;gap:8px;margin:19px 0 0;padding:0;list-style:none}.story-points li{color:#c7c1cb;font-size:clamp(13px,.9vw,15px);line-height:1.4}.story-points li:before{content:"→";margin-right:10px;color:var(--mint);font-weight:900}.type-word{display:inline-block;white-space:nowrap}.type-space{display:inline-block;width:.28em}.type-char{display:inline-block;opacity:0;transform:translateY(.5em);filter:blur(2px);font-style:normal!important}.type-run .type-char{animation:typeIn .25s var(--ease) var(--td) forwards}@keyframes typeIn{to{opacity:1;transform:none;filter:none}}
.ending{display:grid;place-items:center}.ending-frame{position:relative;width:min(91vw,calc(78svh * 39 / 22),1420px);aspect-ratio:39/22;overflow:hidden;border-radius:28px;background:#000}.ending-frame>video,.ending-mask{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.ending-mask{background:rgba(0,0,0,.72)}.ending-content{position:absolute;z-index:2;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.ending-content>svg{width:clamp(140px,17vw,250px);margin-bottom:clamp(26px,4vh,48px);overflow:visible;animation:endFloat 2.8s ease-in-out infinite alternate}.end-logo-object{transform-origin:center;animation:endBreathe 2.4s ease-in-out infinite}.end-dots circle{transform-box:fill-box;transform-origin:center;animation:dotDance 1.4s ease-in-out infinite}.end-dots circle:nth-child(2){animation-delay:.14s}.end-dots circle:nth-child(3){animation-delay:.28s}@keyframes endFloat{to{transform:translateY(-20px)}}@keyframes endBreathe{50%{transform:scale(1.035,.98)}}.ending-copy h2{margin:0;font-size:clamp(58px,9vw,130px);letter-spacing:-.065em}.ending-copy p{margin:9px 0 20px;color:var(--mint);font-size:clamp(17px,2vw,30px)}.ending-copy b{font-size:clamp(13px,1.25vw,18px);letter-spacing:.22em}
@media(max-width:900px){#logo-button{width:min(60vw,255px)}#site-header{left:9px;right:20px;top:8px;height:58px;padding:0 13px}.section-status b{max-width:42vw;overflow:hidden;text-overflow:ellipsis;font-size:10px}.language-control{margin-right:2px}.language-control>button{width:42px;height:42px}.brand b{font-size:13px}.story{--frame-w:calc(100vw - 22px);padding-top:68px}.story-stage{width:var(--frame-w);height:calc(100svh - 88px);aspect-ratio:auto;border-radius:22px}.story-video{object-fit:cover}.story-content{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:15px;padding:50px 14px 18px}.screen-shell.mobile{width:min(68vw,330px);height:min(51svh,560px);padding:7px}.screen-shell.desktop{width:min(94vw,680px);height:min(46svh,480px)}.story-copy{order:-1;align-self:end;margin:auto;text-align:center}.story-copy h2{margin:0 0 10px;font-size:clamp(32px,8.6vw,50px)}.story-copy p{font-size:14px;line-height:1.5}.story-points{gap:4px;margin-top:10px}.story-points li{font-size:12px}.hero{padding-left:18px;padding-right:18px}.hero h1{font-size:clamp(42px,11vw,76px)}.ending-frame{width:calc(100vw - 22px);height:calc(100svh - 92px);aspect-ratio:auto;margin-top:68px}.ending-content>svg{width:clamp(126px,34vw,200px)}}
@media(max-width:560px){.intro-brand{left:17px;top:16px}.hero h1{font-size:clamp(35px,9.4vw,52px)}.hero-body{font-size:15px}.story-content{padding:48px 12px 15px}.story-copy h2{font-size:clamp(29px,8.4vw,42px)}.story-copy p{font-size:12.5px}.story-points li{font-size:11.5px}.screen-shell.mobile{width:min(72vw,310px);height:min(49svh,520px)}.ending-copy h2{font-size:17vw}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* Production typography, localization and ending behavior */
.story-copy{max-width:680px;min-width:0;overflow:visible}.scene-kicker{margin:0 0 13px!important;color:var(--mint)!important;font-size:clamp(11px,.78vw,13px)!important;font-weight:850;letter-spacing:.16em;text-transform:uppercase;line-height:1.45!important}.story-copy h2{max-width:100%;margin-bottom:20px;line-height:1.02;overflow-wrap:normal;word-break:keep-all}.story-copy h2>span,.story-copy h2>em{display:block}.story-copy>p:not(.scene-kicker){max-width:640px;font-size:clamp(15px,1.05vw,17px);line-height:1.72;white-space:normal;overflow-wrap:break-word}.story-points{gap:9px;margin-top:20px}.story-points li{line-height:1.48;overflow-wrap:break-word}.type-glyph{white-space:normal}.type-run .type-char{animation-duration:.22s}
body[data-lang="zh"] .story-copy>p,body[data-lang="ja"] .story-copy>p{word-break:normal;overflow-wrap:anywhere}body[data-lang="th"] .story-copy>p,body[data-lang="km"] .story-copy>p,body[data-lang="hi"] .story-copy>p{line-height:1.82;overflow-wrap:anywhere}body[data-lang="zh"] .story-copy h2,body[data-lang="ja"] .story-copy h2{line-height:1.12;word-break:normal;overflow-wrap:anywhere}body[data-lang="th"] .story-copy h2,body[data-lang="km"] .story-copy h2,body[data-lang="hi"] .story-copy h2{font-size:clamp(34px,3.9vw,62px);line-height:1.18;letter-spacing:-.035em}
body[data-lang="zh"] .hero h1,body[data-lang="ja"] .hero h1{font-size:clamp(48px,7.2vw,112px);line-height:1.06;letter-spacing:-.045em}body[data-lang="th"] .hero h1,body[data-lang="km"] .hero h1,body[data-lang="hi"] .hero h1{font-size:clamp(42px,6.4vw,98px);line-height:1.12;letter-spacing:-.035em}.hero-copy{padding-inline:clamp(12px,3vw,52px)}.hero-body{overflow-wrap:anywhere}
.ending{--end-fade:0}.ending-frame{border:1px solid rgba(98,239,208,calc(.24 * (1 - var(--end-fade))))}.ending-mask{z-index:1;background:rgba(0,0,0,var(--end-fade));pointer-events:none}.ending-content{z-index:3;opacity:1!important}
.demo-pointer{width:22px;height:28px;border:0;border-radius:0;background:none;box-shadow:none}.demo-pointer:before{content:"";position:absolute;inset:0;background:var(--mint);clip-path:polygon(0 0,0 88%,24% 65%,39% 100%,54% 93%,39% 59%,72% 58%);filter:drop-shadow(0 0 1px #fff) drop-shadow(0 2px 5px #000)}.demo-pointer:after{content:"";position:absolute;left:-9px;top:-9px;width:36px;height:36px;border:2px solid var(--mint);border-radius:50%;opacity:0}.demo-pointer.click{animation:demoPointerClick .34s ease}.demo-pointer.click:after{animation:demoPointerRing .45s ease}@keyframes demoPointerClick{50%{transform:scale(.72)}}@keyframes demoPointerRing{0%{opacity:.9;transform:scale(.25)}100%{opacity:0;transform:scale(1.35)}}
body:not([data-lang="en"]) .hero-line{white-space:normal}body[data-lang="ko"] .hero h1{font-size:clamp(38px,5.5vw,88px);line-height:1.15;letter-spacing:-.045em;max-width:1180px;margin-left:auto;margin-right:auto}body[data-lang="ko"] .hero-copy{width:min(94vw,1280px);padding-inline:clamp(24px,5vw,80px)}body[data-lang="ko"] .hero-line+ .hero-line{margin-top:.12em}
@media(max-width:900px){.story-content{gap:14px;padding:36px 14px 15px}.screen-shell.mobile{width:min(64vw,310px);height:min(49svh,520px)}.screen-shell.desktop{height:min(44svh,460px)}.story-copy{width:min(94%,680px)}.scene-kicker{margin-bottom:7px!important}.story-copy h2{margin-bottom:9px;font-size:clamp(30px,7.8vw,47px);line-height:1.08}.story-copy>p:not(.scene-kicker){font-size:13.5px;line-height:1.5}.story-points{gap:4px;margin-top:9px}}
@media(max-width:560px){.story-content{padding:32px 12px 13px}.screen-shell.mobile{width:min(68vw,290px);height:min(46svh,490px)}.story-copy h2{font-size:clamp(27px,7.5vw,39px)}.story-copy>p:not(.scene-kicker){font-size:12.5px;line-height:1.45}.scene-kicker{font-size:10px!important}.story-points li{font-size:11.5px}}

/* Precise guided demo and mobile-first presentation */
.demo-pointer.show:after{animation:demoAmbientPulse 1.65s ease-out infinite}.demo-pointer.click:after{animation:demoPointerRing .62s ease-out}.demo-pointer.wheel-down{animation:demoWheelDown 1s ease-in-out}.demo-pointer.wheel-up{animation:demoWheelUp 1s ease-in-out}@keyframes demoAmbientPulse{0%{opacity:.4;transform:scale(.45)}75%,100%{opacity:0;transform:scale(1.25)}}@keyframes demoWheelDown{35%{transform:translateY(15px)}70%{transform:translateY(-3px)}}@keyframes demoWheelUp{35%{transform:translateY(-15px)}70%{transform:translateY(3px)}}.story-points li{transition:color .3s ease,transform .3s ease,opacity .3s ease}.story-points li.demo-active{color:var(--mint);transform:translateX(5px)}
@media(max-width:900px){.story-content{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:26px;padding:82px 11px 24px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain}.screen-shell.mobile{order:1;flex:0 0 auto;width:min(90vw,390px);height:min(69svh,690px);max-width:calc(100% - 4px);margin:0 auto}.screen-shell.desktop{order:1;flex:0 0 auto;width:min(92vw,760px);height:min(56svh,520px);max-width:calc(100% - 4px);margin:0 auto}.story-copy{order:2;align-self:stretch;width:min(92vw,680px);max-width:none;margin:0 auto;padding:4px 8px 72px;text-align:left}.story-copy h2,.story-copy p,.scene-kicker{text-align:left}.story-copy>p:not(.scene-kicker){max-width:none;font-size:15px;line-height:1.65}.story-points{justify-items:start;margin-top:17px}.story-points li{font-size:13px;line-height:1.55}.section-status{justify-content:center}.section-status b{max-width:48vw;white-space:normal;text-align:center;line-height:1.25}}
@media(max-width:560px){.story-content{gap:22px;padding-top:76px}.screen-shell.mobile{width:min(90vw,370px);height:min(67svh,650px)}.story-copy{width:92vw;padding-inline:4px}.story-copy h2{font-size:clamp(30px,9vw,42px)}.story-copy>p:not(.scene-kicker){font-size:14px;line-height:1.62}.story-points li{font-size:12.5px}}

/* Active Friends section title in the fixed header */
#header-title,#header-title .type-char,.section-status b,.section-status b .type-char{color:var(--mint)!important}

/* Keep desktop demonstrations inside their own grid column. */
@media(min-width:901px){
  .story-content{grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr)}
  .screen-shell.desktop{width:100%;max-width:100%;min-width:0;height:min(57svh,540px);margin:0}
  .story-copy{width:100%;min-width:0;margin:0;position:relative;z-index:2}
}

/* Fast demo warm-up: never expose an empty device frame. */
.screen-shell .demo-loader{position:absolute;z-index:2;inset:8px;display:flex;align-items:center;justify-content:center;gap:10px;border-radius:inherit;background:#050507;color:#fff;transition:opacity .22s ease,visibility .22s ease}
.screen-shell .demo-loader img{width:32px;height:32px;object-fit:contain}
.screen-shell .demo-loader b{font-size:15px;letter-spacing:-.02em}
.screen-shell iframe{position:relative;z-index:3;opacity:0;transition:opacity .22s ease}
.screen-shell.demo-ready iframe{opacity:1}
.screen-shell.demo-ready .demo-loader{opacity:0;visibility:hidden}

/* Mobile: keep the complete demo device visible and let vertical gestures change sections. */
@media(max-width:900px){
  body.entered.mobile-logo-waiting #logo-button{opacity:0!important;visibility:hidden!important}
  .story-content{overscroll-behavior-y:auto;touch-action:pan-y;padding-top:74px}
  .screen-shell iframe{pointer-events:none}
  .screen-shell.mobile{width:auto;height:min(64svh,600px);max-width:88vw;aspect-ratio:39/72}
  .screen-shell.desktop{width:min(92vw,760px);height:auto;max-height:58svh;aspect-ratio:16/10}
}
@media(max-width:560px){
  .story-content{padding-top:70px}
  .screen-shell.mobile{height:min(62svh,560px);max-width:88vw}
  .screen-shell.desktop{width:90vw;max-height:55svh}
}

/* Final mobile full-device presentation: show the whole demo before its copy. */
@media(max-width:900px){
  #site-header{z-index:9000;grid-template-columns:minmax(104px,1fr) minmax(0,1.25fr) 44px;right:9px;padding-inline:14px;background:rgba(0,0,0,.94)}
  #site-header .brand{position:relative;z-index:2;display:flex!important;min-width:104px;opacity:1!important;visibility:visible!important;white-space:nowrap}
  #site-header .brand img{display:block!important;flex:0 0 29px;width:29px;height:29px;opacity:1}
  #site-header .brand b{display:block!important;color:#fff;font-size:13px}
  #site-header .section-status{min-width:0;overflow:hidden}
  #site-header .section-status b{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .story{--frame-w:100vw;padding-top:0}
  .story-stage{width:100vw;height:100svh;border-width:0;border-radius:0}
  .story-content{gap:26px;padding:74px 12px 20px}
  .screen-shell.mobile{width:min(88vw,50svh,390px);height:auto;max-width:none;max-height:none;aspect-ratio:39/68;padding:7px;border-radius:clamp(30px,9vw,42px)}
  .screen-shell.mobile iframe{display:block;width:100%;height:100%;border-radius:calc(clamp(30px,9vw,42px) - 7px)}
  .story-copy{padding-bottom:86px}
}
@media(max-width:560px){
  #site-header{grid-template-columns:minmax(96px,1fr) minmax(0,1fr) 42px;padding-inline:11px}
  #site-header .brand{min-width:96px;gap:7px}
  #site-header .brand img{flex-basis:27px;width:27px;height:27px}
  #site-header .brand b{font-size:12.5px}
  .story-content{padding:70px 10px 18px}
  .screen-shell.mobile{width:min(90vw,50svh,380px);height:auto;max-width:none;max-height:none}
}
