:root{--cream:#f0f1e9;--ink:#183c31;--lime:#d0ed93;--dark:#091f19}
body{overflow-x:clip}
.header-download{white-space:nowrap}
[hidden]{display:none!important}button{font:inherit;cursor:pointer}button:focus-visible{outline:3px solid #89aa4e;outline-offset:5px}.wrap{width:min(1280px,calc(100% - 88px))}.header{color:#f2f5e9;border-color:#cbe4ce25}.brand img{mix-blend-mode:normal;border-radius:50%;background:#fff}.brand-dot{color:#9bb86a}body::before{content:"";position:absolute;inset:0 0 auto;height:100px;background:var(--dark);z-index:-1}.header-download{border:1px solid #d7e8d63d;padding:10px 16px;border-radius:25px;font-size:12px}.hero{grid-template-columns:1.05fr 1fr;min-height:740px;border:0;color:#f2f5e9;position:relative}.hero::before{content:"";position:absolute;background:var(--dark);inset:0 calc((min(1280px,100vw - 88px) - 100vw)/2);z-index:-1}.hero-copy{padding:84px 0 48px;position:relative;z-index:2}.pill{border:0;padding:0;font-size:10px;letter-spacing:1.7px;display:flex;align-items:center;gap:10px;color:#c3d2b9}.status-dot{display:block;width:6px;height:6px;background:var(--lime);border-radius:50%;box-shadow:0 0 12px #cae99b60}.hero h1{font-size:clamp(72px,7.8vw,110px);letter-spacing:-6px;font-weight:550;line-height:.98;margin-top:39px}.hero h1 .serif{color:var(--lime)}.hero-description{font-size:15px;line-height:1.9;color:#afc3b4;max-width:390px;margin-top:32px}.hero-actions{gap:27px;margin-top:32px}.button{border-radius:7px;font-size:13px;padding:17px 23px;transition:transform .2s,box-shadow .2s}.primary{background:var(--lime);color:var(--dark);border-color:transparent;box-shadow:0 4px 0 #849e51}.primary:hover{background:#e0f5b5;transform:translateY(-2px);box-shadow:0 7px 0 #849e51}.text-link{font-size:12px}.download-meta{font-size:10px;color:#a9bcac;margin-top:20px}.hero-note{color:#acc0b0}.hero-note>span{color:var(--lime);font-size:9px;border:1px solid #bcdba335;padding:8px;letter-spacing:.8px;align-self:auto}.hero-visual{background:none;border:0;overflow:visible;padding:30px 0 25px;min-width:0;gap:0}.preview-label{color:#8da994;font-size:9px;letter-spacing:1.3px}.product-stage{position:relative;height:600px;perspective:1200px;width:100%}.scene-orbit{position:absolute;inset:40px -10px 25px;border:1px solid #bdd6ae20;border-radius:50%;transform:rotate(-18deg)}.scene-orbit::after{content:"";position:absolute;inset:25px;border:1px dashed #bdd6ae14;border-radius:50%}.pedestal{position:absolute;bottom:18px;left:6%;width:88%;height:155px;border-radius:50%;background:radial-gradient(ellipse at 45% 35%,#325040,#142f25 60%,#082018);border:1px solid #61875e50;box-shadow:0 14px 0 #10281f,0 16px 0 #6c89554a,0 39px 32px #0008;transform:rotateX(25deg)}.pedestal::before{content:"";position:absolute;inset:25px;border:1px solid #96b78028;border-radius:50%}.phone-rig{position:absolute;width:250px;height:555px;top:4px;left:50%;margin-left:-125px;transform-style:preserve-3d;transform:rotateX(var(--rx,9deg)) rotateY(var(--ry,-23deg)) rotateZ(-7deg);transition:transform .55s cubic-bezier(.2,.7,.2,1);animation:phone-drift 7s ease-in-out infinite}.phone-rig .phone,.phone-back,.phone-edge{position:absolute;inset:0;width:auto;border-radius:36px}.phone-back{background:linear-gradient(135deg,#6b8570,#152e24 55%,#33533d);transform:translateZ(-18px);box-shadow:35px 28px 44px #0008}.phone-edge{background:linear-gradient(90deg,#8aa885,#112c21 16%,#9aaf8c 90%,#1d3b2b);box-shadow:1px 0 0 #b9c6a5,2px 0 0 #48683f,3px 0 0 #91a17c,4px 0 0 #314832,5px 0 0 #91a17c,6px 0 0 #263d29,7px 0 0 #8ba579,8px 0 0 #203727;transform:translateZ(-7px)}.phone-rig .phone{background:#eff5ed;border:7px solid #1c3328;overflow:hidden;transform:translateZ(4px);box-shadow:inset 0 0 0 1px #cad3b3,0 0 0 1px #93a785}.phone-rig .phone img{width:100%;height:100%;object-fit:fill}.phone-rig .phone::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(125deg,#ffffff30,transparent 35%,transparent 75%,#d5f2bf15)}.phone-key{position:absolute;right:-8px;top:145px;width:5px;height:55px;border-radius:3px;background:#b4c0a2;transform:translateZ(-3px)}.coin{position:absolute;width:90px;height:90px;border-radius:50%;border:3px solid #dfefad;background:linear-gradient(145deg,#f0f9c2,#b1c975 48%,#d3e29b);box-shadow:1px 1px 0 #84994a,2px 2px 0 #84994a,3px 3px 0 #718339,4px 4px 0 #718339,5px 5px 0 #718339,6px 6px 0 #718339,7px 7px 0 #718339,14px 22px 22px #0004;display:grid;place-items:center;color:#536731;z-index:3}.coin::after{content:"";position:absolute;inset:6px;border:1px solid #7c934b;border-radius:50%}.coin span{font-size:40px;font-weight:700;text-shadow:1px 1px #fbffdc}.coin-one{top:73px;right:2%;transform:rotateY(-25deg) rotateZ(22deg);animation:coin-rise 6s ease-in-out infinite}.coin-two{bottom:125px;left:0;width:64px;height:64px;transform:rotateY(30deg) rotateZ(-15deg);animation:coin-rise 6s -3s ease-in-out infinite}.coin-two span{font-size:32px}.stage-coordinate{position:absolute;bottom:15px;right:0;font:10px Consolas,monospace;color:#8ca48d}.scene-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;color:#b5c9b6}.visual-caption{text-align:left;font-size:11px;line-height:1.7}.visual-caption small{color:#87a28f}.motion-toggle{background:transparent;border:1px solid #b7d0b52b;color:#c6d8be;border-radius:22px;padding:10px 13px;font:10px Consolas,monospace;min-height:40px}.motion-toggle:hover{border-color:#c6d8be}.scene-paused .phone-rig,.scene-paused .coin,.scene-outside .phone-rig,.scene-outside .coin{animation-play-state:paused}.scene-interacting .phone-rig{animation:none}.benefit-strip{background:var(--dark);color:#c6d5c2;border-top:1px solid #d3e5cc25;border-bottom:0}.benefits{padding-block:23px;font-size:11px}.benefits b{display:inline;color:var(--lime);font-size:17px;margin-right:9px;font-weight:400}.section{padding-block:96px}h2{font-size:clamp(36px,4vw,53px);letter-spacing:-2px;font-weight:550}.feature{grid-template-columns:110px 1fr 1.05fr;padding:30px 0;align-items:center}.feature-top{align-items:center;gap:25px}.feature-number{font-size:10px}.feature-icon{font-size:27px;color:#5b7f35;width:42px;height:42px;display:grid;place-items:center;border:1px solid #b9cda1;background:linear-gradient(145deg,#fff,#dce6c9);border-radius:10px;box-shadow:3px 4px 0 #b9c8ab;transform:perspective(200px) rotateY(-16deg) rotateX(8deg)}.feature h3{font-size:25px}.feature p{max-width:450px}#tampilan{padding-top:38px}#gallery-title span{color:#6b8351}.gallery-navigation{display:flex;gap:26px;align-items:center}.gallery-navigation p{font-size:13px;color:var(--muted)}.gallery-navigation>div{display:flex;gap:9px}.gallery-navigation button{border:1px solid var(--line);border-radius:50%;width:45px;height:45px;color:var(--ink);background:transparent;font-size:20px}.gallery-navigation button:hover{background:#dce8c7}.gallery-navigation button:disabled{opacity:.4;cursor:default}.screen-gallery{gap:30px;padding:22px 8px 32px;overscroll-behavior-x:contain}.screen-gallery figure{flex-basis:280px}.gallery-stage{height:505px;min-height:0;perspective:1000px;position:relative;background:linear-gradient(150deg,#e1e8d6,#eaf0e0 65%,#d2dec2);border:0;border-radius:140px 140px 12px 12px;padding:0}.gallery-stage::before{content:"";position:absolute;bottom:28px;width:220px;height:62px;border-radius:50%;background:#b6c8a1;box-shadow:0 9px 0 #a1b58d;transform:rotateX(35deg)}.gallery-phone{position:relative;width:205px;border:6px solid #243e30;border-radius:29px;transform:rotateY(-15deg) rotateZ(-5deg) translateY(-12px);box-shadow:1px 1px 0 #7d9574,2px 2px 0 #607757,3px 3px 0 #607757,4px 4px 0 #385335,5px 5px 0 #385335,20px 25px 27px #263c302b;transition:transform .35s}.screen-gallery figure:nth-child(even) .gallery-phone{transform:rotateY(15deg) rotateZ(5deg) translateY(-12px)}.gallery-phone:hover,.gallery-phone:focus-visible,.screen-gallery figure:nth-child(even) .gallery-phone:hover,.screen-gallery figure:nth-child(even) .gallery-phone:focus-visible{transform:rotateY(0) rotateZ(0) translateY(-20px);outline-offset:5px}.screen-gallery figcaption{border:0;padding:19px 4px 0;margin:0}.getting-started{padding-block:80px;position:relative;overflow:hidden}.getting-started::after{content:"M";position:absolute;font-size:430px;font-weight:700;line-height:1;right:-50px;bottom:-100px;color:#cfea9920;transform:perspective(700px) rotateY(-30deg);pointer-events:none}.install-layout{position:relative;z-index:1}.closing{padding:55px 0}.closing h2{font-size:42px}.light{background:var(--green);color:#fff;box-shadow:0 4px 0 #869976}.light:hover{background:#28563f;transform:translateY(-2px)}body:has(.not-found)::before{display:none}
@keyframes phone-drift{0%,100%{transform:translateY(0) rotateX(9deg) rotateY(-23deg) rotateZ(-7deg)}50%{transform:translateY(-13px) rotateX(6deg) rotateY(-15deg) rotateZ(-5deg)}}@keyframes coin-rise{0%,100%{translate:0 0}50%{translate:0 -16px}}
@media(max-width:1100px){.wrap{width:calc(100% - 56px)}.hero{grid-template-columns:1fr 1fr}.hero h1{font-size:85px;letter-spacing:-5px}.hero-description{max-width:345px}.hero::before{inset-inline:-28px}.phone-rig{width:220px;height:488px;margin-left:-110px;top:35px}.product-stage{height:580px}.coin-one{right:0;width:65px;height:65px}.coin-one span{font-size:30px}.feature{grid-template-columns:90px 1fr 1fr}.feature-top{gap:16px}.benefits{font-size:10px}.scene-footer{gap:10px}}
@media(max-width:760px){.wrap{width:calc(100% - 40px)}.header{height:80px;gap:16px}.brand{font-size:26px}.brand img{width:33px;height:33px}.header nav{gap:20px;font-size:11px}.header nav a:nth-child(2){display:none}.header-download{display:block;padding:8px 12px;font-size:10px}.header-download span{margin-left:6px}body::before{height:80px}.hero{display:grid;grid-template-columns:1fr;min-height:0}.hero::before{inset-inline:-20px}.hero-copy{padding:48px 0 24px}.pill{font-size:9px}.hero h1{font-size:clamp(65px,12.6vw,96px);letter-spacing:-4px;margin-top:30px}.hero-description{font-size:14px;max-width:420px;margin-top:24px}.hero-actions{margin-top:26px;gap:23px}.button{padding:15px 19px;font-size:12px}.download-meta{font-size:9px}.hero-note{padding-top:30px}.hero-visual{padding:28px 0 25px;border-top:1px solid #cbe4ce20;gap:0}.preview-label{font-size:8px}.product-stage{height:570px;max-width:460px;align-self:center}.phone-rig{top:16px;width:225px;height:500px;margin-left:-112.5px}.pedestal{bottom:20px;left:5%;width:90%;height:125px}.coin-one{right:3%;top:80px}.coin-two{left:3%;bottom:125px;width:55px;height:55px}.coin-two span{font-size:27px}.scene-footer{max-width:460px;align-self:center}.benefits{display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:9px}.benefits b{font-size:13px;margin-right:5px}.section{padding-block:60px}h2{font-size:36px;letter-spacing:-1.4px}.feature{grid-template-columns:60px 1fr;gap:16px;padding:26px 0}.feature-top{flex-direction:column;gap:12px;grid-row:span 2}.feature h3{font-size:22px;align-self:end}.feature p{grid-column:2;font-size:12px;margin-top:-15px}.feature-icon{font-size:24px;width:36px;height:36px}.gallery-navigation{justify-content:space-between;margin-top:23px;gap:20px}.gallery-navigation p{font-size:12px}.screen-gallery{gap:20px;padding-top:18px}.screen-gallery figure{flex-basis:255px}.gallery-stage{height:475px;min-height:0}.gallery-phone{width:192px}#tampilan{padding-top:25px}.getting-started{padding-block:55px}.closing h2{font-size:35px}}
@media(max-width:380px){.wrap{width:calc(100% - 32px)}.hero::before{inset-inline:-16px}.header nav{display:none}.hero h1{font-size:62px}.product-stage{height:525px}.phone-rig{width:205px;height:456px;margin-left:-102.5px}.coin-one{width:55px;height:55px;right:0}.coin-two{left:0}.hero-actions{gap:18px}.hero-actions .text-link{font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.phone-rig,.coin{animation:none}.phone-rig,.gallery-phone,.button{transition:none}}
.scene-orbit{inset-inline:45px}@media(max-width:760px){.scene-orbit{inset:80px 85px}.header{gap:10px}.header nav{gap:14px}}

/* Match the original Android screenshot ratio without stretching its contents. */
.phone-rig .phone img,.gallery-phone img{object-fit:cover}
.gallery-phone img{aspect-ratio:1280/2772;height:auto}


/* Keep gallery navigation available without a visible scrollbar. */
.screen-gallery{scrollbar-width:none;-ms-overflow-style:none}
.screen-gallery::-webkit-scrollbar{display:none;width:0;height:0}

/* Anchor the phone's base to the middle of the pedestal surface. */
.product-stage{--stand-bottom:20px;--stand-height:120px;height:640px}
.pedestal{bottom:var(--stand-bottom);height:var(--stand-height)}
.phone-rig{top:auto;bottom:calc(var(--stand-bottom) + var(--stand-height)/2);width:244px;height:530px;margin-left:-122px;transform-origin:50% 100%}
@media(max-width:1100px){.product-stage{height:580px}.phone-rig{width:220px;height:478px;margin-left:-110px}}
@media(max-width:760px){.product-stage{height:570px}.phone-rig{width:217px;height:470px;margin-left:-108.5px}.pedestal{bottom:var(--stand-bottom);height:var(--stand-height)}}
@media(max-width:380px){.product-stage{height:525px}.phone-rig{width:201px;height:436px;margin-left:-100.5px}}