html, body {
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: #02030a;
    font-family: system-ui, sans-serif;
}

#ecosystem-container {
    position: fixed;
    inset: 0;
    background: radial-gradient(circle at top, #151b3a 0%, #050612 45%, #010109 100%);
    overflow: hidden;
}

canvas {
    display: block;
}

/* Labels das apps */
.app-label {
    position: absolute;
    color: #f5f5f7;
    pointer-events: auto;
    transform: translate(-50%, -50%);
    text-align: center;
    max-width: 220px;
    cursor: none;
    transition: transform 0.18s ease-out, opacity 0.18s ease-out, text-shadow 0.18s ease-out;
    opacity: 0.8;
}

.app-title {
    font-family: "Cormorant Garamond", "EB Garamond", serif;
    font-size: 18px;
    letter-spacing: 0.04em;
    text-shadow: 0 0 10px rgba(140, 160, 255, 0.6);
}

.app-label.hovered {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1.08);
    text-shadow: 0 0 18px rgba(180, 200, 255, 0.9);
}

/* Partícula do rato */
#mouse-particle {
    position: fixed;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    pointer-events: none;
    mix-blend-mode: screen;
    background: radial-gradient(circle, #b0c4ff 0%, #5f7bff 40%, transparent 70%);
    opacity: 0.9;
    transform: translate(-50%, -50%);
}