
.pog-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
  gap: 2rem;
  margin: 1.5rem 0;
}
.pog-form fieldset,
.pog-output-wrap {
  border: 1px solid #dcdcde;
  border-radius: 8px;
  padding: 1rem 1.25rem 1.25rem;
  margin: 0 0 1.25rem;
  background: #fff;
}
.pog-intro { margin-bottom: 1rem; }
.pog-form legend { font-weight: 600; padding: 0 .25rem; }
.pog-grid { display: grid; gap: 1rem; }
.pog-grid.two-col { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pog-full { grid-column: 1 / -1; }
.pog-form label { display: block; font-weight: 600; }
.pog-form input[type="text"],
.pog-form input[type="email"],
.pog-form select,
.pog-form textarea {
  display: block;
  width: 100%;
  margin-top: .35rem;
  padding: .7rem .8rem;
  border: 1px solid #c3c4c7;
  border-radius: 6px;
  box-sizing: border-box;
  font: inherit;
}
.pog-form textarea { resize: vertical; }
.pog-check-grid { display: grid; gap: .5rem; margin: .75rem 0 1rem; }
.pog-check { font-weight: 400 !important; }
.pog-check input { margin-right: .5rem; }
.pog-help, .pog-note { color: #50575e; }
.pog-radio-row { display: flex; gap: 1rem; flex-wrap: wrap; }
.pog-radio-row label { font-weight: 400 !important; }
.pog-actions { display: flex; gap: .75rem; flex-wrap: wrap; margin: 1rem 0 0; }
.pog-preview {
  white-space: pre-wrap;
  min-height: 320px;
  padding: 1rem;
  background: #f6f7f7;
  border-radius: 6px;
  border: 1px solid #dcdcde;
  overflow: auto;
}
.pog-message { min-height: 1.5em; margin-bottom: .75rem; font-weight: 600; }
.pog-message.is-success { color: #0a7a2f; }
.pog-message.is-error { color: #b32d2e; }
@media (max-width: 900px) {
  .pog-wrap { grid-template-columns: 1fr; }
  .pog-grid.two-col { grid-template-columns: 1fr; }
}
