/* Reference geometry uses 1024px as the design width. UI stays live HTML. */
.desktop-nav{flex:0 0 calc(384 * var(--u));margin-left:calc(53 * var(--u));gap:0}
.nav-row{gap:calc(15 * var(--u))}.future{margin-left:auto}
.brand strong{font-size:calc(18 * var(--u));letter-spacing:-.7px}
.sky-landscape{height:calc(500 * var(--u));background-image:url('assets/delivery-20260921/hero-sky.webp');background-position:center top;background-size:100% auto}
.sky-world:before{inset:calc(370 * var(--u)) 0 0;background:url('assets/depth-v2.webp') center top/100% auto no-repeat;opacity:.92;mask-image:linear-gradient(transparent,#000 18%,#000 85%,transparent)}
.sky-world:after{inset:calc(660 * var(--u)) 0 0;background:linear-gradient(transparent,#e7f3ff)}
.hero:before{background:linear-gradient(90deg,#d7efff22,transparent 36%)}
.hero-character{left:29.9%;top:30%;width:58.6%}
.hero-character>img:first-child{width:100%;filter:saturate(.82) brightness(1.02)}
.platform-name{position:absolute;left:44%;top:82%;z-index:3;color:#478ccc;font-weight:900;font-size:calc(18 * var(--u));white-space:nowrap;transform:rotate(-15deg) skewY(-3deg);letter-spacing:-.7px;opacity:.8}
.whale{left:25.4%;top:19%;width:28.5%}
.train-group{left:62%;top:52.5%;width:33.5%;z-index:2}
.station-tracks{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.train-name{position:absolute;left:73%;top:66%;width:21%;font-size:calc(9 * var(--u));font-weight:850;letter-spacing:.2px;color:#236aac;text-align:center;transform:rotate(4deg)}
.station-sign{position:absolute;z-index:3;right:1.6%;top:44%;padding:calc(7 * var(--u)) calc(6 * var(--u));background:#174b8d;color:white;border:calc(3 * var(--u)) solid #bcd4ed;box-shadow:2px 2px 0 #ebd1ad;font-size:calc(12 * var(--u));line-height:1.1;font-weight:750;transform:rotate(-11deg);text-align:center}
.station-sign small{display:block;font-size:calc(7 * var(--u));margin-top:3px}
.station-sign:after{content:"";position:absolute;top:100%;right:12%;width:5px;height:calc(90 * var(--u));background:linear-gradient(90deg,#778fa9,#d9e4ed);z-index:-1}
.floating-island{position:absolute;left:74%;top:7%;width:13%;z-index:0;pointer-events:none;filter:saturate(.75) brightness(1.08);opacity:.93}
.greeting{left:39.8%;top:72.5%;font-size:calc(16 * var(--u))}
.esports strong{font-size:calc(20 * var(--u));letter-spacing:calc(2 * var(--u))}
.esports img{filter:saturate(.72);border-radius:7px}
.hero h1{font-size:calc(53 * var(--u));line-height:.9;letter-spacing:calc(-2 * var(--u));transform:rotate(-10deg) skewX(-3deg);margin-top:calc(37 * var(--u))}
.hero h1 span:last-of-type{display:inline-block;transform:scaleX(.96);transform-origin:left center}
.hero h1 .title-heart{font-family:Arial,sans-serif;font-size:calc(22 * var(--u));left:calc(306 * var(--u));bottom:calc(9 * var(--u));transform:rotate(3deg);font-style:normal}
.hero-english{margin-top:calc(8 * var(--u));width:calc(237 * var(--u))}
.hero-release{margin-top:calc(17 * var(--u));margin-left:calc(5 * var(--u))}
.hero-release a{border-radius:calc(10 * var(--u))}
.near-cloud{opacity:.3;bottom:-44%}
.brand-bar{width:92.7%;padding-left:calc(20 * var(--u));background:#ffffffd1}
.feature{width:13.2%}.feature .orb{width:calc(44 * var(--u));height:calc(44 * var(--u));font-size:calc(20 * var(--u))}
.orb .icon{fill:url('#icon-blue');stroke:#e9f7ff;stroke-width:1.1;filter:drop-shadow(0 2px 1px #6eaaec40)}
.orb.gold .icon{fill:url('#icon-gold')}.orb.pink .icon{fill:url('#icon-pink')}
.orb{background:radial-gradient(circle at 35% 20%,#f2faff,#dcecff 70%,#d0e7ff);box-shadow:inset 0 1px 2px #fff9}
.brand-bar:after{display:none}.brand-island{position:absolute;left:58%;top:5%;width:14%;max-height:none;z-index:-1}
.bar-tagline{margin-right:5.5%;font-size:calc(22 * var(--u));transform:rotate(-12deg);font-weight:400}
.scene-card{height:calc(202 * var(--u));min-height:calc(202 * var(--u))}
.scene-copy{padding:calc(4 * var(--u)) calc(4 * var(--u)) calc(5 * var(--u))}
.scene-copy>span{max-width:9em;line-height:1.25;margin-top:calc(3 * var(--u))}
.stats-bar>div{width:20.5%;padding-inline:calc(4 * var(--u));gap:calc(12 * var(--u))}
.stats-bar strong{font-size:calc(16 * var(--u))}.stats-tagline{font-size:calc(19 * var(--u))}
.about-card{background:linear-gradient(105deg,#cce4ff,#abd0fa 60%,#def0ff)}
.values-card{padding:calc(14 * var(--u)) calc(12 * var(--u))}.values-card p{font-size:calc(10 * var(--u));letter-spacing:-.25px}.values-card .orb{width:calc(35 * var(--u));height:calc(35 * var(--u))}
.choices-section .section-head{position:relative;isolation:isolate}.choices-watermark{position:absolute;right:11%;bottom:-5px;z-index:-1;font:850 calc(34 * var(--u))/1 Arial,sans-serif;color:#cfe3f9;opacity:.35;pointer-events:none;white-space:nowrap}
.choices-section .section-head>.brush{font-size:calc(13 * var(--u));color:#3d80c2;font-weight:400}
.cosmic-copy h2{font-weight:400;transform:rotate(-10deg);font-size:calc(32 * var(--u))}
.cosmic-copy>.brush{font-size:calc(23 * var(--u));transform:rotate(-10deg);text-shadow:0 1px 5px #12336f}
.cosmic-art{background-image:url('assets/cosmic-v2.webp');background-size:100% auto;background-position:center 47.5%}
.coming-thumb{background-image:linear-gradient(#76b5ff44,#d9eeff55),url('assets/delivery-20260921/hero-sky.webp');background-position:72% 30%;background-size:auto 170%}
.news-card:nth-child(2)>img{object-fit:cover;object-position:80% center}
.download-section{grid-template-columns:minmax(0,1fr) minmax(0,613px);min-height:211px;max-height:none}
.download-picture{display:flex;align-items:center;justify-content:flex-end;background:#e6f2ff}
.download-picture img{width:100%;max-width:613px;height:auto;object-fit:contain;mask-image:linear-gradient(90deg,transparent 0%,transparent 32%,#000 43%);clip-path:inset(5% 0 10% 0)}
.download-picture:after{display:none}
.download-info{padding-block:calc(16 * var(--u));background:linear-gradient(90deg,#f0f8ff,#e6f2ff)}
@media(min-width:701px) and (max-width:850px){.desktop-nav{flex-basis:calc(380 * var(--u));margin-left:calc(14 * var(--u))}.desktop-nav a,.future{font-size:10px}.nav-row{gap:calc(12 * var(--u))}.brand strong{font-size:13px}.values-card p{font-size:10px}.values-card strong{font-size:11px}.about-description{font-size:10px}.choice-grid p{font-size:10px;line-height:1.35}.news-card small,.news-card em{font-size:9px}.news-card strong{font-size:11px}}
@media(min-width:701px) and (max-width:900px){.download-section{grid-template-columns:.9fr 1.5fr}.download-info h2{font-size:24px}.download-info p{font-size:11px}.download-actions button{font-size:10px}.download-info{padding:18px}}
@media(min-width:701px) and (max-width:850px){.news-section{height:auto;padding-block:12px}.news-card{height:92px}}
@media(min-width:701px) and (max-width:800px){.scene-card{height:228px;min-height:228px}}
@media(max-width:700px){
 .brand strong{font-size:14px}.hero{height:565px}.hero-content{padding-top:81px}
 .sky-landscape{height:640px;background-size:auto 100%;background-position:50% top}
 .sky-world:before{top:500px;background-size:auto 520px}
 .hero:before{background:linear-gradient(180deg,transparent,#e8f5ffc9 21%,#e8f5ffbf 46%,transparent 61%)}
 .hero-character{left:0;top:auto;bottom:-2%;width:118%;max-width:none}
 .platform-name{font-size:14px;top:83%;left:44%}
 .whale{left:58%;top:13%;width:42%}.floating-island{left:80%;top:7%;width:18%}
 .train-group{left:59%;top:61%;width:40%}.train-name{font-size:6px}
 .station-sign{display:none}.greeting{left:13%;top:66%;font-size:15px}
 .hero h1{font-size:43px;letter-spacing:-2px;margin-top:26px;line-height:1.05}
 .hero h1 .title-heart{left:238px;bottom:7px;font-size:18px}.hero-english{margin-top:10px;width:180px}
 .hero-release{margin-left:0;margin-top:14px}.esports strong{font-size:18px;letter-spacing:2px}
 .near-cloud{bottom:-12%;opacity:.2}.brand-bar{width:calc(100% - 28px);padding-left:0}
 .scene-card{height:224px;min-height:224px}.scene-copy{padding:6px 4px}.scene-copy>span{font-size:11px;line-height:1.3;margin-top:4px}
 .feature{width:25%}.feature .orb{width:34px;height:34px;font-size:17px}.brand-island{display:none}
 .stats-bar>div{width:auto;gap:7px;padding:0}.stats-bar strong{font-size:12px}
 .values-card{padding:12px 8px}.values-card p{font-size:10px}.values-card .orb{width:30px;height:30px}
 .choices-watermark{display:none}.cosmic-copy h2{font-size:25px}.cosmic-copy>.brush{font-size:15px}
 .cosmic-art{background-size:auto 230%;background-position:57% 47.5%}
 .download-picture{aspect-ratio:2.9;width:100%;background:#e6f2ff}.download-picture img{mask-image:linear-gradient(90deg,transparent 0%,transparent 30%,#000 43%)}
 .download-info{padding:15px 19px}.download-section{min-height:0}
}
@media(max-width:360px){.hero h1{font-size:39px}.hero h1 .title-heart{left:215px}.hero-character{bottom:0}.train-group{top:66%}}