#template-app { max-width: 850px; }
#template-app label { display: block; margin-block: 1rem; }
#template-app input:not([type=checkbox]), #template-app select, #template-app textarea { display: block; width: 100%; max-width: 100%; padding: .6rem; font: inherit; }
#template-app button { font: inherit; padding: .6rem; margin-block: .3rem; max-width: 100%; white-space: normal; }
#template-app fieldset { min-width: 0; }
#template-app dialog { width: min(800px, calc(100% - 32px)); max-height: 85vh; overflow: auto; padding: 1.2rem; }
#template-app .error { color: #8a2525; border-left: 3px solid; padding: .8rem; }
.structure-preview { display: grid; grid-template-columns: repeat(auto-fit,minmax(120px,1fr)); gap: 16px; margin-block: 1rem; }
.structure-preview figure { margin: 0; min-width: 0; font-size: .8rem; }
.structure-preview svg { display: block; width: 100%; max-height: 250px; }
#template-result { padding-block: 1rem; }
#template-result a { display: inline-block; padding-block: .4rem; }