body {font-family: Arial, sans-serif;
  background-color: #e8edf3;
  margin: 20px;}
h1 {text-align: center;
  color: #183153;
  margin-bottom: 40px;}
#playing-cards {display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 20px;}

.card {width: 180px;
  height: 260px;
  border: 1px solid black;
  border-radius: 10px;
  background-color: white;
  display: flex;
  justify-content: space-between;
  padding: 5px;}

.left {align-self: flex-start;}

.middle {align-self: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 0;
  flex: 1;}

.middle img {width: 100%;
  max-height: 250px;
  object-fit: contain;}

.right {align-self: flex-end;}

.reflection {background-color: white;
  max-width: 850px;
  margin: 50px auto;
  padding: 25px;
  border: 1px solid #cccccc;
  border-radius: 10px;}

h2 {text-align: center;
  color: #183153;}

h3 {color: #245b9e;}

p {line-height: 1.6;}