/* URL Encoder / Decoder — a toolbar bar (mode, scope, Swap, Clear), then the
   input and output panes side by side as two cards; the output card ends with
   the status caption (layout from styles/components/form.css). The text areas
   are styles/components/editor.css panes; the scope uses form.css's
   inline-field. */

textarea.ue-area {
  min-height: 44vh;
}
.ue-status {
  font-family: var(--mono);
  overflow-wrap: anywhere;
}

@media (max-width: 640px) {
  /* Side-by-side height doubles when the panes stack; trim it on a phone. */
  textarea.ue-area { min-height: 30vh; }
}
