.app-stage{aspect-ratio:1/1.05;width:100%;position:relative;container-type:inline-size}.app-glow{transform-origin:50%;background:radial-gradient(closest-side,#e7b3478c,#e7b34700 70%);border-radius:9999px;position:absolute;inset:12% 14%}.app-phone{aspect-ratio:9/18.5;background:#0e0b0a;border:3px solid #e7b347b3;border-radius:clamp(1.4rem,8cqw,2.4rem);width:46%;padding:2.2cqw;display:grid;position:absolute;top:50%;left:50%;translate:-50% -50%;box-shadow:0 30px 60px -28px #000c}.app-phone__notch{z-index:2;background:#000;border-radius:9999px;width:26%;height:1.8cqw;margin-left:-13%;position:absolute;top:2.4cqw;left:50%}.app-phone__screen{background:linear-gradient(170deg,#e71e26,#8a0f14 70%);border-radius:clamp(1rem,6cqw,1.8rem);place-items:center;display:grid;position:relative;overflow:hidden}.app-k{place-items:center;width:100%;display:grid}.app-bars{gap:1.6cqw;display:grid;position:absolute;inset:auto 14% 9%}.app-bars i{background:#f5ede059;border-radius:9999px;height:1.8cqw}.app-bars i:nth-child(2){width:70%}.app-bars i:nth-child(3){width:45%}.app-card{z-index:3;position:absolute}.app-card__bob{background:var(--color-crema);color:var(--color-ink);text-transform:uppercase;letter-spacing:.03em;white-space:nowrap;border-radius:1.2rem;align-items:center;gap:1.8cqw;padding:2.4cqw 3.6cqw;font-size:clamp(.8rem,3.8cqw,1rem);font-weight:800;display:inline-flex;box-shadow:0 16px 30px -16px #000000b3}.app-card--order{top:14%;left:0}.app-card--favourites{top:40%;right:0}.app-card--rewards{bottom:12%;left:4%}.app-pause{width:2.75rem;height:2.75rem;color:var(--color-crema);background:#14110f99;border:1.5px solid #f5ede073;border-radius:9999px;place-items:center;display:inline-grid;position:absolute;bottom:0;right:0}.app-pause:hover{border-color:var(--color-crema)}@media (prefers-reduced-motion:no-preference){.app-stage[data-ready]:not([data-in]) .app-phone{opacity:0;transform:translateY(14%)scale(.9)}.app-stage[data-ready]:not([data-in]) .app-k,.app-stage[data-ready]:not([data-in]) .app-card{opacity:0}.app-stage[data-in] .app-phone{animation:app-phone-in .9s var(--ease-out-expo) both}.app-stage[data-in] .app-k{animation:app-k-in .7s var(--ease-sizzle) .7s both}.app-stage[data-in] .app-glow{animation:3.2s ease-in-out 1.2s infinite app-pulse}.app-stage[data-in] .app-card{animation:app-card-in .7s var(--ease-sizzle) calc(.95s + var(--i) * .16s) both}.app-stage[data-in] .app-card__bob{animation:app-bob 4.2s ease-in-out calc(1.8s + var(--i) * .5s) infinite}.app-stage[data-paused] *,.app-stage[data-offscreen] *{animation-play-state:paused!important}}@keyframes app-phone-in{0%{opacity:0;transform:translateY(14%)scale(.9)}}@keyframes app-k-in{0%{opacity:0;transform:scale(.5)}}@keyframes app-pulse{0%,to{opacity:.7;transform:scale(.94)}50%{opacity:1;transform:scale(1.06)}}@keyframes app-card-in{0%{opacity:0;transform:translateY(18px)scale(.85)}}@keyframes app-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-7px)}}