/* page2.css — back-of-sheet row. Three columns:
 *   left:   CHARACTER APPEARANCE (textarea)
 *   middle: ARMOR & EQUIPMENT + MARKS nested + NOTES (textarea)
 *   right:  PURPOSE/OBSTACLE/GOALS (nested in one outer box) + CONNECTIONS
 *
 * Slice origin: p2-left-column + p2-middle-column + p2-right-column.
 * Replaces #narrative-top + #narrative-bottom. */

.page2-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sp-md);
  padding: var(--sp-md);
}

@container sheet (min-width: 40rem) {
  .page2-row {
    grid-template-columns: repeat(3, 1fr);
  }
}

.page2-row__column {
  display: flex;
  flex-direction: column;
  gap: var(--sp-md);
}

.page2-row__section {
  display: flex;
  flex-direction: column;
  gap: var(--sp-xs);
  padding: var(--sp-md);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
}

.page2-row__section-label {
  font-size: var(--fs-emphasis);
  font-weight: 700;
  text-transform: uppercase;
  color: var(--color-fg);
  letter-spacing: 0.05em;
  text-align: center;
}

.page2-row__textarea {
  width: 100%;
  min-height: 10rem;
  padding: var(--sp-sm);
  font-family: inherit;
  font-size: var(--fs-body);
  color: var(--color-fg);
  background: var(--color-paper);
  border: 1px solid var(--color-border);
  resize: vertical;
}

/* Middle column: ARMOR & EQUIPMENT (armor list + equipment list) + MARKS nested + NOTES */
.page2-row__armor-equipment {
  display: flex;
  flex-direction: column;
  gap: var(--sp-sm);
  padding: var(--sp-sm);
  background: var(--color-surface-muted);
  border: 1px solid var(--color-border);
}

.page2-row__marks {
  display: flex;
  flex-direction: column;
  gap: var(--sp-xxs);
  padding: var(--sp-sm);
  background: var(--color-surface-muted);
  border: 1px solid var(--color-border);
}

.page2-row__marks-label {
  font-size: var(--fs-caption);
  color: var(--color-fg-muted);
  text-transform: uppercase;
}

.page2-row__marks-input {
  display: flex;
  align-items: center;
  gap: var(--sp-sm);
}

.page2-row__marks-unit {
  font-size: var(--fs-caption);
  color: var(--color-fg-muted);
}

/* Right column: PURPOSE/OBSTACLE/GOALS nested box + CONNECTIONS */
.page2-row__pog {
  display: grid;
  grid-template-rows: auto auto 1fr;
  gap: var(--sp-sm);
  padding: var(--sp-sm);
  background: var(--color-surface-muted);
  border: 1px solid var(--color-border);
}

.page2-row__pog-field {
  display: flex;
  flex-direction: column;
  gap: var(--sp-xxs);
}

.page2-row__pog-label {
  font-size: var(--fs-caption);
  color: var(--color-fg-muted);
  text-transform: uppercase;
  text-align: center;
}

.page2-row__pog-textarea {
  min-height: 3rem;
  padding: var(--sp-xs) var(--sp-sm);
  font-family: inherit;
  font-size: var(--fs-body);
  color: var(--color-fg);
  background: var(--color-paper);
  border: 1px solid var(--color-border);
  resize: vertical;
}