/* Dark Premium — OnlyFans/Fansly model aesthetic */
/* Black bg, pink-gold accents, animated gradient borders, premium glow */

/* Background — fallback color only, no !important so bg-image from inline style wins */
.scene {
    background-color: #0a0a0a;
}

/* When bg image is set — light overlay, no blur, image must be visible */
.scene::after {
    background: rgba(0, 0, 0, 0.25) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.orb-1 { background: #ff6b9d !important; opacity: 0.25 !important; }
.orb-2 { background: #fbbf24 !important; opacity: 0.15 !important; }
.orb-3 { background: #c084fc !important; opacity: 0.12 !important; }

.particle { background: rgba(255, 107, 157, 0.35) !important; }

/* Glass card — darker, more blur */
.card {
    background: rgba(15, 5, 25, 0.65) !important;
    backdrop-filter: blur(40px) saturate(200%) !important;
    -webkit-backdrop-filter: blur(40px) saturate(200%) !important;
    border: 1px solid rgba(255, 107, 157, 0.12) !important;
    box-shadow:
        0 16px 60px rgba(0,0,0,0.6),
        0 0 100px rgba(255,107,157,0.06),
        inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

/* Avatar ring — pink-gold */
.ava-ring {
    background: conic-gradient(from 0deg, #ff6b9d, #fbbf24, #c084fc, #ff6b9d) !important;
    box-shadow: 0 0 25px rgba(255, 107, 157, 0.35) !important;
}
.ava-img, .ava-letter { border-color: #0a0608 !important; }

/* Name — gradient text */
.name {
    background: linear-gradient(135deg, #fff 0%, #ffd4e5 50%, #fbbf24 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-size: 1.5rem !important;
}

.bio { color: rgba(255, 255, 255, 0.4) !important; }

/* Socials — pink glow */
.soc {
    background: rgba(255, 107, 157, 0.08) !important;
    border: 1px solid rgba(255, 107, 157, 0.12) !important;
    color: rgba(255, 255, 255, 0.65) !important;
    border-radius: 50% !important;
}
.soc:hover {
    background: rgba(255, 107, 157, 0.2) !important;
    box-shadow: 0 0 20px rgba(255, 107, 157, 0.35) !important;
    color: #fff !important;
    transform: translateY(-3px) scale(1.1) !important;
}

/* ===== LINK BUTTONS — PREMIUM GRADIENT BORDER ===== */
.lnk {
    position: relative !important;
    background: rgba(15, 5, 25, 0.6) !important;
    border: none !important;
    border-radius: 16px !important;
    padding: 15px 20px !important;
    overflow: hidden !important;
    isolation: isolate !important;
}

/* Animated gradient border via pseudo-element */
.lnk::after {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    border-radius: 16px !important;
    padding: 1.5px !important;
    background: linear-gradient(135deg,
        rgba(255,107,157,0.4),
        rgba(192,132,252,0.3),
        rgba(251,191,36,0.2),
        rgba(255,107,157,0.4)
    ) !important;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0) !important;
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0) !important;
    -webkit-mask-composite: xor !important;
    mask-composite: exclude !important;
    opacity: 0.6 !important;
    transition: opacity 0.3s !important;
    z-index: -1 !important;
}

.lnk:hover::after {
    opacity: 1 !important;
}

.lnk::before {
    background: linear-gradient(135deg, rgba(255,107,157,0.12), rgba(192,132,252,0.08)) !important;
}

.lnk:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 30px rgba(255, 107, 157, 0.2), 0 0 60px rgba(255,107,157,0.05) !important;
}
.lnk:hover::before { opacity: 1 !important; }

/* Platform icon glow */
.lnk-icon {
    filter: drop-shadow(0 0 6px currentColor) !important;
}

/* ===== FIRST LINK = VIP GOLD ===== */
.lnk:first-child {
    background: linear-gradient(135deg, rgba(251,191,36,0.12), rgba(245,158,11,0.08)) !important;
}
.lnk:first-child::after {
    background: linear-gradient(135deg,
        rgba(251,191,36,0.6),
        rgba(255,107,157,0.4),
        rgba(251,191,36,0.6)
    ) !important;
    opacity: 0.8 !important;
    animation: borderRotate 4s linear infinite !important;
    background-size: 300% 300% !important;
}
@keyframes borderRotate {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}
.lnk:first-child::before {
    background: linear-gradient(135deg, rgba(251,191,36,0.15), rgba(245,158,11,0.1)) !important;
    opacity: 0.5 !important;
}
.lnk:first-child:hover {
    box-shadow: 0 8px 40px rgba(251, 191, 36, 0.25), 0 0 80px rgba(251,191,36,0.08) !important;
}
.lnk:first-child .lnk-icon {
    filter: drop-shadow(0 0 8px rgba(251,191,36,0.6)) !important;
}

/* Arrow — pink */
.lnk-arrow { color: rgba(255, 107, 157, 0.4) !important; }
.lnk:hover .lnk-arrow { color: rgba(255, 107, 157, 0.8) !important; }
.lnk:first-child .lnk-arrow { color: rgba(251, 191, 36, 0.4) !important; }
.lnk:first-child:hover .lnk-arrow { color: rgba(251, 191, 36, 0.8) !important; }

.foot { color: rgba(255, 107, 157, 0.12) !important; }