[data-gerak-siap] [data-gerak=muncul]{--pt:clamp(0, calc((var(--p,1) - var(--tunda,0)) / (1 - var(--tunda,0))), 1);opacity:var(--pt);transform:translateY(calc((1 - var(--pt)) * 24px)) scale(calc(1 - (1 - var(--pt)) * var(--skala,0)))}[data-gerak-siap] [data-gerak=wipe]{clip-path:inset(0 0 calc((1 - var(--p,1)) * 100%) 0)}[data-gerak-siap] [data-gerak=bab]{height:180vh}[data-gerak-siap] [data-gerak=bab]>.panggung{align-content:center;min-height:100dvh;position:sticky;top:0}[data-gerak-siap] .bingkai-ponsel-skala{transform:scale(calc(.94 + .06 * clamp(0, calc(var(--p,1) / .25), 1)))}[data-gerak-siap] [data-gerak=bab] .bingkai-ponsel{--muka:calc(.55 + .45 * clamp(0, calc(var(--p,1) / .55), 1))}[data-gerak-siap] [data-gerak=bab] .benang-torak{opacity:clamp(0, calc((.55 - var(--p,0)) / .08 + 1), 1);transform:translateY(calc((.55 + .45 * clamp(0, calc(var(--p,0) / .55), 1)) * 100cqw * 844 / 390))}.benang-torak{inset-inline:0;background:var(--benang);height:2px;box-shadow:0 2px 10px color-mix(in oklab, var(--benang) 55%, transparent);opacity:0;pointer-events:none;position:absolute;top:0}[data-gerak-siap] [data-gerak=bab] .tenun-tersingkap{clip-path:inset(0 0 calc((1 - (.55 + .45 * clamp(0, calc(var(--p,1) / .55), 1))) * 100%) 0)}@keyframes apung{to{transform:translateY(-8px)}}.bingkai-ponsel{aspect-ratio:390/844;width:100%;animation:6s ease-in-out infinite alternate apung}.bingkai-ponsel-skala{width:min(300px,100vw - 2rem,24.9526dvh)}@media (min-width:40rem){.bingkai-ponsel-skala{width:min(300px,28.6493dvh)}}.pohon-hidup{opacity:0}.pohon-hidup[data-siap]{opacity:1}.demo-gelap,[data-theme=dark] .demo-terang{display:none}[data-theme=dark] .demo-gelap{display:block}@media (prefers-color-scheme:dark){:root:not([data-theme]) .demo-terang{display:none}:root:not([data-theme]) .demo-gelap{display:block}}@media (prefers-reduced-motion:reduce){[data-gerak-siap] [data-gerak],[data-gerak-siap] .bingkai-ponsel-skala,[data-gerak-siap] .tenun-tersingkap{opacity:1!important;clip-path:none!important;transform:none!important}.bingkai-ponsel{animation:none}.benang-torak{display:none}[data-gerak-siap] [data-gerak=bab]{height:auto}[data-gerak-siap] [data-gerak=bab]>.panggung{position:static}}.bingkai-ponsel{container-type:inline-size}.ponsel-bilah{height:9.23077cqw;font-size:3.07692cqw}.ponsel-nav{gap:.512821cqw;min-height:14.359cqw;font-size:2.5641cqw}.ponsel-nav svg{width:5.12821cqw;height:5.12821cqw}.bab-gelap,.bab-gelap .bab-gelap-isi{transition:background-color .4s var(--lengkung), border-color .4s var(--lengkung), color .1s var(--lengkung) .14s}