/* Original Neo animation from src/modules/neo/components/neo-hologram.css. Keep the visual layers in sync. */
/* Kleine, isolierte Ebenen: nur Transform/Opacity animieren, kein Canvas,
   kein Timer und kein animierter Blur. Text und Trefferfläche bleiben ruhig. */
.neo-hologram {
  position: relative;
  display: inline-grid;
  place-items: center;
  flex: none;
  width: 100%;
  height: 100%;
  isolation: isolate;
  border-radius: 50%;
  pointer-events: none;
  color: #effffb;
  box-shadow: 0 5px 20px hsl(var(--primary) / .2);
}
/* Eigene kreisförmige Clip-Fläche: overflow + border-radius allein kann auf
   iOS bei transformierten Ebenen rechteckige Farbflächen durchlassen.
   Schatten und Schweben bleiben außerhalb dieser expliziten Maske. */
.neo-hologram__surface {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border-radius: inherit;
  clip-path: circle(50% at 50% 50%);
  -webkit-mask-image: radial-gradient(circle closest-side, #fff 98%, transparent 100%);
  mask-image: radial-gradient(circle closest-side, #fff 98%, transparent 100%);
  background: radial-gradient(circle at 30% 23%, #24544b 0%, #103c35 36%, #041c20 72%, #080e17 100%);
  box-shadow: inset 0 0 0 1px rgb(172 216 213 / .35), inset -4px -6px 12px rgb(0 19 25 / .5);
}

.neo-hologram__liquid,
.neo-hologram__veil,
.neo-hologram__glass {
  position: absolute;
  pointer-events: none;
}
.neo-hologram__liquid {
  inset: -38%;
  background:
    radial-gradient(ellipse at 28% 35%, rgb(45 145 115 / .8), transparent 52%),
    radial-gradient(ellipse at 68% 28%, rgb(105 90 158 / .55), transparent 40%),
    radial-gradient(ellipse at 65% 73%, rgb(48 137 154 / .65), transparent 49%);
  opacity: .55;
  animation: neo-liquid-flow 21s linear infinite;
}
.neo-hologram__veil {
  inset: -50%;
  background: radial-gradient(ellipse at 28% 32%, rgb(196 235 232 / .48), transparent 34%),
    radial-gradient(ellipse at 72% 76%, #063a39 14%, transparent 59%);
  opacity: .6;
  animation: neo-liquid-flow 29s linear infinite reverse;
}
.neo-hologram__glass {
  inset: 0;
  border-radius: inherit;
  background:
    radial-gradient(ellipse at 29% 19%, rgb(239 255 255 / .6) 0%, rgb(228 255 248 / .27) 10%, transparent 28%),
    radial-gradient(circle at 38% 32%, transparent 35%, rgb(0 15 22 / .35) 77%, rgb(0 12 19 / .64) 100%),
    radial-gradient(ellipse at 63% 91%, rgb(112 245 213 / .24), transparent 34%);
  box-shadow: inset 1px 1px 2px rgb(237 255 252 / .8), inset -1px -2px 3px rgb(71 192 173 / .4);

}
.neo-hologram__mark {
  position: relative;
  z-index: 1;
  width: 46%;
  height: 46%;
  filter: drop-shadow(0 1px 3px rgb(0 25 25 / .8));
}
.neo-hologram-launcher {
  background: transparent;
  isolation: isolate;
}
/* Schatten bleibt unter der Kugel; die anklickbare Fläche bewegt sich nicht. */
.neo-hologram-launcher::after {
  content: '';
  position: absolute;
  z-index: -1;
  pointer-events: none;
  left: 16%;
  right: 16%;
  bottom: -9px;
  height: 9px;
  border-radius: 50%;
  background: radial-gradient(ellipse, hsl(var(--primary) / .25), transparent 72%);
}
.neo-hologram-launcher .neo-hologram {
  animation: neo-orb-float 8s ease-in-out infinite;
  box-shadow: inset 0 0 0 1px rgb(172 216 213 / .35),
    0 5px 16px hsl(var(--primary) / .2), 0 0 18px rgb(126 225 207 / .12);
}
.neo-hologram-launcher[aria-expanded='true'] .neo-hologram,
.neo-hologram-launcher[aria-expanded='true'] .neo-hologram__surface > span,
.neo-hologram-launcher[aria-expanded='true'] .neo-hologram__mercury {
  animation-play-state: paused;
}
.neo-chat-glass-header {
  background: linear-gradient(115deg, hsl(var(--primary) / .1), hsl(var(--card) / .18) 55%, rgb(113 169 199 / .08));
}
.dark .neo-hologram-launcher .neo-hologram {
  box-shadow: inset 0 0 0 1px rgb(219 255 244 / .4),
    0 8px 24px rgb(0 0 0 / .3), 0 0 24px hsl(var(--primary) / .2);
}
.neo-hologram__contrast { display: none; }
.neo-hologram__mercury {
  animation: neo-mercury-flow 7s ease-in-out infinite;
}
@keyframes neo-mercury-flow {
  0%, 15% { transform: translateX(0); }
  85%, 100% { transform: translateX(48px); }
}
@keyframes neo-orb-float {
  0%, 100% { transform: translateY(1px); }
  50% { transform: translateY(-4px); }
}
@keyframes neo-liquid-flow {
  from { transform: rotate(0deg) scale(1); }
  50% { transform: rotate(180deg) scale(1.1); }
  to { transform: rotate(360deg) scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  .neo-hologram-launcher .neo-hologram,
  .neo-hologram__surface > span,
  .neo-hologram__mercury { animation: none; }
}
@media (forced-colors: active) {
  .neo-hologram { background: ButtonFace; color: ButtonText; border: 1px solid ButtonText; }
  .neo-hologram > span { display: none; }
  .neo-hologram__mark { filter: none; }
  .neo-hologram__chrome { display: none; }
  .neo-hologram__contrast { display: initial; }
}

/* Shared chat surface: quiet emerald glass, readable in both themes. */
.neo-chat-shell {
  border-color: hsl(var(--primary) / .14);
  box-shadow: 0 32px 100px hsl(var(--foreground) / .16), inset 0 1px 0 hsl(var(--background) / .8);
}
.neo-chat-messages {
  background: radial-gradient(ellipse at 0 0, hsl(var(--primary) / .065), transparent 65%), hsl(var(--background) / .54);
  scrollbar-width: thin;
  scrollbar-color: hsl(var(--primary) / .2) transparent;
}
.neo-chat-composer { background: hsl(var(--background) / .76); }
.neo-menu-orb .neo-hologram { animation: none; box-shadow: 0 2px 8px hsl(var(--primary) / .15); }
.neo-menu-orb .neo-hologram__surface > span,
.neo-menu-orb .neo-hologram__mercury { animation: none; }