.game-family-request-state {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 13px;
  border: 1px solid #5c4c68;
  border-radius: 10px;
  background: #211b26;
  color: #d8ccdc;
}
.game-family-request-state strong {
  color: #e5c6f4;
  font: 700 10px 'DM Mono';
  text-transform: uppercase;
}
.game-family-request-state span { font-size: 12px; }
.game-family-request-state.is-failed,
.game-family-request-state.is-failed_before {
  border-color: #80504f;
  background: #2a1c1d;
}
.game-family-preview {
  display: grid;
  gap: 13px;
  padding: 18px;
  border: 1px solid #725389;
  border-radius: 14px;
  background: linear-gradient(145deg, #231c29, #18191c 72%);
}
.game-family-preview > .game-family-section-title { margin: 0; }
.game-family-preview > .game-family-section-title > div {
  display: grid;
  gap: 3px;
}
.game-family-preview > p,
.game-family-preview-card > p {
  margin: 0;
  color: #cac1cd;
  line-height: 1.5;
}
.game-family-preview-card {
  display: grid;
  gap: 14px;
  padding: 17px;
  border: 1px solid #55435f;
  border-left: 3px solid #c280e3;
  border-radius: 12px;
  background: #1a191d;
}
.game-family-preview-card > header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}
.game-family-preview-card h3,
.game-family-preview-card h4,
.game-family-preview-card p { margin: 0; }
.game-family-preview-card > header > span {
  height: max-content;
  padding: 5px 8px;
  border-radius: 999px;
  background: #30243a;
  color: #dfc4ef;
  font: 700 9px 'DM Mono';
  text-transform: uppercase;
}
.game-family-preview-card form,
.game-family-preview-card section {
  display: grid;
  gap: 12px;
}
.game-family-preview-card form > label {
  display: grid;
  gap: 6px;
  color: #d9c5e6;
  font: 700 10px 'DM Mono';
  text-transform: uppercase;
}
.game-family-preview-card input,
.game-family-preview-card textarea {
  width: 100%;
  box-sizing: border-box;
}
.game-family-preview-card textarea { min-height: 68px; }
.game-family-uncertain {
  padding: 11px;
  border: 1px dashed #5c4e63;
  border-radius: 10px;
}
.game-family-uncertain summary {
  color: #d3bfdf;
  font-weight: 800;
  cursor: pointer;
}
.game-family-uncertain .game-family-member { margin-top: 8px; }
.game-family-sage-verification {
  padding: 12px;
  border: 1px solid #765c83;
  border-radius: 10px;
  background: #251e2a;
}
.game-family-sage-verification > p:last-of-type,
.game-family-sage-verification li {
  color: #ded6e1;
  line-height: 1.5;
}
.game-family-sage-verification ul {
  margin: 0;
  padding-left: 18px;
}
@media (max-width: 700px) {
  .game-family-preview { padding: 14px; }
  .game-family-preview-card { padding: 13px; }
  .game-family-preview-card > header,
  .game-family-request-state { display: grid; }
}
