@layer properties,theme,base;@layer components{.pp [data-offscreen] :not(.pp-rise,.pp-reveal,.pp-grow,.pp-draw),.pp [data-offscreen] :before,.pp [data-offscreen] :after{animation-play-state:paused}.pp:has(.motion-pause:checked) *{animation-play-state:paused}.pp:has(.motion-pause:checked) :before{animation-play-state:paused}.pp:has(.motion-pause:checked) :after{animation-play-state:paused}.pp:has(.motion-pause:checked) :is(.pp-board *,.pp-reveal,.pp-grow,.pp-draw){animation:none}.pp .motion-toggle:has(:focus-visible){outline:3px solid var(--color-focus);outline-offset:2px}.pp-rise{animation:.8s cubic-bezier(.2,.7,.2,1) both pp-rise}.pp-rise-2{animation-delay:.12s}.pp-rise-3{animation-delay:.2s}.pp-rise-4{animation-delay:.3s}.pp-on-dark{--color-ink:var(--color-on-ink)}.pp-crumbs{--color-ink:var(--color-on-ink);--color-ink-muted:var(--color-on-dark);--color-line-strong:var(--color-on-ink-faint)}.pp-visual{perspective:1600px;height:560px;margin-inline:-20px;position:relative;overflow:hidden}.pp-rings{width:0;height:0;position:absolute;top:50%;left:50%}.pp-rings>span{border:1px solid color-mix(in srgb, var(--color-on-ink) 7%, transparent);border-radius:50%;position:absolute;top:0;left:0;transform:translate(-50%,-50%)}.pp-rings>.pp-ring-1{width:380px;height:380px}.pp-rings>.pp-ring-2{width:560px;height:560px}.pp-rings>.pp-ring-3{width:740px;height:740px}.pp-rings>.pp-pulse{border:1.5px solid var(--color-brand);opacity:.3;width:600px;height:600px;animation:3.6s cubic-bezier(.2,.6,.3,1) infinite pp-ring}.pp-rings>.pp-pulse+.pp-pulse{animation-delay:1.8s}.pp-board{background:var(--color-surface);width:310px;color:var(--color-ink);box-shadow:var(--shadow-phone);border-radius:28px;margin:-190px 0 0 -155px;padding:20px;position:absolute;top:50%;left:50%;transform:rotateY(-11deg)rotateX(5deg)rotate(2deg)}.pp-board-code{border:1.5px dashed var(--color-line-strong);background:var(--color-surface-muted);border-radius:16px;justify-content:space-between;align-items:center;gap:12px;margin-top:16px;padding:12px 12px 12px 16px;display:flex;position:relative}.pp-copy{background:var(--color-ink);width:38px;height:38px;color:var(--color-on-ink);border-radius:12px;place-items:center;display:grid;position:relative}.pp-copied{background:var(--color-brand-text);color:var(--color-on-brand);white-space:nowrap;opacity:0;border-radius:9999px;padding:5px 10px;animation:9s ease-out infinite pp-copied;position:absolute;bottom:calc(100% + 8px);right:-6px}.pp-track{background:var(--color-track);border-radius:9999px;height:8px;margin-top:8px;overflow:hidden}.pp-bar{border-radius:inherit;background:var(--color-brand);transform-origin:0;height:100%;animation:9s cubic-bezier(.4,0,.2,1) infinite pp-progress}.pp-feed>li{border-top:1px solid var(--color-line);align-items:center;gap:10px;padding-block:9px;display:flex}.pp-feed>li:first-child{animation:9s ease-out infinite pp-feed-1}.pp-feed>li:nth-child(2){animation:9s ease-out infinite pp-feed-2}.pp-feed>li:nth-child(3){animation:9s ease-out infinite pp-feed-3}.pp-feed-icon{background:var(--color-surface-blush);width:30px;height:30px;color:var(--color-brand-text);border-radius:10px;flex:none;place-items:center;display:grid}.pp-chip{z-index:3;animation:7s ease-in-out infinite pp-drift;position:absolute}.pp-chip>span{background:var(--color-surface);color:var(--color-ink);box-shadow:var(--shadow-chip);border-radius:15px;align-items:center;gap:10px;padding:10px 14px;display:flex}.pp-chip-discount{top:18px;left:16px}.pp-chip-share{animation-delay:-3.5s;bottom:14px;right:16px}.pp-chip-level{animation-delay:-1.7s;display:none}.pp-chip-level>span{background:var(--color-ink);color:var(--color-on-ink);animation:9s ease-out infinite pp-level}.pp-chip-badge{background:var(--color-brand-text);min-width:34px;height:34px;color:var(--color-on-brand);border-radius:10px;place-items:center;padding-inline:8px;display:grid}@media (min-width:60rem){.pp-visual{height:560px;margin-inline:0;overflow:visible}.pp-board{width:330px;margin:-210px 0 0 -165px;padding:24px}.pp-chip-discount{top:14%;left:-8px}.pp-chip-share{bottom:12%;right:-12px}.pp-chip-level{display:block;top:8%;right:2%}}.pp-stairs{gap:14px;display:grid}.pp-stair{border-radius:24px;flex-direction:column;justify-content:flex-end;gap:10px;padding:22px;display:flex}.pp-stair-1{border:1.5px solid var(--color-line-soft);background:var(--color-surface)}.pp-stair-3{background:var(--color-brand-text);color:var(--color-on-brand)}@media (min-width:40rem){.pp-stairs{grid-template-columns:repeat(3,minmax(0,1fr));align-items:end}.pp-stair{padding:26px}.pp-stair-1{min-height:250px}.pp-stair-2{min-height:310px}.pp-stair-3{min-height:370px}}.pp-steps{isolation:isolate;position:relative}.pp-step-dot{background:var(--color-surface);border:1.5px solid var(--color-ink);width:56px;height:56px;box-shadow:var(--shadow-step);border-radius:50%;place-items:center;display:grid}.pp-steps-line{display:none}@media (min-width:60rem){.pp-steps-line{z-index:-1;background:var(--color-brand);transform-origin:0;height:2px;display:block;position:absolute;top:28px;left:28px;right:calc(25% - 46px)}}.pp-red{background:var(--color-brand-text);color:var(--color-on-brand);--color-focus:var(--color-on-brand);--color-title-dot:var(--color-ink);--color-icon-accent:var(--color-on-brand)}.pp-fact{border:1px solid color-mix(in srgb, var(--color-on-brand) 28%, transparent);background:color-mix(in srgb, var(--color-on-brand) 8%, transparent)}@supports (animation-timeline:view()){@media (prefers-reduced-motion:no-preference){.pp-reveal{animation:linear both pp-reveal;animation-timeline:view();animation-range:entry cover 28%}.pp-reveal-2{animation-range:entry 10% cover 32%}.pp-reveal-3{animation-range:entry 20% cover 36%}.pp-reveal-4{animation-range:entry 30% cover 40%}.pp-grow{animation:linear both pp-grow;animation-timeline:view();animation-range:entry 20% cover 42%}.pp-stair-2.pp-grow{animation-range:entry 30% cover 46%}.pp-stair-3.pp-grow{animation-range:entry 40% cover 50%}.pp-draw{animation:linear both pp-draw;animation-timeline:view();animation-range:entry 30% cover 50%}}}}@layer utilities;@keyframes pp-rise{0%{opacity:0;transform:translateY(14px)}}@keyframes pp-ring{0%{opacity:.9;transform:translate(-50%,-50%)scale(.45)}to{opacity:0;transform:translate(-50%,-50%)scale(1.25)}}@keyframes pp-drift{50%{transform:translateY(-8px)}}@keyframes pp-copied{0%,3%{opacity:0;transform:translateY(6px)scale(.85)}7%,22%{opacity:1;transform:none}28%,to{opacity:0;transform:translateY(-4px)}}@keyframes pp-progress{0%,8%{transform:scaleX(.22)}55%,95%{transform:scaleX(1)}to{transform:scaleX(.22)}}@keyframes pp-feed-1{0%,6%{opacity:0;transform:translate(-12px)}10%,94%{opacity:1;transform:none}to{opacity:0}}@keyframes pp-feed-2{0%,19%{opacity:0;transform:translate(-12px)}23%,94%{opacity:1;transform:none}to{opacity:0}}@keyframes pp-feed-3{0%,32%{opacity:0;transform:translate(-12px)}36%,94%{opacity:1;transform:none}to{opacity:0}}@keyframes pp-level{0%,54%{opacity:0;transform:translateY(10px)scale(.85)}59%{opacity:1;transform:scale(1.05)}63%,94%{opacity:1;transform:none}to{opacity:0}}@keyframes pp-reveal{0%{opacity:0;transform:translateY(28px)}}@keyframes pp-grow{0%{clip-path:inset(100% 0 0 round 24px)}to{clip-path:inset(0 round 24px)}}@keyframes pp-draw{0%{transform:scaleX(0)}}