/* crab-graph.css — granchio blu wireframe (nodi e sinapsi). Nessuno stile inline, nessun font esterno. */
.cg{--cg-navy:#050d1f;--cg-navy2:#0a1a30;--cg-blue:#2a85ff;--cg-cy:#6fdcff;--cg-gold:#e6c98a;--cg-gold2:#c9a962;position:relative;width:100%;color:#dbe8ff;font-family:inherit}
.cg__stage{position:relative;width:100%;height:clamp(340px,64vh,680px);border:1px solid rgba(111,220,255,.22);border-radius:14px;overflow:hidden;background:radial-gradient(ellipse at 50% 42%,#0d2750 0%,#07142b 48%,var(--cg-navy) 100%);box-shadow:0 0 0 1px rgba(201,169,98,.10) inset,0 18px 50px -24px rgba(20,80,200,.55)}
.cg[data-mode=embed] .cg__stage{height:clamp(300px,50vh,460px)}
.cg[data-mode=mini] .cg__stage{height:220px;border-radius:10px}
.cg__cv{display:block;width:100%;height:100%;touch-action:none;cursor:grab;outline:none}
.cg[data-mode=embed] .cg__cv{touch-action:pan-y}
.cg[data-mode=mini] .cg__cv{touch-action:pan-y;cursor:default}
.cg__cv:active{cursor:grabbing}.cg__cv.is-hot{cursor:pointer}
.cg__cv:focus-visible{box-shadow:0 0 0 2px var(--cg-gold) inset}
.cg__tag{position:absolute;left:0;top:0;pointer-events:none;padding:4px 10px;border-radius:999px;font-size:.78rem;line-height:1.2;white-space:nowrap;background:rgba(5,13,31,.88);border:1px solid var(--cg-gold2);color:var(--cg-gold);box-shadow:0 0 14px rgba(111,220,255,.35);will-change:transform}
.cg__ring{position:absolute;left:-26px;top:-26px;width:52px;height:52px;margin:0;border:2px solid var(--cg-gold);border-radius:50%;pointer-events:none;box-shadow:0 0 18px rgba(230,201,138,.8);animation:cg-ring 1s ease-in-out infinite;will-change:transform}
.cg__ring::after{content:"";position:absolute;inset:-9px;border:1px solid rgba(111,220,255,.6);border-radius:50%}
@keyframes cg-ring{50%{opacity:.55}}
.cg__hud{position:absolute;left:10px;bottom:10px;right:10px;padding:6px 10px;border-radius:8px;font-size:.82rem;background:rgba(5,13,31,.82);border:1px solid rgba(111,220,255,.3);color:var(--cg-cy);font-variant-numeric:tabular-nums;pointer-events:none}
.cg__bar{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 6px}
.cg__btn{appearance:none;display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:999px;border:1px solid rgba(111,220,255,.55);background:rgba(10,26,48,.85);color:#dbe8ff;font:inherit;font-size:.92rem;cursor:pointer;text-decoration:none;transition:background .2s,box-shadow .2s}
.cg__btn:hover,.cg__btn:focus-visible{background:rgba(42,133,255,.28);box-shadow:0 0 16px rgba(111,220,255,.4);outline:none}
.cg__btn--gold{border-color:var(--cg-gold2);color:var(--cg-gold);background:linear-gradient(180deg,rgba(201,169,98,.20),rgba(10,26,48,.9))}
.cg__btn--ghost{border-color:rgba(219,232,255,.25);color:#b7c8e6}
.cg__hint{margin:6px 0 12px;font-size:.84rem;color:#8fa6c9}
.cg__panel{display:none;padding:14px 18px;border-radius:12px;border:1px solid rgba(201,169,98,.45);background:linear-gradient(180deg,rgba(10,26,48,.92),rgba(5,13,31,.95))}
.cg__panel.is-on{display:block}
.cg__panel h3{margin:0 0 6px;color:var(--cg-gold);font-size:1.08rem}
.cg__panel p{margin:0 0 8px;color:#dbe8ff;line-height:1.5}
.cg__more{color:var(--cg-cy);text-decoration:underline;text-underline-offset:3px}
.cg__chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.cg__chips button{appearance:none;min-height:36px;padding:0 12px;border-radius:999px;font:inherit;font-size:.8rem;cursor:pointer;color:#b7d4ff;background:rgba(42,133,255,.10);border:1px solid rgba(111,220,255,.3)}
.cg__chips button[aria-pressed=true],.cg__chips button:hover,.cg__chips button:focus-visible{color:var(--cg-gold);border-color:var(--cg-gold2);outline:none;background:rgba(201,169,98,.12)}
.cg__fb{display:block;width:100%;height:auto;border-radius:14px;border:1px solid rgba(111,220,255,.22);background:var(--cg-navy)}
.cg--static .cg__stage{height:auto;border:0;background:none;box-shadow:none}
.cg--static .cg__cv,.cg--static .cg__tag,.cg--static .cg__ring,.cg--static .cg__hud,.cg--static .cg__bar{display:none}
.cg:not(.cg--ready):not(.cg--static) .cg__stage{min-height:260px}
.cg__fb[hidden]{display:none}
@media (max-width:640px){.cg__stage{height:clamp(320px,58vh,520px)}.cg__btn{flex:1 1 auto;justify-content:center}.cg__tag{font-size:.72rem}}
@media (prefers-reduced-motion:reduce){.cg__ring{animation:none}.cg__btn{transition:none}}
