:root { --pico-font-size: 95%; }
nav.top { border-bottom: 1px solid var(--pico-muted-border-color); margin-bottom: 1.5rem; }
nav.top ul { margin: 0; }
.muted { color: var(--pico-muted-color); }
.tag { display: inline-block; padding: .1rem .5rem; border-radius: .5rem; font-size: .8em; background: var(--pico-muted-border-color); }
.tag.ok { background: #d1fae5; color: #065f46; }
.tag.warn { background: #fef3c7; color: #92400e; }
.tag.bad { background: #fee2e2; color: #991b1b; }
.para { padding: .5rem .75rem; border-left: 3px solid transparent; margin-bottom: .25rem; }
.para.changed { border-left-color: #2563eb; background: rgba(37,99,235,.05); }
.para .style { font-size: .7em; color: var(--pico-muted-color); }
.slot { display: block; margin: .15rem 0; }
.slot input, .slot textarea { margin-bottom: .25rem; font-size: .9em; }
.slot.bold input, .slot.bold textarea { font-weight: 600; }
.slot .warn-terms { font-size: .75em; color: #92400e; }
.block { border: 1px dashed var(--pico-muted-border-color); padding: .5rem .75rem; margin: .5rem 0; }
.block .item { display: grid; grid-template-columns: 1fr auto; gap: .5rem; align-items: start; }
.actions { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; }
iframe.preview { width: 100%; height: 75vh; border: 1px solid var(--pico-muted-border-color); }
/* revisión: la vista previa acompaña al formulario mientras se hace scroll (solo a dos columnas) */
.review-grid { align-items: start; }
@media (min-width: 992px) {
  .preview-col { position: sticky; top: 1rem; }
  .preview-col h3 { margin-bottom: .5rem; }
  .preview-col iframe.preview { height: calc(100vh - 5rem); }
}
table td, table th { vertical-align: top; }
form.inline { display: inline; }

details.section { border: 1px solid var(--pico-muted-border-color); border-radius: .5rem; padding: .25rem .75rem; margin: .5rem 0; }
details.section > summary { cursor: pointer; font-weight: 600; }
details.section > summary .title { margin-right: .5rem; }
details.section.depth-1 { margin-left: 1rem; }
details.section.depth-2 { margin-left: 2rem; }
.regen { display: flex; gap: .5rem; margin: .5rem 0 .75rem; }
.regen input { margin: 0; }
.sec-row { display: flex; justify-content: space-between; align-items: center; gap: .5rem; padding: .25rem 0; border-bottom: 1px dashed var(--pico-muted-border-color); flex-wrap: wrap; }
.sec-row.depth-1 { margin-left: 1.5rem; } .sec-row.depth-2 { margin-left: 3rem; }
.sec-row form button { padding: .15rem .6rem; font-size: .8em; margin: 0; }
.original { white-space: pre-wrap; font-size: .85em; max-height: 22rem; overflow: auto; background: var(--pico-card-background-color); border: 1px solid var(--pico-muted-border-color); border-radius: .5rem; padding: .5rem .75rem; }