/* 白纸盒：盖子靠在一边，iPad 缓缓放入，合盖后出字 */

.pq-gift {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: none;
    align-items: center;
    justify-content: center;
    background: var(--lg-page);
}
.pq-gift.is-on { display: flex; }

.pq-gift-stage {
    width: min(260px, 80vw);
    text-align: center;
}

.pq-gift-svg {
    width: 220px;
    height: 166px;
    display: block;
    margin: 0 auto;
    overflow: visible;
}

.pack-shadow { fill: rgba(15, 23, 42, 0.12); }

.pack-box-outer {
    fill: #ffffff;
    stroke: #cbd5e1;
    stroke-width: 2;
}
.pack-box-well { fill: #e2e8f0; }

.pack-lid-face {
    fill: #ffffff;
    stroke: #cbd5e1;
    stroke-width: 2;
}

.pack-ipad-body { fill: #0f172a; }
.pack-ipad-screen { fill: #f8fafc; }
.pack-ipad-cam { fill: #94a3b8; }

.pack-lid {
    transform-origin: 190px 83px;
    transform: rotate(68deg);
}
.pack-ipad {
    transform-origin: 120px 118px;
    transform: translate3d(0, -52px, 0);
    opacity: 0;
}

.pq-gift.is-drop .pack-ipad {
    animation: packDrop 1.12s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
.pq-gift.is-close .pack-lid {
    animation: packLidClose 0.56s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.pq-gift-copy {
    margin: 14px 0 0;
    min-height: 1.25em;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.03em;
    color: var(--lg-ink);
    opacity: 0;
    transform: translate3d(0, 8px, 0);
}
.pq-gift-copy.is-in {
    animation: packCopyIn 0.32s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
.pq-gift.is-exit .pq-gift-stage {
    animation: packExit 0.32s cubic-bezier(0.32, 0.72, 0, 1) forwards;
}

@keyframes packDrop {
    to { transform: none; opacity: 1; }
}
@keyframes packLidClose {
    to { transform: none; }
}
@keyframes packCopyIn {
    to { opacity: 1; transform: none; }
}
@keyframes packExit {
    to { opacity: 0; transform: translate3d(0, -12px, 0); }
}

@media (prefers-reduced-motion: reduce) {
    .pack-ipad,
    .pack-lid { transform: none; opacity: 1; }
    .pq-gift.is-drop .pack-ipad,
    .pq-gift.is-close .pack-lid,
    .pq-gift-copy.is-in,
    .pq-gift.is-exit .pq-gift-stage { animation: none; }
    .pq-gift-copy { opacity: 1; transform: none; }
}