.notepad-content {
  font-family: "Lucida Console", Monaco, monospace;
}

.xp-list-header {
  background: #f3f4f6;
}

.xp-row:hover {
  background: rgba(59, 130, 246, 0.12);
}

.xp-pill {
  border: 1px solid rgba(0,0,0,0.12);
  background: rgba(243,244,246,0.75);
}

.chat-bubble {
  border: 1px solid rgba(0,0,0,0.12);
  background: rgba(243,244,246,0.75);
}

.progress-bar {
  background: #e5e7eb;
  border: 1px solid rgba(0,0,0,0.15);
  height: 10px;
  border-radius: 4px;
  overflow: hidden;
}

.progress-bar > div {
  height: 100%;
  background: linear-gradient(90deg, #22c55e 0%, #16a34a 100%);
}

/* Windows Media Player Visualizations */
@keyframes wmp-bars {
  0%, 100% { transform: scaleY(0.5); }
  25% { transform: scaleY(1.2); }
  50% { transform: scaleY(0.8); }
  75% { transform: scaleY(1.5); }
}

@keyframes wmp-scope {
  0%, 100% { transform: translateX(0) scaleX(1); }
  50% { transform: translateX(10px) scaleX(1.2); }
}

@keyframes wmp-spiral {
  0% { transform: rotate(0deg) scale(1); }
  50% { transform: rotate(180deg) scale(1.3); }
  100% { transform: rotate(360deg) scale(1); }
}

@keyframes wmp-ambient {
  0%, 100% { opacity: 0.6; filter: blur(0px) hue-rotate(0deg); }
  50% { opacity: 1; filter: blur(3px) hue-rotate(180deg); }
}

@keyframes wmp-battery {
  0%, 100% { transform: translateY(0); }
  25% { transform: translateY(-10px); }
  50% { transform: translateY(5px); }
  75% { transform: translateY(-5px); }
}

.wmp-bars {
  animation: wmp-bars 0.8s ease-in-out infinite;
}

.wmp-scope {
  animation: wmp-scope 1.2s ease-in-out infinite;
}

.wmp-spiral {
  animation: wmp-spiral 3s linear infinite;
}

.wmp-ambient {
  animation: wmp-ambient 2s ease-in-out infinite;
}

.wmp-battery {
  animation: wmp-battery 1s ease-in-out infinite;
}