.ppal{--ppal-ink: #1c332b;--ppal-body: #3a4a44;--ppal-muted: #6c746c;--ppal-soft: #f3f3f0;color:var(--ppal-ink)}.ppal *,.ppal *:before,.ppal *:after{box-sizing:border-box}.ppal__wrap{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"eyebrow" "title" "tabs" "stage";justify-items:center}.ppal__panel{display:contents}.ppal__eyebrow{grid-area:eyebrow;margin:0 0 1.2rem;font-size:1.4rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ppal-muted)}.ppal .ppal__title{grid-area:title;margin:0 0 2.8rem;color:inherit;text-align:center;font-family:var(--font-heading-family);font-weight:500;font-size:clamp(3.2rem,4vw,5.6rem);line-height:1.05;letter-spacing:-.02em}.ppal__tabs{grid-area:tabs;display:flex;gap:.6rem;padding:.5rem;margin:0 0 3.2rem;border-radius:99px;background:var(--ppal-soft)}.ppal__tab{position:relative;display:flex;align-items:center;justify-content:center;padding:1.3rem 2.6rem;margin:0;border:0;border-radius:99px;overflow:hidden;background:none;cursor:pointer;color:var(--ppal-muted);font:inherit;font-size:1.6rem;white-space:nowrap;transition:color .25s,background .25s,box-shadow .25s}.ppal__tab:hover{color:var(--ppal-ink)}.ppal__tab.is-active{color:var(--ppal-ink);background:#fff;box-shadow:0 2px 10px #0a1e1614}.ppal__tab:focus-visible{outline:2px solid var(--ppal-ink);outline-offset:2px}.ppal__num,.ppal__long{display:none}.ppal__bar{position:absolute;left:2rem;right:2rem;bottom:.6rem;height:2px}.ppal__bar i{display:block;height:100%;width:0;border-radius:2px;background:var(--ppal-ink);transition:width .6s linear}.ppal__tab:not(.is-active) .ppal__bar i{width:0!important;transition:none}.ppal__stage{--pw: 27rem;grid-area:stage;position:relative;width:100%;height:calc(var(--pw) * 150 / 71.9 + 12.8rem);border-radius:var(--collection-card-radius, 2rem);overflow:hidden;touch-action:pan-y;background:linear-gradient(180deg,#f7f6f4,#ebeae7,#dcdad5,#cfccc5,#c2bfb6)}.ppal__slide{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;visibility:hidden;transition:opacity .45s,visibility 0s .45s}.ppal__slide.is-active{opacity:1;visibility:visible;transition:opacity .45s}.ppal__phone{position:absolute;left:50%;top:5.6rem;width:var(--pw);aspect-ratio:71.9 / 150;transform:translate(-50%);padding:calc(var(--pw) * .012);border-radius:calc(var(--pw) * .175);background:linear-gradient(135deg,#55595d,#2a2d30 18%,#1d1f22,#2c2f32 82%,#4d5155);box-shadow:inset 0 0 0 1px #ffffff24,0 34px 60px #0a1e1642,0 10px 20px #0a1e1624}@keyframes ppal-intro{0%{transform:translate(-50%) translateY(3.2rem) rotate(-7deg) scale(.94)}45%{transform:translate(-50%) translateY(-.8rem) rotate(2.5deg) scale(1.01)}70%{transform:translate(-50%) translateY(.2rem) rotate(-1deg) scale(1)}to{transform:translate(-50%) translateY(0) rotate(0) scale(1)}}.ppal__slide.is-intro .ppal__phone{animation:ppal-intro 1.1s cubic-bezier(.3,.7,.3,1) both}@media(prefers-reduced-motion:reduce){.ppal__slide.is-intro .ppal__phone{animation:none}}.ppal__glass{height:100%;padding:calc(var(--pw) * .026);border-radius:calc(var(--pw) * .163);background:#040506}.ppal__screen{position:relative;height:100%;border-radius:calc(var(--pw) * .138);overflow:hidden;background:#1a2a24;container-type:inline-size;isolation:isolate;transform:translateZ(0);-webkit-mask-image:-webkit-radial-gradient(#fff,#000);mask-image:radial-gradient(#fff,#000)}.ppal__frame{position:absolute;left:0;top:0;width:402px;height:874px;border:0;transform-origin:0 0;background:#1a2a24;display:block}.ppal__btn{position:absolute;width:calc(var(--pw) * .012);border-radius:2px;background:linear-gradient(90deg,#1d1f22,#45494d)}.ppal__btn--action,.ppal__btn--vol-up,.ppal__btn--vol-down{left:calc(var(--pw) * -.01)}.ppal__btn--power,.ppal__btn--camera{right:calc(var(--pw) * -.01);background:linear-gradient(90deg,#45494d,#1d1f22)}.ppal__btn--action{top:17%;height:4.6%}.ppal__btn--vol-up{top:24.5%;height:7.6%}.ppal__btn--vol-down{top:33.6%;height:7.6%}.ppal__btn--power{top:26%;height:11%}.ppal__btn--camera{top:51%;height:8%;right:calc(var(--pw) * -.004);width:calc(var(--pw) * .006)}.ppal__note{position:absolute;left:0;right:0;bottom:1.8rem;margin:0;text-align:center;font-size:1.4rem;color:var(--ppal-muted);transition:opacity .3s}.ppal__stage.is-user .ppal__note{opacity:0}.ppal__status{position:absolute;left:0;right:0;top:0;height:14.6cqw;z-index:2;pointer-events:none;color:#fff}.ppal__island{position:absolute;left:50%;top:2.8cqw;width:20.5cqw;height:9.1cqw;margin-left:-10.25cqw;border-radius:99px;background:#000}.ppal__time{position:absolute;left:8cqw;width:22cqw;top:7.35cqw;transform:translateY(-50%);text-align:center;font:600 4.3cqw/1 -apple-system,BlinkMacSystemFont,SF Pro Text,system-ui,sans-serif;letter-spacing:-.01em}.ppal__icons{position:absolute;right:7cqw;width:24cqw;top:7.35cqw;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;gap:1.4cqw}.ppal__icons svg{height:3cqw;width:auto;fill:#fff}.ppal__icons svg:last-child{height:3.3cqw}.ppal__details{grid-area:stage;z-index:2;display:grid;width:100%;height:100%;pointer-events:none}.ppal__detail{grid-area:1 / 1;display:grid;grid-template-columns:minmax(0,1fr) calc(var(--pw, 27rem) + 14rem) minmax(0,1fr);align-items:center;padding:0 clamp(3.2rem,4vw,7.2rem);opacity:0;visibility:hidden;transition:opacity .35s,visibility 0s .35s}.ppal__detail.is-active{opacity:1;visibility:visible;transition:opacity .35s .1s}.ppal__detail-title,.ppal__text{margin:0;max-width:34rem}.ppal__detail-title{grid-column:1;font-family:var(--font-heading-family);font-weight:500;font-size:clamp(2.4rem,2vw,3.4rem);line-height:1.1;letter-spacing:-.01em;overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}.ppal__text{grid-column:3;justify-self:end;font-size:1.8rem;line-height:1.5;color:var(--ppal-body)}.ppal__details{--pw: 27rem}@media(max-width:991px){.ppal__wrap{grid-template-areas:"eyebrow" "title" "tabs" "details" "stage"}.ppal .ppal__title{margin-bottom:2.4rem}.ppal__stage{--pw: min(52vw, 26rem);height:calc(var(--pw) * 150 / 71.9 + 8.8rem);max-width:560px}.ppal__note{bottom:1.4rem;font-size:1.3rem}.ppal__phone{top:3.2rem}.ppal__tabs{margin:0 0 1.6rem;width:100%;max-width:560px}.ppal__tab{flex:1;padding:1.2rem .8rem;font-size:1.5rem}.ppal__bar{left:1.6rem;right:1.6rem;bottom:.5rem}.ppal__details{grid-area:details;height:auto;max-width:560px;margin-bottom:2rem;pointer-events:auto}.ppal__detail{display:block;padding:0}.ppal__detail-title,.ppal__text{max-width:none}.ppal__detail-title{display:none}.ppal__text{max-width:none;font-size:1.6rem;text-align:center}}.ppal__exit{display:none}html.ppal-lock,html.ppal-lock body{overflow:hidden}html.ppal-lock .xo-section:has(.ppal__stage.is-full){z-index:2147483000}.ppal__stage.is-full{overflow:visible}.ppal__stage.is-full .ppal__slide.is-active{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2147483000;background:#1a2a24}.ppal__stage.is-full .ppal__slide.is-active .ppal__phone{top:0;right:0;bottom:0;left:0;width:auto;height:auto;aspect-ratio:auto;transform:none;animation:none;padding:0;border-radius:0;background:#1a2a24;box-shadow:none}.ppal__stage.is-full .ppal__glass,.ppal__stage.is-full .ppal__screen{padding:0;border-radius:0}.ppal__stage.is-full .ppal__screen{transform:none;-webkit-mask-image:none;mask-image:none}.ppal__stage.is-full .ppal__status,.ppal__stage.is-full .ppal__btn{display:none}.ppal__stage.is-full .ppal__exit{position:fixed;top:calc(env(safe-area-inset-top,0px) + .8rem);right:1.2rem;z-index:2147483001;display:flex;align-items:center;justify-content:center;width:4rem;height:4rem;padding:0;border:0;border-radius:50%;cursor:pointer;background:#ffffff29;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.ppal__exit svg{width:2rem;height:2rem;fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round}
/*# sourceMappingURL=/cdn/shop/t/14/assets/pp-app-loop.css.map */
