/* Matrix web tools: styles shared by the "Text and data" family (tools whose content JSON has
   "kind": "text"). Linked by scripts/tools-pages.mjs after tools.css; extend additively. */
.text-intake { display: grid; gap: var(--matrix-space-8); }
.text-intake label { font-weight: 600; }
.matrix-ui .text-input, .matrix-ui .text-output { font-family: var(--matrix-font-mono); font-size: 0.9375rem; line-height: 1.5; tab-size: 4; width: 100%; min-height: 220px; resize: vertical; box-sizing: border-box; white-space: pre; overflow: auto; }
.text-output { min-height: 260px; background: var(--matrix-surface); }
.dropzone--compact { margin-top: var(--matrix-space-12); grid-auto-flow: column; justify-content: start; align-items: center; padding: var(--matrix-space-12) var(--matrix-space-16); text-align: left; }
.dropzone--compact p { font-size: var(--matrix-type-caption); }
.text-result-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--matrix-space-12); margin-top: var(--matrix-space-12); }
.text-result-actions .download { background: var(--matrix-brand); color: var(--matrix-on-brand); border-color: transparent; }
.text-result-actions .download .matrix-muted { color: inherit; } /* no opacity: keeps 4.5:1 on the brand colour */
.text-note { margin: var(--matrix-space-8) 0 0; font-size: var(--matrix-type-caption); }
@media (max-width: 480px) {
  .dropzone--compact { grid-auto-flow: row; justify-items: start; }
}