@keyframes shake {
  0% { transform: translate(1px, 1px); }
  10% { transform: translate(-1px, -2px); }
  20% { transform: translate(-3px, 0px); }
  30% { transform: translate(3px, 2px); }
  40% { transform: translate(1px, -1px); }
  50% { transform: translate(-1px, 2px); }
  60% { transform: translate(-3px, 1px); }
  70% { transform: translate(3px, 1px); }
  80% { transform: translate(-1px, -1px); }
  90% { transform: translate(1px, 2px); }
  100% { transform: translate(1px, -2px); }
}

.shake {
  animation: shake 0.5s;
}




:root {
      --nostr-purple: #7F00FF;
      --nostr-purple-dark: #4B0082;  
      --nostr-text: #E0DAF5;
      --bitcoin-orange: #f7931a;
      --pressed-button: #2d005a;
    }

    body {
      background-color: var(--nostr-purple-dark);
      color: var(--nostr-text);
    }
    .bg-npurple { background-color: var(--nostr-purple); }
    .bg-npurple-dark { background-color: var(--nostr-purple-dark); }
    .text-ntext { color: var(--nostr-text); }
    .input-npurple {
      background-color: var(--nostr-purple-dark);
      border: 1px solid var(--nostr-purple);
      color: var(--nostr-text);
    }
    .button-npurple {
      background-color: var(--nostr-purple );
      color: var(--nostr-text);
      box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);
    }
    .button-npurple:hover {
      background-color: var(--pressed-button);
      box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
    }
    .chat-window {
      background-color: var(--nostr-purple-dark);
      border-radius: 10px;
      padding: 15px;
      max-width: 550px;
      width: 100%;
      height: 650px;
      overflow-y: auto;
      box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
      display: flex;
      flex-direction: column;
    }
    .message .text {
      background-color: var(--nostr-purple);
      color: var(--nostr-text);
    }
    .modal-backdrop {
      background: rgba(0,0,0,0.7);
    }