/* smooth scroll: su mobile spesso sembra “blocco” e ritarda tap → solo desktop */
@media (min-width: 960px) {
  html {
    scroll-behavior: smooth;
  }
}
.fh-body {
  padding-top: 96px;
  background: #080808;
  color: #e2e2e2;
  font-family: 'Inter', system-ui, sans-serif;
}
#fh-outer {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  padding: 16px 0;
  transition: padding 0.4s cubic-bezier(0.4,0,0.2,1);
}
#fh-outer.fh-scrolled { padding: 10px 0; }
.fh-content-gutter {
  box-sizing: border-box;
  width: 100%;
  max-width: 72rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1rem;
  padding-right: 1rem;
}
@media (min-width: 768px) {
  .fh-content-gutter .fh-island {
    margin-left: 2.5rem;
    width: calc(100% - 2.5rem);
    max-width: none;
  }
}
.fh-aurora-bg {
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}
.fh-aurora-blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.07;
  animation: fh-float-blob linear infinite;
}
.fh-aurora-blob:nth-child(1) {
  width: 600px; height: 600px;
  background: radial-gradient(circle, #8b4d52, transparent 70%);
  top: -200px; left: -100px;
  animation-duration: 20s;
}
.fh-aurora-blob:nth-child(2) {
  width: 500px; height: 500px;
  background: radial-gradient(circle, #6d28d9, transparent 70%);
  top: -150px; right: -100px;
  animation-duration: 25s;
  animation-direction: reverse;
}
.fh-aurora-blob:nth-child(3) {
  width: 400px; height: 400px;
  background: radial-gradient(circle, #4c1d95, transparent 70%);
  top: 200px; left: 40%;
  animation-duration: 18s;
}
@keyframes fh-float-blob {
  0%   { transform: translate(0px, 0px) rotate(0deg); }
  33%  { transform: translate(40px, -30px) rotate(120deg); }
  66%  { transform: translate(-30px, 20px) rotate(240deg); }
  100% { transform: translate(0px, 0px) rotate(360deg); }
}
/* Rumore molto leggero: pattern 256×256 ripetuto → su mobile durante lo scroll sembra “a mattonelle” / repaint a scatti */
.fh-noise {
  position: fixed;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: 0.012;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
main.fh-main {
  position: relative;
  z-index: 2;
}

/**
 * Stessa colonna orizzontale dell'header: .fh-content-gutter (max 72rem, px-4)
 * + da md il rientro sinistro dell'island (2.5rem), così main/footer allineano ai bordi della barra.
 */
.fh-site-gutter {
  box-sizing: border-box;
  width: 100%;
  max-width: 72rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1rem;
  padding-right: 1rem;
}
@media (min-width: 768px) {
  .fh-site-gutter {
    padding-left: calc(1rem + 2.5rem);
  }
}

/**
 * Home: stessa larghezza di /articoli e /ia.
 * Island e contenuto (hero, lista, paginazione) partono tutti dallo stesso
 * bordo sinistro del fh-site-gutter (3.5rem dal viewport), uguale a tutte
 * le altre pagine. L'override homepage è rimosso: nessuna restrizione.
 */

.fh-island {
  position: relative;
  width: 100%;
  margin: 0;
  background-color: rgba(12, 12, 12, 0.75);
  backdrop-filter: blur(32px) saturate(180%);
  -webkit-backdrop-filter: blur(32px) saturate(180%);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 1.5rem;
  box-shadow:
    0 0 0 1px rgba(139,77,82,0.08) inset,
    0 8px 40px rgba(0,0,0,0.5),
    0 1px 0 rgba(255,255,255,0.04) inset;
  transition: border-radius 0.4s cubic-bezier(0.4,0,0.2,1), box-shadow 0.4s cubic-bezier(0.4,0,0.2,1);
  overflow: visible;
}
#fh-outer.fh-scrolled .fh-island {
  border-radius: 1.25rem;
  box-shadow:
    0 0 0 1px rgba(139,77,82,0.12) inset,
    0 4px 24px rgba(0,0,0,0.6),
    0 1px 0 rgba(255,255,255,0.03) inset;
}
.fh-island::before {
  content: '';
  position: absolute; inset: 0; border-radius: inherit;
  background: radial-gradient(ellipse 280px 140px at 3% 50%, rgba(139,77,82,0.15) 0%, transparent 70%),
              radial-gradient(ellipse 220px 140px at 97% 50%, rgba(109,40,217,0.08) 0%, transparent 70%);
  pointer-events: none; z-index: 0;
}
.fh-inner { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; min-height:54px; padding:8px 16px; gap:10px; transition:min-height 0.4s cubic-bezier(0.4,0,0.2,1),padding 0.4s cubic-bezier(0.4,0,0.2,1); }
#fh-outer.fh-scrolled .fh-inner { min-height:46px; padding:6px 16px; }

/* Logo */
.fh-logo { display:flex; align-items:center; gap:10px; text-decoration:none; flex-shrink:0; user-select:none; }
.fh-logo-icon { position:relative; width:34px; height:34px; border-radius:10px; display:flex; align-items:center; justify-content:center; box-shadow:0 0 20px rgba(139,77,82,0.4),0 0 60px rgba(109,40,217,0.15); transition:box-shadow 0.3s,transform 0.3s; flex-shrink:0; }
.fh-logo:hover .fh-logo-icon { box-shadow:0 0 30px rgba(139,77,82,0.6),0 0 80px rgba(109,40,217,0.25); transform:rotate(-5deg) scale(1.05); }
.fh-logo-dot { position:absolute; bottom:-2px; right:-2px; width:9px; height:9px; border-radius:50%; background:#10b981; border:2px solid #0c0c0c; box-shadow:0 0 8px rgba(16,185,129,0.8); animation:fh-logo-pulse 2.5s ease-in-out infinite; }
@keyframes fh-logo-pulse { 0%,100%{box-shadow:0 0 6px rgba(16,185,129,0.8)} 50%{box-shadow:0 0 14px rgba(16,185,129,1)} }
.fh-logo-text { font-size:17px; font-weight:800; color:#fff; letter-spacing:-0.02em; line-height:1; }

/* Desktop nav — solo ≥960px; sotto breakpoint niente pill né link duplicati rispetto al drawer */
.fh-desknav { display:none !important; align-items:center; position:relative; background:rgba(255,255,255,0.03); border:none; border-radius:14px; padding:4px; gap:0; max-width:min(720px,58vw); justify-content:center; flex-shrink:1; min-width:0; box-shadow:inset 0 0 0 1px rgba(255,255,255,0.06); }
@media(min-width:960px){.fh-desknav{display:flex !important;}}
.fh-nav-pill { position:absolute; top:4px; left:4px; height:calc(100% - 8px); background:rgba(255,255,255,0.08); border:none; border-radius:10px; pointer-events:none; z-index:0; box-shadow:inset 0 0 0 1px rgba(255,255,255,0.07); transition:left 0.3s cubic-bezier(0.4,0,0.2,1),width 0.3s cubic-bezier(0.4,0,0.2,1); }
.fh-navlink { position:relative; z-index:1; display:inline-flex; align-items:center; gap:6px; padding:7px 14px; font-size:13.5px; font-weight:500; color:#9ca3af; text-decoration:none; border-radius:10px; white-space:nowrap; transition:color 0.2s; cursor:pointer; border:none; background:none; font-family:inherit; }
.fh-navlink:hover{color:#e5e7eb;} .fh-navlink.fh-active{color:#fff;font-weight:600;}
.fh-cat-outer,.fh-tool-outer{position:relative;}
#cat-menu-dropdown,
#tool-menu-dropdown { position:absolute; left:50%; top:calc(100% + 12px); width:min(280px,calc(100vw - 2rem)); max-height:min(72vh,480px); background:rgba(10,10,10,0.96); border:1px solid rgba(255,255,255,0.08); border-radius:18px; padding:6px; box-shadow:0 24px 60px rgba(0,0,0,0.7),0 0 0 1px rgba(255,255,255,0.03) inset; backdrop-filter:blur(30px); z-index:200; transform:translateX(-50%); display:none; flex-direction:column; box-sizing:border-box; }
#cat-menu-dropdown:not(.hidden),
#tool-menu-dropdown:not(.hidden) { display:flex; }
.fh-cat-scroll { overflow-x:hidden; overflow-y:auto; -webkit-overflow-scrolling:touch; max-height:min(65vh,400px); min-height:0; flex:1 1 auto; }
#cat-menu-dropdown::before,
#tool-menu-dropdown::before { content:''; position:absolute; top:-5px; left:50%; transform:translateX(-50%) rotate(45deg); width:10px; height:10px; background:rgba(10,10,10,0.96); border-top:1px solid rgba(255,255,255,0.08); border-left:1px solid rgba(255,255,255,0.08); }
.fh-cat-item { display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:12px; text-decoration:none; font-size:13px; color:#d1d5db; transition:background 0.15s,color 0.15s; }
.fh-cat-item:hover{background:rgba(255,255,255,0.04);color:#fff;}
.fh-cat-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;} .fh-cat-count{font-size:11px;color:#4b5563;margin-left:auto;}
.fh-cat-divider{height:1px;background:rgba(255,255,255,0.05);margin:4px 0;}
.fh-cat-all{display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:12px;font-size:13px;font-weight:600;text-decoration:none;transition:background 0.15s,color 0.15s;}
.fh-cat-all:hover{background:rgba(139,77,82,0.08);color:#c49a9e!important;}
.fh-navlink-ai { color:#a78bfa; background:rgba(139,92,246,0.08); border:1px solid rgba(139,92,246,0.15); border-radius:12px; position:relative; overflow:hidden; margin-left:4px; font-size:12.5px; padding-left:10px; padding-right:10px; }
.fh-navlink-ai::before { content:''; position:absolute; inset:0; background:linear-gradient(90deg,transparent,rgba(167,139,250,0.15),transparent); transform:translateX(-100%); animation:fh-ai-sweep 3s ease-in-out infinite; }
@keyframes fh-ai-sweep{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.fh-navlink-ai:hover{color:#c4b5fd;background:rgba(139,92,246,0.14);}

/* ── Assistente AI rainbow animated border ── */
@property --fh-ai-hue {
  syntax: '<angle>';
  initial-value: 0deg;
  inherits: false;
}
@keyframes fh-ai-hue-spin { to { --fh-ai-hue: 360deg; } }
.fh-ai-ring-wrap {
  --fh-ai-hue: 0deg;
  position: relative;
  display: inline-flex;
  border-radius: 12px;
  padding: 1.5px;
  background: conic-gradient(from var(--fh-ai-hue), #60a5fa, #a78bfa, #f472b6, #fb923c, #facc15, #4ade80, #60a5fa);
  animation: fh-ai-hue-spin 4s linear infinite;
  flex-shrink: 0;
  filter: drop-shadow(0 0 7px rgba(139,92,246,0.45));
}
.fh-ai-ring-wrap > .fh-navlink {
  background: #0c0c0c;
  border-radius: 10.5px;
  margin: 0;
}
.fh-ai-ring-wrap > .fh-navlink:hover { background: #141416; }

/* Variante: ring “una volta sola” (parte quando aggiungiamo .fh-ring-play) */
.fh-ai-ring-wrap--once {
  animation: none;
}

/* Giro “intorno al bordo”: ruota il conic-gradient (non cambia colori) */
@property --fh-ring-rot {
  syntax: '<angle>';
  initial-value: 0deg;
  inherits: false;
}
@keyframes fh-ring-rotate-once { to { --fh-ring-rot: 360deg; } }
.fh-ai-ring-wrap--once {
  --fh-ring-rot: 0deg;
  /* override del background standard: vogliamo ruotare la “pennellata” */
  background: conic-gradient(from var(--fh-ring-rot), #60a5fa, #a78bfa, #f472b6, #fb923c, #facc15, #4ade80, #60a5fa);
}
.fh-ai-ring-wrap--once.fh-ring-play {
  animation: fh-ring-rotate-once 1.05s ease-out 1;
}
.fh-ai-ring-wrap--once.fh-ring-hidden {
  background: transparent !important;
  padding: 0 !important;
  filter: none !important;
}
.fh-ai-ring-wrap--once.fh-ring-hidden > .fh-load-more-btn {
  border: 1px solid rgba(255,255,255,0.10);
}
.fh-ai-ring-wrap--once > .fh-load-more-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 10px 18px;
  font-size: 0.9rem;
  font-weight: 700;
  color: #fff;
  border: 0;
  cursor: pointer;
  background: #0c0c0c;
  border-radius: 10.5px;
  margin: 0;
  box-shadow:
    0 10px 26px rgba(0,0,0,0.45),
    0 0 0 1px rgba(255,255,255,0.06) inset;
  transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
  text-decoration: none;
}
.fh-ai-ring-wrap--once > .fh-load-more-btn:hover {
  background: #141416;
  transform: translateY(-1px);
}
.fh-ai-ring-wrap--once > .fh-load-more-btn:disabled {
  opacity: 0.72;
  cursor: default;
  transform: none;
}
.fh-ai-ring-wrap--once > .fh-infinite-load-chip {
  margin: 0;
  box-sizing: border-box;
}

/* Menu mobile (drawer): stesso bordo arcobaleno a tutta larghezza della riga */
.fh-ai-ring-wrap--drawer {
  display: flex;
  width: 100%;
  box-sizing: border-box;
  align-self: stretch;
}
.fh-ai-ring-wrap--drawer > .fhd-link {
  flex: 1;
  min-width: 0;
  background: #0c0c0c;
  border-radius: 10.5px;
  margin: 0;
}
.fh-ai-ring-wrap--drawer > .fhd-link:hover {
  background: #141416;
}
.fh-ai-ring-wrap--drawer > .fhd-link.fh-active {
  background: #141418;
  color: #fff;
  font-weight: 600;
}
@media (prefers-reduced-motion: reduce) {
  .fh-ai-ring-wrap { animation: none; background: rgba(139,92,246,0.5); }
  .fh-ai-ring-wrap--once.fh-ring-play { animation: none; }
}

/* Actions */
.fh-actions{display:flex;align-items:center;gap:4px;flex-shrink:0;}
.fh-ibtn { position:relative; width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center; border:none; background:transparent; color:#6b7280; border-radius:10px; cursor:pointer; transition:color 0.2s,background 0.2s; text-decoration:none; flex-shrink:0; }
.fh-ibtn:hover{color:#e5e7eb;background:rgba(255,255,255,0.05);} .fh-ibtn svg{width:18px;height:18px;pointer-events:none;}
.fh-dot{position:absolute;top:6px;right:6px;width:7px;height:7px;border-radius:50%;border:1.5px solid #080808;}
.fh-dot-red{background:#ef4444;box-shadow:0 0 6px rgba(239,68,68,0.8);animation:fh-dot-pulse 2s ease-in-out infinite;}
.fh-dot-blue{background:#3b82f6;box-shadow:0 0 6px rgba(59,130,246,0.8);}
@keyframes fh-dot-pulse{0%,100%{box-shadow:0 0 5px rgba(239,68,68,0.8)}50%{box-shadow:0 0 12px rgba(239,68,68,1)}}
.fh-vdiv{width:1px;height:20px;background:rgba(255,255,255,0.07);margin:0 4px;flex-shrink:0;}

/* Desktop: icone un filo più compatte (spazio extra per il pulsante "Torna su") */
@media (min-width: 960px) {
  .fh-actions { gap: 2px; }
  .fh-ibtn { width: 30px; height: 30px; border-radius: 9px; }
  .fh-ibtn svg { width: 16px; height: 16px; }
  .fh-vdiv { margin: 0 3px; }
}

/* "Torna su": quando visibile deve “illuminare” rosso (non viola) */
.fh-scroll-top:not(.hidden) {
  color: #fecaca;
  background: rgba(239, 68, 68, 0.10);
  box-shadow:
    0 0 0 1px rgba(239, 68, 68, 0.22) inset,
    0 0 18px rgba(239, 68, 68, 0.28),
    0 0 44px rgba(239, 68, 68, 0.18);
}
.fh-scroll-top:not(.hidden):hover {
  color: #fff;
  background: rgba(239, 68, 68, 0.16);
  box-shadow:
    0 0 0 1px rgba(239, 68, 68, 0.30) inset,
    0 0 22px rgba(239, 68, 68, 0.42),
    0 0 70px rgba(239, 68, 68, 0.24);
}

/* Stringi i pulsanti desktop (padding) senza toccare le icone */
@media (min-width: 960px) {
  .fh-navlink { padding: 6px 11px; font-size: 13.25px; }
  .fh-navlink-ai { padding-left: 9px; padding-right: 9px; }
  .fh-btn-ghost { padding: 7px 12px; }
  .fh-btn-primary { padding: 7px 14px; gap: 6px; }
  .fh-user-btn { padding: 5px 10px 5px 7px; gap: 9px; }
}
.fh-notif-outer{position:relative;}
#notif-dropdown { position:absolute; top:calc(100% + 10px); right:-10px; width:300px; background:rgba(10,10,10,0.97); border:1px solid rgba(255,255,255,0.08); border-radius:18px; overflow:hidden; box-shadow:0 24px 60px rgba(0,0,0,0.8); backdrop-filter:blur(30px); z-index:200; }
.fh-user-wrap{position:relative;}
.fh-user-btn { display:flex; align-items:center; gap:10px; padding:6px 12px 6px 8px; border:1px solid rgba(255,255,255,0.08); border-radius:14px; background:rgba(255,255,255,0.04); cursor:pointer; transition:all 0.2s; font-family:inherit; text-decoration:none; max-width:min(280px,42vw); }
.fh-user-btn:hover{border-color:rgba(255,255,255,0.14);background:rgba(255,255,255,0.07);}
.fh-user-greet-block{display:flex;flex-direction:column;align-items:flex-start;gap:0;min-width:0;text-align:left;line-height:1.2;}
.fh-user-welcome-line{font-size:11.5px;font-weight:500;color:#9ca3af;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:min(200px,34vw);}
.fh-user-welcome-line strong{font-size:12px;font-weight:700;color:#e5e7eb;}
.fh-user-avatar-ring{position:relative;width:32px;height:32px;border-radius:50%;flex-shrink:0;box-sizing:border-box;}
.fh-user-avatar-ring::before{display:none;}
.fh-user-avatar-ring.fh-user-presence-online{box-shadow:0 0 0 2px #10b981,0 0 12px rgba(16,185,129,0.35);}
.fh-user-avatar-ring.fh-user-presence-away{box-shadow:0 0 0 2px #6b7280;}
.fh-user-avatar-ring.fh-user-avatar-ring--premium.fh-user-presence-online{box-shadow:0 0 0 2px #10b981,0 0 0 4px rgba(251,191,36,0.75),0 0 14px rgba(16,185,129,0.3);}
.fh-user-avatar-ring.fh-user-avatar-ring--premium.fh-user-presence-away{box-shadow:0 0 0 2px #6b7280,0 0 0 4px rgba(251,191,36,0.65);}
.fh-user-avatar-inner{position:relative;width:32px;height:32px;border-radius:50%;overflow:hidden;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#fff;background:linear-gradient(135deg,#8b4d52,#6d28d9);}
.fh-user-avatar-inner img{width:100%;height:100%;object-fit:cover;display:block;}
.fh-user-chevron{width:14px;height:14px;color:#4b5563;flex-shrink:0;}
.fh-user-panel { position:absolute; top:calc(100% + 10px); right:0; width:220px; background:rgba(10,10,10,0.97); border:1px solid rgba(255,255,255,0.08); border-radius:18px; padding:6px; box-shadow:0 24px 60px rgba(0,0,0,0.8),0 0 0 1px rgba(255,255,255,0.03) inset; backdrop-filter:blur(30px); opacity:0; visibility:hidden; transform:translateY(-8px); transition:opacity 0.2s,visibility 0.2s,transform 0.2s; z-index:200; pointer-events:none; }
.fh-user-wrap:hover .fh-user-panel,.fh-user-wrap:focus-within .fh-user-panel{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto;}
.fh-user-panel-hdr{padding:12px 12px 10px;border-bottom:1px solid rgba(255,255,255,0.05);}
.fh-user-panel-name{font-size:13.5px;font-weight:700;color:#fff;} .fh-user-panel-handle{font-size:11.5px;color:#4b5563;margin-top:1px;}
.fh-mitem{display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:10px;text-decoration:none;font-size:13px;color:#9ca3af;transition:background 0.15s,color 0.15s;cursor:pointer;border:none;background:none;font-family:inherit;width:100%;text-align:left;box-sizing:border-box;}
.fh-mitem svg{width:15px;height:15px;flex-shrink:0;} .fh-mitem:hover{background:rgba(255,255,255,0.04);color:#e5e7eb;}
.fh-mitem-danger{color:#f87171;} .fh-mitem-danger:hover{background:rgba(239,68,68,0.08);color:#fca5a5;}
.fh-mdiv{height:1px;background:rgba(255,255,255,0.05);margin:4px 0;}
.fh-btn-ghost{display:inline-flex;align-items:center;padding:8px 16px;font-size:13.5px;font-weight:500;color:#9ca3af;background:transparent;border:none;border-radius:10px;cursor:pointer;font-family:inherit;transition:color 0.2s,background 0.2s;white-space:nowrap;text-decoration:none;}
.fh-btn-ghost:hover{color:#fff;background:rgba(255,255,255,0.05);}
.fh-btn-primary{display:inline-flex;align-items:center;gap:7px;padding:8px 18px;font-size:13.5px;font-weight:600;color:#fff;border:none;border-radius:10px;cursor:pointer;font-family:inherit;white-space:nowrap;text-decoration:none;position:relative;overflow:hidden;transition:all 0.2s;}
.fh-btn-primary::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,0.1),transparent);opacity:0;transition:opacity 0.2s;}
.fh-btn-primary:hover{transform:translateY(-1px);box-shadow:0 0 30px rgba(139,77,82,0.4),0 4px 16px rgba(0,0,0,0.4);} .fh-btn-primary:hover::before{opacity:1;}
.fh-btn-primary:active{transform:translateY(0);}
.fh-btn-write{display:inline-flex;align-items:center;gap:5px;padding:7px 14px;font-size:13px;font-weight:700;color:#fff;border:none;border-radius:10px;cursor:pointer;font-family:inherit;white-space:nowrap;text-decoration:none;transition:all 0.2s;}
.fh-btn-write:hover{transform:translateY(-1px);}

/* Desktop-only helpers (replace Tailwind hidden md:*) */
.fh-desk { display:none !important; }
@media(min-width:960px){ .fh-desk { display:inline-flex !important; } }
.fh-desk-b { display:none !important; }
@media(min-width:960px){ .fh-desk-b { display:block !important; } }
.fh-desk-f { display:none !important; }
@media(min-width:960px){ .fh-desk-f { display:flex !important; } }

/* Search overlay */
#fh-search-overlay { position:fixed; top:0; left:0; right:0; bottom:0; z-index:500; background:rgba(0,0,0,0.7); backdrop-filter:blur(12px); display:flex !important; align-items:flex-start; justify-content:center; padding-top:100px; opacity:0; visibility:hidden; pointer-events:none; transition:opacity 0.25s,visibility 0.25s; }
#fh-search-overlay.fh-open{opacity:1 !important;visibility:visible !important;pointer-events:auto !important;}
.fh-search-box { width:100%; max-width:580px; margin:0 16px; background:rgba(12,12,12,0.95); border:1px solid rgba(255,255,255,0.1); border-radius:20px; overflow:hidden; box-shadow:0 32px 80px rgba(0,0,0,0.8); transform:translateY(-20px) scale(0.97); transition:transform 0.25s cubic-bezier(0.4,0,0.2,1); }
#fh-search-overlay.fh-open .fh-search-box{transform:translateY(0) scale(1);}
.fh-search-iw{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid rgba(255,255,255,0.05);}
.fh-search-iw svg{width:18px;height:18px;color:#4b5563;flex-shrink:0;}
.fh-search-inp{flex:1;background:transparent;border:none;outline:none;font-size:16px;font-family:inherit;color:#fff;caret-color:#8b4d52;}
.fh-search-inp::placeholder{color:#374151;}
.fh-search-hint{padding:10px 20px 14px;font-size:12.5px;color:#4b5563;}
.fh-search-kbd{font-size:11px;color:#374151;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.06);padding:2px 8px;border-radius:6px;font-family:ui-monospace,monospace;flex-shrink:0;}
.fh-search-kbd--sm{font-size:10px;}

/* Hamburger */
.fh-burger{display:flex;flex-direction:column;justify-content:center;gap:5px;width:36px;height:36px;border:none;background:transparent;cursor:pointer;padding:8px;border-radius:10px;transition:background 0.2s;}
.fh-burger:hover{background:rgba(255,255,255,0.05);}
.fh-burger span{display:block;height:1.5px;background:#9ca3af;border-radius:2px;transition:all 0.3s cubic-bezier(0.4,0,0.2,1);}
.fh-burger.fh-open span:nth-child(1){transform:translateY(6.5px) rotate(45deg);}
.fh-burger.fh-open span:nth-child(2){opacity:0;transform:scaleX(0);}
.fh-burger.fh-open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg);}
@media(min-width:960px){.fh-burger{display:none !important;}}

/* Drawer e overlay mobile: fuori dal layout su desktop (non solo fuori schermo) */
@media (min-width: 960px) {
  #fh-mob-overlay,
  #fh-mob-drawer {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}

/* Mobile overlay + drawer */
#fh-mob-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.6);backdrop-filter:blur(6px);z-index:105;opacity:0;visibility:hidden;pointer-events:none;transition:opacity 0.3s,visibility 0.3s;}
#fh-mob-overlay.fh-open{opacity:1;visibility:visible;pointer-events:auto;}
/* Sopra l’header fisso (z 100) così logo e primo blocco del drawer restano visibili */
#fh-mob-drawer{position:fixed;top:0;right:0;bottom:0;width:280px;max-width:88vw;background:rgba(8,8,8,0.97);border-left:1px solid rgba(255,255,255,0.06);border-radius:1.25rem 0 0 1.25rem;z-index:110;overflow-y:auto;padding:20px;transform:translateX(110%);transition:transform 0.35s cubic-bezier(0.4,0,0.2,1);}
#fh-mob-drawer.fh-open{transform:translateX(0);}
.fhd-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:20px;}
.fhd-top .fh-logo{flex:1;min-width:0;justify-content:flex-start;}
.fhd-top .fh-logo-text{color:#fff;}
.fhd-close{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:none;background:rgba(255,255,255,0.04);border-radius:8px;cursor:pointer;color:#6b7280;transition:color 0.2s,background 0.2s;}
.fhd-close:hover{color:#fff;background:rgba(255,255,255,0.08);}
.fhd-search{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.06);border-radius:12px;padding:10px 14px;margin-bottom:16px;cursor:pointer;transition:border-color 0.2s;}
.fhd-search:hover{border-color:rgba(255,255,255,0.1);}
.fhd-search svg{width:15px;height:15px;color:#4b5563;flex-shrink:0;} .fhd-search span{font-size:13px;color:#4b5563;}
.fhd-nav{display:flex;flex-direction:column;gap:2px;margin-bottom:8px;}
.fhd-link{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:12px;text-decoration:none;font-size:14px;font-weight:500;color:#6b7280;transition:all 0.2s;}
.fhd-link:hover{background:rgba(255,255,255,0.04);color:#e5e7eb;} .fhd-link.fh-active{background:rgba(255,255,255,0.05);color:#fff;}
.fhd-link svg{width:17px;height:17px;flex-shrink:0;}
.fhd-link-ai{color:#a78bfa;background:rgba(139,92,246,0.07);border:1px solid rgba(139,92,246,0.12);}
.fhd-link-ai:hover{background:rgba(139,92,246,0.12);color:#c4b5fd;}
.fhd-div{height:1px;background:rgba(255,255,255,0.05);margin:12px 0;}
.fhd-cats-lbl{font-size:10px;font-weight:700;color:#4b5563;text-transform:uppercase;letter-spacing:0.08em;padding:0 4px 6px;display:block;}
.fhd-cats{max-height:190px;overflow-y:auto;display:flex;flex-direction:column;gap:2px;margin-bottom:6px;}
.fhd-cat{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:12px;text-decoration:none;font-size:13.5px;font-weight:500;color:#6b7280;transition:all 0.2s;}
.fhd-cat:hover{background:rgba(255,255,255,0.04);color:#e5e7eb;} .fhd-cat.fh-active{background:rgba(255,255,255,0.05);color:#fff;}
.fhd-cat-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;}
.fhd-auth{display:flex;flex-direction:column;gap:8px;margin-top:8px;}
.fhd-btn-ghost{display:flex;align-items:center;justify-content:center;padding:11px;border-radius:12px;font-size:13.5px;font-weight:500;color:#9ca3af;text-decoration:none;border:1px solid rgba(255,255,255,0.07);background:transparent;transition:all 0.2s;cursor:pointer;font-family:inherit;}
.fhd-btn-ghost:hover{color:#fff;border-color:rgba(255,255,255,0.15);background:rgba(255,255,255,0.03);}
.fhd-btn-primary{display:flex;align-items:center;justify-content:center;gap:6px;padding:11px;border-radius:12px;font-size:13.5px;font-weight:700;color:#fff;text-decoration:none;transition:all 0.2s;border:none;cursor:pointer;font-family:inherit;}
.fhd-btn-primary:hover{transform:translateY(-1px);}
.fhd-user{display:flex;align-items:center;gap:10px;padding:12px;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.05);border-radius:16px;margin-bottom:12px;}
.fhd-avatar-wrap{border-radius:50%;flex-shrink:0;padding:0;line-height:0;}
.fhd-avatar-wrap.fh-user-presence-online{box-shadow:0 0 0 2px #10b981,0 0 12px rgba(16,185,129,0.3);}
.fhd-avatar-wrap.fh-user-presence-away{box-shadow:0 0 0 2px #6b7280;}
.fhd-avatar-wrap.fhd-avatar-wrap--premium.fh-user-presence-online{box-shadow:0 0 0 2px #10b981,0 0 0 4px rgba(251,191,36,0.75),0 0 14px rgba(16,185,129,0.3);}
.fhd-avatar-wrap.fhd-avatar-wrap--premium.fh-user-presence-away{box-shadow:0 0 0 2px #6b7280,0 0 0 4px rgba(251,191,36,0.65);}
.fhd-avatar{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;color:#fff;overflow:hidden;background:linear-gradient(135deg,#8b4d52,#6d28d9);}
.fhd-avatar img{width:100%;height:100%;object-fit:cover;}
.fhd-uwelcome{font-size:11px;color:#9ca3af;line-height:1.3;margin-bottom:2px;}
.fhd-uwelcome strong{font-size:12.5px;font-weight:700;color:#f3f4f6;}
.fhd-uinfo{flex:1;min-width:0;}
.fhd-uname{font-size:13px;font-weight:700;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.fhd-upresence{font-size:11px;color:#4b5563;margin-top:2px;display:flex;align-items:center;gap:4px;}
.fhd-pdot{width:6px;height:6px;border-radius:50%;flex-shrink:0;}

/* ── Performance mobile: riduzione effetti GPU pesanti ──────────────────── */
@media (max-width: 959px) {
  /* Strato rumore: anche con cover costa compositing; off = meno scatti allo scroll */
  .fh-noise {
    display: none;
  }
  /* Blob animati: filter:blur(80px) + transform continuo distrugge la GPU mobile.
     Su mobile li rendiamo statici e riduciamo il blur. */
  .fh-aurora-blob {
    animation: none;
    filter: blur(30px);
  }
  /* backdrop-filter: blur(32px) è pesante su scroll mobile → ridotto a 8px */
  .fh-island {
    backdrop-filter: blur(8px) saturate(130%);
    -webkit-backdrop-filter: blur(8px) saturate(130%);
  }
  /* Transition su padding/border-radius/box-shadow triggerate ad ogni scroll → rimosse su mobile */
  #fh-outer,
  .fh-island,
  .fh-inner {
    transition: none !important;
  }
  /* Sweep «Scrivi» / chip viola: non necessaria su mobile */
  .fh-navlink-ai::before {
    animation: none;
  }
  /* Pulse logo dot: non necessaria su mobile */
  .fh-logo-dot {
    animation: none;
  }
  /* Bordo conic-gradient animato Assistente AI: GPU busy durante navigazione/scroll */
  .fh-ai-ring-wrap {
    animation: none;
  }
}