body{
  font-family: "Comic Sans MS", sans-serif;
  margin:0;
  background:white;
}

/* 🖼 LOGO */
#logo{
  text-align:center;
  padding:15px;
}

#logo img{
  width:110px;
  image-rendering: pixelated;
}

#logo h1{
  margin:5px;
  font-size:28px;
  letter-spacing:2px;
}

/* 🧭 NAV */
header{
  border-bottom:3px solid black;
  padding:10px;
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:6px;
}

/* 🔘 BOTONES BLANCOS */
button{
  border:2px solid black;
  background:white;
  font-weight:bold;
  padding:5px 10px;
  cursor:pointer;
}

button:hover{
  background:#f2f2f2;
  transform:scale(1.05);
}

/* 📦 CONTENIDO */
#app{
  padding:15px;
}

.card{
  border:3px solid black;
  box-shadow:4px 4px 0 black;
  margin:10px 0;
  padding:10px;
}