/* DHC — a cinematic project, from the first direction to the site going live. */
.mj-art{container-type:inline-size;isolation:isolate;--mj-play:paused;--mj-ink:#f3f2fc;--mj-muted:#aaa8c0;perspective:1500px;perspective-origin:50% 44%;overflow:visible}
.mt-method[data-motion="playing"][data-visible="true"] .mj-art{--mj-play:running}
.mj-art *{box-sizing:border-box}.mj-art svg{fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.mj-environment{position:absolute;inset:-5% -7% 0;pointer-events:none;overflow:hidden;opacity:.88}.mj-aura-light{position:absolute;inset:0;background:radial-gradient(ellipse at 58% 42%,#405cff23,transparent 55%),radial-gradient(ellipse at 85% 28%,#ae88ff17,transparent 40%)}.mj-floor{position:absolute;left:8%;right:0;top:58%;height:45%;background:radial-gradient(ellipse at center,#6887ff25,transparent 63%),repeating-linear-gradient(90deg,transparent 0 59px,#8c9eff08 60px 61px),repeating-linear-gradient(0deg,transparent 0 39px,#8c9eff08 40px 41px);transform:perspective(450px) rotateX(58deg);mask-image:radial-gradient(ellipse,#000 20%,transparent 72%);border-radius:50%}.mj-horizon{position:absolute;left:10%;right:0;top:75%;height:1px;background:linear-gradient(90deg,transparent,#6076c84d,transparent);filter:blur(.4px)}.mj-beam{position:absolute;height:77%;width:8%;top:-3%;background:linear-gradient(#6c88ff08,#697eff25,transparent);filter:blur(14px);transform:rotate(25deg);transform-origin:top;opacity:.6}.mj-beam--one{left:55%}.mj-beam--two{left:79%;width:4%;transform:rotate(-21deg);background:linear-gradient(#ae9aff08,#ae9aff25,transparent)}
.mj-scene{position:absolute;inset:0;opacity:0;visibility:hidden;pointer-events:none;transform-style:preserve-3d}.mj-scene--brief{opacity:1;visibility:visible}.mt-method[data-phase] .mj-scene{opacity:0;visibility:hidden}.mt-method[data-phase="0"] .mj-scene--brief,.mt-method[data-phase="1"] .mj-scene--design,.mt-method[data-phase="2"] .mj-scene--build,.mt-method[data-phase="3"] .mj-scene--launch{opacity:1;visibility:visible}
.mj-camera{position:absolute;inset:0;transform-style:preserve-3d;transform:translate3d(calc(var(--mt-pointer-x,0)*8px),calc(var(--mt-pointer-y,0)*6px + var(--mt-stage-p,0)*-9px),0) rotateX(calc(3deg + var(--mt-pointer-y,0)*-2deg + var(--mt-stage-p,0)*2deg)) rotateY(calc(-5deg + var(--mt-pointer-x,0)*4deg + var(--mt-stage-p,0)*5deg));transition:transform .3s ease-out}
.mj-glass{background:linear-gradient(135deg,#354a7299,#161d2be8 48%,#25243cdb);border:1px solid #b8cfff52;box-shadow:inset 0 1px #eff6ff4f,inset 1px 0 #a3bdff1c,inset 0 -1px #364f8f30,0 18px 35px #0008,0 0 28px #6683ff09;backdrop-filter:blur(18px);border-radius:14px;color:var(--mj-ink)}
.mj-scene-note{position:absolute;bottom:5.6%;left:0;right:0;text-align:center;font:400 clamp(8px,1.35cqw,12px)/1.6 var(--f-sans);color:#9a9fb3;letter-spacing:.005em}.mj-scene-note b{font-weight:500;color:#d6d9e9}.mj-concept{position:absolute;bottom:1.5%;left:0;right:0;text-align:center;color:#697085;font:400 clamp(6px,.95cqw,8px)/1.5 var(--f-mono);letter-spacing:.08em;text-transform:uppercase}
.mj-connect{position:absolute;inset:0;width:100%;height:100%;color:#b0c1ff48;transform:translateZ(35px)}.mj-connect>path{stroke-width:1;vector-effect:non-scaling-stroke}.mj-pulse-line{stroke:#d6e2ff!important;stroke-width:1.5!important;stroke-dasharray:8 100;stroke-dashoffset:0;animation:mj-flow 5s linear infinite;animation-play-state:var(--mj-play);filter:drop-shadow(0 0 4px #7f9eff)}
@keyframes mj-flow{to{stroke-dashoffset:-216}}
@keyframes mj-float{50%{translate:0 -9px}}
/* 01: the loose priorities become a tangible, dimensional brief. */
.mj-brief{position:absolute;left:25%;top:9%;width:56%;height:71%;padding:4.5% 4.5% 3.7%;transform:translateZ(40px) rotateY(-11deg) rotateX(8deg) rotateZ(-8deg);transform-style:preserve-3d;border-radius:18px;background:linear-gradient(140deg,#394e77bd,#172335ed 50%,#22273de8);box-shadow:inset 0 1px #e7f3ff6b,inset 0 0 30px #96bcff05,0 35px 55px #0009,-10px 12px 0 -5px #17263a,0 0 80px #527fff13}
.mj-brief-back{position:absolute;left:25%;top:9%;width:56%;height:71%;background:linear-gradient(135deg,#5474ad44,#16203399);border:1px solid #8399c755;border-radius:18px;transform:translate3d(-29px,15px,-45px) rotateY(-11deg) rotateX(8deg) rotateZ(-8deg);box-shadow:0 20px 40px #0006}.mj-brief-edge{position:absolute;right:-10%;top:48%;color:#a4b4dd;font:400 clamp(5px,1cqw,9px)/1 var(--f-mono);letter-spacing:.17em;transform:rotate(90deg);opacity:.7}
.mj-sheet-meta{display:flex;align-items:center;justify-content:space-between;color:#aebddb;font:400 clamp(6px,1.15cqw,10px)/1 var(--f-mono);letter-spacing:.11em}.mj-sheet-meta i{width:5px;height:5px;border-radius:50%;background:#9ec5ff;box-shadow:0 0 17px #5da0ff}
.mj-sheet-title{display:block;font:500 clamp(32px,7.5cqw,66px)/.9 var(--f-sans);letter-spacing:-.065em;margin:10% 0 9%;color:#f5f7ff}.mj-sheet-title em{font-family:var(--f-serif);font-weight:400;color:#b7c8f2;letter-spacing:0}.mj-brief-row{display:flex;align-items:center;gap:6%;padding:5% 0;border-top:1px solid #b7caff26;animation:mj-brief-highlight 9s ease-in-out infinite;animation-play-state:var(--mj-play)}.mj-brief-row>span{font:400 clamp(6px,1.4cqw,12px)/1 var(--f-mono);color:#7385a5}.mj-brief-row>div{flex:1}.mj-brief-row small{display:block;font:400 clamp(5px,1.05cqw,9px)/1.3 var(--f-mono);letter-spacing:.1em;color:#899cbf}.mj-brief-row b{display:block;font:500 clamp(8px,1.65cqw,14px)/1.6 var(--f-sans);margin-top:2px;letter-spacing:-.015em}.mj-brief-row>svg{width:clamp(10px,2cqw,17px);height:17px;color:#b3d2ff}.mj-brief-row--two{animation-delay:-6s}.mj-brief-row--three{animation-delay:-3s}.mj-sheet-foot{display:flex;gap:5%;justify-content:space-between;margin-top:7%;font:400 clamp(5px,.95cqw,8px)/1.4 var(--f-mono);color:#788eaf;letter-spacing:.08em}
.mj-target{position:absolute;left:3%;top:3%;width:47%;aspect-ratio:1;transform:translateZ(-90px) rotateY(22deg) rotateX(8deg) rotateZ(-9deg);color:#759fff38}.mj-target svg{width:100%;height:100%;stroke-width:1}.mj-target circle:nth-child(2){stroke-dasharray:2 7;stroke:#769cfa66}.mj-target circle:nth-child(3){fill:#3872ff0a;stroke:#90b5ff77}.mj-target-aim{stroke:#acccff;stroke-width:3;filter:drop-shadow(0 0 6px #629aff);animation:mj-aim 7s ease-in-out infinite;animation-play-state:var(--mj-play)}.mj-target>span{position:absolute;left:20%;bottom:1%;font:400 clamp(6px,1.1cqw,10px)/1 var(--f-mono);letter-spacing:.18em;color:#5c759f}
.mj-chip{position:absolute;display:flex;align-items:center;gap:clamp(7px,1.6cqw,14px);padding:2.3% 2.8%;white-space:nowrap;border-radius:12px;animation:mj-float 7s ease-in-out infinite;animation-play-state:var(--mj-play);z-index:5}.mj-chip>svg{width:clamp(19px,3.8cqw,33px);height:clamp(19px,3.8cqw,33px);flex:none;color:#bdd7ff}.mj-chip small{display:block;font:400 clamp(5px,.8cqw,7px)/1.5 var(--f-mono);letter-spacing:.12em;color:#88a1ca;margin-bottom:4px}.mj-chip span{font:500 clamp(8px,1.6cqw,14px)/1.4 var(--f-sans)}.mj-chip--goal{left:4%;top:34%;transform:translateZ(135px) rotateY(8deg) rotateZ(-8deg)}.mj-chip--people{right:1%;top:6%;transform:translateZ(95px) rotateY(-12deg) rotateZ(8deg);animation-delay:-2s}.mj-chip--scope{right:1%;bottom:17%;transform:translateZ(145px) rotateY(-8deg) rotateZ(5deg);animation-delay:-4s}
@keyframes mj-brief-highlight{0%,28%,100%{background:#7fa9ff00}8%,19%{background:#80acff14}}@keyframes mj-aim{0%,100%{translate:7px -7px;opacity:.5}45%,65%{translate:0 0;opacity:1}}
/* The same AURA example appears in every scene. Its composition remains legible. */
.mj-browser{position:absolute;background:#17202b;border:1px solid #b3cfff9e;border-radius:12px;box-shadow:inset 0 1px #f4f8ff73,0 30px 60px #0009,4px 7px 0 #445a8180,7px 10px 0 #101724,0 0 55px #5e8dff17;overflow:hidden;transform-style:preserve-3d;z-index:3}.mj-chrome{height:10%;min-height:20px;display:flex;align-items:center;gap:5px;padding:0 3%;background:linear-gradient(110deg,#37445a,#1b2433);border-bottom:1px solid #daeaff27}.mj-chrome>i{width:4px;height:4px;border-radius:50%;background:#a8b9d177}.mj-chrome>i:first-child{background:#d2c3d4aa}.mj-chrome>span{margin:auto;font:400 clamp(5px,.85cqw,8px)/1 var(--f-mono);letter-spacing:.12em;color:#a2b0c7}.mj-chrome>svg{width:9px;height:9px;color:#788ba7}.mj-web{position:absolute;left:0;right:0;top:10%;height:90%;overflow:hidden;background:#eeeade}.mj-site-nav{position:absolute;left:5%;right:5%;top:7%;height:10%;display:flex;align-items:center;justify-content:space-between;z-index:3;color:#252b22}.mj-site-nav b{font:500 clamp(10px,2.4cqw,21px)/1 var(--f-sans);letter-spacing:.08em}.mj-site-nav>span{font:400 clamp(4px,.75cqw,7px)/1 var(--f-sans);margin-left:auto;margin-right:7%}.mj-site-nav>i{width:13px;height:5px;border-top:1px solid;border-bottom:1px solid}.mj-site-copy{position:absolute;left:5%;top:29%;width:47%;height:65%;z-index:3;color:#242c24}.mj-site-copy small{font:500 clamp(4px,.7cqw,6px)/1 var(--f-mono);letter-spacing:.09em}.mj-site-copy strong{display:block;margin:10% 0 7%;font:500 clamp(21px,5.55cqw,48px)/.91 var(--f-sans);letter-spacing:-.07em}.mj-site-copy strong em{font-family:var(--f-serif);font-weight:400;letter-spacing:-.035em;color:#737e5b}.mj-site-copy p{font:400 clamp(4px,.85cqw,7px)/1.7 var(--f-sans);margin:0;color:#6c7164}.mj-site-copy>span{font:500 clamp(4px,.8cqw,7px)/1.5 var(--f-sans);display:flex;align-items:center;gap:12px;margin-top:11%;width:fit-content;border-bottom:1px solid #878c763d;padding-bottom:4%}.mj-site-copy>span svg{width:9px;height:9px}.mj-web>img{position:absolute;right:0;bottom:0;width:46%;height:82%;object-fit:cover;object-position:58% 50%}.mj-site-index{position:absolute;bottom:4%;right:4%;z-index:4;color:#fff;font:400 clamp(4px,.8cqw,7px)/1 var(--f-mono);text-shadow:0 1px 3px #000}
/* 02: an exploded model shows structure, composition and visual identity. */
.mj-design-window{width:75%;height:52%;left:13%;top:23%;transform:translateZ(75px) rotateY(-13deg) rotateX(9deg) rotateZ(-8deg)}
.mj-wire-plane{position:absolute;width:75%;height:52%;background:linear-gradient(140deg,#213a5555,#172a4240);border:1px solid #7ea8db77;border-radius:9px;box-shadow:0 0 25px #5086ff08;transform-style:preserve-3d}.mj-design-wire{left:5%;top:8%;transform:translateZ(-120px) rotateY(-13deg) rotateX(9deg) rotateZ(-8deg)}.mj-wire-cap{position:absolute;left:4%;right:4%;top:5%;display:flex;justify-content:space-between;font:400 clamp(5px,1cqw,8px)/1 var(--f-mono);letter-spacing:.14em;color:#a6ccff}.mj-wire-cap i{width:5px;height:5px;border-radius:50%;background:#a6ccff}.mj-wire-plane>div:not(.mj-wire-cap),.mj-web--wire>div{position:absolute;border:1px solid #9cbefa73;background:repeating-linear-gradient(135deg,#b8d4ff04 0 4px,transparent 4px 8px);border-radius:2px}.mj-wire-nav{left:5%;right:5%;top:14%;height:7%}.mj-wire-title{left:5%;width:36%;top:35%;height:24%}.mj-wire-text{left:5%;width:30%;top:65%;height:6%}.mj-wire-image{right:3%;top:26%;bottom:4%;width:46%}.mj-wire-image svg{width:100%;height:100%;opacity:.3}.mj-wire-btn{left:5%;width:24%;top:82%;height:7%}.mj-plane-label{position:absolute;right:-18px;bottom:12%;font:400 clamp(5px,1cqw,8px)/1 var(--f-mono);letter-spacing:.12em;color:#9bb9ed;writing-mode:vertical-rl;transform:translateX(100%)}
.mj-grid-plane{position:absolute;left:9%;top:16%;width:75%;height:52%;border:1px solid #96b5f055;border-radius:10px;background:repeating-linear-gradient(90deg,transparent 0 7.8%,#9bbdff19 8% 8.2%);transform:translateZ(-25px) rotateY(-13deg) rotateX(9deg) rotateZ(-8deg)}.mj-grid-plane>span{position:absolute;left:4%;top:5%;color:#94b5eb77;font:400 clamp(5px,.9cqw,8px)/1 var(--f-mono);letter-spacing:.15em}.mj-design-link{position:absolute;left:12%;top:14%;width:1px;height:26%;background:linear-gradient(#91b7ff00,#91b7ff85,#91b7ff00);transform:rotate(-29deg) translateZ(15px)}.mj-design-link--two{left:78%;top:5%}
.mj-web--wire{background:#172439;padding:6%}.mj-design-reveal{clip-path:inset(0);animation:mj-reveal 11s cubic-bezier(.45,0,.25,1) infinite;animation-play-state:var(--mj-play)}.mj-reveal-scan{position:absolute;left:100%;top:10%;bottom:0;width:1px;background:#f2f5ff;box-shadow:0 0 14px 2px #91aaffaa;z-index:4;animation:mj-scan 11s cubic-bezier(.45,0,.25,1) infinite;animation-play-state:var(--mj-play)}.mj-reveal-cursor{position:absolute;top:64%;left:95%;z-index:5;animation:mj-cursor 11s cubic-bezier(.45,0,.25,1) infinite;animation-play-state:var(--mj-play);color:#f4f0ff;filter:drop-shadow(1px 3px 3px #171329bb)}.mj-reveal-cursor svg{width:23px;height:23px;fill:#aabaff;stroke-width:1.3}
.mj-palette{position:absolute;left:2%;bottom:11%;width:38%;padding:3%;transform:translateZ(160px) rotateY(10deg) rotateZ(-10deg);z-index:5;animation:mj-float 8s ease-in-out infinite;animation-play-state:var(--mj-play)}.mj-palette small,.mj-type small{display:block;font:400 clamp(5px,1cqw,9px)/1.3 var(--f-mono);letter-spacing:.08em;color:#9caed0}.mj-palette>div{display:flex;margin:8% 0 6%;height:clamp(22px,4.5cqw,39px);gap:3px}.mj-palette i{flex:1;background:#eee9dc;border-radius:3px;box-shadow:inset 0 1px #fff9,0 4px 7px #0005}.mj-palette i:nth-child(2){background:#a2aa8d}.mj-palette i:nth-child(3){background:#565d4c}.mj-palette i:nth-child(4){background:#202820}.mj-palette>span{font:400 clamp(6px,1.25cqw,11px)/1.5 var(--f-sans);color:#c5d0e5}.mj-type{position:absolute;right:0;top:48%;width:22%;aspect-ratio:.95;padding:2%;transform:translateZ(145px) rotateY(-10deg) rotateZ(9deg);text-align:center;display:flex;align-items:center;flex-direction:column;justify-content:center;animation:mj-float 8s ease-in-out infinite;animation-delay:-4s;animation-play-state:var(--mj-play);z-index:5}.mj-type>span{font:400 clamp(35px,10.5cqw,91px)/1 var(--f-serif);color:#dee8ff;margin-bottom:8%;text-shadow:1px 2px 1px #b3c8ff22,0 9px 20px #0007}.mj-type i{font:400 clamp(5px,.8cqw,7px)/1.4 var(--f-sans);color:#7b90b3;margin-top:8%}.mj-art-tag{position:absolute;top:5%;right:1%;display:flex;gap:8px;align-items:center;font:400 clamp(5px,.9cqw,8px)/1.4 var(--f-mono);letter-spacing:.09em;color:#8aa4d0;transform:translateZ(55px)}.mj-art-tag>i{width:4px;height:4px;background:#b7ceff;border-radius:50%;box-shadow:0 0 10px #7aa9ff}
@keyframes mj-reveal{0%,9%{clip-path:inset(0 100% 0 0)}42%,95%{clip-path:inset(0)}100%{clip-path:inset(0 100% 0 0)}}@keyframes mj-scan{0%,9%,100%{left:0;opacity:0}10%,41%{opacity:1}42%,95%{left:100%;opacity:0}}@keyframes mj-cursor{0%,9%,100%{left:1%;opacity:0}15%,42%{opacity:1}42%,95%{left:95%;opacity:0}}
/* 03: assembled interfaces, a physical desktop and a phone in the foreground. */
.mj-build-window{left:5%;top:17%;width:79%;height:55%;transform:translateZ(15px) rotateY(-11deg) rotateX(5deg) rotateZ(-5deg)}.mj-build-chassis{position:absolute;left:5%;top:17%;width:79%;height:55%;border:1px solid #8fb6ff50;border-radius:15px;background:#172940;transform:translate3d(-15px,8px,-30px) rotateY(-11deg) rotateX(5deg) rotateZ(-5deg);box-shadow:8px 18px 35px #0009}.mj-build-chassis>span{position:absolute;left:7%;bottom:-20%;font:400 clamp(5px,.9cqw,8px)/1 var(--f-mono);letter-spacing:.2em;color:#577394}.mj-device-stand{position:absolute;left:35%;top:65%;width:23%;height:15%;background:linear-gradient(100deg,#0d1521,#536b8f 43%,#26394f 55%,#111c29);clip-path:polygon(28% 0,72% 0,80% 78%,100% 85%,100% 94%,0 94%,0 85%,20% 78%);transform:translateZ(-10px) rotateY(-11deg) rotateZ(-5deg);filter:drop-shadow(0 10px 15px #0008)}
.mj-piece{animation:mj-assemble 11s cubic-bezier(.22,.65,.1,1) infinite;animation-play-state:var(--mj-play)}.mj-piece--nav{--mj-from:translateY(-30px);animation-delay:0s}.mj-piece--copy{--mj-from:translateX(-50px);animation-delay:.32s}.mj-piece--image{--mj-from:translateY(65px);animation-delay:.64s}.mj-code{position:absolute;left:0;bottom:11%;width:39%;padding:3%;transform:translateZ(125px) rotateY(9deg) rotateZ(-8deg);z-index:6}.mj-code>div{display:flex;gap:7px;align-items:center;font:400 clamp(5px,.9cqw,8px)/1.5 var(--f-mono);color:#8aa9d8}.mj-code>div i{width:4px;height:4px;background:#9bc1ff;box-shadow:0 0 10px #629aff;border-radius:50%}.mj-code p{font:400 clamp(6px,1.3cqw,11px)/1.8 var(--f-mono);color:#d4deef;margin:10% 0 1%}.mj-code b{font-weight:400;color:#8da8ff}.mj-code-line{display:block;height:1px;width:80%;margin-top:8%;background:linear-gradient(90deg,#7ca8ff5e,transparent)}
.mj-phone{position:absolute;width:21%;height:52%;border:1px solid #d5e4ffcc;border-radius:clamp(15px,3cqw,26px);background:linear-gradient(110deg,#6a85a6,#0b1321 10%,#22334a 94%,#8da5c7);padding:1%;box-shadow:inset 0 0 0 3px #b4ccf51a,3px 4px 0 #192c44,0 25px 35px #000a,0 0 45px #85a9ff1c;z-index:10;overflow:hidden}.mj-phone--build{right:1%;top:29%;transform:translateZ(200px) rotateY(-19deg) rotateX(4deg) rotateZ(7deg);animation:mj-device-arrive 11s cubic-bezier(.2,.7,.1,1) infinite;animation-play-state:var(--mj-play)}.mj-phone-speaker{position:absolute;top:3%;left:34%;width:32%;height:3%;border-radius:9px;background:#101721;z-index:3}.mj-phone-content{position:relative;width:100%;height:100%;overflow:hidden;border-radius:clamp(11px,2.3cqw,20px);background:#eee9dd;color:#252a23;padding:20% 9% 7%}.mj-phone-content>b{font:500 clamp(7px,1.4cqw,12px)/1 var(--f-sans);letter-spacing:.07em}.mj-phone-content>strong{display:block;font:500 clamp(13px,2.75cqw,24px)/.96 var(--f-sans);letter-spacing:-.06em;margin:18% 0}.mj-phone-content em{font-family:var(--f-serif);color:#77815d;font-weight:400}.mj-phone-content>img{width:100%;height:43%;object-fit:cover;object-position:60% 50%;display:block}.mj-phone-content>span{display:flex;justify-content:space-between;align-items:center;font:500 clamp(4px,.7cqw,6px)/1.4 var(--f-sans);margin-top:14%;border-bottom:1px solid #737d5b6b;padding-bottom:8%}.mj-phone-content>span b{font-size:10px;font-weight:400}
.mj-checks{position:absolute;top:4%;left:20%;right:1%;padding:2% 3%;display:flex;justify-content:space-between;gap:2%;z-index:7;border-radius:30px;transform:translateZ(55px) rotateZ(-2deg)}.mj-checks span{display:flex;align-items:center;gap:6px;font:400 clamp(6px,1.3cqw,11px)/1 var(--f-sans);color:#d1def1}.mj-checks svg{width:13px;height:13px;color:#acccbe;stroke-width:1.6}.mj-responsive-link{position:absolute;right:8%;bottom:14%;width:35%;height:21%;transform:translateZ(45px);color:#9ac0ff55}.mj-responsive-link svg{width:100%;height:100%;overflow:visible}.mj-responsive-link span{position:absolute;left:0;bottom:2%;font:400 clamp(5px,.85cqw,7px)/1 var(--f-mono);letter-spacing:.15em;color:#7b9ccb}
@keyframes mj-assemble{0%,6%,100%{opacity:0;transform:var(--mj-from)}22%,94%{opacity:1;transform:none}}@keyframes mj-device-arrive{0%,10%,100%{translate:25px 24px;opacity:.4}30%,94%{translate:0 0;opacity:1}}
/* 04: a publication portal frames a real website, then splits into handover and evolution. */
.mj-launch-portal{position:absolute;left:24%;top:1%;width:60%;aspect-ratio:1;border:1px solid #8fafff5c;border-radius:50%;transform:translateZ(-110px) rotateY(-13deg) rotateX(6deg);box-shadow:inset 0 0 35px #4574ff10,0 0 30px #5c81ff0e;background:radial-gradient(ellipse,#4b78ff0b 30%,#5b89ff12 65%,transparent 68%)}.mj-launch-portal:before{content:"";position:absolute;inset:8%;border:1px solid #91adff20;border-radius:50%;box-shadow:0 0 30px #7296ff12}.mj-launch-portal>div{position:absolute;inset:-1px;border-radius:50%;border:2px solid transparent;border-top-color:#b4d6ffcc;border-right-color:#779eff66;filter:drop-shadow(0 0 8px #759fff77);animation:mj-launch-orbit 18s linear infinite;animation-play-state:var(--mj-play)}.mj-launch-portal>span{position:absolute;top:7%;left:0;right:0;text-align:center;font:400 clamp(5px,1cqw,8px)/1 var(--f-mono);color:#8bb0e7;letter-spacing:.2em}.mj-launch-window{left:10%;top:24%;width:73%;height:48%;transform:translateZ(55px) rotateY(-11deg) rotateX(8deg) rotateZ(-4deg);animation:mj-float 9s ease-in-out infinite;animation-play-state:var(--mj-play)}.mj-launch-trail{position:absolute;left:13%;top:19%;width:70%;height:47%;border:1px solid #83aeff4a;border-radius:10px;background:linear-gradient(140deg,#759fff0d,#14253b55);transform:translate3d(16px,-12px,-70px) rotateY(-11deg) rotateX(8deg) rotateZ(-4deg)}.mj-launch-trail--two{transform:translate3d(32px,-24px,-140px) rotateY(-11deg) rotateX(8deg) rotateZ(-4deg);opacity:.5}.mj-phone--launch{width:17%;height:43%;right:4%;top:37%;transform:translateZ(150px) rotateY(-19deg) rotateZ(7deg);animation:mj-float 9s ease-in-out infinite;animation-delay:-2s;animation-play-state:var(--mj-play)}.mj-phone--launch .mj-phone-content>strong{font-size:clamp(10px,2.2cqw,19px)}.mj-phone--launch .mj-phone-content>b{font-size:clamp(6px,1.1cqw,10px)}
.mj-publish{position:absolute;top:5%;left:15%;right:7%;display:flex;justify-content:center;align-items:center;gap:clamp(9px,2cqw,17px);color:#dce9ff;transform:translateZ(85px)}.mj-publish small{display:block;font:400 clamp(5px,.9cqw,8px)/1 var(--f-mono);letter-spacing:.14em;color:#83a8df;margin-bottom:7px}.mj-publish>div>span{font:500 clamp(9px,1.85cqw,16px)/1.3 var(--f-sans)}.mj-publish-icon{display:grid;place-items:center;width:clamp(37px,7cqw,60px);height:clamp(37px,7cqw,60px);border:1px solid #b5d6ff7a;border-radius:16px;background:linear-gradient(135deg,#6e9dff33,#283e6a36);box-shadow:inset 0 1px #e6f3ff66,0 10px 25px #3460ac22;position:relative;flex:none;transform:rotate(-6deg)}.mj-publish-icon:after{content:"";position:absolute;inset:-6px;border:1px solid #8bbaff66;border-radius:20px;animation:mj-publish-ring 3s ease-out infinite;animation-play-state:var(--mj-play)}.mj-publish-icon svg{width:48%;height:48%}.mj-publish>i{width:5px;height:5px;background:#b2d8c5;border-radius:50%;box-shadow:0 0 14px #8edeb9}
.mj-handover,.mj-evolve{position:absolute;top:76%;width:36%;height:13%;padding:2%;display:grid;grid-template-columns:clamp(19px,3.5cqw,30px) 1fr;grid-template-rows:auto auto;align-content:center;align-items:center;gap:5px 11px;z-index:8;border-radius:11px;animation:mj-float 8s ease-in-out infinite;animation-play-state:var(--mj-play)}.mj-handover{left:5%;transform:translateZ(125px) rotateY(7deg) rotateZ(-5deg)}.mj-evolve{right:4%;transform:translateZ(125px) rotateY(-8deg) rotateZ(5deg);animation-delay:-4s}.mj-handover>svg,.mj-evolve>svg{grid-row:1/3;width:100%;height:30px;color:#a8c8f6}.mj-handover>strong,.mj-evolve>strong{font:500 clamp(8px,1.5cqw,13px)/1.2 var(--f-sans)}.mj-handover>span,.mj-evolve>span{font:400 clamp(6px,1.05cqw,9px)/1.4 var(--f-sans);color:#93a7c8}.mj-scene--launch .mj-scene-note{bottom:4.2%}.mj-connect--launch{color:#9fc0fb55;transform:translateZ(10px)}
@keyframes mj-publish-ring{0%{opacity:.7;scale:.9}100%{opacity:0;scale:1.4}}@keyframes mj-launch-orbit{to{rotate:360deg}}
@media(min-width:1000px){.mj-brief,.mj-brief-back{height:74%}.mj-sheet-title{font-size:clamp(32px,6.8cqw,59px);margin:8% 0 7%}.mj-brief-row{padding:4% 0}.mj-sheet-foot{margin-top:5%}.mj-phone--build{right:4%}.mj-type{right:4%}}
/* No animation work in an inactive or off-screen chapter. */
.mt-method[data-phase="0"] .mj-scene:not(.mj-scene--brief) *,.mt-method[data-phase="1"] .mj-scene:not(.mj-scene--design) *,.mt-method[data-phase="2"] .mj-scene:not(.mj-scene--build) *,.mt-method[data-phase="3"] .mj-scene:not(.mj-scene--launch) *{animation-play-state:paused!important}.mt-method[data-phase="0"] .mj-scene:not(.mj-scene--brief) *:after,.mt-method[data-phase="1"] .mj-scene:not(.mj-scene--design) *:after,.mt-method[data-phase="2"] .mj-scene:not(.mj-scene--build) *:after,.mt-method[data-phase="3"] .mj-scene:not(.mj-scene--launch) *:after{animation-play-state:paused!important}
@media(max-width:999px){.mj-art{perspective:1000px}.mj-camera{inset:1% 2%;transform:translate3d(calc(var(--mt-pointer-x,0)*3px),calc(var(--mt-stage-p,0)*-5px),0) rotateX(3deg) rotateY(calc(-3deg + var(--mt-stage-p,0)*3deg))}.mj-brief{left:25%;width:56%;top:12%;height:66%;padding:5%;transform:translateZ(20px) rotateY(-8deg) rotateX(5deg) rotateZ(-7deg)}.mj-brief-back{top:12%;height:66%}.mj-sheet-title{font-size:clamp(31px,8cqw,55px);margin:11% 0 10%}.mj-brief-row{padding:5% 0}.mj-sheet-foot{margin-top:9%}.mj-chip{padding:2.5%;gap:6px;border-radius:9px}.mj-chip small{font-size:5px;letter-spacing:.04em;margin-bottom:2px}.mj-chip span{font-size:clamp(8px,1.7cqw,11px)}.mj-chip--goal{left:0;top:37%;transform:translateZ(60px) rotateZ(-8deg)}.mj-chip--people{right:0;top:8%;transform:translateZ(40px) rotateZ(8deg)}.mj-chip--scope{right:0;bottom:17%;transform:translateZ(70px) rotateZ(5deg)}.mj-design-window{left:10%;width:79%;top:25%;height:48%;transform:translateZ(30px) rotateY(-9deg) rotateX(6deg) rotateZ(-7deg)}.mj-design-wire{left:3%;top:12%;width:79%;height:48%;transform:translateZ(-70px) rotateY(-9deg) rotateX(6deg) rotateZ(-7deg)}.mj-grid-plane{left:7%;top:19%;width:79%;height:48%;transform:translateZ(-20px) rotateY(-9deg) rotateX(6deg) rotateZ(-7deg)}.mj-type{right:0;top:55%;width:24%;transform:translateZ(65px) rotateY(-8deg) rotateZ(7deg)}.mj-palette{left:0;bottom:12%;width:42%;transform:translateZ(65px) rotateY(6deg) rotateZ(-8deg)}.mj-type i{display:none}.mj-art-tag{top:7%;font-size:5px;right:5%}.mj-build-window{top:21%;width:83%;height:48%;left:1%;transform:translateZ(0) rotateY(-8deg) rotateX(3deg) rotateZ(-5deg)}.mj-build-chassis{top:21%;width:83%;height:48%;left:1%;transform:translate3d(-8px,5px,-20px) rotateY(-8deg) rotateX(3deg) rotateZ(-5deg)}.mj-device-stand{top:64%}.mj-phone--build{right:0;top:34%;width:23%;height:46%;transform:translateZ(90px) rotateY(-12deg) rotateZ(6deg)}.mj-code{left:0;bottom:13%;width:43%;transform:translateZ(60px) rotateY(6deg) rotateZ(-7deg)}.mj-checks{top:10%;left:12%;transform:translateZ(20px) rotateZ(-2deg);padding:3%}.mj-checks svg{width:9px;height:9px}.mj-checks span{gap:4px}.mj-responsive-link{bottom:17%}.mj-launch-window{left:4%;width:78%;top:28%;height:44%;transform:translateZ(20px) rotateY(-8deg) rotateX(5deg) rotateZ(-4deg)}.mj-launch-trail{top:24%;left:8%;height:44%}.mj-launch-portal{top:10%;left:22%;width:65%;transform:translateZ(-65px) rotateY(-9deg)}.mj-phone--launch{right:1%;top:39%;width:19%;height:39%;transform:translateZ(75px) rotateY(-12deg) rotateZ(6deg)}.mj-publish{top:8%;left:9%;right:0;transform:translateZ(40px)}.mj-publish small{margin-bottom:5px}.mj-publish-icon{border-radius:11px}.mj-publish-icon:after{border-radius:14px}.mj-handover,.mj-evolve{top:77%;height:12%;width:41%;gap:3px 7px;padding:2.5%;grid-template-columns:19px 1fr}.mj-handover{left:0;transform:translateZ(60px) rotateZ(-4deg)}.mj-evolve{right:0;transform:translateZ(60px) rotateZ(4deg)}.mj-handover>svg,.mj-evolve>svg{height:20px}.mj-handover>span,.mj-evolve>span{font-size:6px}.mj-scene-note{font-size:8px;bottom:5%}.mj-concept{font-size:6px;letter-spacing:.02em}.mj-scene--launch .mj-scene-note{bottom:4.5%}}
@media(max-width:480px){.mj-brief{height:65%;top:12%}.mj-sheet-title{font-size:8.8cqw}.mj-sheet-meta{font-size:5px;letter-spacing:.06em}.mj-brief-row b{font-size:7px}.mj-brief-row small{font-size:5px}.mj-brief-row{padding:6% 0}.mj-sheet-foot{font-size:4.5px;letter-spacing:.01em}.mj-brief-edge{display:none}.mj-chip--scope{bottom:18%}.mj-type>span{font-size:11cqw}.mj-palette>div{height:22px}.mj-palette>span{font-size:6px}.mj-site-copy strong{font-size:6cqw}.mj-site-copy small{font-size:3.5px;letter-spacing:.03em}.mj-site-copy p{font-size:4px}.mj-site-copy>span{font-size:4px;gap:5px}.mj-chrome{min-height:17px}.mj-chrome>span{font-size:4px;letter-spacing:.06em}.mj-chrome>i{width:3px;height:3px}.mj-site-nav>span{font-size:3.5px}.mj-site-nav>i{width:9px;height:4px}.mj-code p{font-size:6px}.mj-code>div{font-size:4px;gap:4px}.mj-phone-content>strong{font-size:3.4cqw}.mj-phone-content>b{font-size:7px}.mj-phone--launch .mj-phone-content>strong{font-size:2.9cqw}.mj-phone-content>span{font-size:3.5px}.mj-publish>div>span{font-size:9px}.mj-launch-portal>span{font-size:5px}.mj-scene-note{font-size:7px}}
/* Pausing on any frame still leaves a complete, useful visual, including when tabs change. */
html.motion-off .mj-art *,html.motion-off .mj-art *:after,.mt-method[data-motion="paused"] .mj-art *,.mt-method[data-motion="paused"] .mj-art *:after{animation-play-state:paused!important}.mt-method[data-motion="paused"] .mj-design-reveal,html.motion-off .mj-design-reveal{animation:none!important;clip-path:inset(0)}.mt-method[data-motion="paused"] .mj-piece,html.motion-off .mj-piece{animation:none!important;opacity:1;transform:none}.mt-method[data-motion="paused"] .mj-phone--build,html.motion-off .mj-phone--build{animation:none!important;opacity:1;translate:none}.mt-method[data-motion="paused"] .mj-reveal-cursor,.mt-method[data-motion="paused"] .mj-reveal-scan,html.motion-off .mj-reveal-cursor,html.motion-off .mj-reveal-scan{animation:none!important;opacity:0}
@media(prefers-reduced-motion:reduce){.mj-art *,.mj-art *:before,.mj-art *:after{animation:none!important;transition:none!important}.mj-camera{transform:rotateY(-3deg)}.mj-design-reveal{clip-path:inset(0)}.mj-piece{opacity:1;transform:none}.mj-phone--build{opacity:1;translate:none}.mj-reveal-cursor,.mj-reveal-scan{opacity:0}}
@media(forced-colors:active){.mj-glass,.mj-browser,.mj-phone,.mj-brief-back{border:1px solid CanvasText;box-shadow:none}.mj-connect{color:CanvasText}.mj-environment{display:none}}

/* Distinct chapters: a physical identity board, then publication and handover. */
.mj-id-board{position:absolute;left:12%;top:10%;width:77%;height:73%;border:1px solid #b9caff44;background:linear-gradient(140deg,#5b739520,#14213870);border-radius:15px;transform:translateZ(-75px) rotateZ(-4deg);box-shadow:0 25px 50px #0005}.mj-id-board>span{position:absolute;left:5%;top:4%;font:400 clamp(5px,1cqw,9px)/1.4 var(--f-mono);letter-spacing:.15em;color:#91a8ce}.mj-id-board>i{position:absolute;width:13px;height:13px;border-color:#b2c7f14d;border-style:solid}.mj-id-board>i:nth-of-type(1){top:4%;right:4%;border-width:1px 1px 0 0}.mj-id-board>i:nth-of-type(2){bottom:4%;right:4%;border-width:0 1px 1px 0}.mj-id-board>i:nth-of-type(3){bottom:4%;left:4%;border-width:0 0 1px 1px}.mj-id-board>i:nth-of-type(4){top:4%;left:4%;border-width:1px 0 0 1px;display:none}
.mj-id-poster{position:absolute;left:46%;top:12%;width:42%;height:62%;background:#e8e5d8;color:#30382b;padding:4%;border:1px solid #f7f5e59c;box-shadow:5px 7px #646a5844,0 25px 40px #0008;transform:translateZ(5px) rotateY(-7deg) rotateZ(7deg);overflow:hidden}.mj-id-poster>small{font:400 clamp(4px,.8cqw,7px)/1 var(--f-mono);letter-spacing:.07em}.mj-id-poster>strong{display:block;font:500 clamp(23px,5cqw,43px)/1.02 var(--f-sans);letter-spacing:-.055em;margin-top:9%}.mj-id-poster em{font-family:var(--f-serif);font-weight:400;color:#6d775d}.mj-id-poster>img{position:absolute;left:0;right:0;bottom:0;width:100%;height:51%;object-fit:cover;object-position:55% 50%}.mj-id-poster>span{position:absolute;bottom:5%;left:10%;color:#fff;font:500 clamp(11px,2.5cqw,22px)/1 var(--f-sans);letter-spacing:.18em;text-shadow:0 2px 12px #0009}
.mj-id-type{position:absolute;left:5%;top:22%;width:51%;height:41%;padding:3.5% 4%;background:linear-gradient(135deg,#e9e4d6,#cfd1b7);color:#2c3529;border:1px solid #fff9;box-shadow:6px 8px 0 #7f88736b,0 28px 45px #0008;transform:translateZ(115px) rotateY(8deg) rotateZ(-8deg);border-radius:3px}.mj-id-type>small{display:block;font:400 clamp(5px,.9cqw,8px)/1 var(--f-mono);letter-spacing:.14em;color:#65705c}.mj-id-type>strong{display:block;font:400 clamp(65px,16.5cqw,143px)/.9 var(--f-sans);letter-spacing:-.1em;margin:6% 0 4%;white-space:nowrap}.mj-id-type>strong>span{font-family:var(--f-serif);font-style:italic;letter-spacing:-.07em;color:#788362}.mj-id-type>div{font:500 clamp(8px,1.65cqw,14px)/1.4 var(--f-sans);letter-spacing:-.02em}.mj-id-type>div em{font-family:var(--f-serif);font-size:1.18em;color:#626e52}.mj-id-type>span{display:block;margin-top:5%;font:400 clamp(5px,1.05cqw,9px)/1.4 var(--f-sans);color:#6f7868}
.mj-id-mark{position:absolute;right:2%;top:6%;width:25%;aspect-ratio:1;padding:3%;border-radius:18px;transform:translateZ(145px) rotateY(-12deg) rotateZ(8deg);display:flex;align-items:center;flex-direction:column;justify-content:space-between;background:linear-gradient(135deg,#52678dba,#1a293dec);animation:mj-float 9s ease-in-out infinite;animation-play-state:var(--mj-play)}.mj-id-mark>small{font:400 clamp(4px,.8cqw,7px)/1 var(--f-mono);letter-spacing:.07em;color:#a8bfe5}.mj-id-mark>svg{width:66%;height:66%;color:#d3e2f9;stroke-width:5;filter:drop-shadow(3px 5px 0 #7494c34d) drop-shadow(0 4px 11px #b8d8ff33)}.mj-id-mark>span{font:500 clamp(7px,1.4cqw,12px)/1 var(--f-sans);letter-spacing:.25em;color:#c2d0e8}
.mj-id-swatches{position:absolute;left:18%;bottom:15%;width:68%;height:20%;transform:translateZ(150px) rotateX(8deg) rotateZ(-5deg)}.mj-id-swatches>small{font:400 clamp(5px,.9cqw,8px)/1 var(--f-mono);letter-spacing:.13em;color:#98add0}.mj-id-swatches>div{display:flex;gap:3%;height:75%;margin-top:3%;perspective:700px}.mj-id-swatches>div>span{flex:1;min-width:0;position:relative;transform:rotateY(-9deg);animation:mj-swatch-lift 8s ease-in-out infinite;animation-play-state:var(--mj-play)}.mj-id-swatches>div>span:nth-child(2){animation-delay:-2s}.mj-id-swatches>div>span:nth-child(3){animation-delay:-4s}.mj-id-swatches>div>span:nth-child(4){animation-delay:-6s}.mj-id-swatches i{display:block;width:100%;height:74%;background:#eee9dc;border:1px solid #ffffff50;box-shadow:0 6px 0 #969385,0 17px 20px #0007;border-radius:3px}.mj-id-swatches span:nth-child(2) i{background:#a2aa8d;box-shadow:0 6px 0 #586149,0 17px 20px #0007}.mj-id-swatches span:nth-child(3) i{background:#565d4c;box-shadow:0 6px 0 #2c3425,0 17px 20px #0007}.mj-id-swatches span:nth-child(4) i{background:#202820;box-shadow:0 6px 0 #0d120d,0 17px 20px #0007}.mj-id-swatches b{display:block;color:#a9b6ca;font:400 clamp(5px,1.1cqw,9px)/1 var(--f-sans);margin-top:13%}.mj-id-caption{position:absolute;left:12%;bottom:8%;font:400 clamp(7px,1.45cqw,12px)/1 var(--f-sans);color:#b4bbca}.mj-id-caption em{font-family:var(--f-serif);font-size:1.2em;color:#d2c6ed}
@keyframes mj-swatch-lift{0%,100%{translate:0 0}45%,60%{translate:0 -8px}}
/* Publication is a connected globe and control handover, not a repeated website. */
.mj-life-orbit{position:absolute;left:7%;top:21%;width:84%;height:44%;border:1px solid #a8c9ff47;border-radius:50%;transform:translateZ(-75px) rotateZ(-24deg);box-shadow:0 0 30px #6b97ff09}.mj-life-orbit--back{transform:translateZ(-100px) rotateZ(27deg);border-color:#a9d2cb30}.mj-life-orbit--front{transform:translateZ(12px) rotateZ(-24deg);border-top-color:#b6d9ff88;border-bottom-color:#7da4e81c}.mj-life-orbit--front>i{position:absolute;left:50%;top:-4px;width:8px;height:8px;border-radius:50%;background:#c6dcff;box-shadow:0 0 18px 6px #6b9fff55;animation:mj-life-signal 6s ease-in-out infinite;animation-play-state:var(--mj-play)}
.mj-life-routes{position:absolute;inset:0;width:100%;height:100%;color:#a9c8f738;transform:translateZ(-5px)}.mj-life-routes>path{stroke-width:1;vector-effect:non-scaling-stroke}.mj-life-globe{position:absolute;left:30%;top:16%;width:45%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 30% 24%,#b0e0ff26,#4985c316 32%,#1f386a33 65%,#7ba9ee3b 96%);border:1px solid #94c3ff66;box-shadow:inset -15px -18px 35px #101b3d, inset 9px 7px 30px #c2e2ff10,0 0 80px #4b8dff1a,0 30px 60px #0007;transform:translateZ(35px);isolation:isolate}.mj-life-grid{position:absolute;inset:0;width:100%;height:100%;color:#b4dbff2e;stroke-width:.8!important;transform:rotate(-15deg);mask-image:linear-gradient(150deg,#000,transparent 55%,#000)}.mj-life-core{position:absolute;inset:10%;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;color:#f0f7ff}.mj-life-core>svg{width:23%;height:23%;color:#c6dcff;stroke-width:2;filter:drop-shadow(0 4px 10px #6b9cff88);margin-bottom:8%}.mj-life-core>span{font:400 clamp(8px,1.8cqw,15px)/1.4 var(--f-sans);color:#a6bddb}.mj-life-core>strong{font:italic 400 clamp(29px,7.2cqw,62px)/1.1 var(--f-serif);letter-spacing:-.035em;color:#dfd8f2}.mj-life-core>small{font:400 clamp(4px,.65cqw,6px)/1.6 var(--f-mono);letter-spacing:.12em;max-width:23ch;color:#6e8fb6;margin-top:9%}
.mj-life-ready{position:absolute;left:8%;top:5%;width:50%;padding:3%;display:flex;gap:5%;align-items:center;transform:translateZ(100px) rotateY(8deg) rotateZ(-6deg);border-radius:13px}.mj-life-check{width:14%;aspect-ratio:1;display:grid;place-items:center;border:1px solid #a9cfc664;border-radius:50%;background:#689e8b22;color:#bbe0ce;flex:none}.mj-life-check>svg{width:60%;height:60%;stroke-width:1.5}.mj-life-ready small,.mj-life-module-heading>span{display:block;font:400 clamp(5px,.9cqw,8px)/1.2 var(--f-mono);letter-spacing:.1em;color:#8ca9cf}.mj-life-ready strong{display:block;margin:4% 0;font:500 clamp(13px,2.6cqw,22px)/1.2 var(--f-sans);letter-spacing:-.03em}.mj-life-ready div>span{display:block;font:400 clamp(5px,1.05cqw,9px)/1.4 var(--f-sans);color:#99afcd}
.mj-life-manual,.mj-life-updates{position:absolute;bottom:17%;width:43%;height:30%;padding:3%;border-radius:14px;transform:translateZ(125px) rotateY(7deg) rotateZ(-6deg);background:linear-gradient(140deg,#344963ed,#162335f7 70%);box-shadow:inset 0 1px #ffffff4d,5px 8px 0 #15263d,0 24px 40px #0009;animation:mj-float 10s ease-in-out infinite;animation-play-state:var(--mj-play)}.mj-life-manual{left:0}.mj-life-updates{right:0;transform:translateZ(125px) rotateY(-8deg) rotateZ(6deg);animation-delay:-5s}.mj-life-module-heading{display:flex;align-items:center;justify-content:space-between;gap:5%;margin-bottom:7%}.mj-life-module-heading>svg{width:10%;height:auto;aspect-ratio:1;color:#b5d3ff}.mj-life-manual>strong{font:500 clamp(18px,3.9cqw,34px)/1.02 var(--f-sans);letter-spacing:-.045em;display:block}.mj-life-manual>strong em{font-family:var(--f-serif);font-weight:400;color:#c7badf;font-size:1.15em}.mj-life-key{display:flex;align-items:center;gap:8%;margin-top:10%;padding-top:7%;border-top:1px solid #8fa9cc25}.mj-life-key>svg{width:8%;height:auto;aspect-ratio:1;color:#98b8e6}.mj-life-key>span{font:400 clamp(5px,1.1cqw,9px)/1.4 var(--f-sans);color:#a5b5cd}.mj-life-updates>strong{display:block;font:500 clamp(17px,3.4cqw,29px)/1.1 var(--f-sans);letter-spacing:-.04em;margin-bottom:9%}.mj-life-update-row{display:flex;align-items:center;gap:6%;padding:5% 0;border-top:1px solid #92acd62b;font:400 clamp(5px,1.05cqw,9px)/1.5 var(--f-sans);color:#bfcee2}.mj-life-update-row>i{width:6px;height:6px;border:1px solid #9bb6db;border-radius:2px;flex:none}.mj-life-update-row>b{font-size:12px;margin-left:auto;font-weight:400;color:#9db8de}.mj-life-updates>small{display:block;font:400 clamp(4px,.85cqw,7px)/1.4 var(--f-sans);color:#738faf;margin-top:5%}.mj-scene--launch .mj-scene-note{bottom:7%}
@keyframes mj-life-signal{0%,100%{opacity:.35;scale:.8}40%,65%{opacity:1;scale:1.2}}
@media(max-width:999px){
.mj-id-type{left:3%;top:23%;width:52%;height:39%;transform:translateZ(45px) rotateY(5deg) rotateZ(-7deg);padding:4%}.mj-id-type>strong{font-size:18cqw;margin-top:10%;margin-bottom:9%}.mj-id-type>small{font-size:5px}.mj-id-type>span{font-size:6px}.mj-id-type>div{font-size:8px}.mj-id-mark{right:2%;top:12%;width:25%;transform:translateZ(60px) rotateZ(7deg);border-radius:12px}.mj-id-mark>small{font-size:4px}.mj-id-poster{left:46%;top:17%;width:43%;height:54%;padding:4%;transform:translateZ(0) rotateZ(6deg)}.mj-id-poster>strong{font-size:6cqw;margin-top:15%}.mj-id-poster>small{font-size:3.5px}.mj-id-board{top:15%;height:67%;left:8%;width:82%}.mj-id-board>span{font-size:5px}.mj-id-swatches{left:15%;bottom:15%;width:72%;height:19%;transform:translateZ(55px) rotateZ(-4deg)}.mj-id-swatches>small{font-size:5px}.mj-id-swatches>div{height:70%;margin-top:5%}.mj-id-swatches b{font-size:6px}.mj-id-caption{bottom:8%;font-size:7px}.mj-scene--design .mj-scene-note{font-size:7px;bottom:4%}
.mj-life-globe{left:28%;top:21%;width:48%;transform:translateZ(10px)}.mj-life-core>strong{font-size:8cqw}.mj-life-core>span{font-size:8px}.mj-life-core>small{font-size:4px;max-width:22ch;margin-top:7%}.mj-life-core>svg{margin-bottom:5%}.mj-life-orbit{top:25%;height:36%;left:3%;width:94%;transform:translateZ(-30px) rotateZ(25deg)}.mj-life-orbit--front{transform:translateZ(0) rotateZ(-25deg)}.mj-life-ready{left:4%;top:8%;width:57%;padding:3.5%;transform:translateZ(45px) rotateZ(-5deg)}.mj-life-ready small{font-size:4px}.mj-life-ready strong{font-size:13px}.mj-life-ready div>span{font-size:5px}.mj-life-manual,.mj-life-updates{bottom:18%;width:45%;height:28%;padding:3.5%;border-radius:10px}.mj-life-manual{left:0;transform:translateZ(45px) rotateZ(-5deg)}.mj-life-updates{right:0;transform:translateZ(45px) rotateZ(5deg)}.mj-life-module-heading>span{font-size:4px;letter-spacing:.04em}.mj-life-manual>strong{font-size:4.6cqw}.mj-life-key{margin-top:14%;padding-top:9%;gap:5%}.mj-life-key>span{font-size:5px}.mj-life-updates>strong{font-size:4.2cqw;margin-bottom:12%}.mj-life-update-row{font-size:5px;padding:6% 0;gap:4%}.mj-life-update-row>i{width:4px;height:4px}.mj-life-update-row>b{font-size:8px}.mj-life-updates>small{font-size:4px;margin-top:6%}.mj-scene--launch .mj-scene-note{bottom:7%;font-size:7px}
}
@media(max-width:999px){.mj-id-caption{display:none}.mj-life-manual,.mj-life-updates{height:30%}.mj-life-key{margin-top:8%;padding-top:5%}.mj-life-updates>strong{margin-bottom:7%}.mj-life-update-row{padding:4% 0}}
@media(prefers-reduced-motion:reduce){.mj-id-swatches>div>span,.mj-id-mark,.mj-life-orbit--front>i,.mj-life-manual,.mj-life-updates{animation:none!important;translate:none}}

/* Keep supporting labels inside the glass panels at every scale. */
.mj-life-key{margin-top:6%;padding-top:5%}.mj-life-module-heading{margin-bottom:5%}.mj-life-updates>strong{margin-bottom:4%}.mj-life-update-row{padding:3% 0}.mj-life-updates>small{margin-top:3%}
@media(min-width:1000px){.mj-life-manual,.mj-life-updates{height:32%}}