/* ── Vimmy (Clippy) ── */
.vimmy {
  position: fixed; z-index: 2000;
  cursor: pointer; filter: drop-shadow(0 4px 16px rgba(108, 205, 239, 0.35));
  transition: filter 0.2s;
  bottom: 28px; right: 28px;
}
.vimmy:hover { filter: drop-shadow(0 6px 20px rgba(108, 205, 239, 0.5)); }

/* ── Mute toggle ── */
.vimmy-mute-btn {
  position: absolute; top: -8px; right: -8px; z-index: 3;
  width: 26px; height: 26px; border-radius: 50%;
  background: #fff; border: 1.5px solid rgba(0,0,0,0.12);
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  opacity: 0; transition: opacity 0.25s, transform 0.2s;
  transform: scale(0.7);
  box-shadow: 0 2px 8px rgba(0,0,0,0.12);
}
.vimmy:hover .vimmy-mute-btn { opacity: 1; transform: scale(1); }
.vimmy.muted .vimmy-mute-btn { opacity: 1; transform: scale(1); }
.vimmy-mute-btn:hover { background: #f3f4f6; transform: scale(1.1) !important; }
.vimmy-mute-btn svg { width: 14px; height: 14px; }

/* ── Muted state ── */
.vimmy.muted { filter: drop-shadow(0 2px 8px rgba(0,0,0,0.1)) grayscale(1) opacity(0.6); }
.vimmy.muted:hover { filter: drop-shadow(0 4px 12px rgba(0,0,0,0.15)) grayscale(1) opacity(0.7); }
.vimmy.muted .vimmy-body { animation: none !important; }
.vimmy.muted .vimmy-eyes { animation: none !important; }
.vimmy.muted .vimmy-pupils { transform: none !important; transition: none !important; }
.vimmy.muted .vimmy-mouth-open { opacity: 0 !important; }
.vimmy.muted .vimmy-mouth-closed { opacity: 1 !important; }
.vimmy.open .vimmy-body { animation: none !important; }
.vimmy-body {
  width: 68px; height: 68px; position: relative;
  animation: vimmy-idle 2.5s ease-in-out infinite;
}
.vimmy-heart { width: 68px; height: 68px; }
.vimmy-face {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%;
  pointer-events: none;
}

@keyframes vimmy-idle {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  25% { transform: translateY(-6px) rotate(1deg); }
  75% { transform: translateY(-3px) rotate(-1deg); }
}

@keyframes vimmy-jump {
  0% { transform: translateY(0) scale(1, 1); }
  15% { transform: translateY(2px) scale(1.1, 0.85); }
  30% { transform: translateY(-30px) scale(0.9, 1.15); }
  50% { transform: translateY(-35px) scale(0.95, 1.05) rotate(5deg); }
  70% { transform: translateY(-10px) scale(1, 1); }
  85% { transform: translateY(2px) scale(1.05, 0.92); }
  100% { transform: translateY(0) scale(1, 1); }
}
.vimmy-body.jumping {
  animation: vimmy-jump 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.vimmy.wandering {
  transition: bottom 2s cubic-bezier(0.4, 0, 0.2, 1), right 2s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes vimmy-blink {
  0%, 92%, 100% { transform: scaleY(1); }
  95% { transform: scaleY(0.1); }
}

.vimmy-pupils {
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.vimmy-pupils.look-left { transform: translateX(-2px) translateY(-0.5px); }
.vimmy-pupils.look-right { transform: translateX(2.5px) translateY(-0.5px); }
.vimmy-pupils.look-up { transform: translateY(-2.5px); }
.vimmy-pupils.look-down { transform: translateX(0.5px) translateY(2px); }

.vimmy-mouth-closed, .vimmy-mouth-open { transition: opacity 0.25s; }
.vimmy-mouth-open { opacity: 0; }
.vimmy.mouth-open .vimmy-mouth-closed { opacity: 0; }
.vimmy.mouth-open .vimmy-mouth-open { opacity: 1; }

.vimmy-tooltip {
  position: fixed; z-index: 2002;
  background: var(--surface, #fff); border: 1px solid var(--border, rgba(0,0,0,0.07));
  border-radius: 18px 18px 18px 4px;
  padding: 10px 16px; font-size: 13px; font-weight: 600; color: var(--text, #0A0A08);
  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
  animation: vimmy-tooltip-in 0.4s ease-out;
  white-space: nowrap;
  max-width: 260px;
  overflow: hidden;
  text-overflow: ellipsis;
  pointer-events: none;
}
.vimmy-tooltip-fade {
  animation: vimmy-tooltip-out 0.3s ease-in forwards;
}
@keyframes vimmy-tooltip-in {
  from { opacity: 0; transform: translateY(8px) scale(0.9); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes vimmy-tooltip-out {
  from { opacity: 1; transform: translateY(0) scale(1); }
  to { opacity: 0; transform: translateY(4px) scale(0.95); }
}

.buddy-chat {
  position: fixed; bottom: 104px; right: 28px; z-index: 2001;
  width: 380px; max-height: 520px;
  background: var(--surface, #fff); border: 1px solid var(--border, rgba(0,0,0,0.07)); border-radius: 20px;
  box-shadow: 0 12px 48px rgba(0,0,0,0.12);
  display: flex; flex-direction: column;
  animation: buddy-chat-in 0.3s ease-out;
  overflow: hidden;
}
@keyframes buddy-chat-in {
  from { opacity: 0; transform: translateY(16px) scale(0.95); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
.buddy-chat-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px; border-bottom: 1px solid var(--border, rgba(0,0,0,0.07));
  background: linear-gradient(135deg, rgba(176, 181, 255, 0.10) 0%, rgba(108, 205, 239, 0.10) 100%);
}
.buddy-chat-header-left { display: flex; align-items: center; gap: 10px; }
.buddy-chat-header-left svg { width: 28px; height: 28px; }
.buddy-chat-title { font-size: 15px; font-weight: 700; color: var(--text, #0A0A08); }
.buddy-chat-actions { display: flex; align-items: center; gap: 4px; }
.buddy-chat-mute {
  background: none; border: none; cursor: pointer; color: var(--text-muted, #8B8FA0);
  padding: 4px; border-radius: 6px; display: flex; align-items: center; justify-content: center;
  transition: background 0.15s, color 0.15s;
}
.buddy-chat-mute svg { width: 16px; height: 16px; }
.buddy-chat-mute:hover { background: rgba(0,0,0,0.05); color: var(--text, #0A0A08); }
.buddy-chat-close {
  background: none; border: none; cursor: pointer; color: var(--text-muted, #8B8FA0);
  font-size: 20px; padding: 4px; line-height: 1; border-radius: 6px;
  transition: background 0.15s;
}
.buddy-chat-close:hover { background: rgba(0,0,0,0.05); }
.buddy-chat-messages {
  flex: 1; overflow-y: auto; padding: 16px 20px;
  display: flex; flex-direction: column; gap: 12px;
  min-height: 200px; max-height: 340px;
}
.buddy-msg {
  max-width: 90%; padding: 10px 14px; border-radius: 14px;
  font-size: 13px; line-height: 1.55;
}
.buddy-msg.bot {
  background: rgba(108, 205, 239, 0.10); color: var(--text, #0A0A08); align-self: flex-start;
  border-bottom-left-radius: 4px;
}
.buddy-msg.bot a { color: #10ABE4; font-weight: 500; }
.buddy-msg.user {
  background: linear-gradient(135deg, #B0B5FF 0%, #10ABE4 100%);
  color: #fff; align-self: flex-end;
  border-bottom-right-radius: 4px;
  box-shadow: 0 1px 2px rgba(16, 171, 228, 0.18);
}
.buddy-msg.thinking {
  display: flex; gap: 4px; padding: 12px 18px;
}
.buddy-msg.thinking .dot {
  width: 6px; height: 6px; border-radius: 50%; background: var(--vim-cyan, #6CCDEF);
  animation: buddy-think 1.2s ease-in-out infinite;
}
.buddy-msg.thinking .dot:nth-child(2) { animation-delay: 0.15s; }
.buddy-msg.thinking .dot:nth-child(3) { animation-delay: 0.3s; }
@keyframes buddy-think {
  0%, 80%, 100% { opacity: 0.3; transform: scale(0.8); }
  40% { opacity: 1; transform: scale(1.1); }
}
.buddy-chips {
  display: flex; flex-wrap: wrap; gap: 6px; padding: 0 20px 12px;
}
.buddy-chip {
  background: rgba(108, 205, 239, 0.10);
  border: 1px solid rgba(16, 171, 228, 0.25);
  border-radius: 9999px; padding: 5px 12px; font-size: 12px;
  color: #10ABE4; font-weight: 600; cursor: pointer;
  transition: background 200ms cubic-bezier(0.4,0,0.2,1),
              border-color 200ms cubic-bezier(0.4,0,0.2,1),
              transform 200ms cubic-bezier(0.4,0,0.2,1);
}
.buddy-chip:hover {
  background: rgba(108, 205, 239, 0.18);
  border-color: rgba(16, 171, 228, 0.50);
  transform: translateY(-1px);
}
.buddy-input-wrap {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 16px; border-top: 1px solid var(--border, rgba(0,0,0,0.07));
}
.buddy-input {
  flex: 1; border: none; outline: none; font-size: 13px;
  font-family: inherit; color: var(--text, #0A0A08); background: transparent;
}
.buddy-input::placeholder { color: var(--text-muted, #8B8FA0); }
.buddy-send {
  background: linear-gradient(135deg, #B0B5FF 0%, #10ABE4 100%);
  border: none; cursor: pointer;
  width: 32px; height: 32px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  transition: transform 200ms cubic-bezier(0.4,0,0.2,1),
              box-shadow 200ms cubic-bezier(0.4,0,0.2,1),
              filter 200ms cubic-bezier(0.4,0,0.2,1);
  box-shadow: 0 1px 2px rgba(16, 171, 228, 0.20);
  flex-shrink: 0;
}
.buddy-send:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(16, 171, 228, 0.30),
              0 2px 4px rgba(176, 181, 255, 0.20);
  filter: brightness(1.04);
}

@media (max-width: 480px) {
  .buddy-chat { width: calc(100vw - 24px); right: 12px; bottom: 92px; }
  .vimmy { bottom: 16px; right: 16px; }
}