/* Editable title + trailing .more-btn, sharing one hairline underline that
   spans the whole row (including under the button) rather than stopping
   short under the title field alone. See GitHub issue #175. */

.title-row {
  display: flex;
  align-items: flex-end;
  gap: var(--space-3);
  border-bottom: 1px solid var(--border);
  margin-bottom: var(--space-3);
}

.title-row-field {
  flex: 1;
  min-width: 0;
  font-family: var(--font-content);
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--text);
  border: none;
  outline: none;
  background: none;
  padding: var(--space-2) 0;
  resize: none;
  overflow: hidden;
}

/* Matches .title-row-field's own padding so the button's baseline lines up
   with the title's, regardless of how tall the title grows. */
.title-row .more-menu-wrapper {
  padding-bottom: var(--space-2);
}