/* FP3 · INTERCONNECT v11.4 — 09/09/2026
   Un blocco non resta mai vuoto: o ha il dato, o gira sull'ultimo dato buono
   marcato come cache, o mostra il loop d'attesa. Nessun dato inventato,
   nessun trattino muto. */

@keyframes fp3-loop-sweep {
  0%   { background-position: -140% 0; }
  100% { background-position:  240% 0; }
}
@keyframes fp3-loop-pulse {
  0%,100% { opacity:.32; }
  50%     { opacity:.85; }
}

/* --- barra di attesa: il blocco "gira" invece di restare bianco --- */
.fp3-loop {
  position: relative;
  display: inline-block;
  min-width: 2.2em;
  color: transparent !important;
  background-image: linear-gradient(90deg,
      rgba(197,162,88,.10) 0%,
      rgba(197,162,88,.42) 45%,
      rgba(143,212,228,.34) 55%,
      rgba(197,162,88,.10) 100%);
  background-size: 220% 100%;
  animation: fp3-loop-sweep 1.55s linear infinite;
  border-radius: 1px;
}
.fp3-loop > * { visibility: hidden; }

/* blocchi interi in attesa */
[data-fp3-block][data-fp3-state="pending"] {
  animation: fp3-loop-pulse 1.8s ease-in-out infinite;
}
[data-fp3-block][data-fp3-state="empty"] { display: none !important; }

/* --- valore che è arrivato: micro-stacco, una volta sola --- */
@keyframes fp3-land { from { opacity:.25; } to { opacity:1; } }
.fp3-landed { animation: fp3-land .5s ease-out both; }

/* --- marchio cache: il dato è vecchio e lo diciamo --- */
.fp3-cache-tag {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 7.5px; letter-spacing: .16em; text-transform: uppercase;
  color: #e6a24a; opacity: .85; margin-left: .5em; white-space: nowrap;
}
[data-fp3-state="cache"] .fp3-live-dot,
[data-fp3-state="cache"] .cy-dot { background:#e6a24a !important; box-shadow:none !important; }

/* --- rail di interconnessione: ogni pagina sa dove sta nel portale --- */
.fp3-xrail {
  margin: 22px 0 6px; padding: 10px 0 0;
  border-top: 1px solid rgba(197,162,88,.28);
  display: flex; gap: 6px; flex-wrap: nowrap;
  overflow-x: auto; scrollbar-width: none;
}
.fp3-xrail::-webkit-scrollbar { display: none; }
.fp3-xrail > .lbl {
  flex: 0 0 auto; align-self: center;
  font-family: 'IBM Plex Mono', monospace; font-size: 7.5px;
  letter-spacing: .2em; text-transform: uppercase; color: #9d998d;
}
.fp3-xrail a {
  flex: 0 0 auto; white-space: nowrap; text-decoration: none;
  font-family: 'IBM Plex Mono', monospace; font-size: 8px;
  letter-spacing: .12em; text-transform: uppercase;
  padding: 6px 9px; border: 1px solid rgba(143,212,228,.42); color: #c5a258;
  transition: border-color .25s, color .25s, transform .25s;
}
.fp3-xrail a:hover, .fp3-xrail a:focus-visible {
  border-color: rgba(197,162,88,.9); color: #f0dda6; transform: translateY(-1px);
}

/* --- esperienza cognitiva: il numero dice da dove viene, se lo interroghi --- */
[data-fp3-count], [data-fp3-derive] { cursor: help; }
[data-fp3-count]:hover, [data-fp3-derive]:hover { text-decoration: underline dotted rgba(197,162,88,.55); text-underline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
  .fp3-loop { animation: none; background-image: none; color: inherit !important; }
  .fp3-loop > * { visibility: visible; }
  [data-fp3-block][data-fp3-state="pending"] { animation: none; }
  .fp3-landed { animation: none; }
}