.upa-panel { display: grid; gap: 1rem; min-width: 0; }
.upa-panel[hidden], .upa-preview[hidden] { display: none !important; }
.upa-preview { position: relative; max-width: 100%; overflow: auto; border: 1px solid var(--escarcha-borde, var(--borde)); border-radius: .75rem; }
.upa-preview canvas { display: block; max-width: 100%; height: auto; touch-action: none; cursor: crosshair; }
.upa-fields { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
.upa-list { display: grid; gap: .5rem; padding: 0; list-style: none; }
.upa-list li { display: flex; justify-content: space-between; align-items: center; gap: .75rem; }
.upa-output { width: 100%; min-height: 420px; border: 0; }
.upa-controls { display: flex; align-items: center; flex-wrap: wrap; gap: .75rem; }
.upa-json { width: 100%; min-height: 8rem; font-family: var(--font-mono, monospace); }
@media (max-width: 480px) { .upa-output { min-height: 300px; } .upa-controls > button { flex-grow: 1; } }