.htmltext-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:24px 0}
.htmltext-grid>div{min-width:0}
.htmltext-grid label{display:block;margin-bottom:8px;font-weight:600}
.htmltext-grid textarea{display:block;width:100%;min-height:300px;padding:14px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);font:inherit;line-height:1.6;resize:vertical;box-sizing:border-box}
#htmltext-source{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.9rem}
#htmltext-output{background:#fffdf9}
.htmltext-actions{display:flex;flex-wrap:wrap;gap:12px}
.htmltext-actions button,#htmltext-example{min-height:44px;margin:0;padding:11px 16px;border:1px solid var(--line);border-radius:12px;background:#fffaf3;color:var(--ink);font-weight:650;line-height:1.3}
.htmltext-actions button:hover:enabled,#htmltext-example:hover:enabled{background:#f5ecdf;border-color:#c9aa88}
.htmltext-actions button:disabled{background:#ede5dc;color:#75675a;border-color:#ede5dc}
#htmltext-run{background:var(--accent);color:#fff;border-color:var(--accent)}
#htmltext-run:hover:enabled{background:#8a321a;border-color:#8a321a}
#htmltext-run:disabled{background:#ede5dc;color:#75675a;border-color:#ede5dc}
#htmltext-status{min-height:1.6em;margin:14px 0 0}
@media(max-width:650px){.htmltext-grid{grid-template-columns:1fr}.htmltext-grid textarea{min-height:220px}.htmltext-actions button{width:100%}}