/* ============================================================
   ANIMATIONS.CSS — All keyframes and transitions
   Frutiger Aero Experience
   ============================================================ */

/* ---- Boot ---- */
@keyframes boot-logo-appear {
  from { opacity: 0; transform: scale(0.8) translateY(20px); }
  to   { opacity: 1; transform: scale(1) translateY(0); }
}

@keyframes boot-progress {
  0%   { width: 0%; }
  20%  { width: 15%; }
  40%  { width: 35%; }
  60%  { width: 58%; }
  75%  { width: 72%; }
  90%  { width: 88%; }
  100% { width: 100%; }
}

@keyframes boot-fade-out {
  from { opacity: 1; }
  to   { opacity: 0; transform: scale(1.05); }
}

@keyframes desktop-fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ---- Window ---- */
@keyframes window-open {
  from {
    opacity: 0;
    transform: scale(0.85) translateY(20px);
    filter: blur(4px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
    filter: blur(0);
  }
}

@keyframes window-close {
  from {
    opacity: 1;
    transform: scale(1);
    filter: blur(0);
  }
  to {
    opacity: 0;
    transform: scale(0.88) translateY(16px);
    filter: blur(4px);
  }
}

@keyframes window-minimize {
  from { opacity: 1; transform: scale(1); }
  to   { opacity: 0; transform: scale(0.5) translateY(200px); }
}

@keyframes window-restore {
  from { opacity: 0; transform: scale(0.5) translateY(200px); }
  to   { opacity: 1; transform: scale(1) translateY(0); }
}

@keyframes window-shake {
  0%   { transform: translateX(0); }
  10%  { transform: translateX(-8px); }
  20%  { transform: translateX(8px); }
  30%  { transform: translateX(-6px); }
  40%  { transform: translateX(6px); }
  50%  { transform: translateX(-4px); }
  60%  { transform: translateX(4px); }
  70%  { transform: translateX(-2px); }
  80%  { transform: translateX(2px); }
  90%  { transform: translateX(-1px); }
  100% { transform: translateX(0); }
}

/* ---- Orb ---- */
@keyframes orb-pulse {
  0%, 100% {
    box-shadow:
      0 0 40px rgba(64,196,232,0.8),
      0 0 80px rgba(0,150,214,0.5),
      0 0 120px rgba(0,200,128,0.3);
  }
  50% {
    box-shadow:
      0 0 60px rgba(64,196,232,1),
      0 0 120px rgba(0,150,214,0.8),
      0 0 180px rgba(0,200,128,0.5);
    transform: scale(1.05);
  }
}

@keyframes float {
  0%, 100% { transform: translateY(0px); }
  50%       { transform: translateY(-12px); }
}

@keyframes float-slow {
  0%, 100% { transform: translateY(0px) rotate(0deg); }
  33%       { transform: translateY(-8px) rotate(2deg); }
  66%       { transform: translateY(-4px) rotate(-2deg); }
}

/* ---- Glow / pulse ---- */
@keyframes glow-pulse {
  0%, 100% { opacity: 0.6; }
  50%       { opacity: 1; }
}

@keyframes border-glow {
  0%, 100% {
    box-shadow:
      0 0 10px rgba(64,196,232,0.45),
      0 0 0 1px rgba(64,196,232,0.22);
  }
  50% {
    box-shadow:
      0 0 28px rgba(64,196,232,0.90),
      0 0 60px rgba(0,180,255,0.45),
      0 0 90px rgba(0,200,128,0.22),
      0 0 0 1px rgba(64,196,232,0.55);
  }
}

/* ---- Shimmer (glass surface animation) ---- */
@keyframes shimmer {
  0%   { background-position: -200% center; }
  100% { background-position: 200% center; }
}

/* ---- Shimmer pass (wet-surface streak sweep) ---- */
@keyframes shimmer-pass {
  0%   { transform: translateX(-120%) skewX(-20deg); opacity: 0; }
  10%  { opacity: 1; }
  60%  { opacity: 0.6; }
  100% { transform: translateX(120%) skewX(-20deg); opacity: 0; }
}

/* ---- Aurora background ---- */
@keyframes aurora-move {
  0%   { transform: translate(-10%, -10%) rotate(0deg) scale(1); }
  33%  { transform: translate(5%, 5%) rotate(120deg) scale(1.1); }
  66%  { transform: translate(-5%, 10%) rotate(240deg) scale(0.95); }
  100% { transform: translate(-10%, -10%) rotate(360deg) scale(1); }
}

/* ---- Bubble rise ---- */
@keyframes bubble-rise {
  0%   { transform: translateY(0) scale(1); opacity: 0.7; }
  50%  { transform: translateY(-40vh) scale(1.1) translateX(20px); opacity: 0.5; }
  100% { transform: translateY(-100vh) scale(0.6) translateX(-10px); opacity: 0; }
}

@keyframes bubble-wobble {
  0%, 100% { transform: translateX(0); }
  25%       { transform: translateX(8px); }
  75%       { transform: translateX(-8px); }
}

/* ---- Cursor trail ---- */
@keyframes trail-fade {
  0%   { opacity: 0.7; transform: translate(-50%, -50%) scale(1); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(0.3); }
}

/* ---- Ripple on click ---- */
@keyframes ripple-expand {
  0%   { width: 0; height: 0; opacity: 0.6; }
  100% { width: 200px; height: 200px; opacity: 0; }
}

/* ---- Notification toast ---- */
@keyframes toast-slide-in {
  from { opacity: 0; transform: translateX(120%); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes toast-slide-out {
  from { opacity: 1; transform: translateX(0); }
  to   { opacity: 0; transform: translateX(120%); }
}

/* ---- Start menu ---- */
@keyframes start-menu-open {
  from { opacity: 0; transform: translateY(20px) scale(0.95); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* ---- Context menu ---- */
@keyframes context-appear {
  from { opacity: 0; transform: scale(0.9); }
  to   { opacity: 1; transform: scale(1); }
}

/* ---- Text blink ---- */
@keyframes text-blink {
  0%, 100% { opacity: 0.5; }
  50%       { opacity: 1; }
}

/* ---- Clippy animations ---- */
@keyframes clippy-appear {
  from { opacity: 0; transform: translateY(30px) scale(0.8); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes clippy-bounce {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  25%       { transform: translateY(-8px) rotate(-5deg); }
  75%       { transform: translateY(-4px) rotate(5deg); }
}

@keyframes clippy-talk {
  0%, 100% { transform: scaleY(1); }
  50%       { transform: scaleY(0.85); }
}

@keyframes clippy-wiggle {
  0%, 100% { transform: rotate(0deg); }
  20%       { transform: rotate(-10deg); }
  40%       { transform: rotate(10deg); }
  60%       { transform: rotate(-8deg); }
  80%       { transform: rotate(8deg); }
}

@keyframes clippy-rage {
  0%, 100% { transform: rotate(0deg) scale(1); }
  10%       { transform: rotate(-15deg) scale(1.1); }
  20%       { transform: rotate(15deg) scale(1.15); }
  30%       { transform: rotate(-15deg) scale(1.1); }
  40%       { transform: rotate(15deg) scale(1.2); }
  50%       { transform: rotate(-20deg) scale(1.25); }
  60%       { transform: rotate(20deg) scale(1.2); }
  70%       { transform: rotate(-15deg) scale(1.15); }
  80%       { transform: rotate(15deg) scale(1.1); }
  90%       { transform: rotate(-10deg) scale(1.05); }
}

/* ---- Speech bubble pop ---- */
@keyframes bubble-pop {
  0%   { opacity: 0; transform: scale(0.6) translateY(10px); }
  70%  { transform: scale(1.05) translateY(-2px); }
  100% { opacity: 1; transform: scale(1) translateY(0); }
}

/* ---- Rainbow mode ---- */
@keyframes rainbow-bg {
  0%   { filter: hue-rotate(0deg) saturate(2); }
  100% { filter: hue-rotate(360deg) saturate(2); }
}

/* ---- Matrix rain ---- */
@keyframes matrix-char {
  0%   { opacity: 1; }
  100% { opacity: 0; transform: translateY(100vh); }
}

/* ---- Screensaver ---- */
@keyframes screensaver-float {
  0%   { transform: translate(0, 0) rotate(0deg); }
  25%  { transform: translate(60px, -40px) rotate(90deg); }
  50%  { transform: translate(120px, 20px) rotate(180deg); }
  75%  { transform: translate(40px, 80px) rotate(270deg); }
  100% { transform: translate(0, 0) rotate(360deg); }
}

/* ---- Icon hover bounce ---- */
@keyframes icon-bounce {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-6px); }
}

/* ---- Desktop appear ---- */
@keyframes icon-appear {
  from { opacity: 0; transform: translateY(20px) scale(0.8); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* Applied classes */
.anim-float { animation: float 3s ease-in-out infinite; }
.anim-float-slow { animation: float-slow 5s ease-in-out infinite; }
.anim-glow-pulse { animation: glow-pulse 2s ease-in-out infinite; }
.anim-border-glow { animation: border-glow 2s ease-in-out infinite; }
.anim-shimmer {
  background-size: 200% auto;
  animation: shimmer 3s linear infinite;
}