.p2-partial-toggle {
  border: 1px dashed color-mix(in srgb, var(--gold) 62%, var(--card-shadow));
  border-radius: 10px;
  padding: 9px 10px;
  background: color-mix(in srgb, var(--gold) 8%, var(--card));
}

.cell.p2-own-view {
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--gold) 42%, transparent), 0 2px 0 var(--cell-shadow);
}

.cell.p2-hidden-view {
  color: var(--ink-soft);
  background: repeating-linear-gradient(135deg, var(--board), var(--board) 7px, var(--card) 7px, var(--card) 14px);
  font-size: 17px;
  cursor: pointer;
  opacity: .86;
}

.p2-communicate {
  margin: 10px 14px;
  padding: 12px;
  border: 1px solid var(--card-shadow);
  border-radius: 14px;
  background: var(--card);
  box-shadow: 0 3px 12px rgba(80, 55, 35, .06);
}

.p2-view-note {
  display: grid;
  gap: 3px;
  margin-bottom: 10px;
  font-size: 13px;
}

.p2-view-note span,
.p2-description span {
  color: var(--ink-soft);
}

.p2-description-list {
  display: grid;
  gap: 7px;
  max-height: 150px;
  overflow-y: auto;
  margin-bottom: 10px;
}

.p2-description {
  display: grid;
  gap: 2px;
  padding: 8px 9px;
  border-radius: 9px;
  background: var(--bg);
  font-size: 13px;
}

.p2-description-form {
  display: grid;
  gap: 8px;
}

@media (min-width: 400px) {
  .p2-description-form {
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  }
  .p2-description-form .p1b-btn {
    grid-column: 1 / -1;
  }
}