/* ---------- A közös bolygó 3D-s nézete (PlanetView): minden tag térképe egy folt a gömbön ---------- */

.planet-view {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    max-height: 70vh;
    border-radius: 12px;
    overflow: hidden;
    background: #02040a;
    touch-action: none;
    user-select: none;
    -webkit-user-select: none;
}

    .planet-view canvas {
        display: block;
        width: 100%;
        height: 100%;
        cursor: grab;
        opacity: 0;
        transition: opacity .8s ease;
    }

    .planet-view.ready canvas { opacity: 1; }
    .planet-view canvas:active { cursor: grabbing; }

    .planet-view .globe-labels {
        position: absolute;
        inset: 0;
        pointer-events: none;
        overflow: hidden;
    }

    .planet-view .pv-label {
        position: absolute;
        left: 0;
        top: 0;
        padding: 3px 8px;
        border-radius: 999px;
        border: 1px solid rgba(255, 255, 255, .35);
        background: rgba(6, 10, 22, .72);
        color: #fff;
        font-size: 12px;
        line-height: 1.2;
        white-space: nowrap;
        will-change: transform;
        transition: box-shadow .2s ease;
    }

        .planet-view .pv-label.online::before {
            content: '';
            display: inline-block;
            width: 6px;
            height: 6px;
            margin-right: 5px;
            border-radius: 50%;
            background: #4ade80;
            vertical-align: 1px;
        }

        .planet-view .pv-label.mine { font-weight: 600; }
        .planet-view .pv-label.selected { box-shadow: 0 0 0 2px rgba(255, 255, 255, .25), 0 0 12px currentColor; }
        .planet-view .pv-label.empty { color: #aab3c5; border-style: dashed; font-style: italic; }

    .planet-view .globe-tooltip {
        position: absolute;
        left: 0;
        top: 0;
        pointer-events: none;
        padding: 4px 9px;
        border-radius: 8px;
        background: rgba(13, 20, 36, .92);
        border: 1px solid rgba(120, 180, 255, .35);
        color: #e6edf7;
        font-size: 12px;
        white-space: nowrap;
        opacity: 0;
        transition: opacity .12s ease;
    }

        .planet-view .globe-tooltip.shown { opacity: 1; }