/* ------------------------------------------------------------------ *\
   Lienzo · Generador de degradados CSS

   Solo lo que NO existe en /css/codigo-web.css: el tamaño compacto de
   la vista previa fija (position: sticky) en móvil.
\* ------------------------------------------------------------------ */

/* 1. Vista previa fija: tamaño compacto en móvil ------------------------ *\

   El mecanismo (activado por .taller--vista-fija, ya puesto en el HTML
   de esta página) vive en /css/codigo-web.css, sección 7: lo comparten
   todos los generadores con el mismo problema (columna de controles más
   alta que la de vista previa: medido en desktop, taller__main 695px
   contra sidebar 987px, +292px de diferencia). Aquí solo el tamaño de
   la vista previa en móvil, propio de esta página.

   Este es el caso más simple de todos: .lienzo-previa no tiene ningún
   hijo con tamaño propio que recortar. degradados.js pinta el degradado
   como "background" directamente sobre este div (sin contenido dentro),
   así que no hay riesgo de que overflow: hidden corte nada. Por la misma
   razón el padding tampoco importa: con background-origin en su valor
   por defecto (padding-box) y sin nada que separar del borde, el
   degradado cubre igual toda la caja sea cual sea el padding, así que se
   deja el heredado (no hace falta tocarlo aquí) y solo se ajusta el
   alto mínimo.
\* ------------------------------------------------------------------ */

@media (max-width: 1020px) {
  /* Medido en el navegador, de 320 a 1020px de ancho de ventana, con
     .taller--vista-fija puesto:
     clamp(180px, 38vw, 220px) da un piso de 180px hasta ~474px de
     ancho, sube en línea recta hasta ~579px y de ahí en adelante queda
     plano en 220px: el mismo alto que el sitio ya usa como "compacto"
     en /css/codigo-web.css, sección 6, para el modo sin vista fija por
     debajo de 620px. Ni el piso ni el techo dependen de ningún
     contenido interior (no lo hay), así que ambos son solo el tamaño
     que se ve bien sin ocupar demasiado alto de pantalla.

     La tarjeta fija completa (cabecera del panel "Vista previa" + esta
     vista previa) mide entre 244px (≥360px de ancho, cabecera en una
     sola línea) y 284px (≥579px de ancho, donde la vista previa llega a
     su techo de 220px); a 320–340px el botón "Degradado aleatorio" hace
     que la cabecera pase a dos líneas y la tarjeta sube a 274px. Con el
     máximo de los tres (284px), los 84px del top donde queda pegada y
     12px de aire salen justo los 380px que la sección 7 ya trae por
     defecto en --alto-vista-fija, así que esta página no lo redefine. */
  .taller--vista-fija .lienzo-previa {
    min-height: clamp(180px, 38vw, 220px);
  }
}
