/* Forms and verb grids. A verb button wears the tint of the state it moves
 * the record to (BRAND-002 color-is-state applied to verbs); the label
 * answers the verb's question and the hint is always visible — tooltips
 * don't reach a phone. Retire verbs (.verb-danger) sit last in the grid. */
.form-stack {
  display: grid;
  gap: 10px;
}

.field {
  display: grid;
  gap: 6px;
}

.field-label {
  color: var(--ink-soft);
  font-family: var(--font-label);
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.input {
  width: 100%;
  min-height: 44px;
  padding: 10px 11px;
  color: var(--ink);
  background: var(--paper-bright);
  border: 1px solid rgba(27, 32, 43, .24);
  border-radius: var(--radius-md);
  transition: border-color .15s ease;
}

.input:focus {
  border-color: rgba(150, 64, 47, .55);
  outline: none;
}

textarea.input {
  min-height: 86px;
  resize: vertical;
}

.submit-button {
  min-height: 44px;
  padding: 10px 16px;
  color: var(--paper-bright);
  background: var(--brick);
  border: none;
  border-radius: 999px;
  cursor: pointer;
  font-family: var(--font-label);
  font-size: .74rem;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
  transition: background .15s ease, transform .1s ease;
}

.submit-button:hover {
  background: var(--brick-deep);
}

.submit-good {
  background: var(--green);
  border-color: var(--green);
}

.submit-gold {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--ink);
}

.submit-teal {
  background: var(--teal);
  border-color: var(--teal);
}

.artifact-actions {
  display: grid;
  gap: 9px;
  margin-top: 12px;
}

.explanation-field {
  display: grid;
  gap: 5px;
}

.explanation-field span {
  color: var(--muted);
  font-family: var(--font-label);
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.explanation-field input {
  min-height: 42px;
  padding: 9px 10px;
  background: var(--paper-bright);
  border: 1px solid rgba(23, 23, 23, .25);
  border-radius: var(--radius-sm);
}

.action-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.verb-button {
  min-height: 48px;
  padding: 8px 11px;
  color: var(--ink);
  background: rgba(255, 252, 243, .55);
  border: 1px solid rgba(27, 32, 43, .22);
  border-radius: var(--radius-md);
  cursor: pointer;
  text-align: left;
  transition: border-color .15s ease, background .15s ease;
}

.verb-button:hover {
  border-color: rgba(27, 32, 43, .45);
}

.verb-button:active,
.submit-button:active {
  transform: translateY(1px);
}

.verb-label {
  display: block;
  font-family: var(--font-label);
  font-size: .76rem;
  font-weight: 900;
  letter-spacing: .045em;
  line-height: 1.15;
  text-transform: uppercase;
}

.verb-hint {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: .76rem;
  line-height: 1.2;
}

/* destination-state tints: green=archived, gold=mattered, teal=acknowledged,
 * amber=snoozed, bronze=committed, red=retired, ink=restore */
.verb-good {
  background: rgba(47, 74, 60, .12);
  border-color: rgba(47, 74, 60, .48);
}

.verb-warm {
  background: rgba(195, 154, 70, .17);
  border-color: rgba(138, 106, 63, .48);
}

.verb-info {
  background: rgba(62, 92, 84, .12);
  border-color: rgba(62, 92, 84, .44);
}

.verb-wait {
  background: rgba(214, 162, 58, .16);
  border-color: rgba(138, 106, 63, .45);
}

.verb-commit {
  background: rgba(138, 106, 63, .14);
  border-color: rgba(138, 106, 63, .48);
}

.verb-danger {
  background: rgba(158, 61, 50, .10);
  border-color: rgba(158, 61, 50, .42);
}

.verb-restore {
  color: var(--paper);
  background: var(--ink);
  border-color: var(--ink);
}

.verb-restore .verb-hint {
  color: rgba(241, 232, 208, .75);
}

@media (min-width: 760px) {
  .action-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}