body {
      margin: 0;
      padding: 0;
      background: linear-gradient(to bottom, #ffe6f0, #fff);
      font-family: 'Comic Sans MS', cursive;
      color: #ff69b4;
      text-align: center;
      overflow-x: hidden;
    }

    @keyframes fadeIn {
      from { opacity: 0; }
      to { opacity: 1; }
    }

    @keyframes floatHearts {
      0% { transform: translateY(0); opacity: 1; }
      100% { transform: translateY(-600px); opacity: 0; }
    }

    .carta, .propuesta, .pregunta {
      background-color: rgba(255, 240, 245, 0.95);
      border: 2px solid #ffb6c1;
      border-radius: 20px;
      padding: 30px;
      margin: 50px auto;
      width: 80%;
      max-width: 600px;
      box-shadow: 0 0 20px pink;
      animation: fadeIn 2s ease;
    }

    h1, h2 {
      font-size: 32px;
      color: #c71585;
    }

    p {
      font-size: 20px;
      margin-bottom: 20px;
    }

    .kitty-img {
      width: 150px;
      margin-top: 20px;
      animation: bounce 2s infinite;
    }

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

    .heart {
      position: absolute;
      width: 20px;
      height: 20px;
     /* background: url('https://i.imgur.com/OuU4hHh.png') no-repeat center center; */
      background-size: contain;
      animation: floatHearts 8s linear infinite;
      opacity: 0.8;
    }

    .heart:nth-child(1) { left: 10%; animation-delay: 0s; }
    .heart:nth-child(2) { left: 30%; animation-delay: 2s; }
    .heart:nth-child(3) { left: 50%; animation-delay: 4s; }
    .heart:nth-child(4) { left: 70%; animation-delay: 1s; }
    .heart:nth-child(5) { left: 90%; animation-delay: 3s; }

    .anillo-img {
      width: 80px;
      margin-top: 15px;
      animation: pulse 1.5s infinite;
    }

    @keyframes pulse {
      0% { transform: scale(1); }
      50% { transform: scale(1.1); }
      100% { transform: scale(1); }
    }

    .btn {
      font-size: 18px;
      background-color: #ff69b4;
      color: white;
      border: none;
      border-radius: 10px;
      padding: 10px 20px;
      margin: 10px;
      cursor: pointer;
      transition: background-color 0.3s ease;
    }

    .btn:hover {
      background-color: #e055a0;
    }

    .respuesta {
      display: none;
      font-size: 22px;
      margin-top: 20px;
      color: #d63384;
    }

    .respuesta img {
      width: 180px;
      margin-top: 15px;
      border-radius: 15px;
    }