/* static/css/connettoma.css Stile condiviso del widget "connettoma" (grafo interattivo di nodi e collegamenti), usato dalla home di Universe e dalla home di Atlantis. Ogni pagina definisce solo il colore di sfondo/testo dei propri "zone-label"; tutto il resto del comportamento visivo è qui. */ .connettoma-outer { position: relative; max-width: 1100px; width: 100%; margin: 0 auto; } .connettoma-outer svg.connettoma-svg { display: block; width: 100%; height: auto; position: relative; z-index: 45; } .connettoma-hit { cursor: pointer; } /* Aureola/pulse dei nodi "recenti": il "respiro" (durata e ampiezza) è guidato da JS con parametri random ad ogni ciclo — qui restano solo l'origine di trasformazione (ANCORATA al centro del pallino stesso, non al centro dell'intero SVG — altrimenti la scala sembra "spostare" l'alone invece di farlo pulsare fermo) e lo stato "in pausa".*/ .connettoma-aureola { transform-box: fill-box; transform-origin: center; } .connettoma-aureola.in-pausa { opacity: 0 !important; } /* Box di anteprima: rettangolo unico per tutti i nodi (non più un colore diverso a seconda del pallino) — sfondo quasi bianco con una sfumatura leggermente celeste, molto trasparente, bordino sottile bianco. Contiene SOLO il titolo; l'etichetta di categoria sta fuori, sopra, allineata a sinistra (vedi .connettoma-box-categoria). */ .connettoma-box { position: absolute; z-index: 50; max-width: 320px; min-width: 160px; padding: 0.75rem 1.1rem 0.85rem; border-radius: 4px; text-decoration: none; background: rgba(232, 244, 255, 0.15); border: 1px solid rgba(255, 255, 255, 0.7); backdrop-filter: blur(7px); -webkit-backdrop-filter: blur(7px); box-shadow: 0 6px 28px rgba(0,0,0,0.35); opacity: 0; transform: translateY(4px) scale(0.98); transition: opacity 0.16s ease, transform 0.16s ease; pointer-events: none; overflow: visible; /* l'etichetta sopra deve restare visibile anche se esce dal bordo */ } .connettoma-box.visibile { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; } .connettoma-box-categoria { position: absolute; left: 0.25em; top: -1.35em; display: block; font-family: system-ui, sans-serif; font-size: 0.62rem; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; white-space: nowrap; color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,0.55); } .connettoma-box-titolo { display: block; font-family: system-ui, sans-serif; font-size: 0.62rem; line-height: 1.5; font-weight: 400; text-transform: uppercase; color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,0.55); } /* Fascia che contiene il grafo: qui SOLO i valori di base condivisi. Una singola pagina può avere già il proprio .connettoma-wrap nel suo