.memory-panel {
  margin-top: 20px;
  overflow-x: auto;
}

.memory-header {
  display: grid;
  gap: 18px;
  justify-items: center;
  margin-bottom: 22px;
}

#solution {
  display: block;
  max-width: min(100%, 620px);
  border-radius: 8px;
  box-shadow: 0 18px 42px rgba(34, 55, 29, 0.16);
}

.memory-status {
  min-height: 24px;
  font-weight: 700;
  color: #2f6821;
}

.main_table {
  --memory-card-size: clamp(34px, 8vw, 74px);
  border-collapse: collapse;
  border-spacing: 0;
  table-layout: fixed;
  width: max-content;
  max-width: 100%;
}

.main_table td {
  width: var(--memory-card-size);
  height: var(--memory-card-size);
  padding: 0;
  border: 0;
  line-height: 0;
}

.placeholder {
  display: block;
  aspect-ratio: 1;
  width: var(--memory-card-size);
  height: var(--memory-card-size);
  margin: 0;
  border-radius: 0;
  border: 1px solid rgba(61, 91, 48, 0.18);
  object-fit: cover;
  box-shadow: none;
  background: rgba(255, 255, 255, 0.92);
  transition: box-shadow 120ms ease;
}

.placeholder:hover {
  box-shadow: inset 0 0 0 2px rgba(255, 244, 198, 0.65);
}
