* { box-sizing: border-box; }

body {
  margin: 0;
  color: #333;
  background: #fff;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 1.6;
}

main {
  width: min(100% - 40px, 1000px);
  margin: 64px auto;
}

h1 {
  margin: 0 0 24px;
  font-size: 36px;
  line-height: 1.2;
  text-align: center;
}

table {
  width: 100%;
  margin-bottom: 32px;
  border-collapse: collapse;
}

th, td {
  padding: 14px 16px;
  border: 2px solid #111;
  text-align: left;
  vertical-align: middle;
}

.pack-table th:first-child { width: 160px; }
.pack-cell span { display: block; }
.pack-cell img {
  display: block;
  width: 120px;
  height: 120px;
  margin: 20px auto 4px;
  object-fit: contain;
}

.probability-table th:nth-child(2),
.probability-table td:nth-child(2) { width: 90px; }

.footnote {
  margin: 0 0 16px;
  font-style: italic;
}

@media (max-width: 600px) {
  main { width: calc(100% - 24px); margin: 32px auto; }
  h1 { font-size: 30px; }
  body { font-size: 14px; }
  th, td { padding: 10px; }
  .pack-table th:first-child { width: 110px; }
  .pack-cell img { width: 85px; height: 100px; }
  .probability-table th:nth-child(2),
  .probability-table td:nth-child(2) { width: auto; }
}