.planet-card {
    position: relative;
    min-height: 250px;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    overflow: visible;
    color: white;
}

.planet-card h3,
.planet-card p {
    position: relative;
    z-index: 3;
    margin-right: 205px !important;
}

.planet-card h3 {
    color: #ffffff;
    font-size: 24px;
}

.planet-card p {
    color: rgba(255, 255, 255, 0.75);
}

.reference-planet {
    position: absolute;
    left: 5px;
    top: 50%;
    width: 180px;
    height: 180px;
    transform: translateY(-50%);
    z-index: 2;
    filter:
        drop-shadow(0 0 10px rgba(96, 165, 250, 0.65))
        drop-shadow(0 0 26px rgba(168, 85, 247, 0.42));
}

.reference-planet-svg {
    width: 100%;
    height: 100%;
    overflow: visible;
}

.ref-outer-circle {
    fill: none;
    stroke: rgba(147, 197, 253, 0.22);
    stroke-width: 1.2;
}

.ref-grid-lines {
    fill: none;
    stroke: rgba(147, 197, 253, 0.12);
    stroke-width: 1;
}

/* نقطه‌ها حول محور عمودی */
.ref-axis-dots {
    fill: none;
    stroke: rgba(219, 234, 254, 0.9);
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-dasharray: 1 24;
    animation: axisHelixFlow 26s linear infinite;
}

.ref-axis-dots ellipse:nth-child(2) {
    stroke: rgba(96, 165, 250, 0.9);
    animation-delay: -2s;
}

.ref-axis-dots ellipse:nth-child(3) {
    stroke: rgba(168, 85, 247, 0.85);
    animation-delay: -4s;
}

.ref-axis-dots ellipse:nth-child(4) {
    animation-delay: -6s;
}

.ref-axis-dots ellipse:nth-child(5) {
    stroke: rgba(147, 197, 253, 0.85);
    animation-delay: -8s;
}

.ref-axis-dots ellipse:nth-child(6) {
    animation-delay: -10s;
}

.ref-axis-dots ellipse:nth-child(7) {
    stroke: rgba(191, 219, 254, 0.8);
    animation-delay: -12s;
}

/* فقط چند حلقه افقی کم‌رنگ، مثل مرجع */
.ref-soft-equator {
    fill: none;
    stroke: rgba(96, 165, 250, 0.65);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-dasharray: 1 28;
    opacity: 0.75;
    animation: equatorFlow 22s linear infinite reverse;
}

.ref-soft-equator ellipse:nth-child(even) {
    stroke: rgba(168, 85, 247, 0.65);
}

.ref-spiral-top,
.ref-spiral-bottom {
    fill: none;
    stroke: rgba(216, 180, 254, 0.96);
    stroke-width: 2.6;
    stroke-linecap: round;
    stroke-dasharray: 1 10;
}

.ref-spiral-top {
    filter: drop-shadow(0 0 8px rgba(168, 85, 247, 0.75));
    animation: spiralTopFlow 10s linear infinite;
}

.ref-spiral-bottom {
    filter: drop-shadow(0 0 8px rgba(96, 165, 250, 0.75));
    animation: spiralBottomFlow 10s linear infinite reverse;
}

@keyframes axisHelixFlow {
    from {
        stroke-dashoffset: 0;
    }

    to {
        stroke-dashoffset: -160;
    }
}

@keyframes equatorFlow {
    from {
        stroke-dashoffset: 0;
    }

    to {
        stroke-dashoffset: 110;
    }
}

@keyframes spiralTopFlow {
    from {
        stroke-dashoffset: 0;
    }

    to {
        stroke-dashoffset: -80;
    }
}

@keyframes spiralBottomFlow {
    from {
        stroke-dashoffset: 0;
    }

    to {
        stroke-dashoffset: 80;
    }
}