/* TimeVyn hero + PWA splash — katmanlı logo (tek kaynak).
   Boyut / offset ayarı için bu dosyayı düzenle. */
:root {
    --tvyn-landing-logo-size: clamp(180px, 20vw, 240px);
    --tvyn-landing-spiral-offset-x: 15px;
    --tvyn-landing-spiral-offset-y: 1px;
    --tvyn-landing-spiral-origin-x: 46.9%;
    --tvyn-landing-spiral-origin-y: 35.4%;
    --tvyn-landing-spiral-scale: 0.23;
    --tvyn-landing-spiral-spin: 6s;
    --tvyn-landing-text-shift-y: clamp(8px, 1.3vw, 16px);
    --tvyn-landing-text-scale: 1.23;
    --tvyn-landing-text-shift-y-mobile: clamp(7px, 2.6vw, 12px);
    --tvyn-landing-text-scale-mobile: 1.16;
    /* "A profile like this" — cümle sonu nokta gibi spiral */
    --tvyn-landing-profile-mark-size: 0.82em;
    --tvyn-landing-profile-mark-shift-y: 0.34em;
    --tvyn-landing-profile-spiral-offset-x: 0px;
    --tvyn-landing-profile-spiral-offset-y: 0px;
    --tvyn-landing-profile-spiral-scale: 2.1;
    --tvyn-landing-profile-spiral-origin-x: 50%;
    --tvyn-landing-profile-spiral-origin-y: 50%;

    /* My TimeVyn wallet modal — header logo */
    --tvyn-wallet-modal-logo-size: 2.5rem;
    --tvyn-wallet-modal-logo-size-sm: 3.5rem;
    --tvyn-wallet-modal-text-padding: 0.125rem;
    --tvyn-wallet-modal-text-shift-y: 0px;
    --tvyn-wallet-modal-text-scale: 1;
    --tvyn-wallet-modal-spiral-offset-x: 3px;
    --tvyn-wallet-modal-spiral-offset-y: -4px;
    --tvyn-wallet-modal-spiral-scale: 0.28;
    --tvyn-wallet-modal-spiral-origin-x: 46.9%;
    --tvyn-wallet-modal-spiral-origin-y: 35.4%;

    /* Messages / ChatList header logo */
    --tvyn-chatlist-logo-size: 1.75rem;
    --tvyn-chatlist-text-shift-y: 0px;
    --tvyn-chatlist-text-scale: 1;
    --tvyn-chatlist-spiral-offset-x: 1px;
    --tvyn-chatlist-spiral-offset-y: 0px;
    --tvyn-chatlist-spiral-scale: 0.26;
    --tvyn-chatlist-spiral-origin-x: 46.9%;
    --tvyn-chatlist-spiral-origin-y: 35.4%;
    --tvyn-chatlist-logo-fade-duration: 2.8s;
}

@keyframes tvynEmbeddedWalletHeartbeat {
    0%,
    100% {
        transform: scale(1);
    }
    14% {
        transform: scale(1.14);
    }
    28% {
        transform: scale(0.98);
    }
    42% {
        transform: scale(1.08);
    }
    70% {
        transform: scale(1);
    }
}

.tvyn-wallet-modal-logo-wrap {
    position: relative;
    width: var(--tvyn-wallet-modal-logo-size, 2.5rem);
    height: var(--tvyn-wallet-modal-logo-size, 2.5rem);
    flex-shrink: 0;
}

@media (min-width: 640px) {
    .tvyn-wallet-modal-logo-wrap {
        width: var(--tvyn-wallet-modal-logo-size-sm, 3.5rem);
        height: var(--tvyn-wallet-modal-logo-size-sm, 3.5rem);
    }
}

.tvyn-wallet-modal-logo {
    position: relative;
    width: 100%;
    height: 100%;
}

.tvyn-wallet-modal-logo__text {
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: var(--tvyn-wallet-modal-text-padding, 0.125rem);
    transform: translateY(var(--tvyn-wallet-modal-text-shift-y, 0))
        scale(var(--tvyn-wallet-modal-text-scale, 1));
    transform-origin: center;
    pointer-events: none;
    user-select: none;
}

.tvyn-wallet-modal-logo__orb {
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    transform: translate3d(
            var(--tvyn-wallet-modal-spiral-offset-x, 0px),
            var(--tvyn-wallet-modal-spiral-offset-y, 0px),
            0
        )
        scale(var(--tvyn-wallet-modal-spiral-scale, 0.28));
    transform-origin: var(--tvyn-wallet-modal-spiral-origin-x, 46.9%)
        var(--tvyn-wallet-modal-spiral-origin-y, 35.4%);
}

.tvyn-wallet-modal-logo__spiral {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: var(--tvyn-wallet-modal-text-padding, 0.125rem);
    transform-origin: var(--tvyn-wallet-modal-spiral-origin-x, 46.9%)
        var(--tvyn-wallet-modal-spiral-origin-y, 35.4%);
    animation: tvynEmbeddedWalletHeartbeat 1.45s ease-in-out infinite;
    pointer-events: none;
    user-select: none;
}

@keyframes tvynChatListLogoFade {
    0%,
    100% {
        opacity: 1;
    }
    42% {
        opacity: 1;
    }
    52% {
        opacity: 0.06;
    }
    62% {
        opacity: 0.06;
    }
    72% {
        opacity: 1;
    }
}

.tvyn-chatlist-logo-btn {
    display: inline-flex;
    border: 0;
    background: transparent;
    padding: 0;
    cursor: pointer;
    line-height: 0;
}

.tvyn-chatlist-logo {
    position: relative;
    display: block;
    width: var(--tvyn-chatlist-logo-size, 1.75rem);
    height: var(--tvyn-chatlist-logo-size, 1.75rem);
    flex-shrink: 0;
}

.tvyn-chatlist-logo__text {
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: contain;
    transform: translateY(var(--tvyn-chatlist-text-shift-y, 0))
        scale(var(--tvyn-chatlist-text-scale, 1));
    transform-origin: center;
    pointer-events: none;
    user-select: none;
}

.tvyn-chatlist-logo__orb {
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    transform: translate3d(
            var(--tvyn-chatlist-spiral-offset-x, 0px),
            var(--tvyn-chatlist-spiral-offset-y, 0px),
            0
        )
        scale(var(--tvyn-chatlist-spiral-scale, 0.26));
    transform-origin: var(--tvyn-chatlist-spiral-origin-x, 46.9%)
        var(--tvyn-chatlist-spiral-origin-y, 35.4%);
    animation: tvynChatListLogoFade var(--tvyn-chatlist-logo-fade-duration, 2.8s)
        ease-in-out infinite;
    will-change: opacity;
}

.tvyn-chatlist-logo__spiral {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    transform-origin: var(--tvyn-chatlist-spiral-origin-x, 46.9%)
        var(--tvyn-chatlist-spiral-origin-y, 35.4%);
    pointer-events: none;
    user-select: none;
}

@media (prefers-reduced-motion: reduce) {
    .tvyn-chatlist-logo__orb {
        animation: none;
        opacity: 1;
    }
}
