.spoiler-box {
  margin: 1em 0;
  border-radius: 6px;
  overflow: hidden;
  background-color: rgba(255, 255, 255, 0.1); /* semi-transparent for any background */
  border: 1px solid rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(3px); /* optional "glass" effect */
  color: inherit;
}

.spoiler-header {
  padding: 12px 16px;
  font-weight: bold;
  cursor: pointer;
  user-select: none;
  background-color: rgba(0, 0, 0, 0.05);
  color: inherit;
  position: relative;
}

.spoiler-header::after {
  content: '▼';
  position: absolute;
  right: 16px;
  transition: transform 0.2s ease;
}

.spoiler-box.open .spoiler-header::after {
  transform: rotate(180deg);
}

.spoiler-content {
  display: none;
  padding: 16px;
  background-color: rgba(255, 255, 255, 0.05);
  color: inherit;
}

.spoiler-box.open .spoiler-content {
  display: block;
}