/* Markdown table generator — tool UI. Chrome from shared.css/utilities.css. */
.mt-toolbar { max-width: 860px; margin: 0 auto; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.mt-tbtn { font: inherit; font-weight: 600; font-size: .85rem; padding: 8px 14px; border-radius: 999px; cursor: pointer; background: var(--surface2); color: var(--text); border: 1px solid var(--border); transition: all .12s ease; }
.mt-tbtn:hover { border-color: var(--accent-light); color: var(--accent); }
.mt-dims { font-size: .82rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.mt-spacer { flex: 1; }

.mt-grid-wrap { max-width: 860px; margin: 12px auto 0; overflow-x: auto; }
table.mt-grid { border-collapse: separate; border-spacing: 6px; }
.mt-grid td { padding: 0; }
.mt-cell { min-width: 90px; font: inherit; font-size: .9rem; padding: 8px 10px; border-radius: var(--radius); border: 1px solid var(--border); background: var(--surface); color: var(--text); }
.mt-cell:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-bg); }
.mt-cell.header { font-weight: 700; background: var(--surface2); }
.mt-headcell { display: flex; flex-direction: column; gap: 4px; }
.mt-align { display: flex; gap: 3px; }
.mt-align button { flex: 1; font: inherit; font-size: .72rem; padding: 3px 0; border-radius: 6px; cursor: pointer; background: var(--surface); border: 1px solid var(--border); color: var(--muted); }
.mt-align button.active { background: var(--accent); color: #fff; border-color: var(--accent); }
.mt-rm { width: 26px; height: 26px; border-radius: 6px; border: 1px solid var(--border); background: var(--surface); color: var(--muted); cursor: pointer; font-size: 1rem; line-height: 1; }
.mt-rm:hover { border-color: var(--accent); color: var(--accent); }
.mt-corner { width: 26px; }

.mt-out { max-width: 860px; margin: 22px auto 0; }
.mt-out-head, .mt-preview-head { display: flex; align-items: center; justify-content: space-between; margin: 0 0 6px; }
.mt-out-head span, .mt-preview-head span { font-size: .78rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); }
.mt-preview-head { margin-top: 18px; }
.mt-code { margin: 0; padding: 16px; overflow-x: auto; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); font-family: var(--mono); font-size: .88rem; line-height: 1.7; color: var(--text); white-space: pre; }

.mt-preview { overflow-x: auto; border: 1px solid var(--border); border-radius: var(--radius); }
.mt-preview table { border-collapse: collapse; width: 100%; }
.mt-preview th, .mt-preview td { border: 1px solid var(--border); padding: 8px 12px; font-size: .9rem; }
.mt-preview th { background: var(--surface2); font-weight: 700; }
.mt-preview tr:nth-child(even) td { background: var(--surface2); }