/**
 * iOS push toast + call screen bento animations.
 * Scoped to body.pl-landing-time only.
 */
/* iOS push toast → open thread */
body.pl-landing-time .pl-time-ios-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 14px 8px 0;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-ios-anim {
    --ios-cycle: 7.5s;
    position: relative;
    width: 100%;
    max-width: 210px;
    margin: 0 auto;
    padding-top: 4px;
}

body.pl-landing-time .pl-ios-anim__phone {
    position: relative;
    width: 168px;
    height: 232px;
    margin: 22px auto 0;
    border-radius: 28px 28px 0 0;
    border: 2px solid #111;
    border-bottom: none;
    background: #111;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.06),
        0 18px 40px rgba(0, 0, 0, 0.16);
    overflow: hidden;
    z-index: 1;
}

body.pl-landing-time .pl-ios-anim__notch {
    position: absolute;
    top: 8px;
    left: 50%;
    translate: -50% 0;
    width: 56px;
    height: 14px;
    border-radius: 999px;
    background: #000;
    z-index: 5;
}

body.pl-landing-time .pl-ios-anim__status {
    position: absolute;
    top: 10px;
    left: 14px;
    right: 14px;
    z-index: 4;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 9px;
    font-weight: 650;
    color: #fff;
    letter-spacing: 0.02em;
    mix-blend-mode: normal;
    animation: plIosStatus var(--ios-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-ios-anim__status-icons {
    width: 38px;
    height: 8px;
    border-radius: 2px;
    background:
        linear-gradient(90deg,
            currentColor 0 8px,
            transparent 8px 11px,
            currentColor 11px 18px,
            transparent 18px 21px,
            currentColor 21px 38px);
    opacity: 0.9;
}

body.pl-landing-time .pl-ios-anim__home {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    animation: plIosHome var(--ios-cycle) ease-in-out 1 forwards;
    pointer-events: none;
}

body.pl-landing-time .pl-ios-anim__wallpaper {
    position: absolute;
    inset: 0;
    background: #111;
}

body.pl-landing-time .pl-ios-anim__wallpaper::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 70% 28%, rgba(255, 255, 255, 0.08), transparent 28%),
        radial-gradient(circle at 30% 70%, rgba(255, 255, 255, 0.04), transparent 35%);
}

body.pl-landing-time .pl-ios-anim__home-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px 6px;
    padding: 40px 12px 0;
}

body.pl-landing-time .pl-ios-anim__app {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    min-width: 0;
}

body.pl-landing-time .pl-ios-anim__app-icon {
    position: relative;
    width: 28px;
    height: 28px;
    border-radius: 7px;
    display: grid;
    place-items: center;
    overflow: hidden;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25);
}

body.pl-landing-time .pl-ios-anim__app--pathline .pl-ios-anim__app-icon {
    background: #fff;
}

body.pl-landing-time .pl-ios-anim__app--pathline .pl-ios-anim__app-icon img {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    object-fit: cover !important;
}

body.pl-landing-time .pl-ios-anim__app-badge {
    position: absolute;
    top: -3px;
    right: -3px;
    z-index: 2;
    min-width: 12px;
    height: 12px;
    padding: 0 3px;
    border-radius: 999px;
    background: #fff;
    color: #111;
    font-size: 7px;
    font-weight: 700;
    line-height: 12px;
    text-align: center;
    box-shadow: 0 0 0 1.5px #111;
    animation: plIosBadgePulse var(--ios-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-ios-anim__app-label {
    font-size: 6.5px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.92);
    letter-spacing: -0.01em;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

body.pl-landing-time .pl-ios-anim__app-icon--mail {
    background: #fff;
}

body.pl-landing-time .pl-ios-anim__app-icon--mail span {
    width: 14px;
    height: 10px;
    border: 1.5px solid #111;
    border-radius: 2px;
    position: relative;
}

body.pl-landing-time .pl-ios-anim__app-icon--mail span::before {
    content: "";
    position: absolute;
    top: 1px;
    left: 1px;
    right: 1px;
    height: 5px;
    border-top: 1.5px solid #111;
    border-left: 1.5px solid #111;
    transform: rotate(45deg) scale(0.72);
    transform-origin: top left;
}

body.pl-landing-time .pl-ios-anim__app-icon--maps {
    background: #2a2a2a;
}

body.pl-landing-time .pl-ios-anim__app-icon--maps span {
    width: 8px;
    height: 8px;
    border-radius: 50% 50% 50% 0;
    background: #fff;
    rotate: -45deg;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

body.pl-landing-time .pl-ios-anim__app-icon--photos {
    background: #fff;
}

body.pl-landing-time .pl-ios-anim__app-icon--photos span {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: conic-gradient(
        #111 0 25%,
        #6b7280 25% 50%,
        #d1d5db 50% 75%,
        #111 75% 100%
    );
    mask: radial-gradient(circle, transparent 28%, #000 30%);
    -webkit-mask: radial-gradient(circle, transparent 28%, #000 30%);
}

body.pl-landing-time .pl-ios-anim__app-icon--notes {
    background: #fff;
}

body.pl-landing-time .pl-ios-anim__app-icon--notes span {
    width: 12px;
    height: 2px;
    border-radius: 1px;
    background: #111;
    box-shadow: 0 4px 0 #d4d4d8, 0 8px 0 #d4d4d8;
}

body.pl-landing-time .pl-ios-anim__app-icon--calendar {
    background: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding-top: 1px;
}

body.pl-landing-time .pl-ios-anim__app-icon--calendar em {
    font-style: normal;
    font-size: 11px;
    font-weight: 700;
    color: #111;
    line-height: 1;
    letter-spacing: -0.03em;
    margin-top: 1px;
}

body.pl-landing-time .pl-ios-anim__app-icon--calendar::before {
    content: "WED";
    font-size: 5px;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: #111;
    line-height: 1;
}

body.pl-landing-time .pl-ios-anim__app-icon--camera {
    background: #2a2a2a;
}

body.pl-landing-time .pl-ios-anim__app-icon--camera span {
    width: 12px;
    height: 10px;
    border: 1.5px solid rgba(255, 255, 255, 0.9);
    border-radius: 3px;
    position: relative;
}

body.pl-landing-time .pl-ios-anim__app-icon--camera span::after {
    content: "";
    position: absolute;
    inset: 1.5px;
    border-radius: 50%;
    border: 1.5px solid rgba(255, 255, 255, 0.9);
}

body.pl-landing-time .pl-ios-anim__app-icon--settings {
    background: #6b7280;
}

body.pl-landing-time .pl-ios-anim__app-icon--settings span {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.92);
    box-shadow: inset 0 0 0 2.5px #8e8e93;
    position: relative;
}

body.pl-landing-time .pl-ios-anim__app-icon--settings span::before {
    content: "";
    position: absolute;
    inset: -3px;
    background:
        conic-gradient(from 20deg, transparent 0 28deg, #fff 28deg 48deg, transparent 48deg 90deg);
    mask: radial-gradient(circle, transparent 42%, #000 44%);
    -webkit-mask: radial-gradient(circle, transparent 42%, #000 44%);
    opacity: 0.85;
}

body.pl-landing-time .pl-ios-anim__dots {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: center;
    gap: 4px;
    margin-top: auto;
    margin-bottom: 8px;
}

body.pl-landing-time .pl-ios-anim__dots i {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.35);
}

body.pl-landing-time .pl-ios-anim__dots i:first-child {
    background: #fff;
}

body.pl-landing-time .pl-ios-anim__dock {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    gap: 8px;
    margin: 0 10px 12px;
    padding: 8px 10px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.18);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
}

body.pl-landing-time .pl-ios-anim__dock .pl-ios-anim__app-icon {
    width: 26px;
    height: 26px;
    border-radius: 7px;
}

body.pl-landing-time .pl-ios-anim__dock .pl-ios-anim__app--dock {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

body.pl-landing-time .pl-ios-anim__dock .pl-ios-anim__app--pathline .pl-ios-anim__app-icon {
    overflow: visible;
}

body.pl-landing-time .pl-ios-anim__dock .pl-ios-anim__app-badge {
    top: -4px;
    right: -4px;
    background: #155eef;
    color: #fff;
    box-shadow: 0 0 0 1.5px rgba(15, 23, 42, 0.9);
}

body.pl-landing-time .pl-ios-anim__app-icon--phone {
    background: #111;
}

body.pl-landing-time .pl-ios-anim__app-icon--phone span {
    width: 10px;
    height: 10px;
    border-radius: 3px 3px 2px 8px;
    background: #fff;
    rotate: -25deg;
}

body.pl-landing-time .pl-ios-anim__app-icon--safari {
    background: #fff;
}

body.pl-landing-time .pl-ios-anim__app-icon--safari span {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 1.5px solid #111;
    background:
        linear-gradient(135deg, transparent 44%, #111 44% 56%, transparent 56%),
        linear-gradient(45deg, transparent 44%, #6b7280 44% 56%, transparent 56%);
}

body.pl-landing-time .pl-ios-anim__app-icon--messages {
    background: #111;
}

body.pl-landing-time .pl-ios-anim__app-icon--messages span {
    width: 12px;
    height: 9px;
    border-radius: 8px;
    background: #fff;
    position: relative;
}

body.pl-landing-time .pl-ios-anim__app-icon--messages span::after {
    content: "";
    position: absolute;
    left: 2px;
    bottom: -3px;
    width: 5px;
    height: 5px;
    background: #fff;
    clip-path: polygon(0 0, 100% 0, 0 100%);
}

body.pl-landing-time .pl-ios-anim__app-icon--music {
    background: #2a2a2a;
}

body.pl-landing-time .pl-ios-anim__app-icon--music span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    border: 1.5px solid #fff;
    position: relative;
    margin-top: 3px;
    margin-right: 4px;
}

body.pl-landing-time .pl-ios-anim__app-icon--music span::before {
    content: "";
    position: absolute;
    left: 5px;
    bottom: 5px;
    width: 1.5px;
    height: 10px;
    background: #fff;
    border-radius: 1px;
}

body.pl-landing-time .pl-ios-anim__app-icon--music span::after {
    content: "";
    position: absolute;
    left: 5px;
    bottom: 13px;
    width: 6px;
    height: 4px;
    background: #fff;
    border-radius: 1px 2px 0 0;
    transform: skewX(-18deg);
}

/* Non-Pathline icons: blank skeletons only */
body.pl-landing-time .pl-ios-anim__app-icon:not(:has(img)),
body.pl-landing-time .pl-ios-anim__dock > .pl-ios-anim__app-icon {
    background: rgba(255, 255, 255, 0.22) !important;
    box-shadow: none;
}

body.pl-landing-time .pl-ios-anim__app-icon:not(:has(img)) > *,
body.pl-landing-time .pl-ios-anim__app-icon:not(:has(img))::before,
body.pl-landing-time .pl-ios-anim__app-icon:not(:has(img))::after,
body.pl-landing-time .pl-ios-anim__dock > .pl-ios-anim__app-icon > *,
body.pl-landing-time .pl-ios-anim__dock > .pl-ios-anim__app-icon::before,
body.pl-landing-time .pl-ios-anim__dock > .pl-ios-anim__app-icon::after {
    display: none !important;
}

body.pl-landing-time .pl-ios-anim__toast {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    z-index: 8;
    display: flex;
    gap: 10px;
    align-items: center;
    min-height: 54px;
    padding: 10px 12px;
    border-radius: 16px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.04),
        0 14px 36px rgba(0, 0, 0, 0.16);
    color: #111;
    opacity: 0;
    transform: translateY(-130%) scale(0.98);
    animation: plIosToast var(--ios-cycle) cubic-bezier(0.16, 1, 0.3, 1) 1 forwards;
    transform-origin: top center;
}

body.pl-landing-time .pl-ios-anim__toast-icon {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    border-radius: 9px;
    background: #fff;
    display: grid;
    place-items: center;
    overflow: hidden;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
}

body.pl-landing-time .pl-ios-anim__toast-icon img {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    object-fit: cover !important;
}

body.pl-landing-time .pl-ios-anim__toast-body {
    min-width: 0;
    flex: 1;
    padding-top: 0;
}

body.pl-landing-time .pl-ios-anim__toast-top {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 6px;
    margin-bottom: 1px;
}

body.pl-landing-time .pl-ios-anim__toast-top strong {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: #6b7280;
}

body.pl-landing-time .pl-ios-anim__toast-top em {
    font-style: normal;
    font-size: 9px;
    font-weight: 600;
    color: #9ca3af;
}

body.pl-landing-time .pl-ios-anim__toast-title {
    margin: 0 !important;
    font-size: 12px;
    font-weight: 650;
    letter-spacing: -0.02em;
    line-height: 1.2;
    color: #111;
}

body.pl-landing-time .pl-ios-anim__toast-copy {
    margin: 1px 0 0 !important;
    font-size: 11px;
    line-height: 1.3;
    color: #6b7280;
}

body.pl-landing-time .pl-ios-anim__thread {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: flex;
    flex-direction: column;
    background: #fff;
    opacity: 0;
    transform: translateY(12px) scale(0.98);
    animation: plIosThread var(--ios-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
    pointer-events: none;
}

body.pl-landing-time .pl-ios-anim__thread-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 28px 10px 10px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    background: #fafafa;
}

body.pl-landing-time .pl-ios-anim__back {
    width: 8px;
    height: 8px;
    border-left: 2px solid #111;
    border-bottom: 2px solid #111;
    rotate: 45deg;
    margin-left: 4px;
}

body.pl-landing-time .pl-ios-anim__thread-who {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

body.pl-landing-time .pl-ios-anim__thread-who strong {
    font-size: 11px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
    line-height: 1.2;
}

body.pl-landing-time .pl-ios-anim__thread-who span {
    font-size: 9px;
    font-weight: 500;
    color: #6b7280;
}

body.pl-landing-time .pl-ios-anim__bubbles {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 7px;
    padding: 12px 10px;
    overflow: hidden;
}

body.pl-landing-time .pl-ios-anim__sys {
    align-self: center;
    padding: 3px 8px;
    border-radius: 999px;
    background: #f3f4f6;
    color: #6b7280;
    font-size: 8px;
    font-weight: 600;
    opacity: 0;
    animation: plIosBubble1 var(--ios-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-ios-anim__bubble {
    max-width: 88%;
    padding: 7px 9px;
    border-radius: 14px;
    font-size: 10px;
    line-height: 1.35;
    letter-spacing: -0.01em;
    opacity: 0;
    transform: translateY(8px) scale(0.96);
}

body.pl-landing-time .pl-ios-anim__bubble--in {
    align-self: flex-start;
    background: #f2f2f7;
    color: #111;
    border-bottom-left-radius: 4px;
    animation: plIosBubble2 var(--ios-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-ios-anim__bubble-row {
    display: flex;
    align-items: flex-end;
    gap: 5px;
    max-width: 100%;
    opacity: 0;
    transform: translateY(8px) scale(0.96);
    animation: plIosBubble3 var(--ios-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-ios-anim__bubble-row--out {
    align-self: flex-end;
    flex-direction: row;
}

body.pl-landing-time .pl-ios-anim__bubble--out {
    max-width: none;
    background: #155eef;
    color: #fff;
    border-bottom-right-radius: 4px;
    animation: none;
    opacity: 1;
    transform: none;
}

body.pl-landing-time .pl-ios-anim__bubble-actor {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #155eef;
    color: #fff;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1;
}

body.pl-landing-time .pl-ios-anim__composer {
    margin: 0 8px 10px;
    padding: 7px 11px;
    border-radius: 999px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background: #fff;
    font-size: 10px;
    color: #9ca3af;
    opacity: 0;
    animation: plIosComposer var(--ios-cycle) ease-out 1 forwards;
}

@keyframes plIosToast {
    0%, 6% {
        opacity: 0;
        transform: translateY(-140%) scale(0.94);
        box-shadow:
            0 1px 2px rgba(0, 0, 0, 0.04),
            0 14px 36px rgba(0, 0, 0, 0.16);
    }
    12% {
        opacity: 1;
        transform: translateY(0) scale(1.02);
        box-shadow:
            0 2px 4px rgba(0, 0, 0, 0.06),
            0 18px 44px rgba(0, 0, 0, 0.2);
    }
    16% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
    34% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
    38% {
        opacity: 1;
        transform: translateY(3px) scale(0.985);
    }
    44% {
        opacity: 0;
        transform: translateY(-18px) scale(0.92);
    }
    100% {
        opacity: 0;
        transform: translateY(-140%) scale(0.94);
    }
}

@keyframes plIosHome {
    0%, 42% { opacity: 1; }
    48%, 100% { opacity: 0; }
}

@keyframes plIosStatus {
    0%, 42% { color: #fff; }
    48%, 100% { color: #111; }
}

@keyframes plIosBadgePulse {
    0%, 10% { transform: scale(0.7); opacity: 0; }
    16%, 42% { transform: scale(1); opacity: 1; }
    48%, 100% { transform: scale(1); opacity: 0; }
}

@keyframes plIosThread {
    0%, 42% {
        opacity: 0;
        transform: translateY(16px) scale(0.98);
    }
    48%, 100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes plIosBubble1 {
    0%, 50% { opacity: 0; }
    54%, 100% { opacity: 1; }
}

@keyframes plIosBubble2 {
    0%, 54% {
        opacity: 0;
        transform: translateY(8px) scale(0.96);
    }
    60%, 100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes plIosBubble3 {
    0%, 64% {
        opacity: 0;
        transform: translateY(8px) scale(0.96);
    }
    70%, 100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes plIosComposer {
    0%, 68% { opacity: 0; }
    74%, 100% { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-ios-anim__toast,
    body.pl-landing-time .pl-ios-anim__home,
    body.pl-landing-time .pl-ios-anim__status,
    body.pl-landing-time .pl-ios-anim__app-badge,
    body.pl-landing-time .pl-ios-anim__thread,
    body.pl-landing-time .pl-ios-anim__sys,
    body.pl-landing-time .pl-ios-anim__bubble,
    body.pl-landing-time .pl-ios-anim__bubble-row,
    body.pl-landing-time .pl-ios-anim__composer {
        animation: none !important;
    }

    body.pl-landing-time .pl-ios-anim__home {
        opacity: 0;
    }

    body.pl-landing-time .pl-ios-anim__status {
        color: #111;
    }

    body.pl-landing-time .pl-ios-anim__toast {
        opacity: 0;
    }

    body.pl-landing-time .pl-ios-anim__thread,
    body.pl-landing-time .pl-ios-anim__sys,
    body.pl-landing-time .pl-ios-anim__bubble,
    body.pl-landing-time .pl-ios-anim__bubble-row,
    body.pl-landing-time .pl-ios-anim__composer {
        opacity: 1;
        transform: none;
    }
}

/* iOS call variant — incoming → answer → connected */
body.pl-landing-time .pl-ios-anim--call {
    --ios-cycle: 8s;
}

body.pl-landing-time .pl-ios-anim--call .pl-ios-anim__toast {
    animation-name: plIosCallToast;
}

body.pl-landing-time .pl-ios-anim--call .pl-ios-anim__home {
    animation-name: plIosCallHome;
}

body.pl-landing-time .pl-ios-anim--call .pl-ios-anim__status {
    animation-name: plIosCallStatus;
}

body.pl-landing-time .pl-ios-anim__home-grid--call {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    padding-top: 46px;
}

body.pl-landing-time .pl-ios-call-in,
body.pl-landing-time .pl-ios-call-live {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    pointer-events: none;
}

body.pl-landing-time .pl-ios-call-in {
    padding: 34px 12px 16px;
    background:
        radial-gradient(circle at 50% 18%, rgba(255, 255, 255, 0.08), transparent 42%),
        linear-gradient(180deg, #1a1a1a 0%, #0a0a0a 100%);
    color: #fff;
    opacity: 0;
    animation: plIosCallIn var(--ios-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-ios-call-in__rings {
    position: absolute;
    top: 52px;
    left: 50%;
    width: 58px;
    height: 58px;
    translate: -50% 0;
    pointer-events: none;
}

body.pl-landing-time .pl-ios-call-in__rings i {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 1.5px solid rgba(255, 255, 255, 0.22);
    opacity: 0;
    animation: plIosCallRing var(--ios-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-ios-call-in__rings i:nth-child(2) { animation-delay: 0.22s; }
body.pl-landing-time .pl-ios-call-in__rings i:nth-child(3) { animation-delay: 0.44s; }

body.pl-landing-time .pl-ios-call-in__av {
    position: relative;
    z-index: 1;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #fff;
    color: #111;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: -0.03em;
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.2);
    animation: plIosCallAvPulse var(--ios-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-ios-call-in__name {
    margin-top: 10px;
    font-size: 13px;
    font-weight: 650;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

body.pl-landing-time .pl-ios-call-in__sub {
    margin-top: 2px;
    font-size: 8px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.52);
}

body.pl-landing-time .pl-ios-call-in__label {
    margin-top: 6px;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.62);
    animation: plIosCallLabelPulse 1.2s ease-in-out infinite;
}

body.pl-landing-time .pl-ios-call-in__actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 28px;
    margin-top: auto;
    padding-bottom: 4px;
}

body.pl-landing-time .pl-ios-call-in__btn {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    position: relative;
}

body.pl-landing-time .pl-ios-call-in__btn--decline {
    background: #ef4444;
    box-shadow: 0 8px 18px rgba(239, 68, 68, 0.28);
}

body.pl-landing-time .pl-ios-call-in__btn--decline::before,
body.pl-landing-time .pl-ios-call-in__btn--decline::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 14px;
    height: 2px;
    background: #fff;
    border-radius: 1px;
}

body.pl-landing-time .pl-ios-call-in__btn--decline::before {
    rotate: 45deg;
    translate: -50% -50%;
}

body.pl-landing-time .pl-ios-call-in__btn--decline::after {
    rotate: -45deg;
    translate: -50% -50%;
}

body.pl-landing-time .pl-ios-call-in__btn--accept {
    background: #22c55e;
    box-shadow: 0 8px 18px rgba(34, 197, 94, 0.28);
    animation: plIosCallAcceptPulse var(--ios-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-ios-call-in__btn--accept::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 13px;
    height: 13px;
    translate: -48% -58%;
    border: 2px solid #fff;
    border-radius: 3px;
    rotate: -35deg;
}

body.pl-landing-time .pl-ios-call-in__btn--accept::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 6px;
    height: 2px;
    translate: -20% 15%;
    background: #fff;
    border-radius: 1px;
    rotate: -35deg;
}

body.pl-landing-time .pl-ios-call-live {
    padding: 38px 12px 18px;
    background:
        radial-gradient(circle at 50% 12%, rgba(34, 197, 94, 0.12), transparent 40%),
        linear-gradient(180deg, #141414 0%, #080808 100%);
    color: #fff;
    opacity: 0;
    animation: plIosCallLive var(--ios-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-ios-call-live__av {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #22c55e;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: -0.03em;
    box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.18);
}

body.pl-landing-time .pl-ios-call-live__name {
    margin-top: 8px;
    font-size: 12px;
    font-weight: 650;
    letter-spacing: -0.02em;
}

body.pl-landing-time .pl-ios-call-live__timer {
    margin-top: 3px;
    font-size: 10px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: rgba(255, 255, 255, 0.72);
    min-height: 1em;
}

body.pl-landing-time .pl-ios-call-live__timer::after {
    content: "0:04";
    animation: plIosCallTimer var(--ios-cycle) steps(1, end) 1 forwards;
}

body.pl-landing-time .pl-ios-call-live__wave {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 3px;
    height: 18px;
    margin-top: 12px;
}

body.pl-landing-time .pl-ios-call-live__wave i {
    display: block;
    width: 3px;
    border-radius: 999px;
    background: rgba(34, 197, 94, 0.85);
    animation: plIosCallWaveBar 0.9s ease-in-out infinite;
}

body.pl-landing-time .pl-ios-call-live__wave i:nth-child(1) { height: 6px; animation-delay: 0s; }
body.pl-landing-time .pl-ios-call-live__wave i:nth-child(2) { height: 10px; animation-delay: 0.08s; }
body.pl-landing-time .pl-ios-call-live__wave i:nth-child(3) { height: 14px; animation-delay: 0.16s; }
body.pl-landing-time .pl-ios-call-live__wave i:nth-child(4) { height: 9px; animation-delay: 0.24s; }
body.pl-landing-time .pl-ios-call-live__wave i:nth-child(5) { height: 7px; animation-delay: 0.32s; }

body.pl-landing-time .pl-ios-call-live__badge {
    margin-top: 8px;
    padding: 3px 8px;
    border-radius: 999px;
    background: rgba(34, 197, 94, 0.16);
    color: #86efac;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

body.pl-landing-time .pl-ios-call-live__end {
    margin-top: auto;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #ef4444;
    box-shadow: 0 8px 18px rgba(239, 68, 68, 0.24);
    position: relative;
}

body.pl-landing-time .pl-ios-call-live__end::before,
body.pl-landing-time .pl-ios-call-live__end::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 14px;
    height: 2px;
    background: #fff;
    border-radius: 1px;
}

body.pl-landing-time .pl-ios-call-live__end::before {
    rotate: 45deg;
    translate: -50% -50%;
}

body.pl-landing-time .pl-ios-call-live__end::after {
    rotate: -45deg;
    translate: -50% -50%;
}

@keyframes plIosCallToast {
    0%, 6% {
        opacity: 0;
        transform: translateY(-140%) scale(0.94);
    }
    12%, 16% {
        opacity: 1;
        transform: translateY(0) scale(1.02);
    }
    20%, 28% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
    34% {
        opacity: 0;
        transform: translateY(-18px) scale(0.92);
    }
    100% {
        opacity: 0;
        transform: translateY(-140%) scale(0.94);
    }
}

@keyframes plIosCallHome {
    0%, 30% { opacity: 1; }
    36%, 100% { opacity: 0; }
}

@keyframes plIosCallStatus {
    0%, 30% { color: #fff; }
    36%, 54% { color: #fff; }
    58%, 100% { color: #fff; }
}

@keyframes plIosCallIn {
    0%, 32% {
        opacity: 0;
        transform: scale(1.02);
    }
    38%, 54% {
        opacity: 1;
        transform: scale(1);
    }
    58% {
        opacity: 1;
        transform: scale(0.98);
    }
    62%, 100% {
        opacity: 0;
        transform: scale(0.96);
    }
}

@keyframes plIosCallLive {
    0%, 60% {
        opacity: 0;
        transform: translateY(8px);
    }
    66%, 100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes plIosCallRing {
    0%, 38% { opacity: 0; transform: scale(0.6); }
    44% { opacity: 0.55; transform: scale(0.85); }
    56% { opacity: 0; transform: scale(1.45); }
    100% { opacity: 0; transform: scale(1.45); }
}

@keyframes plIosCallAvPulse {
    0%, 38% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.2); }
    44%, 54% { box-shadow: 0 0 0 6px rgba(255, 255, 255, 0); }
    100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); }
}

@keyframes plIosCallAcceptPulse {
    0%, 48% { transform: scale(1); box-shadow: 0 8px 18px rgba(34, 197, 94, 0.28); }
    52% { transform: scale(1.12); box-shadow: 0 10px 24px rgba(34, 197, 94, 0.42); }
    56%, 100% { transform: scale(1); box-shadow: 0 8px 18px rgba(34, 197, 94, 0.28); }
}

@keyframes plIosCallLabelPulse {
    0%, 100% { opacity: 0.55; }
    50% { opacity: 1; }
}

@keyframes plIosCallTimer {
    0%, 66% { content: "0:01"; }
    72% { content: "0:02"; }
    78% { content: "0:03"; }
    84%, 100% { content: "0:04"; }
}

@keyframes plIosCallWaveBar {
    0%, 100% { transform: scaleY(0.55); opacity: 0.55; }
    50% { transform: scaleY(1); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-ios-anim--call .pl-ios-call-in,
    body.pl-landing-time .pl-ios-anim--call .pl-ios-call-live,
    body.pl-landing-time .pl-ios-anim--call .pl-ios-call-in__rings i,
    body.pl-landing-time .pl-ios-anim--call .pl-ios-call-in__av,
    body.pl-landing-time .pl-ios-anim--call .pl-ios-call-in__btn--accept,
    body.pl-landing-time .pl-ios-anim--call .pl-ios-call-in__label,
    body.pl-landing-time .pl-ios-anim--call .pl-ios-call-live__wave i {
        animation: none !important;
    }

    body.pl-landing-time .pl-ios-anim--call .pl-ios-anim__home {
        opacity: 0;
    }

    body.pl-landing-time .pl-ios-anim--call .pl-ios-call-in {
        opacity: 0;
    }

    body.pl-landing-time .pl-ios-anim--call .pl-ios-call-live {
        opacity: 1;
        transform: none;
    }
}